@charset "utf-8";
*{
    margin:0;
    padding:0;
}



/*ハンバーガーメニュー↓*/
.inner {
    width: 100vw;
	max-width: 1200px;
    margin: 0 auto;
}
.inner:after {
    content: "";
    clear: both;
    display: block;
}
 
 
/* header */

#header {
	width:100%;
/*	max-width: 1200px;*/
	margin: 0 auto;
	height: 150px;
	background: #3F7098;
	font-family: "Quicksand', sans-serif","游ゴシック", YuGothic, "メイリオ", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}

#top-head {
    top: -100px;
    position: absolute;
    width: 100vw;
/*	max-width: 1200px;*/
    margin: 145px auto 0;
    line-height: 1;
    z-index: 998;
}
#top-head a,
#top-head {
    text-decoration: none;
}

#top-head p {
    color: #ffffff;
}

#top-head .inner {
    position: relative;
}

#top-head .logo {
	width: 408px;
	height: auto;
	padding-left: 13px;
    float: left;
}


#top-head .logo img {
    width: 100%;
    }

#global-nav {
	float: right;
	padding: 0 10px;
	
}

.nav_sp_only {
	display: none;
}

#global-nav ul {
	max-width: 1200px;
    list-style: none;
    position: absolute;
	text-align: center;
	margin-right: 10px;
    right: 0;
    bottom: 8px;
    font-size: 14px;
}
#global-nav ul li {
  padding: 0 10px;
float: left;
}

#global-nav ul li a {
    padding: 0 15px;
}

/*hover時に下線*/
#global-nav ul li a {
  position: relative;
  display: inline-block;
  text-decoration: none;
}
#global-nav a::after {
  position: absolute;
  bottom: -6px;
  left: 0;
  content: '';
  width: 100%;
  height: 2px;
  background: #ffffff;
  transform: scale(0, 1);
  transform-origin: center top;
  transition: transform .3s;
}
#global-nav a:hover::after {
  transform: scale(0.8, 1);
}
/*hover時に下線↑*/

#global-nav a:hover {
  opacity: .5;
}

 
/* Toggle Button */
#nav-toggle {
    display: none;
    position: absolute;
    right: 12px;
    top: 20px;
    width: 34px;
    height: 36px;
    cursor: pointer;
    z-index: 101;
}
#nav-toggle div {
    position: relative;
}
#nav-toggle span {
    display: block;
    position: absolute;
    height: 2px;
    width: 100%;
    background: #fff;
    left: 0;
    -webkit-transition: .35s ease-in-out;
    -moz-transition: .35s ease-in-out;
    transition: .35s ease-in-out;
}
#nav-toggle span:nth-child(1) {
    top: 0;
}
#nav-toggle span:nth-child(2) {
    top: 11px;
}
#nav-toggle span:nth-child(3) {
    top: 22px;
}

/*ハンバーガーメニューここまで*/


@media screen and ( max-width:940px )
{
/*ハンバーガーメニュー*/
#header {
		height: 64px;
		margin: 0 auto;
	}
	
    #top-head,
    .inner {
        width: 100vw;
        padding: 0;
		margin: 0 auto;
    }
    #top-head {
        top: 0;
        position: fixed;
        margin-top: 0;
    }
    /* Fixed reset */
    #top-head.fixed {
        padding-top: 0;
        background: transparent;
    }
    #mobile-head {
	background: #3F7098;
	width: 100%;
        height: 79px;
        z-index: 999;
        position: relative;
    }
	
	
	
#top-head.fixed {
        position: fixed;
		display: block;
	    width: 100%;
		height: auto;
/*		height: 59px;*/
/*	margin-top: 8px;*/
/*		padding-left: 13px;*/
/*	    top: 8px;*/
    }
	
#top-head .logo {
	    width: 286px;
		height: auto;
	margin-top: 8px;
    }

	
    #global-nav {
        position: absolute;
        /* 開いてないときは画面外に配置 */
		top: -100vh;
        background: #3F7098;
		opacity: 0.9;
        width: 100%;
		height: 100vh; /* ビューポートの高さを100%に */
        text-align: center;
/*        padding: 5px 0;*/
        -webkit-transition: .5s ease-in-out;
        -moz-transition: .5s ease-in-out;
        transition: .5s ease-in-out;
    }
    #global-nav ul {
        list-style: none;
        position: static;
		margin-top: 80px;
        right: 0;
        bottom: 0;
        font-size: 16px;
/*		line-height: 1.2em;*/
    }
	
	.nav_sp_only {
	display: block;
		
}
    #global-nav ul li {
/*		display: inline-block; 
		height: 45px;*/
/*  　　　　clear: both;*/
		  padding: 0;
		float:none;
		    bottom: 0;
/*        position: static;*/
    }
	

	
    #top-head #global-nav ul li a,
    #top-head.fixed #global-nav ul li a {
        width: 100%;
				display: inline-block; 
/*        display: block;*/
        color: #fff;
/*        padding: 18px 0;*/
		padding: 40px 0 0;
    }
	
	
	/*hover時に下線消す*/
/*#global-nav ul li a {
  position: relative;
  display: inline-block;
  text-decoration: none;
}*/
#global-nav a::after {
/*  position: absolute;
  bottom: -6px;
  left: 0;
  content: '';
  width: 100%;*/
  height: 0;
/*  background: #ffffff;
  transform: scale(0, 1);
  transform-origin: center top;
  transition: transform .3s;*/
}
#global-nav a:hover::after {
  transform: scale(0, 0);
}
/*hover時に下線↑*/
	
	
	
    #nav-toggle {
        display: block;
		margin-right: 10px;
		margin-top: 5px;
    }
    /* #nav-toggle 切り替えアニメーション */
    .open #nav-toggle span:nth-child(1) {
        top: 11px;
        -webkit-transform: rotate(315deg);
        -moz-transform: rotate(315deg);
        transform: rotate(315deg);
    }
    .open #nav-toggle span:nth-child(2) {
        width: 0;
        left: 50%;
    }
    .open #nav-toggle span:nth-child(3) {
        top: 11px;
        -webkit-transform: rotate(-315deg);
        -moz-transform: rotate(-315deg);
        transform: rotate(-315deg);
    }
    /* #global-nav スライドアニメーション */
    .open #global-nav {
        /* #global-nav top + #mobile-head height */
        -moz-transform: translateY(100vh);
        -webkit-transform: translateY(100vh);
        transform: translateY(100vh);
    }
	
	#sns {
		display: none;
	}	

/*	#translation {
		display: none;
	}	*/
	

	
/*mobile_ハンバーガーメニュー↑*/
	
}

/*----------------@media screen↑-------------------*/


a:link { color:#666; text-decoration:none }
a:visited { color:#666; text-decoration:none }
a:hover { color:#666; text-decoration:none }
a:active { color:#666; text-decoration:none }

a:hover {
  opacity: .5;
}

.en {
	font-family: 'Quicksand', sans-serif;
	font-weight: lighter;
}

.fa.ico-la {
	font-size: 2em;
}

.fa.ico-la2 {
	font-size: 3em;
}

/*#sns {
	width: 220px;
	height: 30px;
	float: right;
}*/

#sns {
	max-width: 1200px;
	height: 30px;
	margin: 0 auto;
}

#sns ul {
	list-style: none;
	float:right;
	margin-right: 30px;
}
#sns ul li {
	width: 50px;
	display: inline-block; 
	margin: 20px auto;
	text-align: right;
}

#sns .fa.fainstagram {
	padding-left: 0.3em;
}

.fa {
	height: 30px;
	width: 40px;
	text-align:center;
}

.fa-white{
	color: #ffffff;
}

.fa-gray
{
	color: #999 ;
}

.fafacebook:hover {
  opacity: .5;
}

.fainstagram:hover {
  opacity: .5;
}

.fatwitter:hover {
  opacity: .5;
}

.fapinterest:hover {
  opacity: .5;
}



/*↓topへ戻る*/
#pagetop
    {
	width: 90px;
	height: 90px;	
    position: fixed;
	z-index: 1;
    bottom: 30px;
    right: 20px;
	opacity: 0.7;
    } 

#pagetop img {
	width: 100%;
	height: auto;
}
#pagetop:hover
{
    opacity: 0.5;
}
/*↑topへ戻る*/

#container {
	width:100%;
	max-width: 1200px;
	margin: 0 auto;
	min-height: 100vh;
	font-family: "Quicksand', sans-serif","游ゴシック", YuGothic, "メイリオ", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
	font-size: 14px;
	color: #666;
    line-height: 1.8em;
}

.small {
	font-size: 12px;
	line-height: 1.5em;
}

.bold {
  font-weight: bold;
}





/*TOPページ↓*/
#mv_slide {
	width: 100%;
	height: auto;
 	max-height: 580px;
	margin-top: 50px;
	text-align: center;
	overflow: hidden;
}
.slider{
    width: 100%;
	height: auto;
}
.slider img{
    height: auto;
/*	max-height: 510px;*/
    width: 100%;
}
/*slick setting*/
.slick-prev:before,
.slick-next:before {
    color: #000;
}

/*スライド画像ロード時の画像の縦並びとかを表示させない↓*/
.slider {
  display:none;
}
.slider.slick-initialized {
  display: block;
}
/*スライド画像ロード時の画像の縦並びとかを表示させない↑*/


#con1 {
	width: 970px;
	height: auto;
	margin: 20px auto;
}

#con1-sp {
	display: none;
}

.read_intro {
	width: 144px;
	height: 20px;
	margin: 80px auto;
}

.read_intro img {
	width: 100%;
}

.read_box {
	width: 970px;
	height: 315px;
	margin: 80px auto;
}

.read_box .en {
	line-height: 1.5;
}


.read_img_box {
	width: 500px;
	height: 315px;
	float: left;
}
.read_img_box img {
	width: 100%;
}

.read_txt_box {
	width: 410px;
	height: 265px;
	float: left;
	margin: 50px 0 0 60px;
	display: block;
}

.read_end {
	text-align: center;
}

p {
	color: #666666;
}


/*----------------topics↓-------------------*/

#topics {
	width: 970px;
	height: auto;
	margin: 120px auto;
}

.topics-image {
	width: 970px;
	height: auto;
	margin: 0 auto 20px;
}

#topics p {
	text-align: center;
	font-size: 20px;
	line-height: 2em
}

#message {
	width: 500px;
	height: auto;
	margin: 40px auto;
}

#message dl {
	width: 600px;
	line-height: 2em;
}

#message dt {
	float: left;
}

#message dd {
	margin-left: 80px;
}

/*----------------topics↑-------------------*/

#con2 {
	width: 970px;
	height: auto;
	margin: 80px auto 50px;
	line-height: 1.8em;
}

#insta {
	text-align: center;
}

#insta .fa.fainstagram {
	padding-left: 0.2em;
}

#instawidget {
	width: 970px;
	height: 240px;
	margin: 10px auto 30px;
}

/*↓insta埋め込み*/
/* デスクトップ時：横一列に4枚並べる */
.insta_list {
  width: 970px;
  margin: 20px auto;
  padding: 0;
  display: flex;
  flex-wrap: nowrap;   /* 1行に並べる */
  gap: 10px;           /* 画像間に10pxの隙間 */
  list-style: none;    /* リストマーカーを削除 */
}

.insta_list li {
  position: relative;
  /* 4枚の場合、横の隙間は3箇所あるので合計30px分を引く */
  width: calc((100% - 30px) / 4);
}

.insta_list li::before {
  content: "";
  display: block;
  padding-top: 100%;  /* 正方形にする */
}

.insta_list a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.insta_list img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* タブレット・スマホ時（画面幅750px以下）：2列2段にする */
@media screen and (max-width: 750px) {
  .insta_list {
    width: 100%;      /* ブラウザ幅に合わせる */
    flex-wrap: wrap;  /* 複数行に折り返す */
    gap: 10px;        /* 行・列ともに10pxの隙間 */
  }
  .insta_list li {
    /* 2列の場合、横の隙間は1箇所（10px）なので */
    width: calc((100% - 10px) / 2);
  }
}

/*.insta_btn{
    background-color: #000;
    padding: .5em 1em;
    width: fit-content;
    margin: 0 auto;
    cursor: pointer;
    transition: .3s
}

.insta_btn a{
    color: #fff;
    text-decoration: none;
}

.insta_btn:hover{
    background-color: #999;
}*/
/*↑insta埋め込み*/

#con2 p {
	text-align: center;
}

.title {
	font-size: 16px;
}


#info_sns {
	width: 220px;
	height: 30px;
	margin: 50px auto 60px
	
}
#info_sns ul {
	list-style: none;
	
}
#info_sns ul li {
	width: 50px;
	margin: 0 auto;
	text-align: center;
    float: left;
}
#info_sns .fa {
	height: 30px;
	width: 40px;
	text-align: center;
}

#info_sns .fa.fainstagram {
	padding-left: 0.2em;
}

#info_diary {
/*	width: 900px;*/
	width: 450px;
	height: 300px;
	margin: 0 auto;
	padding-left: 15px;
	line-height: 1.5em;
}

.d_box {
	width :210px;
	height: auto;
	float: left;
	margin-right: 15px;
}

.d_box img {
	width: 100%;
	  opacity: 1;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.d_box:hover img {
  opacity: .5;
}

.d_box figcaption {
	font-size: 14px;
	color: #666;
}

#info_line {
	width: 970px;
	height: auto;
	margin: 20px auto 50px;
	text-align: center;
}

.line_box {
	width: 190px;
	height: auto;
	margin: 10px auto 0;
}

#info_line .large {
	font-size: 15px;
	font-weight: bold;
	text-align: center;
}

.line_box img {
	width: 100%;
}

.line_box figcaption {
	 margin-top: -15px;
	margin-bottom: 15px;
	
}

.line_box figcaption a {
	font-size: 14px;
	color: #00B900;
	text-decoration: underline;
}

/*footerを最下部に固定↓*/

html, body  {
    height: 100%;
	 margin: 0;
}
/*footerを最下部に固定↑*/

#footer {
	width: 100%;
	height: auto;
	margin: 100px 0 0 0;
  padding: 0;
	background: #3F7098;  
	font-family: "Quicksand', sans-serif","游ゴシック", YuGothic, "メイリオ", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
	text-align: center;
}

#logo_footer {
	width: 154px;
	height: auto;
	margin: 30px auto 10px;
	padding-top: 35px;
}

#logo_footer img {
	width: 100%;
}

#info_name {
	width: 300px;
	height: auto;
	margin: 10px auto 30px;
}

#info_adress_sp {
	display: none;
}

#pp {
	width: 300px;
	height: 30px;
	margin: 20px auto;
}

#copyright {
	width: 300px;
	height: 30px;
	margin: 40px auto 20px;
}

#copyright p {
	font-size: 11px;
}

#footer p {
	color: #fff;	
    font-size: 13px;
    line-height: 1.5em;
}

#footer a {
			color: #fff;	
}

#footer a:hover {
  opacity: .5;
}


/* 〜960px---------index-tablet↓--------------------- */
@media screen and (max-width:960px) { 
	
	
#con1-sp {
	display: block;
}
	
#con1 {
		display: none;
	}	
	
.read_intro {
/*	width: 144px;
	height: 20px;*/
	height: auto;
	margin: 40px auto 0;
}	
	
.read_box {
	width: 100%;
	max-width: 500px;
	height: auto;
	margin: 0 auto;
}
	
.read_img_box {
	width: 90%;
	height: auto;
	max-width: 500px;
	margin: 30px auto 0;
	float: none;
}


.read_txt_box {
/*	width: 410px;
	height: 265px;*/
	width: 85%;
	height: auto;
	float: none;
	margin: 0 auto;
/*	display: block;*/
}
	
.read_end {
	display: block;
	margin: 40px auto;
	}	
	
#topics {
	width: 90%;
	height: auto;
	margin: 60px auto;
}

.topics-image {
	width: 100%;
	height: auto;
	margin: 0 auto 20px;
	overflow: hidden;
}

.topics-image img {
	width:100%;
	max-width: 100%;
	height: auto;
	}	


#topics p {
	text-align: center;
	font-size: 14px;
	line-height: 3em
}

#message {
	width: 90%;
	height: auto;
	margin: 20px auto;
}
	
#message p {
		font-size: 10px
	}

#message dl {
	width: 100%;
/*	line-height: 1.5em;*/
}

#message dt {
	float: none;
	display: block;
	margin-top: 15px;
	line-height: 1.5em;
}

#message dd {
	margin-left: 0;
	line-height: 1.2em;
}
	
#con2 {
	width: 90%;
	height: auto;
	margin: 50px auto;
/*	line-height: 1.8em;*/
}
	
	
/*#instawidget {
	width: 100%;
	height: auto;
	margin: 10px auto;
}	
	*/
#info_sns {
	width: 100%;
	max-width: 220px;
	height: auto;
	margin: 35px auto;
	padding-left: 15px; 
	
}	

#info_diary {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	height: auto;
	margin: 0 auto;
	padding: 25px 0 0;
/*	padding-left: 6%;*/
	overflow: hidden;
}
	
.d_box {
/*	float: none;*/
/*	display: block;*/
	width :44%;
	max-width: 210px;
	height: auto;
	margin: 10px auto;
/*	padding-right: 1%;*/
}
	
#info_line {
	width: 90%;
/*	height: auto;
	margin: 50px auto 50px;
	text-align: center;*/
}
	
/*#info_diary figure:nth-child(2) {
	clear: both;
	}

#info_diary figure:nth-child(3) {
		float: left;
	}	
	
#info_diary figure:nth-child(4) {
		float: left;
	}	
	*/
#footer {
		height: auto;
	}	
	
#info_adress {
	display: none;
}
	
#info_adress_sp {
	display: block;
}
	
	
	
 
}
/* 〜960px---------index-tablet↑--------------------- */

/* 〜960px---------index-mobile↓--------------------- */
@media screen and (max-width:490px) { 
#mv_slide {
	width: 100%;
	height: auto;
	margin-top: 0;
}
.slider {
	width: 150%;
	text-align: center;
	margin-left: -25%;
/*	overflow: hidden;*/
}
	

#topics {

	margin: 0 auto 50px;
}

.topics-image {
	margin: 0 auto;
}
	
	
#con2 {
	margin: 0 auto 50px;
}	
	
#info_line {
	margin: 50px auto;
}
	
#info_line .large {
	font-size: 14px;
}

#info_line p {
/*	width: 90%;
	height: auto;
	margin: 50px auto 50px;*/
	text-align: left;
}
	
/*#instawidget {
	width: auto;
	height: 80px;
	margin: 10px auto;
	overflow: hidden;
}	*/
	
#pagetop
    {
	width: 25%;
    } 

}

/* 〜960px---------index-mobile↑--------------------- */

/*------------------TOPページ↑------------------*/


/*------------------aboutページ→------------------*/

#about_mv {
	width: 970px;
	height: auto;
	margin: 40px auto 0;
}

#about_slide {
	width: 90%;
	max-width: 970px;
	height: auto;
	text-align: center;
/*	padding-top: 64px;*/
	overflow: hidden;
	margin: 0 auto;
}

#about_slide .slider {
    width: 100%;
	height: auto;
}

#about_slide .slider img {
    height: auto;
/*	max-height: 510px;*/
    width: 100%;
}


#about_read {
	width: 880px;
	height: 390px;
	margin: 100px auto;
}

#ab_r_p {
	width: 440px;
	height: 390px;
	float: left;
}

#ab_r_p img {
	width: auto;
	height: 100%;
}

#ab_r_r {
	width: 440px;
	height: 390px;
	margin: 30px auto 0;
	float: left;
	text-align: center;
	
}

#ab_r_r_sp {
	display: none;
}




.large {
	font-size: 17px;
	line-height: 1.5em;
}


#about_staff {
	width: 880px;
	height: auto;
	overflow: hidden;
	margin: 100px auto 0;
}

.ab_title {
	width: 290px;
	height: 50px;
	margin: 0 auto 10px;
	text-align: center;
}

.ab_title img {
	width: 100%;
	height: auto;
}

.about_staff1 {
	width: 880px;
	height: 230px;
	margin: 40px 0 0;
}
.ab_staff_p1 {
	width: 230px;
	height: 230px;
	float: left;
}

.ab_staff_p1 img {
	width: 100%;
}

.ab_staff_r1 {
	width: 600px;
	height: 230px;
	padding-left: 30px;
	margin: 20px 0 0 0; 
	float: left;	
}

.about_staff2 {
	width: 440px;
	height: 150px;
	margin: 20px 0 0 0;
/*	float: left;*/
}

.ab_staff_p2 {
	width: 150px;
	height: 150px;
	float: left;
}

.ab_staff_p2 img {
	width: 100%;
}

.ab_staff_r2 {
	width: 250px;
	height: 150px;
	padding-left: 30px;
	margin: 20px 0 0 0; 
	float: left;	
}

#about_yh {
	width: 880px;
	height: auto;
	margin: 50px auto;
	overflow: hidden;
}

#about_yh a:hover {
  opacity: .5;
}

.abot_yh_people img {
	width: 170px;
	height: auto;
	float: left;
	margin: 0;
	padding: 0;
}


/* 〜960px---------about-tablet--------------------- */
@media screen and (max-width:960px) { 

#about_mv {
	width: 100%;
	margin: 0 auto;
/*	height: auto;
	margin: 0 auto;*/
}	
	
#about_read {
	width: 90%;
	height: auto;
	margin: 30px auto 0;
}
	
#ab_r_p {
/*	width: 440px;
	height: 390px;*/
	width: 90%;
	max-width: 400px;
	height: auto;
	margin: 0 auto;
	float: none;
}
	
#ab_r_p img {
	width: 100%;
	height: auto;
}	
	
#ab_r_r {
	display: none;
}
	
#ab_r_r_sp {
	text-align: left;
	width: 100%;
	display: block;
	margin: 10px auto 0;
}

#ab_r_r_sp p.center {
		text-align: center;
	}	
	
	
	
#about_staff {
	width: 90%;
	margin: 50px auto 0;
/*	height: auto;
	overflow: hidden;*/
/*	margin: 100px auto 50px;*/
}

.about_staff1 {
	width: 100%;
	height: auto;
	margin: 40px auto;
}
.ab_staff_p1 {
	width: 100%;
	max-width: 230px;
	height: auto;
	margin: 0 auto; 
	float: none;
}

.ab_staff_r1 {
	width: 100%;
	height: auto;
	padding-left: 0;
	margin: 0 auto; 
	float: none;	
}
	
.about_staff2 {
	width: 100%;
	height: auto;
	margin: 10px auto;
}

.ab_staff_p2 {
	width: 45%;
	max-width: 150px;
	height: auto;
	float: left;
}

/*.ab_staff_p2 img {
	width: 100%;
}*/

.ab_staff_r2 {
	width: 50%;
	height: auto;
	padding-left: 10px;
	margin: 0 auto; 
	float: left;	
}	
	
#about_yh {
	width: 90%;
	height: auto;
	margin: 50px auto;
	overflow: hidden;
}

.abot_yh_people img {
	width: 33%;
	height: auto;

}	

}
/* 〜960px---------about-tablet----------- */


/* 〜960px---------about-tablet--------------------- */
@media screen and (max-width:490px) { 
	
#about_mv {
	width: 100%;
/*	height: auto;
	margin: 0 auto;*/
}	
	
#about_slide {
	width: 100%;
	height: auto;
	}
	
#about_slide .slider {
	width: 160%;
	text-align: center;
	margin-left: -30%;
/*	overflow: hidden;*/
}		

}
	

/*-----------------↑aboutページ↑-----------------*/



/*-----------------↓facilityページ↓-----------------*/

#facility {
	width: 970px;
	margin: 0 auto;
}



#ttl-facility {
	width: 290px;
	height: 50px;
	margin: 50px auto 10px;
	text-align: center;
}

#ttl-facility img {
	width: 100%;
}

.f-room figcaption {
	font-size: 14px;
	line-height: 1.8em;
	color: #666;
	text-align: center;
}


.large {
	font-size: 16px;
}

/*料金・遊ぶ・アクセス・予約のリード文も一緒の#read使ってる↓*/
#read {
	text-align: center;
	margin: 20px 0;
}

#read_facility {
	text-align: center;
	margin: 20px 0;
}

#read_facility_sp {
		display: none;
	}

.read {
	text-align: center;
	margin: 20px 0;
}

#facility-mv {
	width: 970px;
	height: auto;
	margin: 50px auto;
	text-align: center;
}

#facility-mainbox_room {
	width: 970px;
	height: auto;
	margin: 70px auto;
	display: block;
	overflow: hidden;
}

#facility-mainbox_room_sp {
	display: none; 
}

.facility-mainbox {
	width: 970px;
	height: auto;
	margin: 70px auto;
	display: block;
	overflow: hidden;
}

.facility-mainbox p {
	line-height: 1.8em;
}


.facility-roombox {
	width: 970px;
	height: auto;
	margin: 30px auto;
	display: block;
	overflow: hidden;
}

.facility-room {
	width: 322px;
	height: auto;
	float: left;
	margin-left: 1px;
}

.facility-room img {
	width: 100%;
	height: auto;
}

.facility-boxl {
	width: 460px;
	float: left;
}

.facility-boxr {
	width: 460px;
	float: right;
}

.t-large {
	font-size: 18px;
}

#ttl-timetable {
	width: 290px;
	height: 50px;
	margin: 100px auto 20px;
	text-align: center;
}

#ttl-timetable img {
	width: 100%;
}

#time-mainbox {
	width: 650px;
	margin: 0 auto;
	display: block;
}

.time-box {
	padding-left: 20px;
	margin: 60px auto 0;
	display: block;
}

.f-room img:hover {
  opacity: 0.5;
}

/*モーダル↓*/
.modal-content {
    position:fixed;
	display:none;
    z-index:2;
/*    width: 100%;*/
    margin:0;
    padding:10px 20px;
    background:#fff;
}

.modal-content p {
	text-align: right;
    margin:0;
    padding:0;
}


.modal-content img {
	display: block;
	text-align: center;
	width: 100%;
	height: auto;
}


.modal-overlay {
    z-index:1;
    display:none;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:120%;
    background-color:rgba(0,0,0,0.75);
}

/*.modal-open {
    color:#00f;
    text-decoration:underline;
}*/

/*.modal-open:hover {
    cursor:pointer;
    color:#f00;
}*/

/*.modal-close {
    color:#00f;
    text-decoration:underline;
}*/

/*.modal-close:hover {
    cursor:pointer;
	color:#f00;
}*/
/*モーダル↑*/

/* 〜960px---------facility-mobile--------------------- */
@media screen and (max-width:960px) { 

#facility {
	width: 90%;
	margin: 0 auto;
}	

#read_facility {
	
		display: none;
	}
	
#read_facility_sp {
		display: block;
		text-align: left;
		margin: 20px 0;
}
	
#facility-mv {
	width: 100%;
/*	height: auto;
	margin: 50px auto;
	text-align: center;*/
}
	
#facility-mv img {
		width: 100%;
	}	
	
#facility-mainbox_room {
	display: none;
}
	
#facility-mainbox_room_sp {
	display: block;
	width: 100%;
	height: auto;
	margin: 0 auto;
}	
	
.facility-mainbox {
	width: 100%;
	margin: 0 auto;
/*	height: auto;
	display: block;
	overflow: hidden;*/
}		
	
.facility-boxl {
	width: 100%;
	float: none;
	margin: 30px auto 0;
}

.facility-boxr {
	width: 100%;
	float: none;
	margin: 30px auto 0;
}
	
#time-mainbox {
	width: 100%;
/*	margin: 0 auto;
	display: block;*/
}
	
.time-box {
	padding-left: 0;
/*	margin: 60px auto 0;
	display: block;*/
}	
	
	
}

/* 〜960px---------facility-mobile↑------- */

/* 〜490px---------facility-mobile↓------- */
@media screen and (max-width:490px) { 

#facility-mv {
	width: 100%;
	height: auto;
	overflow: hidden;
}

#facility-mv p {
		text-align: left;
	}	
	
#facility-mv p.center {
		text-align: center;
	}	
	
#facility-mv img {
	width: 150%;
	text-align: center;
	margin-left: -40%;
	overflow: hidden;
	}	
}
/* 〜490px---------facility-mobile↑------- */

/*-----------------↑facilityページ↑-----------------*/

/*-----------------↓mealページ↓-----------------*/

#meal {
	width: 970px;
	height: auto;
	margin: 0 auto 20px;
}

#ttl-meal {
	width: 290px;
	height: 50px;
	margin: 50px auto 10px;
	text-align: center;
}


#ttl-meal img {
	width: 100%;
}

#read_food_sp {
	display: none;
}

.meal-mainbox {
	width: 970px;
	height: auto;
	margin: 100px auto;
	overflow: hidden;
}

.meal-boxl {
	width: 485px;
	height: auto;
	float: left;
}

.meal-boxl p {
	width: 380px;
	padding: 0 0 0 20px;
	text-align: right;
}

.meal-boxl img {
	width: 380px;
	height: 380px;
	padding-left: 20px;
}

.meal-boxr {
	width: 485px;
	display: block;
	text-align: center;
	margin: 0 auto;
	float: left;
}

#meal2 {
	width: 970px;
	height: auto;
	margin: 0 auto;
	overflow: hidden;
}

#ttl-meal2 {
	width: 290px;
	height: 50px;
	overflow: hidden;
	margin: 100px 0 10px;
/*	padding-top: 50px;*/

}

#ttl-meal2 img {
	width: 100%;
}

.meal2-mainbox {
	width: 970px;
	height: auto;
	margin: 20px auto;
	overflow: hidden;
}

.meal2-boxl {
	width: 485px;
	height: auto;
	float: left;
}

.meal2-boxr {
	width: 470px;
	height: 190px;
	float: right;
}

.meal2-imgbox {
	width: 190px;
	height: 190px;
	margin-right: 10px;
	float: left;
}
.meal2-boxl img {
	width: 100%;
}

.meal2-boxr img {
	width: 100%;
}


.meal2-txtbox {
	width: 260px;
	float: left;
}

.meal2-txtbox p {
	line-height: 1.8em;
}

.coment_meal {
	display: block;
	margin: 100px 0;
	text-align: center;
}

.coment_meal_sp {
	display: none;
}

.small-right {
	font-size: 12px;
	text-align: right;
}

.small-red {
	font-size: 12px;
	color: red;
}

/* 〜960px---------meal-mobile↓--------------------- */
@media screen and (max-width:960px) { 
#meal {
	width: 90%;
/*	height: auto;
	margin: 0 auto 20px;*/
}

#read {
	display: none;
	}	
	
#read_food_sp {
	display: block;
	text-align: left;
	margin: 20px 0;
}	
	
.meal-mainbox {
	width: 100%;
	margin: 50px auto;
}

.meal-boxl {
	width: 100%;
	max-width: 380px;
	margin: 0 auto;
	float: none;
}
	
.meal-boxl img {
	width: 100%;
	height: auto;
	padding-left: 0;
}
	
.meal-boxl p {
	width: 100%;
	padding: 0;
/*	text-align: right;*/
}	

.meal-boxr {
	width: 100%;
	height: auto;
	max-width: 485px;
	display: block;
	text-align: left;
	margin: 20px auto;
	float: none;
}	
	
#meal .large {
	text-align: center;
	line-height: 1.8em
	}	
	
#meal2 {
	width: 100%;
/*	height: auto;
	margin: 0 auto;
	overflow: hidden;*/
}
	
#ttl-meal2 {
	margin: 50px 0 0 0;
}
	
.meal2-mainbox {
	width: 100%;
	height: auto;
	margin: 0 auto;
	overflow: hidden;
}
	
.meal2-boxl {
	width: 100%;
	height: auto;
	float: none;
	margin: 20px auto 0;
}

.meal2-imgbox {
	width: 100%;
	max-width: 190px;
	height: auto;
	margin: 0 auto;
	float: none;
}
	

.meal2-txtbox {
	width: 100%;
	max-width: 490px;
	margin: 0 auto;
	float: none;
}	
	
.meal2-boxr {
	width: 100%;
	height: auto;
	float: none;
	margin: 20px auto 0;
}	
	
.coment_meal {
	display: none;
}	
	
.coment_meal_sp {
	display: block;
	margin: 50px 0 0;
	text-align: left;
}	
	
}

/*-----------------↑meal-mobile↑-----------------*/

/*-----------------↑mealページ↑-----------------*/




/*-----------------↓priceページ↓-----------------*/
#price {
	width: 970px;
	height: auto;
	margin: 0 auto 20px;
}

#ttl-price {
	width: 290px;
	height: 50px;
	margin: 50px auto 10px;
	text-align: center;
}

#ttl-price img {
	width: 100%;
}


.price {
	width: 970px;
	height: auto;
	margin: 0 auto 20px;
}

.ttl-price {
	width: 290px;
	height: 50px;
	overflow: hidden;
	margin: 20px 0 10px;
	padding-top: 100px;
}

.ttl-price img {
	width: 100%;
}

.ttl-room {
	width: 290px;
	height: 50px;
	overflow: hidden;
	margin: 20px 0 10px;
	padding-top: 100px;
}

.ttl-room img {
	width: 100%;
}

.price-mainbox {
	width: 970px;
	height: 190px;
	margin: 20px auto;
	overflow: hidden;
}

.price-boxl {
	width: 485px;
	height: 190px;
	float: left;
}

.price-boxr {
	width: 470px;
	height: 190px;
	float: right;
}

.price-imgbox {
	width: 190px;
	height: 190px;
	margin-right: 10px;
	float: left;
}
.price-boxl img {
	width: 100%;
}

.price-boxr img {
	width: 100%;
}


.price-txtbox {
	width: 260px;
	float: left;
}

.price-txtbox p {
	line-height: 1.6em;
}

#about_yh2 {
	width: 970px;
	height: auto;
	margin: 50px 0 0;
}

.price_large {
	font-size: 16px;
	padding-top: 6px;
}

#price .coment {
	text-align: center;
}

/* ウィンドウ幅がタブレット_600~960pxの場合に適用するCSS */
@media screen and ( max-width:960px ) and ( min-width:485px )
{	
#price {
	width: 90%;
/*	height: auto;
	margin: 0 auto 20px;*/
}

#price #read {
		display: block;
		text-align: left;
	}
	
	
.price {
	width: 100%;
/*	height: auto;
	margin: 0 auto 20px;*/
}	
	
.price-mainbox {
	width: 100%;
	height: auto;
	margin: 0 auto;
/*	overflow: hidden;*/
}

.price-boxl {
/*	width: 485px;
	height: 190px;*/
	margin: 30px 0 0;
	float: none;
}

.price-boxr {
/*	width: 470px;
	height: 190px;*/
	margin: 30px 0 0;
	float: none;
}
	


#price .coment {
	text-align: left;
}
	
#price .center {
		text-align: center;
	}	
	
.price .small-right {
		text-align: left;
	}		

}

/* ウィンドウ幅がタブレット_600~960pxの場合に適用するCSS ↑*/


/* 〜960px---------price-mobile↓-------*/
@media screen and (max-width:484px) { 
#price {
	width: 90%;
/*	height: auto;
	margin: 0 auto 20px;*/
}

#price #read {
	display: block;
	text-align: left;
	}	
		
.price {
	width: 100%;
}
	
.ttl-price {
	padding-top: 50px;
}

.ttl-room {

	padding-top: 50px;
}

.price-mainbox {
	width: 100%;
	height: auto;
	margin: 0 auto;
/*	overflow: hidden;*/
}

.price-boxl {
	width: 100%;
	max-width: 470px;
	height: auto;
	margin: 30px auto 0;
	float: none;
}
	
.price-boxr {
	width: 100%;
	max-width: 470px;
	height: auto;
	margin: 30px auto 0;
	float: none;
}

.price-imgbox {
	width: 100%;
	max-width: 290px;
	height: auto;
	margin: 0 auto;
	float: none;
}
	
.price .small-right {
		text-align: left;
	}	
	
.price-txtbox {
	display: block;
	width: 100%;
	margin: 2px auto;
	max-width: 290px;
	float: none;
}
	
.price-txtbox .large {
		text-align: center;
	}
	
.price_large {
		text-align: center;
}
	
.price_coment {
		display: block;
	margin-top: 40px; 
	}	
	
.price .coment .center {
	text-align: center;
}	
	

	
}
/* 〜484px---------meal-price↑-------- */

/*-----------------↑priceページ↑-----------------*/


/*-----------------↓accessページ↓-----------------*/




#access {
	width: 970px;
	height: auto;
	margin: 0 auto;
}

#ttl-root {
	width: 290px;
	height: 50px;
	margin: 50px auto 10px;
}

#ttl-root img {
	width: 100%;
}

#root {
	width: 970px;
	height: auto;
	margin: 100px auto 20px;
}

.root-mainbox {
	width: 970px;
	height: 130px;
	margin: 20px auto;
	overflow: hidden;
}

.root-boxl {
	width: 485px;
	height: 130px;
	float: left;
}

.root-boxr {
	width: 470px;
	height: 130px;
	float: right;
}

.root-imgbox {
	width: 170px;
	height: 130px;
	float: left;
}
.root-boxl img {
	width: 100%;
	height: auto;
}

.root-boxr img {
	width: 100%;
}

.root-txtbox {
	width: 250px;
	padding-top: 20px;
	float: left;
}


#google-map {
	width: 970px;
	height: 400px;
	margin: 70px 0 0;
}

#map {
	width: 970px;
	height: 400px;
	margin: 50px 0;
}

#map img {
	height: 100%;
}

#car {
	width: 970px;
	height: auto;
	margin: 0 auto 20px;
}

.ttl-vehicle {
	width: 290px;
	height: 50px;
	overflow: hidden;
	margin: 20px 0 6px;
	padding-top: 100px;
}

.ttl-vehicle img {
	width: 100%;
}

.car-mainbox {
	width: 970px;
	height: auto;
	margin: 70px auto;
	overflow: hidden;
}

.car-mainbox2 {
	width: 970px;
	height: auto;
	margin: 70px auto;
/*	overflow: hidden;*/
}

.car-boxl {
	width: 450px;
	height: auto;
	float: left;
}

.car-boxr {
	width: 450px;
	height: auto;
	margin-left: 70px;
	float: left;
}

#plane {
	width: 970px;
	height: auto;
	margin: 0 auto 20px;
}

.plane-mainbox {
	width: 970px;
	height: auto;
	margin: 70px auto;
}

.vehicle-txtbox {
	width: 970px;
	height: auto;
}

#bus-train {
	width: 970px;
	height: auto;
	margin: 0 auto 20px;
}


#bus-mv {
	width: 970px;
	height: auto;
	margin: 30px auto 10px;
	overflow: hidden;
}

#bus-mv-l {
	width: 400px;
	height: auto;
	float: left;
}

#bus-mv-l img {
	width: 100%;
}

#bus-mv-r {
	width: 520px;
	height: 300px;
	padding: 100px 0 0 50px;
	float: left;
}

#bus-yachiyo {
	width: 970px;
	height: auto;
	margin: 80px 0 0;
	overflow: hidden;
}

#bus-yachiyo-l {
	width: 200px;
	height: 200px;
	float: left;
}

#bus-yachiyo-l img {
	width: 100%;
}

#bus-yachiyo-r {
	width: 520px;
	height: 230px;
	padding: 0 0 0 30px;
	float: left;
}

#bus-mainbox {
	width: 970px;
	height: auto;
	margin: 70px auto 0;
}

#bus-yachiyo-timebox {
	width: 930px;
	height: 200px;
	padding: 30px 0;
	overflow: hidden;
}

#timebox-l {
	width: 450px;
	height: 200px;
	float: left;
}

#timebox-l img {
	height: 65%;
}

#timebox-r {
	width: 450px;
	height: 200px;
	float: left;
	margin-left: 30px;
}

#timebox-r img {
	height: 65%;
}

#bus-tokachi {
	width: 970px;
	height: auto;
	margin: 70px 0 0;
	overflow: hidden;
}

.bus-timetable {
	width: 970px;
	height: auto;
	margin: 20px 0;
}

.access_coment_sp {
	display: none;
	
}

.bus-timetable img {
	width: 90%;
}

.bus-timetable2 {
	width: 970px;
	height: auto;
	margin: 30px 0;
}

.bus-timetable2 img {
	height: 200px;
}

#bus-apoi {
	width: 970px;
	height: auto;
	margin: 70px 0 0;
}

#ferry {
	width: 970px;
	height: auto;
	margin: 80px auto 20px;
}

#ferry-mainbox {
	width: 970px;
	height: auto;
	margin: 70px auto;
}


/* 〜960px---------access-mobile↓--------------------- */
@media screen and (max-width:960px) {
#access {
	width: 90%;
/*	height: auto;
	margin: 0 auto;*/
}
	
.br-pc {
	display: none;
}
	
#root {
	width: 100%;
/*	height: auto;*/
	margin: 30px auto 20px;
}		
	
.root-mainbox {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	height: auto;
	margin: 0px auto;
/*	overflow: hidden;*/
}

.root-boxl {
	width: 100%;
	max-width: 470px;
	height: auto;
	margin: 20px auto 0;
	float: none;
}

.root-boxr {
	width: 100%;
	max-width: 470px;
	height: auto;
	margin: 20px auto 0;
	float: none;
}
	
.root-imgbox {
	width: 30%;
	max-width: 100px;
	height: auto;
/*	padding-top: 20px;*/
/*	float: left;*/
}
	
.root-txtbox {
	width: 70%;
	padding-top: 0;
/*	float: left;*/
}
	
#google-map {
	width: 100%;
	height: auto;
	margin: 50px 0 0;
}

#map {
	width: 100%;
	max-width: 420px;
	height: auto;
	margin: 0 auto;
}	
	
#map img {
	width: 100%;
/*	height: 100%;*/
}	

#car {
	width: 100%;
/*	height: auto;
	margin: 0 auto 20px;*/
}	

.ttl-vehicle {
	padding-top: 50px;
}
	
.car-mainbox {
	width: 100%;
/*	height: auto;*/
	margin: 0 auto;
/*	overflow: hidden;*/
}
	
.car-mainbox2 {
	width: 100%;
/*	height: auto;*/
	margin: 40px auto 0;
/*	overflow: hidden;*/
}	

.car-boxl {
	width: 100%;
/*	height: auto;*/
	margin: 40px 0 0 0;
	float: none;
}

.car-boxr {
	width: 100%;
/*	height: auto;*/
	margin: 40px 0 0 0;
	margin-left: 0;
	float: none;
}
	
#plane {
	width: 100%;
/*	height: auto;
	margin: 0 auto 20px;*/
}

.plane-mainbox {
	width: 100%;
/*	height: auto;*/
	margin: 40px auto 0;
}	
	
.vehicle-txtbox {
	width: 100%;
/*	height: auto;*/
}
	
#bus-train {
	width: 100%;
/*	height: auto;*/
	margin: 0 auto;
}


#bus-mv {
	width: 100%;
	height: auto;
	margin: 20px 0;
/*	overflow: hidden;*/
}

#bus-mainbox {
	width: 100%;
/*	height: auto;*/
	margin: 40px auto 0;
}
	
#bus-mv-l {
	width: 100%;
	max-width: 400px;
	height: auto;
	margin: 0 auto;
	float: none;
}
	
#bus-mv-l img {
	width: 100%;
	max-width: 400px;
}	
	
#bus-mv-r {
/*	display: block;*/
	width: 100%;
	max-width: 400px;
	height: auto;
	padding: 0;
	margin: 0 auto;
	float: none;
}	
	
/*#bus-mv-r_sp {
	display: block;
	width: 100%;
	max-width: 400px;
	height: auto;
	padding: 0;
	margin: 0 auto;
	float: none;
}	*/	

#bus-yachiyo {
	width: 100%;
/*	height: auto;
	margin: 80px 0 0;
	overflow: hidden;*/
}	
	
#bus-yachiyo-l {
	width: 100%;
	max-width: 200px;
	height: auto;
	margin: 0 auto;
	float: none;
}


#bus-yachiyo-r {
	width: 100%;
	max-width: 520px;
	height: auto;
	margin: 0 auto;
	padding: 0;
	float: none;
}	

#bus-yachiyo-timebox {
	width: 100%;
	height: auto;
	padding: 20px 0 0;
/*	overflow: hidden;*/
}

#timebox-l {
	width: 100%;
	max-width: 450px;
	height: auto;
	margin: 0 auto;
	float: none;
}
	
#timebox-l img {
	width: 100%;
	max-width: 290px;
	height: auto;
}

#timebox-r {
	width: 100%;
	max-width: 450px;
	height: auto;
	margin: 20px auto 0;
	float: none;
}

#timebox-r img {
	width: 100%;
	max-width: 370px;
	height: auto;
}	
	
#bus-tokachi {
	width: 100%;
/*	height: auto;*/
	margin: 50px 0 0;
/*	overflow: hidden;*/
}
	
.bus-timetable {
	width: 100%;
	height: auto;
	margin: 20px 0;
}
	
.access_coment_sp {
	display: block;
		
	}

.bus-timetable img {
	width: 700px;
	overflow: scroll;
}

.bus-timetable2 {
	width: 100%;
/*	height: auto;
	margin: 30px 0;*/
}
	
.timetable-img {
		overflow: auto;
	}

#bus-apoi {
	width: 100%;
/*	height: auto;*/
	margin: 50px 0 0;
}

#ferry {
	width: 100%;
/*	height: auto;*/
	margin: 40px auto 20px;
}

#ferry-mainbox {
	width: 100%;
/*	height: auto;*/
	margin: 50px auto;
}
	
	
	
	
}
/* 〜960px---------access-mobile↑------------------ */

/*-----------------↑accessページ↑-----------------*/


/*-----------------↓playページ↓-----------------*/

#play-all {
	width: 970px;
	height: auto;
	margin: 0 auto;
}

#ttl-play {
	width: 290px;
	height: 50px;
	margin: 50px auto 10px;
}

#ttl-play img {
	width: 100%;
}


#play {
	width: 970px;
	height: auto;
	margin: 100px auto 20px;
	overflow: hidden;
}

.play-mainbox {
	width: 970px;
	height: 130px;
	margin: 20px auto;
	overflow: hidden;
}

.play-boxl {
	width: 485px;
	height: 130px;
	float: left;
}

.play-boxr {
	width: 470px;
	height: 130px;
	float: right;
}

.play-imgbox {
	width: 170px;
	height: 130px;
	float: left;
}
.play-boxl img {
	width: 100%;
	height: auto;
}

.play-boxr img {
	width: 100%;
}

.play-txtbox {
	width: 250px;
	padding-top: 20px;
	float: left;
}

#activity {
	width: 970px;
	height: auto;
	margin: 80px auto 20px;
	overflow: hidden;
}

#activity {
	width: 100%;
	height: auto;
	margin: 0 auto;
/*	overflow: hidden;*/
}

#activity .read_activity_sp {
		display: none;
	}

#ttl-activity {
	width: 290px;
	height: 50px;
	margin: 80px auto 10px;
}

#ttl-activity img {
	width: 100%;
}


#activity-box {
	width: 970px;
	height: auto;
	margin: 80px 0	0;
}

.play-mainbox2 {
	width: 970px;
	height: 160px;
	margin: 30px auto;
	overflow: hidden;
}

.mainbox2-boxl {
	width: 485px;
	height: 160px;
	float: left;
}

.mainbox2-boxr {
	width: 450px;
	height: 160px;
	float: right;
}

.mainbox2-imgbox {
	width: 160px;
	height: 160px;
	margin-right: 20px;
	float: left;
}
.mainbox2-boxl img {
	width: 100%;
}

.mainbox2-boxr img {
	width: 100%;
}


.mainbox2-txtbox {
	width: 260px;
	float: left;
}

#tourism {
	width: 970px;
	height: auto;
	margin: 80px auto 20px;
	overflow: hidden;
}

#ttl-tourism {
	width: 290px;
	height: 50px;
	margin: 80px auto 10px;
}

#ttl-tourism img {
	width: 100%;
}

#tourism-box {
	width: 970px;
	height: auto;
	margin: 80px 0	0;
}

#gourmet {
	width: 970px;
	height: auto;
	margin: 80px auto 20px;
	overflow: hidden;
}

#ttl-gourmet {
	width: 290px;
	height: 50px;
	margin: 80px auto 10px;
}

#ttl-gourmet img {
	width: 100%;

}

#gourmet-box {
	width: 970px;
	height: auto;
	margin: 50px 0	0;
}

.ttl-food {
	width: 290px;
	height: 50px;
	overflow: hidden;
	margin: 20px 0 10px;
	padding-top: 50px;
}

.ttl-food img {
	height: 100%;
}


#event {
	width: 970px;
	height: auto;
	margin: 80px auto 20px;
	overflow: hidden;
}

#ttl-event {
	width: 290px;
	height: 50px;
	margin: 80px auto 10px;
}

#ttl-event img {
	width: 100%;
}

#event-box {
	width: 970px;
	height: auto;
	margin: 80px 0	0;
}

.ttl-sub-event {
	width: 290px;
	height: 50px;
	overflow: hidden;
	margin: 50px 0 10px;
}

.ttl-sub-event img {
	height: 100%;
}



/* ウィンドウ幅がタブレット_の場合に適用するCSS */
@media screen and ( max-width:960px ) and ( min-width:485px )
{
		
#play-all {
	width: 90%;
/*	height: auto;
	margin: 0 auto;*/
}	
	
#play {
	width: 100%;
	height: auto;
	margin: 100px auto 20px;
	overflow: hidden;
	
}	
	
#read {
	display: block;
}	
	
.play-mainbox {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	height: auto;
	margin: 0px auto;
/*	overflow: hidden;*/
}

.play-boxl {
	width: 100%;
	max-width: 470px;
	height: auto;
	margin: 20px auto 0;
	float: none;
}

.play-boxr {
	width: 100%;
	max-width: 470px;
	height: auto;
	margin: 20px auto 0;
	float: none;
}
	
.play-imgbox {
	width: 30%;
	max-width: 100px;
	height: auto;
/*	padding-top: 20px;*/
/*	float: left;*/
}
	
.play-txtbox {
	width: 70%;
	padding-top: 0;
/*	float: left;*/
}	
	

#gourmet {
	width: 90%;
	height: auto;
/*	margin: 80px auto 20px;
	overflow: hidden;*/
}	
	
#event {
	width: 100%;
/*	height: auto;
	margin: 80px auto 20px;
	overflow: hidden;*/
}
	
.ttl-sub-event {
	padding-top: 0;
}	
	
#event-box {
	width: 100%;
/*	height: auto;
	margin: 50px 0	0;*/
}
	
.play-mainbox2 {
/*	display: flex;
	flex-wrap: wrap;*/
	width: 100%;
	height: auto;
	margin: 0 auto;
	line-height: 1.5em;
/*	overflow: hidden;*/
}

.large {
	line-height: 1.5em;
	}	
	
.mainbox2-boxl {
	width: 485px;
	height: 160px;
	margin: 30px auto 0;
	float: none;
}

.mainbox2-boxr {
	width: 485px;
	height: 160px;
	margin: 30px auto 0;
	float: none;
}	
	
.mainbox2-imgbox {
	width: 160px;
	height: 160px;
	margin-right: 20px;
	float: left;
}
	
.mainbox2-txtbox {
	width: 260px;
	float: left;
}
	
#activity {
	width: 90%;
	height: auto;
/*	margin: 80px auto 20px;
	overflow: hidden;*/
}	

.read_activity_sp {
		display: none;
	}	

#activity-box {
	width: 100%;
	height: auto;
/*	margin: 80px 0	0;*/
}
	
#tourism {
	width: 90%;
	height: auto;
/*	margin: 80px auto 20px;
	overflow: hidden;*/
}	
	
#tourism-box {
	width: 100%;
/*	height: auto;
	margin: 80px 0	0;*/
}		
	
	
	
}	

/* ---------play-tablet↑--------------------- */

/* 〜960px---------play-mobile--------------------- */
@media screen and ( max-width:484px ) 
{	
	
#play-all {
	width: 90%;
/*	height: auto;
	margin: 0 auto;*/
}

#play-all #read {
		display: block;
	text-align: left;
	}	
	
#play {
	width: 100%;
	height: auto;
	margin: 30px auto 0;
	overflow: hidden;
	
}	

#play-all #read {
	margin: 10px auto 0;
	}
	
	

	
.play-mainbox {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	height: auto;
	margin: 0px auto;
/*	overflow: hidden;*/
}

.play-boxl {
	width: 100%;
	max-width: 470px;
	height: auto;
	margin: 20px auto 0;
	float: none;
}

.play-boxr {
	width: 100%;
	max-width: 470px;
	height: auto;
	margin: 20px auto 0;
	float: none;
}
	
.play-imgbox {
	width: 30%;
	max-width: 100px;
	height: auto;
/*	padding-top: 20px;*/
/*	float: left;*/
}
	
.play-txtbox {
	width: 70%;
	padding-top: 0;
/*	float: left;*/
}	
	
/*#pley-box-gourmet {
		display: none;
	}	
	
#gourmet {
		display: none;
	}*/
	
#event {
	width: 100%;
	margin: 10px auto;
/*	height: auto;
	overflow: hidden;*/
}	
	
.ttl-sub-event {
/*	width: 290px;
	height: 60px;
	overflow: hidden;
	margin: 20px 0 10px;*/
	padding-top: 20px;
}		
	
#event-box {
	width: 100%;
	margin: 0 auto;
/*	height: auto;
	margin: 50px 0	0;*/
}
	
.play-mainbox2 {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	height: auto;
	margin: 0 auto;
	line-height: 1.5em;
/*	overflow: hidden;*/
}

.large {
	line-height: 1.5em;
	}	
	
.mainbox2-boxl {
	width: 100%;
	max-width: 450px;
	height: auto;
	margin: 30px 0 0;
	float: none;
}

.mainbox2-boxr {
	width: 100%;
	max-width: 450px;
	height: auto;
	margin: 30px 0 0;
	float: none;
}	
	
.mainbox2-imgbox {
	width: 100%;
	height: 160px;
/*	max-width: 170px;*/
	margin: 0 auto;
	float: none;
	overflow: hidden;
}
	
.mainbox2-imgbox img {
		margin-top: -15%;
	}
.mainbox2-txtbox {
	width: 100%;
	margin: 5px auto 0;
	float: none;
}	
	
	
#activity {
	width: 100%;
	height: auto;
	margin: 0 auto;
/*	overflow: hidden;*/
}

#activity .read {
	display: block;
	width: 100%;
	height: auto;
	text-align: left;
	}


#activity-box {
	width: 100%;
	height: auto;
	margin: 0 auto
}
	
#tourism {
	width: 100%;
	height: auto;
	margin: 20px auto;
/*	overflow: hidden;*/
}	
	
#tourism-box {
	width: 100%;
/*	height: auto;*/
	margin: 0 auto;
}
	
#gourmet {
	width: 100%;
	height: auto;
	margin: 20px auto;
/*	overflow: hidden;*/
}	
	
#gourmet-box {
	width: 100%;
/*	height: auto;*/
	margin: 0 auto;
}
	
#event .large {
		text-align: center;
	}
	
#activity .large {
	text-align: center;
	line-height: 1.8em;
	}
	
#tourism .large {
	text-align: center;
	line-height: 1.8em;
	}		

}	
/* ---------play-mobile↑--------------------- */


/*-----------------↑playページ↑-----------------*/

/*-----------------↓遊ぶ 各プランページ↓-----------------*/


.breadcrumb {
  padding:0;
  margin:50px 0;
}

.breadcrumb li{
  display:inline;/*横に並ぶように*/
  list-style: none;
}

.breadcrumb li:after{/* >を表示*/
  content: '>';
  padding: 0 3px;
  color: #666666;
}

.breadcrumb li:last-child:after{
  content: '';
}

.breadcrumb li a {
    text-decoration: none;
    color: #666666;/*色*/
}

.breadcrumb li a:hover {
    text-decoration: underline;
}

#play-under {
	width: 970px;
	height: auto;
	margin: 50px auto;
}

.ttl-playsub {
	width: 290px;
	height: 50px;
	overflow: hidden;
	margin: 20px 0 10px;
	padding-top: 20px;
}

.ttl-playsub img {
	height: 100%;
}

.playsub-box {
	width: 970px;
	height: auto;
	margin: 100px auto;
	overflow: hidden;
}

.imagebox {
	width: 240px;
	height: 240px;
	margin-top: 10px;
	float: left;
	padding-right: 3px;
}

.imagebox img {
	width: 100%;
}





/*-----------------↓reservationページ↓-----------------*/
#reservation {
	width: 970px;
	height: auto;
	margin: 0 auto 30px;
}


#ttl-reserv {
	width: 290px;
	height: 50px;
	margin: 50px auto 20px;
}

#ttl-reserv img {
	width: 100%;
}

#reserve-calender {
	width: 970px;
	height: auto;
	margin: 0 auto 20px;
}

#calender {
	width: 800px;
	margin: 30px 0;
}

.ttl-method {
	width: 290px;
	height: 50px;
	overflow: hidden;
	margin: 20px 0 10px;
	padding-top: 80px;
}

.ttl-method img {
	width: 100%;
}

#reserve-internet {
	width: 970px;
	height: auto;
	margin: 0 auto 20px;
}

#reserve-tel {
	width: 970px;
	height: auto;
	margin: 0 auto 20px;
}

#reserve-tel .ttl-method {
	width: 290px;
	height: auto;
}


.coment {
	display: block;
	text-align: center;
	margin: 50px auto 0;
}

/* 〜960px---------reservation-mobile↓-------*/
@media screen and (max-width:969px) { 

#reservation {
	width: 90%;
/*	height: auto;*/
	margin: 0 auto;
}

.ttl-method {
	padding-top: 30px;
}	
	
#reserve-calender {
	width: 100%;
	overflow: hidden;
/*	height: auto;
	margin: 0 auto 20px;*/
}	
	
#calender iframe {
	width: 90vw;
}
	
#reserve-internet {
	width: 100%;
/*	height: auto;
	margin: 0 auto 20px;*/
}

#reserve-tel {
		width: 100%;
	}	
	
#reserve-tel .ttl-method {
	width: 100%;
	max-width: 290px;
	height: auto;
}
	
#reserve-tel .ttl-method img {
		width: 100%;
	}	
	
#reservation #read {
		display: block;
		text-align: left;
	} 
	
.coment p {
	display: block;
	width: 100%;
	margin: 0 auto;
	text-align: left;
}
	
#reservation .center {
	text-align: center;
}	
	
	
}

/* 〜960px---------reservation-mobile↑-------*/

/*-----------------↑reservationページ↑-----------------*/


/*-----------------↓formページ↓-----------------*/
#form {
	width: 90%;
	max-width: 650px;
	height: auto;
	margin: 20px auto;
}

#form-box1 {
	width: 100%;
	max-width: 650px;
	margin: 10px auto;
}

#form-coment {
	max-width: 650px;
	height: 50px;
	margin: 10px auto 20px;
}

#form-coment .center {
	text-align: center;
}

/* 〜960px---------form-mobile↓-------*/
@media screen and (max-width:490px) { 
#form-coment .center {
	text-align: left;
	line-height: 1.5em;
}
}

/*-----------------↑formページ↑-----------------*/


/*-----------------↓ privacy policyージ↓-----------------*/

#privacypolicy {
	width: 970px;
	height: auto;
	margin: 60px auto 30px;
}

.ttl-j {
	font-size: 18px;
	text-align: center;
	
}


#privacy-box {
	width: 970px;
	height: auto;
	margin: 50px auto;
}

/* 〜960px---------privacy policy-mobile-↓-------------------- */
@media screen and (max-width:960px) { 

#privacypolicy {
	width: 90%;
/*	height: auto;
	margin: 100px auto 30px;*/
}

#privacy-box {
	width: 100%;
/*	height: auto;
	margin: 50px auto;*/
}
	
#privacypolicy .coment p.center {
		text-align: center;
	}	
	
}


/*-----------------↑ privacy policyページ↑-----------------*/


/*-----------------↓ キャンセル規定ぺージ↓-----------------*/
#cansel {
	width: 970px;
	height: auto;
	margin: 60px auto;
}


table {
	margin: 50px 0;
	text-align: center;
	border: solid 1px #666666;
	border-collapse: collapse;
}

caption {
	text-align: left;
	font-size: 15px;
/*	font-weight: bold;*/
	padding-bottom: 5px;
}

table th {
	width: 220px;
	height: 30px;
	padding: 5px;
	text-align: center;
	border: solid 1px #666666;
	font-weight: normal;
	background-color: rgba(238,248,254,1.00);
}

table td {
	width: 120px;
	height: 30px;
	padding: 5px;
	text-align: center;
	border: solid 1px #666666;
	font-weight: normal;
}


tr.red {
	color: red;
}

.tr-title {
	background-color: rgba(238,248,254,1.00);
}

/* 〜960px---------cansel-mobile--------------------- */
@media screen and (max-width:960px) {
#cansel {
	width: 90%;
/*	margin: 100px auto;*/
}
	
#cansel .read {
			text-align: center;
	}

#privacypolicy {
	width: 90%;
/*	height: auto;
	margin: 100px auto 30px;*/
}
	

#privacy-box {
	width: 100%;
/*	height: auto;
	margin: 50px auto;*/
}

.coment {
/*	display: block;*/
	margin: 20px 0;
/*	text-align: center;*/
}	

#cansel .coment .center {
		text-align: center;
	}	

}


/*-----------------↑キャンセル規定ページ↑-----------------*/


#feed {
	width: 800px;
	margin: 0 auto;
}