
:root {
	--header-height:70px;
}


/* ==========================================================
*
* Basic Setting
*
========================================================== */

body{
	letter-spacing:0.05em;
	background-color:#000000;
}


body.onnav {
	height: 100%;
	overflow: hidden;
}


a {
	text-decoration:none;
	/*color: inherit;*/
	color:#00C4FF;

	transition: all 0.2s ease;
	-webkit-transition: all 0.2s ease;
}

a *{
	pointer-events:none;
}

.pc a:hover {
	text-decoration: underline;
	/*color:#00C4FF;*/
}


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

共通パーツ

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

.noPC{
	display:none;
}

.noSP{
	display:initial;
}

address{
	font-size:1.2rem;
}

/* for Sp --------------------*/
@media screen and ( max-width:738px) {
	

	.noPC{
		display:initial;
	}

	.noSP {
		display: none !important;
	}

}




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

 本文

***********************************/
#mainContent{
	display:block;
	/*overflow:hidden;
	overflow-y: auto;
	scroll-snap-type: y proximity;
	height:100vh;*/
	position:relative;
	background:url('../images/bg_pc.webp') no-repeat 50% bottom;
	background-size:contain;
}


.scwatch{
	display:block;
	overflow:hidden;
	width:100%;
	height:80%;
	position:absolute;
	top:20px;
	left:0;
	z-index:-1;
}

#mainContent > .sectionframe{
	display:block;
	overflow:hidden;
	width:100%;
	position:relative;
	/*
	background-color:#000000;
	min-height:90vh;
	scroll-snap-align: start;
	*/
}


#mainContent > .sectionframe.scon{
	/**/
}





.sectioninner{
	display:block;
	/*width:min(100%,1100px);*/
	width:min(100%,1200px);
	height:100%;
	margin:0 auto;
	/*padding-top: 180px;*/
	position:relative;
}

.sectioninner > h2{
	display:block;
	overflow:hidden;
	font-size:2.0rem;
	line-height:155%;
	color:#ffffff;
	text-align:center;
	margin-bottom: 1em;
}
.sectioninner > h2 >  span{
	display:inline-block;
	overflow:hidden;
	text-align:center;
}
.sectioninner > h2 >  span::after{
	display:block;
	overflow:hidden;
	content:"";
	width:3em;
	border-top:3px solid #00C4FF;
	margin:0.5em auto 0;
}


.linedbox{
	display:block;
	overflow:hidden;
	text-align:center;
}

.linedbox > p{
	display:inline-block;
	overflow:hidden;
	padding:0.5em 5em;
	font-size:1.8rem;
	line-height:155%;
	color:#ffffff;
	border:1px solid #ffffff;
}


/* for Sp --------------------*/
@media screen and ( max-width:738px) {

	/*.scwatch{
		height:90%;
		bottom:0;
	}*/


	.sectioninner{
		width:calc(100% - 10vw);
		/*padding-top:24vw;*/
		/*padding-top:var(--header-height);*/
	}


	.linedbox > p{
		display:block;
		padding:0.5em 0;
		font-size:1.6rem;
		letter-spacing:-.025em;
	}

}




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

COVER

***********************************/
#cover{
	background-color:unset!important;
	height:100vh;
	height:100dvh;
}

#cover > .sectioninner{
	/*align-content: center;*/
	padding-top:0;
}

#jms2500{
	display:inline-block;
	overflow:hidden;
	font-size:2.0rem;
	line-height:125%;
	color:#000000;
	position:absolute;
	top:2em;
	left: 2em;
	z-index:10;
}

/* for Sp --------------------*/
@media screen and ( max-width:738px) {

	#jms2500{
		font-size:1.4rem;
		line-height:125%;
		top:3vw;
		left:3vw;
	}

}


/*Scroll ボタン*/
a#coveroff{
	display:inline-block;
	overflow:hidden;
	line-height:100%;
	position:absolute;
	bottom:0;
	left:calc(50% - 31px);
}

.pc a#coveroff > img{
	position:relative;
	-webkit-transition: all 0.25s ease-out;
	transition: all 0.25s ease-out;
}

.pc a#coveroff:hover > img{
	top:10px;
}


/* for Sp --------------------*/
@media screen and ( max-width:738px) {


}



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

 CONCEPT

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

#concept{
	text-align:center;
	font-size:1.6rem;
	line-height: 175%;
	color:#ffffff;
}

#concept .sectioninner p+p{
	margin-top:1em;
}

/* for Sp --------------------*/
@media screen and ( max-width:738px) {

	
	
}




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

 INTRO

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

#introduct{
	text-align:center;
	font-size:1.6rem;
	line-height: 225%;
	color:#ffffff;
}

#introduct .sectioninner p{
	margin-top:2.5em;
}

/* for Sp --------------------*/
@media screen and ( max-width:738px) {

	
	#introduct{
		font-size:1.4rem;
		line-height: 175%;
	}

	#introduct .sectioninner p{
		margin-top:1.5em;
	}
}




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

 ABOUT

***********************************/
#about{
	/**/
}


#about h3{
	display:block;
	overflow:hidden;
	font-size:3.0rem;
	line-height: 175%;
	color:#ffffff;
}

#about .sectioninner p{
	font-size:1.6rem;
	line-height: 225%;
	color:#ffffff;
}


/* for Sp --------------------*/
@media screen and ( max-width:738px) {

	
	#about h3{
		font-size:2.0rem;
		line-height: 155%;
	}

	#about .sectioninner p{
		font-size:1.4rem;
		line-height: 175%;
	}

	
}



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

 PHOTOS

***********************************/
#photos{
	padding-top:95px;
	text-align:center;
	color:#ffffff;
}

#photos h2 > *{
	position:relative;
	vertical-align:middle;
	line-height:100%;
}
#photos h2 > img:nth-child(1){
	margin-right:20px;
}

#photos article{
	display:block;
	overflow:hidden;
	text-align:center;
}



.sctxt{
	display:block;
		overflow:hidden;
	text-align:right;
	font-size: 1.2rem;
	line-height:100%;
	margin-bottom:10px;
}
.scFld{
	display:block;
	overflow-x:auto;
}

#photos .sctxt{
	display:none;
}

/* for Sp --------------------*/
@media screen and ( max-width:738px) {

	#photos h2 > img:nth-child(1){
		width:10vw;
		height:auto;
		margin-right:10px;
	}
	#photos h2 > img:nth-child(2){
		width:calc(100% - 10vw - 20px);
		height:auto;
	}

	#photos .sctxt{
		display:block;
	}

}



/*スライド切り替え*/
#caralbum{
	display:block;
	overflow:hidden;
	position:relative;
	margin:50px 0 10px;
}

#cardata{
	display:block;
	overflow:hidden;
	width:min(100%,1200px);
	position:relative;
}

#cardata > ul{
	display:block;
	position:relative;
}

#cardata > ul > li{
	display:block;
	width:100%;
	background-color:#000000;
	visibility:hidden;
	opacity:0;
	position:relative;
	left:0;
	-webkit-transition: all 0.5s ease-out;
	transition: all 0.5s ease-out;
	/*left:-25px;*/
}

#cardata > ul > li:nth-child(n+2){
	position:absolute;
	top:0;
}


#cardata.sly1 > ul > li:nth-child(1),
#cardata.sly2 > ul > li:nth-child(2),
#cardata.sly3 > ul > li:nth-child(3),
#cardata.sly4 > ul > li:nth-child(4),
#cardata.sly5 > ul > li:nth-child(5){
	visibility:visible;
	opacity:1.0;
	left:0;
	/*transform: scale(1.0);*/
}

#cardata > ul > li img{
	width:100%;
	height:auto;
}


/* for Sp --------------------*/
@media screen and ( max-width:738px) {

	#caralbum{
		margin:10vw 0;
	}

	#cardata{
		display:block;
		overflow:hidden;
		width:min(100%,850px);
		position:relative;
		left:0;
		margin-top:5px;
	}

	#cardata figcaption{
		padding:0 5vw;
	}


	#cardata figcaption > h4 img{
		width:auto;
		height:0.8em;
	}

	#cardata figcaption > p{
		display:block;
		width:100%;
		min-height:5em;
		font-size:1.6rem;
		line-height:155%;
		margin:1em 0 0.5em;
	}

	a.ditailBtn{
		display:block;
		width:100%;
		padding:0.75em 1em!important;
	}
	a.ditailBtn br{
		display:none;
	}

	#cardata a{
		margin-left:0;
	}


}



/*サムネイル*/
ul#thumbtns{
	display:flex;
	overflow:hidden;
	justify-content:center;
	gap:0 25px;
	margin-bottom: 25px;
}

ul#thumbtns > li{
	/*width:min(33%,210px);*/
	flex:1;
	line-height: 100%;
}

ul#thumbtns > li label{
	display:block;
	/*overflow: hidden;*/
	cursor:pointer;
}
ul#thumbtns > li label > input{
	display:none;
}

ul#thumbtns > li label > input + img{
	-webkit-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
	width:min(100%,284px);
	height: auto;
}

ul#thumbtns > li label > input + img{
	filter:brightness(0.5);
}
.pc ul#thumbtns > li label:hover > input + img{
	filter:brightness(1.0);
}
ul#thumbtns > li label > input:checked + img{
	filter:brightness(1.0);
}


/* for Sp --------------------*/
@media screen and ( max-width:738px) {

	ul#thumbtns{
		width:200%;
		overflow-x:auto;
		gap:0 5px;
		margin-bottom:5px;
	}
	
	ul#thumbtns > li{
		
	}

}





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

 CLOSING

***********************************/
#closing{
	
}

#closing > .sectioninner{
	height:350px;
	align-content:center;
}


#closing p{
	display:block;
	overflow:hidden;
	text-align:center;
	font-size:2.5rem;
	line-height:155%;
	color:#ffffff;
}



/* for Sp --------------------*/
@media screen and ( max-width:738px) {

	
	#closing > .sectioninner{
		height:auto;
		padding:10vw 0;
	}


	#closing p{
		font-size:1.5rem;
		line-height:155%;
	}

}


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

 ページTOPへ

#bottomLine{
	display:block;
	width:100%;
	position:sticky;
	bottom:0;
	z-index:8;
}

a#toTop{
	display:inline-block;
	overflow:hidden;
	width: 40px;
	aspect-ratio:1/1;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
	opacity:0.0;
	visibility:hidden;
	position:absolute;
	top: -65px;
	right:25px;
}

a#toTop img{
	width: 100%;
	height:auto;
}

a#toTop.show{
	visibility:visible;
	opacity:1.0;
}

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

/* for Sp --------------------*/
@media screen and ( max-width:738px) {

	

}


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

フッタ

***********************************/
footer{
	display:block;
	overflow:hidden;
	position:relative;
	background-color:#000000;
}

#footerinner{
	display:block;
	overflow:hidden;
	width:min(100%,1100px);
	margin:0 auto 65px;
	font-size:1.6rem;
	line-height:125%;
	color:#ffffff;
	position:relative;
}

#ftlogo{
	display:inline-block;
	overflow:hidden;
		margin-top: 1em;
	white-space:nowrap;
	position:relative;
	font-size:1.8rem;
	line-height:125%;
}

#ftlogo img{
	vertical-align: middle;
	margin-right:1em;
	filter:brightness(100.0);
}


#footerinner ul{
	display:flex;
	overflow:hidden;
	gap:0 2em;
	position:absolute;
	bottom:0;
	right:0;
}

#footerinner ul > li > a{
	display:block;
	overflow:hidden;
	color:#ffffff;
	text-decoration:none;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}

.pc #footerinner ul > li > a:hover{
	color:#00C4FF;
}


/* for Sp --------------------*/
@media screen and ( max-width:738px) {


	#footerinner{
		margin:0 auto 24vw;
		padding:8vw 2vw;
		font-size:1.4rem;
		line-height:125%;
	}

	#ftlogo{
		display:block;
		font-size:1.6rem;
		line-height:125%;
		text-align:center;
	}

	#ftlogo img{
		width:min(24vw,78px);
		height:auto;
		vertical-align:middle;
	}


	#footerinner ul{
		gap:0 1em;
		justify-content:center;
		position:relative;
		bottom:auto;
		right:auto;
		width:100%;
	}

	#footerinner  address{
		text-align:center;
		font-size:clamp(1.1rem,0.5vw,1.2rem);
		line-height:125%;
		margin-top:1em;
	}

}


