@charset "UTF-8";

/** 서브 페이지 css*/

/*반응형 샘플*/
@media all and (max-width:1440px){
	
}
@media all and (max-width:1024px){
	
}
@media all and (max-width:768px){
	
}
@media all and (max-width:425px){
	
}
/*반응형 샘플*/


/*? FAQ*/

/*?자원상세/예약신청*/


/*? 통합검색 */
#gnb:has(.searchPop[style*="display: block"]) {background-color: #fff !important; transition:0s;}
/* #container:has(.totalT){padding-top:80px !important;} */
#totalSrh .totalT{display:flex; flex-direction:column; align-items:center; justify-content:center; padding:40px; background:#f5f5f5;}
#totalSrh .totalT .title{margin-bottom:40px; text-align:center; font-family: 'SCD'; font-size:3.2rem; font-weight:600; }
#totalSrh .totalT .srhBox{position:relative; display:inline-flex; align-items:center; gap:16px;}
#totalSrh .totalT .srhBox .srh{display:inline-flex; align-items:center; gap:0; width:920px; height:80px; border-radius:16px; border:3px solid var(--color-main); background:#fff; overflow: hidden;}
#totalSrh .totalT .srhBox .srh label{flex:1; height:100%; background:transparent;}
#totalSrh .totalT .srhBox .srh input{padding:0 24px; border:0; border-radius:0; flex:1; height:100%; background:transparent; font-size:2.1rem; font-weight:500; border-radius:16px;}
#totalSrh .totalT .srhBox .srh input::placeholder{font-size:2.1rem;}
#totalSrh .totalT .srhBox .srh .srhBtn{display:flex; align-items:center; justify-content:center; width:80px; height:80px; background:var(--color-main); color:#fff; }
#totalSrh .totalT .srhBox .srh .srhBtn .micon{font-size:3.2rem;}
#totalSrh .totalT .srhBox .detBtn{position:absolute; right:-116px; top:50%; transform:translateY(-50%); }
#totalSrh .totalT .stxt{display:inline-flex; align-items:center; justify-content:center; gap:4px 6px; margin-top:24px; flex-wrap:wrap; text-align:center;}
#totalSrh .totalT .stxt .em{display:inline-flex; align-items:center; gap:4px;font-weight:600;}
@media all and (max-width:1280px){
	#totalSrh .totalT .srhBox .srh{width:600px;}
}
@media all and (max-width:1024px){
	#totalSrh .totalT .srhBox .srh{width:460px; height:70px;}
	#totalSrh .totalT .srhBox .srh .srhBtn{width:70px; height:70px;}
}
@media all and (max-width:768px){
	#totalSrh .totalT .title{margin-bottom:24px; font-size:2.8rem;}
	#totalSrh .totalT{padding:40px 24px;}
	#totalSrh .totalT .srhBox{flex-direction:column; gap:4px; align-items:flex-end; width:100%;}
	#totalSrh .totalT .srhBox .srh{width:100%; height:60px; border-radius:12px;}
	#totalSrh .totalT .srhBox .srh input{padding:0 16px; border-radius:12px; }
	#totalSrh .totalT .srhBox .srh input,
	#totalSrh .totalT .srhBox .srh input::placeholder{font-size:1.9rem;}
	#totalSrh .totalT .srhBox .srh .srhBtn{width:60px; height:60px;}
	#totalSrh .totalT .srhBox .detBtn{position:relative; right:auto; top:auto; transform:none; }
}
@media all and (max-width:425px){
	#totalSrh .totalT{padding:40px 24px 24px;}
	#totalSrh .totalT .srhBox .srh{height:56px; border:2px solid var(--color-main);}
	#totalSrh .totalT .srhBox .srh input, 
	#totalSrh .totalT .srhBox .srh input::placeholder{font-size: 1.7rem;}
	#totalSrh .totalT .srhBox .srh .srhBtn{width:56px; height:56px; background:transparent; }
	#totalSrh .totalT .srhBox .srh label{width:calc(100% - 56px);}
	#totalSrh .totalT .srhBox .srh .srhBtn .micon{font-size:2.4rem; color:var(--color-main);}
	#totalSrh .totalT .srhBox .detBtn i{width:20px; height:20px;}
	#totalSrh .totalT .stxt{margin-top:8px; gap:0 6px; font-size:1.3rem;}
	#totalSrh .totalT .stxt .em i{width:20px; height:20px;}
}
/*상세검색창*/
#totalSrh .detBox{z-index:1; display:none; position:absolute; left:0; top:96px;  flex-direction:column; gap:24px; padding:60px 40px 24px 40px; width:100%; border:1px solid #ccc; border-radius:16px; background:#fff; }
#totalSrh .detBox .list{display:flex; align-items:center; gap:8px 24px;}
#totalSrh .detBox .list .tit{font-weight:600; min-width:100px; }
#totalSrh .detBox .list .inp{flex:1; display:inline-flex; align-items:center; gap:16px; width:100%;}
#totalSrh .detBox .list .inp .due{display:inline-flex; align-items:center; gap:0; border-radius:8px; border:1px solid #ccc; background:#fff; height:56px; width:calc(50% - 8px); overflow:hidden;}
#totalSrh .detBox .list .inp .due li{width:25%; height:100%;}
#totalSrh .detBox .list .inp .due li button{display:inline-flex; align-items:center; justify-content:center; padding:0 16px; width:100%; height:100%;}
#totalSrh .detBox .list .inp .due li button.on{background:#EFF5FF; color:var(--color-main); font-weight:600; border-radius:8px;}
#totalSrh .detBox .list .inp .date{display:inline-flex; align-items:center; gap:6px; }
#totalSrh .detBox .list .inp .date label .txt{display:none;}
#totalSrh .detBox .list .inp .date input{padding:16px; width:180px; height:56px; border:1px solid #ccc; border-radius:8px;}
#totalSrh .detBox .list .inp .textB{flex:1;}
#totalSrh .detBox .close{position:absolute; right:40px; top:10px;}
@media all and (max-width:1280px){
	#totalSrh .detBox{padding:40px 32px 24px 32px;}
	#totalSrh .detBox .list{flex-direction:column; align-items:flex-start;}
	#totalSrh .detBox .list .inp{flex-wrap:wrap; gap:8px 16px;}
	#totalSrh .detBox .list .inp .due{width:100%;}
	#totalSrh .detBox .list .inp .date{width:100%;}
	#totalSrh .detBox .list .inp .date label{width:calc(100% / 2 - 10px);}
	#totalSrh .detBox .list .inp .date input{width:100%;}
}
@media all and (max-width:1024px){
	#totalSrh .detBox{top:78px;}
}
@media all and (max-width:768px){
	#totalSrh .detBox{top:64px; border-radius:8px; padding:40px 24px 24px;}
	#totalSrh .detBox .close{right:24px;}
	#totalSrh .detBox .list .inp .due,
	#totalSrh .detBox .list .inp .date input,
	#totalSrh .detBox .list .inp .textB input{height:48px; font-size: 1.5rem;}
	#totalSrh .detBox .list .inp .due li button{font-size:1.5rem;}
	#totalSrh .detBox .list .inp .textB input::placeholder{font-size:1.5rem;}
}
@media all and (max-width:425px){
	#totalSrh .detBox{padding:40px 16px 16px;}
	#totalSrh .detBox .close{right:16px;}
	#totalSrh .detBox .list .inp .date{flex-wrap:wrap;}
	#totalSrh .detBox .list .inp .date label .txt{display:block;}
	#totalSrh .detBox .list .inp .date .mob{display:none;}
	#totalSrh .detBox .list .inp .date label{width:100%;}
	#totalSrh .detBox .btnW{flex-wrap:nowrap; justify-content:space-between;}
	#totalSrh .detBox .btnW .selectSrh{width:calc(100% - 48px);}
	#totalSrh .detBox .btnW .reset{width:40px; text-indent:-9999px; background:#f5f5f5;}
	#totalSrh .detBox .btnW .reset .micon{text-indent:0;}
}
/*추천검색어*/
#totalSrh .recom{display:flex; gap:8px; margin-top:24px;}
#totalSrh .recom .tit{display:inline-flex; align-items:center; gap:8px; font-family: 'SCD'; font-weight:600; }
#totalSrh .recom .tit::before{content:'★'; display:inline-block; color:var(--color-main); }
#totalSrh .recom .list{display:inline-flex; gap:8px; flex-wrap:wrap; }
#totalSrh .recom .list a{display:inline-flex; align-items:center; justify-content:center; padding:8px 16px; border-radius:100px; border:1px solid #ccc; color:#444; font-size:1.5rem;}
#totalSrh .recom .list a:hover{color:#111;}
@media all and (max-width:768px){
	#totalSrh .recom{flex-wrap:wrap;}
	#totalSrh .recom .list a{padding:0; border-radius:0; border:0; color:var(--color-main)}
}
@media all and (max-width:425px){
	#totalSrh .recom{margin-top:16px; gap:0;}
	#totalSrh .recom .list{gap:4px 8px;}
	#totalSrh .recom .list a{font-size: 1.3rem;}
}
/*통합검색 탭*/
#totalSrh .totalTab{display:flex; align-items:center; /*margin-top:24px;*/ margin-bottom:40px;}
#totalSrh .totalTab a{display:flex; align-items:center; justify-content:center; gap:8px; height: 60px; border-radius:16px 16px 0 0; background:#f5f5f5;border-bottom:2px solid var(--color-main); color:#444; text-decoration: none;}
#totalSrh .totalTab a.on{padding-bottom:2px; background:#fff; color:#111; font-weight: 600; border:2px solid var(--color-main); border-bottom:2px solid #fff;}
#totalSrh .totalTab > li{flex:1;}
#totalSrh .totalTab a{/*font-size:1.9rem;*/ line-height:1.2;}
#totalSrh .totalTab a .em{font-size:1.7rem;}
#totalSrh .totalTab a.on{position:relative; }
#totalSrh .totalTab a.on .em{color:var(--color-main);}

@media all and (max-width:1440px){
	#totalSrh .totalTab a{font-size:1.7rem;}
}
@media all and (max-width:1024px){
	#totalSrh .totalTab{flex-wrap: wrap; gap:4px; padding:16px; border-radius:8px; background:#f5f5f5;}
	#totalSrh .totalTab a{justify-content:space-between; padding:0 16px; height:48px; border-bottom:0; border:2px solid #f5f5f5; border-radius:8px; background:#fff; font-size:1.5rem; }
	#totalSrh .totalTab a .em{font-size:1.5rem;}
	#totalSrh .totalTab > li{flex:none; width:auto; min-width:150px;}
	#totalSrh .totalTab a.on{padding-top:2px; border:2px solid var(--color-main);}
}
@media all and (max-width:768px){

}
@media all and (max-width:425px){
	#totalSrh .totalTab{margin-top:16px;}
	#totalSrh .totalTab > li{width:calc(50% - 2px); min-width:auto;}
}
/*통합검색 결과 리스트*/
#totalSrh .resultBox{display:flex; gap:40px; margin-top:40px;}
#totalSrh .resultBox .result{display:flex; flex-direction:column; gap:40px; flex:1; }
#totalSrh .resultBox .topInfo{display:flex; align-items:flex-end; justify-content:space-between; flex-wrap:wrap; gap:8px 40px; padding-bottom:24px; border-bottom:1px solid #ccc;}
#totalSrh .resultBox .topInfo .resultTxt{font-size:1.9rem; font-weight:500; font-family: 'SCD';}
#totalSrh .resultBox .topInfo .resultTxt .em{font-weight:600; color:var(--color-main);}
#totalSrh .resultBox .topInfo .resultTxt .alert{font-size:1.5rem; font-weight:400; margin-top: 8px;}
#totalSrh .resultBox .topInfo .align{display:inline-flex; align-items:center; gap:16px; margin-left:auto;}
#totalSrh .resultBox .topInfo .align .tit{font-weight:600;}
#totalSrh .resultBox .topInfo .align a{color:#666; }
#totalSrh .resultBox .topInfo .align a.on{color:#111; text-decoration:underline;}
@media all and (max-width:1280px){
	#totalSrh .resultBox .topInfo .align{gap:12px; font-size:1.5rem;}
	#totalSrh .resultBox .topInfo{padding-bottom:8px;}
}
@media all and (max-width:1024px){
	#totalSrh .resultBox{display:flex; flex-direction:column;}
	#totalSrh .resultBox .topInfo{flex-direction:column; gap:40px;}
	#totalSrh .resultBox .topInfo .resultTxt{margin:auto; text-align:center;}
	#totalSrh .resultBox .topInfo .align{gap:12px; font-size:1.5rem;}
	#totalSrh .resultBox .topInfo{padding-bottom:8px;}
}
@media all and (max-width:425px){
	#totalSrh .resultBox{margin-top:24px; gap:40px;}
	#totalSrh .resultBox .topInfo{gap:24px;}
	#totalSrh .resultBox .topInfo .resultTxt{font-size: 1.7rem;}
	#totalSrh .resultBox .result{gap:24px;}
}
#totalSrh .resultBox > div:not(.etc){width: 100%;}
.result:not(:has(.menuList))::after {content: '검색 결과가 없습니다.'; display: flex; justify-content:center; align-items:center; padding: 40px; background: #f9f9f9; border: 1px solid #e9ecef; border-radius: 4px; color: #555;}

#totalSrh .resultBox .etc{display:flex; flex-direction:column; gap:24px; width:270px;}
#totalSrh .resultBox .etc > div{display:inline-block; padding:32px; border-radius:16px; border:1px solid #ccc; width:270px; }
#totalSrh .resultBox .etc > div .tit{margin-bottom:24px; font-family: 'SCD'; font-weight:600;}
#totalSrh .resultBox .etc .popular .list{display:flex; flex-direction:column; gap:8px;}
#totalSrh .resultBox .etc .popular .list li{display:inline-flex; gap:16px;}
#totalSrh .resultBox .etc .popular .list li a{overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
#totalSrh .resultBox .etc .popular .list li .num{display:inline-flex; align-items:center; justify-content:center; border-radius:4px; width:24px; height:24px; min-height: 24px; min-width: 24px;}
#totalSrh .resultBox .etc .popular .list li .num.em{background:var(--color-sub); color:#fff;}
@media all and (max-width:768px){
	#totalSrh .resultBox{gap:40px;}
	#totalSrh .resultBox .etc > div{padding:24px;}
}
@media all and (max-width:425px){
	#totalSrh .resultBox .etc > div{border-radius:8px;}
	#totalSrh .resultBox .etc .popular .list li{font-size: 1.5rem;}
}
#totalSrh .menuList{display:flex; flex-direction:column; gap:40px;}
#totalSrh .menuList .listT{display:flex; align-items:center; justify-content:space-between; gap:40px; padding:16px 0; border-bottom:2px solid #111; }
#totalSrh .menuList .listT .tit{display:inline-flex; align-items:center; gap:8px; font-weight:600; font-family: 'SCD'; font-size: 1.9rem;}
#totalSrh .menuList .listT .tit .em{color:var(--color-main);}
#totalSrh .menuList .listT .more{display:inline-flex; align-items:center; gap:0; font-family: 'SCD'; color:#444;}
#totalSrh .menuList .listB .relatLink{display:flex; flex-direction:column; gap:8px;}
#totalSrh .menuList .listB .relatLink a{color:var(--color-main); text-decoration: underline;}
#totalSrh .menuList .listB > .list{display:flex; flex-direction:column; gap:24px; padding:24px 0; border-bottom:1px solid #ccc; }
#totalSrh .menuList .listB > .list:first-child{border-top: 2px solid var(--color-main);}
#totalSrh .menuList .listB > .list .titW{display:flex; flex-direction:column; gap:24px; width:100%; min-width:0; overflow: hidden;}
#totalSrh .menuList .listB > .list .tit{display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp: 1; font-size: 1.9rem; font-weight:600; width:100%; overflow:hidden; text-overflow:ellipsis; word-break:break-all;}
#totalSrh .menuList .listB > .list .txt{display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp: 2; overflow:hidden; word-break:break-word; color:#444;}
#totalSrh .menuList .listB > .list .titW > .txt{width:100% !important;}
#totalSrh .menuList .listB > .list .fileList{display:flex; flex-direction:column; gap:8px;}
#totalSrh .menuList .listB > .list .fileList > li{display:inline-flex; align-items:center; gap:8px;}
#totalSrh .menuList .listB > .list .fileList > li .txt{color:var(--color-main);}
#totalSrh .menuList .listB > .list .link{color:#676767;}
@media all and (max-width:768px){
	#totalSrh .menuList .listB > .list{font-size:1.5rem;}
	#totalSrh .menuList .listB > .list .fileList > li{flex-wrap:wrap;}
	#totalSrh .menuList .listB > .list .fileList > li > i{flex:0 0 24px;}
	#totalSrh .menuList .listB > .list .fileList > li .txt{flex:1 1 calc(100% - 32px); min-width:0; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp: 1; overflow:hidden; }
	#totalSrh .menuList .listB > .list .fileList > li .btn{flex:0 0; padding:0 1.2rem; font-size:1.3rem; min-width:88px; height:3.2rem; }
	#totalSrh .menuList .listB > .list .fileList > li .btn:first-child{margin-left:24px;}
	#totalSrh .menuList .listB > .list .tit{font-size:1.7rem;}
}
@media all and (max-width:425px){
	#totalSrh .menuList{gap:24px;}
	#totalSrh .menuList .listT .tit{font-size:1.7rem;}
	#totalSrh .menuList .listB > .list .titW{gap:8px;}
	#totalSrh .menuList .listB > .list{gap:8px;}
	#totalSrh .menuList .listB > .list .fileList{gap:4px;}
	#totalSrh .menuList .listT .more{font-size:1.3rem;}
}
/* 검색필터 */
.popular p{font-size:2.1rem; font-weight:600; width: 100%; display:flex; align-items:center; justify-content: space-between;}
.popular p .micon{display:none;}
.filterList{display:flex; flex-direction: column; /*gap:32px;*/}
#totalSrh .resultBox .etc:has(.accordionItem) > div .tit{padding:24px 0; border-bottom: 1px dashed #dbdbdb; margin-bottom: 0;}
/* 검색대상 */
.accordionItem button{width: 100%;}
.accordionItem button .tit{display:flex; align-items: center; justify-content: space-between;}
.accordionItem .accordionWp .accordionCon .colLayout,
.accordionItem .accordionWp .accordionCon .chipGroup{display:flex; flex-direction: column; gap:8px; margin-top: 16px;}
.accordionItem .accordionWp .accordionCon .chipGroup{}
/* 기간 라디오 버튼 */
.accordionItem .accordionWp .accordionCon .chipGroup {display: flex; flex-direction:row; gap:8px; flex-wrap: wrap;}
.accordionItem .accordionWp .accordionCon .chipGroup .chip{width: calc(100% / 2 - 4px);}
.accordionItem .accordionWp .accordionCon .chipGroup .chip input[type="radio"] {position: absolute; opacity: 0; width: 0; height: 0;}
.accordionItem .accordionWp .accordionCon .chipGroup .chip label {display: inline-block; width: 100%; padding: 0.5em 1.2em; border: 1px solid #ccc; border-radius:4px; background-color: #fff; color: #333; text-align:center; cursor: pointer; transition: background-color 0.2s, border-color 0.2s, color 0.2s;}
.accordionItem .accordionWp .accordionCon .chipGroup .chip label:hover { border-color: #666;}
.accordionItem .accordionWp .accordionCon .chipGroup .chip input[type="radio"]:checked + label {background-color: #005fcc; border-color: #005fcc; color: #fff;}
.accordionItem .accordionWp .accordionCon .chipGroup .chip input[type="radio"]:focus-visible + label {outline: 3px solid #005fcc; outline-offset: 2px;}
/* 검색기간 */
.date-range li label{color:var(--color-text2);}
.date-range .endDt{margin-top:8px;}
.btnFilter div{width: 100%;}
.btnFilter div a{width: 50%; min-width:auto;}
@media all and (max-width:1260px){
	.popular p .micon{display:block;}
	#totalSrh .resultBox{flex-direction:column;}
	#totalSrh .resultBox .etc,
	#totalSrh .resultBox .etc > div{width: 100%;}
	#totalSrh .resultBox .etc > div{padding:24px;}
	.accordionItem{display:flex; flex-direction:column;}
	#totalSrh .resultBox .etc:has(.accordionItem) > div .tit{border-bottom:none; padding-bottom:8px;}
	.accordionItem button .micon{display:none !important;}
	.accordionItem .accordionHeader{}
	.accordionItem .accordionWp{width: 100%;}
	.accordionItem .accordionWp .accordionCon .form-field{width: 100%;}
	.accordionItem .accordionWp .accordionCon .colLayout, 
	.accordionItem .accordionWp .accordionCon .chipGroup{flex-direction:row; flex-wrap: wrap; margin-top:0;}
	.accordionItem .accordionWp .accordionCon .colLayout{gap:8px 24px;}
	.accordionItem .accordionWp .accordionCon .chipGroup{gap:8px;}
	.accordionItem .accordionWp .accordionCon .chipGroup .chip{width: calc(100% / 4 - 8px);}
	.date-range{display:flex; gap:8px; flex-wrap:wrap;}
	.date-range li{width: calc(100% / 2 - 4px);}
	.date-range li input{width: 100%; margin-top:4px;}
	.date-range .endDt{margin-top:0;}
	.btnFilter{justify-content: center;;}
	.btnFilter div{width: 320px;}
	#totalSrh .resultBox:has(.recomCont) .etc{flex-direction:row;}
}
@media all and (max-width:568px){
	#totalSrh .resultBox:has(.recomCont) .etc{flex-direction:column;}
	#totalSrh .resultBox .etc > div{padding:16px;}
}
@media all and (max-width:500px){
	.popular p{font-size:1.9rem;}
	.accordionItem .accordionWp .accordionCon .chipGroup .chip{flex:1;}
	.btnFilter div{width: 100%;}
}




/*?마이페이지*/