@charset "UTF-8";

/*subheader*/
.headerWrap{ transition:all 0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940); background-color: transparent;}
.sub {background-color: transparent;}
#gnb {position:absolute; height:100%; padding-top:30px; margin:auto; width:100%; text-align:center;}
#gnb > li { display: inline-block; text-align: center; width:115px; letter-spacing: -1px; color:#403637;}
.headerWrap {position:absolute; height:100px; top:0; right:0; z-index:1000; width:100%; min-width:1200px; border-bottom:1px solid rgba(0,0,0,0.1);}
.headerWrap_active{background:#fff; transition:background-color 0.4s; border-bottom:1px solid rgba(0,0,0,0.1)}
.logo{position: absolute; z-index:99999; left:110px; top:50%; transform:translateY(-50%);}
.header{position: relative; width: 100%; height:80px;}
/*#gnb > li:nth-child(3){width:150px;}*/
#gnb > li a { display: inline-block; color:#403637; font-size:18px; font-weight:400; position: relative; width: 100%; height:100%; padding: 9px 0 33px 0; }
#gnb > li a:hover,
#gnb > li.currentGnb a {font-weight: 400; }

.sub #gnb > li a {color:#fff;}



.tel{position:absolute; right:110px; top:65%; transform:translateY(-50%);}
.tel p{color:#403637; font-size:31px; font-weight:700;}
.tel p i{font-style: unset; font-size: 24px;}
.sub .tel p{color:#fff;}

.snbWrap {display:none; position:absolute; width:100%; left:0; top:99px; padding-top: 25px; padding-bottom: 22px; background-color: #fff; z-index:1; border-top:1px solid rgba(0,0,0,0.1)}
.snbWrap #snb { position: relative; text-align:center;  width:100%;}
.snbWrap #snb > li { position: relative; display: inline-block; vertical-align: top; width:115px;}
/* .snbWrap #snb > li { position: relative; display: block; vertical-align: top; width:115px; left: 38.5%; top:0;} */
.snbWrap #snb li ul { width:auto; }
.snbWrap #snb li ul li { margin-bottom:3px; text-align:center; }
.snbWrap #snb li ul li a { display:block; width:100%; padding: 6px 0; font-size:15px; letter-spacing: -1px; color:#676b6e; }
.snbWrap #snb li ul li a:hover,
.snbWrap #snb li ul li.currentSnb a { color: #000; font-weight: 500; }
.snbWrap.scroll_style { background-color: rgba(0,0,0,0.7) }
.snbWrap.scroll_style #snb li ul li a { color: #eee }
.snbWrap.scroll_style #snb li ul li a:hover,
.snbWrap.scroll_style #snb li ul li.currentSnb a { color: #fff }

.snb_quick { position: absolute; top: 26px; left: 135px; }
.snb_quick a { display: block; text-indent: 35px; height: 28px; line-height: 28px; color: #959595; font-size: 15px; margin-bottom: 6px; background-repeat: no-repeat; }
.snb_quick a:hover { color: #000; font-weight: bolder; }
.snb_quick .quick1 { background-image: url(http://logosimg.cafe24.com/ossgFinal/image/common/quick1_off.png); }
.snb_quick .quick2 { background-image: url(http://logosimg.cafe24.com/ossgFinal/image/common/quick2_off.png); }
.snb_quick .quick1:hover { background-image: url(http://logosimg.cafe24.com/ossgFinal/image/common/quick1.png); }
.snb_quick .quick2:hover { background-image: url(http://logosimg.cafe24.com/ossgFinal/image/common/quick2.png); }

.gnbBg { display:none; position:fixed; width:100%; height:100%; top:0; left:0; background:rgba(0, 0, 0, 0.6); z-index:998; }

.headerWrap.scrollUp {
    transform: translateY(0);
    transition: all 0.8s;
}
.headerWrap.scrollDown {
    transform: translateY(-100%);
    transition: all 0.5s;
}

/*footer*/
footer{background:#202020; position:relative; }
footer .footer_wrap{padding:50px 0; display: flex; align-items: flex-start; justify-content: space-between; width: 100%; max-width: 1512px; margin: auto;}
footer .footer_wrap > div{display:inline-block;}

footer .footer_wrap > div.copy p{font-weight:400; font-size:14px}
footer .footer_wrap > div.copy p:nth-child(2){color:#e8e7e0; margin:20px 0 15px 0}
footer .footer_wrap > div.copy p:nth-child(3){color:#e8e7e0; font-size:13px}
footer .footer_wrap > div.copy p:nth-child(4){color:#e8e7e0; font-size:13px; margin-top: 15px;}


footer .footer_wrap > div.add{margin:15px; text-align:right; white-space: nowrap;}
footer .footer_wrap > div.add h2{color:#fff; font-size:36px; font-weight:700;}
footer .footer_wrap > div.add h2 i{font-style: unset; font-size: 26px;}
footer .footer_wrap > div.add h3{color:#c9c9c9; font-weight:400; font-size:17px;}
footer .footer_wrap > div.add h3 b{color:#fff; font-weight:500; font-size:17px;}
footer .footer_wrap > div.add p{margin-top:10px;}

@media screen and (max-width:1700px){
    footer .footer_wrap{max-width: 100%; padding: 50px 40px;}
}

/*topbtn*/
.main_topbtn{position:absolute; left:50%; top:-30px; transform:translateX(-50%)}