/*reset.css*/
body, html{ margin:0; padding:0; width:100%; height:100%; scroll-behavior: smooth;}
body, html, input, textarea, select, button, table{ 
	font-family: 'lora', 'gb';
	-webkit-font-smoothing:antialiased
 }
form, fieldset, h1, h2, h3, h4, h5, h6, p{ margin:0; padding:0; }
form, fieldset, button{ border:none; }
ol, ul, li{ list-style:none; padding:0; margin:0; }
img{ max-width:100%; }
a{ color:inherit; }
a, a:hover{ text-decoration:none; }

.d-lg-none{ display:none; }
.d-lg-block{ display:block; }

/*header*/
header{ position:fixed; z-index:9998; top:0; left:0; width:100%; transition:all .5s; border-bottom:1px solid rgba(255,255,255,.4);}
header, header *{ box-sizing:border-box; }
.hd_con{ width:100%; margin:0 auto; display:flex; justify-content:space-between; align-items:center; padding:0 0 0 4rem; position: relative;}

.lg > a{ display:block; font-size:20px; line-height:1em; white-space:nowrap;}
.lg > a > img{ display:block; width:250px; transition: .5s;}
.mn{ display:flex; align-items:center; }

.hd-wrap{ display:flex; align-items:center; }

/*gnb*/
.hd_bt{ position:relative; z-index:5; }
#gnb{ position:relative; z-index:5;}
#gnb > ul{ display:flex; flex-flow:row wrap; padding-left: 0; margin-bottom: 0;}
#gnb > ul > li{ position:relative; z-index:1; }
#gnb > ul > li > a{ display:block; padding:30px 30px; font-size:14px; font-weight:400; transition: all .5s; color: #fff; text-align: right;}
#gnb > ul > li > ul{ position:absolute; z-index:1; top:100%; left:50%; transform: translateX(-50%); display:none; width: 100%; box-sizing: border-box; background-color: #fff; padding:15px 5px 15px; text-align: center; border-radius: 12px; border: 1px solid #ddd;}
#gnb > ul > li > ul > li{ position:relative; z-index:1; text-align: center;}
#gnb > ul > li::after{content: ""; width: 1px; height: 10px; background-color: #fff; transform: translateY(-50%) rotate(30deg); position: absolute; top: 50%; right: -2px; transition: .5s;}
#gnb > ul > li:last-child::after{display: none;}
#gnb > ul > li > ul > li > a{ display:block; padding:8px 0; font-size:14px; white-space:nowrap; position: relative; color: #666;}
#gnb > ul > li > ul > li > a::before{content: ""; transition: .3s; width: 0; height: 1px; background-color: #fff; position: absolute; left: 0; bottom: 0;}
#gnb > ul > li > ul > li:hover > a::before{width: 100%;}
#gnb > ul > li > ul > li > ul{ position:absolute; z-index:1; top:0; left:100%; display:none; min-width:120px; box-shadow:2px 2px 4px 0 rgba(0,0,0,.3); }
#gnb > ul > li > ul > li > ul > li > a{ display:block; padding:7px 15px; font-size:15px; }

.sns{width: 90px; text-align: center; padding: 35px 0 36px 0; border-left: 1px solid rgba(255,255,255,.4); margin-left: 25px; transition: .5s;}
.sns > a{color: #fff; font-size: 26px; line-height: 1; transition: .5s;}

/* .scr */
header.scr{ background-color:#fff; box-shadow: 0 8px 8px -6px rgba(0,0,0,.06);}
/* header.scr .hd_bt{ box-shadow:0 0 10px 0 rgba(0, 0, 0, 0.25); } */
header.scr #gnb > ul > li > a{ color:#000; padding:10px 30px; }
header.scr .sns{padding:15px 0 17px 0; }

header.scr #gnb > ul > li::after{background-color: #000;}

header.scr .lg > a > img{width: 200px;}

/* fixed */
.fixed-wrap{position: fixed; bottom: 100px; right: 20px; z-index: 8888; height: 182px;}
.fixed-wrap > a{display: flex; font-size: 20px; margin-bottom: 1rem; position: absolute; right: 0; overflow: hidden; border-radius: 50px; align-items: center; background-color: #E2DCD4; width: 0px; height: 50px; padding-left: 50px; transition: .5s;}
.fixed-wrap > a:last-child{margin-bottom: 0;}
.fixed-btn{width: 50px; height: 50px; border-radius: 50%; background-color: #E2DCD4; display: flex; align-items: center; z-index: 2; justify-content: center; position: absolute; top: 0; left: 0; color: #35221e; transition: .3s;}

.fixed-wrap > a:hover{width: 125px;}
.fixed-wrap > a::after{content: ""; font-size: 16px; font-weight: 700; position: absolute; top: 12px; right: 15px; z-index: 1; opacity: 0; transition: .2s;}
.fixed-wrap > a:hover::after{opacity: 1;}

.fixed-wrap > a:nth-child(1){top: 0;}
.fixed-wrap > a:nth-child(2){top: 66px;}
.fixed-wrap > a:nth-child(3){bottom: 0;}

.fixed-wrap > a:nth-child(1):hover{width: 175px;}

.fixed-wrap > a:nth-child(1)::after{content: "010-8583-2811";}
.fixed-wrap > a:nth-child(2)::after{content: "예약하기";}
.fixed-wrap > a:nth-child(3):hover{width: 0;}

@media(max-width:991px){ 
  .hd_con{ padding:0 15px; }
  .lg > a{ padding:10px 0; }
  .lg > a > img{ max-width:200px;}
  .mn{ display:none; }

  .d-none{ display:none; }
  .d-block{ display:block; }
}


/*wrapper*/
.article_mover{ position:absolute; z-index:-1; bottom:100%; }


/*footer*/
.main_ft{width: 100%; height: 100vh; background-color: #333; background-repeat: no-repeat; background-position: center; background-size: cover; position: relative;}

.mainft-cont .sect-tit > h2{color: #fff;}

.mainft-map{width: 100%; margin-bottom: 1rem;}
.mainft-cont > p{color: #fff; font-size: 14px; font-weight: 700; text-align: center;}

.root_daum_roughmap{width: 100% !important;}
.root_daum_roughmap .wrap_controllers{display: none;}
.sect-tit{margin-bottom: 3rem; text-align: center;}
.sect-tit > h2{font-size: 23px; font-weight: 700; position: relative; display: inline-block; padding: 0 1rem;}
.sect-tit > h2 > span{display: inline-block; position: absolute; font-size: 16px;}
.sect-tit > h2 > span.bk-lt{top: -15px; left: -10px;}
.sect-tit > h2 > span.bk-rt{bottom: -15px; right: -10px;}

/*mo_btn*/

.right_wrap{width:80vw; height:100vh; height: -webkit-fill-available; height: fill-available; position:fixed; top:0; right:-100%; background-color:#fff; z-index:9999; box-shadow: rgba(25, 25, 25, 0.04) 0 0 1px 0, rgba(0, 0, 0, 0.1) 0 3px 4px 0;;}
.mo-close{display:block; padding:20px 20px 0; cursor:pointer;}
.mo-close > span{font-size:20px; color:#35221e; margin-right:-10px;}

.mo_btn{ position:relative; z-index:1; width: 39px; height: 39px; text-align: center; background-color:#fff; border-radius:50%; display:none; cursor:pointer; transition:all 1s; border: 1px solid #35221e;}
.mo_btn.dblock{display:block;}
.mo_btn.rfade{transform:translateX(150px);}

.mo_icon{font-size: 22px; color: #35221e; line-height: 1;}

.mo_mn_mn{ width:100%; display:block; padding:50px 0; position:absolute; top:50%; transform:translateY(-50%);}
.mo_mn_mn > li{text-align:center; margin-bottom:20px;}
.mo_mn_mn > li > a{ display:block; padding:.5rem 0; font-size:16px; font-weight:400; position:relative; transition:.3s; color:#000 !important;}
.mo_mn_mn > li.mn-li > a{font-weight: bold;}
.mo_mn_mn > li.mn-li > a > span{display: inline-block; color: #ddd; position: absolute; top: 50%; transform: translateY(-50%); right: 15px; transition: .3s;}
.mo_mn_mn > li.mn-li > a > span.act{transform: translateY(-50%) rotate(180deg); transform-origin: center;}

.mo_mn_mn > li > ul{ display:none; background-color:#fafafa; padding: 10px 0;}
.mo_mn_mn > li > ul > li > a{ display:block; padding:10px 15px; font-size:14px; font-weight:300; }


/* animation */

.ani.up{
  transform: translateY(100px);
  opacity: 0;
  transition: 1.5s;
}

.ani.up.act{
  transform: translateY(0);
  opacity: 1;
}

/* mediaquery */

@media(min-width:992px){ 
  .d-lg-none{ display:none; }
  .d-lg-block{ display:block; }

  .ani.up.delay{
    transition: 1.5s opacity 0.2s, 1s transform 0.2s;
  }
  .ani.up.delay2{
    transition: 1.5s opacity 0.5s, 1s transform 0.5s;
  }
  .ani.up.delay3{
    transition: 1.5s opacity 0.8s, 1s transform 0.8s;
  }

  .main_ft{background-attachment: fixed;}

  .mo-fixed{ display:none; }
  
  .mainft-cont{width: 100%; max-width: 1230px; padding: 0 15px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-40%);}

}
/* @media(max-width:1680px){ 
  #gnb > ul > li > a{padding: 50px 10px;}
  header.scr #gnb > ul > li > a{ padding:30px 10px; }
} */
@media(max-width:991px){ 
  .d-none{ display:none; }
  .d-block{ display:block; }

  .sns{display: none;}
  .fixed-wrap{display: none;}

  .mo-fixed{background-color:#E2DCD4;  width:100%; position:fixed; bottom:0; left:0; z-index:999; display:flex; justify-content:space-between; transition:.5s; }
  .mo-fixed > a{ padding:1rem 0; text-align:center; color:#35221e; font-size:14px; font-weight:400; display:block; flex:1 1 auto; position: relative;}
  .mo-fixed > a > span{display: inline-block; margin-right: 3px;}

  .mo_btn{ display:flex; justify-content: center; align-items: center;}

  .main_ft{height: auto; padding: 100px 0 152px;}
  .mainft-cont{width: 100%; padding: 0 15px;}
  .root_daum_roughmap .wrap_map{height: 250px !important;}
  .mainft-cont > p{font-size: 12px;}

}
@media(max-width:850px){ 

}