@charset "UTF-8";

/* Fade */

.fadein {
    opacity : 0;
    transform : translate(0, 200px);
    transition:all 0.5s;
}


.sp { display: none!important; }


#page_top{
  width: 50px;
  height: 50px;
  position: fixed;
  right: 0;
  bottom: 0;
  background: #2f1e06;
  opacity: 0.6;
  border-radius: 50%;
}
#page_top a{
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  text-decoration: none;
}
#page_top a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f106';
  font-size: 25px;
  color: #fff;
  position: absolute;
  width: 25px;
  height: 25px;
  top: -9px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}




#luxuryhotel_10{
  background: #806d5c;
  background-image: url(../img/bg.jpg);
  background-repeat: no-repeat;
  background-position: top;
  background-size: auto;
  color: #515151;
  padding-bottom: 50px;
  font-family: "游明朝体", "Yu Mincho", "YuMincho","ヒラギノ明朝 ProN W3", "HiraMinProN-W3";
}




#luxuryhotel_10 a {
  text-decoration: none!important;
}

#luxuryhotel_10 a:hover {
  opacity: .4;
}

.head {
  width: 80%;
  margin: 0 auto;
  padding: 100px 0 110px 0;
  text-align: center;
}

.head img {
  width: 550px;
}





.hotels {
  width: 100%;

}

ul.multiple-item {
  width: 100%;
}





/* SLIDER DETAIL SETTING */

.tokuten p{
  display: inline-block;
  padding: 0.2em 0.6em;
  margin: 0 0.2em 0 0.2em;
  border: solid 1px #515151;
}

/* SLIDER - FONT */

p.name{
  color:#fff;
  font-size: 18px;
  font-weight: bold;
  margin: 0.5em 0 0.5em 0;
  line-height: 1.3em;
}


p.plan{
  color: #eae2d8;
  font-size: 13px;
  margin: 0 0 0.5em 0;
}



span.vip{
  display: inline-block;
  font-size: 11px;
  border: 1px solid #eae2d8;
  padding: 0.1em 0.3em 0.1em 0.3em;
  vertical-align: super;
  color: #eae2d8;
}

span.std{
  display: inline-block;
  font-size: 11px;
  border: 1px solid #fff;
  padding: 0.1em 0.3em 0.1em 0.3em;
  vertical-align: super;
  color: #eae2d8;
}



.price01{
  display: inline-block;
  font-size: 20px;
  color: #eae2d8;
}

.price02{
  display: inline-block;
  font-size: 19px;
  color: #eae2d8;
}



.hotel_contents {
  width: 90%;
  margin: auto;
}



/* BOX--1 */

.palace, .hyatt, .yokohama, .nesta {
  display: flex;
  text-align: center;
  margin: 40px auto 40px auto;
  padding: 15px;
  box-shadow: 0 0 5px 5px #a9977f;
}


.hotel_box1 .left {
 align-self: center;
}

.hotel_box1 .right {
  margin: 0 auto 0 20px;
  align-self: center;
}




/* BOX--2 */

.hotel_box2 {
  display: flex;
  justify-content: space-between;
  margin: 20px auto;
  
}


.ritz, .imperial, .kahuu, .novotel {
  width: 44%;
  text-align: center;
  padding: 15px;
  box-shadow: 0 0 5px 5px #a9977f;
}



/* BOX--3 */



.rihga, .hakone, .prince {
  width: 28%;
  text-align: center;
  padding: 15px;
  margin: 20px 0 40px 0;
  box-shadow: 0 0 5px 5px #a9977f;
}




.rihga img, .hakone img, .prince img, .novotel img, .kahuu img {
  width: 100%;
   height: auto;
}


.btn {
  display: inline-block;
  font-size: 20px;
  padding: 0.4em 3.5em 0.4em 3.5em;
  color: #fff;
  background: #231815;
  transition: .4s;
}


.btn:hover {
  color: #a9977f;
  background: #ccc;
  padding: 0.4em 3.5em 0.4em 3.5em;
}



.rihga .btn, .hakone .btn, .prince .btn {
  padding: 0.3em 1.9em 0.3em 1.9em;
}

.rihga .btn, .hakone .btn, .prince .btn:hover {
  padding: 0.3em 1.9em 0.3em 1.9em;
}




.others {
  text-align: center;
  margin-bottom: 50px;
}






.others .btn {
  display: inline-block;
  font-size: 20px;
  padding: 1em 3.5em 1em 3.5em;
  color: #231815;
  background: #eae2d8;
  transition: .4s;
}


.others .btn:hover {
  color: #a9977f;
  background: #231815;
  padding: 1em 3.5em 1em 3.5em;
}



 /*=== BIG SLIDER SETTING 1 ======================================= */
.slide1 {
  width: 400px;
  height: 280px;
  position   : relative;
  overflow   : hidden;
  margin     : auto; 
}


.slide1 img {
  display    : block;
  position   : absolute;
  width      : inherit;
  height     : inherit;
  opacity    : 0;
  animation  : slideAnime 18s ease infinite;
}
 
.slide1 img:nth-of-type(1) { animation-delay: 0s }
.slide1 img:nth-of-type(2) { animation-delay: 6s }
.slide1 img:nth-of-type(3) { animation-delay: 12s }

@keyframes slideAnime{
   0% { opacity: 0 }
   16% { opacity: 1 }
  33% { opacity: 1 }
  49% { opacity: 0 }
 100% { opacity: 0 }
}





 /*=== BIG SLIDER SETTING 2 ======================================= */
.slide2 {
  width: 372px;
  height: 260px;
  position   : relative;
  overflow   : hidden;
  margin     : auto; 
}


.slide2 img {
  display    : block;
  position   : absolute;
  width      : inherit;
  height     : inherit;
  opacity    : 0;
  animation  : slideAnime 18s ease infinite;
}
 
.slide2 img:nth-of-type(1) { animation-delay: 0s }
.slide2 img:nth-of-type(2) { animation-delay: 6s }
.slide2 img:nth-of-type(3) { animation-delay: 12s }

@keyframes slideAnime{
   0% { opacity: 0 }
   16% { opacity: 1 }
  33% { opacity: 1 }
  49% { opacity: 0 }
 100% { opacity: 0 }
}






/* FONT SETTING */

.head p {
  color: #eae2d8;
  font-size: 20px;
  line-height: 1.8em;
  letter-spacing: 0.1em;
  margin: 70px auto 0px auto;
  text-shadow: 0px 0px 20px #000, 0px 0px 20px #000, 0px 0px 20px #000, 0px 0px 10px #000;
}



p.title {
  color: #fff;
  font-size: 35px;
  text-align: center;
  margin-bottom: 20px;
}



p.hotel_title {
  color: #fff;
  font-size: 23px;
}

.hotel_box2 p.hotel_title {
  font-size: 19px;
  margin: 10px auto 10px auto;
}



p.hotel_title_sub{
  color: #231815;
  font-size: 20px;
}

p.hotel_caption {
  color: #eae2d8;
  font-size: 15px;
  line-height: 1.5em;
  margin: 10px auto 20px auto;
  text-align: justify;

}


p.chui {
  color: #eae2d8;
  font-size: 13px;
}


span.date {
  color: #eae2d8;
  text-decoration:underline;
  font-size: 13px;
}