@charset "utf-8";
.title_area { position: relative;  font-size: 165%; font-weight: 700; text-align: center; padding-bottom: 15px; color:#222}
.title_area button{position: absolute; left:15px; top:0}
/* .btn_back { color:#d3d9e1;} */
.btn_back { color:#3b4045;}

.title_area button.btn_search, .title_area button.btn_close{ left:auto; right:15px;}
.title_area button.btn_close {position: relative; font-weight: 400; font-size: 16px; color:#666; padding-top: 5px;}

.item_box button.btn_close {padding:0; width:25px; height:25px; }
.item_box button.btn_close i{display: none;}
.item_box button.btn_close:before {content: ''; position: absolute; width:20px; height: 2px; background-color: #666; right:0; top:10px; transform: rotate(45deg);}
.item_box button.btn_close:after {content: ''; position: absolute; width:20px; height: 2px; background-color: #666; right:0; top:10px; transform: rotate(-45deg);}

.con_tit {display: block; text-align: center; padding-top: 10px; margin-bottom: -10px; margin-top: 10px;}
.con_tit h4{font-size: 150%; font-weight: 700; color:#000; letter-spacing: -0.05em; }

/* 위치 검색박스 */
.way_search_box {display: block; padding-bottom: 15px;}
.way_search_box .search_box{border-radius: 35px; border: 1px solid var(--border_color);padding:0px 20px;  position: relative;}
.search_box > div { display: flex; align-items: center;  position: relative; padding: 5px 0;}
.search_box > .Waypoint_arrival:after {content: ''; position: absolute; top:0; left:50px; right:0; border-top: 1px solid var(--border_color); }
.search_box > div > input[type="text"]{border: none; font-size: 110%; font-weight: 500; padding-left: 20px; padding-right: 50px;}
.search_box > div > input[type="text"][readonly] {background-color: #fff !important;}
.search_box > div > input[type="password"]{border: none; font-size: 110%; font-weight: 500; padding-left: 20px; padding-right: 50px;}
.search_box .way_position {position:relative;  height: 40px; flex: 1 0 40px; width: 40px;  border-radius: 50%; color:#666; text-align: center; }
.search_box .way_position span {position:absolute; left:-999999px}
.search_box .way_position:before {position: absolute; left:0px; top:0; font-size:17px; font-family:'FontAwesomeS';  height: 40px; width: 40px; line-height: 40px; border-radius: 50%; background-color: var(--bg_gray); }
.search_box .way_position.icon_start:before { content: '\f3c5';}
.search_box .way_position.icon_stop:before { content: '\f002';}
.search_box .way_position.icon_back:before { content: '\f053'; background-color: transparent; font-size: 20px;}
.search_box .place_switch {position:absolute; right:20px; top:calc(50% - 30px)}
.search_box .place_switch button{ display: block; width: 50px; height: 50px; line-height: 50px; background-color: #fff; border-radius: 50%; border: 1px solid var(--border_color); color: var(--default_color); font-size: 18px;}
.search_box .place_switch button i{transform: rotate(-90deg); }

@media only screen and (max-width:450px){
  .way_search_box .search_box{border-radius: 20px;}
}

/* 최근검색 경로 메인 */
.myway_main {display: flex; justify-content: space-between; padding-bottom: 15px; }
.myway_main ul {display: flex;  flex:1 1 auto; margin-right: 10px; overflow: hidden;}
.myway_main ul li{flex:1 1 auto; min-width: 33.3333%; }
.myway_main ul li > a{  display:block; font-size: 95%;}
.myway_main ul li > a span{ text-overflow: ellipsis; white-space:nowrap;  overflow: hidden; display:block}
.myway_main > a{flex: 0 0 70px;}

/*  메인 예약 바로가기 */
.main_goto {display: block;  position: relative; padding-top: 20px;}
.main_goto h3 { text-align: left; padding-left: 10px; }
.main_goto ul li {display: block; margin: 10px 0px;}
.main_goto ul li a{display: block; background-color: #fff; border-radius: 60px; line-height: 90px; padding: 0 30px; position: relative; font-size: 140%; font-weight: 700;  white-space:nowrap; }
.main_goto ul li a.m_icon::before {content: ''; display: inline-block; width:20%; height: 50px; background-repeat: no-repeat; background-size: contain; background-position: center center; vertical-align: middle; margin:0 10% 0 5%;}
.main_goto ul li a.m_icon.icon01::before {background-image: url(/images/mpm/aismart/btr/main/transport_type_icon01.png); }
.main_goto ul li a.m_icon.icon02::before {background-image: url(/images/mpm/aismart/btr/main/transport_type_icon02.png); }
.main_goto ul li a.m_icon.icon03::before {background-image: url(/images/mpm/aismart/btr/main/transport_type_icon03.png); background-size: auto 80%; }
.main_goto ul li a.m_icon.icon04::before {background-image: url(/images/mpm/aismart/btr/main/transport_type_icon04.png); background-size: auto 80%; }
.main_goto ul li a.m_icon.icon05::before {background-image: url(/images/mpm/aismart/btr/main/transport_type_icon05.png); background-size: auto 80%; }


/* 출발지 터치 후 검색옵션 (현위치/지도에서 선택/즐겨찾기) */
.map_option ul {display: flex;  justify-content: space-between;  position: relative; padding-bottom: 15px;}
.map_option ul li{flex:1 1 50%; text-align: center; }
.map_option ul li > button{ white-space:nowrap;  display:flex; align-items: center; justify-content: center; padding: 5px 30px; width: 100%;}
.map_option ul li > button span{ display: block; padding-left: 10px; font-weight: 500; }
.map_option ul li.on > button {color: #fff; background-color: #525a72; border-radius: 25px;}

/* 지도에서 선택 지도영역 */
.map_place {position:absolute; top: 195px; bottom:0; left:0; right:0; overflow: hidden; background-color: #888; min-width: 360px;}
/*.map_place {position:absolute; top: 205px; bottom:0; left:0; right:0; overflow: hidden; background-color: #888; min-width: 360px;} */

.no_data {display: block; text-align: center; padding:30px 20px; font-size: 110%; }
.no_data strong{font-weight: 500;}
.no_data i{color:#a7adb7;}

.btn_go_back {display: block;  text-align: center; border-radius: 30px; background-color: #4b5163; color:#fff !important; padding:10px 20px;}

/* 탬메뉴 */
.tap_menu ul {display: flex;  justify-content: flex-start;  border-top: 1px solid var(--border_color); padding:0 10px; box-shadow: 0 5px 7px rgba(0,0,0, 0.08); background-color: #fff; position: relative;}
.tap_menu ul li{ display: block;  padding-right:3%; padding-left: 3px; }
.tap_menu ul li > a{ white-space:nowrap; display: block;  line-height: 45px; padding: 0 5px; font-weight: 500; color:#777; position: relative;}
.tap_menu ul li.on > a{color:#000}
.tap_menu ul li.on > a:after {content: ''; position: absolute; left:0; right:0; bottom: -1px; height: 3px; background-color:#777; border-radius: 10px;}

.tap_menu.v2 ul {display: flex;  justify-content: flex-start;  border:none; padding:0 20px; box-shadow: none; background-color: #fff; position: relative; padding-bottom: 10px;}

.tap_menu.v2 ul li{ display: block;  padding-right:0; padding: 0px; padding-right: 5px; }
.tap_menu.v2 ul li > a{ background-color: #e6e9ee; display: block; padding: 0 20px; border-radius: 30px;}
.tap_menu.v2 ul li.on > a{color:#fff; background-color: #21252e;}
.tap_menu.v2 ul li.on > a:after {display: none;}



.tab_contents .contents{ display: none;}

.Bookmark{display: block; min-width:30px; height: 30px; position: relative; text-align: left; margin-right: 20px; text-align: center;}
.Bookmark::before{content: '\f005'; position: absolute; left:0px; top:0; font-size:17px; font-family:'FontAwesomeR';  height: 30px; width: 100%; line-height: 30px; border-radius: 50%; color:#777}
.Bookmark.on::before{font-family:'FontAwesomeS'; color:var(--orange)}

/* 최근 검색 목록 */
.recent_place_list {}
.recent_place_list ul li{display: block; position: relative; border-bottom: 1px solid var(--border_color);}
.recent_place_list ul li .item{display: flex; align-items: center; width: 100%; justify-content: space-between;}
.recent_place_list ul li .item a{display: block; overflow: hidden; padding: 20px 20px 20px 60px; position: relative;}
.recent_place_list ul li .item a::before{content: '\f3c5'; position: absolute; left:30px; top:20%; font-size:17px; font-family:'FontAwesomeS';  height: 40px; width: 100%; line-height: 40px; border-radius: 50%; color:#ccc}
.recent_place_list ul li .item a > *{text-overflow: ellipsis; white-space:nowrap;  overflow: hidden; display:block; letter-spacing: -0.05em;}
.recent_place_list ul li .item a strong{font-size: 100%;}
.recent_place_list ul li .item a p{font-size: 90%; color:#666;}

.word_result_list {padding:10px 0; background-color: var(--bg_gray);}
.word_result_list .recent_place_list{background-color: #fff;}
.word_result_list .recent_place_list ul li:last-child{border: none;}


/* 편도 왕복 버튼 영역 */
.search_btn .btn_area{display: flex; width: 100%; justify-content: space-around;  font-size: 110%;}
.search_btn .btn_area button{flex:0 1 25%;}
.search_btn .btn_area .hotel_btn{flex:0 1 45%; }
.search_btn button.Choice{background-color: var(--default_color); color:#fff; border: none !important;}

.search_btn .day_info{display: flex; width: 100%; justify-content:space-between;  font-size: 120%; padding:20px 10px 15px 10px; align-items: center; letter-spacing: -0.05em;  line-height: 33px;}
.search_btn .day_info .day {display: flex; align-items: center; }
.search_btn .day_info .day button{display: flex; align-items: center; margin-right: 10px;}
.search_btn .day_info .day button i{width:30px; height: 30px; line-height: 28px; border: 1px solid var(--border_color); border-radius: 50%; font-size: 15px; margin-right: 5px;}
.search_btn .day_info .day button span{font-size: 120%; display: inline-block;  color: var(--orange); font-weight: 700;font-family: 'Roboto';}
.search_btn .day_info .day em{ font-weight: 500;font-size: 85%; }
.search_btn .day_info .day em i{color:var(--default_color)}

.search_btn .go_back button{font-size: 15px; color:#777;  line-height: 25px; display: block;}
.search_btn .go_back button i{width:25px; height: 25px; line-height: 23px; border: 1px solid var(--border_color); border-radius: 50%; font-size: 12px;}


/* 날짜선택 모달 */
.day_choice_modal .check_toggle input[type="checkbox"] + label{ border-color: #fff;}
.day_choice_modal .form-row label {width:100%; font-size: 110%; font-weight: 700; line-height: 40px; padding-left: 20px; color: #151e1a; padding-top: 10px;}

/* 버스 추천 */
.bus_title{display: flex; justify-content: center; align-items: center; padding: 18px; background-color: #fff;  border-top: 1px solid var(--border_color); font-size: 130%; font-weight: 700; letter-spacing: -0.05em;}
.bus_title strong{padding:0 20px}
.bus_title i{color:#9aa1a9;}

.way_result_list, .usage_list, .notice_list, .mypage_list{padding-top: 20px; }
.usage_list + .usage_list {padding-top: 0;}

/* 박스 디자인 */
.item_box {display: block; border-radius: 20px; background-color: #fff; padding:20px 25px;  box-shadow: 0px 0px 10px rgba(0,0,0, 0.1); margin-bottom: 13px; position: relative;}
.item_box.bor {border: 2px solid var(--default_color); }
.item_box.linever {border: 2px solid var(--border_color); box-shadow: none; padding:5px 10px; border-radius: 7px;}

@media only screen and (max-width:600px){
  .item_box { padding:13px 20px;  }
}


.item_address {display: block;color:#555;}
.item_address i {color:#a7adb7; margin-right: 5px;}
.item_box .more_btn {position: absolute; top:17px; right:20px; width: 25px;}
.item_box .more_btn.date {width:auto; font-family: 'Roboto'; font-size: 120%; font-weight: 500; top:30px; right:20px}

/* 교통수단 아이콘 */
.transport_icon{font-weight: 700;}
.transport_icon.type_express_bus{color:#022a5a} /* 고속버스 */
.transport_icon.type_intercity_bus{color:#0098ff} /* 시외버스 */
.transport_icon.type_city_bus{color:#28b706} /* 시내버스 */
.transport_icon.type_ktx{color:#144999} /* 기차 */
.transport_icon.type_srt{color:#843b71} /* 기차 */
.transport_icon.type_hotel{color:#333} /* 숙소 */
.transport_icon.type_car{color:#df407b}  /* 자차 */
.transport_icon.type_highway{color:#323232}  /* 고속도로 */



/* 예약가능 대중교통 결과 화면 */
.way_result_list .tit{display: flex; font-size: 140%; justify-content: space-between; }
.way_result_list .tit strong{font-weight: 700;}
.way_result_list .tit em{color:#666; font-weight: 700;}
.way_result_list .tit em span{font-size: 70%;}
.way_result_list .way_infobox {padding-top: 10px; margin-top: 10px; border-top: 1px solid var(--border_color);}
.way_result_list .way_infobox ul li {display: flex;}
.way_result_list .way_infobox ul li + li {padding-top: 10px; margin-top: 10px; border-top: 1px dashed var(--border_color);}
.way_result_list .way_infobox .way_type { flex: 0 1 65px; font-size: 90%; }
.way_result_list .way_infobox .way_type i {display: block;}

.way_result_list .way_infobox .way_info {flex: 1 1 auto}
.way_result_list .way_infobox .way_info dl{display: flex; width: 100%; color:#777; line-height: 23px;}
.way_result_list .way_infobox .way_info dl dt{flex:0 1 40px; font-weight: 500; color:#444}
.way_result_list .way_infobox .way_info dl dd{flex:0 1 auto}
.way_result_list .way_infobox .way_info p{display: block; padding-top: 6px; font-size: 90%;}
.way_result_list .way_infobox .reservation_btn {}

.way_result_list .way_infobox .way_info.v2 {  flex:0 1 calc(100% - 65px)}
.way_result_list .way_infobox .way_info.v2 dl dt{flex:1 1 95px;}
.way_result_list .way_infobox .way_info.v2 dl dd{flex:1 1 calc(100% - 95px);}


/* 상세경로 */
.way_detail {position:absolute; top:78px; bottom:0; left:0; right:0; overflow: hidden; background-color: #fff; min-width: 360px;}
.way_detail_tit {display: flex; position: relative;  width: 100%; padding-bottom: 10px; align-items: center;}
.way_detail_tit .btn_back{flex:0 1 50px}
.way_detail_tit .way_info {flex:1 1 auto}
.way_detail_tit .way_info dl{display: flex; width: 100%; color:#777; line-height: 23px;}
.way_detail_tit .way_info dl dt{flex:0 1 40px; font-weight: 500; color:#444}
.way_detail_tit .way_info dl dd{flex:1 1 auto; }
.way_detail_map { display: block; position: absolute; top:56px; right:0; left:0; height:250px; background-color: #444;}
.way_detail_con {  overflow-y: auto; padding:20px; padding-bottom: 110px;  position: absolute; top:306px; right:0; left:0; bottom:0; }
.way_detail_con .detail_con_head{display: flex; justify-content: space-between; position: relative;}
.way_detail_con .detail_con_head .head_info{display: block; }
.way_detail_con .detail_con_head .head_info strong{font-size: 160%; }

.way_detail_con .detail_con_head .path_info {display: flex; padding: 10px 0; flex-wrap: wrap; width:80% }
.way_detail_con .detail_con_head .path_info > span{position: relative; white-space: nowrap;}
.way_detail_con .detail_con_head .path_info > span::after{content:'|'; display: inline-block; padding: 0 10px; color: #ddd;}
.way_detail_con .detail_con_head .path_info > span:last-child:after {display: none;}
.way_detail_con .detail_con_head .way_path{ display: flex; flex-wrap: wrap; padding: 10px 0; }
.way_detail_con .detail_con_head .way_path > div:after{content: '\f105'; font-size:15px; font-family:'FontAwesomeS'; color:#aaa; display: inline-block; padding: 0 10px;}
.way_detail_con .detail_con_head .way_path > div:last-child:after{display: none;}

.way_detail_con .detail_con_head .head_day{position: absolute; right:0px;top:0px; font-size: 120%; text-align: right; }
.way_detail_con .detail_con_head .head_day em{display: block; color:var(--orange); font-weight: 700;}

.way_detail_con .detail_con{ display: block; padding: 40px 0; line-height: 25px; }
.way_detail_con .detail_con ol li{position: relative;}
.way_detail_con .detail_con ol li::before{content: ''; position: absolute; left:9px; top:20px; bottom:0; border-left: 2px dashed #eee; width: 1px;}
.way_detail_con .detail_con ol li:last-child::before{display: none;}

.way_detail_con .detail_con .path_item{ display:flex; justify-content: space-between; padding-bottom: 30px;}
.way_detail_con .detail_con .path_item > em{ flex:0 1 100px; font-weight: 700; font-size: 90%; letter-spacing: -0.1em;}
.way_detail_con .detail_con .path_item > em i{ font-size: 120%; width:20px; height: 25px; text-align: center;}
.way_detail_con .detail_con .path_item > em > i{color:#76828c}
.way_detail_con .detail_con .path_item > em > .last{color:var(--orange)}

.way_detail_con .detail_con .path_item > .path_item_right{ flex:0 1 calc(100% - 110px); overflow: hidden; }
.way_detail_con .detail_con .path_item > .path_item_right > *{display: block; }
.way_detail_con .detail_con .path_item > .path_item_right strong{display: block;text-overflow: ellipsis; white-space:nowrap;  overflow: hidden; padding-right: 20px; font-size: 110%;}
.way_detail_con .detail_con .path_item > .path_item_right a{ position: relative; padding-right: 30px;}
.way_detail_con .detail_con .path_item > .path_item_right a:after{content: '\f054'; font-size:15px; font-family:'FontAwesomeS'; position: absolute; right: 0; top: 0; width:20px; height: 30px;  color:#999;}
.way_detail_con .detail_con .path_item > .path_item_right p span{ display: inline-block; padding: 0 5px; color:#ddd}

.path_icon_stopover {width:20px; height: 25px; background-image: url(/images/mpm/aismart/btr/contents/path_stopover.png); background-repeat: no-repeat; background-size: 100% auto; position: relative; background-position: center center;}

@media only screen and (max-width:450px){
  .way_detail_con .detail_con .path_item > em{ flex:0 1 100px;}
  .way_detail_con .detail_con .path_item > .path_item_right{ flex:0 1 calc(100% - 100px); }
}



/* 버스예약 숙소예약 */
.transport_list {padding-top:20px; }
.transport_list .item_box .item_con{display: flex; width: 100%; justify-content:space-between; line-height: 45px; }
.transport_list .item_box .item_info{display: flex; justify-content:flex-start; flex: 0 0 calc(100% - 90px); min-width: calc(100% - 90px);  align-items: center; }
.transport_list .item_box .item_address {border-top: 1px solid var(--border_color); margin-top: 15px; line-height: 45px;}

.transport_list .item_info span, .transport_list .item_info em, .transport_list .item_info strong {font-size: 120%; white-space:nowrap; margin-right: 0px;  }
.transport_list .item_info span {background-color: #e6e9ee; display:block;  flex: 0 0 60px; min-width: 60px; border-radius: 10px; text-align: center; font-size: 85%; font-weight: 500;  line-height: 35px; height: 35px; }
.transport_list .item_info em {font-family: 'Roboto'; font-weight: 900; color:#666; display: block; flex: 1 0 15%; text-align: center; min-width: 60px;}
.transport_list .item_info strong {font-weight: 500; flex: 1 0 50%;  text-overflow: ellipsis; white-space:nowrap;  overflow: hidden; display:block}
.transport_list .item_box .reservation_btn {flex: 0 1 80px; }


.transport_list.hotel_type .item_info em {font-family: inherit; font-weight: 700; color:#222; display: block; flex: 1 0 50%; text-overflow: ellipsis; white-space:nowrap;  overflow: hidden; text-align: left; padding-left: 15px;}
.transport_list.hotel_type .item_info strong {font-weight: 500; flex: 1 0 calc(30% - 80px); padding-right: 10px;  text-overflow:inherit; min-width: 70px; color: var(--orange);}

@media only screen and (max-width:450px){
    .transport_list .item_box .reservation_btn {flex: 0 1 50px; }
}


  /* 숙소날짜선택 */
.hotel_day  { padding-bottom: 20px; }
.hotel_day > .day_box, .people_box button, .sort_select{display: block; padding:0px 15px;line-height: 55px; border: 1px solid var(--border_color); border-radius: 15px;}
.hotel_day > div + div {margin-top: 5px;}
.hotel_day .hotel_day_btn{display: flex;  justify-content: space-between; width: 100%; align-items: center;}
.hotel_day .hotel_day_btn strong {font-weight: 500; font-size: 110%;  letter-spacing: -0.08em; line-height: 45px;}
.hotel_day .hotel_day_btn strong span {white-space:nowrap; }
.hotel_day .hotel_day_btn i {font-size: 110%; width: 20px;}
.people_box {display: flex; justify-content: space-between; }
.people_box button{white-space:nowrap; display: flex; align-items: center; line-height: 40px;}
.people_box button i {flex: 0 1 20px;}
.people_box button span {flex: 0 1 calc(100% - 20px); font-weight: 500; }
.people_box .people_btn { flex:0 1 auto; }
.people_box .people_btn span {display: block; text-align: center;}
.people_box .input_check {margin-top:5px;}

.people_box .sort_select { flex:0 1 calc(40% - 5px);}

@media only screen and (max-width:380px){
  .hotel_day .hotel_day_btn strong { line-height: 20px; margin:5px 0}
}
/* 인원수 선택 셀렉트 */
.number_select strong {font-size: 120%; display: block; padding:10px 20px; text-align: center;}
.number_box {display: flex; width: 100%; justify-content: space-between; padding: 8px 8px; font-size: 250%;  border: 1px solid var(--border_color); border-radius: 50px; line-height: 35px;}
/* .number_box i{color:#d2d9e1;} */
.number_box i{color:#3b4045;}
.number_box span{color:var(--default_color);font-weight: 500; font-family: 'Roboto';}

/* 인원수 선택 셀렉트 */
.select_list {display: block; margin: -20px -30px 0px -30px;}
.select_list li, .select_list li a{display: block; }
.select_list li + li{border-top: 1px solid var(--border_color);}
.select_list li a{ line-height: 50px; font-size: 120%; padding: 0 30px; font-weight: 500; position: relative;}
.select_list li.on a{font-weight: 700; color: var(--orange);}
.select_list li.on a::after{content: '\f00c';  font-family:'FontAwesomeS'; position:absolute; right: 45px;}

/* 날짜선택 */
.day_area {display: block;  padding-bottom: 20px;  }
.day_area *{ }
.day_area .input-group > .input-group-append .input-group-text {width: 40px; justify-content: left; background-color: transparent;}
.day_area .input-group .form-control {border-radius: 30px 0 0 30px; padding-left: 0px;  text-align: center;}

.day_term {display: flex; margin-bottom: 10px; justify-content: space-between;}
.day_term ul{flex:0 1 calc(100% - 100px); display: flex; line-height: 45px;}
.day_term ul li{flex:1 1 auto;}
.day_term ul li + li button{border-left: none;}
.day_term ul li button{border: 1px solid var(--border_color); display: block; width: 100%; position: relative; height: 43px; background-color: #fff;}
.day_term ul li button span{display: block; position:absolute; left:-1px; right:-1px; bottom:-1px; top:-1px;}
.day_term ul li:first-child button, .day_term ul li:first-child button span{border-radius: 10px 0 0 10px;}
.day_term ul li:last-child button, .day_term ul li:last-child button span{border-radius: 0px 10px 10px 0px;}
.day_term ul li button.on span{border: 2px solid var(--default_color); line-height: 41px; color: var(--default_color);;}

.day_term .day_input{min-width:90px; flex: 0 1 90px;}

.day_term.tabv {margin-top:20px;}
.day_term.tabv ul{flex:0 1 100%;}


.partner_link {display: block; margin-top: 25px;}
.partner_link ul{display: flex; justify-content: space-between; flex-wrap: wrap;}
.partner_link ul li{flex: 0 1 48%; margin: 5px 0;}
.partner_link ul li a{display: block; text-align: center; line-height: 40px;  border-radius: 10px; font-weight: 500;  background-color: #777e9a; color:#fff}

/* 이용내역 */
.usage_list .tit {display: flex; justify-content: space-between; margin-bottom: 5px; align-items: center;}
.usage_list .tit strong{font-size: 130%;}
.usage_list .tit strong em{ letter-spacing: -0.1em; font-size: 15px; font-weight: 400; color:#888; display: inline-block; padding-left: 10px; white-space:nowrap;}

.usage_info {padding: 5px 0; display: block;}
.usage_info dl{ display: flex; justify-content: space-between; line-height: 20px; margin: 10px 0;} 
.usage_info dl dt{flex:0 1 90px; color:#888;} 
.usage_info dl dd{flex:0 1 calc(100% - 100px)} 

.usage_list .usage_pay_info{padding: 15px 0; display: flex; justify-content: space-between;align-items: center; border-top: 1px dashed #ccc; margin-top: 5px; font-size: 120%;} 

.usage_detail {background-color: #fff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); display: block; padding: 35px 30px; border-radius: 20px 20px 0 0; margin-bottom: -20px;}
.usage_detail .tit{ display: flex; justify-content: space-between; margin-bottom: 5px; align-items: center;}
.usage_detail .tit strong{font-size: 130%;}
.usage_detail .tit em{ letter-spacing: -0.1em; font-size: 15px; font-weight: 500; color:var(--default_color); display: inline-block; padding-left: 10px; white-space:nowrap;}

.usage_detail .item_tit { display: block; position: relative; text-align: center;}
.usage_detail .item_tit span{ position: relative; font-size: 120%; font-weight: 500; display: inline-block; padding: 20px 20px 10px 20px; z-index: 1; background-color: #Fff; color:#000;}
.usage_detail .item_tit::before {content: ''; left:0; right:0; top:33px; border-bottom: 1px solid #ddd; position: absolute;}
.usage_detail .item_tit::after {content: ''; left:0; right:0; top:36px; border-bottom: 1px solid #ddd; position: absolute;}


/* 메뉴 더보기 */
.menu_more_list {border-bottom: 1px solid var(--border_color);}
.menu_more_list li, .menu_more_list li a{display: block;}
.menu_more_list li a{line-height: 60px; position: relative; padding: 0 40px; font-size: 135%; font-weight: 500;}
.menu_more_list li {border-top: 1px solid var(--border_color);}
.menu_more_list li a::after{content: '\f054';  font-family:'FontAwesomeS'; position:absolute; right: 35px; color:#d3d9e1}


/* 알림더보기 */
.notice_list > div > * {display: block; padding: 10px 5px;}
.notice_list > div > strong {font-size: 140%; }
.notice_list > div > strong em{font-size: 80%; font-weight: 400; color:#fff; display: inline-block; background-color: var(--black); border-radius: 5px; padding: 0 10px; margin-right: 5px; }
.notice_list > div > p { font-size: 110%; background-color: var(--bg_gray); border-radius: 10px; padding: 10px 15px;}
.notice_list > div > span { font-family: 'Roboto'; color: #666;}


/* 출장정산 */
.Receipt_add_list {padding-top: 10px;}
.Receipt_add_list li{padding:5px 0px; font-size: 120%;}

/* 카테고리 선택 */
.cate_itembox  {display: flex; flex-wrap: wrap;}
.cate_itembox li{flex: 0 1 auto; margin: 2px 0;  padding-right: 10px;}
.cate_itembox li a{display: block; line-height: 30px; border: 1px solid #eee; color:#666; border-radius: 30px; padding: 0 15px;}
.cate_itembox li.on a{border-color: var(--default_color); background-color: var(--default_color); color:#fff}
.cate_itembox li.on a:hover{color:#fff}

/* 영수증 보기 */
#Receipt_view_modal .modal-body, #Receipt_view_modal .modal-footer, #usage_detail_modal .modal-body,  #usage_detail_modal .modal-footer{background-color:#f1f2f6;}
.Receipt_view { max-width:582px; margin: 0 auto; margin-top: 0px;}
.Receipt_view .con{background-image: url(/images/mpm/aismart/btr/contents/receipt_img_bg.png); background-repeat: repeat-y; background-size: 100% auto; padding:30px 40px; position: relative;}
.Receipt_view .bottom{background-image: url(/images/mpm/aismart/btr/contents/receipt_img_bottom.png); background-repeat:no-repeat; height: 25px; background-size: 100% auto;}
.Receipt_view h4 {font-size: 150%; font-weight: 700; color:#000}
.Receipt_view .Receipt_time {text-align: right; display: block;} 
.Receipt_view .Receipt_time span{color:#bbb; display: inline-block; padding: 0 5px;} 
.btn_mydata {position: absolute; right:40px; top:33px;}

.Receipt_detail {border-top: 2px solid #000; margin-top: 20px; padding: 10px 0;/* border-bottom: 4px double #aaa; */}
.Receipt_detail dl {display: flex; justify-content: space-between; padding: 5px 10px; font-size: 100%;}
.Receipt_detail dl dt {text-align: left; color:#666;width:100px;  flex:1 0 100px}
.Receipt_detail dl dd {text-align: right; color:#222; flex:1 0 calc(100% - 100px)}

.Receipt_detail .detail02 {font-weight: 700; font-size: 130%; padding: 10px 0; margin: 15px 0; border-top: 1px dashed #ccc; border-bottom: 1px dashed #ccc;}
.Receipt_detail .detail02 dt{color:#000}
.Receipt_detail .detail02 dd{color:var(--orange)}

.Receipt_detail .detail03 dl {justify-content: left;}
.Receipt_detail .detail03 dt{width:100px; flex:1 0 100px}
.Receipt_detail .detail03 dd{text-align: left; }

@media only screen and (max-width:400px){
  .Receipt_view .con{ padding:30px 20px; }
}


/* 유류비 영수증 추가 */
.Receipt_add_area {position:absolute; top:120px; bottom:0; left:0; right:0; overflow-y: auto; padding-bottom: 130px;  background-color: #fff; min-width: 360px;}

.form_design {display: block; margin: 5px 20px; font-size: 120%; border-top: 2px solid #000; padding: 15px 5px;}
.form_design dl{display: flex; line-height: 45px; padding: 5px 0; }
.form_design dl dt{flex: 0 1 100px; font-weight: 500; color:#111; }
.form_design dl dd{flex: 0 1 calc(100% - 100px); }
.form_design dl dd.block{flex: 0 1 100%; }
.form_design dl dd .sort_select{width: 100%; line-height: 45px;}

.info_btn {width:40px; line-height: 45px;}
.info_btn i{line-height: 45px;}

/* 첨부파일 */
.receipt_file {display: block; }
.receipt_file > p {display: block; margin-top: 5px;}
.receipt_file ul{padding: 10px; display: flex; border-radius: 10px; justify-content: space-between; width: 100%; flex-wrap: wrap;}
.receipt_file ul li{ flex: 0 1 30%; margin: 5px 0;}
.receipt_file ul li .file_box{    border-radius: 5px 5px 0 0; overflow: hidden;}
.receipt_file ul li .del_btn {display: block; background-color: #555e7a; color:#fff; font-size: 13px; text-align: center; width: 100%; padding: 2px; border-radius: 0 0 5px 5px;}



.Receipt_list {padding-top: 20px;}
.Receipt_list + .Receipt_list {padding-top: 0;}
.Receipt_list .top_info{ display: block;}
.Receipt_list .top_info em{font-size: 90%; color:#666}
.Receipt_list .top_info em span{color:#bbb; display: inline-block; padding: 0 5px;}
.Receipt_list .cate_item {display: block; padding-top: 5px;}
.Receipt_list .cate_item span{display: inline-block; background-color: #e6e9ee; width:70px; text-align: center; border-radius: 5px; line-height: 25px; font-size: 90%;}
.Receipt_list .cate_item span.cate_reservation{background-color: #e2f6ed; color: #12ac60;}
.Receipt_list .cate_item span.cate_cancel{background-color: #ffe7e4; color: #fe7668;}
.Receipt_list .item_box strong {font-size: 130%; display: block; padding: 5px 0; font-weight: 500;}
.Receipt_list .item_box .amount {display: block; text-align: right; font-weight: 700; font-size: 140%;}
.Receipt_list .card_info{font-size: 90%; color:#666}
.Receipt_list .use_date{ color:#333; font-weight: 400; position: absolute; right:20px; top:30px; font-size: 13px; color:#666; letter-spacing: -0.1em; }

/* 하이패스 */
.Highpass_list {min-height: 200px; max-height: 60vh; overflow-scrolling: auto;}

.btn_sticky {position:sticky; bottom: 130px; }

/* 내 예약 */
.mypage_list em{font-size: 12px; font-weight: 400; color:#888; display: inline-block; padding-left: 10px; white-space:nowrap;}
.mypage_list .tit {display: flex; justify-content: space-between; margin-bottom: 5px; align-items: center;}
.mypage_list .tit strong{font-size: 120%;}
.mypage_list .tit strong em{font-size: 15px; letter-spacing: -0.1em;}

.my_reservation_box > div {display: flex;  justify-content: space-between; border: 1px solid #ccc; border-top: none;}
.my_reservation_box .my_date{  background-color: #555; color: #fff;padding: 3px 10px; border-radius: 5px 5px 0 0; border: none; font-size: 13px;}
.my_reservation_box .my_date em{ color: #Fff; }
.my_reservation_box .my_ticket {position: relative;}
.my_reservation_box .my_ticket:before{content: '\f061'; background-color: #f2f3f7; width: 30px; height: 30px; border-radius: 50%; position: absolute; left:calc(50% - 15px); top:25%;  font-family:'FontAwesomeS'; text-align: center; line-height: 30px; color: #c8ceda;}
.my_reservation_box .my_ticket > div {flex:0 1 50%; text-align: center; padding: 10px 2px;}
.my_reservation_box .my_ticket > div + div {border-left: 1px solid #ccc; }
.my_reservation_box .my_ticket em {display: block; padding: 0;}
.my_reservation_box .transport_icon{display: inline-block; margin-right: 10px;}
.my_reservation_box .my_ticket .ticket_info strong{font-size: 120%; color:#444; font-weight: 500;}
.my_reservation_box .my_info {border-radius: 0 0 5px 5px;}
.my_reservation_box .my_info > div {flex:0 1 25%; text-align: center; padding: 10px 2px;}
.my_reservation_box .my_info > div + div {border-left: 1px solid #ccc; }
.my_reservation_box .my_info em {display: block; padding: 0; }
.my_reservation_box .my_info strong{ color:#444; font-weight: 500;}
.my_reservation_box .my_hotel {display: block; padding: 10px 20px 17px 20px;}
.my_reservation_box .my_hotel .hotel_name {display: block;}
.my_reservation_box .my_hotel .hotel_name strong{font-size: 120%; color:#444; font-weight: 500; line-height: 40px;}
.my_reservation_box .my_hotel .hotel_info {display: flex; justify-content: space-between;}
.my_reservation_box .my_hotel .hotel_info em{padding: 0;}
.my_reservation_box .my_hotel .hotel_info span{color: var(--default_color);}

.my_reservation_box.hotel_type .my_info > div {flex:0 1 33.3333%;}
/* 세로정렬을 위함 필요시 삭제가능 */
.my_reservation_box.hotel_type .my_info .info_item_box {display: grid;}

.my_reservation_info{padding: 5px 0; display: flex; justify-content: space-between;align-items: center;} 
.my_reservation_info em{font-size: 14px; padding: 0;} 

.my_reservation_btn {padding: 5px 0;}

.mypage_list .item_box.cancel {overflow: hidden;}

.qr_img img{width:50%; max-width: 200px;}
.qr_img img{width:50%; max-width: 200px;}
.qr_img strong {display: block; line-height: 50px; font-size: 150%; font-family: 'Roboto'; font-weight: 500; color: var(--pink);}

/*
.mypage_list .item_box.cancel > * {filter: blur(3px); -webkit-filter: blur(3px);}
*/
.mypage_list .item_box.cancel .cancel_box {position: absolute; left:0; right:0; bottom:0; top:0; padding: 15px; background-color: rgba(232, 232, 237, 0.7); display: flex; justify-content:right; align-items:flex-start;  }
.mypage_list .item_box.cancel .cancel_box .cancel_completed{ background-color:#ff5c4b; line-height: 20px; font-size: 110%; text-align: center; display: flex; width:70px; height: 70px;; color:#fff; font-weight: 500; border-radius: 50%; justify-content: center; align-items: center;}



/* 로그인 */
.login_box { position: absolute; left:0; right:0; bottom:0; top:0;  display:flex;  background-color:#192f73; justify-content: center; align-content: center; z-index: 999; flex-wrap: wrap;}
.login_box .login_go { display: block; font-size: 150%; font-weight: 700; background-color: #fff;  padding: 20px 50px;  border-radius: 25px; box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.2); border: 2px solid #000;}
.login_box .login_go img{ width:50px; }
.login_box .login_go span{ display: block;color:var(--black); padding-top: 15px; letter-spacing: -0.05em;}
.login_box .login_go span em{ display: block;color:var(--default_color); font-family: 'Roboto'; font-size: 120%;}
.login_box > p{width:100%; margin-top: 20px; color:#fff; font-size: 120%;}



.AI_Reco {background-color: #394ac1; color:#fff; border-radius: 8px;}
.AI_Reco p {position: relative; padding-left: 27px;}
.AI_Reco p::before{content: 'AI'; background-color: #fff; color:#001185; display: inline-block; padding: 0 5px; border-radius: 5px; font-weight: 600; font-family: 'Roboto'; position: absolute; left:0; top:3px;}
.AI_Reco strong{color:#fffa1f}

.item_box.linever .check_box label{font-size: 16px;}

.service_list {display: block; padding: 0 10px;}
.service_list li {display: flex; align-items: top; justify-content: space-between; width:100%;}
.service_list li .input_check{flex: 1 0 calc(100% - 30px); width: calc(100% - 30px);}
.service_list li > a{color:#888; flex: 1 0 30px; width: 30px; text-align: right; line-height: 18px; padding:5px 0;}



.layer_detail {position: fixed; top:0; right:0; bottom:0; left:0; background-color: #fff; z-index: 11500;}
.layer_detail .title_area {margin-top: 10px; border-bottom: 1px solid #eee;}
.layer_detail_con { position: absolute; top: 60px; bottom: 0; left: 0; right: 0; overflow-y: auto;  background-color: #fff;  min-width: 360px; color:#666}
.layer_detail_con p {display: block; padding:7px 0; line-height: 18px;}
.layer_detail_con .con_tit{margin-bottom: 15px;}










/* 썸네일 설정 */
.item {display: block;}
.item .thumbnail {width: 100%;  display: block;  overflow: hidden;  background-color: #eceef4;  position: relative;  padding-bottom: 100%;  }
.item .thumbnail.no_img::after {content:''; background-image: url(/images/mpm/aismart/btr/contents/receipt_file.png); background-repeat: no-repeat; background-position: center center;   position: absolute; left:0; top:0px; right:0; bottom:0; }
.item .thumbnail img, .item .thumbnail video {  position: absolute;  top: 0;  left: 0;  right: 0;  bottom: 0;  max-width: 100%;  max-height: 100%;  margin: auto; transition: all 2s ;transform: scale(1); }

/* .item:hover .thumbnail img {transform: scale(1.2);  } */
.item .thumbnail.mov::after{content:'\f144'; font-family: 'FontAwesomeR'; position: absolute; left:0; top:0px; right:0; bottom:0; font-size: 300%; color:#fff; text-shadow: 0 0 10px rgba(0, 0, 0, 0.4); display: flex; justify-content: center; align-items: center;}

.item.detail .thumbnail{display: block; overflow: hidden; background-color: #000; position: relative; padding-bottom:100%; width:100%;} 
.item.detail .thumbnail img{ transition: all 1s ;  object-fit: cover;position: absolute;  height: 100%; left: 0; right:100%; width:100%;  }
.item.detail:hover .thumbnail img {transform: scale(1);  }




/* 컨텐츠 타이틀 */
.page_tit {display:flex; position: relative;  white-space: nowrap;   font-size:170%; line-height: 45px;  font-weight:700;  padding:15px 0; margin-bottom: 10px; color: #21252e;}
.page_tit::before{ content: ''; position: absolute; width:6px; height: 6px; left:3px; top:11px; background-color: var(--pink); border-radius: 50%;}
.page_tit::after{ content: ''; position: absolute; width:6px; height: 6px; left: 13px; top:11px;  background-color: var(--default_color); border-radius: 50%;}
.page_tit span{font-size: 80%; color: var(--default_color); letter-spacing: -0.05em; display: inline-block; padding-left: 5px;}
.page_tit em{font-weight: 400;}



.table_design{border-collapse: collapse;   width: 100%;  font-size: 90%;  border-top:solid 1px #444; margin: 5px 0;}
.table_design thead th {background: #f6f7fb;color: #333; font-weight: 500;  border-bottom:solid 1px #bbb; text-align: center; }
.table_design th, .table_design td {border:1px solid #d4d4d4; padding:5px 10px;color: #333; }
.table_design td {box-sizing: border-box;color: #444;}
.table_design tbody th {background: #f6f6f6; text-align: center; font-weight: 500;}
.table_design td + td, .table_design th + td, .table_design th + th { border-left: 1px solid #d4d4d4;}
.table_design td[rowspan], .table_design th[rowspan] {border-right: 1px solid #d4d4d4;}
.table_design td[rowspan]:last-child {border-right:none}
.table_design .dot_list li{position:relative;padding:0px 5px 3px 7px;text-align:left; line-height: 130%; margin-bottom: 5px; font-weight: 400; }
.table_design .dot_list li:last-child{padding-bottom:0}
.table_design .dot_list li::before{content:''; position:absolute; top:7px; left:0px; background:#999; width:3px; height:3px; border-radius:10px; }


/* 입력폼 */
.form_design { }
.input {flex: 0 0 100%; display: flex; }
.input > span {padding: 0 2px; line-height:45px}
.input10 {width: 10%;}
.input20 {width: 20% !important;;}
.input30 {width: 30% !important;}
.input40 {width: 40%;}
.input50 {width: 50%;}
.input60 {width: 60%;}
.input70 {width: 70%;}
.input80 {width: 80%;}
.form_design .row dd > * {margin-right:3px}
.form_design .row dd .input > * {margin-right:3px}
.form_design .row dd .input [class*="col-"] {margin-right:0;}
.form_design .row dd .email_input {width: 23%; }
.form_design .row.form-group {padding-top:5px; padding-bottom: 5px; margin: 5px 0; }
.form_design .row .row {padding-top:0; padding-bottom:0; margin-right:-7px; margin-left:-10px; }

.form_design .row  + .row{}
.form_design .row dt {padding-top:7px; text-align: right;font-weight: 500; color:#222; padding-right: 20px;}
.form_design .row dt label{  letter-spacing: -0.05em;}
.form_design .row dd {display: flex; flex-wrap: wrap;  }
.form_design .row dd p { padding-top:3px; flex: 1 1 100%;}
.input-group {margin-top:0px; margin-bottom:0px; }
.form-row {}


.passamountContainer{display: flex; align-items: center;}
.passamount{flex: 1; margin-right: 10px;}