@charset "utf-8";


/* layout */
html, body { height:100%;}
body { color:#686868; letter-spacing:-.05em; -webkit-text-size-adjust:none; -webkit-font-smoothing:antialiased;}
#wrap {	position:relative; width:100%; min-width:320px;height:100%; font-size:1rem; }
.w-inner {	width:1720px;	position:relative;	margin-left:auto;	margin-right:auto;}
.inner {	width:1480px;	position:relative;	margin-left:auto;	margin-right:auto;}


@media all and (max-width:1719px) {	
	.w-inner {width:94%;}
}
@media all and (max-width:1479px) {	
	.inner {width:94%;}
}


/* header */
#header{position: fixed; top: 0; left: 0; width: 100%; z-index: 9999; height: 100px; background-color: #fff; border-bottom: 1px solid #ececec;}
#header.bg::before{content: ''; height: 288px; width: 100%; position: absolute; top: 100px; left: 0; display: block; z-index: 997; background-color: #fff;}
#header .w-inner{display: flex; justify-content: space-between; align-items: center;}
#header .w-inner .l_cont{display: flex; align-items: center; gap:65px;}
#header .w-inner .l_cont #logo{}
#header .w-inner .l_cont #logo a{display: block; width: 219px; height: 56px; background: url(/images/common/logo.webp) no-repeat center center / contain;}
#header .w-inner .pcGnb{}
#header .w-inner .pcGnb > ul{display: flex; align-items: center;}
#header .w-inner .pcGnb > ul > li{position: relative;}
#header .w-inner .pcGnb > ul > li > div{}
#header .w-inner .pcGnb > ul > li > div > a{color: #000000; font-size: 18px; font-weight: 500; line-height: 100px; padding: 0 40px;}
#header .w-inner .pcGnb > ul > li:hover > div > a{color: #1d2088;}
#header .w-inner .pcGnb > ul > li > ul{padding:30px 35px; display: none; position: absolute; min-width: max-content; z-index: 998;}
#header .w-inner .pcGnb > ul > li > ul > li{}
#header .w-inner .pcGnb > ul > li > ul > li + li{margin-top: 15px;}
#header .w-inner .pcGnb > ul > li > ul > li > a{font-size: 16px; font-weight: 500; color: #555555;}
#header .w-inner .pcGnb > ul > li > ul > li:hover > a{color: #1d2088; text-decoration: underline; text-underline-position: under;}
#header .w-inner .r_cont{display: flex; align-items: center; gap:20px;}
#header .w-inner .r_cont .btn_box{display: flex; align-items: center; gap:12px;}
#header .w-inner .r_cont .btn_box .lang_box{display: flex; align-items: center; border: 1px solid #858585; border-radius: 50px; padding: 5px;}
#header .w-inner .r_cont .btn_box .lang_box li{}
#header .w-inner .r_cont .btn_box .lang_box li.on{}
#header .w-inner .r_cont .btn_box .lang_box li a{font-size: 12px; font-weight: 700; color: #000; width: 30px; height: 30px; display: inline-flex; justify-content: center; align-items: center;}
#header .w-inner .r_cont .btn_box .lang_box li.on a{background-color: #000; color: #fff; border-radius: 100%;}
#header .w-inner .r_cont .btn_box > a.btn{background-color: #000; color: #fff; height: 42px; display: inline-flex; border-radius: 30px; justify-content: center; align-items: center; padding: 0 16px; font-size: 13px; font-weight: 400; border: 1px solid transparent;}
#header .w-inner .r_cont .btn_box > a.btn i{margin-right: 6px; font-size: 24px;}
#header .w-inner .r_cont .menuToggle{width: 28px; height: 20px; display: flex; flex-direction: column; justify-content: space-between; cursor: pointer;} 
#header .w-inner .r_cont .menuToggle span{height: 2px; background-color: #000;}
#header .w-inner .r_cont .menuToggle span.t{}
#header .w-inner .r_cont .menuToggle span.m{}
#header .w-inner .r_cont .menuToggle span.b{width: 78.5%; margin-left: auto;}


.fp-viewing-on #header{background: transparent; border-bottom: 1px solid rgba(255,255,255,0.2);}
.fp-viewing-on #header .w-inner .l_cont #logo a{background: url(/images/common/logo_w.webp) no-repeat center center / contain;}
.fp-viewing-on #header .w-inner .pcGnb > ul > li > div > a{color: #fff;}
.fp-viewing-on #header .w-inner .r_cont .btn_box .lang_box{border-color: #828991;}
.fp-viewing-on #header .w-inner .r_cont .btn_box .lang_box li a{color: #fff;}
.fp-viewing-on #header .w-inner .r_cont .btn_box .lang_box li.on a{background-color: #fff; color: #000;}
.fp-viewing-on #header .w-inner .r_cont .btn_box > a.btn{color: #fff; background: transparent; border:1px solid #828991;}
.fp-viewing-on #header .w-inner .r_cont .btn_box > a.btn i{}
.fp-viewing-on #header .w-inner .r_cont .menuToggle span{background-color: #fff;}


.fp-viewing-on #header:hover{background: #fff; border-bottom: 1px solid #ececec;}
.fp-viewing-on #header:hover .w-inner .l_cont #logo a{background: url(/images/common/logo.webp) no-repeat center center / contain;}
.fp-viewing-on #header:hover .w-inner .pcGnb > ul > li > div > a{color: #000;}
.fp-viewing-on #header:hover .w-inner .r_cont .btn_box .lang_box{border-color: #858585;}
.fp-viewing-on #header:hover .w-inner .r_cont .btn_box .lang_box li a{color: #000;}
.fp-viewing-on #header:hover .w-inner .r_cont .btn_box .lang_box li.on a{background-color: #000; color: #fff;}
.fp-viewing-on #header:hover .w-inner .r_cont .btn_box > a.btn{color: #fff; background: #000; border:1px solid transparent;}
.fp-viewing-on #header:hover .w-inner .r_cont .btn_box > a.btn i{}
.fp-viewing-on #header:hover .w-inner .r_cont .menuToggle span{background-color: #000;}


@media all and (max-width:1720px){
	#header.bg::before{height: 278px;}
	#header .w-inner .l_cont{gap:30px;}
	#header .w-inner .l_cont #logo a{width: 188px;}
	#header .w-inner .pcGnb > ul > li > div > a{font-size: 19px; padding: 0 30px;}
	#header .w-inner .pcGnb > ul > li > ul{padding: 25px 30px;}
}
@media all and (max-width:1480px){
	#header{height: 80px;}
	#header .w-inner{height: 100%;}
	#header .w-inner .pcGnb{display: none;}
	#header .w-inner .r_cont .btn_box{gap:10px;}
	#header .w-inner .r_cont .btn_box > a.btn i{margin-right: 5px; font-size: 22px;}
}
@media all and (max-width:1024px){}
@media all and (max-width:768px){
	#header{height: 66px;}
	#header .w-inner .l_cont #logo a{width: 156px;}
	#header .w-inner .r_cont .btn_box > a.btn{display: none;}
	#header .w-inner .r_cont .btn_box .lang_box{padding: 4px;}
	#header .w-inner .r_cont .btn_box .lang_box li a{font-size: 11px; width: 28px; height: 28px;}
	#header .w-inner .r_cont .menuToggle{height: 18px; width: 25px;}
}
@media all and (max-width:500px){
}


.mo_bg{position: fixed; top: 0; left: 0; width: 100%; height: 100vh; backdrop-filter:blur(0px);pointer-events: none; z-index: 999; transition: .4s;}
.mo_bg.on{backdrop-filter:blur(10px);}


/* moGnb */
.moGnb{background:linear-gradient(140deg, #327fb7, #1d2088); position: fixed; top: -100%; left: 0; width: 100%; height: 100dvh; z-index: 999; display: flex; justify-content: center; align-items: center; transition: .4s; display: flex; flex-direction: column; gap:50px;}
.moGnb.on{top: 0;}
.moGnb .close{cursor: pointer; color: #fff; width: 60px; height: 60px; border-radius: 100%; display: flex; justify-content: center; align-items: center; font-size: 24px; font-weight: 300; border: 1px solid #fff; line-height: 1em;  transition: .4s linear; transform-origin: center center;}
.moGnb .close:hover{transform: rotate(180deg)}
.moGnb .register{display: none;}
.moGnb ul.gnb{max-width: 1400px; margin: 0 auto; display: flex; gap:40px; justify-content: space-between; width: 100%; padding-top: 50px; border-top: 2px solid rgba(255,255,255,0.2);}
.moGnb ul.gnb > li{width: 100%; text-align: center;}
.moGnb ul.gnb > li > div{ margin-bottom: 30px;}
.moGnb ul.gnb > li > div > a{font-size: 24px; color: #fff; font-weight: 700;}
.moGnb ul.gnb > li > ul{}
.moGnb ul.gnb > li > ul > li{}
.moGnb ul.gnb > li > ul > li + li{margin-top: 20px;}
.moGnb ul.gnb > li > ul > li a{font-size: 17px; color: #fff; font-weight: 500; opacity: 0.9;}
.moGnb ul.gnb > li > ul > li:hover a{opacity: 1;}
.moGnb ul.gnb > li > ul > li > ul{margin-top: 15px;}
.moGnb ul.gnb > li > ul > li > ul > li{margin-top: 10px;}
.moGnb ul.gnb > li > ul > li > ul > li > a{ font-weight: 200; font-size: 15px; position: relative; padding-left: 10px;}
.moGnb ul.gnb > li > ul > li > ul > li > a::before{content: '-'; position: absolute; left: 0; top: 0;}
.moGnb .btn_box{display: none;}
.moGnb .btn_box > a.btn{background-color: #fff; color: #000; height: 42px; display: inline-flex; border-radius: 30px; justify-content: center; align-items: center; padding: 0 16px; font-size: 13px; font-weight: 400; border: 1px solid transparent;}
.moGnb .btn_box > a.btn + a.btn{margin-left: 10px;}
.moGnb .btn_box > a.btn i{margin-right: 6px; font-size: 24px;}

@media all and (max-width:768px){
	.moGnb{flex-direction: column; align-items: flex-start; padding: 0 40px; justify-content: flex-start; overflow-y: scroll; padding-bottom: 80px; padding-top: 120px; gap:0px;}
	.moGnb .register{display: flex; align-items: center; gap:20px; padding-top: 50px;}
	.moGnb .register li{}
	.moGnb .register li a{color: #fff; font-size: 15px;}
	.moGnb .close{border: 0px; left: auto; transform: translateX(0); right: 3%; top: 30px; font-size: 28px; display: none;}
	.moGnb ul.gnb{flex-direction: column; gap:0px; padding-top: 15px; margin-top: 30px;}
	.moGnb ul.gnb > li{text-align: left;}
	.moGnb ul.gnb > li + li{}
	.moGnb ul.gnb > li > div{margin-bottom: 0; cursor: pointer;}
	.moGnb ul.gnb > li > div > a{ padding: 15px 0; display: block; position: relative; font-size: 18px; pointer-events: none; border-bottom: 1px solid rgba(255,255,255,0.15);}
	.moGnb ul.gnb > li > div > a::after{content: '+'; position: absolute; right: 0; top: 50%; transform: translateY(-50%);}
	.moGnb ul.gnb > li.on > div > a::after{content: '-';}
	.moGnb ul.gnb > li > ul{display: none; padding: 20px; border-bottom: 1px solid rgba(255,255,255,0.15);}
	.moGnb ul.gnb > li > ul > li{}
	.moGnb ul.gnb > li > ul > li > a{font-size: 16px; font-weight: 300;}
	.moGnb ul.gnb > li > ul > li > ul{display: none;}
	.moGnb .btn_box{display: flex;}
}


/* footer */
#footer {background: url(/images/common/footer_bg.webp) no-repeat center center / cover; padding:50px 0 150px;}
#footer .inner{}
#footer .inner .top{border-bottom: 1px solid rgba(255,255,255,0.2); padding-bottom: 30px; margin-bottom: 75px;}
#footer .inner .top .list{ display: flex; gap:15px; align-items: center;}
#footer .inner .top .list li{}
#footer .inner .top .list li a{font-size: 18px; font-weight: 500; color: #fff;}
#footer .inner .bottom{display: flex; align-items: flex-end; justify-content: space-between;}
#footer .inner .bottom .l_cont{width: 25%;}
#footer .inner .bottom .l_cont .f_logo{}
#footer .inner .bottom .l_cont .f_logo img{max-width: 100%;}
#footer .inner .bottom .r_cont{width: 75%;}
#footer .inner .bottom .r_cont .info{text-align: right;}
#footer .inner .bottom .r_cont .info span{display: inline-block; font-size: 17px; font-weight: 300; opacity: 0.7; color: #fff; line-height: 1.8em;}
#footer .inner .bottom .r_cont .info span + span{margin-left: 15px;}
#footer .inner .bottom .r_cont .copy{text-align: right; font-size: 16px; opacity: 0.5; color: #fff; margin-top: 15px; font-weight: 300;}

@media all and (max-width:1480px){
	#footer{padding: 45px 0 130px;}
	#footer .inner .top{padding-bottom: 25px; margin-bottom: 60px;}
	#footer .inner .top .list{gap:12px;}
	#footer .inner .top .list li a{font-size: 17px;}
	#footer .inner .bottom .r_cont{padding-left: 40px;}
	#footer .inner .bottom .r_cont .info span{font-size: 16px;line-height: 1.7em;}
	#footer .inner .bottom .r_cont .info span + span{margin-left: 12px;}
	#footer .inner .bottom .r_cont .copy{margin-top: 13px;}
	#footer .inner .bottom .l_cont .f_logo img{max-width: 188px;}
}
@media all and (max-width:1024px){
	#footer{padding: 40px 0 110px;}
	#footer .inner .top{padding-bottom: 23px; margin-bottom: 50px;}
}
@media all and (max-width:768px){
	#footer{padding: 40px 0 90px;}
	#footer .inner .top{padding-bottom: 20px; margin-bottom: 40px;}
	#footer .inner .top .list{gap:10px;}
	#footer .inner .top .list li a{font-size: 16px;}
	#footer .inner .bottom{flex-direction: column-reverse;}
	#footer .inner .bottom .r_cont{padding-left: 0; width: 100%;}
	#footer .inner .bottom .r_cont .info{text-align: left;}
	#footer .inner .bottom .r_cont .info span{font-size: 15px; margin-right: 10px;}
	#footer .inner .bottom .r_cont .info span + span{margin-left: 0;}
	#footer .inner .bottom .r_cont .copy{text-align: left; font-size: 15px;}
	#footer .inner .bottom .l_cont{width: 100%; margin-top: 40px;}
	#footer .inner .bottom .l_cont .f_logo img{max-width: 156px;}
}
@media all and (max-width:500px){
	#footer{padding: 35px 0 70px;}
	#footer .inner .top .list li a{font-size: 15px;}
}


/* go_top */
.go_top{background-color: #1d1d1d; border-radius: 5px; padding: 20px 15px; text-align: center; position: fixed; bottom: 30px; right: 20px; z-index: 998; cursor: pointer;}
.go_top .gague{background-color: rgba(255,255,255,0.2); position: relative; height: 45px; width: 2px; margin-left: auto; margin-right: auto; margin-bottom: 10px; overflow: hidden;}
.go_top .gague .bar{background-color: #fff; height: 15px; width: 2px; position: absolute; left: 0; animation: gotop 1s infinite;}
.go_top p{font-size: 13px; font-weight: 700; color: #fff;}

@keyframes gotop{
	0%{top:65px;}
	100%{top: -20px;}
}

@media all and (max-width: 1480px){
	.go_top{right: 15px; bottom: 25px;}
}
@media all and (max-width:768px){
	.go_top{display: none;}
}