/*
Template: arkhe
Theme Name: Arkhe_child
Version: 1.0.0
*/

/* 
	font-family:"Noto Sans JP", sans-serif;
	100-900

	font-family:"Noto Serif JP", serif;
	200-900

	font-family: "Libre Baskerville", serif;
	400-700
	https://fonts.google.com/specimen/Libre+Baskerville

		font-family: "Times New Roman", Times, serif;
		font-family: "Times New Roman", Times, "Libre Baskerville", serif;

	font-family: "Oswald", sans-serif;
	200-700
	https://fonts.google.com/specimen/Oswald?query=Oswald

	var(--wp--preset--color--arkb-color-01)

	[data-scrolled=false]
	[data-scrolled=true]

*/

:root {
	--ark-font_family: "Noto Sans JP","Helvetica Neue","Arial","Hiragino Kaku Gothic ProN","Hiragino Sans","Meiryo",sans-serif;
}

/*******************************
/* Arkhe @media
*******************************/

/* pc, 1000px 以上 */
@media (min-width: 1000px){}

/* tablet, 1000px 以下 */
@media not all and (min-width: 1000px){}

/* mobile, 600px 以下 */
@media not all and (min-width: 600px){}


/*******************************
/* Arkhe［ユーティリティクラス］
 * 詳しくは、src/scss/object/utility/**
*******************************/

/*

・「u-only-pc」というクラスをつけるとPCサイズでのみ表示されるようになったり
・「u-fz-l」を付けるとフォントサイズが大きくなったり
・「u-mt-0」を付けると上部マージンが 0 になったり

u-mt-0	(0,5,10,15,20,25,30,40,50,60,80)
u-mb-0	(0,5,10,15,20,25,30,40,50,60,80)

*/


/*******************************
/* 
*******************************/
*{
	line-height:2.0;
}
a{
	text-decoration:none;
	transition:all 0.3s ease;
}
i{
	font-style:normal;
}
h1, h2, h3, h4, h5, h6{
	line-height:inherit;
}
@media screen and (max-width: 767px){
/* mobile -------------------------------------------------------------------------------------------- */
	input,
	textarea{
		font-size:16px;
	}
}

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

.l-content__body{
	margin-top:3.0rem;
	margin-bottom:0;
}
.home.page .l-content__body{
	margin-top:0;
	margin-bottom:0;
}

/*******************************
/* c-gnav
*******************************/

.c-gnav li.button{
	height:auto;
	margin-left:1.5em;
}
.c-gnav li.button a{
	background:var(--wp--preset--color--arkb-color-01);
	color:#fff;
	padding:1.0em 2.5em;
}
.c-gnav__li:hover{
	color:inherit;
}

/*******************************
/* header
*******************************/

.l-header{
	transition:background-color 0.65s
}
.l-header__body.l-container{
	max-width:none;
}
.l-header__logo.has-text{
	font-family:"Noto Serif JP", serif;
	font-weight:500;
}
.l-header .c-headLogo{
	display:flex;
	align-items:center;
	color:#fff;
	font-size:1.35rem;
	font-weight:700;
	line-height:1;
}
.l-header .c-headLogo::before{
	content:"GLH";
	color:var(--wp--preset--color--arkb-color-01);
	font-family: "Times New Roman", Times, "Libre Baskerville", serif;
	font-size:2.55rem;
	font-weight:600;
	line-height:1;
	margin-right:0.40em;
}
/* tablet, 1000px 以下 */
@media not all and (min-width: 1000px){
	.l-header{
		background:rgba(0,0,0,0.65);
	}
	.l-header .c-headLogo{
		align-items:baseline;
		font-size:1.15rem;
		font-weight:500;
		white-space:nowrap;
	}
	.l-header .c-headLogo::before{
		display:block;
		font-size:1.35rem;
		white-space:nowrap;
		margin-right:0.55em;
	}
	.l-header__center{
		padding:15px 0;
	}
}

/*******************************
/* footer
*******************************/

.l-footer__nav a{
	padding:0.4em 0.5em;
}
.l-footer__foot{
	padding:0.5rem 0 6.5rem 0;
}
.l-footer__foot p.c-copyright{
	font-size:0.77rem;
	margin-top:4em;
}

/*******************************
/* Arkhe［ブロック］：セクション見出し
 * ark-block-heading
*******************************/

.ark-block-heading{
	padding-bottom:1.25em;
}
.ark-block-heading .ark-block-heading__main:empty,
.ark-block-heading .ark-block-heading__sub:empty{
	display:none;
}
.ark-block-heading .ark-block-heading__main{
	color:#000;
	font-size:1.55rem;
	font-weight:600;
	padding:0.65em 0 0.85em 0;
}
.ark-block-heading .ark-block-heading__sub{
	color:#000;
	font-family: "Times New Roman", Times, "Libre Baskerville", serif;
	font-size:3.0rem;
	font-weight:500;
	line-height:1.45;
	opacity:1;
}
.ark-block-heading .ark-block-heading__sub::first-letter{
	color:var(--wp--preset--color--arkb-color-01);
}
.ark-block-heading .ark-block-heading__line:before{
	width:6em;
	border-radius:0;
	background: linear-gradient(to right, #cd0000 0%, #cd0000 50%, #000 50%, #000 100%);
}
@media screen and (max-width: 767px){
/* mobile ------------------------------------- */
	.ark-block-heading .ark-block-heading__main{
		font-size:1.10rem;
	}
	.ark-block-heading .ark-block-heading__sub{
		font-size:2.12rem;
	}
	.ark-block-heading ~ p.has-text-align-center{
		text-align:left;
	}
	.ark-block-heading ~ p.has-text-align-center br{
		display:none;
	}
}

/*******************************
/* Arkhe［ブロック］：アコーディオン
 * ark-block-accordion
*******************************/

.ark-block-accordion.is-style-box .ark-block-accordion__body{
	border-top-style:solid;
}

/*******************************
/* #pagetop
*******************************/

#pagetop{}
#pagetop.c-fixBtn{
	background-color:var(--wp--preset--color--arkb-color-01);
	opacity:1;
}

/*******************************
/* hero
*******************************/

#hero{
	width:100%;
	height:100vh;
	background:#000;
	color:#fff;
}
#hero > div.cover,
#hero > div.cover > div.visual,
#hero > div.cover > div.visual figure,
.swiper-wrapper{
	position:relative;
	z-index:1;
	width:100%;
	height:100vh;
	overflow:hidden;
}
#hero > div.cover > div.video figure video{
	position:absolute;
	top:50%;
	left:50%;
	transform:translateX(-50%) translateY(-50%);
	width:100%;
	height:100%;
	object-fit:cover;
}
#hero > div.cover > div.video div.loading{
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
	z-index:-1;
}
#hero > div.cover > div.video div.loading > span{
	font-family: "Oswald", sans-serif;
	font-size:1.25rem;
	font-weight:600;
	letter-spacing:0.05em;
	opacity:0;
	animation:loading-flash 1.5s linear infinite;
}
@keyframes loading-flash{
	0%		{opacity:0.5;}
	50%		{opacity:0.2;}
	100%	{opacity:0.5;}
}
#hero > div.cover > div.lead{
	position:absolute;
	right:0;
	bottom:0;
	z-index:2;
	color:#fff;
	padding:0 4.0% 3.5% 0;
	transition:all 0.65s;
}
[data-scrolled=false] #hero > div.cover > div.lead{
	filter:invert(1);
}
#hero .lead p{}
#hero .lead .en{}
#hero .lead .en p{
	font-family: "Libre Baskerville", serif;
	font-size:4.05vw;
	font-size:clamp(2.5rem, 2.045rem + 2.27vw, 3.75rem);
	font-weight:400;
	line-height:1.5;
}
#hero .lead .en p > span{
	display:block;
}
#hero .lead .en p > span > span{
	display:inline-block;
	color:#000;
	line-height:1.5;
	padding:0 0.45em 0.025em 0.45em;
}
#hero .lead .jp{
	margin-top:1.5em;
}
#hero .lead .jp p{
	font-size:1.85vw;
	font-size:clamp(1.25rem, 1.114rem + 0.68vw, 1.625rem);
	font-weight:500;
	letter-spacing:0.05em;
}

video{
	width:100%;
	height:100%;
	min-height:690px;
	object-fit: cover;
}
#hero .loading{
	display: none;
}





/* mobile, 600px 以下 */
@media not all and (min-width: 600px){
	#hero{
		height:88vh;
	}
	#hero > div.cover,
	#hero > div.cover > div.visual,
	#hero > div.cover > div.visual figure,
	.swiper-wrapper{
		height:100%;
	}
	#hero > div.cover > div.lead{
		left:0;
		right:auto;
		padding:0 0 15% 3.5%;
	}
	#hero .lead .en p{
		font-size:6.45vw;
		text-align:left;
	}
	#hero .lead .en p > span{
		line-height:2.2;
	}
	#hero .lead .en p > span > span{
		line-height:1.85;
		padding:0 0.85em 0.025em 0.85em;
	}
	#hero .lead .jp{
		margin-top:0.5em;
	}
	#hero .lead .jp p{
		font-size:4.05vw;
		text-align:left;
	}
}

/*******************************
/* contact-form-7
*******************************/

.contact-form-7-area{}
.contact-form-7-area .wpcf7-list-item{
	display:block;
}
.contact-form-7-area input[type=text],
.contact-form-7-area input[type=email],
.contact-form-7-area textarea{
    width:100%;
	font-size:16px;
	padding:0.45em 0.8em;
}
.contact-form-7-area textarea{
	height:12em;
}
.contact-form-7-area input[type=submit]{
	background:var(--wp--preset--color--arkb-color-02);
	color:#fff;
	padding:0.5em 2.5em;
}
.contact-form-7-area .wpcf7-list-item{
	margin:0 1.5em 0 0;
}
.contact-form-7-area .unit{
	display:flex;
	justify-content:space-between;
	border-top:1px solid #ddd;
	padding:1.15em 0;
}
.contact-form-7-area div.unit-title{
	flex:0 0 35%;
	font-weight:500;
}
.contact-form-7-area div.unit-item{
	flex:0 0 65%;
}
.contact-form-7-area div.unit-submit{
	text-align:center;
}
.contact-form-7-area i.required{
	display:inline-block;
	color:#cc0000;
	font-style:normal;
	margin-left:0.4em;
}
.contact-form-7-area span.wpcf7-spinner{
	display:block;
	margin:-30px auto 0 auto;
}
/* mobile, 600px 以下 */
@media not all and (min-width: 600px){
	.contact-form-7-area{
		background:#fff;
		width:96%;
		border-radius:15px;
		padding:1.5em 1.5em;
		margin:0 auto;
	}
	.contact-form-7-area .unit{
		flex-wrap:wrap;
		border:none;
	}
	.contact-form-7-area .unit + .unit{
		border-top:1px solid #ddd;
	}
	.contact-form-7-area div.unit-title,
	.contact-form-7-area div.unit-item{
		flex:0 0 100%;
	}
	.contact-form-7-area div.unit-item{
		font-size:0.90rem;
	}
}

