@charset "utf-8";


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


@media all and (max-width:1599px) {	
	.inner {width:94%;}
}
@media all and (max-width:1439px) {	
	.s-inner {width:94%;}
}


/* header */
#header{position: fixed; top: 0; left: 0; width: 100%; height: 90px; z-index: 99; transition: .6s;}
#header.on{box-shadow: 3px 3px 30px rgba(0, 0, 0, 0.06); background-color: #fff;}
#header.onn{box-shadow: 3px 3px 30px rgba(0, 0, 0, 0.06); background-color: #fff;}
#header.ons{box-shadow: 3px 3px 30px rgba(0, 0, 0, 0.06); background-color: #fff;}
#header.onss{box-shadow: 3px 3px 30px rgba(0, 0, 0, 0.06); background-color: #fff;}
#header #logo{position: absolute; top: 50%; transform: translateY(-50%); left: 60px; height: 100%;}
#header #logo a{width: 148px; display: block; height: 100%; background: url(/eng/images/common/logo_w.webp) no-repeat center center / 100% auto;}
#header.on #logo a{background: url(/eng/images/common/logo.webp) no-repeat center center / 100% auto;}
#header.onn #logo a{background: url(/eng/images/common/logo.webp) no-repeat center center / 100% auto;}
#header.ons #logo a{background: url(/eng/images/common/logo.webp) no-repeat center center / 100% auto;}
#header.onss #logo a{background: url(/eng/images/common/logo.webp) no-repeat center center / 100% auto;}
#header .pcGnb{position: absolute; left: 50%; transform: translateX(-50%);}
#header .pcGnb > ul{display: flex; gap:60px;}
#header .pcGnb > ul > li{position: relative;}
#header .pcGnb > ul > li > div{}
#header .pcGnb > ul > li > div > span{}
#header .pcGnb > ul > li > div > span > a{display: block; line-height: 90px; color: #fff; font-size: 18px; font-weight: 700; white-space: nowrap;}
#header .pcGnb > ul > li:hover > div > span > a{color: #278de8 !important;}
#header.on .pcGnb > ul > li > div > span > a{color: #222222;}
#header.onn .pcGnb > ul > li > div > span > a{color: #222222;}
#header.ons .pcGnb > ul > li > div > span > a{color: #222222;}
#header.onss .pcGnb > ul > li > div > span > a{color: #222222;}
#header .pcGnb > ul > li > div.on > span > a::after{content: '↓'; font-family: 'SUIT', sans-serif; font-size: 14px; margin-left: 10px; position: relative; top: -2px;}
#header .pcGnb > ul > li > ul{position: absolute;text-align: center; background-color: #278de8; width: 180px; left: 50%; transform: translateX(-54%); display: none; top: 90px;}
#header .pcGnb > ul > li > ul > li{background-color: #278de8; transition: .4s;}
#header .pcGnb > ul > li > ul > li:hover{background-color: #1e6db4;}
#header .pcGnb > ul > li > ul > li > a{color: #fff; font-weight: 600; font-size: 18px; padding: 15px 0; display: block;}
/*
#header .pcGnb > ul > li > ul > li:first-child > a{padding-top: 20px;}
#header .pcGnb > ul > li > ul > li:last-child > a{padding-bottom: 20px;}
*/
#header .r_cont{position: absolute; right: 60px; top: 50%; transform: translateY(-50%); display: flex; align-items: center; gap:40px;}
#header .r_cont .lang{display: flex; gap:20px;}
#header .r_cont .lang li{ position: relative;}
#header .r_cont .lang li a{font-family: 'Poppins', sans-serif; font-size: 18px; font-weight: 700; color: #fff; opacity: .5;}
#header.on .r_cont .lang li a{color: #000;}
#header.onn .r_cont .lang li a{color: #000;}
#header.ons .r_cont .lang li a{color: #000;}
#header.onss .r_cont .lang li a{color: #000;}
#header .r_cont .lang li.on a{opacity: 1;}
#header.on .r_cont .lang li.on a{color: #278de8;}
#header.onn .r_cont .lang li.on a{color: #278de8;}
#header.ons .r_cont .lang li.on a{color: #278de8;}
#header.onss .r_cont .lang li.on a{color: #278de8;}
#header .r_cont .lang li.on a::after{content: ''; height: 1px; width: 100%; position: absolute; bottom: 0px; background-color: #fff; left: 0;}
#header.on .r_cont .lang li.on a::after{background-color: #278de8;}
#header.onn .r_cont .lang li.on a::after{background-color: #278de8;}
#header.ons .r_cont .lang li.on a::after{background-color: #278de8;}
#header.onss .r_cont .lang li.on a::after{background-color: #278de8;}
#header .r_cont .menuToggle{ filter: invert(1); cursor: pointer;}
#header.on .r_cont .menuToggle{ filter: invert(0);}
#header.onn .r_cont .menuToggle{ filter: invert(0);}
#header.ons .r_cont .menuToggle{ filter: invert(0);}
#header.onss .r_cont .menuToggle{ filter: invert(0);}
#header .r_cont .menuToggle img{max-width: 22px;}

.moGnb{position: fixed; background-color: #222; right: -300px; top: 90px; z-index: 98; width: 300px; height: 100%; transition: .6s;}
.moGnb.on{right: 0;}
.moGnb > ul{ text-align: left; }
.moGnb > ul > li{}
.moGnb > ul > li > div{position: relative;}
.moGnb > ul > li > div.on::after{content: '↓'; font-family: 'SUIT', sans-serif; position: absolute; right: 30px; top: 50%; transform: translateY(-50%);font-size: 18px; color: #fff;}
.moGnb > ul > li.on > div.on::after{content: '↑';}
.moGnb > ul > li > div > span{cursor: pointer;}
.moGnb > ul > li > div > span > a{color: #fff; font-size: 20px; font-weight: 700; display: block; padding: 20px 30px; border-bottom: 1px solid rgba(255,255,255,0.1);}
.moGnb > ul > li.on > div > span > a{ color: #278de8;}
.moGnb > ul > li > div.on > span > a{pointer-events: none; }
.moGnb > ul > li:hover > div > span > a{color: #278de8;}
.moGnb > ul > li > ul{margin-top: 0px; background-color: #111; display: none;}
.moGnb > ul > li > ul > li{}
.moGnb > ul > li > ul > li > a{color: #fff; opacity: 0.5; font-size: 18px; transition: .6s; font-weight: 500; display: block; padding: 10px 30px; border-bottom: 1px solid rgba(255,255,255,0.1);}
.moGnb > ul > li > ul > li:hover > a{opacity: 1;}

.mo_bg{background: rgba(0,0,0,0.6); position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index:-2; opacity: 0; transition: .6s;}
.mo_bg.on{z-index: 97; opacity: 1;}


@media all and (max-width:1600px){
	#header .pcGnb > ul{gap:30px;}
}
@media all and (max-width:1280px){
	#header{height: 80px;}
	#header #logo{left: 3%;}
	#header #logo a{width: 140px;}
	#header .r_cont{right: 3%;}
	#header .r_cont .lang li a{font-size: 17px;}
	#header .pcGnb > ul{gap:20px;}
	#header .pcGnb > ul > li > div > span > a{line-height: 80px; font-size: 17px;}
	#header .pcGnb > ul > li > ul{top: 80px;}
	#header .pcGnb > ul > li > ul > li > a{font-size: 17px; padding: 12px 0;}
	.moGnb{top: 80px;}
	.moGnb > ul > li > div > span > a{font-size: 18px; padding: 15px 25px;}
	.moGnb > ul > li > div.on::after{right: 25px;}
	.moGnb > ul > li > ul > li > a{font-size: 16px;}
}
@media all and (max-width:976px){
	#header{height: 65px;}
	#header .pcGnb{display: none;}
	#header .r_cont{gap:0 15px;}
	#header .r_cont .menuToggle img{max-width: 20px;}
	.moGnb{top: 65px;}
}
@media all and (max-width:640px){
	#header #logo a{width: 132px;}
	#header .r_cont .lang{gap:0 15px;}
	#header .r_cont .lang li a{font-size: 16px;}
}


/* inquiry */
.inquiry{background-color: #f8f8f8; padding: 140px 0;}
.inquiry .inner{display: flex; align-items: center;}
.inquiry .inner .m_txt{width: 50%;}
.inquiry .inner .box{width: 50%; display: flex; gap:56px; align-items: center;}
.inquiry .inner .box .l_box{width: 100%; max-width: 480px; display: flex; gap:10px; flex-wrap: wrap;}
.inquiry .inner .box .l_box input{background-color: #fcfcfc; border:1px solid rgba(0,0,0,0.05); -webkit-box-shadow: 3px 0 30px 0 rgba(0,0,0,0.06);
box-shadow: 3px 0 30px 0 rgba(0,0,0,0.06); height: 60px; padding: 0 30px; border-radius: 5px; width: calc(100% / 2 - 10px / 2); box-sizing: border-box; font-size: 16px; font-weight: 500; color:rgba(0,0,0,0.8); font-family: 'Pretendard', sans-serif;}
.inquiry .inner .box .l_box textarea{background-color: #fcfcfc; border:1px solid rgba(0,0,0,0.05); -webkit-box-shadow: 3px 0 30px 0 rgba(0,0,0,0.06);
box-shadow: 3px 0 30px 0 rgba(0,0,0,0.06); resize: none; width: 100%; padding: 30px; border-radius: 5px; font-size: 16px; font-weight: 500; color:rgba(0,0,0,0.8); font-family: 'Pretendard', sans-serif; max-height: 150px;}
.inquiry .inner .box .r_box{}
.inquiry .inner .box .r_box .agree{font-size: 15px; font-weight: 500; color: #666666; word-break: keep-all;}
.inquiry .inner .box .r_box .agree input{}
.inquiry .inner .box .r_box .agree a{color: #000000; font-weight: 700;}
.inquiry .inner .box .r_box button{line-height: 62px; padding:0 10px; background-color: #278de8; color: #ffffff; font-size: 20px; font-family: 'Pretendard', sans-serif; font-weight: 700; width: 100%; border-radius: 10px; margin-top: 15px;}

@media all and (max-width:1280px){
	.inquiry{padding: 120px 0;}
	.inquiry .inner .box{gap:30px; flex-direction: column;}
	.inquiry .inner .box .l_box{max-width: 100%; padding-left: 40px;}
	.inquiry .inner .box .l_box input{padding:  0 25px; height: 56px;}
	.inquiry .inner .box .l_box textarea{max-height: 135px; padding: 25px;}
	.inquiry .inner .box .r_box button{line-height: 58px; font-size: 19px;}
}
@media all and (max-width:976px){
	.inquiry{padding: 100px 0;}
	.inquiry .inner{flex-direction: column; align-items: flex-start;}
	.inquiry .inner .m_txt{width: 100%;}
	.inquiry .inner .box{flex-direction: row; width: 100%; padding-top: 50px;}
	.inquiry .inner .box .l_box{padding-left: 0; max-width:calc(100% - 250px);}
	.inquiry .inner .box .l_box input{padding:  0 22px; height: 52px;}
	.inquiry .inner .box .r_box{width: 220px;}
	.inquiry .inner .box .l_box textarea{max-height: 120px; padding: 22px;}
	.inquiry .inner .box .r_box button{line-height: 56px; font-size: 18px;}
}
@media all and (max-width:640px){
	.inquiry{padding: 80px 0;}
	.inquiry .inner .box{flex-direction: column; padding-top: 40px;}
	.inquiry .inner .box .l_box{max-width: 100%;}
	.inquiry .inner .box .l_box input{padding: 0 18px; height: 48px; font-size: 15px;}
	.inquiry .inner .box .l_box textarea{max-height: 110px; font-size: 15px; padding: 18px;}
	.inquiry .inner .box .r_box button{line-height: 54px; font-size: 17px;}
}
@media all and (max-width:480px){
	.inquiry{padding: 70px 0;}
	.inquiry .inner .box{padding-top: 30px;}
}


/* footer */
#footer{background-color: #222222; padding: 80px 0 100px;}
#footer .inner{display: flex; justify-content: space-between;}
#footer .inner .l_cont{}
#footer .inner .l_cont .f_logo{margin-bottom: 50px;}
#footer .inner .l_cont .f_logo img{max-width: 156px;}
#footer .inner .l_cont .info{}
#footer .inner .l_cont .info .box{}
#footer .inner .l_cont .info .box + .box{margin-top: 15px;}
#footer .inner .l_cont .info .box b{font-size: 16px; color: #878787; display: inline-block; margin-right: 15px;}
#footer .inner .l_cont .info .box b span{color: #fff;}
#footer .inner .l_cont .bottom{margin-top: 70px;}
#footer .inner .l_cont .bottom ul{display: flex;}
#footer .inner .l_cont .bottom ul li{margin-right: 20px;}
#footer .inner .l_cont .bottom ul li a{font-size: 15px; font-weight: 600; color: #ffffff;}
#footer .inner .l_cont .bottom .copy{font-size: 15px; color: #fff; opacity: 0.5; margin-top: 15px;}
#footer .inner .r_cont{}
#footer .inner .r_cont ul{text-align: right;}
#footer .inner .r_cont ul li{}
#footer .inner .r_cont ul li + li{margin-top: 20px;}
#footer .inner .r_cont ul li a{font-size: 24px; color: #fff; opacity: 0.5; font-weight: 700; transition: .6s;}
#footer .inner .r_cont ul li:hover a{opacity: 1;}
#footer .inner .r_cont ul.s0 li.s0 a,
#footer .inner .r_cont ul.s1 li.s1 a,
#footer .inner .r_cont ul.s2 li.s2 a,
#footer .inner .r_cont ul.s3 li.s3 a,
#footer .inner .r_cont ul.s4 li.s4 a,
#footer .inner .r_cont ul.s5 li.s5 a{opacity: 1;}

@media all and (max-width:1280px){
	#footer{padding: 70px 0 90px;}
	#footer .inner .l_cont .f_logo{margin-bottom: 40px;}
	#footer .inner .l_cont .f_logo img{max-width: 146px;}
	#footer .inner .l_cont .info .box b{font-size: 15px;}
	#footer .inner .l_cont .bottom{margin-top: 60px;}
	#footer .inner .r_cont ul li a{font-size: 22px;}
}
@media all and (max-width:976px){
	#footer{padding: 60px 0 80px;}
	#footer .inner .r_cont{display: none;}
	#footer .inner .l_cont .info .box b{line-height: 1.8em; font-size: 14px;}
	#footer .inner .l_cont .bottom{margin-top: 50px;}
	#footer .inner .l_cont .bottom ul li a{font-size: 14px;}
	#footer .inner .l_cont .bottom .copy{font-size: 14px; margin-top: 12px;}
}
@media all and (max-width:640px){
	#footer{padding: 50px 0 70px;}
	#footer .inner .l_cont .f_logo{margin-bottom: 35px; text-align: center;}
	#footer .inner .l_cont .info .box{text-align: center;}
	#footer .inner .l_cont .info .box b{margin-right: 0;}
	#footer .inner .l_cont .info .box b{margin: 0 8px;}
	#footer .inner .l_cont .bottom{ display: flex; flex-direction: column; align-items: center;}
	#footer .inner .l_cont .bottom ul li{margin-right: 0; margin: 0 8px;}
}


/* quick */
.quick{position: fixed; right: 30px; bottom: 40px; border-radius: 100%;box-shadow: 3px 3px 30px rgba(0, 0, 0, 0.06); z-index: 97;}
.quick img{max-width: 100%;}

@media all and (max-width:976px){
	.quick{right: 2%; bottom: 3%;}
	.quick img {max-width: 64px;}
}
@media all and (max-width:640px){
	.quick img {max-width: 56px;}
}


.layer{position:fixed; display:none; left:50%;top:50%; transform: translate(-50%, -50%); z-index:3000000; width:100%;}
.layer .close_btn{position:absolute; overflow: hidden; right:0; top:0;background:#111;  border-radius:0 ; color: #fff;}
.layer .close_btn a{display: block;color: #fff;padding:14px 18px; font-size:20px; font-weight:bold;}
.layer .layer_wrap{position:relative;width:100%; max-width:700px; top:0px; margin:0 auto; border-radius:0px; background: #fff; text-align:left; letter-spacing:-0.5px; box-shadow:0 0 50px rgba(0,0,0,0.2);}
.layer .layer_wrap .DB_info_detail{width:100%;  margin:18px auto; padding-bottom:16px; line-height:18px; color: #333;font-size:12px;}
.layer .layer_wrap .DB_info_detail h2{padding:28px 20px;border-bottom:1px solid #eee; font-size:21px; font-weight:bold;}
.layer .layer_wrap .DB_info_detail .DB_info_detail_wrap p{padding:8px;margin-bottom:12px; font-size:13px;}
.layer .layer_wrap .DB_info_detail .DB_info_detail_wrap{width:98%; height:360px; padding:8px 16px; overflow:auto; box-sizing:border-box;}
.layer .layer_wrap .DB_info_detail .DB_info_detail_wrap dl dt{display:block; background: #eee;border-radius:3px; padding:7px 10px; font-weight: bold;}
.layer .layer_wrap .DB_info_detail .DB_info_detail_wrap dl dd{margin-bottom:16px; padding:4px 12px; box-sizing:border-box;}