@charset "UTF-8";
/* CSS Document */

.img_0 {
	background-image: url(../../index_img/GOPR2318.jpg)
}
.img_1 {
	background-image: url(../../atsuya_img/4.jpg)
}
.img_step {
	background-image: url(../../stepup_img/DSC08331.jpg)
}
.img_beginner {
	background-image: url("../../Beginner_img/IMG_1227.jpg")
}
.img_beginner2 {
	background-image: url(../../Beginner_img/IMG_E0561.jpg)
}
.img_access {
	background-image: url(../../access_img/DSC09704.jpg)
}
.img_contact {
	background-image: url(../../access_img/DSC02400.jpg)
}
.img_nishizeko {
	background-image: url(../../nishizeko_img/DSC03472.jpg)
}
.img_board {
	background-image: url(../../board_img/DSC04627.jpg)
}
.img_wet {
	background-image: url(../../wet_img/DSC03266.jpg)
}
.img_rental {
	background-image: url(../../rental_img/IMG_1033.jpg)
}
.video-box { position: relative }

.non_d {
	display: none;
}
#myVideo {
/*position: absolute;
right: 0;
bottom: 0;
top:0;
right:0;*/
width: 100%;
height: auto;/*100%*/
/*background-size: auto 100%;
background-image: url(../img/pv.jpg) ;
background-position: center center;*/
object-fit: cover; /*cover video background */
z-index:1;
}

.fit_1 {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	min-height: 50vw;
}
.fit_2 {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: top center;
	min-height: 80vh;
	position: relative;
}
.fit_22 {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	min-height: 100vh;
	position: relative;
}
.fit_23 {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center 20%;
	min-height: 100vh;
	position: relative;
}
.fit_24 {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center 70%;
	min-height: 100vh;
	position: relative;
}
.fit_3 {
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center center;
}
.fit_fix {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	min-height: 50vw;
	background-attachment: fixed;
}
.h60 {
	min-height: 60vw;
}
.centerBox {
	position: absolute;
	top: 20vw;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 50%;
	text-align: center;
}
.centerBox2 {
	position: absolute;
	top: 45vw;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 50%;
	text-align: center;
	z-index: 21;
}
.centerBox5, .centerBox4 {
	position: static;
	top: 20vw;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 50%;
	text-align: center;
	padding-top: 50px;
}
.centerBox p,.centerBox2 p, .centerBox4 p, .centerBox5 p {
	text-align: justify;
	font-size: large;
}
.centerBox3 {
	position: relative;
	top: 0vw;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 50%;
	text-align: center;
}
.centerBox .nami, .centerBox2 .nami{
	width: 30em;
	max-width: 100%;
	padding: 1px;
	border: 1px solid hsla(0,0%,99%,1.00);
	margin-left: auto;
	border-radius: 10px;
	margin-right: auto;
}
.centerBox .nami p, .centerBox .nami img, .centerBox2 .nami p, .centerBox2 .nami img{
	text-align: center;
	display: inline-block;
	vertical-align: bottom;
	margin-bottom: 0px;
}

	.hover15 {
		display: none;
	}

img.sing {
	width: 10vw;
}
img.sing2 {
	width: 10vw;
}

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

.thumb_wrap {
	width: 22%;
	margin: 1%;
	display: inline-block;
	object-fit: cover;
}
@media (min-width:1600px){
	.centerBox3 {
	position: relative;
	top: 10vw;
	}
	/*.centerBox4 {
	position: absolute;
	padding-top: 0px;
	}*/
}
@media (max-width:1201px){
	.centerBox2, .centerBox4 {
	width: 70%;
	}
}
@media (max-width:991px){
	.centerBox {
	top: 20vw;
	}
	.centerBox,.centerBox3,.centerBox3 {
	width: 80%;
	}
	.centerBox2 {
	width: 90%;
	}
	img.sing2 {
	width: 20vw;
	}
	.fit_1 {
	min-height: 70vw;
	}
}
@media screen and (min-width:768px) and ( max-width:778px) {
	h1.logo img {
	max-width: 140px;
	height: auto;
	}
}
@media (max-width:767px){
.fit_2,.fit_24 {
	min-height: 60vh;
}
	.centerBox,.centerBox2,.centerBox3,.centerBox3 {
	position: static;
	padding-bottom: 20px;
	}
	.centerBox4 {
	position: static;
	padding-bottom: 20px;
	width: 80%;
	}
	.centerBox2 p {
	text-shadow: 2px 2px 1px hsla(0,0%,0%,0.8);
	}
	.pc{
		display: none;
	}
	
}

@media (max-width:415px){
.centerBox h2,.centerBox2 h2 {
	font-size: medium;
	}
.centerBox p,.centerBox2 p,.centerBox2 p {
	font-size: smaller;	
}
	/*.tiles {
		display: none;
	}*/
	.hover15 {
		display: block;
	}
}