@charset "UTF-8";

/*ヘッダーフッター*/
/*共通部品*/


/*================================================
 *  ヘッダー
 ================================================*/
 
 

header {
	position:fixed;
	width:100%;
	height:auto;
	/*background-color:rgba(0,0,0,0.5);*/
	z-index:990;
}



@media screen and (max-width:959px) {
}


/*================================================
 *  映像トップビジュアル
 ================================================*/


.video-container {
  height: 100vh;
  position: relative;
  overflow: hidden;
  z-index: -1;
}
@media (max-width: 959px) {
  .video-container {
    height: 100vh;
  }
}
 
.video-container video {
  -o-object-fit: cover;
     object-fit: cover;
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}



/*================================================
 *  メインコンテンツ枠
 ================================================*/
 
#contents{
	
	}
	

/*================================================
 *  フッター
 ================================================*/
footer {
	background-color: #f2f5f7;
	/*margin-top: 100px;*/
	padding:80px 0 20px;
	overflow:hidden;
	text-align:center;
}


footer h5{
	font-weight:bold;
	font-weight:700;
	text-align:center;
	font-size:16px;
	letter-spacing:0.05em;
	margin:0 auto 3px;
	}
footer h5 img{
	width:50%;
	max-width:240px;
	display:block;
	margin:0 auto 15px;
	
	}
footer p{
	display:inline-block;
	font-size:15px;
	line-height:180%;
	margin-bottom:30px;
	}

footer .btn_contact  {
	margin-bottom:50px;

}


footer .map_wrap{
	width:90%;
	max-width:800px;
	margin:0 auto;
	z-index:1;
	overflow:hidden;
	height:auto;
	
	}

footer .snslink{
	padding-top:50px;
	}

footer .snslink a{
	font-size:37px;
	margin:0 20px;
	color:#000;
	}



.copyright {
	padding: 40px 0;
	font-size: 13px;
	text-align: center;
	color: #000;
}

@media screen and (max-width:959px) {

		  
}






	
	
	
/**********スクロールダウンボタン***********/

#scrolldown {
  position:absolute;
  bottom:0;
  width:100%;
  height:auto;
}
#scrolldown a {
  padding-top: 70px;
  position: absolute;
  bottom: 5px;
  left: 50%;
  transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
  z-index: 2;
  display: inline-block;
  color:#fff;
  font-size:15px;
  text-shadow:3px 3px 3px rgba(0,0,0,0.1);
}
#scrolldown a span {
  position: absolute;
  top: 0;
  left: 50%;
  width: 24px;
  height: 24px;
  margin-left: -12px;
  border-left: 1px solid #fff;
  border-bottom: 1px solid #fff;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-animation: sdb 1.5s infinite;
  animation: sdb 1.5s infinite;
  box-sizing: border-box;
}
	@-webkit-keyframes sdb {
	  0% {
		-webkit-transform: rotate(-45deg) translate(0, 0);
		opacity: 0;
	  }
	  50% {
		opacity: 1;
	  }
	  100% {
		-webkit-transform: rotate(-45deg) translate(-20px, 20px);
		opacity: 0;
	  }
	}
	@keyframes sdb {
	  0% {
		transform: rotate(-45deg) translate(0, 0);
		opacity: 0;
	  }
	  50% {
		opacity: 1;
	  }
	  100% {
		transform: rotate(-45deg) translate(-20px, 20px);
		opacity: 0;
	  }
	}
	@media screen and (max-width:959px) {
		#scrolldown a{z-index: 2;}
	}

.after{
  display:none !important;
}

/*********************/



/*================================================
 *  共通パーツ
 ================================================*/
 





/*================================================
 *  ボタン
 ================================================*/


.btn_contact a {
	display:inline-block;
	width:66%;
	max-width:200px;
	box-sizing:border-box;
	padding:2px 10px 2px;
	color:#fff;
	font-size:17px;
	font-weight:500;
	text-decoration:none;
	border:2px solid #000;
	border-radius:2px;
	background:#000;
	transition:all 0.2s ease 0s;
}
.btn_contact a:hover {
	color:#000;
	background:#fff;
	border:2px solid #000;
	border-radius:2px;
	transition:all 0.2s ease 0s;
}






.btn_more a {
	display:inline-block;
	width:66%;
	max-width:200px;
		box-sizing:border-box;
	padding:2px 10px 2px;
	text-align:center;
	color:#fff;
	font-size:17px;
	font-weight:400;
	text-decoration:none;
	border:2px solid #5c7b98;
	border-radius:2px;
	background:#5c7b98;
	transition:all 0.2s ease 0s;
}
.btn_more a:hover {
	color:#5c7b98;
	background:#fff;
	border:2px solid #5c7b98;
	border-radius:2px;
	transition:all 0.2s ease 0s;
}





	
/*================================================
 *  ■ 埋め込み用
 ================================================*/



/*************　googlemap可変　*************/

.gmap {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
	z-index:1;
	border:1px solid #aaa;
}
.gmap iframe,
.gmap object,
.gmap embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index:1;
}


/*************　YOUTUBE可変　*************/

.youtube_wrap{
	margin:40px auto 60px;
	width:90%;
	max-width:800px;
	}
.youtube{
position: relative;
padding-bottom: 56.25%;
}
.youtube iframe{
width: 100%;
height:100%;
position: absolute;
left: 0;
top: 0;	
}










/*================================================
 *  ■ 並べリストレイアウト
 ================================================*/
 
/*************　バナーリスト（inline-block）　*************/


ul.img_rep{
	width:100%;
	max-width:1200px;
	margin:0 auto;
	text-align:center;
	}
ul.img_rep li{
	display:inline-block;
	margin:20px;
	}
ul.img_rep li img{
	width:150px;
	height:auto;
	}
ul.img_rep li.rep_empty{/*余りバナー位置調整*/
	width:150px;
	height:3px;
	margin-top:0;
	margin-bottom:0;
	background:#f00;
	}
	
@media screen and (max-width:959px) {
	  ul.img_rep li{
		  width:40%;
		  max-width:150px;
		  display:inline-block;
		  margin:2%;
		  }
	  ul.img_rep li img{
		  width:100%;
		  height:auto;
		  }
	  ul.img_rep li.rep_empty{
		  width:40%;
		  max-width:150px;
		  margin:0 2% 0;
		  }
	}	


/*************　flex dl 横並び見出し 囲み　*************/

dl.flex_define_rect{
	display:flex;
	align-items:flex-start;
	}
dl.flex_define_rect dt{
	box-sizing:border-box;
	width:150px;
	text-align:center;
	flex-grow:0;
	flex-shrink: 0;
	margin-right:20px;
	background-color:#555;
	color:#fff;
	}
dl.flex_define_rect dd{
	box-sizing:border-box;
	flex-grow:1;
	margin-bottom:1em;
	}
	@media screen and (max-width:959px) {	
	  dl.flex_define_rect{
		  flex-direction: column;
		  }
	  dl.flex_define_rect dt{
		  width:100%;
		  flex-grow:1;
		  margin-right:0;
		  }
	  dl.flex_define_rect dd{
		  width:100%;
		  }
	}	
	
/*************　flex dl 横並び見出し 罫線　*************/

dl.flex_define_line{
	display:flex;
	align-items:stretch;
	border-bottom:1px solid #333;
	}
dl.flex_define_line:first-child{
	border-top:1px solid #333;
	}
dl.flex_define_line dt{
	box-sizing:border-box;
	width:150px;
	padding:20px 30px;
	flex-grow:0;
	flex-shrink: 0;
	display:flex;
	align-items:center;
	font-weight:bold;
	}
dl.flex_define_line dd{
	box-sizing:border-box;
	padding:20px 30px;
	flex-grow:1;
	display:flex;
	align-items:center;
	}
	@media screen and (max-width:959px) {	
	  dl.flex_define_line{
		  flex-direction: column;
		  }
	  dl.flex_define_line dt{
		  width:100%;
		  flex-grow:1;
		  }
	  dl.flex_define_line dd{
		  width:100%;
		  }
	}	

/*************　flexリスト1（固定幅アイテム中央寄せ左揃え）　*************/


.flex_list{
display: flex;
justify-content: center;
flex-wrap: wrap;
}
.flex_list .item{
box-sizing:border-box;
border:1px solid #bbb;
width:300px;
margin:0 15px 30px 15px;
padding:20px;
}
.flex_list .empty{
height:10px;
border:none;
}
	@media screen and (max-width:959px) {	
	  .flex_list .item{
	  width:80%;
	  margin:0 auto 30px;
	  }
	}	


/*************　flexリスト矩形　サムネ　ボタン付き　*************/



.flex_list_rect{
display: flex;
justify-content: center;
flex-wrap: wrap;
}
.flex_list_rect .item{
box-sizing:border-box;
display:flex;
flex-direction:column;
align-items:flex-start;
border:1px solid #bbb;
width:250px;
margin:0 10px 20px;
background: #fff;
box-shadow:3px 3px 6px rgba(0, 0, 0, 0.1);
font-size:16px;
line-height:1.3;
}
.flex_list_rect .item a:first-child{
display:block;
}
.flex_list_rect .item p{
padding:15px 15px 25px;
}
.flex_list_rect .item a:last-child{
display:block;
width:calc(100% - 30px) ;
background:#fff;
margin:auto auto 13px;
box-sizing:border-box;
padding:4px;
border:1px solid #888;
text-align:center;
color:#111;
font-size:80%;
}
.flex_list_rect .item a:last-child:hover{
background:#111;
color:#fff;
transition:all 0.2s ease 0s;
}


.flex_list_rect .empty{
height:10px;
background:none;
border:none;
box-shadow:none;
}
	@media screen and (max-width:959px) {	
	  .flex_list_rect .item{
	  width:48%;
	  margin:0 1% 30px;
	  }
	}	




 
 
 /*================================================
 *  画像＋キャプション flexレイアウト
 ================================================*/

 
/*************　画像＋キャプション 1単 (スマホ1列)　*************/
.pic_list_1col{
	display:flex;
	justify-content:center;
	flex-wrap:wrap;
	}
.pic_list_1col .item{
	width:66%;
	margin-bottom:30px;
	}
.pic_list_1col .item img{
	width:100%; height:auto;
	}	
.pic_list_1col .item p{
	font-size:95%;
	}		
		@media screen and (max-width:959px) {
		.pic_list_1col{flex-direction: column;}
		.pic_list_1col .item{width:100%;}	
		}
/*************　画像＋キャプション 2分割 (スマホ1列)　*************/
  
.pic_list_2col{
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
	}
.pic_list_2col .item{
	width:calc((100% - 30px) / 2);/*余白30px*/
	margin-bottom:30px;
	}
.pic_list_2col .item img{
	width:100%; height:auto;
	}	
.pic_list_2col .item p{
	font-size:95%;
	}		
		@media screen and (max-width:959px) {
		.pic_list_2col{flex-direction: column;}
		.pic_list_2col .item{width:100%;}	
		}
/*************　画像＋キャプション 3分割 (スマホ1列)　*************/
.pic_list_3col{
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
	}
.pic_list_3col .item{
	width:calc((100% - 60px) / 3);/*余白30px*/
	margin-bottom:30px;
	}
.pic_list_3col .item img{
	width:100%; height:auto;
	}	
.pic_list_3col .item p{
	font-size:95%;
	}		
		@media screen and (max-width:959px) {
		.pic_list_3col{flex-direction: column;}
		.pic_list_3col .item{width:100%;}	
		}
/*************　画像＋キャプション 4分割 (スマホ2列)　*************/
.pic_list_4col{
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
	}
.pic_list_4col .item{
	width:calc((100% - 90px) / 4);/*余白30px*/
	margin-bottom:30px;
	}
.pic_list_4col .item img{
	width:100%; height:auto;
	}	
.pic_list_4col .item p{
	font-size:95%;
	}		
		@media screen and (max-width:959px) {
		.pic_list_4col{ }
		.pic_list_4col .item{width:calc((100% - 15px) / 2);/*余白15px*/}	
		}




 /*================================================
 *  ■ 
 ================================================*/



/*************　　*************/

/*************　　*************/



/*************　　*************/

/*************　　*************/

/*************　　*************/

/*************　　*************/


 /*================================================
 *  ■ 
 ================================================*/





/* =================================================================================

PCサイズ限定

================================================================================= */

@media only screen and (min-width: 960px) {
	



}


/* =================================================================================

スマートフォン向けデザイン

================================================================================= */

@media screen and (max-width:959px) {





	
}