/*
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:"M PLUS Rounded 1c", sans-serif;
	100,300,400,500,700,800,900

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

*/

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

/*******************************
/* 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;
}
.l-content__body{
	margin-bottom:0;
}
body.page #breadcrumb{
	display:none;
}
h1, h2, h3, h4, h5, h6{
	font-weight:600;
	line-height:inherit;
}
h1.wp-block-heading{
	font-size:1.65rem;
}
h2.wp-block-heading{
	font-size:1.65rem;
}
h3.wp-block-heading{
	font-size:1.4rem;
}
h4.wp-block-heading{
	font-size:1.25rem;
}
body.single-post h1.c-pageTitle__main{
	font-size:1.65rem;
	font-weight:600;
}
body.archive  h1.c-pageTitle__main{
	font-size:1.65rem;
	font-weight:600;
}
@media screen and (max-width: 767px){
/* mobile ------------------------------------------- */
	h1.wp-block-heading{
		font-size:1.25rem;
	}
	h2.wp-block-heading{
		font-size:1.20rem;
	}
	h3.wp-block-heading{
		font-size:1.10rem;
	}
	h4.wp-block-heading{
		font-size:1.05rem;
	}
	h1.c-pageTitle__main{
		font-size:1.40rem;
		font-weight:600;
	}
}

/*******************************
/* p-topArea
*******************************/

body.page .p-topArea{
	min-height:40vh;
}
body.page .p-topArea .p-topArea__body{
	display:none;
}
@media screen and (max-width: 767px){
/* mobile ------------------------------------------- */
	body.page .p-topArea{
		min-height:15vh;
	}
}

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

#header .l-header__center{
	padding:15px 0 15px 0;
}
#header .c-headLogo{
	line-height:1;
}
#header .c-gnav .__mainText{
	font-family:"M PLUS Rounded 1c", sans-serif;
	font-size:0.95rem;
	font-weight:500;
	padding:0.4em 0.5em;
	transform:rotate(0.05deg);
}
body.home .l-header{
	visibility:visible;
	opacity:1;
	transition:all 0.5s;
}
[data-scrolled=false] body.home .l-header{
	visibility:hidden;
	opacity:0;
}

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

.l-footer__nav.u-flex--c{
	/*justify-content:right;*/
}
.l-footer__nav a{
	font-family:"M PLUS Rounded 1c", sans-serif;
	font-size:0.95rem;
	font-weight:500;
	transform:rotate(0.05deg);
}
.l-footer__foot{
	padding:2.0rem 0 4.5rem 0;
}
.l-footer__foot p.c-copyright{
	/*text-align:right;*/
	margin-top:4em;
}

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

#hero,
#hero > div.hero_visual .swiper-slide img{
	width:100%;
	height:100vh;
	min-height:880px;
}
#hero{
	position:relative;
	width:100%;
	overflow:hidden;
}
#hero > div.hero_caption{
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	z-index:15;
	color:#fff;
	width:100%;
	height:100%;
	display:flex;
	justify-content:center;
	align-items:center;
}
#hero > div.hero_caption > div{
	width:840px;
}
#hero > div.hero_visual{
	position:relative;
}
#hero > div.hero_visual .swiper{}
#hero > div.hero_visual .swiper-wrapper{}
#hero > div.hero_visual .swiper-slide{}
#hero > div.hero_visual .swiper-slide img{
	object-fit:cover;
	transform:scale(1.25);
}
#hero > div.hero_visual .swiper-slide[class*=-active] img,
#hero > div.hero_visual .swiper-slide[class*=-prev] img,
#hero > div.hero_visual .swiper-slide[class*=-next] img{
	animation:HeroAnimation 15s linear 0s normal both;
}
@keyframes HeroAnimation{
	0%{
		transform:scale(1.25);
	}
	100%{
		transform:scale(1);
	}
}
@media screen and (max-width: 767px){
/* mobile ------------------------------------------- */
	#hero,
	#hero > div.hero_visual .swiper-slide img{
		width:100%;
		height:65vh;
		min-height:auto;
	}
	#hero > div.hero_caption > div{
		padding:0 5.0% 4.5% 5.0%;
	}
}

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

.ark-block-heading{
	display:flex;
	flex-direction:column;
}
.ark-block-heading ~ p{
	line-height:2.5;
}
.ark-block-heading ~ p:first-of-type > strong{
	font-family:"M PLUS Rounded 1c", sans-serif;
	font-size:1.28rem;
	margin:1.25em 0 -0.65em 0;
}
.ark-block-heading .ark-block-heading__main{
	order:3;
	color:var(--wp--preset--color--arkb-color-03);
	font-family:"M PLUS Rounded 1c", sans-serif;
	font-size:2.80rem;
	font-weight:700;
	margin:0.05em 0;
}
.ark-block-heading .ark-block-heading__sub{
	order:2;
	color:var(--wp--preset--color--arkb-color-02);
	font-family:"M PLUS Rounded 1c", sans-serif;
	font-size:1.45rem;
	font-weight:700;
	line-height:1.5;
	margin:0.05em 0;
}
.ark-block-heading .ark-block-heading__line{
	order:1;
	margin:0;
}
.ark-block-heading .ark-block-heading__line:before{
	display:block;
	background-image:url(images/logo_marks_01.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:bottom right;
	background-color:transparent;
	width:85px;
	height:85px;
	border-radius:0;
	margin:0 auto 1.5em auto;
}
.ark-block-heading.has-text-align-left{
	position:relative;
	padding-left:110px;
}
.ark-block-heading.has-text-align-left .ark-block-heading__main{
	font-size:2.20rem;
}
.ark-block-heading.has-text-align-left .ark-block-heading__sub{
	font-size:1.45rem;
}
.ark-block-heading.has-text-align-left .ark-block-heading__line{
	position:absolute;
	top:0;
	left:0;
	margin:0;
}
.ark-block-heading.has-text-align-left .ark-block-heading__line:before{
	margin:0;
}
@media screen and (max-width: 767px){
/* mobile ------------------------------------------- */
	.ark-block-heading ~ p{
		text-align:left;
		line-height:2;
		margin-top:1.5em;
	}
	.ark-block-heading ~ p br{
		display:none;
	}
	.ark-block-heading ~ p:first-of-type > strong{
		display:block;
		font-size:1.10rem;
		text-align:center;
		transform:rotate(0.05deg);
		margin-bottom:1.5em;
	}
	.ark-block-heading .ark-block-heading__main,
	.ark-block-heading.has-text-align-left .ark-block-heading__main{
		font-size:1.35rem;
		transform:rotate(0.05deg);
		margin:0.25em 0;
	}
	.ark-block-heading .ark-block-heading__sub,
	.ark-block-heading.has-text-align-left .ark-block-heading__sub{
		font-size:1.05rem;
		transform:rotate(0.05deg);
		margin:0.25em 0;
	}
	.ark-block-heading .ark-block-heading__line:before{
		width:55px;
		height:55px;
	}
	.ark-block-heading.has-text-align-left{
		padding:0;
	}
	.ark-block-heading.has-text-align-left .ark-block-heading__line:before{
		content: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-04);
	border-radius:50%;
	box-shadow:none;
	opacity:1;
}

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

.contact-form-7-area{}
.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:#111;
	color:#fff;
	padding:0.5em 2.5em;
}
.contact-form-7-area .wpcf7-list-item{
	margin:0 1.5em 0 0;
}
.contact-form-7-area div.unit-title{
	display:block;
	font-weight:700;
	margin:1em 0 0 0;
}
.contact-form-7-area div.unit-item{
	display:block;
	margin:0.5em 0 1.5em 0;
}
.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;
}


/*******************************
/* opening
*******************************/

body.opening-no-scroll{
	overflow:hidden;
	height:100vh;
}
div.opening{
	position:fixed;
	top:0;
	left:0;
	z-index:999;
	width:100vw;
	height:100vh;
	display:-webkit-flex;
	display:flex;
	-webkit-justify-content:center;
	justify-content:center;
	-webkit-align-items:center;
	align-items:center;
	background:#fff;
	opacity:1;
	visibility:visible;
}
div.opening.active{
	opacity:0;
	visibility:hidden;
	transition:all 1.5s ease;
}
div.opening div.opening-element{
	width:90%;
	height:100%;
	background-image:url(images/logo_02.png);
	background-repeat:no-repeat;
	background-position:50% 45%;
	background-size:150px;
	opacity:0;
}
div.opening div.opening-element.active{
	opacity:0;
	filter:blur(20px);
	animation:opening-timer 1.5s forwards;
}
@keyframes opening-timer{
	to{
		opacity:1;
		filter:blur(0);
	}
}
@media screen and (max-width: 767px){
/* mobile ------------------------------------------- */
	div.opening div.opening-element{
		background-size:30%;
	}
}