
/* 共通CSS */
/*--------------*/
.z_index40{
	z-index: 40;
}


/* テーブル設定 */
table, td, th{
    border: 1px solid black;
	text-align: center;
}
/*--------------*/

/*背景*/
.bgc{
	background-color: rgba(126,126,126,0.50)
}

.bgc2{
	background-color: rgba(126,126,136,0.60)
}

.bgc3{
	background-color: rgba(0,0,0,0.40);
	margin-bottom:100px;
}

.bgcfff{
	background-color: rgba(255,255,255,1.00);
}
.bdf{
	-webkit-backdrop-filter: blur(5px);
}

.bgc_green{
	background-color: rgba(39,114,33,0.50);
}

.bgc_green2{
	background-color: rgba(59,214,53,0.50);
}

/*--------------*/


/* レスポンシブ用 */
.switch_off{
	display: none;
}
/*--------------*/

/* width */
/*--------------*/

/*アブソリュート上下左右中央寄せ用*/
.relative{
	position: relative;
}

.absolute{
	position: absolute;
   top: 50%;
   left: 30%;
   transform: translate(-50%, -50%);
}

/*--------------*/


/*フォント*/
.font_menu{
	font-family: "Hiragino Sans", "Times New Roman", Georgia, "serif"
}

.font_white{
	color: #fff;
}

.font_black{
	color: #000;
}

.font_red{
	color: #FF6666;
}


.font_size{
	font-size: 22px;
}

.font_size35{
	font-size: 35px;
}

.font_size50{
	font-size: 50px;
}

.font_weight{
	font-weight: bold;
}

.line-height{
	line-height: 30px;
}

.under_line{
	text-decoration: underline;
}

/*--------------*/




/*センター寄せ*/
		.text_align_center1{
		text-align: center;
	}

		.text_align_left{
			text-align: left;
		}
/*--------------*/


/*padding*/
.padding_top15{
	padding-top:15px;
}

.padding_bottom30{
	padding-bottom: 30px;
}

/*--------------*/
	/*margin*/
.margin_0{
	margin: 0 auto;
}

	.margin_right200{
		margin-right: 200px;
	}
	.margin_right30{
		margin-right: 30px;
	}
.margin_right10{
	margin-right: 10px;
}

.margin_bottom20{
	margin-bottom: 20px;
}

.margin_bottom50{
	margin-bottom: 50px;
}

.margin_bottom100{
	margin-bottom: 100px;
}

.margin_top{
	margin-top: 100px;
}

.margin_top50pximp{
	margin-top: 50px!important;
}

.margin_left20{
	margin-left: 20px;
}

.margin_left50{
	margin-left: 50px;
}
/*--------------*/
	
	/*ディスプレイ*/
	.display_flex{
		display: flex;
	}

		.display_flex2{
		display: flex;
	}

	.display_block{
		display: block;
	}
.display_inline_block{
	display: inline-block;
}

.res_switch_off_yuruyaka{
	display: none;
}

	.jutfy{
	justify-content: space-around;
}

.justfy_center{
	justify-content: center;
}
/*--------------*/
	
.border1{
	border-top: solid #ccc 2px;
	border-right: solid #ccc 2px;
	border-bottom: solid #ccc 2px;
}

.border_left{
	border-left: solid #ccc 1px;
}

.border_left2{
	border-left: solid #ccc 2px;
}


.border_right{
	border-right: solid #ccc 1px;
}
.border_top{
	border-top: solid #ccc 2px;
}
.border_bottom{
	border-bottom: solid #ccc 2px;
}


/*--------------*/
	/*float*/
	.float_left{
		float: left;
	}
	.float_right{
		float: right;
	}
	
	/*float解除*/
	.overflow{
		overflow: hidden;
	}
/*--------------*/
	
.position_fixed{
	position: fixed;
}
.width100{
	width: 100%;
}
.width100 dt{
	margin-right: 40px;
}

.width100px{
	width: 100px;
}

.width768{
	width: 768px;
}
.width375{
	width: 375px;
}

.width960{
	width: 960px;
}

.width800{
	width:800px; 
}

.maxwidth{
	max-width: 960px;
}

.width375imp{
	width:375px!important;
}


.z-index{
	z-index: 999;
}
/*---------------ここまで共通--------------------*/

/*個別設定*/

h1{letter-spacing: 0.7rem;
	font-size: 3rem;
	color: #fff;
}


/*--------------*/
/*body設定*/
.wrap{
	width: 100%;
	font-family: 'Shippori Mincho B1', serif;
background-image:url("../img/water-1460407_1280.jpg");
background-color:rgba(255,255,255,0.3);
background-blend-mode:lighten;
background-size: cover;	
background-attachment: fixed;
	overflow: hidden;
}

/*--------------*/
/*ヒーローイメージ/施設案内図*/
.full {
   width: 100vw;
  height: 650px ;
object-fit: cover;
}

.full2 {
  width: 100%;
  min-height: 100vh;
	background-size: cover;

}


.res_switch_on2{
		display: inline;
	}

.res_switch_off2{
		display: none;
	}


/*--------------*/
/*navigation*/
.g_navi{
	width:100%;
}

.g_navi ul{
	display: flex;

	padding: 1%;
	width: 100%;
	max-width: 100%;
}

li.btn01 a{
  color:#fff;
  transition:0.6s;
}

li.btn01 a:hover{
  background-color:rgba(226,226,226,0.50);
  color:#000;
 border-radius: 20px;
}


	.g_navi ul li {
		flex: 1 0 auto;
		
	}
		.g_navi ul li a {
			display: block;
	 		padding: 17px 10px;
			color: #fff;
			text-align: center;
			text-decoration: none;
		}
/*--------------*/
/*navigationボーダー設定*/
.navigation_border{
	border-right: solid #ccc 1px;
}
/*--------------*/
/*navigation_パディング設定*/
.navigation_padding{
	padding: 25px 30px;
}

/*--------------*/
/*春のお得なイベント用*/
.event_info{
	display: flex;
}
/*--------------*/

/*wtatsnews*/
.whats_news{
	padding-left: 18px;
	width:170px;
	padding-top:83px;
	height: 102px;
	border-right:2px solid #ccc;
	background-color: rgba(39,114,33,0.50);
	font-weight: bold;
	text-decoration: underline;

}



dl dt{
		padding:6px;
}

dl  dd{
	border-bottom: dotted 1px #ccc;
	padding:6px;
	background-color: #fff;
}
dl dd:last-child{
	border: none;
}

 dd a:hover{
	color: rgba(0,0,0,0.50)
}
/*--------------*/
/*ゆるやかに流れる時間背景*/
.bgi1{
	background-image: url("../img/img2.png") ;
	width:100%;
	max-width: 100%;
	color: #fff;
	text-align: center;
	padding:100px 0; 
	background-blend-mode:lighten;
	background-size: auto;
	background-repeat: no-repeat;
}

/*--------------*/
/*料金表用*/
.price{
	width: 700px;
	margin: 0 auto;
	text-align: center;
}

.kihon_ryoukin{
	width: 700px;
	margin: 0 auto;
	margin-bottom: 50px;
}

.shisetu{
	width: 700px;
	margin: 0 auto;
	text-align: center;

}

.shisetu2{
	width: 640px;
	margin: 0 auto;
	text-align: center;
}

.kihon_ryoukin th{
	padding: 10px;
	background-color: rgba(39,114,33,0.50);
} 

.kihon_ryoukin td{
	padding: 6px;
	background: rgba(255,255,255,1.00);
}

.shisetu th{
	padding: 10px;
	background-color: rgba(39,114,33,0.50);
} 

.shisetu td{
	padding: 6px;
	background: rgba(255,255,255,1.00);
}



/*--------------*/
/*施設案内スライダー用*/
.bx-pager a img {  
opacity: 0.5;  
filter: alpha(opacity=50);  
}  
.bx-pager a.active img {  
opacity: 1;  
filter: alpha(opacity=100);  
}  

/*--------------*/
/*施設案内図用*/
.annaizu{
	width: 800px;
	margin: 0 auto;
	text-align: center;
	margin-bottom: 100px;
}



/*--------------*/
/*コンタクトページ用*/

 .Form {
  margin-left: auto;
  margin-right: auto;
  max-width: 720px;
	 background: rgba(132,132,132,0.50);
	 border-radius: 10px;
}
.Form-Item {
  border-top: 1px solid #ddd;
  padding-top: 24px;
  padding-bottom: 24px;
  width: 100%;
  display: flex;
  align-items: center;
	color: #fff;
}
.Form-Item:nth-child(5) {
  border-bottom: 1px solid #ddd;
}
.Form-Item-Label {
  width: 100%;
  max-width: 248px;
  letter-spacing: 0.05em;
  font-weight: bold;
  font-size: 18px;
}

.Form-Item-Label.isMsg {
  margin-top: 8px;
  margin-bottom: auto;
}

.Form-Item-Label-Required {
  border-radius: 6px;
  margin-right: 8px;
  padding-top: 8px;
  padding-bottom: 8px;
  width: 48px;
  display: inline-block;
  text-align: center;
  background: #F7B0B0;
  color: #fff;
  font-size: 14px;
}

.Form-Item-Input {
  border: 1px solid #ddd;
  border-radius: 6px;
  margin-left: 40px;
  padding-left: 1em;
  padding-right: 1em;
  height: 48px;
  flex: 1;
  width: 100%;
  max-width: 350px;
  background: #eaedf2;
  font-size: 18px;
	color: #000;
}
.Form-Item-Textarea {
	color: #000;
  border: 1px solid #ddd;
  border-radius: 6px;
  margin-left: 40px;
	margin-right: 15px;
  padding-left: 1em;
  padding-right: 4em;
  height: 216px;
  flex: 1;
  width: 100%;
  max-width: 400px;
  background: #eaedf2;
  font-size: 18px;
}

.Form-Btn {
  border-radius: 6px;
  margin-top: 32px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 20px;
  padding-bottom: 20px;
  width: 280px;
  display: block;
  letter-spacing: 0.05em;
  background: #5bc8ac;
  color: #fff;
  font-weight: bold;
  font-size: 20px;
	text-align: center;
}
/*--------------*/



/*フッター*/
footer{
	padding:30px;
	color: #fff;
	background-image: url("../img/top_img2.jpg");
}
/*ACCESS*/
#acsess{
	background-color: rgba(0,0,0,0.40);
	width: 900px;
	margin: 0 auto;
	margin-bottom: 100px;
}
/*Top_コンタクト用*/
.contact{
	width: 600px;
	margin: 0 auto;
	text-align: center;
	font-size: 80px;
	margin-bottom: 100px;
	background-image: url("../img/cottage1.jpg");
	color:#353535;
}


.btn-three {
  transition: all 0.5s;
  position: relative;
}
.btn-three::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
z-index: 1;
  transition: all 0.6s;
}
.btn-three:hover::before {
  opacity: 0 ;
  transform: scale(0.5,0.5);

}
.btn-three::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 0;
  transition: all 0.3s;
  border: 1px solid rgba(255,255,255,0.5);
  transform: scale(1.2,1.2);
  background-color: rgba(200,200,200,0.5);
	
}
.btn-three:hover::after {
  opacity: 1;
  transform: scale(1,1);

}
/*--------------*/

/*よくある質問用*/
.shitumon{
	margin: 0 auto;
	width: 900px;
	margin-bottom: 100px;
}

.sakana{
	width:900px;
	margin: 0 auto;
	text-align: center;
	margin-bottom: 100px;
	display: block;
}

.sakana_setumei{
	display: inline-block;
	text-align: left;
	color:#fff;
	font-size:18px;
	padding-top: 20px;
}





/*--------------*/
/*---------------ここまで個別--------------------*/


/*animation*/
/*下からフェードイン*/
.fade-in-bottom {
   opacity: 0;
   animation-name: fadein-bottom;
   animation-duration: 1.5s;
   animation-timing-function: ease-out;
   animation-fill-mode: forwards;
}
@keyframes fadein-bottom {
   0% {
      opacity: 0;
      transform: translateY(40px);
   }
   100% {
      opacity: 1;
      transform: translateY(0);
   }
}

.fade-in-bottom2 {
   opacity: 0;
   animation-name: fadein-bottom;
   animation-duration: 0.6s;
   animation-timing-function: ease-out;
   animation-fill-mode: forwards;
}
@keyframes fadein-bottom2 {
   0% {
      opacity: 0;
      transform: translateY(-40px);
   }
   100% {
      opacity: 1;
      transform: translateY(0);
   }
}

.fade-in-bottom3 {
   opacity: 0;
   animation-name: fadein-bottom;
   animation-duration: 1.0s;
   animation-timing-function: ease-out;
   animation-fill-mode: forwards;
}
@keyframes fadein-bottom3 {
   0% {
      opacity: 0;
      transform: translateY(-40px);
   }
   100% {
      opacity: 1;
      transform: translateY(0);
   }
}

.fade-in-bottom4 {
   opacity: 0;
   animation-name: fadein-bottom;
   animation-duration: 1.4s;
   animation-timing-function: ease-out;
   animation-fill-mode: forwards;
}
@keyframes fadein-bottom4 {
   0% {
      opacity: 0;
      transform: translateX(40px);
   }
   100% {
      opacity: 1;
      transform: translateY(0);
   }
}

.fade-in-bottom5 {
   opacity: 0;
   animation-name: fadein-bottom;
   animation-duration: 1.6s;
   animation-timing-function: ease-out;
   animation-fill-mode: forwards;
}
@keyframes fadein-bottom5 {
   0% {
      opacity: 0;
      transform: translateY(-40px);
   }
   100% {
      opacity: 1;
      transform: translateY(0);
   }
}


.fade-in-bottom6 {
   opacity: 0;
   animation-name: fadein-bottom;
   animation-duration: 1.8s;
   animation-timing-function: ease-out;
   animation-fill-mode: forwards;
}
@keyframes fadein-bottom6 {
   0% {
      opacity: 0;
      transform: translateY(-40px);
   }
   100% {
      opacity: 1;
      transform: translateY(0);
   }
}





@keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}
.fadeIn01 { animation: fadeIn 2s; }

/*--------------*/


/*アニメーション要素のスタイル*/
.animation{
	opacity : 0;
	visibility: hidden;
	transition: 1s;
	transform: translateY(30px);
}

.animation2{
	opacity : 0;
	visibility: hidden;
	transition: 1s;
	transform: translateX(30px);
}



/*アニメーション要素までスクロールした時のスタイル*/
.active{
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}




/*--------------*/
@media (max-width: 600px){
/*ヒーローイメージ*/
	.full{
		height: 100vh;
		background-size: cover;
			
	}
	
	.full2 {
	min-height: inherit;
}
	
	
	.res_switch_on2{
		display: none;
	}
		.res_switch_off2{
		display: inline;
	}
	
	
	
	/*--------------*/
	
	/*ACCESS*/
	#access{
		text-align: center;
		width: 100%;
	}
	
	
	/*レスポンシブスイッチ*/
	.res_switch_off{
		display: none;
	}
	.res_switch_on{
		display:inline;
	}
	
	.res_switch_on{
		display: inline;
	}
	
	.res_switch_on_yuruyaka{
	display: block;
}
	
	.res_switch_off_yuruyaka2{
		display: none;
	}
	
	/*--------------*/
	
	/*レスポンシブmap用*/
.res_map {
height: 0;
overflow: hidden;
padding-bottom: 56.25%;
position: relative;
}
.res_map iframe {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
}
/*--------------*/
	
	.font_size{
		font-size: 1.1rem;
	}
	
	.font_size35{
	font-size: 1.5rem;
}
	
	
	
	
	.font_size50{
		font-size: 1.8rem;
	}
	h1{
		font-size: 5.5vw;
	}
	
	.margin_bottom50{
		margin-bottom: 40px;
	}

	.bgi1{
		padding:20px 0;
	}
	
	
/*イベントレスポンシブ用*/
.event_info{
	display:block;
	margin: 0 auto;
	text-align: center;
}	
	/*--------------*/
/*whats_news用*/

.whats_news2{
	padding: 10px 0;
	text-decoration: underline;
}
	.whats_news3{
		background-color: #fff;
	}
	.whats_news4 li{
		border-bottom: 1px dotted;
		margin-left:30px;
	}
section li{
	margin-bottom: 10px;
}	
	/*--------------*/
	
	.res_moji_left{
	width:300px;
	text-align: left;
}

		/*price用レスポンシブ*/
	.price{
		width: 100%;
	}
	.kihon_ryoukin{
		width: 100%;
	}

	.shisetu_price{
		text-align: center;
	}
	
	/*--------------*/
	
	/*Top_コンタクト用*/
	.contact{
		width: 100%;
	}
		/*施設のご案内*/
	.margin_left20{
		margin-left: 0;
	}
	/*--------------*/
		.shisetu{
		width: 100%;	
				margin: 0 auto;
	text-align: center;
	}
	
		/*施設案内図用*/
.shisetu2{
	width: 100%;
	
}
	
	.annaizu{

			  width: 100%;
	}
	
	
	.annaizu2{
	width: 700px;
min-height: inherit;
  min-height: 100vh;
  background:center;
	background-size: cover;
}
	
	/*コンタクトページ用*/
		.Form {
    margin-top: 40px;
  }
	.Form-Item {
    padding-left: 14px;
    padding-right: 14px;
    padding-top: 16px;
    padding-bottom: 16px;
    flex-wrap: wrap;
  }
	.Form-Item-Label {
    max-width: inherit;
    display: flex;
    align-items: center;
    font-size: 15px;
  }
	 .Form-Item-Label.isMsg {
    margin-top: 0;
  }
	  .Form-Item-Label-Required {
    border-radius: 4px;
    padding-top: 4px;
    padding-bottom: 4px;
    width: 32px;
    font-size: 10px;
  }
	
	 .Form-Item-Input {
    margin-left: 0;
    margin-top: 18px;
    height: 40px;
    flex: inherit;
    font-size: 15px;
	width:100%;
	max-width: 85%;
  }
	  .Form-Item-Textarea {
    margin-top: 18px;
    margin-left: 0;
    height: 200px;
    flex: inherit;
    font-size: 15px;
	width:100%;
	max-width:85%;
  }
	.Form-Btn {
    margin-top: 24px;
    padding-top: 8px;
    padding-bottom: 8px;
    width: 160px;
    font-size: 16px;
  }

	
	.shitumon{
		width: 100%;
	}
		/*--------------*/
	
	/*魚スマホ用*/
	.sakana{
	width:100%;
	margin: 0 auto;
	text-align: center;
	margin-bottom: 100px;
	display: block;
}	
	
	
		.width375{
		width:100%;
	}
	
	
	.display_flex2{
		display: block;
	}
}



@media (min-width: 601px) and (max-width: 1024px){
	/*ヒーローイメージ*/
	.full{
		min-height: inherit;
		
	}
	
		.full2 {
	min-height: inherit;
}
	
	
	
	/*--------------*/
	/*ACCESS*/
	#access{
		text-align: center;
		width: 100%;
	}
	
	
	/*レスポンシブスイッチ*/
	.res_switch_off{
		display: none;
	}
	.res_switch_on{
		display:inline;
	}
	/*--------------*/
	
	/*レスポンシブmap用*/
.res_map {
height: 0;
overflow: hidden;
padding-bottom: 56.25%;
position: relative;
}
.res_map iframe {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
}
/*--------------*/
	
	.font_size{
		font-size: 2.8vw;
	}
	
	.font_size35{
	font-size: 2.0rem;
    }
	
	.font_size50{
		font-size: 5.0vw;
	}
	h1{
		font-size: 5.5vw;
	}
	
	.margin_bottom50{
		margin-bottom: 20px;
	}
	

	.bgi1{
		padding:20px 0;
	}
	
	
/*イベントレスポンシブ用*/
.event_info{
	display:block;
	margin: 0 auto;
	text-align: center;
}	
	/*--------------*/
/*whats_news用*/

.whats_news2{
	padding: 10px 0;
	text-decoration: underline;
}
	.whats_news3{
		background-color: #fff;
	}
	.whats_news4 li{
		border-bottom: 1px dotted;
		margin-left: 30px;
	}
section li{
	margin-bottom: 10px;
}	
	/*--------------*/
	/*price用レスポンシブ*/
	.price{
		width: 100%;
	}
	.kihon_ryoukin{
		width: 100%;
	}
	.shisetu{
		width: 100%;	
	}
	.shisetu2{
	width: 100%;
	
}
	
	/*--------------*/
		/*Top_コンタクト用*/
	.contact{
		width: 100%;
	}
		/*--------------*/
	/*施設のご案内*/
	.margin_left20{
		margin-left: 0;
	}
	/*--------------*/
	
			/*施設案内図用*/
	.annaizu{

			  width: 100%;
	}
	
	
	.annaizu2{
	width: 700px;
min-height: inherit;
  min-height: 100vh;
  background:center;
	background-size: cover;
}
	
	
		/*--------------*/

	/*コンタクトページ用*/
	 .Form {
  margin-top: 80px;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}
	
	.shitumon{
		width: 100%;
	}
	
	
/*--------------*/
	/*魚説明用*/
.sakana{
	width:100%;
	margin: 0 auto;
	text-align: center;
	margin-bottom: 100px;
	display: block;
}	
	
	.width375{
		width:100%;
	}
/*--------------*/
	
}

/*@media (min-width: 376px) and (max-width: 600px){
	.shitumon p{
		font-size: 1.1rem;
	}
	
	
	
		.Form {
    margin-top: 40px;
  }
	.Form-Item {
    padding-left: 14px;
    padding-right: 14px;
    padding-top: 16px;
    padding-bottom: 16px;
    flex-wrap: wrap;
  }
	.Form-Item-Label {
    max-width: inherit;
    display: flex;
    align-items: center;
    font-size: 15px;
  }
	 .Form-Item-Label.isMsg {
    margin-top: 0;
  }
	  .Form-Item-Label-Required {
    border-radius: 4px;
    padding-top: 4px;
    padding-bottom: 4px;
    width: 32px;
    font-size: 10px;
  }
	
	 .Form-Item-Input {
    margin-left: 0;
    margin-top: 18px;
    height: 40px;
    flex: inherit;
    font-size: 15px;
  }
	  .Form-Item-Textarea {
    margin-top: 18px;
    margin-left: 0;
    height: 200px;
    flex: inherit;
    font-size: 15px;
		  width:100%;
	max-width:88%;
		  
  }
	.Form-Btn {
    margin-top: 24px;
    padding-top: 8px;
    padding-bottom: 8px;
    width: 160px;
    font-size: 16px;
  }

	
}
*/














