@charset "euc-kr";

@font-face {
    font-family: 'NanumSquareNeo';
    src: url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-bRg.eot);
    src: url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-bRg.eot?#iefix) format("embedded-opentype"), url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-bRg.woff) format("woff"), url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-bRg.ttf) format("truetype");
}

@font-face {
    font-family: 'NanumSquareNeoBold';
    src: url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-cBd.eot);
    src: url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-cBd.eot?#iefix) format("embedded-opentype"), url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-cBd.woff) format("woff"), url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-cBd.ttf) format("truetype");
}


    /* ·Î´õ È­¸é Àüü Ä¿¹ö */
    #loader {
      position: fixed;
      top: 0;
      left: 0;
      width: 100vw;
      height: 100vh;
      background-color: white;
      display: flex;
      align-items: center;
      justify-content: center;
      z-index: 9999;
      opacity: 1;
      transition: opacity 0.8s ease; /* ºÎµå·´°Ô »ç¶óÁö°Ô */
    }

    /* ·Îµù ½ºÇÇ³Ê */
    .spinner {
      border: 6px solid #f3f3f3;
      border-top: 6px solid #636363;
      border-radius: 50%;
      width: 50px;
      height: 50px;
      animation: spin 1s linear infinite;
    }
    @keyframes spin {
      to {
        transform: rotate(360deg);
      }
    }


/* ¸ð¹ÙÀÏ ÇÏ´Ü sns¹öÆ° */
  .mobile-fixed-bar {
    display: none;
  }

  @media (max-width: 768px) {
    .mobile-fixed-bar {
      position: fixed;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 40px;
      display: flex;
      z-index: 9999;
    }

    .mobile-fixed-bar a {
      display: flex;
      align-items: center;
      justify-content: center;
      flex: 1;
      height: 40px;
      text-decoration: none;
      color: #000;
      font-weight: bold;
      font-size: 14px;
    }

    .mobile-fixed-bar .instagram {
      background-color: #303f9f;
      color: #fff;
    }
    .mobile-fixed-bar .kakao {
      background-color: #f7a600;
      color: #000;
    }

    .mobile-fixed-bar i {
      margin-right: 6px;
      font-size: 16px;
    }
  }


/* footer ³»¿ë */
@media(min-width: 1000px) {
#m-box1 {width:100%;  padding: 0; margin:0 auto; background-color: #111;}
#left-box1 {
    width: 33.333%;
    background-color: #111;
    text-align: center;
    float: left;
	color: #d0d0d0;
    line-height:180%;
    margin: 0 auto;
    padding-top:30px;
}
#center-box1 {
    width: 33.333%;
    background-color: #111;
    float: right;
    text-align: center;
    line-height:180%;
    margin: 0 auto;
	color: #d0d0d0;	
    font-family: 'NanumSquareNeoBold', sans-serif;
    padding-top:30px;
}
#right-box1 {
    width: 33.333%;
    text-align: center;
    background-color: #111;
    margin: 0 auto;
    line-height:180%;
    text-align: center;
	color: #d0d0d0;
	font-family: 'NanumSquareNeoBold', sans-serif;
    padding-top:30px;
}
}

@media(max-width: 1200px) {
#m-box1 {width:100%;  padding: 10px; margin:0 auto; background-color:#111;}
#left-box1 {
    width: 100%;
    background-color:#111;
    text-align: center;
    line-height:180%;
    margin: 0px auto 20px;
    border-bottom: solid 1px #3e3e3e;
    padding-bottom:10px;
	color: #d0d0d0;
    padding-top:30px;

}
#center-box1 {
    width: 100%;
    background-color: #111;
    text-align: center;
    line-height:180%;
    margin: 0 auto;
    margin: 10px auto 20px;
    border-bottom: solid 1px #3e3e3e;
	color: #d0d0d0;
    padding-bottom:30px;
    font-family: 'NanumSquareNeoBold', sans-serif;
}
#right-box1 {
    width: 100%;
    text-align: center;
    background-color:#111;
    margin: 0 auto;
    line-height:180%;
    text-align: center;
	color: #d0d0d0;
    font-family: 'NanumSquareNeoBold', sans-serif;
}
}

/* ÇÏ´Ü ·¹À̾ƿô */
@media(min-width: 1200px) {
#ft1 { position:relative;  width:100%; margin:0 auto;  text-align:center;background:#111;padding-top:40px;  padding-bottom:40px;}
#ft1 .inner {margin:0 auto;  text-align:center; font-size:12px; color:#d0d0d0;line-height:150%;}
#ft1 .inner .img_area { float:left; width:350px; height:250px; background:url() no-repeat center center; }
#ft1 .inner .info { float:right; width:800px;  line-height:170%; font-weight:400;  font-size:11px}
#ft1 .inner .info .phone { padding-top:30px;font-size:25px; font-weight:bold; font-style: italic; letter-spacing:-1px; font-family: 'NanumSquareNeoBold', sans-serif; }
#ft1 .inner .info .follow { margin:0 auto; }
#ft1 .inner .info .follow p { font-style: italic; }
#ft1 .inner .info .copy {text-transform: uppercase; font-size:12px; color:#666666}
#ft1 .inner .info .copy span {font-family: 'NanumSquareNeoBold', sans-serif; font-size:12px; color:#666666}
}


@media(max-width: 1200px) {
/*#ft { margin-top:20px; padding-bottom:20px; }*/
#ft1 { position:relative;  width:100%; margin:0 auto;  text-align:center;background:#111;padding-top:25px;  padding-bottom:25px;}
#ft1 .inner {margin:0 auto;  text-align:center; font-size:12px; color:#d0d0d0;line-height:150%; padding-bottom:40px;}
#ft1 .inner .img_area {  width:100%; margin:0 auto; height:170px; background:url(../../ver2/imgs/main_foot.jpg) no-repeat center center; }
#ft1 .inner .info { width:90%; margin:20px auto; line-height:170%; font-weight:400;  word-break:break-all; font-size:12px}
#ft1 .inner .info .phone { line-height:150%; text-align:center; padding-top:30px;font-size:18px; font-weight:bold; font-style: italic; letter-spacing:-1px; font-family: 'NanumSquareNeoBold', sans-serif; }
#ft1 .inner .info .follow { margin:15px 0; }
#ft1 .inner .info .follow p { font-style: italic; }
#ft1 .inner .info .copy {text-transform: uppercase; }
#ft1 .inner .info .copy span {font-family: 'NanumSquareNeoBold', sans-serif; }
}


.foot {
  width: 100%;
  background: #111;
}

.foot1 {
  width: 1200px;
  margin: 0 auto; /* °¡¿îµ¥ Á¤·Ä */
}

@media(max-width: 1200px) {
.foot1 {
  width: 100%;
  margin: 0 auto; /* °¡¿îµ¥ Á¤·Ä */
}


/* ==============================================
   layout
   ============================================== */

/* sub body */

#subBodyLine { width: 100%; min-height: 1px; border-top: 1px solid #eeeeee; padding-top: 30px; margin: 0 auto 30px; }

#subBodyLine_foot { width: 100%; min-height: 1px; border-top: 1px solid #eeeeee; padding-top: 10px; margin: 0 auto 10px; }
#subBody { top:20px;margin:0 auto;max-width:1420px;min-height:100px; height:auto;  padding: 0px 10px 0px 10px;}
#subBody1 { width: 95%; min-height: 100px; padding-top: 0px; margin: 0 auto 30px; }
#subBody2 { width: 100%; padding-top: 0px; margin: 0 auto 30px; }

/* body right */

#subBody .bodyRight {min-height: 500px;}
#subBody .bodyRight .titleArea { position: relative; height: 64px; border-bottom: 1px solid #d8d8d8; padding: 12px 0; margin-bottom: 45px;}
#subBody .bodyRight .titleArea h3 { line-height: 40px; font-size: 22px;}
#subBody .bodyRight .titleArea ul.location { position: absolute; right: 0; bottom: 14px; height: 20px;}
#subBody .bodyRight .titleArea ul.location li { float: left; color: #4e4e4e; background: url(../images/common/location_devider.png) left center no-repeat; padding-left: 12px; margin-left: 6px;}
#subBody .bodyRight .titleArea ul.location li.home { background-image: url(../images/common/location_home.png); padding-left: 16px;}


/* mediaquery for mobile */

@media only screen and (max-width: 1024px) {

/* sub body */
#subBodyLine { width: 100%; min-height: 1px; border-top: 0px solid #FFFFFF; padding-top: 0px; margin: 0 auto 0px; }
#subBody { width: auto; min-height: 100px; padding: 0px 10px 0px 0px; margin: 0 auto 20px 10px; }

/* body right */

#subBody .bodyRight { min-height: 20px;}
#subBody .bodyRight .titleArea { position: relative; height: 64px; border-bottom: 1px solid #d8d8d8; padding: 12px 0; margin-bottom: 45px;}
#subBody .bodyRight .titleArea h3 { line-height: 40px; font-size: 22px;}
#subBody .bodyRight .titleArea ul.location { position: absolute; right: 0; bottom: 14px; height: 20px;}
#subBody .bodyRight .titleArea ul.location li { float: left; color: #4e4e4e; background: url(../images/common/location_devider.png) left center no-repeat; padding-left: 12px; margin-left: 6px;}
#subBody .bodyRight .titleArea ul.location li.home { background-image: url(../images/common/location_home.png); padding-left: 16px;}

}



/* ==============================================
   unit
   ============================================== */

/* form */


/* align */

.center { text-align: center;}
.left { text-align: left;}
.right { text-align: right;}

/* button */

a {
     -webkit-transition: all 0.2s ease;
     -moz-transition: all 0.2s ease;
     -o-transition: all 0.2s ease;
     transition: all 0.2s ease;
}



/* ==============================================
   contents
   ============================================== */

/* introduce */

#subBody.introduce .btnList { margin-top: 50px; }

/* product */

.productSlide { position: relative; height: 350px; margin-bottom: 50px; overflow: hidden; }
.productSlide ul.slides li { height: 350px; }

.productSlide ul.flex-direction-nav li a { display: block; position: absolute; top: 50%; width: 47px; height: 47px; text-indent: -9999px; margin-top: -24px; cursor: pointer; z-index: 999; }
.productSlide ul.flex-direction-nav li a.flex-prev { left: 20px; background: url(../images/common/btn_slide_prev.png) 0 0 no-repeat; }
.productSlide ul.flex-direction-nav li a.flex-next { right: 20px; background: url(../images/common/btn_slide_next.png) 0 0 no-repeat; }

/* reservation */

.reservationBox {*zoom:1;} /* Hack for browser IE5.5~7 */
.reservationBox:after { content:" "; display:block; clear:both;} /* float virtual element */
.reservationBox { border: 4px solid #4a4a4a; padding: 40px 0; }
.reservationBox h4 { line-height: 40px; font-size: 13px; font-weight: bold; margin-bottom: 4px; }
.reservationBox .writeArea { float: left; width: 50%; height: 100px; padding: 0 38px; }
.reservationBox .writeArea a.btn { background-color: #cb3233 !important; padding: 0 20px; margin-left: 10px; }
.reservationBox .searchArea { float: left; width: 50%; height: 100px; border-left: 1px solid #4a4a4a; padding: 0 38px; }
.reservationBox .searchArea input.submit { color: #fff !important; font-weight: bold !important; background-color: #cb3233 !important; padding: 0 20px !important; }

#subBody.reservationIntro .btnList { margin-top: 50px; }

@media only screen and (max-width: 800px) {


/* introduce */

#subBody.introduce .btnList { margin-top: 30px; }

/* product */

.productSlide { position: relative; height: 200px; margin-bottom: 30px; }
.productSlide ul.slides li { height: 200px; }

.productSlide ul.flex-direction-nav li a { width: 24px; height: 24px; margin-top: -12px; }
.productSlide ul.flex-direction-nav li a.flex-prev { left: 6px; -webkit-background-size: 100% auto; background-size: 100% auto; }
.productSlide ul.flex-direction-nav li a.flex-next { right: 6px; -webkit-background-size: 100% auto; background-size: 100% auto; }

/* reservation */

.reservationBox { padding: 16px 16px 24px; }
.reservationBox h4 { line-height: 30px; }
.reservationBox .writeArea { float: none; width: auto; height: auto; padding: 0 0 24px 0; }
.reservationBox .writeArea a.btn { width: 160px; text-align: center; padding: 0; margin: 10px 0 0 0; }
.reservationBox .searchArea { float: none; width: auto; height: auto; border: 1px solid #4a4a4a; border-width: 1px 0 0; padding: 15px 0 0 0; }
.reservationBox .searchArea input.text { width: 100px; }
.reservationBox .searchArea input.submit { padding: 0 10px !important; }

#subBody.reservationIntro .btnList { margin-top: 30px; }

}