@charset "utf-8";


/* layout */
html, body { height:100%;}
body { color:#333; 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:1.6rem; }
.inner {	width:1600px;	position:relative;	margin-left:auto;	margin-right:auto;}
.s-inner {	width:1280px;	position:relative;	margin-left:auto;	margin-right:auto;}
#pageCont{padding: 80px 0;}


.skip a{
    position: absolute;
    background: rgba(0,0,0,0.7);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#90000000,endColorstr=#90000000);
    width: calc(100% - 2px);
    left: 50%;
    transform: translateX(-50%);
    height: 30px;
    text-align: center;
    color: #fff;
    z-index: 100;
    line-height: 30px;
    top: -30px;
    opacity: 0;
    outline-color: greenyellow;
}

/* 타블렛 가로 */
@media all and (max-width:1599px) {	
.inner {width:94%;}
.s-inner {width:94%;}
    #pageCont{padding: 70px 0;}
}
@media all and (max-width:978px){
    #pageCont{padding: 60px 0;}
}


/* header */
header{position: relative; height: 120px;}
header .tel{position: absolute; left: 80px; top: 50%; transform: translateY(-50%);}
header .tel a{}
header .tel a img{max-width:100%;}
header #logo{position: absolute; top: 50%; transform: translate(-50%, -50%); left: 50%;}
header #logo a{}
header #logo a img{max-width:100%;}
header .support{position: absolute; right: 80px; top: 50%; transform: translateY(-50%);}
header .support a{}
header .support a img{max-width:100%;}

.header_bottom{position: relative; border: 1px solid #e9e9e9; border-right: 0; border-left: 0;}
.header_bottom::before{content: ''; height: 0; transition: .3s;}
.header_bottom.on::before{content: ''; width: 100%; height: 210px; background-color: rgba(38,57,105,0.95); display: block; position: absolute; top: 63px; z-index: 2;}
.header_bottom .inner{}
.header_bottom .inner > ul{display: flex; justify-content: center;}
.header_bottom.on .inner > ul:before{content:""; width:100%; height:64px; background:#fff; position:absolute; top:0; left:0; border-bottom: 1px solid #e9e9e9; }
.header_bottom .inner > ul > li{position: relative; padding: 0 38px;}
.header_bottom .inner > ul > li > div{}
.header_bottom .inner > ul > li > div > a{font-size: 1.8rem; color: #222222;display: block; line-height: 62px; position: relative;}
.header_bottom .inner > ul > li > div > a::before{content: ''; position: absolute; bottom: -2px; left: 0; width: 100%; height: 4px; background-color: transparent; transition: .3s;}
.header_bottom .inner > ul > li:hover > div > a::before{background-color: #006ead;}
.header_bottom .inner > ul > li:hover > div > a{color: #006ead;}
.header_bottom .inner > ul > li > ul{ position: absolute; width: 100%; left: 50%; transform: translateX(-50%); padding-top: 30px; display: none; z-index: 3;}
.header_bottom .inner > ul > li > ul > li{text-align: center; margin-bottom: 24px; line-height: 1em;}
.header_bottom .inner > ul > li > ul > li > a{font-size: 1.6rem; color: #ffffff;}
.header_bottom .inner > ul > li > ul > li > a:hover{text-decoration: underline; text-underline-position: under;}
.header_bottom .member{position: absolute; right: 80px; top: 50%; transform: translateY(-50%); display: flex;}
.header_bottom .member li{font-size: 1.6rem; line-height: 1em;}
.header_bottom .member li:last-child{margin-left: 16px; padding-left: 16px; border-left: 1px solid #ddd;}
.header_bottom .member li a{font-size: 1.6rem; color: #686868;}
.menuToggle{display: none;}
.gnb_mo{display: none;}

@media all and (max-width:978px){
    header{height: 70px; border-bottom: 1px solid #eee;}
    header .tel{display: none;}
    header #logo{left: 3%; transform:translateY(-50%); z-index: 10;}
    header #logo a img{max-width: 160px;}
    .header_bottom{display: none;}
    .menuToggle{display: block; position: absolute; right: 3%; top: 50%; transform: translateY(-50%); z-index: 10; cursor: pointer;}
    .menuToggle span{display: block; width: 32px; height: 2px; background-color: #000; transition: .3s;}
    .menuToggle span.t{}
    .menuToggle.on span.t{transform: rotate(45deg); position: relative; top: 8px;}
    .menuToggle span.m{margin: 6px 0;}
    .menuToggle.on span.m{width: 0;}
    .menuToggle span.b{}
    .menuToggle.on span.b{transform: rotate(-45deg); position: relative; top: -8px;}
    .gnb_mo{background-color: rgba(38,57,105,1); height: calc(100vh - 70px); position: fixed; top: 70px; right: 0; width: 100%; z-index: 9; padding: 20px 3% 0;}
    .gnb_mo.on {display: block;}
    .gnb_mo div{cursor: pointer;}
    .gnb_mo div > a{font-size: 2rem;color: #fff; font-weight: 600; display: block; width: 100%; padding-bottom: 10px; padding-top: 10px; border-bottom: 1px solid rgba(255,255,255,0.1);pointer-events: none; cursor: pointer;}
    .gnb_mo > ul > li > ul{display:none; margin-bottom: 10px; }
    .gnb_mo > ul > li{}
    .gnb_mo > ul > li > ul > li{background-color: #132143;  border-bottom: 1px solid rgba(255,255,255,0.1);}
    .gnb_mo > ul > li > ul > li > a{font-size: 1.7rem; color: #fff; padding: 10px 20px; display: block;width: 100%;}
}


/* footer */
.footer_top{background-color: #45506d;}
.footer_top .inner{display: flex; justify-content: space-between;align-items: center;}
.footer_top .inner .left_cont{}
.footer_top .inner .left_cont .list{display: flex;}
.footer_top .inner .left_cont .list li{margin-right: 35px;}
.footer_top .inner .left_cont .list li a{font-size: 1.6rem; color: #ffffff; line-height: 55px; display: block;}
.footer_top .inner .right_cont{}
.footer_top .inner .right_cont .sns{}
.footer_top .inner .right_cont .sns li{}
.footer_top .inner .right_cont .sns li a{}

@media all and (max-width:640px){
    .footer_top .inner{justify-content: center;}
    .footer_top .inner .left_cont .list{justify-content: center; width: 100%;}
    .footer_top .inner .left_cont .list li{margin-right: 0; text-align: center; margin: 0 10px;}
    .footer_top .inner .left_cont .list li a{line-height: 48px;}
}

footer {	width:100%;	clear:both;	position:relative;	margin:0 auto;	background:#f9f9f9;  padding: 35px 0 20px; }
footer .inner{display: flex; justify-content: space-between;}
footer .inner .left_cont{}
footer .inner .left_cont .f_logo{margin-bottom: 20px; display: flex; align-items: center;}
footer .inner .left_cont .f_logo img{}
footer .inner .left_cont .info{}
footer .inner .left_cont .info span{font-size: 1.5rem; color: #686868; display: inline-block; margin-right: 20px; opacity: .7; line-height: 1.7em;}
footer .inner .left_cont .copyright{font-size: 1.3rem; color: #686868; opacity: .5; margin-top: 15px;}
footer .inner .right_cont{display: flex;}
footer .inner .right_cont .cs_center{width: 186px;}
footer .inner .right_cont .cs_center .tit{font-size: 1.6rem; color: #333333; font-weight: 500;}
footer .inner .right_cont .cs_center .tel{margin:5px 0 10px;}
footer .inner .right_cont .cs_center .tel a{color: #e66a24; font-size: 3.2rem; font-family: 'Montserrat', sans-serif; font-weight: 700;}
footer .inner .right_cont .cs_center dl{display: flex; font-size: 1.4rem; color: #686868; line-height: 1.6em;}
footer .inner .right_cont .cs_center dl dt{}
footer .inner .right_cont .cs_center dl dd{}
footer .inner .right_cont .cs_btn{;display: flex; flex-direction: column;}
footer .inner .right_cont .cs_btn li{width:128px; line-height:35px;  text-align: center; border: 1px solid #e4e4e4; border-radius: 3px; margin-bottom: 3px;}
footer .inner .right_cont .cs_btn li a{font-size: 1.4rem; color: #686868;  background-color: #fff;display: block;}

@media all and (max-width:640px){
    footer{padding: 40px 0 40px;}
    footer .inner .left_cont .f_logo{justify-content: center;}
    footer .inner{flex-direction: column; align-items: center;}
    footer .inner .right_cont{order: -1; text-align: center;}
    footer .inner .right_cont .cs_center dl{justify-content: center;}
    footer .inner .left_cont{text-align: center; margin-top: 30px;}
    footer .inner .left_cont .f_logo img{max-width: 168px;}
    footer .inner .left_cont .info span{font-size: 1.4rem; margin-right: 0; margin: 0 6px; line-height: 1.8em;}
    footer .inner .left_cont .copyright{margin-top: 10px;}
    footer .inner .right_cont .cs_center .tel{margin-bottom: 5px;}
    footer .inner .right_cont .cs_center .tel a{font-size: 2.8rem;}
}

.wa{margin-left: 20px; vertical-align: middle;}

.sound_only{position: absolute !important; text-indent: -9999px !important; width: 0 !important; height: 0 !important;}