@charset "utf-8";

@import url('https://fonts.googleapis.com/css?family=Arvo');
@import url('https://fonts.googleapis.com/css?family=Alice');
/* subLayout */
#wrap { overflow-x:hidden; opacity:0; filter: alpha(opacity=0;); }
.subArea {position:relative; padding-left:180px; width:100%; padding-bottom:120px; zoom:1; z-index:5;}
.subArea:after, #contents_layer:after {content: "";display: block;clear: both;}
.subNav { position:fixed; width:100%; height:60px; background:url(../images/bg/white_80.png); right:0; bottom:0; z-index:10;}
.subNav ul { position:absolute; right:20px; bottom:18px;}
.subNav ul:after {content:"";display:block;clear:both;}
.subNav ul li { float:left; margin:0 10px;}
.subNav ul li a { font-size:1.1em; line-height:1.8em;}
.subNav ul li a:hover, .subNav ul li a:focus {text-decoration:underline;}
.subNav ul li.this a {text-decoration:underline; font-weight:700; letter-spacing:-0.05em;}

.topArea { position:relative; height:100vh; overflow:hidden; background:#fff; z-index:2;}
.tour .topArea, .reser .topArea  { position:absolute; width:180px; right:0; top:0; z-index:2;}
.subTitle { position:relative; text-align:center; height:130px; padding:1.8em 180px 1em 0; font-weight:400; color:#283650; z-index:2;}
.room .subTitle {color:#fff; padding:1.8em 0 1em 0;}
.room00 .subTitle { position:absolute; color:#cfa57d; width:60%; left:40%; top:10%; }
.tour .subTitle {padding:1.8em 0 1em 0;}
.subTitle .title01 { display:block;font-family: 'Montserrat', sans-serif; font-size:1.8em; line-height:1em; text-transform:uppercase; font-weight:500; letter-spacing:0.1em; margin-bottom:0.3em;}
.subTitle .title02 { display:block;font-family:'PT Serif', serif; font-size:0.65em; line-height:1.5em; font-style:italic;}
.topArea .lSSlideOuter { position:relative; z-index:1;}
.subTypo { position:absolute; width:38%; max-width:700px; right:0; bottom:27.5%; z-index:3}
.special .subTypo { width:46.5%; max-width:880px; }
.reser .subTypo { width:35.5%; max-width:670px; right:3%; bottom:3%; }
.map .subTypo { width:22%; max-width:362px; right:3%; bottom:3%; }
.tour .subTypo { width:46.5%; max-width:880px; right:15.8%; bottom:10%;  }
.subTypo img { width:100%; vertical-align:top;}
.topArea .btn_scroll { position:absolute; display:block; width:55px; right:62.5px; top:50%; margin-top:-80px; padding:0 0 10px;-webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;  z-index:2; }
.topArea .btn_scroll:hover, .topArea .btn_scroll:focus { padding:10px 0 0;}
.topArea .btn_scroll img { vertical-align:top;}

#contents { position:relative; z-index:2;}
.width_01 { position:relative; width:calc(100% - 180px);}
.width_02 { position:relative;}
.width_01:after, .width_02:after {content:"";display:block;clear:both;}
.con_fix {position:relative; height:1080px; height:100vh; margin: 0 auto;overflow: hidden;padding: 0; background-attachment: fixed !important; background-size:cover !important;  }

#subCon {position:relative; padding:0 0 80px;}
.special00 #subCon { padding:140px 0 30px;}
.room #subCon { padding:0 0 80px;}
.about #subCon, .tour #subCon, .map #subCon, .board #subCon { padding:0 0 30px;}


.sub_reser { display:inline-block; font-size:14px; line-height:20px; color:#6a696e; padding:15px 50px; border:1px solid #b4b4b6; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ase-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.sub_reser:hover, .sub_reser:focus { background:#454545; color:#fff; margin:0 15px; }

@media  (max-width: 1480px){
.topArea { height:60vw;}

}

@media  (max-width: 1280px){
.subNav ul li { margin:0 5px;}
.subNav ul li a {  letter-spacing:-0.1em;}
.subArea {padding-left:150px;padding-bottom:150px;}
.topArea .btn_scroll { right:47.5px; }
.subTitle { height:110px; padding:1.8em 150px 1em 0;}
.subTitle .title01 { font-size:1.6em; line-height:1em; letter-spacing:0.1em; margin-bottom:0.3em;}
.subTitle .title02 { font-size:0.6em; line-height:1.5em;}
.width_01 {  width:calc(100% - 150px);}

.con_fix {height:auto; height:60vw !important; background-attachment:inherit !important; background-repeat:no-repeat !important;  }

}

@media  (max-width: 1200px){

.topArea .btn_scroll { right:37.5px; }
.subTitle { height:110px; padding:1.8em 20px 1em 0;}
.width_01 {  width:calc(100% - 20px);}

}


@media  (max-width: 768px){

}


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

@media  (max-width: 480px){

}


@media  (max-width: 380px){

}