/* common */
section .sc-title { margin-bottom:  1rem; display: flex; align-items: center; justify-content: space-between;}
section .sc-title .mainTitle { font-size: 2rem; font-weight: 700; line-height: 1.4;}


/* search_area 검색창 공통 */
.search_area { flex-shrink: 0;}
.search_area > form { display: flex; flex-direction: column; gap: 1rem;}
.search_area .btn-search { margin-top: 1.6rem;}

.typeWrap { display: flex; align-items: center; gap: 1rem;}
.typeWrap .typeSel { background-color: #f4f4f4; flex: 1; min-width: 0; border-radius: 1rem; box-sizing: border-box; position: relative; height: 4.5rem;}
.typeWrap .typeSel > a { font-size: 1.6rem; display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 0 2rem; height: 100%;}
.typeWrap .typeSel > a input.select-input { background-color: transparent;}
.typeWrap .typeSel > a img { width: 1.2rem; flex-shrink: 0; transition: all 0.2s;}
.typeWrap .typeSel > a.active img { transform: rotate(180deg);}
.typeWrap .typeOption { display: none; flex-direction: column; position: absolute; top:100%; left: 0; right: 0; background-color: #f4f4f4; border-radius: 0 0 1rem 1rem; z-index: 10; max-height: 20rem; overflow-y: auto;}
.typeWrap .typeOption a { padding: 1.5rem 2rem; font-size: 1.6rem;  width: 100%;}
.typeWrap .typeOption a.active { background: var(--brand-color); color: #fff;}
.typeWrap .typeSel.open { border-radius: 1rem 1rem 0 0;}


.alertMessage { color: #999; font-size: 1.8rem; font-weight: 300; margin-top: 8rem; text-align: center;}
.btn-disabled { background-color: #ededed !important; color: #aaa !important;}
.btn-s1 { background-color: var(--brand-color); color: #fff; text-align: center; border-radius: 0.8rem; display: block; padding: 1.6rem 0; width: 100%; font-size: 1.6rem; flex: 1; min-width: 0;} 
.bottom-button { margin-top: 4rem;}


/* home.php */
.homeWrap .container { display: flex; flex-direction: column; gap: 2rem;}
.homeWrap .sc-menu { display: flex; align-items: center; gap: 1rem;}
.homeWrap .sc-menu .menu-item { flex: 1; min-width: 0; background-color: #f4f4f4; border-radius: 0.8rem; padding: 1.5rem; display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between; gap: 1rem;}
.homeWrap .sc-menu .menu-item .text_box { width: 100%;}
.homeWrap .sc-menu .menu-item .text_box p { font-size: 1.6rem; font-weight: 600; line-height: 1.3;}
.homeWrap .sc-map .map_link { border-radius: 0.8rem; width: 100%; min-height: 20rem; background: url(../img/map.png) no-repeat center center / cover;}



/* subpage */
.subpage-title { font-size: 1.8rem; font-weight: 700; margin-bottom: 2rem;}

.subpage-list { display: flex; flex-direction: column; gap: 1.8rem;}
.subpage-list .list-item { background-color: #f4f5f7; border-radius: 1rem; padding: 2.4rem 1.8rem;}
.subpage-list .list-item .item-title { font-size: 1.6rem; font-weight: 600;}
.subpage-list .list-item .item-desc { font-size: 1.4rem; color: #999; line-height: 1.4; margin-top: 1rem;}
.subpage-list .list-item .item-desc strong{ font-size: inherit; margin-bottom: 4px; display: inline-block; color: #444; line-height: 1.3;}

.result-list { display: flex; flex-direction: column; position: relative; flex: 1; min-height: 0;}
.result-item { padding: 2rem 0; display: flex; flex-direction: column;}
.result-item:not(:last-child) { border-bottom: 1px solid #ccc;}
.result-item .title_wrap { flex: 1; min-width: 0; display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 15px;}
.result-item .title_wrap .title { font-size: 1.8rem; line-height: 1.4; font-weight: 700; flex: 1; min-width: 0;}
.result-item .title_wrap a { font-size: 1.6rem; color: var(--brand-color); background-color: #f0f1ff; padding: 0.6rem 1.6rem; border-radius: 0.4rem;}


/* airport_area.php */
.areaWrap .result-item .title_wrap .update { display: flex; align-items: center; gap: 1rem; font-size: 1.4rem; color: #999;}
.areaWrap .result-item .item_con { display: flex; align-items: center; justify-content: space-between; }
.areaWrap .result-item .item_con p { font-size: 1.5rem; display: flex; align-items: center; gap: 1.6rem; }
.areaWrap .result-item .item_con p span { font-size: 1.6rem; font-weight: 600;}
.areaWrap .result-item .item_con .stats { font-size: 1.6rem; position: relative; display: flex; align-items: center;}
.areaWrap .result-item .item_con .stats::before { content:''; width: 0.8rem; aspect-ratio: 1/1; border-radius: 100%; margin-right: 0.8rem; }
.areaWrap .result-item .item_con .stats.level1::before { background-color: #16c60c;}
.areaWrap .result-item .item_con .stats.level2::before { background-color: #ffd400;}
.areaWrap .result-item .item_con .stats.level3::before { background-color: #e81224;}
.areaWrap .result-item .item_con .stats.level1 { color: #16c60c;}
.areaWrap .result-item .item_con .stats.level2 { color: #ffd400;}
.areaWrap .result-item .item_con .stats.level3 { color: #e81224;}


/* parking_service.php */
.serviceWrap .result-item .item_con { display: flex; flex-direction: column; gap: 0.8rem;}
.serviceWrap .result-item .item_con p { font-size: 1.6rem; color: #aaa; font-weight: 300; line-height: 1.3; display: flex; align-items: center; gap: 0.4rem;}
.serviceWrap .result-item .item_con p img { width: 1.6rem;}

/* airport_parking.php */
.parkingWrap .contents_area { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: 20px;}
.parkingWrap .marker_desc_wrap { display: flex; align-items: center; gap: 2rem; flex-shrink: 0;}
.parkingWrap .marker_desc_wrap .desc_item { display: flex; align-items: center; gap: 0.6rem; }
.parkingWrap .marker_desc_wrap .desc_item img { width: 2rem;}
.parkingWrap .marker_desc_wrap .desc_item p { font-size: 1.4rem; color: #999;}
.parkingWrap .map_wrap { width: 100%; aspect-ratio: 595/866; display: flex; flex-direction: column; background: url(../img/map-1.png) no-repeat top center / contain;}
.parkingWrap .map_wrap .marker_position_wrap { flex: 1; min-height: 0; position: relative;}

.parkingWrap .map_wrap .marker { position: absolute; transform: translate( -50%, -100%);}
.parkingWrap .map_wrap .marker .marker_inner { width: 3.2rem; aspect-ratio: 47/60; background-repeat: no-repeat; background-size: contain; background-position: bottom center; position: relative;}
.parkingWrap .map_wrap .marker.international-airport .marker_inner { background-image: url(../img/icon-7.png);} 
.parkingWrap .map_wrap .marker.domestic-airport .marker_inner { background-image: url(../img/icon-8.png);}
.parkingWrap .map_wrap .marker .marker_inner p { position: absolute; font-size: 1.4rem; color: #fff; top: 0.8rem; left: 50%; transform: translateX(-50%); font-weight: 300;}

.parkingWrap .map_wrap #marker1  { top: 22%; left: 19%; }
.parkingWrap .map_wrap #marker2  { top: 15%; left: 61%; }
.parkingWrap .map_wrap #marker3  { top: 23%; left: 50%; }
.parkingWrap .map_wrap #marker4  { top: 40%; left: 40%; }
.parkingWrap .map_wrap #marker5  { top: 55%; left: 21%; }
.parkingWrap .map_wrap #marker6  { top: 57%; left: 64%; }
.parkingWrap .map_wrap #marker7  { top: 54%; left: 80%; }
.parkingWrap .map_wrap #marker8  { top: 64%; left: 80%; }
.parkingWrap .map_wrap #marker9  { top: 70%; left: 68%; }
.parkingWrap .map_wrap #marker10  { top: 71%; left: 22%; }
.parkingWrap .map_wrap #marker11  { top: 76%; left: 14%; }
.parkingWrap .map_wrap #marker12  { top: 75%; left: 36%; }
.parkingWrap .map_wrap #marker13  { top: 72%; left: 46%; }
.parkingWrap .map_wrap #marker14  { top: 96%; left: 24%; }


/* parking_guide.php */
.guideWrap .contents_area { flex: 1; min-height: 0;}
.guideWrap .contents_area pre { font-size: 1.4rem; color: #999; line-height: 1.4;}
.guideWrap .contents_area img { margin-top: 20px;}

/* pagination */
.pagination { display: flex; align-items: center; justify-content: center; gap: 0.6rem; margin-top: 4rem;}
.pagination .page-link.current { color: #fff; font-weight: 700; background-color: var(--brand-color);}
.pagination .page-link { color: #666; font-size: 1.8rem; width: 3rem; aspect-ratio: 1/1; background-color: #ededed; display: flex; align-items: center; justify-content: center; border-radius: 100%;}
.pagination .page-btn { width: 1rem; aspect-ratio: 1/1; margin: 0 1rem;}
.pagination .page-btn img {width: 100%;}