@charset "UTF-8";

/* --------------------------------------------
FONTS
--------------------------------------------- */
@font-face{
	font-family : "Noto Sans JP";
	font-weight : 300 700;
	src : url( "../fonts/variable/NotoSansJP-VF.woff" ) format( "woff-variations" );
}
@font-face{
	font-family : "Noto Serif JP";
	font-weight : 300 700;
	src : url( "../fonts/variable/NotoSerifJP-VF.woff" ) format( "woff-variations" );
}
.serif{
	font-family : "Noto Serif JP" , serif;
}
.roboto{
	font-family : Roboto , sans-serif;
}

/* --------------------------------------------
ROOT
--------------------------------------------- */
@media screen and ( max-width : 750px ){
	html{
		font-size : calc( 10 * 100vw / 750 );
		scroll-padding-top : calc( 160 * 100vw / 750 );
	}
}
@media print , screen and ( min-width : 751px ){
	html{
		font-size : 10px;
		scroll-padding-top : 145px;
	}
}
@media screen and ( max-width : 750px ){
	body{
		padding-bottom : calc( 160 * 100vw / 750 );
		font-size : 2.4rem;
	}
	body.is-open{
		overflow : hidden;
	}
}
@media print , screen and ( min-width : 751px ){
	body{
		min-width : 1120px;
		font-size : 1.6rem;
	}
}
main{
	overflow-x : clip;
}

/* --------------------------------------------
--WRAPPER
--------------------------------------------- */
@media screen and ( max-width : 750px ){
	.wrap{
		padding-inline : calc( 20 * 100% / 750 );
	}
}
@media print , screen and ( min-width : 751px ){
	.wrap{
		padding-inline : calc( ( 100% - 1050px ) / 2 );
	}
}
@media screen and ( max-width : 750px ){
	.wrap-sp{
		padding-inline : calc( 20 * 100% / 750 );
	}
}
@media print , screen and ( min-width : 751px ){
	.wrap-pc{
		padding-inline : calc( ( 100% - 1050px ) / 2 );
	}
}
@media screen and ( max-width : 750px ){
	.wrapper{
		padding-inline : calc( 20 * 100% / 750 );
	}
}
@media print , screen and ( min-width : 751px ){
	.wrapper{
		padding-inline : calc( ( 100% - 1080px ) / 2 );
	}
}
@media print , screen and ( min-width : 751px ){
	.wrapper-pc{
		padding-inline : calc( ( 100% - 1080px ) / 2 );
	}
}

/* --------------------------------------------
--STATE
--------------------------------------------- */
@media screen and ( max-width : 750px ){
	.is-pc{
		display : none;
	}
}
@media print , screen and ( min-width : 751px ){
	.is-sp{
		display : none;
	}
}

/* --------------------------------------------
COMMON
--------------------------------------------- */
[data-before]::before{
	white-space : pre;
	content : attr( data-before );
}
[data-after]::after{
	white-space : pre;
	content : attr( data-after );
}
[data-both]::before{
	white-space : pre;
	content : attr( data-both );
}
[data-both]::after{
	white-space : pre;
	content : attr( data-both );
}
@media screen and ( max-width : 750px ){
	[data-sp-after]::after{
		white-space : pre;
		content : attr( data-sp-after );
	}
}
@media screen and ( max-width : 750px ){
	[data-sp-before]::before{
		white-space : pre;
		content : attr( data-sp-before );
	}
}
@media print , screen and ( min-width : 751px ){
	[data-pc-after]::after{
		content : attr( data-pc-after );
		white-pcace : pre;
	}
}
@media print , screen and ( min-width : 751px ){
	[data-pc-before]::before{
		white-space : pre;
		content : attr( data-pc-before );
	}
}

/* --------------------------------------------
FULL IMAGE
--------------------------------------------- */
.full{
	width : 100%;
	height : auto;
}
.full img{
	width : 100%;
	height : auto;
}

/* --------------------------------------------
H1
--------------------------------------------- */
#asoTItle{
	display : grid;
	place-items : center start;
	line-height : 1.2;
	color : #fff;
	background-color : #000;
}
@media screen and ( max-width : 750px ){
	#asoTItle{
		padding-top : calc( 8 * 100vw / 750 );
		padding-bottom : calc( 8 * 100vw / 750 );
		padding-left : calc( 15 * 100% / 750 );
		padding-right : calc( 15 * 100% / 750 );
		font-size : 2rem;
	}
}
@media print , screen and ( min-width : 751px ){
	#asoTItle{
		min-width : 1120px;
		padding-top : 4px;
		padding-bottom : 4px;
		padding-left : 48px;
		font-size : 1rem;
	}
}

/* --------------------------------------------
--HEADER
--------------------------------------------- */
#header{
	left : 0;
	z-index : 10;
	display : grid;
	width : 100%;
}
#header:not( .fixed ){
	position : absolute;
	top : var( --pos );
}
#header .logo{
	flex-shrink : 0;
	align-self : center;
	height : 100%;
	transition : top .3s ease-in;
}
#header .logo span , #header .logo svg{
	display : block;
}
#header .logo span{
	font-feature-settings : normal;
	transition : color .3s ease-in;
}
#header .logo svg{
	width : auto;
	transition : fill .3s ease-in;
}
#header .logo svg path{
	transition : fill .3s ease-in;
}
@media screen and ( max-width : 750px ){
	#header{
		grid-template-rows : calc( 39 * 100vw / 750 ) calc( 90 * 100vw / 750 ) calc( 31 * 100vw / 750 );
		grid-template-columns : calc( 15 * 100% / 750 ) auto 1fr calc( 102 * 100% / 750 ) calc( 10 * 100% / 750 );
		background-color : rgb( 0 0 0 / .3 );
	}
	#header .logo{
		grid-row : 1/4;
		grid-row : 1/2;
		grid-column : 2/3;
		padding-top : calc( 50 * 100vw / 750 );
	}
	#header .logo span{
		font-size : 2rem;
		color : #fff;
	}
	#header .logo svg{
		height : calc( 51 * 100vw / 750 );
		margin-top : calc( 17 * 100vw / 750 );
	}
	#header .logo svg path{
		fill : #fff;
	}
}
@media print , screen and ( min-width : 751px ){
	#header{
		grid-template-rows : 130px;
		min-width : 1120px;
		padding-bottom : 15px;
		transition : background .3s ease-in;
	}
	#header .logo{
		position : relative;
		z-index : 2;
		grid-row : 1/2;
		grid-column : 2/3;
		align-self : start;
		height : auto;
	}
	#header .logo span{
		font-size : 1.4rem;
	}
	#header .logo svg{
		height : 31px;
		margin-top : 7px;
	}
}
html.is-fixed #header{
	position : fixed;
	top : 0;
}
@media print , screen and ( min-width : 751px ){
	body:not( .is-dark ) #header{
		background-color : #fff;
	}
	body:not( .is-dark ) #header h1{
		color : #343434;
	}
	body:not( .is-dark ) #header .logo{
		top : 34px;
	}
	body:not( .is-dark ) #header .logo span{
		color : #343434;
	}
	body:not( .is-dark ) #header .logo svg .a{
		fill : #e5004f;
	}
	body:not( .is-dark ) #header .logo svg .b{
		fill : #0068b7;
	}
	body:not( .is-dark ) #header .logo svg .c{
		fill : #231815;
	}
	body.is-dark #header{
		background-color : transparent;
	}
	body.is-dark #header .logo{
		top : 40px;
	}
	body.is-dark #header .logo span{
		color : #fff;
	}
	body.is-dark #header .logo svg .a{
		fill : #fff;
	}
	body.is-dark #header .logo svg .b{
		fill : #fff;
	}
	body.is-dark #header .logo svg .c{
		fill : #fff;
	}
}
@media screen and ( min-width : 1351px ){
	#header{
		grid-template-columns : 48px auto 1fr auto;
	}
}
@media screen and ( min-width : 751px ) and ( max-width : 1350px ){
	#header{
		grid-template-columns : 15px auto 1fr auto;
	}
}

/* --------------------------------------------
--MENU BUTTON
--------------------------------------------- */
@media screen and ( max-width : 750px ){
	#menuBtn > span:nth-of-type( 1 ){
		position : relative;
		display : block;
		width : 100%;
		height : 100%;
		font-size : 0;
	}
	#menuBtn span span{
		position : absolute;
		left : 0;
		display : block;
		width : 100%;
		transition : all .4s;
	}
	#menuBtn span span:nth-of-type( 1 ){
		top : 0;
	}
	#menuBtn span span:nth-of-type( 2 ){
		bottom : 0;
	}
	#menuBtn{
		position : relative;
		z-index : 11;
		grid-row : 2/3;
		grid-column : 4/5;
		padding-top : calc( 19 * 100vw / 750 );
		padding-left : calc( 14 * 100% / 102 );
		padding-right : calc( 14 * 100% / 102 );
		background-color : rgb( 255 255 255 / .9 );
	}
	#menuBtn > span{
		display : block;
	}
	#menuBtn > span:nth-of-type( 1 ){
		height : calc( 23 * 100vw / 750 );
	}
	#menuBtn span span{
		height : calc( 3 * 100vw / 750 );
		background-color : var( --body );
	}
	#menuBtn > span:nth-of-type( 2 ){
		display : flex;
		align-items : center;
		justify-content : center;
		height : calc( 48 * 100vw / 750 );
		font-size : 2rem;
		text-align : center;
		text-indent : .25em;
		letter-spacing : .25em;
		transition : color .3s ease-in;
	}
}
@media screen and ( max-width : 750px ){
	body.is-open #menuBtn > span:nth-of-type( 2 ){
		color : transparent;
	}
}

/* --------------------------------------------
--NAV
--------------------------------------------- */
@media screen and ( max-width : 750px ){
	body.is-open{
		overflow : hidden;
	}
	body.is-open #nav{
		max-height : 100vh;
	}
	body.is-open #header #menuBtn > span:nth-of-type( 1 ) span:nth-of-type( 1 ){
		top : 50%;
		transform : rotate( -45deg );
	}
	body.is-open #header #menuBtn > span:nth-of-type( 1 ) span:nth-of-type( 2 ){
		top : 50%;
		transform : rotate( 45deg );
	}
}
@media screen and ( max-width : 750px ){
	#nav{
		position : fixed;
		top : 0;
		left : 0;
		z-index : 10;
		width : 100%;
		max-height : 0;
		overflow : hidden;
		overflow-y : scroll;
		background-color : #fff;
		transition : max-height .5s ease-in;
	}
	#nav .scroll{
		padding-top : calc( 100 * 100vw / 750 );
		padding-bottom : calc( 145 * 100vw / 750 );
		padding-left : calc( 20 * 100% / 750 );
		padding-right : calc( 20 * 100% / 750 );
	}
	#nav button{
		display : table;
		margin-top : calc( 61 * 100vw / 750 );
		margin-left : auto;
		margin-right : auto;
	}
	#nav button img{
		height : calc( 40 * 100vw / 750 );
	}
}
@media print , screen and ( min-width : 751px ){
	#nav{
		grid-row : 1/3;
		grid-column : 2/5;
	}
	#nav .scroll{
		height : 100%;
	}
}
@media screen and ( max-width : 750px ){
	#navGlobal{
		display : flex;
		flex-wrap : wrap;
		justify-content : space-between;
		pointer-events : none;
	}
	#navGlobal a{
		pointer-events : all;
	}
	#navGlobal > li + li{
		margin-top : calc( 40 * 100vw / 750 );
	}
	#navGlobal > li:nth-child( -n+4 ){
		width : 100%;
	}
	#navGlobal > li:nth-child( -n+4 ) > a::after , #navGlobal > li:nth-child( -n+4 ) span::after{
		width : calc( 120 * 100% / 710 );
	}
	#navGlobal > li:nth-child( n+5 ){
		width : 50%;
	}
	#navGlobal > li:nth-child( n+5 ) > a::after , #navGlobal > li:nth-child( n+5 ) span::after{
		width : calc( 120 * 100% / 355 );
	}
	#navGlobal > li > a{
		position : relative;
		display : block;
		padding-top : calc( ( 16 - 2.8 ) * 100vw / 750 );
		padding-bottom : calc( ( 16 - 2.8 ) * 100vw / 750 );
		font-size : 2.8rem;
		font-weight : 600;
		line-height : 1.2;
		letter-spacing : .1em;
	}
	#navGlobal > li > a::after{
		position : absolute;
		bottom : 0;
		left : 0;
		display : block;
		height : calc( 3 * 100vw / 750 );
		font-size : 0;
		content : "";
		background-color : var( --green );
	}
	#navGlobal ul{
		padding-left : calc( 40 * 100% / 710 );
		padding-right : calc( 10 * 100% / 710 );
		margin-top : calc( 10 * 100vw / 750 );
	}
	#navGlobal li li a{
		display : block;
		padding-top : calc( ( 16 - 2.8 ) * 100vw / 750 );
		padding-bottom : calc( ( 16 - 2.8 ) * 100vw / 750 );
		font-size : 2.8rem;
		font-weight : 600;
		line-height : 1.2;
		letter-spacing : .1em;
	}
	#navGlobal li li a span{
		margin-left : .5em;
		font-size : 2.2rem;
		font-weight : 400;
		color : #999;
	}
	#navGlobal li li a span::before{
		content : "-";
	}
	#navGlobal li li a span::after{
		content : "-";
	}
}
@media print , screen and ( min-width : 751px ){
	#navGlobal{
		display : flex;
		flex-wrap : wrap;
		align-items : flex-start;
		justify-content : flex-end;
		height : 100%;
	}
	#navGlobal::before{
		display : block;
		flex-shrink : 0;
		order : 4;
		width : 100%;
		content : "";
	}
	#navGlobal ul{
		display : none;
	}
	#navGlobal li , #navGlobal a{
		transition : color .3s ease-in;
	}
	#navGlobal .pc-order01{
		order : 1;
	}
	#navGlobal .pc-order02{
		order : 2;
	}
	#navGlobal .pc-order03{
		order : 3;
		margin-right : 522px;
	}
	#navGlobal .pc-order04{
		order : 5;
		margin-top : auto;
	}
	#navGlobal .pc-order05{
		order : 6;
		margin-top : auto;
	}
	#navGlobal .pc-order06{
		order : 7;
		margin-top : auto;
	}
	#navGlobal .pc-order07{
		order : 8;
		margin-top : auto;
	}
	#navGlobal .pc-order08{
		order : 9;
		margin-top : auto;
	}
	#navGlobal .pc-order09{
		order : 10;
		margin-top : auto;
	}
	#navGlobal .pc-order10{
		order : 10;
		margin-top : auto;
	}
	#navGlobal .pc-order11{
		order : 11;
		margin-top : auto;
	}
	#navGlobal > li:not( .is-sp ){
		display : flex;
		align-items : center;
		font-size : 1.4rem;
		color : #fff;
	}
	#navGlobal a , #navGlobal > li > span{
		display : block;
		padding-top : 6px;
		padding-bottom : 6px;
		padding-left : 1em;
		padding-right : 1em;
		font-weight : 600;
	}
	#navGlobal > li:not(.pc-order03, .pc-order11)::after{
		white-space : pre;
		content : "｜";
	}
}
@media print , screen and ( min-width : 751px ){
	.pc-gnav a{
		font-size : 1.7rem;
	}
}
@media screen and ( min-width : 751px ) and ( max-width : 1380px ){
	.pc-gnav a{
		font-size : 1.6rem;
	}
	#navGlobal a , #navGlobal > li > span{
		padding-left : .5em;
		padding-right : .5em;
	}
	.tab-non{
		display : none ! important;
	}
}
@media print , screen and ( min-width : 751px ){
	body.is-dark #navGlobal li , body.is-dark #navGlobal a{
		color : #fff;
	}
	body:not( .is-dark ) #navGlobal li , body:not( .is-dark ) #navGlobal a{
		font-weight : 500;
		color : #353535;
	}
}
#navSub{
	display : grid;
	pointer-events : none;
}
#navSub a{
	pointer-events : all;
}
#navSub a , #navSub span{
	color : #fff;
}
#navSub .contacts , #navSub .line{
	display : flex;
	align-items : center;
	justify-content : center;
	font-weight : 700;
}
@media screen and ( max-width : 750px ){
	#navSub{
		grid-template-rows : calc( 30 * 100vw / 750 ) calc( 21 * 100vw / 750 ) calc( 80 * 100vw / 750 );
		grid-template-columns : calc( 540 * 100% / 710 ) calc( 5 * 100% / 710 ) calc( 80 * 100% / 710 ) calc( 5 * 100% / 710 ) calc( 80 * 100% / 710 );
		margin-top : calc( 67 * 100vw / 750 );
	}
	#navSub p{
		grid-template-rows : 1/2;
		grid-template-columns : 1/6;
		font-size : 3rem;
		font-weight : 300;
		text-align : center;
	}
	#navSub .contacts{
		grid-row : 3/4;
		grid-column : 1/2;
		font-size : 2.6rem;
		background : linear-gradient( 8.4269690214807deg , #d1a31a 0% , #d1a31a 50% , #c90 50% , #c90 100% );
	}
	#navSub .tel{
		display : flex;
		grid-row : 3/4;
		grid-column : 3/4;
		align-items : center;
		justify-content : center;
		font-family : Roboto , sans-serif;
		font-size : 2.2rem;
		background : linear-gradient( 45deg , #ed7785 0% , #ed7785 50% , #eb6877 50% , #eb6877 100% );
	}
	#navSub .line{
		grid-row : 3/4;
		grid-column : 5/6;
		font-size : 2.6rem;
		font-size : 2.2rem;
		background : linear-gradient( 45deg , #419d41 0% , #419d41 50% , #2b922b 50% , #2b922b 100% );
	}
}
@media print , screen and ( min-width : 751px ){
	#navSub{
		position : absolute;
		top : 0;
		right : 0;
		grid-template-rows : 5px 24px 11px 40px;
		grid-template-columns : auto 152px 10px 270px 90px;
	}
	#navSub .mymemory{
		display : flex;
		grid-row : 2/3;
		grid-column : 2/3;
		align-items : center;
		justify-content : center;
		font-size : 1.4rem;
		background-color : var( --green );
		border-radius : 12px;
	}
	#navSub .tel{
		grid-row : 4;
		grid-column : 1/3;
	}
	#navSub .tel .is-pc{
		display : grid;
		grid-template-rows : 40px;
		grid-template-columns : 90px 16px auto;
	}
	#navSub .tel .is-pc span{
		display : block;
		line-height : 1;
		transition : color .3s ease-in;
	}
	#navSub .tel .is-pc span:nth-of-type( 1 ){
		display : flex;
		grid-row : 1;
		grid-column : 1;
		align-items : center;
		justify-content : center;
		border-top : 1px solid currentColor;
		border-bottom : 1px solid currentColor;
	}
	#navSub .tel .is-pc span:nth-of-type( 1 ){
		font-size : 1.2rem;
		line-height : 1.2;
	}
	#navSub .tel .is-pc span:nth-of-type( 1 ){
		padding-top : calc( 5px - 1.2px );
		padding-bottom : calc( 5px - 1.2px );
		text-align : center;
		text-indent : .1em;
		letter-spacing : .1em;
		white-space : nowrap;
	}
	#navSub .tel .is-pc span:nth-of-type( 2 ){
		grid-row : 1;
		grid-column : 3;
		align-self : center;
		font-size : 4.4rem;
		font-weight : 700;
		white-space : nowrap;
	}
	#navSub .contacts{
		grid-row : 1/5;
		grid-column : 4/5;
		font-size : 2.2rem;
		background : linear-gradient( 16.504361381755deg , #d1a31a 0% , #d1a31a 50% , #c90 50% , #c90 100% );
	}
	#navSub .line{
		grid-row : 1/5;
		grid-column : 5/6;
		font-size : 2.2rem;
		background : linear-gradient( 41.63353933657deg , #419d41 0% , #419d41 50% , #2b922b 50% , #2b922b 100% );
	}
}
@media print , screen and ( min-width : 751px ){
	body.is-dark #navSub span{
		color : #fff;
	}
	body:not( .is-dark ) #navSub span{
		color : #353535;
	}
}
@media screen and ( max-width : 750px ){
	.mymemory_nav{
		position : relative;
	}
	.mymemory_nav a.mymemory-sp_bt{
		position : absolute;
		top : calc( 50 * 100vw / 750 );
		right : calc( 10 * 100vw / 750 );
		display : block;
		align-items : center;
		justify-content : center;
		padding : calc( 15 * 100vw / 750 ) calc( 30 * 100vw / 750 );
		font-size : 2.6rem;
		color : #fff;
		background-color : #1ead4c;
		background-color : var( --green );
		border-radius : 12px;
	}
}

/* --------------------------------------------
TO TOP
--------------------------------------------- */
#toTop{
	position : fixed;
	z-index : 5;
	display : flex;
	align-items : flex-end;
}
#toTop span{
	display : block;
	flex-shrink : 0;
	font-weight : 300;
	line-height : 1;
	letter-spacing : .2em;
	transition : color .3s ease-in;
}
#toTop svg{
	flex-shrink : 0;
	width : auto;
}
#toTop .a{
	fill : none;
	stroke : #000;
	stroke-linecap : round;
	stroke-linejoin : round;
	stroke-width : 2px;
	transition : stroke .3s ease-in;
}
#toTop.is-absolute{
	position : absolute;
}
@media screen and ( max-width : 750px ){
	#toTop{
		right : calc( 25 * 100% / 750 );
	}
	#toTop span{
		font-size : 2rem;
	}
	#toTop svg{
		height : calc( 91 * 100vw / 750 );
	}
	#toTop:not( .is-absolute ){
		bottom : calc( 160 * 100vw / 750 );
	}
	#toTop.is-absolute{
		top : calc( 15 * 100vw / 750 );
	}
}
@media print , screen and ( min-width : 751px ){
	#toTop{
		left : calc( 50% + 438px );
	}
	#toTop svg{
		height : 90px;
	}
	#toTop span{
		font-size : 1.4rem;
		color : #000;
	}
	#toTop .a{
		stroke : var( --green );
	}
	#toTop:not( .is-absolute ){
		bottom : 0;
	}
	#toTop.is-absolute{
		top : -122px;
	}
}
@media screen and ( max-width : 750px ){
	body.is-dark #toTop span , #toTop.is-absolute span{
		color : #fff;
	}
	body.is-dark #toTop .a , #toTop.is-absolute .a{
		stroke : #fff;
	}
}
@media screen and ( max-width : 750px ){
	body:not( .is-dark ) #toTop:not( .is-absolute ) span{
		color : #000;
	}
	body:not( .is-dark ) #toTop:not( .is-absolute ) .a{
		stroke : var( --green );
	}
}

/* --------------------------------------------
CONTACTS
-- firstview = sp only
--------------------------------------------- */
#contacts h2{
	font-weight : 300;
}
#contacts .contact , #contacts .line{
	display : flex;
	align-items : center;
	justify-content : center;
	font-weight : 700;
	color : #fff;
}
#contacts .tel a{
	font-weight : 700;
}
@media screen and ( max-width : 750px ){
	#contacts{
		position : fixed;
		bottom : 0;
		left : 0;
		z-index : 5;
		display : grid;
		grid-template-rows : calc( 30 * 100vw / 750 ) calc( 17 * 100vw / 750 ) calc( 80 * 100vw / 750 );
		grid-template-columns : calc( 540 * 100% / 712 ) calc( 6 * 100% / 712 ) calc( 80 * 100% / 712 ) calc( 6 * 100% / 712 ) calc( 80 * 100% / 712 );
		width : 100%;
		height : calc( 160 * 100vw / 750 );
		padding-top : calc( 20 * 100vw / 750 );
		padding-left : calc( 20 * 100% / 750 );
		padding-right : calc( 18 * 100% / 750 );
		background-color : #fff;
		border-top : calc( 4 * 100vw / 750 ) solid var( --green );
	}
	#contacts h2{
		grid-row : 1;
		grid-column : 1/6;
		font-size : 3rem;
	}
	#contacts .contact{
		grid-row : 3;
		grid-column : 1;
		font-size : 2.6rem;
		background : linear-gradient( 8.4269690214807deg , #d1a31a 0% , #d1a31a 50% , #c90 50% , #c90 100% );
	}
	#contacts .tel{
		grid-row : 3;
		grid-column : 3;
	}
	#contacts .tel a{
		display : flex;
		align-items : center;
		justify-content : center;
		width : 100%;
		height : 100%;
		font-size : 2.2rem;
		color : #fff;
		background : linear-gradient( 45deg , #ed7785 0% , #ed7785 50% , #eb6877 50% , #eb6877 100% );
	}
	#contacts .line{
		grid-row : 3;
		grid-column : 5;
		font-size : 2.2rem;
		background : linear-gradient( 45deg , #419d41 0% , #419d41 50% , #2b922b 50% , #2b922b 100% );
	}
}

/* --------------------------------------------
HOME
-- MAIN VISUAL
--------------------------------------------- */
#mv{
	overflow : hidden;
	font-size : 0;
}
#mv picture{
	overflow : hidden;
}
#mv picture > img{
	width : 100%;
	height : 100%;
	object-fit : cover;
}
#mv picture{
	width : 100%;
}
@media screen and ( max-width : 750px ){
	#mv{
		position : relative;
		height : calc( 1380 * 100vw / 750 );
	}
	#mv picture{
		height : calc( 1380 * 100vw / 750 );
	}
	#mv a{
		position : absolute;
		bottom : 0;
		left : 50%;
		display : table;
		margin-left : auto;
		margin-right : auto;
		transform : translateX( -50% );
	}
	#mv a img{
		height : calc( 196 * 100vw / 750 );
	}
}
@media print , screen and ( min-width : 1120px ){
	#mv{
		height : 829px;
	}
	#mv picture{
		height : 829px;
	}
}

/* --------------------------------------------
TITLE
--------------------------------------------- */
#title{
	display : flex;
	align-items : flex-end;
	justify-content : center;
	font-family : "Noto Serif JP" , serif;
	font-weight : 500;
	color : #fff;
	text-align : center;
	background-repeat : no-repeat;
	background-size : cover;
}
@media screen and ( max-width : 750px ){
	#title{
		height : calc( 500 * 100vw / 750 );
		background-position : 0 0;
	}
	#title{
		font-size : 5rem;
		line-height : 1.4;
	}
	#title{
		padding-bottom : calc( ( 161 - 10 ) * 100vw / 750 );
	}
}
@media print , screen and ( min-width : 751px ){
	#title{
		background-position : center;
	}
	#title{
		font-size : 5rem;
		line-height : 1.4;
	}
	#title{
		height : 350px;
		padding-bottom : calc( 99px - 10px );
	}
}
@media screen and ( max-width : 750px ){
	body.aboutkakeizu #title , body.howto #title , body.when #title{
		background-image : url( "../images/ui/bg/title/aboutkakeizu_sp.jpg" );
	}
}
@media print , screen and ( min-width : 751px ){
	body.aboutkakeizu #title , body.howto #title , body.when #title{
		background-image : url( "../images/ui/bg/title/aboutkakeizu_pc.jpg" );
	}
}
@media screen and ( max-width : 750px ){
	body.feature #title , body.mymemories #title , body.myroots #title{
		background-image : url( "../images/ui/bg/title/feature_sp.jpg" );
	}
}
@media print , screen and ( min-width : 751px ){
	body.feature #title , body.mymemories #title , body.myroots #title{
		background-image : url( "../images/ui/bg/title/feature_pc.jpg" );
	}
}
@media screen and ( max-width : 750px ){
	body.service #title , body.towakakeizu #title , body.instantkakeizu #title , body.honkakugenchichosa #title , body.kosekichosa #title , body.instantkakeizu-confirm #title , body.instantkakeizu-thanks #title{
		background-image : url( "../images/ui/bg/title/service_sp.jpg" );
	}
}
@media print , screen and ( min-width : 751px ){
	body.service #title , body.towakakeizu #title , body.instantkakeizu #title , body.honkakugenchichosa #title , body.kosekichosa #title , body.instantkakeizu-confirm #title , body.instantkakeizu-thanks #title{
		background-image : url( "../images/ui/bg/title/service_pc.jpg" );
	}
}
@media screen and ( max-width : 750px ){
	body.flow #title{
		background-image : url( "../images/ui/bg/title/feature_sp.jpg" );
	}
}
@media print , screen and ( min-width : 751px ){
	body.flow #title{
		background-image : url( "../images/ui/bg/title/feature_pc.jpg" );
	}
}
@media screen and ( max-width : 750px ){
	body.voices #title{
		background-image : url( "../images/ui/bg/title/voices_sp.jpg" );
	}
}
@media print , screen and ( min-width : 751px ){
	body.voices #title{
		background-image : url( "../images/ui/bg/title/voices_pc.jpg" );
	}
}
@media screen and ( max-width : 750px ){
	body.faq #title{
		background-image : url( "../images/ui/bg/title/faq_sp.jpg" );
	}
}
@media print , screen and ( min-width : 751px ){
	body.faq #title{
		background-image : url( "../images/ui/bg/title/faq_pc.jpg" );
	}
}
@media screen and ( max-width : 750px ){
	body.kakeizumemories #title{
		background-image : url( "../images/ui/bg/title/kakeizumemories_sp.jpg" );
	}
}
@media print , screen and ( min-width : 751px ){
	body.kakeizumemories #title{
		background-image : url( "../images/ui/bg/title/kakeizumemories_pc.jpg" );
	}
}
@media screen and ( max-width : 750px ){
	body.post #title , body.single-post #title , body.category #title{
		background-image : url( "../images/ui/bg/title/news_sp.jpg" );
	}
}
@media print , screen and ( min-width : 751px ){
	body.post #title , body.single-post #title , body.category #title{
		background-image : url( "../images/ui/bg/title/news_pc.jpg" );
	}
}
@media screen and ( max-width : 750px ){
	body.contact #title , body.contact-confirm #title , body.contact-thanks #title{
		background-image : url( "../images/ui/bg/title/contact_sp.jpg" );
	}
}
@media print , screen and ( min-width : 751px ){
	body.contact #title , body.contact-confirm #title , body.contact-thanks #title{
		background-image : url( "../images/ui/bg/title/contact_pc.jpg" );
	}
}
@media screen and ( max-width : 750px ){
	body.corporate #title , body.laws #title{
		background-image : url( "../images/ui/bg/title/corporate_sp.jpg" );
	}
}
@media print , screen and ( min-width : 751px ){
	body.corporate #title , body.laws #title{
		background-image : url( "../images/ui/bg/title/corporate_pc.jpg" );
	}
}
@media screen and ( max-width : 750px ){
	body.policy #title , body.sitemap #title{
		background-image : url( "../images/ui/bg/title/policy_sp.jpg" );
	}
}
@media print , screen and ( min-width : 751px ){
	body.policy #title , body.sitemap #title{
		background-image : url( "../images/ui/bg/title/policy_pc.jpg" );
	}
}

/* --------------------------------------------
BEREACRUMBS
--------------------------------------------- */
@media print , screen and ( min-width : 751px ){
	#breadclumbs{
		display : flex;
		flex-wrap : wrap;
		justify-content : flex-end;
		padding-top : calc( 24px - 8px );
		padding-bottom : calc( 24px - 8px );
	}
	#breadclumbs li{
		font-size : 1.6rem;
		line-height : 2;
	}
	#breadclumbs li{
		color : #999;
	}
	#breadclumbs li + li{
		display : flex;
		align-items : center;
	}
	#breadclumbs li + li::before{
		flex-shrink : 0;
		white-space : pre;
		content : "　／　";
	}
}

/* --------------------------------------------
PAGE TITLES
--------------------------------------------- */
#pagetitles h1 , #pagetitles h2 , #pagetitle{
	font-family : "Noto Serif JP" , serif;
	text-align : center;
}
#pagetitles h1::after , #pagetitles h2::after , #pagetitle::after{
	display : block;
	margin-left : auto;
	margin-right : auto;
	content : "";
	background-color : var( --green );
}
@media screen and ( max-width : 750px ){
	#pagetitles h1 , #pagetitles h2 , #pagetitle{
		font-size : 4.2rem;
		line-height : 1.42;
	}
	#pagetitles h1::after , #pagetitles h2::after , #pagetitle::after{
		width : calc( 450 * 100% / 750 );
		height : calc( 6 * 100vw / 750 );
		margin-top : calc( ( 32 - 9 ) * 100vw / 750 );
	}
}
@media print , screen and ( min-width : 751px ){
	#pagetitles h1 , #pagetitles h2 , #pagetitle{
		font-size : 4.4rem;
		line-height : 1.2;
	}
	#pagetitles h1::after , #pagetitles h2::after , #pagetitle::after{
		width : 250px;
		height : 3px;
		margin-top : calc( 39px - 4.4px );
	}
}
@media screen and ( max-width : 750px ){
	#pagetitles{
		padding-top : calc( ( 79 - 9 ) * 100vw / 750 );
		padding-bottom : calc( ( 66 - var( --sp-text01-lh ) ) * 100vw / 750 );
	}
	#pagetitles p{
		padding-left : calc( 20 * 100% / 750 );
		padding-right : calc( 20 * 100% / 750 );
		margin-top : calc( ( 49 - var( --sp-text01-lh ) ) * 100vw / 750 );
	}
}
@media print , screen and ( min-width : 751px ){
	#pagetitles{
		padding-top : calc( 64px - 24px - 4.4px );
		padding-bottom : calc( 75px - var( --pc-text01-lh ) );
	}
	#pagetitles p{
		width : 836px;
		margin-top : calc( 37px - var( --pc-text01-lh ) );
		margin-left : auto;
		margin-right : auto;
		text-align : center;
	}
}

/* --------------------------------------------
PAGE TITLE
--------------------------------------------- */
@media screen and ( max-width : 750px ){
	#pagetitle{
		padding-top : calc( ( 79 - 9 ) * 100vw / 750 );
		padding-bottom : calc( var( --sp-pagetitle-pb ) * 100vw / 750 );
	}
}
@media print , screen and ( min-width : 751px ){
	#pagetitle{
		padding-top : calc( 65px - 24px - 4.4px );
		padding-bottom : 90px;
	}
}
@media screen and ( max-width : 750px ){
	.kakeizumemories #pagetitle{
		padding-top : calc( ( 79 - 9 ) * 100vw / 750 );
		padding-bottom : calc( 42 * 100vw / 750 );
		padding-bottom : calc( var( --sp-pagetitle-pb ) * 100vw / 750 );
	}
}
@media print , screen and ( min-width : 751px ){
	.kakeizumemories #pagetitle{
		padding-top : calc( 20px );
		padding-bottom : 0;
	}
}

/* --------------------------------------------
TITLE SERVICE
--------------------------------------------- */
#title-service h1{
	font-family : "Noto Serif JP";
	line-height : 1;
	text-align : center;
}
#title-service h1::after{
	display : block;
	margin-left : auto;
	margin-right : auto;
	font-family : Roboto , sans-serif;
	font-weight : 300;
	border-bottom-color : var( --green );
	border-bottom-style : solid;
}
#title-service p{
	text-align : center;
}
#title-service dt{
	display : flex;
	align-items : center;
	margin-left : auto;
	margin-right : auto;
}
#title-service dt::before , #title-service dt::after{
	flex-grow : 1;
	flex-shrink : 0;
	height : 1px;
	content : "";
	background-color : currentColor;
}
#title-service dt::before{
	margin-right : 1em;
}
#title-service dt::after{
	margin-left : 1em;
}
#title-service .tags ul{
	display : flex;
	justify-content : center;
}
#title-service li{
	display : flex;
	align-items : center;
	justify-content : center;
	background-color : #b7d32f;
}
#title-service li.pink{
	color : #fff;
	background-color : #f29c9f;
}
#title-service li.gold , #title-service .gold{
	color : #fff;
	background-color : #ae9027;
}
#title-service .link{
	display : table;
	margin-left : auto;
	margin-right : auto;
	text-align : center;
}
#title-service .text{
	text-align : center;
}
@media screen and ( max-width : 750px ){
	#title-service{
		padding-top : calc( 79 * 100vw / 750 );
	}
	#title-service h1{
		font-size : 4.2rem;
	}
	#title-service h1::after{
		margin-top : calc( 6.5 * 100vw / 750 );
	}
	#title-service h1::after{
		font-size : 2.4rem;
		line-height : 1.66;
	}
	#title-service h1::after{
		width : calc( 450 * 100% / 710 );
		padding-bottom : calc( ( 25 - 3 - 3 ) * 100vw / 750 );
		border-bottom-width : calc( 6 * 100vw / 750 );
	}
	#title-service .text01{
		margin-top : calc( ( 50 - var( --sp-text01-lh ) ) * 100vw / 750 );
	}
	#title-service dl{
		margin-top : calc( ( 55 - var( --sp-text01-lh ) ) * 100vw / 750 );
	}
	#title-service dt{
		width : calc( 528 * 100% / 710 );
		font-size : 2.4rem;
	}
	#title-service dd + dt{
		margin-top : calc( ( 92 - var( --sp-text01-lh ) ) * 100vw / 750 );
	}
	#title-service .tags{
		margin-top : calc( ( 25 - 10 ) * 100vw / 750 );
		margin-left : calc( -5 * 100% / 710 );
		margin-right : calc( -5 * 100% / 710 );
	}
	#title-service li{
		width : calc( 180 * 100% / 720 );
		height : calc( 50 * 100vw / 750 );
		margin-top : calc( 10 * 100vw / 750 );
		margin-left : calc( 5 * 100% / 720 );
		margin-right : calc( 5 * 100% / 720 );
		font-size : 2.4rem;
	}
	#title-service .link{
		margin-top : calc( 33 * 100vw / 750 );
		font-size : 2.2rem;
	}
	#title-service .text{
		margin-top : calc( ( 33 - var( --sp-text01-lh ) ) * 100vw / 750 );
	}
	#title-service .text{
		font-size : 2.6rem;
		line-height : 2;
	}
}
@media print , screen and ( min-width : 751px ){
	#title-service{
		padding-top : calc( 80px - 24px );
	}
	#title-service h1{
		font-size : 4.4rem;
	}
	#title-service h1::after{
		margin-top : 6.5px;
	}
	#title-service h1::after{
		font-size : 2.2rem;
		line-height : 1.59;
	}
	#title-service h1::after{
		width : 250px;
		padding-bottom : calc( 27px - 6.5px - 6.5px );
		border-bottom-width : 3px;
	}
	#title-service .text01{
		margin-top : calc( 38px - var( --pc-text01-lh ) );
	}
	#title-service dl{
		margin-top : calc( 35px - var( --pc-text01-lh ) );
	}
	#title-service dt{
		width : 352px;
		font-size : 1.6rem;
	}
	#title-service dd + dt{
		margin-top : calc( 62px - var( --pc-text01-lh ) );
	}
	#title-service .tags{
		margin-top : 14px;
	}
	#title-service li{
		width : 100px;
		height : 30px;
		margin-left : 2px;
		margin-right : 2px;
		font-size : 1.6rem;
	}
	#title-service .link{
		margin-top : 21px;
		font-size : 1.6rem;
	}
	#title-service .text{
		font-size : 1.6rem;
		line-height : 2;
	}
	#title-service .text{
		margin-top : calc( 13px - var( --pc-text01-lh ) );
	}
}