/* IMPORT CSS */
@import url("grid.css");

img {
	max-width:100%;
	height: auto;/*高さ自動*/
}
a {
    display:block;
    color: #333;
    text-decoration-line: none;
}
a:hover {
	color: #333;
}

.con-area{margin: 0 0 2em;}
.btm20{margin-bottom: 20px;}
.topp20{padding-top: 20px;}
.topp30{padding-top: 30px;}
.pt_1em{ padding: 1em 3em;}
.pt_2em{ padding: 2em 3em;}
.pt_3em{ padding: 3em;}

@media screen and (max-width: 800px){
.con-area{margin: auto 0 6em 0;}
.con-area:nth-child(1){margin: 4em 0 6em 0;}

  .pt_1em{ padding: 1em 0.5em;}
  .pt_2em{ padding: 2em 0.5em;}
  .pt_3em{ padding: 3em 0.5em;}
}

@media (min-width: 751px) {
a[href*="tel:"] {
pointer-events: none;
cursor: default;
text-decoration: none;
}
}
/*ヘッダー
-------------------------------------*/
.header {
  display: flex;
  justify-content: space-between;
	padding: 0;
	margin: auto;
}

@media screen and (max-width: 768px){
.header {
  display: block;
  justify-content: space-between;
	padding: 0rem;
	margin: auto;
}

}



.header_logo .head{
}

.header_logo{
	width: 200px;
    /*コレ*/display:flex;
    /*コレ*/align-items: center;
}



.header-box {
	margin-left: auto;
	margin-top: 8px;
}

.nav{
	width: 700px;
}


.mainimg {
	position: relative;
}

/*=========================
       Movie
===========================*/

.movie-wrap {
    position: relative;
    box-sizing: border-box;
    margin: 0;
    z-index: 0;
}
.movie-wrap:after {
    content:"";
    display:block;
    position: absolute;
    bottom:0;
    left:0;
    width:100%;
    height:10px;
       
    z-index: 10;
}
.movie {
    position: relative;
    width: 100%;
    height:auto;
    background:url("../movie/top.jpg") no-repeat center center;
        background-size:cover;
        text-align: center;
        }
        .movie:before {
        content: "";
        display: block;
        padding-top: 56.2%;
        }
        .movie_inner{
        position: absolute;
        top: 0; left: 0;
        width: 100%;
        height: 100%;
        overflow:hidden;
        z-index: 0;
        }
        .movie_inner video{
        width:100%;
        height:auto !important;
        margin-left:auto;
        margin-right:auto;
        }
        @media screen and (max-width:1024px) {
        .movie:before { padding-top: 56.2%; }
        }
        @media screen and (max-width:767px) {
        .movie:before { padding-top: 56.2%; }
        }



.mainimg .title_box {
  position: absolute;
  top: 50%; /*親要素を起点に上から50%*/
  transform: translateY(-50%); /*要素の大きさの半分ずつを戻す*/
  -webkit-transform: translateY(-50%);
	text-align: center;
	margin: auto;
	display: block;
	width: 100%;
}

.mainimg .title_box h1{
    text-align: center;
    color: #fff;
    font-size: 60px;
    font-weight: normal;
}

.mainimg .title_box .h1_sub{
    text-align: center;
    color: #fff;
    font-size: 24px;
    letter-spacing: 0.1em;
    font-weight: 500;
    filter:drop-shadow(0em 0em 0.4em rgba(255,255,255,0.5));
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
}

.mainimg .title_box img.ttl_logo{
    width: 710px;
    padding-top:28px; 
    /*margin-bottom: -30px;*/
    filter: drop-shadow(0.06em 0.03em 0.4em rgba(255,255,255,0.4));
}

.title_box a {
    width: 100px;
    position: absolute;
    right: 0;
    bottom: 20px;
    left: 0;
    margin: auto;
    z-index: 3;
}

@media screen and (max-width: 768px){
  .mainimg .title_box {
  position: absolute;
  top: 44%; /*親要素を起点に上から44%*/
  transform: translateY(-40%); /*要素の大きさの半分ずつを戻す*/
  -webkit-transform: translateY(-40%);
	text-align: center;
	margin: auto;
	display: block;
	width: 100%;
  }
	
  .mainimg .title_box h1{
    text-align: center;
    color: #fff;
    font-size: 40px;
    font-weight: normal;
  }

  .mainimg .title_box .h1_sub{
    text-align: center;
    color: #fff;
    letter-spacing: 0em;
    font-size: 15px;
    font-weight: normal;
  }

  .mainimg .title_box img.ttl_logo{
    width: 63%;
    padding-top: 18px;
    max-width: 509px;
  }
}

/*  リンク要素ホバーで透過
------------------------*/
.link {
    transition: .6s;
}
.link:hover {
    opacity: .75;
}



.mainimg .title{margin:  20px auto;text-align: center; font-size:42px;}
.mainimg .text_box{
	width: 100vw;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	position: absolute;
	z-index: 10;
	top: 0px;
	text-align: center;
	padding-top: 50px;
}
.mainimg .text_box h1{margin:20px auto 60px auto;text-align: center; color:#fff; font-size:42px; font-weight: normal; letter-spacing: 3px; text-shadow:0px 0px 10px #000000;}
.mainimg .text_box .title{
	color: #fff;
	text-shadow: 0px 0px 10px #000000;
	font-size: 35px;
	margin: 0 0 25px 0;
	font-family : 'Playfair Display','Noto Serif JP', sans-serif ,"Times New Roman", "游明朝", YuMincho,"ヒラギノ明朝 Pr6 W6";
}
.mainimg .text_box p{
	color: #fff;
	text-shadow: 0px 0px 10px #000000;
	font-size: 18px;
	margin: 0 0 15px 0;
}
.mainimg .text_box .day{
	margin: 0 0 10px 0;
	font-size: 26px;
}
.mainimg .text_box .tel{border:#fff 2px solid; padding:20px; display:inline-block; box-shadow: 0px 0px 5px rgba(0,0,0,0.5) ; font-size: 36px;}
.mainimg .text_box .tel .text{color:#fff; text-shadow:0px 0px 10px #000000; font-size:16px; margin:0 0 10px 0;}
.mainimg .text_box .tel .number{color:#fff; text-shadow:0px 0px 10px #000000; font-size:36px; margin:0 0 10px 40px; position: relative;}
.mainimg .text_box .tel .number::before {content:url(../img/tel_icon.png); position: absolute; left:-40px; top:-1px;}


.text2{
    margin:0 0 10px 0;
}


.contact-button {
	padding: 1rem;
	border: 2px solid #000;
}




body {
  margin: 0;
  font-family: "Lato", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  color: #333;
  font-size: 16px;
  line-height: 1.75;
}

/* Navbar & Navmenu color */
:root {
  --background-navbar: rgba(55, 55, 55, 0.98);
}

.header {
	
  /*ヘッダ固定の場合挿入　background: var(--background-navbar);*/
  position: fixed;
  width: 100%;
	z-index: 10000;
	height: 76px;
}

/* Nav items */
.menu {
    list-style: none;
    position: absolute;
    width: 100%;
    height: auto;
    top: 0;
    /* 固定ヘッダの場合　margin-top: 76px;*/
    margin-top: 55px;
    padding: 0 0 10px 0;
    clear: both;
    transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s;
    transform: scale(1, 0);
    transform-origin: top;
}

/* Hamburger menu button */
.menu-btn:checked ~ .menu {
  transform: scale(1, 1);
  transform-origin: top;
  transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s;
}

/* Hamburger menu button */
.menu-btn:checked ~ .menu {
  transform: scale(1, 1);
  transform-origin: top;
  transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s;
}
.menu-close {
  display: none;
  position: fixed;
  z-index: 0;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: all 0.3s ease-in-out 0s;
}
#menu-btn:checked ~ .menu-close {
  display: block;
  opacity: 0.75;
  background-color: #222222;
}

/* Hamburger menbu text */
.menu a {
  text-decoration: none;
  font-weight: 500;
  letter-spacing: 2px;
  font-size: 16px;
  text-transform: capitalize;
  color: #fff;
  opacity: 0;
  transition: 0.5s;
  display: inline-block;
}
.menu a span {
  display:inline-block;
  transition: .5s;
}
.menu a:hover span {
  transform: rotateX(360deg);
}
.menu li {
  border-top: 1px solid rgb(180, 180, 180);
  padding: 15px 0;
  margin: 0 54px;
  opacity: 0;
  transition: 0.5s;
  vertical-align: middle;
}
.menu li:nth-child(1) {
  border-top: 0px solid rgb(180, 180, 180);
}
.menu li::before {
  content: "▶";
  margin-right: 0.7em;
  font-size: 8px;
  align-items: center;
  color: #fff;
  position: relative;
  top: -2px;
}
.menu-btn:checked ~ .menu a,
.menu-btn:checked ~ .menu li {
  opacity: 1;
  transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.2s;
}

.menu-btn {
  display: none;
}

.menu-icon {
display: inline-block;
   /* position: relative;*/
    cursor: pointer;
    padding: 24px 14px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    right: 0;
    position: absolute;
	z-index: 9999;   
	background-color: #1f382f;
}

.navicon {
  background: #fff;
  display: block;
  height: 3px;
  width: 26px;
  position: relative;
  transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s;
}

.navicon:before,
.navicon:after {
  content: "";
  display: block;
  height: 100%;
  width: 100%;
  position: absolute;
  background: #fff;
  transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s;
}

.navicon:before {
  top: 9px;
}

.navicon:after {
  bottom: 9px;
}

/* Hamburger Menu Animation Start */
.menu-btn:checked ~ .menu-icon .navicon:before {
  transform: rotate(-45deg);
}

.menu-btn:checked ~ .menu-icon .navicon:after {
  transform: rotate(45deg);
}
.menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before {
  top: 0;
}
.menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after {
  bottom: 0;
}
.menu-btn:checked ~ .menu-icon .navicon {
  background: rgba(0, 0, 0, 0);
  transition: 0.2192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s;
}
/* Hamburger Menu Animation End */

/* Navbar Container */
.navtext-container {
  width: 100%;
  height: 76px;
  position: absolute;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Navbar Text */
.navtext {
  position: absolute;
  text-transform: uppercase;
  color: #ddd;
  letter-spacing: 4px;
  font-size: 20px;
}


@media screen and (min-width: 768px){
    
}

@media screen and (max-width: 768px){
}
    
/*メイン画像
-------------------------------------*/
.mainimg img {
    width: 100vw;
}

/*メインコンテンツ
-------------------------------------*/
main {
  margin: 0;
}
section {
  margin: 0;
  padding: 6rem 1rem 8.5rem;
  position: relative;
}
section:nth-child(1) {
  margin: 0;
  padding: 11rem 1rem 5rem;
  position: relative;
}
.bg-radius{
  border-radius:0.7em;
}
.bg_MG01 {
	position: relative;
	z-index: 10;
	background: url("../img/bg_pawprints-w.png") center repeat,url(../img/bg_mg.gif) repeat;
    background-size: 108% , auto;
}
.bg_MG02 {
	position: relative;
	z-index: 10;
	background: url(../img/bg_mg.gif) repeat;
}
.bg_MG03 {
    background: rgba(195,229,231,0.74);
    z-index: 10;
}
.bg_MG04 {
    background: rgba(195,229,231,0.18);
    z-index: 10;
}

.bg_W01 {
	position: relative;
	z-index: 10;
	background: url("../img/bg_pawprints-mg.png") center repeat, url(../img/bg_w.gif) repeat;
    background-size: 108% , auto;
}
.bg_W02 {
	position: relative;
	z-index: 10;
	background: url(../img/bg_w.gif) repeat;
}
.bg_W03{
    background: rgba(255,255,255,0.86);
	z-index: 10;
}
.bg_W04{
    background: rgba(255,255,255,0.43);
	z-index: 10;
}

@media screen and (max-width: 800px){
  .bg_MG01,.bg_W01 {
    background-size: 390% , auto;
  }
}

/*デバイス
-------------------------------------*/
.sp-none        { }
.sp-inline-none { display:inline-block;}
.sp-on		    { display:none;}
.sp-inline-on   { display:none;}
.tablet-on		{ display:none;}
.tablet-none	{ }
.sp-inline-table { display:none; }
.w1200-none     { display:block; }
.desktop-none     { display:none; }

@media screen and (max-width: 1024px) {
    .tablet-on		{ display:inherit;}
	.tablet-none	{ display:none;}
}
@media screen and (max-width: 767px) {
    .sp-none		{ display:none;}
    .sp-inline-none { display:none;}
	.sp-on			{ display:inherit;}
    .sp-inline-on   { display:inline;}
    .sp-inline-table { display: inline-table; }
	.sp-text-l		{ text-align:left !important;}
	.sp-center		{ text-align:center;}
}


/*キャッチコピー
-------------------------------------*/
.catch {
    text-align: center;
}
h2 {
  position: relative;
  padding: 0 0 1.5rem;
  text-align: center;
  margin: 0 0 1.5em;
  letter-spacing: 0.01em;
}
h2:before {
  position: absolute;
  bottom: -10px;
  left: calc(50% - 30px);
  width: 60px;
  height: 3px;
  content: '';
  border-radius: 3px;
  background: #000;
}
h2 .h2_sub {
  font-size: 24px;
  letter-spacing: 0.05em;
  color: #15afab;
}

h3{
  font-size: 3.2rem!important;
  line-height: 1.2em!important;
  padding: 0 0 1.5rem;
}

h5{
  font-size: 22px;
  letter-spacing: 0.03em;
  font-weight: 500;
  text-align: left;
  padding: 0 0 1.5rem;
  display: flex;
  justify-content:flex-start;
  align-items: center;
}
h5::after{
  content: '';
  width: 129px;
  height: 3px;
  background-color: #15afab;
  margin-left: 20px;
}
/* 幅768px以下の表示
-------------------------------------*/
@media screen and (max-width: 800px){
  h5::after{
    width: 50%;
  }
}

.under {
}
.under_mini {
	font-size: 16px;
}
.center {
	text-align: center;
	margin-top: 0px;
}

/*申し込みの流れ
-------------------------------------*/
.flow.row {
	margin-bottom: 5rem;
}

/*フォトギャラリー
-------------------------------------*/
.hes-gallery {
    display: grid;
    gap: clamp(4px,0.8vw,10px);
    padding: clamp(4px,0.8vw,10px);
}

.hes-gallery img {
    width: 100%;
    height: auto;
    aspect-ratio: 1000 / 625;
    object-fit: cover;
    transition: 0.3s;
    cursor: pointer;
}

.hes-gallery img:hover {
  transform: scale(1.04);
  box-shadow: 2px 2px 6px #555;
}

@media (min-width: 1025px) {
  .hes-gallery {
      grid-template-columns: repeat(4,minmax(0,1fr));
      /*  columns: 4;*/
  }
}
@media (max-width: 1024px) {
  .hes-gallery {
    grid-template-columns: repeat(3,minmax(0,1fr));
/*    columns: 3;*/
  }
}
/*
@media (max-width: 789px) {
  .hes-gallery {
    grid-template-columns: repeat(3,minmax(0,1fr));
  }
}
*/
@media (max-width: 480px) {
  .hes-gallery {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
}


/*フッター
-------------------------------------*/
footer {
    color: #fff;
    padding: 40px 0 30px;
    background-color: #222;
    font-family: "Lato", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
footer .inner {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    overflow: hidden;
    position: relative;
}
footer .inner p.logo {
    width: 200px;
    height: 200px;
    padding-bottom: 0;
    border-radius: 50%;
    overflow: hidden;
    float: left;
}
footer .inner p.logo a {
    /*display: block;*/
    width: 100%;
    height: 100%;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}
/*  フッターナビゲーション
------------------------*/
footer .inner ul.footer-nav {
    width: 100%;
    max-width: 860px;
    float: right;
    display: flex;
    margin: 0 0 10px;
}
footer .inner ul.footer-nav:nth-child(2) {
    margin: 0 0 36px;
}
footer .inner ul.footer-nav li {
    text-align: center;
    font-size: 14px;
    line-height: 1.25;
    margin: 0 39px 0 0;
}
footer .inner ul.footer-nav li:last-child {
    margin: 0;
}
footer .inner ul.footer-nav li a {
    color: #fff;
    text-decoration: none;
}
footer .inner ul.footer-nav li a span {
    display: block;
    font-size: 16px;
}
/*  ホテル概要
------------------------*/
footer .inner ul.outline {
    width: 100%;
    max-width: 860px;
    float: right;
    overflow: hidden;
}
footer .inner ul.outline li {
    line-height: 20px;
    padding: 0 30px;
    margin: 0 0 20px;
    float: left;
    background-position: left center;
    background-repeat: no-repeat;
}
footer .inner ul.outline li:first-child {
    background-image: url(../../images/common/address-icon.gif);
}
footer .inner ul.outline li:nth-child(2) {
    background-image: url(../../images/common/check-icon.gif);
}
footer .inner ul.outline li:nth-child(3) {
    clear: left;
    font-size: 20px;
    background-image: url(../../images/common/tel-icon.gif);
}
footer .inner ul.outline li:last-child {
    font-size: 20px;
    background-image: url(../../images/common/fax-icon.gif);
}
footer .inner ul.outline li address a {
    color: #fff;
    text-decoration: none;
}
/*  SNS
------------------------*/
footer .inner .sns ul {
    width: 95px;
    display: flex;
    justify-content: space-between;
    position: absolute;
    right: 0;
    bottom: 0;
}
footer .inner .sns ul li {
    width: 40px;
    height: 40px;
    text-align: center;
    font-size: 28px;
    line-height: 40px;
    border-radius: 50%;
    overflow: hidden;
}
footer .inner .sns ul li a {
    display: block;
    width: 100%;
    height: 100%;
    color: #111;
    text-decoration: none;
    background-color: #fff;
}
footer .inner .sns ul li:first-child a:hover {
    color: #fff;
    background-color: #3b5998;
}
footer .inner .sns ul li:last-child a:hover {
    color: #fff;
    background-color: #d62e7a;
}
/*  宿探し・コピーライト
------------------------*/
footer #copyright {
    width: 100%;
    max-width: 960px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    font-family: "Lato", -apple-system, BlinkMacSystemFont, "Helvetica Neue", HelveticaNeue, "Segoe UI", "游ゴシック体", YuGothic, "Yu Gothic M", "游ゴシック Medium", "Yu Gothic Medium", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN W3", HiraKakuProN-W3, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size: 14px;
    line-height: 18px;
    padding: 40px 0 0;
}
footer #copyright p:first-child img {
    margin: 0 1em 0 0;
    vertical-align: middle;
}
footer #copyright p:last-child {
    font-size: 15px;
}
footer #copyright p:last-child a {
    text-decoration: none;
}
footer #copyright p a {
    color: #fff;
}


@media screen and (max-width: 800px){
  footer .inner p.logo {
    width: 160px;
    border-radius: 0;
    height: auto;
    float: none;
    margin: 0 auto;
  }
  footer .inner p.logo a {
    background-color: rgba(255,255,255,0);
  }
  footer .inner p.logo img {
    filter: invert(1);
  }
  footer .inner ul.outline {
    width: 94%;
    max-width: 860px;
    float: none;
    margin: 0 auto;
    padding: 2em 0;
  }
  footer .inner ul.outline li {
    width: fit-content;
    font-size: 18px;
    line-height: 26px;
    padding: 0 0 0 30px;
    margin: 0 auto 16px;
  }
  footer .inner ul.outline li:nth-child(1),
  footer .inner ul.outline li:nth-child(2) {
    letter-spacing: 0.04em;
  }
  footer .inner ul.outline li:nth-child(4) {
    margin-left: 1.4em;
  }
  footer .inner .sns ul {
    margin: 0 auto;
    padding: 0;
    display: flex;
    position: relative;
  }
  footer #copyright {
    width: 94%;
    max-width: 980px;
    display: block;
    margin: 1em auto 0;
    padding: 0;
    text-align: center;
  }
  footer #copyright p:first-child img {
    margin: 0;
  }
}

/*お問い合わせ
-------------------------------------*/
.contact-box {
	border: 1px solid #ccc;
	text-align: center;
	padding: 2rem 0;
}
.table {
	margin:　0;
}
.table th {
	width: 250px;
}

/*コピーライト
-------------------------------------*/
.copyright {
	text-align: center;
	padding: 1rem 0;
	background-color: #000;
	color: #FFF;
	font-size: 11px;
}
.copyright a {
    color: #fff;
    text-decoration: none;
	display: inline;
}

/*ページトップへ戻るボタン
-------------------------------------*/

#page_top{
  width: 75px;
  height: 75px;
  position: fixed;
  right: 0;
  bottom: -150px;
  /* background: #000;
 opacity: 0.6;*/
  border-radius: 50%;
	margin-right: 20px;
z-index: 1000;
}
#page_top a{
  position: relative;
  display: block;
  width: 75px;
  height: 75px;
  text-decoration: none;
}
#page_top a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f106';
  font-size: 45px;
  color: #fff;
  position: absolute;
  width: 75px;
  height: 75px;
  top: -5px;
  bottom: 0;
  right: 0;
  left: 0;
  text-align: center;
}


#pagetop a:hover {
    background: #666;
}

/* 幅768px以下の表示
-------------------------------------*/
@media screen and (max-width: 800px){
	
iframe {

vertical-align:bottom;}
/*ヘッダー
-------------------------------------*/
.header-box {
	display: none;
}	
/*お問い合わせ
-------------------------------------*/
.table th {
	width: 100%;
	display: block;
	padding-left: 10px;
}	
.table td {
	display: block;
}

.text{
	padding-right: 10px;
	padding-left: 10px;
	text-align: left;
}
}




/*スライドショー
-------------------------------------*/

.fade {
	max-width: 1000px;
	margin: 0px auto;
	padding: 0;
	height: auto;
}
.fade img{ width: 100%;}

.fade .slick-next { right: 20px; z-index: 99;}
.fade .slick-prev { left: 20px; z-index: 100;}




#wrap{
  background-color: #333;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100vh;
}
#slider,#slider02,#slider03{
	max-width: 960px;
	margin: 0 auto 10px;
	padding: 0;
	height: auto;
}
.slide-item,.slide-item02,.slide-item03 img{
    width: 100%;
  }  




#thumbnail-list,#thumbnail-list02,#thumbnail-list03{
	
max-width: 1000px;
	text-align: center;
  margin: 0 auto;
  flex-wrap:wrap;
}
#thumbnail-list img,#thumbnail-list02 img,#thumbnail-list03 img{
	
    width: 100px;
	max-width:100px;
	height: auto;/*高さ自動*/

}
.thumbnail-item,.thumbnail-item02,.thumbnail-item03{
	display: inline-block;

	padding: 0px;
	width: 100px;
	margin-top: 0px;
	margin-right: 5px;
	margin-bottom: 0px;
	margin-left: 5px;
}






.center_slide { margin: 0 0 0px;}
.center_slide img { width: 100%; height: auto;}
.center_slide .slick-next { right: 20px; z-index: 99;}
.center_slide .slick-prev { left: 15px; z-index: 100;}


.center_slide {
	margin: 0 0 0px;
}
.center_slide img { width: 100%; height: auto;}
.center_slide .slick-next { right: 20px; z-index: 99;}
.center_slide .slick-prev { left: 15px; z-index: 100;}
.double{
	width: 100%;
	text-align: center;
	margin: 0px;
	padding: 0px;
}

.double h4 {
	font-size: 17px;
  position: relative;
	margin-top: 25px;
  padding: 1em 0;
}
.double h4::before,
.double h4::after {
  position: absolute;
  left: 0;
  content: '';
  width: 100%;
  height: 6px;
  box-sizing: border-box;
}
.double h4::before {
  top: 0;
  border-top: 2px solid #ccc;
  border-bottom: 1px solid #ccc;
}
.double h4::after {
  bottom: 0;
  border-top: 1px solid #ccc;
  border-bottom: 2px solid #ccc;
}
.container p strong{
font-size: 25px;
	
}
.footer_address{
	padding: 20px 0;
}
.banner{
	text-align: center;
}


/*====== 9-1-1 縦線が動いてスクロールを促す =======*/

/*スクロールダウン全体の場所*/
.scrolldown1{
    /*描画位置※位置は適宜調整してください*/
	position:absolute;
	left:50%;
	bottom: -115px;
    /*全体の高さ*/
	height:50px;
}

/*Scrollテキストの描写*/
.scrolldown1 span{
    /*描画位置*/
    position: absolute;
    left: -20px;
    top: -25px;
    /*テキストの形状*/
    color: #eee;
    letter-spacing: 0.05em;
	font-family: system-ui;
}

/* 線の描写 */
.scrolldown1::after{
	content: "";
    /*描画位置*/
	position: absolute;
	top: 0;
    /*線の形状*/
	width: 1px;
	height: 30px;
	background: #eee;
    /*線の動き1.4秒かけて動く。永遠にループ*/
	animation: pathmove 1.4s ease-in-out infinite;
	opacity:0;
}

/*高さ・位置・透過が変化して線が上から下に動く*/
@keyframes pathmove{
	0%{
		height:0;
		top:0;
		opacity: 0;
	}
	30%{
		height:30px;
		opacity: 1;
	}
	100%{
		height:0;
		top:50px;
		opacity: 0;
	}
}



/* メインギャラリー */
.full div {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  height: 100vh;
  margin: 0;
}

.full div::before{
  /* 透過した黒を上から重ねるイメージ */
  background-color: rgba(0,0,0,0.1);
  /* 自由に位置指定 */
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  content: ' ';
}
.full div.img01 {
  background-image: url(../img/mainimg01.jpg);
}
.full div.img02 {
  background-image: url(../img/mainimg02.jpg);
}
.full div.img03 {
  background-image: url(../img/mainimg03.jpg);
}
.full div.img04 {
  background-image: url(../img/mainimg04.jpg);
}
.full div.img05 {
  background-image: url(../img/mainimg05.jpg);
}
.full div.img06 {
  background-image: url(../img/mainimg06.jpg);
}
.full .slick-dots {
  bottom: 5%;
  z-index: +1;
}
/* メインギャラリー */
.footer_logo{
	line-height: 25px;
	text-align: center;
}
.footer_sub{
	font-size: 14px;
}

.w800{
max-width: 800px;
	width: 100%;
	margin: auto;
}

.w900{
max-width: 900px;
	width: 100%;
	margin: auto;
}

.w960{
max-width: 960px;
	width: 100%;
	margin: auto;
}

.defo_table{
width: 100%;
    border-left: #222 1px solid;
    border-top: #222 1px solid;
    padding: 0px;
    margin: 0 auto 40px auto;
    border-collapse: collapse;
    border-spacing: 0;
}
.defo_table th {
    border-bottom: #222 1px solid;
    border-right: #222 1px solid;
    padding: 15px;
    text-align: left;
    background: #c5c5c5;
}
.defo_table td {
    border-bottom: #222 1px solid;
    border-right: #222 1px solid;
    padding: 15px;
    text-align: left;
}
table.w28 th {
    width: 20%;
}
table.w28 td {
    width: 80%;
}
table.w37 th {
    width: 30%;
}
table.w37 td {
    width: 70%;
}
@media screen and (max-width: 800px){

.w800{
max-width: 800px;
	width: 100%;
	margin: auto;
    padding: 10px 0;
}

.w900{
max-width: 900px;
	width: 100%;
	margin: auto;
    padding: 10px 0;
}

.w960{
max-width: 960px;
	width: 100%;
	margin: auto;
    padding: 10px 10px;
}
	
.defo_table{
width: 100%;
    border-left: #222 1px solid;
    border-top: #222 1px solid;
    margin: 0 auto 40px auto;
    border-collapse: collapse;
    border-spacing: 0;
}
.defo_table th {
    border-bottom: #222 1px solid;
    border-right: #222 1px solid;
    padding: 15px;
    text-align: left;
    background: #c5c5c5;
	display: block;
}
.defo_table td {
    border-bottom: #222 1px solid;
    border-right: #222 1px solid;
    padding: 15px;
    text-align: left;
	display: block;
}
table.w28 th,table.w37 th {
    width: 100%;
}
table.w28 td,table.w37 td {
    width: 100%;
}
}

/* 料金表 */
.compare{
max-width: 960px;
  width: 100%;
  margin: 0 auto 4em;
  padding: 20px 30px;
}
.compare:last-child{
  margin: 0 auto 0;
}
.compare table{
  border-collapse: collapse;
  width: 100%;
  margin-bottom: 2em;
}
.tb01 th,
.tb01 td{
  padding: 10px;
  text-align:center;
  box-sizing:border-box;
  border: solid 1px rgba(21,175,171,0.4);
}
.tb01 .head th {
  width: 100%;
}
.tb01 th {
  width: 25%;
  max-width: 250px;
  background: #dcf3f2;
  color: #000;
  font-weight: 500;
}
.tb01 td{
  background: #fff;
  font-size: 1.9rem;
  line-height: 2.4rem;
}
.tb01 td:before{
  content: attr(data-label);
  font-size: 1.25rem;
  font-weight:600;
  display: block;
  margin: 0 auto;
}
.tb01 td:nth-child(2)::before,
.tb01 td:nth-child(3)::before{
  width: 50%;
}
.tb01 td:nth-child(2)::before{
  color: #15afab;
}
.tb01 td:nth-child(3)::before{
  color: #af1547;
}
.tb01 td .yen::after{
  content: "円";
  margin-left: 2px;
  font-size: 1.4rem;
}

.compare .att_list {
  padding: 0 0 0 1em;
  background: url("../img/bg_paw-mg02.png") no-repeat right 2px top 0px / 16%, url("../img/bg_paw-mg01.png") no-repeat right 62px bottom 20px / 14%;
}
.compare .att_list li {
  text-align: left;
  list-style-type: none;
  padding: .1em .5em;
  position: relative;
} 
.compare .att_list li:before {
  content: "★";
  font-weight: 900;
  color: #0c8985;
  position: absolute;
  top: .1em;	/* アイコンの上側位置調整 */
  left: -.8em;	/* アイコンの左側位置調整 */
}


/* ご宿泊について */
.compare2{
max-width: 960px;
  width: 100%;
  margin: 0 auto 4em;
  padding: 20px 30px;
}
.compare2:last-child{
  margin: 0 auto 0;
}
.compare2 .att_list {
  margin: 0 auto;
  padding: 0 0 0 1em;
  background: url("../img/bg_paw-mg01.png") no-repeat right 0px top 0px / 13.5%;
}
.compare2 .att_list li {
  text-align: left;letter-spacing: 0.06em;
  list-style-type: none;
  padding: .1em .5em;
  position: relative;
}
.compare2 .att_list li:before {
  content: "※";
  font-weight: 900;
  color: #000;
  position: absolute;
  top: .1em;	/* アイコンの上側位置調整 */
  left: -.8em;	/* アイコンの左側位置調整 */
}

@media screen and (max-width: 800px){
    .compare{
      width: 94%;
      padding: 20px 0;
    }
    .tb01 th {
      width: 30%;
    }
    .tb01 td:nth-child(2)::before,
    .tb01 td:nth-child(3)::before{
      width: 100%;
    }
    .compare2 {
    width: 94%;
    padding: 20px 0;
    }
}


.more {
  position:relative;
  width:100%;
  line-height: 100%;
}
.more a {
  width: 100%;
  line-height: 60px;
  color: #FFF;
  background: #1f382f;
  border-radius: 0.6em;
  font-size: 1em;
  position: relative;
  z-index: 1;
  letter-spacing: 0.05em;
  display: inline-block;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
}
.more a:after {
  position: absolute;
  content: "";
  width: 0;
  height: 100%;
  top: 0;
  right: 0;
  z-index: -1;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  background:rgba(255,255,255,.3);
}
.more a:hover {
  opacity:1;
}
.more a:hover:after {
  left: 0;
  width: 100%;
}

.link-icon {
  width: 0.7em;
  height: 0.7em;
  display: inline-block;
  margin-left: 0.75rem;
  position: relative;
  top: 0.05rem;
  background: url("../../images/common/link-w-icon.png") center center / cover;
  opacity: .7;
}

@media screen and (max-width: 800px){
  .more{
    padding: 1em 0.5em;
    display: inline-block; }
  .more:last-child{
    padding: 1em 0.5em 0;
    display: inline-block; }
}


.col .title{
    font-size: 2.8rem!important;
    line-height: 1.3;
    letter-spacing: 0.1rem;
}
.col span.time{
  font-weight: 500;
  font-size: 1.8em;
  line-height: 0.7em;
  display: inline;
  color: #15afab;
}
.col span.tel{
  font-weight: 500;
  font-size: 1.8em;
  line-height: 0.94em;
  letter-spacing: 0.05em;
}
.col span.tel a{
  display: inline;
  color: #15afab;
}


.tel_box .wrap {
  padding: 50px 0;
  background: rgba(255,255,255,0.75);
  border: solid #d1ebec 0.25rem;
}
.tel_box .hd{
  font-size: 21px;
  font-weight: 500;
  margin: 0;
  padding: 1.5rem 0 0 0;
}
.tel_box .num {
  font-size: 60px;
  margin: 0;
  padding: 0;
}
.tel_box p {
  letter-spacing: 1px;
  margin: 0;
  padding: 0;
}
.tel_box .num a {
  color: #15afab;
}
.tel_box .note{
  font-size: 20px;
  color: #4e4e48;
}

@media screen and (max-width: 800px){
  .tel_box .wrap {
    padding: 30px 0;
    }
  .tel_box .hd{
    font-size: 1.1em;
    padding: 1.5rem 0 0 0;
    }
  .tel_box .num {
    font-size: 2.7em;
    }
  .tel_box .note{
    font-size: 1em;
    }
}