@charset "utf-8";
/* CSS Document */
html{
overflow-y:scroll;
}
body {
background:#fff;
font-family:"Noto Sans JP";
font-size: 90%;
line-height: 1.6;
color: #222222;
}
* {
margin:0;
padding:0;
}
.w1200{
width: 1200px;
margin: 0 auto;
}
li {
list-style-type: none;
}
a{
text-decoration: none;
}
h5{
font-family: "Quicksand", sans-serif;
font-weight: normal;
font-size: 205%;
text-align: center;
}
h5 span{
display: block;
font-family: "Noto Sans JP", sans-serif;
font-size: 65%;
}
/*--------------------pankuzu */
#pankuzu{
display: block;
background: #fff;
font-size: 0.95em;
}
#pankuzu ul{
width: 1000px;
margin: 0 auto;
overflow: auto;
padding: 10px;
_zoom: 1;
}
#pankuzu li{
float: left;
list-style: none;
}
#pankuzu li + li:before{
margin: 0 8px;
content: '>';
}
/*--------------------container */
#container{
clear: both;
zoom: 1;
width: 100%;
margin: 0 auto;
font-size: 1.1em;
}
/*--------------------contact */
#contact{
background-color: #333333;
padding: 30px 0 50px;
color: #fff;
}
#contact h5{
/*font-size: 2rem;*/
padding-bottom:15px;
text-align: center;
}
.contacts{
width: 950px;
margin: 0 auto;
padding-top: 20px;
font-size: 1.02rem;
vertical-align:middle;
}
.contact_tyo ul{
display: flex;
justify-content: space-between;
}
.contact_tyo ul li{
width: calc(100%/2);
}
.contact_tyo ul li a{
color: #fff;
font-weight: bold;
}
.contact_tyo dl dd.migizoroe{
padding-left: 30px;
}
span.ph-number{
font-size: 1.8em;
padding-left: 15px;
letter-spacing: 4px;
}
/*--------------------上に戻るボタン */
a.pagetop {
color: #fff;
background-color: rgba(0,0,0,0.3);
text-decoration: none;
display: block;
position: fixed;
bottom: 1em;
right: 1em;
font-size: 1.8em;
width: 2em;
height:2em;
line-height:1.8em;
border-radius: 3em;
text-align: center;
cursor: pointer;
}
a.pagetop:hover {
color: #fff !important;
background-color: #E6AC00;
text-decoration: none;
transition: 0.5s;
}
/*--------------------top */
#top{
display: block;
width: 100%;
height: 550px;
background-image: url("../img/bg_river.jpg"),url("../img/bg_coex.jpg");
background-repeat: no-repeat;
background-position: left,right top;
background-size: auto;
position: relative;
}
#top h3{
font-size: 750%;
font-family: "Quicksand", sans-serif;
font-weight: 500;
line-height: 0.9em;
text-align: center;
color: #fff;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
#top h3 p{
width: 420px;
margin: 30px auto 0;
font-size: 18%;
font-family: "Noto Sans JP", sans-serif;
line-height: 2em;
background: #E6AC00;
border-radius: 25px;
}
#top h3 p span,
#top_sp h3 p span{
font-size: 115%;
padding: 0 3px;
}
#top p.notes{
position: absolute;
bottom: 15px;
left: 80px;
color: #fff;
font-weight: 500;
}
#top::before {
content: '';
height: 550px;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-color: rgba(0, 0, 0, 0.5);
}
#top_sp{
display: none;
}
/*--------------------intro */
#intro{
display: block;
width: 100%;
background: url("../img/bg_notebook.jpg");
background-repeat: repeat;
background-size: auto;
padding: 50px 0;
}
#intro p{
text-align: center;
font-weight: 500;
}
#intro_sp{
display: none;
}
/*--------------------hotels */
#hotels{
padding: 50px 0;
background: #f5f5f5;
}
#hotels ul{
display: flex;
justify-content: space-between;
padding: 50px 0 0;
}
#hotels ul li{
width: calc(100%/3 - 1%);
}
#hotels h6{
display: table-cell;
font-size: 125%;
font-weight: 800;
vertical-align: top;
height: 65px;
}
#hotels h6 span{
color :#E6AC00;
padding-right: 10px;
}
#hotels h6 span.h_kaigyo{
display: block;
color: #222;
padding-left: 33px;
}
#hotels p.h_dtl{
padding-top: 10px;
height: 115px;
word-spacing: -2px;
}
#hotels p.h_dtl span{
font-weight: 700;
color:#F2716A; 
}
#hotels .tour{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#hotels .tour a{
display: inline-block;
width: calc(100% / 3 - 2%);
margin-bottom: 7px;
padding: 3px 0;
background: #E6AC00;
color: #fff;
text-align: center;
}
.tour a:hover{
opacity: 0.6;
transition: 0.3s;
}
p.tour_p{
text-align: center;
color: #E6AC00;
font-weight: 500;
margin-bottom: 10px;
font-size: 105%;
}
p.tour_p {
display: flex;
align-items: center;
}
p.tour_p:before,
p.tour_p:after {
content: "";
height: 1px;
flex-grow: 1;
background-color: #E6AC00;
}
p.tour_p:before {
margin-right: 1rem;
}
p.tour_p:after {
margin-left: 1rem;
}
.slides{
position: relative;
width: 100%;
height: 230px;
overflow: hidden;
margin-bottom: 15px;
}
dd.slideshow img{
width: 100%;
height: 100%;
}
.img1, .img2, .img3, .img4, .img5, .img6 {
width: 100%;
height: 230px;
object-fit: cover;
position: absolute;
top: 0;
background: center center no-repeat;
animation: anime 6s 0s infinite;
z-index: 0;
opacity: 0;
}
.img1 {
background-image: url("../img/hotel_1.jpg");
}
.img2 {
background-image: url("../img/hotel_1_room.jpg");
animation-delay: 3s;
}
.img3 {
background-image: url("../img/hotel_2.jpg");
}
.img4 {
background-image: url("../img/hotel_2_room.jpg");
animation-delay: 3s;
}
.img5 {
background-image: url("../img/hotel_3.jpg");
}
.img6 {
background-image: url("../img/hotel_3_room.jpg");
animation-delay: 3s;
}
@keyframes anime {
0% {
opacity: 1;
}
50% {
opacity: 1;
}
60% {
opacity: 0;
/*        transform: scale(1.2);*/
z-index: 10;
}
100% {
opacity: 0;
        /*transform: scale(1.2);*/
}
}