@charset "utf-8";

/*
	Layout CSS
	Header, Footer, Sub 페이지의 layout에 해당하는 것들을 모아두었습니다.
*/

/* SKIP */
#skip a{position:absolute; left:-9999px;}

/* ROOT */
#root{position:relative; width:100%;}

/* Content Layout */
.layout{max-width: 900px; margin: 0 auto;}


/* header layout -------------------------------------------------------------------------------------------------------------------------------------*/
#header{position:fixed; top:0; left:0; width:100%; height:auto; background:#fff;  z-index:500}
#header .header_wrap{position:relative; max-width:1400px; width:97%; min-width:320px; margin:0 auto; padding:16px 260px 0px 0;}
#header .header_wrap .header_logo{float:left; position:relative; z-index:1000; margin-top:14px;}
#header .header_wrap .header_logo a{display:block; font-size:2.133em; line-height:50px; font-weight:700; color:#252525;}
#header .header_wrap .header_logo img{height:50px;}
#header .header_wrap .header_sub_logo{float:right; font-size:1.467em; line-height:50px; font-weight:300; color:#aaa; letter-spacing:-0.02em}

#header .gnb{position:absolute; top:15px; right:0;}
#header .gnb ul{}
#header .gnb ul li{float:left;}
#header .gnb ul li a{display:block; padding-left:20px; font-size:0.8em; line-height:1.2em; color:#888; text-transform:uppercase;}

.quick_menu{position:fixed; right:20px; top:20%; background:#014099; color:#fff; overflow:hidden; box-shadow:3px 3px 8px rgba(0,0,0,0.21); z-index:999;}
.quick_menu div{border-bottom:1px dashed #e5e5e5;}
.quick_menu div:last-child{border-bottom:none;}
.quick_menu div a{display:block; height:100%; text-align:center; padding:25px 40px; transition:0.1s;}
.quick_menu span{display:block; margin-top:12px; font-family:'title'; transform : rotate(0.04deg); font-size:15px; line-height:19px;}
.quick_menu div a:hover{background:#002b69;}
.quick_menu div a:hover span{color:#fff;}
.quick_menu.mb{display:none; position:unset; margin-top:30px; box-shadow:none;}
.quick_menu.mb div{width:50%;}
.quick_menu.mb div:nth-child(odd){border-right:1px dashed #fff;}
.quick_menu.mb div a{padding:15px 10px;}
.quick_menu.mb span{font-size:14px; line-height:18px;}


/* navi */
#lnb{position:relative; width:100%; height:auto; margin-top:9px;}
#lnb .btn_all_lnb{display:none; width:35px;}
#lnb .btn_all_lnb img{width:100%}

#lnb .lnb_wrap{max-width:1400px; width:100%;  margin:0 auto; text-align:center; display:block; padding-left:329px;}
#lnb .lnb_wrap .lnb_d1{position:relative; border-right:1px solid #eee}
#lnb .lnb_wrap .lnb_d1 li{float:left; position:relative; width:14.285%; border-left:1px solid #f1f1f1; }
#lnb .lnb_wrap .lnb_d1 li a{display:block; position:relative; font-size:1.067em; line-height:50px; color:#333; letter-spacing:-0.01em; transition:all 0.3s; -webkit-transition:all 0.3s; -ms-transition:all 0.3s; }
#lnb .lnb_wrap .lnb_d1 > li > a:after{display:block; position:absolute; bottom:0; left:50%; width:0; height:7px; background:#ffc32a; content:""; transform:translateX(-50%); -webkit-transform:translateX(-50%); -ms-transform:translateX(-50%); transition:all 0.3s; -webkit-transition:all 0.3s; -ms-transition:all 0.3s; }
#lnb .lnb_wrap .lnb_d1 > li > a:hover{color:#ffc32a; }
#lnb .lnb_wrap .lnb_d1 > li:hover > a:after{width:100%; }
#lnb .lnb_wrap .lnb_d1_on > li:hover > a{color:#ffc32a;}

#lnb .lnb_wrap .lnb_d2{display:none; position:absolute; top:50px; left:0; width:100%; min-height:120px; padding:15px 0; z-index:99999;}
#lnb .lnb_wrap .lnb_d2 li{float:none; display:block; width:100%; padding:0; border:0 none;}
#lnb .lnb_wrap .lnb_d2 li a{width:100%; padding:0 10px; font-size:0.867em; line-height:40px; font-weight:600; color:#333; text-align:center; }
#lnb .lnb_wrap .lnb_d2 li a:hover{color:#b8880f; }

#lnb .lnb_wrap .lnb_d3{display:none;}

#lnb .navi_none{display:none !important;}

.bg_navi{display:none; position:absolute; top:50px; width:100%; height:150px; border-top:1px solid #dcdcdc; border-bottom:1px solid #333; background:#fff; z-index:9999;}

.NAV {display:flex; flex-direction:row; flex-wrap:nowrap; align-items:center;}
.NAV > li{flex:1; position:relative;}
.NAV > li::before{content:''; display:block; width:0; height:100%; background:#379b67; transition:0.5s; position:absolute; left:0; top:0; z-index:-1;}
.NAV > li.sort2::before{background:#194889;}
.NAV > li.sort3::before{background:#7d42b3;}

.NAV > li:hover::before{width:100%;}
.NAV > li:hover > a{color:#fff;}


.NAV a{display: block;}
.NAV > li > a{padding: 25px 0; font-weight:500; font-size:23px; font-family: 'title';}
.NAV .sNAV{display:none; flex-direction:column; flex-wrap:nowrap; justify-content:flex-start; align-items:center; font-size:0.9em; width:100%; border-top:1px solid #dcdcdc; border:1px solid #dbdbdb; border-top:none; background:#fff;position:absolute;}
.NAV .sNAV li{width: 100%;}
.NAV .sNAV a{padding: 15px 0; transform : rotate(0.04deg); font-weight:500; }
.NAV .sNAV a:hover{background: #f2f0ea; color:#352200;}
.NAV .None{display:none !important;} /* 숨김속성 */

/* Depth3 */
.NAV .depth2{position: relative;}
.NAV .depth2 .sNAV{left: 100%; top: 0;}

.NAV .depth2:hover > .sNAV{display:block;}


.h_search{position:absolute; right:0; bottom:17px;}
.search_wr{border:3px solid #014099; border-radius:50px; width:fit-content; padding:0 10px;}
.search_input{border:none; background:transparent; font-size:15px; width:125px;}
.search_submit{background:#fff url('/img/202503/common/search_submit.svg') center no-repeat; width:21px; height:21px; cursor:pointer; background-size:cover !important; border:none;}
.search_select{display:none;}


.h_search_mb{display:none; position:unset; width:fit-content; margin:0 auto;}

/* body */
#container{position:relative; margin-top:102px;}


/* sub location*/
#sub_loca{display:none; width:100%; border-bottom:1px solid #ddd}
#sub_loca .loca_wrap{width:100%; margin:0 auto; border-left:1px solid #eee;}
#sub_loca .loca_wrap li{float:left; position:relative; background:url(/img/common/acco_arr.png) no-repeat 95% 50%; background-size:auto 7px; border-right:1px solid #eee; font-size:1.133em; line-height:20px}
#sub_loca .loca_wrap li a{display:block; padding:20px; }
#sub_loca .loca_wrap li.home{background:0 none; }
#sub_loca .loca_wrap li.home img{height:20px}
#sub_loca .loca_wrap li.depth01{width:300px;}
#sub_loca .loca_wrap li.depth02{width:300px;}
#sub_loca .loca_wrap li .loca_list{position:absolute; top:60px; left:0; width:100%; background:#fff; z-index:100; box-shadow: 5px 5px 10px rgba(0,0,0,0.05);}
#sub_loca .loca_wrap li .loca_list a{display:block; padding:12px 15px; border-top:1px solid #eee; font-size:0.882em; }
#sub_loca .loca_wrap li .loca_list a.on{color:#d04443}
#sub_loca .loca_wrap li .loca_list a:hover{background: #f9f9f9;}

/* sub layout -------------------------------------------------------------------------------------------------------------------------------------*/

/* sub visual */
#sub_visual{display:none;}
/*#sub_visual h2{text-align: center; font-size: 30px; text-transform: uppercase; font-weight: bold; padding: 50px 0;}*/

/* sub navi*/
#sub_wrap{width:100%; height:auto; padding-top:162px; background:url(/img/Demo/common/sub_tit_bg.gif) no-repeat 50% 0;}
#sub_wrap .sub_title{max-width:1200px; width:98%; height:100px; margin:0 auto; font-size:2.308em; line-height:1em; font-weight:700; color:#224669;}
#sub_wrap .snb{}
#sub_wrap .snb .snb_wrap{max-width:1200px; width:100%; min-width:320px; margin:15px auto;}
#sub_wrap .snb .snb_wrap li{float:left; width:220px; margin-right:-1px;}
#sub_wrap .snb .snb_wrap li a{display:block; position:relative; border:1px solid #ddd; background:#eee; font-size:1.154em; line-height:40px; text-align:center;}
#sub_wrap .snb .snb_wrap li a:hover{background:#f2f3f4; border:1px solid #859bbc; color:#859bbc; z-index:50;}
#sub_wrap .snb .snb_wrap li a.on{background:#fff; border:1px solid #4880d5; color:#4880d5; z-index:50;}

/* body_title */
.b_cont_title{position:relative; max-width:1920px; margin:0 auto; height:400px; background-size:cover !important;}
.b_cont_title .layout{position:relative; height:100%; }
.wz_visual138{background:url('/img/202506/sub/sub_visual01.jpg') center no-repeat;}
.wz_visual139{background:url('/img/202506/sub/sub_visual02.jpg?2') center no-repeat;}
.wz_visual140{background:url('/img/202506/sub/sub_visual03.jpg') center no-repeat;}
.wz_visual141{background:url('/img/202506/sub/sub_visual04.jpg') center no-repeat;}
.wz_visual142{background:url('/img/202506/sub/sub_visual05.jpg') center no-repeat;}
.wz_visual143{background:url('/img/202506/sub/sub_visual06.jpg') center no-repeat;}
.wz_visual144{background:url('/img/202506/sub/sub_visual07.jpg') center no-repeat;}
.wz_visual145{background:url('/img/202506/sub/sub_visual08.jpg') center no-repeat;}
.wz_visual146{background:url('/img/202506/sub/sub_visual09.jpg') center no-repeat;}
.wz_visual147{background:url('/img/202506/sub/sub_visual10.jpg') center no-repeat;}

.wz_visual_list{background:url('/img/202503/sub/sub_visual.jpg') center no-repeat;}
.wz_visual_story{background:url('/img/202503/sub/sub_visual.jpg') center no-repeat;}


.sg_contents{margin:40px auto 80px;}
.sg_contents p{line-height:28px; letter-spacing:-0.7px; text-align:justify;}
.sg_contents dl, .sg_contents li{letter-spacing:-0.7px;}
.sg_contents dt,.sg_contents dd{line-height:28px;}
.event{padding:50px 0;}
.sub h2{letter-spacing:-1px; max-width:1280px; font-size: 34px; line-height:45px; font-weight: 500; color: #222;position: relative; text-align:center; word-break:keep-all;}
.sub h2 span{display:block; line-height:normal; text-align:center; background:#fff; font-weight:700; margin:0 auto 30px; border:1px solid #77557c; border-radius:70px; padding:5px 13px; width:fit-content; font-size:17px;}
.sub h2 span.s_tit{margin:10px auto 0; background:#fff; border-radius:0; padding:0; font-family:'title'; color:#222; font-size:smaller; font-weight:500;}
.sub h2 b{display:block; width:fit-content; margin:0 auto; font-weight:900; font-size:37px;}
.sub h2 small{display:block; font-size:22px; margin:11px 0; line-height:29px;}
.cont_title{margin-bottom:65px;}
.cont_title p{font-size:22px; font-weight:600; text-align:center; margin-top:8px; line-height:32px;}
.cont_title p.edit_info{text-align:center !important; font-size:19px; font-weight:500; margin-top:25px; line-height:30px;}
.cont_title p.edit_info b{margin-right:2px; font-weight:700;}


.event .cont_title{margin-bottom:40px;}

.sub h3{font-size:25px; font-weight: 700; word-break:keep-all; margin-bottom:20px;}

.sub h4{position: relative; clear:both; margin:30px 0 15px; font-size:1.3rem; line-height:1.3em; font-weight:500; color:#222; padding-left: 20px;}
.sub h4:first-of-type{margin:25px 0 15px}
.sub h4::before{content: ''; position: absolute; top: 10px; left: 0; width: 8px; height: 8px; border: 2px solid #ddd;}
.sub h4::after{content: ''; position: absolute; width: 4px; height: 4px; background: #0072bc; top: 18px; left: 8px;}

.sub h5{clear:both; position:relative; margin:20px 0 10px; padding-left:10px; font-size:1.385em; line-height:1.3em; font-weight:500; color:#222;}
.sub h5::before{content:""; position:absolute; top: 10px; left:0; width:2px; height: 10px; margin-right:7px; background:#0072bc; transform: rotate(20deg);}
.sub h5:first-of-type{margin:15px 0 10px } 

/* body*/
#body_wrap{width:100%;height:auto; min-height:650px; margin:0 auto;}
#body_wrap .body_title_wrap{display:none; position:relative; width:100%; }
#body_wrap .body_title_wrap .body_title{padding:20px 0 10px; border-bottom:1px solid #ddd; font-size:1.538em; line-height:1.4em;}
#body_wrap .body_title_wrap .location{position:absolute; top:30px; right:0px; font-size:0.85em; color:#888; line-height:20px; }
#body_wrap .body_title_wrap .location .home{display:inline-block; width:12px; height:20px; background:url(/img/common/loca_home.png) no-repeat 0 5px; background-size:12px auto; text-indent:-9999px; vertical-align:top }
#body_wrap .body_title_wrap .location span{display:inline-block; width:auto; padding-left:17px; background:url(/img/common/loca_arr.png) no-repeat 8px 7px; background-size:auto 8px; vertical-align:top}

#body_wrap .body_content{min-height:800px;}

#top_arr{display:none; position:fixed; bottom:30px; right:30px; width:50px; height:50px; background:rgba(0,0,0,0.6) url(/img/common/top_arr.png) no-repeat 50% 50%; background-size:20px auto; 
	text-indent:-9999px; z-index:99999;}


/* footer layout -------------------------------------------------------------------------------------------------------------------------------------*/
#footer{max-width:1920px; width:100%; margin:0 auto; padding:30px 0; background:#1c1c1c;}
#footer .layout{justify-content:space-between; max-width:1200px;}
#footer .footer_wrap img{width:266px;}
#footer .footer_wrap p{display:inline-block; vertical-align:bottom; transform : rotate(0.04deg); color:#fff;}
#footer .f_logo{margin-bottom:20px;}


/* ----------------------------------------- Media Query ----------------------------------------- */

@media only screen and (max-width : 1600px) {
	.quick_menu{background:rgba(1,64,153,0.68);}
}



@media only screen and (max-width : 1400px) {
	#lnb .lnb_wrap{padding-left:288px;}

}



@media only screen and (max-width : 1290px) {
	.quick_menu div a{padding:20px 35px;}
	.quick_menu div a img{height:30px;}

	/* Content Layout */
	.layout{padding: 0 25px; box-sizing: border-box;}

	/* Header */
	#lnb .lnb_wrap .lnb_d1 li a{font-size:1em;}

	
	/* Header */
	#lnb .lnb_wrap{display:block;}
	.NAV {flex-direction:row;}

	/* Sub */
	#sub_wrap .snb,
	#sub_wrap .snb .snb_wrap li{width:25%}
}


@media only screen and (max-width : 1200px) {

	/* Header */
	#header{background: #fff; box-shadow: none; }
	#header .header_wrap{background: #fff; width:100%;}
	#header.lnb_mobile{width:100%; /*height:1500px;*/ /*background:none;*/ z-index:6000 !important; }
	#header .header_wrap{padding:15px 0;}
	#header .header_wrap .header_logo{margin-left:20px; margin-top:0;}
	#header .header_wrap .header_logo a{font-size:1.714em; line-height:35px}
	#header .header_wrap .header_logo img{height:32px;}
	#header .header_wrap .header_sub_logo{display:none;}
	#header .gnb{display:none;}
	
	#lnb{float:none; width:100%; clear:both; border:0 none; }
	#lnb .btn_all_lnb{display:block; position:absolute; top:-30px; right:15px; width:31px; height:28px; text-indent:-9999px; z-index:5000; transition:all 0.3s}
	#lnb .btn_all_lnb span{display:block; position:absolute; top:12px; left:0; width:100%; height:3px; margin-top:-1px; background:#333; z-index:5000; }
	#lnb .btn_all_lnb span.top{top:0; left:0; }
	#lnb .btn_all_lnb span.bot{top:24px; left:0; }
	
	#header.lnb_mobile #lnb .btn_all_lnb span{color:#fff}
	#header.lnb_mobile #lnb .btn_all_lnb span.midd{opacity:0;}
	#header.lnb_mobile #lnb .btn_all_lnb span.top{transform: rotate(45deg) translate(13px, 4px);}	
	#header.lnb_mobile #lnb .btn_all_lnb span.bot{transform: rotate(-45deg) translate(13px, -4px);}
	
	#lnb .lnb_wrap{position: absolute; left: -280px; width:280px; padding-top:50px; height: 100vh; background: #fff; margin: 0; z-index: 99999; transition: .5s; padding-left:0;}
	#lnb .lnb_wrap.open{left: 0;}
	#lnb .lnb_wrap .lnb_d1 li{float:none; width:96%; margin:0 auto; padding:0 10px; border:0 none; text-align:left}
	#lnb .lnb_wrap .lnb_d1 li a{display:inline-block; position:relative; padding:0 5px; line-height:50px}
	#lnb .lnb_wrap .lnb_d1 > li:hover > a{color:#333; }
	#lnb .lnb_wrap .lnb_d1 > li:hover > a:before{display:block; position:absolute; top:23px; left:0; width:100%; height:6px; background:#ffdc84; z-index:-1; content:""}
	#lnb .lnb_wrap .lnb_d1 > li > a:after{display:none; }
	#lnb .lnb_wrap .lnb_d2{position:relative; top:0; left:0; }
	#lnb .lnb_wrap .lnb_d2 li{padding:0; }
	#lnb .lnb_wrap .lnb_d2 li a{padding-left:30px; border-left:4px solid #96bde6;  line-height:40px; font-weight:400; color:#6ca0cf; text-align:left}
	#lnb .bg_navi{display: block; top: 16px; width: 100%; height: 100vh; background: rgba(0, 0, 0, 0.7); border: none; opacity: 0; visibility: hidden; transition: .5s;}
	#lnb .bg_navi.open{opacity: 1; visibility: visible;}

	.NAV > li.sort1:hover{background:#379b67;}
	.NAV > li.sort2:hover{background:#194889;}
	.NAV > li.sort3:hover{background:#7d42b3;}
	.NAV > li.sort4:hover{background:#379b67;}
	.NAV .sNAV{font-size:1rem;}

	.h_search{bottom:11px; right:72px;}

	.NAV .sNAV{border: none; background: #f9f9f9; position: relative;}
	.NAV .depth2 .sNAV{left: 0;}
	.NAV li:hover > .sNAV {display:none; position:initial;}
	.NAV > li{width: 100%;}
	.NAV > li::before{display:none;}
	.NAV > li > a{padding:20px 0; font-size:20px;}
	
	.NAV {flex-direction:column;}

	#container{margin-top: 65px;}
}



@media only screen and (max-width : 1000px) {
	.quick_menu{display:none;}
	.quick_menu.mb{display:flex; flex-wrap:wrap; background:#014099;}

	.search_w{border:2px solid #014099;}

	.sg_contents{margin:40px auto;}
	.sg_contents dl,
	.sg_contents dt, .sg_contents dd,
	.sg_contents li,
	.sub_cont_wrap p
	{line-height:23px;}
	.b_cont_title{height:200px; padding:0 20px;}
	.sg_contents p{line-height:24px;}

	.sub h2 span{font-size:13px; padding:2px 10px; margin:0 auto 19px;}
	.sub h2{font-size:23px; line-height:25px;}
	.sub h2 b{font-size:27px; margin:8px auto 0; line-height:31px;}
	.sub h2 small{font-size:14px; line-height:20px;}

	.cont_title{margin-bottom:40px;}
	.cont_title p{font-size:15px; line-height:21px;}
	.cont_title p.edit_info{font-size:14px; line-height:19px; margin:25px auto 0; width:326px;}
	.cont_title p.edit_info b{font-size:15px;}
	.sub h3{font-size:16px;}

	.search_wr input.search_input{width:148px;}

	.footer_wrap img{width:150px; margin-right:14px;}
	#footer .f_sns a{margin-right:7px;}
	.f_sns a img{width:28px;}
	#footer .footer_wrap p{font-size:14px;}
}




@media only screen and (max-width : 800px) {
	/* Footer */
	#footer{padding:15px 0;}
	.footer_wrap{width:100%; order:2;}
	.f_sns{width:100%; order:1; text-align:right; margin-bottom:20px;}
	#footer .footer_wrap p{display:block; margin-top:14px;}


}

@media only screen and (max-width : 700px) {

	/* Sub */
	#sub_loca .loca_wrap li, #sub_loca .loca_wrap li.depth01, #sub_loca .loca_wrap li.depth02{width: 50%;}
	#sub_loca .loca_wrap li.depth02{border-right: none;}

    /* Footer */
    #footer .ft_nav{display: flex; justify-content: space-between;}
    #footer .ft_nav li{width: 49%;}
    #footer .ft_nav li a{width: 100%;}

	.wz_visual93{background-position:35% 100%;}
}


@media only screen and (max-width : 600px) {
	.h_search{display:none;}
	.h_search_mb{display:block; margin-top:20px;}

	#lnb .btn_all_lnb{top:-31px;}
}