@charset "utf-8";

/* mobile gnb ani */
@-webkit-keyframes fade {
  0% { opacity: 0;}
  100% { opacity: 1;}
}
@keyframes fade {
  0% { opacity: 0;}
  100% { opacity: 1;}
}


/* layout */
html, body { height:100%;}
body { color:#212121; font-size: 1.6rem; letter-spacing:-.04em; line-height:1.5; -webkit-text-size-adjust:none; -webkit-font-smoothing:antialiased;}
#wrap {	position:relative; width:100%; min-width:320px;height:100%; font-size:16px; }
#headerwrap { position:relative; width:100%; height:140px; z-index:999999; }
.container {	width:100%;	position:relative; 	margin:0 auto;	}
.t-inner {	width:1800px;	position:relative;	margin-left:auto;	margin-right:auto;}
.inner {	width:1600px;	position:relative;	margin-left:auto;	margin-right:auto;}
.s-inner {	width:1420px;	position:relative;	margin-left:auto;	margin-right:auto;}
.ss-inner {	width:1400px;	position:relative;	margin-left:auto;	margin-right:auto;}
.sss-inner{width:1240px;	position:relative;	margin-left:auto;	margin-right:auto;}

.sss-inner.pt{min-height: 960px; padding-top: 140px;}

.partner{background-color: #fff; height: 80px; display: flex; justify-content: center;}
.partner .box{display: flex; align-items: center; margin: 0 35px;}
.partner .box .tit{font-size: 1.8rem; color: #222; margin-right: 20px; font-weight: 500;}
.partner .box .img{}
.partner .box .img a{margin-right: 20px;}

@media all and (max-width:999px){
    .sss-inner.pt{padding-top: 12rem;}
    .partner{flex-direction: column; height: auto; padding: 1rem 0;}
    .partner .box{padding: 1rem 0; margin: 0; padding-left: 2%;}
    .partner .box .tit{font-size: 1.6rem; margin-right: 2rem;}
    .partner .box .img{display: flex; width: 80%;}
    .partner .box .img a{margin-right: 2rem;}
    .partner .box .img a:last-child{margin-right: 0;}
    .partner .box .img a img{max-height: 32px;}
}
#content{margin-top: 90px;}


/* 타블렛 가로 */
@media all and (max-width:1799px) {	
    .t-inner {width:96%;}
}

@media all and (max-width:1599px) {	
    .inner {width:96%;}
}

@media all and (max-width:1419px) {	
    .s-inner {width:96%;}
}

@media all and (max-width:1399px) {	
    .ss-inner {width:96%;}
}

@media all and (max-width:1279px) {	
    .sss-inner {width:96%;}
    #content{margin-top: 72px;}
}

@media all and (max-width:999px) {
	#wrap { font-size: 15px; } 
    #footer{padding: 4rem 0;}
    #footer .copy{margin-top: 2rem;}
}

/* 타블렛 가로 미만 ~ 모바일 */

@media screen and (max-width:640px) {
	#wrap { font-size: 2.125vw; }
}

@media screen and (max-width:480px) {
	#wrap { font-size: 3vw; }
}



/*header*/
#hd_wrap{position:fixed;  width: 100%;  height:90px; line-height:90px;z-index:100; background:transparent; transition: .2s ease-in-out; top: 0;}
#hd_wrap.menu_on{background-color: #fff;}
#hd_wrap.scroll{background-color: #fff;}
#hd_wrap .hd_logo {position:absolute; top:32px; z-index:9; background:url(/images/common/logo.png) no-repeat center center; width: 130px; height: 26px; background-size: 100% auto;}
#hd_wrap.menu_on, #hd_wrap.scroll{box-shadow: 1px 2px 8px rgba(0,0,0,0.1)}
#hd_wrap .hd_logo a { display: block; width: 100%; height: 100%;  }
#hd_wrap .hd_mbx {display:none;}
#hd_wrap .lang{position: absolute; right: 0; z-index: 2; top: 22px;}
#hd_wrap .lang ul{display: flex;}
#hd_wrap .lang ul li{width: 46px; height: 46px; border-radius: 100%; line-height: 46px; text-align: center; background-color: #ebe2c2; margin-left: 3px;}
#hd_wrap .lang ul li.on{background-color: #efc427;}
#hd_wrap .lang ul li a{font-size:0.9em; color: #fff; display: block; width: 100%; height: 100%;  font-family: 'Montserrat', sans-serif; font-weight:500; line-height:46px;}
#hd_wrap .lang ul li.on a{color: #fff;}

#hd_wrap.menu_on dl{ color:#fff; }
#hd_wrap.scroll dl{ color:#fff; }

#hd_wrap .service{position: absolute; right: 0; height: 90px; z-index: 99;}
#hd_wrap .service a{color: #fff; background-color: rgb(63, 127, 206); padding: 8px 15px; border-radius: 5px; border:1px solid rgb(63, 127, 206);}
#hd_wrap .service a:hover{ background-color: transparent; color: rgb(63, 127, 206);}

.footer_service{display: none; position: fixed; bottom: 10px; width: 100%; z-index: 999;}
.footer_service a{display: block; text-align: center; width: 94%; color: #fff; margin: 0 auto; background-color: rgb(63, 127, 206); border-radius: 5px; border:1px solid rgb(63, 127, 206);  line-height: 56px; font-size: 1.8rem; font-weight: 600; box-shadow: 2px 3px 12px rgba(0,0,0,0.2);}

#gnb_pc {position:relative; overflow:hidden; width:100%; box-sizing:border-box; text-align:center; background: transparent;}
/*.scroll #gnb_pc{box-shadow: 2px 3px 12px rgb(0,0,0,0.1);}*/

#gnb_pc .gnb_dp1{display:inline-block; vertical-align:top; text-align:center; letter-spacing:-0.08em;}
#gnb_pc .gnb_dp1>div {height:90px; font-size:1.9rem; box-sizing:border-box; cursor:pointer; font-weight: 400; padding: 0 40px; }
#gnb_pc .gnb_dp1>div>span a{display:block; position:relative; font-family: 'GmarketSans', sans-serif; font-weight: 500; color: #222; border-color: rgb(63, 127, 206); height: 100%;}
.menu_on #gnb_pc .gnb_dp1>div>span a{color: #212121;}
.scroll #gnb_pc .gnb_dp1>div>span a{color: #212121;}
#gnb_pc .gnb_dp1 .smenu { display:none; padding:30px 0; }
#gnb_pc .gnb_dp1 .smenu li{ line-height: 1.0em; margin-bottom: 20px; }
#gnb_pc .gnb_dp1 .smenu li:last-child{margin-bottom: 0;}
#gnb_pc .gnb_dp1 .smenu li a {color:#fff; font-size: 1.6rem; font-weight: 400;}
#gnb_pc .gnb_dp1 .smenu li:hover a {border-bottom: 1px solid #fff; color:#FFF;}

#gnb_pc li.gnb_dp1:hover span a{border-bottom: 5px solid rgb(63, 127, 206);}
#hd_wrap.menu_on #gnb_pc {  background:rgba(63, 127, 206,0.81);}
/*#hd_wrap.scroll #gnb_pc {  background:rgba(83,135,78,0.95);}*/
#hd_wrap.menu_on #gnb_pc:before{content:""; width:100%; height:90px; background:#fff; position:absolute; top:0; left:0; border-bottom: 1px solid rgba(255,255,255,0.1); }
/*#hd_wrap.scroll #gnb_pc:before{content:""; width:100%; height:90px; background:#fff; position:absolute; top:0; left:0; border-bottom: 1px solid rgba(255,255,255,0.1); }*/

/*#hd_wrap #gnb_pc:before{content: '';  transition: .2s ease-in-out;}*/


#menuToggle {display: none; position:absolute; right:0%; top:24px; width:30px; height:22px; cursor:pointer; z-index:101;}
#menuToggle span {display:block; position:absolute; left:0; height:2px; background:#222; transition:0.5s all; -webkit-transition:0.5s all;}
.menu_on #menuToggle span{background-color: #222;}
.scroll #menuToggle span{background-color: #222;}
#menuToggle span.t {top:0; width:75%}
#menuToggle span.m {top:50%; margin-top:-1px; width:100%}
#menuToggle span.b {bottom:0; width:50%;}

#Mnav {display: none; width:100%; height:auto; position:fixed; top:-130%; right:0%; background:#fff; z-index:98; box-sizing:border-box; padding:120px 60px 120px; transition:all 0.5s; line-height: 1.6em;}
#Mnav > ul > li {box-sizing:border-box; border-bottom:1px solid rgba(255,255,255,0.3); padding:10px 0px;}
#Mnav > ul > li > div span  a {font-size:2rem; font-weight:600; color:#222;}
#Mnav > ul > li > ul {overflow:hidden; margin-top:10px;}
#Mnav > ul > li > ul > li {width:50%; margin:6px 0; float: left;}
#Mnav > ul > li > ul > li > a {font-size:1.5rem; color:#444;}
#Mnav > ul > li > ul > li > a:hover {color:rgb(63, 127, 206)}


#hd_wrap.menu .lang {color:#000 !important;}
#hd_wrap.menu #menuToggle span {background:#000;}
#hd_wrap.menu #menuToggle span.t {width:100%; transform:translateY(10px) rotate(45deg);}
#hd_wrap.menu #menuToggle span.m {width:0;}
#hd_wrap.menu #menuToggle span.b {width:100%; transform:translateY(-10px) rotate(-45deg)}

@media all and (max-width:999px){
    #hd_wrap{height: 72px;}
    #hd_wrap .hd_logo{top: 16px; max-width: 200px;}
    #hd_wrap .lang{right: 46px; top: 20px;}
    #gnb_pc{display: none;}
    #menuToggle{display: block;}
    #hd_wrap .lang ul li{width: 36px; height: 36px; line-height: 36px;}
    #hd_wrap .lang ul li a{line-height: 36px;}
    #menuToggle{left: auto;}
    #Mnav {width: 100%; padding: 10% 6% 8%; display: block;}
    #hd_wrap.menu #Mnav {top:0;}
    #hd_wrap .service{top: -10px; right: calc(5% + 30px);}
}
@media all and (max-width:720px){
}
@media all and (max-width:640px){
    #hd_wrap .hd_logo{top: 22px; max-width: 172px;}
    .footer_service{display: block;}
}


/* ft_qna */
.ft_qna{background: url(/images/common/ft_qna_bg.jpg) no-repeat center center; padding: 100px 0;}
.ft_qna .sss-inner{text-align: center;}
.ft_qna .sss-inner h3{font-size: 4.6rem; color: #fff; font-family: 'GmarketSans', sans-serif; font-weight: 700; word-break: keep-all;}
.ft_qna .sss-inner p{font-size: 1.8rem; color: #fff; margin: 10px 0 45px;}
.ft_qna .sss-inner .btn_box{display: flex; justify-content: center;}
.ft_qna .sss-inner .btn_box a{font-family: 'GmarketSans', sans-serif; font-weight: 500; font-size: 1.6rem; color: #fff; border: 2px solid #fff; border-radius: 30px; border-top-right-radius: 0; width: 190px; display: block; line-height: 45px; margin: 0 7px;}

@media all and (max-width:999px){
    .ft_qna{padding: 10% 0;}
    .ft_qna .sss-inner h3{font-size: 3.2rem;}
    .ft_qna .sss-inner p{font-size: 1.6rem; margin: 5px 0 8%;}
    .ft_qna .sss-inner .btn_box a{width: 160px;}
}



#footer {	width:100%;	clear:both;	position:relative;	margin:0 auto;		 padding: 50px 0;}
#footer .sss-inner{display: flex; justify-content: space-between;}
#footer .sss-inner .info{color: #222;}
#footer .sss-inner .info h3{font-weight: 400; font-size: 2rem; margin-bottom: 20px;}
#footer .sss-inner .info p{font-size: 1.5rem; color: #555; line-height: 1.8em;}
#footer .sss-inner .info p.copy{color: #555; opacity: .5; font-size: 1.3rem; margin-top: 25px;}

#footer .sitemap{}
#footer .sitemap ul{display: flex;}
#footer .sitemap ul li{margin-left: 100px;}
#footer .sitemap ul li h3{font-weight: 400; font-size: 2rem; color: #222; margin-bottom: 20px;}
#footer .sitemap ul li p{font-size: 1.5rem; line-height: 1.8em;}
#footer .sitemap ul li p a{color: #555; transition: .2s;}
#footer .sitemap ul li p a:hover{text-decoration: underline; text-underline-position: under;}

@media all and (max-width:999px){
    #footer{padding: 8% 0;}
/*    #footer .sitemap{display: none;}*/
    #footer .sss-inner {justify-content: center; flex-direction: column;}
    #footer .sitemap ul{margin: 0 auto; margin-top: 4rem; justify-content: space-between; width: 96%; max-width: 640px; flex-wrap: wrap;}
    #footer .sitemap ul li{margin-left: 0;}
    #footer .sss-inner .info{text-align: center;}
    #footer .sss-inner .info h3{margin-bottom: 2rem;}
    #footer .sss-inner .info p.copy{margin-top: 2rem;}
}
@media all and (max-width:640px){
    #footer{padding-bottom: 8rem;}
    #footer .sitemap ul li{width: 50%; padding-bottom: 2rem; text-align: center;}
}



.quick{position: absolute !important; right: 20px; top: 50%; transform: translate(-0%, -50%); width: 100px; z-index: 99; text-align: center; background-color: #fff; box-shadow: 2px 3px 12px rgba(0,0,0,0.1); border-radius: 15px; padding: 2rem 1rem;}
.quick .wing_bn{margin-bottom: 2rem;}
.quick .wing_bn:last-child{margin-bottom: 0;}
.quick .wing_bn a{}
.quick .wing_bn .img{}
.quick .wing_bn .img img{}
.quick .wing_bn p{font-size: 1.4rem; transition: .2s; margin-top: 5px;}
.quick .wing_bn:hover p{color: #4488DD; font-weight: 500;}

@media all and (max-width:999px){
    .quick{display: none;}
}