@charset "utf-8";


/* layout */
html, body {}
body { color:#686868; letter-spacing:-.04em; -webkit-text-size-adjust:none; -webkit-font-smoothing:antialiased;}
#wrap {	position:relative; width:100%; min-width:320px; font-size:1.6rem; }
.inner {	width:1440px;	position:relative;	margin-left:auto;	margin-right:auto; font-size: 15px;}
.s-inner {	width:1440px;	position:relative;	margin-left:auto;	margin-right:auto;}


/* 타블렛 가로 */
@media all and (max-width:1599px) {	
}
@media all and (max-width:1439px) {	
	.inner {width:94%;}
	.s-inner {width:94%;}
}

/* header */
#header{position: fixed; top: 0; left: 0; width: 100%; z-index: 99; height: 90px; transition: .4s; border-bottom:1px solid rgba(255, 255, 255, 0.3);}
#header:hover{background-color: #fff; border-bottom: 1px solid #eee;}
#header.on{background-color: #fff; border-bottom: 1px solid #eee;}
#header.ons{background-color: #fff; border-bottom: 1px solid #eee;}
#header #logo{position: absolute; top: 50%; transform: translateY(-50%); left: 40px; z-index: 99;}
#header #logo a{width: 253px; height: 38px; background: url(/images/common/logo.webp) no-repeat center center / 253px; display: block; transition: .4s;}
#header:hover #logo a{background-image: url(/images/common/logo_on.webp);}
#header.on #logo a{background-image: url(/images/common/logo_on.webp);}
#header.ons #logo a{background-image: url(/images/common/logo_on.webp);}
#header .pcGnb{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%;}
#header .pcGnb > ul{display: flex; gap:0 66px; align-items: center; justify-content: center;}
#header .pcGnb > ul > li{position: relative;}
#header .pcGnb > ul > li > div{}
#header .pcGnb > ul > li > div > span{}
#header .pcGnb > ul > li > div > span > a{font-size: 19px; font-weight: 700; color: #fff; display: block; line-height: 90px;}
#header:hover .pcGnb > ul > li > div > span > a{color: #737373;}
#header.on .pcGnb > ul > li > div > span > a{color: #737373;}
#header.ons .pcGnb > ul > li > div > span > a{color: #737373;}
#header .pcGnb > ul > li:hover > div > span > a{color: #0945a3;}
#header .pcGnb > ul > li > ul{position: absolute; width: 180px; background-color: #0047ab; left: 50%; transform: translateX(-50%); text-align: center;  display: none;  border-top: 0;}
#header .pcGnb > ul > li > ul > li{}
#header .pcGnb > ul > li > ul > li > a{ display: block; font-size: 17px; font-weight: 600;  color: #fff; line-height: 55px;}
#header .pcGnb > ul > li > ul > li:hover > a{background-color: #0039a3;}
/* #header .pcGnb > ul > li > ul > li + li{margin-top: 16px;} */
#header .r_cont{position: absolute; top: 50%; right: 60px; transform: translateY(-50%); display: flex; gap:0 50px;}
#header .r_cont .tel{}
#header .r_cont .tel a{color: #fff; font-size: 18px; text-align: right;}
#header:hover .r_cont .tel a{color: #000;}
#header.on .r_cont .tel a{color: #000;}
#header.ons .r_cont .tel a{color: #000;}
#header .r_cont .tel a p{font-weight: 500; font-size: 14px;}
#header:hover .r_cont .tel a p{color: #444;}
#header.on .r_cont .tel a p{color: #444;}
#header.ons .r_cont .tel a p{color: #444;}
#header .r_cont .tel a b{font-weight: 700; font-family: 'Poppins'; font-size: 22px;}
#header .r_cont .tel a b span{color: #0047ab;}
#header .r_cont .menuToggle{width: 30px; height: 19px; display: flex; flex-direction: column; justify-content: space-between; position: relative; cursor: pointer; display: none; }
#header .r_cont .menuToggle > div{height: 2px; background-color: #fff;}
#header:hover .r_cont .menuToggle > div{background-color: #000;}
#header.on .r_cont .menuToggle > div{background-color: #000;}
#header.ons .r_cont .menuToggle > div{background-color: #000;}
#header .r_cont .menuToggle .t{width: 17px; align-self: flex-end;}
#header .r_cont .menuToggle .m{width: 100%;}
#header .r_cont .menuToggle .b{width: 23px;}

.moGnb{position: fixed; top: 90px; left: 0; width: 100%; height: calc(100vh - 90px); z-index: 98; background: url(/images/common/mognb_bg.webp) no-repeat center center / cover;transition: 0.6s; opacity: 0; z-index: -10;}
.moGnb.on{opacity: 1; z-index: 96}
.moGnb > ul{display: flex; flex-wrap: wrap; color: #fff; height: 100%; backdrop-filter:blur(10px);}
.moGnb > ul > li{width: 25%; height: 50%; text-align: center; padding: 30px; border-bottom: 1px solid rgba(255,255,255,0.1); border-right: 1px solid rgba(255,255,255,0.1); pointer-events: none;}
.moGnb > ul > li > div{ margin-bottom: 20px}
.moGnb > ul > li > div > span{}
.moGnb > ul > li > div > span > a{ color: #fff; font-size: 32px; font-weight: 700;}
.moGnb > ul > li > ul{}
.moGnb > ul > li > ul > li{}
.moGnb > ul > li > ul > li > a{ color: #fff; font-size: 18px; line-height: 1.8em; font-weight: 500; pointer-events: auto;}
.moGnb > ul > li > ul > li:hover > a{border-bottom: 1px solid #fff;}


@media all and (max-width:1720px){
	#header #logo{left: 3%;}
	#header .pcGnb > ul{gap:0 48px;}
	#header .r_cont{gap:0 35px; right: 3%;}
}
@media all and (max-width:1280px){
	#header{height: 70px;}
	#header .pcGnb{display: none;}
	#header #logo a{max-width: 168px; background-size: contain;}
	#header .r_cont .tel a{font-size: 17px;}
	.moGnb{top: 70px;height: calc(100vh - 70px); background: #0047ab; overflow-y: scroll;}
	.moGnb > ul{flex-direction: column; height: auto;}
	.moGnb > ul > li{pointer-events: auto; width: 100%; height: auto; text-align: left; padding: 0px 0px;}
	.moGnb > ul > li > div{margin-bottom: 0; cursor: pointer; padding: 15px;}
	.moGnb > ul > li > div > span > a{font-size: 18px; pointer-events: none;}
	.moGnb > ul > li > ul{display: none; background-color: #0b3c89;}
	.moGnb > ul > li > ul > li{}
	.moGnb > ul > li > ul > li > a{padding: 10px 25px; display: block; font-size: 17px;}
	.moGnb > ul > li > ul > li+li > a{border-top: 1px solid rgba(255,255,255,0.1);}
	.moGnb > ul > li > ul > li:hover > a{border-bottom: 0px;}
    #header .r_cont {align-items: center;}
    #header .r_cont .menuToggle{display: flex; margin-bottom: 5px;}
}
@media all and (max-width:640px){
	#header{height: 60px;}
	#header #logo a{max-width: 146px;}
	#header .r_cont{gap:0 26px;}
	#header .r_cont .menuToggle{width: 28px;}
	#header .r_cont .tel a p{display: none;}
	.moGnb{top: 60px;height: calc(100vh - 60px);}
}
@media all and (max-width:480px){
	#header #logo a{max-width: 138px;}
	#header .r_cont{gap:0 20px;}
	#header .r_cont .menuToggle{width: 27px;}
}

/* footer */
#footer {background-color: #272727;}
#footer .inner{border-top: 1px solid rgba(255, 255, 255, 0.2); display: flex; justify-content: space-between;  padding: 65px 0 80px;}
#footer .inner .l_cont{display: flex;}
#footer .inner .l_cont .f_logo{margin-bottom: 25px;}
#footer .inner .l_cont .f_logo img{max-width: 301px; padding-right: 50px;}
#footer .inner .l_cont .info{font-size: 15px; color: #fff; opacity: 0.5;}
#footer .inner .l_cont .info span{display: inline-block; margin-right: 17px; line-height: 2em;}
#footer .inner .l_cont .info span b{font-weight: 600; margin-right: 5px;}
#footer .inner .l_cont .copy{font-size: 14px; opacity: 0.2; color: #fff; margin-top: 20px;}
#footer .inner .r_cont{}
#footer .inner .r_cont ul{text-align: right;}
#footer .inner .r_cont ul li{margin-bottom: 1em;}
#footer .inner .r_cont ul li a{color: #fff;  font-size: 15px; font-weight: 600;}
#footer .inner .r_cont ul li a b{font-weight: 500;}

@media all and (max-width:1600px){
}
@media all and (max-width:976px){
	#footer .inner{padding: 50px 0 70px;}
	#footer .inner{flex-direction: column;}
	#footer .inner .l_cont{width: 100%; text-align: center; display: block;}
	#footer .inner .l_cont .info span{margin-right: 0; margin: 0 8px;}
	#footer .inner .l_cont .f_logo{margin-bottom: 20px;}
	#footer .inner .r_cont{width: 100%; margin-top: 30px;}
	#footer .inner .r_cont ul{display: flex; justify-content: center; gap: 0 15px;}
	#footer .inner .r_cont ul li a{font-size: 15px;}
}
@media all and (max-width:640px){
	#footer .inner{padding: 45px 0 125px;}
	#footer .inner .l_cont .f_logo img{max-width: 220px;}
}
@media all and (max-width:480px){}

.go_top{position: fixed; right: 20px; bottom: 30px; z-index: 99; cursor: pointer;border-radius: 100%; box-shadow: 2px 8px 12px rgba(255,255,255,0.085);}
.go_top img{}

@media all and (max-width:976px){
	.go_top{right: 2%; bottom: 2%;}
	.go_top img{max-width: 72px;}
}
@media all and (max-width:640px){
	.go_top img{max-width: 60px;}
}


#quick{position: fixed; right: 20px; top: 200px; width: 85px; background-color: #fff; text-align: center; font-size: 1.4rem; box-shadow: 0 0 5px rgba(0,0,0,0.05); z-index: 1000;} 
#quick .link{display: flex; justify-content: center; align-items: center; width: 100%; height: 95px; box-sizing: border-box; border-bottom: 1px solid rgba(0, 0, 0, 0.1);}
#quick .link p{margin-top: 5px; font-weight: 600;}
#quick .top{width: 100%; height: 80px; display: flex; justify-content: center; align-items: center; background-color: #222; color: #fff; font-weight: 700;}
#quick .top .s1{font-family: 'suit';}
@media all and (max-width:976px){
    #quick{width: 100%; bottom: 0; top: auto; right: auto; display: flex;}
    #quick .link{width: 20%; border-bottom: 0; border-right:1px solid rgba(0, 0, 0, 0.1);}
    #quick .top{width: 20%; height: auto;}
}
@media all and (max-width:480px){
    #quick .link{height: 65px;}
    #quick .link img{height: 24px;}
    #quick .link p{font-size: 1.3rem;}
}





/* sec6 */
.sec6{background: #272727; padding: 140px 0;}
.sec6 .m_tit{margin-bottom: 55px;}
.sec6 .flex{display: flex; justify-content: space-between; align-items: center;}
.sec6 .inner .l_cont{width: 50%;}
.sec6 .inner .l_cont .root_daum_roughmap .wrap_controllers{display: none;}
.sec6 .inner .r_cont{width: 50%; padding-left: 100px; color: #fff;}
.sec6 .inner .r_cont .txt{}
.sec6 .inner .r_cont .txt .info dl{margin-bottom: 0.9em; display: flex; font-size: 1.8rem;}
.sec6 .inner .r_cont .txt .info dl dt{width: 100px; flex:0 0 auto; font-weight: 700;}
.sec6 .inner .r_cont .txt .info dl dd{font-weight: 300; opacity: 0.5;}
.sec6 .inner .r_cont .txt .info dl.time dd{opacity: 1;}
.sec6 .inner .r_cont .txt .info dl dd ul{display: flex; flex-wrap: wrap; justify-content: space-between;}
.sec6 .inner .r_cont .txt .info dl dd ul li{margin-bottom: 0.7em; width: 45%; display: flex; justify-content: space-between;}
.sec6 .inner .r_cont .txt .info dl dd ul li strong{opacity: 1; font-weight: 500;}
.sec6 .inner .r_cont .txt .info dl dd ul li p{opacity: 0.5; font-weight: 500;}
.sec6 .inner .r_cont .txt .links{margin-top: 40px; display: flex; justify-content: space-between;}
.sec6 .inner .r_cont .txt .links a{width: calc(50% - 10px); height: 60px; display: flex; align-items: center; justify-content: center; }
.sec6 .inner .r_cont .txt .links a p{ font-weight: 600; font-size: 1.8rem;}
.sec6 .inner .r_cont .txt .links a.kakao{background-color: #fae100;}
.sec6 .inner .r_cont .txt .links a.kakao p{color: #272727;}
.sec6 .inner .r_cont .txt .links a.blog{background-color: #42d31a;}
.sec6 .inner .r_cont .txt .links a.blog p{color: #fff;}

@media all and (max-width:1600px){
	.sec6{background-position: center right -16vw;}
	.sec6 .inner .r_cont{padding-left: 85px;}
	.sec6 .m_tit{margin-bottom: 50px;}
}
@media all and (max-width:1280px){
	.sec6{padding: 120px 0;background-position: center right -22vw;}
	.sec6 .inner .l_cont{width: 55%;}
	.sec6 .inner .r_cont{padding-left: 50px; width: calc(100% - 55%);}
	.sec6 .m_tit{margin-bottom: 45px;}
    .sec6 .inner .r_cont .txt .info dl dd ul{flex-direction: column;}
    .sec6 .inner .r_cont .txt .info dl dd ul li{width: 100%; max-width: 200px;}
    .sec6 .inner .r_cont .txt .info dl dd ul li:nth-child(2){order:3;}
}
@media all and (max-width:976px){
	.sec6{padding: 100px 0; background-position: center bottom -200px; background-size: 100% auto;}
	.sec6 .root_daum_roughmap .wrap_map{height: 380px !important;}
	.sec6 .inner .flex{width: 100%; flex-direction: column;}
	.sec6 .inner .l_cont{width: 100%;}
	.sec6 .inner .r_cont{padding-left:0px; width: 100%; margin-top: 40px;}
	.sec6 .m_tit{margin-bottom: 40px;}
    .sec6 .inner .r_cont .txt .info dl.time dd{width: 100%;}
}
@media all and (max-width:862px){
	.sec6{ background-size: auto;}
}
@media all and (max-width:640px){
	.sec6{padding: 80px 0;}
	.sec6 .m_tit{margin-bottom: 35px;}
	.sec6 .root_daum_roughmap .wrap_map{height: 360px !important;}
	.sec6 .inner .r_cont .txt p{font-size: 17px;}
    .sec6 .inner .r_cont .txt .links{gap: 10px;}
    .sec6 .inner .r_cont .txt .links a{width: calc(50% - 5px);}
}
@media all and (max-width:480px){
	.sec6{padding: 70px 0; background-position: center bottom -300px;}
	.sec6 .root_daum_roughmap .wrap_map{height: 280px !important;}
	.sec6 .inner .r_cont .txt p{font-size: 16px;}
    .sec6 .inner .r_cont .txt .info dl dt{width: 80px;}
}