@charset "UTF-8";

/* --------------------------------------------
SETTINGS
--------------------------------------------- */
@media screen and ( width <= 750px ){
	:root{
		font-size : calc( 10 * 100vw / var( --breakPoint ) );
	}
}
@media screen and ( 750px < width < 1240px ){
	:root{
		font-size : calc( 10 * 100vw / var( --breakPoint ) );
	}
}
@media print , screen and ( width >= 1240px ){
	:root{
		font-size : 10px;
	}
}
@media screen and ( width <= 750px ){
	body{
		font-size : 2rem;
	}
	body:has( #bannerAutoQuo ){
		padding-bottom : calc( 120 var( --remBase ) );
	}
}
@media print , screen and ( width > 750px ){
	body{
		font-size : 1.6rem;
	}
}

/* --------------------------------------------
CONTAINER
--------------------------------------------- */
@media screen and ( width < 1240px ){
	.container{
		padding-inline : calc( var( --gutter ) var( --viewportBase ) );
	}
}
@media print , screen and ( width >= 1240px ){
	.container{
		width : calc( ( var( --breakPoint ) * 1px ) );
		padding-inline : calc( var( --gutter ) * 1px );
		margin-inline : auto;
	}
}
@media screen and ( width <= 750px ){
	.container-sp{
		padding-inline : calc( var( --gutter ) var( --viewportBase ) );
	}
}
@media screen and ( 750px < width < 1240px ){
	.container-pc{
		padding-inline : calc( var( --gutter ) var( --viewportBase ) );
	}
}
@media print , screen and ( width >= 1240px ){
	.container-pc{
		width : calc( ( var( --breakPoint ) * 1px ) );
		padding-inline : calc( var( --gutter ) * 1px );
		margin-inline : auto;
	}
}

/* --------------------------------------------
WRAPPER
--------------------------------------------- */
@media screen and ( width < 1240px ){
	.wrap{
		padding-inline : calc( var( --gutter ) var( --viewportBase ) );
	}
}
@media print , screen and ( width >= 1240px ){
	.wrap{
		padding-inline : calc( ( 100% - ( var( --wrapperSize ) * 1px ) ) / 2 );
	}
}
@media screen and ( width <= 750px ){
	.wrap-sp{
		padding-inline : calc( var( --gutter ) var( --viewportBase ) );
	}
}
@media screen and ( 750px < width < 1240px ){
	.wrap-pc{
		padding-inline : calc( var( --gutter ) var( --viewportBase ) );
	}
}
@media print , screen and ( width >= 1240px ){
	.wrap-pc{
		padding-inline : calc( ( 100% - ( var( --wrapperSize ) * 1px ) ) / 2 );
	}
}

/* --------------------------------------------
  STATE
  --------------------------------------------- */
@media print , screen and ( width > 750px ){
	.is-sp{
		display : none;
	}
}
@media screen and ( width <= 750px ){
	.is-pc{
		display : none;
	}
}
@media screen and ( width <= 750px ){
	.is-tb{
		display : none;
	}
}
@media print , screen and ( width >= 1240px ){
	.is-tb{
		display : none;
	}
}

/* --------------------------------------------
  ACCESSIBILITY
  --------------------------------------------- */
.visuallyhidden{
	position : absolute;
	width : 1px;
	height : 1px;
	overflow : hidden;
	clip : rect( 0 0 0 0 );
	clip-path : inset( 50% );
	white-space : nowrap;
}

/* --------------------------------------------
  COMMON MODULES
  --------------------------------------------- */
.full{
	width : 100%;
	height : auto;
}
[data-before]::before{
	white-space : pre;
	content : attr( data-before );
}
[data-after]::after{
	white-space : pre;
	content : attr( data-after );
}
@media screen and ( width <= 750px ){
	[data-before-sp]::before{
		white-space : pre;
		content : attr( data-before-sp );
	}
}
[data-both]::before , [data-both]::after{
	white-space : pre;
	content : attr( data-both );
}
@media screen and ( width <= 750px ){
	[data-after-sp]::after{
		white-space : pre;
		content : attr( data-after-sp );
	}
	[data-both-sp]::before , [data-both-sp]::after{
		white-space : pre;
		content : attr( data-both );
	}
}
@media print , screen and ( width > 750px ){
	[data-before-pc]::before{
		white-space : pre;
		content : attr( data-before-pc );
	}
	[data-after-pc]::after{
		white-space : pre;
		content : attr( data-after-pc );
	}
	[data-both-pb]::before , [data-both-pb]::after{
		white-space : pre;
		content : attr( data-both );
	}
}

/* --------------------------------------------
  BR TO SPCE
  --------------------------------------------- */
@media screen and ( width <= 750px ){
	br.sp-space{
		content : "";
	}
	br.sp-space::after{
		content : " ";
	}
}
@media print , screen and ( width > 750px ){
	br.pc-space{
		content : "";
	}
	br.pc-space::after{
		content : " ";
	}
}
@media screen and ( width <= 750px ){
	br.sp-spaceEm{
		content : "";
	}
	br.sp-spaceEm::after{
		content : "　";
	}
}
@media print , screen and ( width > 750px ){
	br.pc-spaceEm{
		content : "";
	}
	br.pc-spaceEm::after{
		content : "　";
	}
}

/* --------------------------------------------
  LH NAGATIVE MARGIN
  --------------------------------------------- */
.lh-up{
	margin-top : calc( ( 1em - 1lh )  / 2 );
}
@media screen and ( width <= 750px ){
	.lh-up-sp{
		margin-top : calc( ( 1em - 1lh )  / 2 );
	}
}
@media print , screen and ( width > 750px ){
	.lh-up-pc{
		margin-top : calc( ( 1em - 1lh )  / 2 );
	}
}

/* --------------------------------------------
HEADER
--------------------------------------------- */
#header{
	position : relative;
	display : grid;
	border-bottom : solid calc( 4 var( --remBase ) ) var( --blue );
}
#header .logo{
	display : grid;
}
#header .logo img{
	grid-row : 1/-1;
	grid-column : 1/-1;
	height : auto;
}
#header .logo span{
	font-weight : 500;
	letter-spacing : .05em;
}
#header .logo span:nth-of-type( 1 ){
	color : #565656;
}
#header .logo span:nth-of-type( 2 ){
	color : #006fcf;
}
@media screen and ( width <= 750px ){
	#header{
		grid-template-rows : calc( 110 var( --remBase ) ) calc( 158 var( --remBase ) );
		grid-template-columns : calc( 25 var( --viewportBase ) ) auto 1fr calc( 140 var( --viewportBase ) ) calc( 25 var( --viewportBase ) );
		height : calc( 272 var( --remBase ) );
	}
	#header .logo{
		grid-template-rows : 1fr auto;
		grid-template-columns : calc( 91 var( --remBase ) ) auto auto;
		grid-row : 1;
		grid-column : 2;
		align-self : center;
	}
	#header .logo img{
		grid-row : 1/-1;
		grid-column : 1/3;
		justify-self : start;
		height : calc( 68 var( --remBase ) );
	}
	#header .logo span:nth-of-type( 1 ){
		grid-row : 2;
		grid-column : 2;
		font-size : 1.5rem;
		line-height : calc( 20.54 / 15 );
	}
	#header .logo span:nth-of-type( 2 ){
		grid-row : 2;
		grid-column : 3;
		font-size : 1.412rem;
		line-height : calc( 20.54 / 14.12 );
	}
}
@media print , screen and ( width > 750px ){
	#header{
		height : calc( 113 var( --remBase ) );
	}
	#header .logo{
		grid-template-rows : calc( 42 var( --remBase ) ) auto auto 1fr;
		grid-template-columns : calc( 72 var( --remBase ) ) 1fr;
		grid-row : 1/-1;
		grid-column : 2;
		align-self : center;
	}
	#header .logo img{
		height : calc( 54 var( --remBase ) );
	}
	#header .logo span{
		white-space : nowrap;
	}
	#header .logo span:nth-of-type( 1 ){
		grid-row : 2;
		grid-column : 2;
		justify-self : end;
		font-size : .9rem;
		line-height : calc( 12.32 / 9 );
	}
	#header .logo span:nth-of-type( 2 ){
		grid-row : 3;
		grid-column : 2;
		font-size : .8470000000000001rem;
	}
}
@media print , screen and ( 750px < width < 2000px ){
	#header{
		grid-template-columns : calc( 20 var( --viewportBase ) ) auto 1fr auto calc( 20 var( --viewportBase ) );
	}
}
@media screen and ( width >= 2000px ){
	#header{
		grid-template-columns : calc( 20 * 100% / 2000 ) auto 1fr auto calc( 20 * 100% / 2000 );
		padding-inline : calc( ( 100% - 2000px ) / 2 );
	}
}

/* --------------------------------------------
NAV
--------------------------------------------- */
@media screen and ( width <= 750px ){
	#nav{
		display : contents;
	}
}
@media print , screen and ( width > 750px ){
	#nav{
		display : grid;
		grid-template-rows : calc( 13 var( --remBase ) ) calc( 8 var( --remBase ) ) calc( 40 var( --remBase ) ) calc( ( 18 - ( 16 * .375 ) ) var( --remBase ) ) auto 1fr;
		grid-column : 4;
		justify-content : end;
	}
	#nav > a{
		grid-row : 2/-1;
		grid-column : 6;
	}
	#nav > a img{
		height : calc( 80 var( --remBase ) );
	}
}
@media print , screen and ( 750px < width < 2000px ){
	#nav{
		grid-template-columns : auto auto calc( 12 var( --remBase ) ) auto calc( 20 var( --remBase ) ) calc( 174 var( --remBase ) );
	}
}
@media screen and ( width >= 2000px ){
	#nav{
		grid-template-columns : auto auto calc( 12 * 100vw / 2000 ) auto calc( 20 * 100vw / 2000 ) calc( 174 * 100vw / 2000 );
	}
}
@media ( hover : hover ){
	#nav > a:hover{
		opacity : .75;
	}
}
@media ( prefers-reduced-motion : no-preference ){
	#nav > a{
		transition : opacity var( --transitionBase );
	}
}
@media print , screen and ( width > 750px ){
	#navLangs{
		display : grid;
		grid-row : 3;
		grid-column : 2;
		grid-auto-flow : column;
		align-items : center;
		align-self : center;
		justify-content : end;
		height : calc( 40 * 100vw / 2000 );
	}
	#navLangs li + li::before{
		white-space : pre;
		content : " / ";
	}
	#navLangs li + li::before , #navLangs a{
		font-size : 1.4rem;
		font-weight : 300;
		line-height : calc( 24 / 14 );
		color : #a2a2a2;
	}
	#navLangs a[aria-current]{
		color : #005c91;
	}
}
@media ( hover : hover ){
	#navLangs a:hover{
		color : #005c91;
	}
}
@media ( prefers-reduced-motion : no-preference ){
	#navLangs a{
		transition : color var( --transitionBase );
	}
}
#navContacts{
	display : grid;
}
#navContacts li{
	height : 100%;
}
#navContacts a{
	display : grid;
	place-items : center;
	height : 100%;
	border-style : solid;
	border-width : 1px;
}
@media screen and ( width <= 750px ){
	#navContacts{
		grid-template-columns : repeat( 2 , calc( 60 * 100% / 140 ) );
		grid-row : 1;
		grid-column : 4;
		align-self : center;
		justify-content : space-between;
		height : calc( 60 var( --remBase ) );
	}
	#navContacts a{
		position : relative;
		font-size : 0;
		color : transparent;
	}
	#navContacts a::before{
		position : absolute;
		inset : 0;
		display : block;
		width : auto;
		margin : auto;
		content : "";
		filter : var( --filterWhite );
		background-repeat : no-repeat;
		background-position : center;
	}
}
@media print , screen and ( width > 750px ){
	#navContacts{
		display : grid;
		grid-template-columns : auto auto;
		grid-row : 3;
		grid-column : 4;
		column-gap : calc( 10 * 100vw / 2000 );
	}
	#navContacts a{
		font-size : 1.4rem;
		font-weight : 300;
		line-height : 1.75;
		color : white;
		text-align : center;
		text-indent : .05em;
		letter-spacing : .05em;
		border-radius : calc( 6 var( --remBase ) );
	}
}
#navAutoQuo a{
	background-color : var( --orange );
	border-color : var( --orange );
}
@media screen and ( width <= 750px ){
	#navAutoQuo a::before{
		height : calc( 27 var( --remBase ) );
		aspect-ratio : 23/27;
		background-image : url( "../../images/multilingual/ui/icon/calculator.svg" );
	}
}
@media print , screen and ( 750px < width < 2000px ){
	#navAutoQuo a{
		padding-left : calc( 22 var( --remBase ) );
		padding-right : calc( 30 var( --remBase ) );
	}
}
@media screen and ( width >= 2000px ){
	#navAutoQuo a{
		padding-left : calc( 22 * 100vw / 2000 );
		padding-right : calc( 30 * 100vw / 2000 );
	}
}
#navContact a{
	background-color : #006fcf;
	border-color : #006fcf;
}
@media screen and ( width <= 750px ){
	#navContact a::before{
		height : calc( 18 var( --remBase ) );
		aspect-ratio : 25/18;
		background-image : url( "../../images/multilingual/ui/icon/email.svg" );
	}
}
@media print , screen and ( 750px < width < 2000px ){
	#navContact a{
		padding-inline : calc( 24 var( --remBase ) );
	}
}
@media screen and ( width >= 2000px ){
	#navContact a{
		padding-inline : calc( 24 * 100vw / 2000 );
	}
}
@media ( hover : hover ){
	:is( #navAutoQuo , #navContact ) a:hover{
		background-color : white;
	}
	#navAutoQuo a:hover{
		color : var( --orange );
	}
	#navContact a:hover{
		color : #006fcf;
	}
}
@media ( prefers-reduced-motion : no-preference ){
	:where( #navAutoQuo , #navContact ) a{
		transition : background var( --transitionBase ) , color var( --transitionBase );
	}
}
#navGlobal{
	display : grid;
}
#navGlobal button{
	display : grid;
	grid-template-columns : auto auto;
	cursor : pointer;
}
#navGlobal button::after{
	display : block;
	width : auto;
	font-size : 0;
	content : "";
	background-repeat : no-repeat;
	background-position : left center;
	background-size : contain;
}
#navGlobal button[aria-expanded="true"]::after{
	rotate : -180deg;
}
@media screen and ( width <= 750px ){
	#navGlobal{
		grid-template-rows : repeat( 2 , calc( 77 var( --remBase ) ) );
		grid-template-columns : repeat( 3 , calc( ( 746 / 3 ) var( --viewportBase ) ) );
		grid-row : 2;
		grid-column : 1/-1;
		row-gap : calc( 2 var( --remBase ) );
		column-gap : calc( 2 var( --viewportBase ) );
		background-color : #e5e5e5;
		border-top : solid calc( 2 var( --remBase ) ) #e5e5e5;
	}
	#navGlobal > li{
		background-color : white;
	}
	#navGlobal > li > a , #navGlobal > li > button{
		display : grid;
		place-items : center;
		width : 100%;
		height : 100%;
		font-size : calc( ( 14 * 1.5 ) var( --remBase ) );
		font-weight : 700;
		color : var( --blue );
		text-align : center;
		text-indent : .08em;
		letter-spacing : .08em;
	}
	#navGlobal button{
		column-gap : calc( ( 3 * 1.5 ) * 100% / ( 746 / 3 ) );
		justify-content : center;
	}
	#navGlobal button::after{
		height : calc( ( 7 ) var( --remBase ) );
		aspect-ratio : 384.15/224.05;
		background-image : url( "../../images/multilingual/ui/arrow/down02.svg" );
		filter : var( --filterBlue );
	}
}
@media print , screen and ( width > 750px ){
	#navGlobal{
		grid-row : 5/-1;
		grid-column : 1/5;
		grid-auto-flow : column;
	}
	#navGlobal > li > :where( a , button ){
		font-size : 1.6rem;
		line-height : 1.75;
	}
	#navGlobal button{
		height : 100%;
	}
	#navGlobal button::after{
		height : calc( 7 var( --remBase ) );
		aspect-ratio : 9/7;
		margin-top : calc( 10.5 var( --remBase ) );
		background-image : url( "../../images/multilingual/ui/arrow/down01.svg" );
		filter : invert( 26% ) sepia( 92% ) saturate( 1419% ) hue-rotate( 188deg ) brightness( 103% ) contrast( 105% );
	}
}
@media print , screen and ( 750px < width < 2000px ){
	#navGlobal{
		column-gap : calc( 20 var( --remBase ) );
	}
	#navGlobal > li > button{
		column-gap : calc( 8 var( --remBase ) );
	}
}
@media screen and ( width >= 2000px ){
	#navGlobal{
		column-gap : calc( 20 * 100vw / 2000 );
	}
	#navGlobal > li > button{
		column-gap : calc( 8 * 100vw / 2000 );
	}
}
@media ( hover : hover ){
	#navGlobal > li > a:hover , #navGlobal > li:has( button ):hover > button{
		color : var( --blue02 );
	}
}
@media ( prefers-reduced-motion : no-preference ){
	#navGlobal > li > :where( a , button ){
		transition : color var( --transitionBase );
	}
}
.navSubMenu{
	position : absolute;
	top : 100%;
	left : 0;
	display : grid;
	grid-template-rows : 0fr;
	grid-template-columns : 1fr;
	width : 100%;
	background-image : linear-gradient( to right , #015384 , #01426b );
}
.navSubMenu[aria-hidden="false"]{
	z-index : 5;
	grid-template-rows : 1fr;
}
.navSubMenu ul{
	display : grid;
	overflow : hidden;
}
.navSubMenu li{
	position : relative;
}
.navSubMenu li::before{
	position : absolute;
	top : 0;
	left : 0;
	width : 1px;
	height : 100%;
	font-size : 0;
	content : "";
	background-color : #5696bc;
}
.navSubMenu h4{
	font-size : 1.6rem;
	font-weight : 700;
	line-height : 1.35;
	color : white;
	text-align : center;
}
.navSubMenu picture{
	display : block;
	width : 100%;
	margin-block : calc( 12 var( --remBase ) );
}
.navSubMenu picture img{
	width : 100%;
	height : 100%;
	object-fit : cover;
	object-position : center;
}
.navSubMenu p{
	padding-bottom : calc( 12 var( --remBase ) );
	font-size : 1.4rem;
	line-height : 1.35;
	color : white;
}
.navSubMenu li > dl{
	border-top : 1px solid #005a8b;
}
.navSubMenu li > dl > dt{
	font-size : 1.4rem;
	font-weight : 700;
	line-height : 1.35;
	color : white;
	text-align : center;
}
.navSubMenu li > dl > dd{
	margin-top : calc( 7 var( --remBase ) );
}
.navSubMenu dl dl{
	display : grid;
	grid-template-rows : calc( 54 var( --remBase ) );
	grid-template-columns : repeat( 2 , 1fr );
	justify-content : space-between;
}
.navSubMenu dl dl > div{
	display : grid;
	grid-auto-flow : row;
	align-content : center;
	justify-content : center;
	font-weight : 700;
	color : white;
	text-align : center;
	background-color : #0075bc;
}
.navSubMenu dl dl dt{
	font-size : 1.3rem;
	line-height : 1.4;
}
.navSubMenu dl dl dd{
	font-size : 2rem;
	line-height : 1.4;
}
.navSubMenu dl dl dd span{
	font-size : 1.3rem;
	line-height : 1.4;
}
.navSubMenu a{
	position : relative;
	display : grid;
	place-items : center;
	height : calc( 40 var( --remBase ) );
	margin-top : calc( 10 var( --remBase ) );
	font-size : 1.4rem;
	font-weight : 700;
	color : #014d7c;
	background-color : white;
	border : solid 1px white;
	border-radius : calc( 5 var( --remBase ) );
}
.navSubMenu a::after{
	position : absolute;
	top : 50%;
	display : block;
	width : auto;
	height : calc( 10 var( --remBase ) );
	aspect-ratio : 224.05/384.15;
	font-size : 0;
	content : "";
	background-image : url( "../../images/multilingual/ui/arrow/right01.svg" );
	filter : invert( 15% ) sepia( 38% ) saturate( 5767% ) hue-rotate( 187deg ) brightness( 99% ) contrast( 99% );
	background-repeat : no-repeat;
	background-position : left center;
	background-size : contain;
	translate : 0 -50%;
}
@media screen and ( width <= 750px ){
	.navSubMenu{
		padding-inline : calc( 10 var( --viewportBase ) );
	}
	.navSubMenu[aria-hidden="false"]{
		padding-block : calc( 10 var( --remBase ) );
	}
	.navSubMenu ul{
		grid-template-columns : repeat( 3 , calc( 100% / 3 ) );
	}
	.navSubMenu li{
		padding-block : calc( 10 var( --remBase ) );
		padding-inline : calc( 5 * 100% / ( 730 / 3 ) );
		border-top : solid 1px #5696bc;
	}
	.navSubMenu li:nth-child( 3n+3 )::after{
		position : absolute;
		top : 0;
		right : 0;
		width : 1px;
		height : 100%;
		font-size : 0;
		content : "";
		background-color : #5696bc;
	}
	.navSubMenu li:nth-child( n+4 ){
		border-bottom : solid 1px #5696bc;
	}
	.navSubMenu picture{
		height : calc( 96 var( --remBase ) );
	}
	.navSubMenu li > dl{
		padding-top : calc( 10 var( --remBase ) );
	}
	.navSubMenu dl dl{
		column-gap : calc( 8 * 100% / ( ( 730 / 3 ) - 10 ) );
	}
	.navSubMenu a::after{
		right : calc( 10 * 100% / ( ( 730 / 3 ) - 10 ) );
	}
}
@media print , screen and ( width > 750px ){
	.navSubMenu[aria-hidden="false"]{
		padding-block : calc( 40 var( --remBase ) );
	}
	.navSubMenu ul{
		grid-template-columns : repeat( 6 , calc( 100% / 6 ) );
	}
	.navSubMenu li{
		display : grid;
		grid-template-rows : subgrid;
		grid-row : span 5;
		padding-inline : calc( 15 * 100% / 200 );
	}
	.navSubMenu li:last-child::after{
		position : absolute;
		top : 0;
		right : 0;
		width : 1px;
		height : 100%;
		font-size : 0;
		content : "";
		background-color : #5696bc;
	}
	.navSubMenu picture{
		height : calc( 70 var( --remBase ) );
	}
	.navSubMenu li > dl{
		padding-top : calc( 12 var( --remBase ) );
	}
	.navSubMenu dl dl{
		column-gap : calc( 8 * 100% / 170 );
	}
	.navSubMenu a::after{
		right : calc( 10 * 100% / 170 );
	}
}
@media screen and ( 750px < width < 1240px ){
	.navSubMenu{
		padding-inline : calc( var( --gutter ) var( --viewportBase ) );
	}
}
@media print , screen and ( width >= 1240px ){
	.navSubMenu{
		padding-inline : calc( ( 100% - ( var( --wrapperSize ) * 1px ) ) / 2 );
	}
}
@media ( hover : hover ){
	.navSubMenu a:hover{
		color : white;
		background-color : #014d7c;
	}
	.navSubMenu a:hover::after{
		filter : var( --filterWhite );
	}
}

/* --------------------------------------------
MV
--------------------------------------------- */
#mv{
	position : relative;
	z-index : 0;
	background-repeat : no-repeat;
	background-position : center top;
	background-size : auto 100%;
}
#mv hgroup{
	color : white;
}
#mv hgroup :where( p , h1 ){
	position : relative;
	letter-spacing : .05em;
}
#mv hgroup :where( p , h1 )::before{
	position : absolute;
	inset : 0;
	display : block;
	text-shadow :  ;
	mix-blend-mode : multiply;
}
@supports (color: color-mix(in lch, red, blue)){
	#mv hgroup :where( p , h1 )::before{
		text-shadow : 0 0 calc( 20 var( --remBase ) ) color-mix( in srgb , #005285 20% , transparent );
	}
}
#mv hgroup p{
	font-weight : 500;
}
#mv hgroup h1{
	font-family : "Bebas Neue" , serif;
	font-weight : 700;
}
#mv > div p{
	display : grid;
	grid-auto-flow : row;
	align-content : center;
	align-items : center;
	justify-content : center;
	color : white;
	text-align : center;
	background-color : #fff;
	background-color : var( --blue );
}
#mv > div p span{
	display : block;
	font-weight : 600;
}
#mv > div a{
	display : grid;
	grid-template-columns : auto auto;
	align-items : center;
	justify-content : space-between;
	font-weight : 500;
	color : white;
	letter-spacing : .05em;
	background-color : var( --orange );
	border : solid 1px var( --orange );
}
#mv > div a::after{
	display : block;
	width : auto;
	aspect-ratio : 21.5744/35.9737;
	margin-top : calc( 6 var( --remBase ) );
	font-size : 0;
	content : "";
	background-image : url( "../../images/multilingual/ui/arrow/right01.svg" );
	filter : var( --filterWhite );
	background-repeat : no-repeat;
	background-position : left center;
	background-size : contain;
}
#mv > p > span{
	font-weight : 600;
	letter-spacing : .05em;
}
#mv > p > span:nth-of-type( 1 ){
	display : grid;
	place-items : center;
	color : var( --blue );
	text-indent : .05em;
	background-color : white;
}
#mv > p span:nth-of-type( 2 ){
	position : relative;
	display : block;
	width : fit-content;
	color : white;
}
#mv > p span:nth-of-type( 2 )::before{
	position : absolute;
	inset : 0;
	display : block;
	text-shadow : 0 0 calc( 3 var( --remBase ) ) black;
	mix-blend-mode : multiply;
}
@media screen and ( width <= 750px ){
	#mv{
		height : calc( 650 var( --remBase ) );
		padding-top : calc( 53 var( --remBase ) );
		background : image-set( url( "../../images/multilingual/top/mv/bg_sp.avif" ) type( "image/avif" ) , url( "../../images/multilingual/top/mv/bg_sp.webp" ) type( "image/webp" ) ) center / auto 100% no-repeat;
	}
	#mv hgroup :where( p , h1 ){
		margin-inline : auto;
		text-align : center;
		text-indent : .05em;
	}
	#mv hgroup p{
		font-size : 3.2rem;
	}
	#mv hgroup h1{
		margin-top : calc( 4 var( --remBase ) );
		font-size : 10.3rem;
	}
	#mv > div{
		width : calc( 320 var( --viewportBase ) );
		margin-top : calc( 148 var( --remBase ) );
		margin-left : auto;
		margin-right : calc( 64 var( --viewportBase ) );
	}
	#mv > div p{
		height : calc( 115 var( --remBase ) );
	}
	#mv > div p span:nth-of-type( 1 ){
		font-size : 3.7909999999999995rem;
		line-height : calc( 41.16 / 37.91 );
	}
	#mv > div p span:nth-of-type( 2 ){
		font-size : 3.033rem;
		line-height : calc( 41.16 / 30.33 );
	}
	#mv > div a{
		height : calc( 64 var( --remBase ) );
		padding-left : calc( 32 * 100% / 320 );
		padding-right : calc( 32 * 100% / 320 );
		margin-top : calc( 10 var( --remBase ) );
		font-size : 2.8rem;
	}
	#mv > div a::after{
		height : calc( 20 var( --remBase ) );
	}
	#mv > p{
		width : calc( 320 var( --viewportBase ) );
		margin-top : calc( 33 var( --remBase ) );
		margin-left : auto;
		margin-right : calc( 64 var( --viewportBase ) );
	}
	#mv > p > span:nth-of-type( 1 ){
		height : calc( 16 var( --remBase ) );
		font-size : 1.559rem;
	}
	#mv > p > span:nth-of-type( 2 ){
		margin-top : calc( ( 6 - 5.25 ) var( --remBase ) );
		font-size : 1.4rem;
		line-height : 1.75;
	}
}
@media print , screen and ( width > 750px ){
	#mv{
		display : grid;
		grid-template-rows : auto calc( ( 46 - 15 ) var( --remBase ) ) calc( 119 var( --remBase ) ) 1fr;
		grid-template-columns : 1fr auto calc( 251 var( --percentBase ) ) calc( 117 var( --percentBase ) );
		height : calc( 500 var( --remBase ) );
		padding-top : calc( 100 var( --remBase ) );
	}
	#mv hgroup{
		grid-row : 1;
		grid-column : 2/4;
	}
	#mv hgroup::before{
		position : absolute;
		inset : 0;
		z-index : -1;
		display : block;
		font-size : 0;
		content : "";
		background : image-set( url( "../../images/multilingual/top/mv/bg_pc.avif" ) type( "image/avif" ) , url( "../../images/multilingual/top/mv/bg_pc.webp" ) type( "image/webp" ) ) center / auto 100% no-repeat;
	}
	#mv hgroup :where( p , h1 ){
		width : fit-content;
	}
	#mv hgroup p{
		font-size : 3.2rem;
	}
	#mv hgroup h1{
		font-size : 10.3rem;
	}
	#mv > div{
		grid-row : 3/-1;
		grid-column : 3;
		align-self : start;
	}
	#mv > div p{
		height : calc( 90 var( --remBase ) );
	}
	#mv > div p span:nth-of-type( 1 ){
		font-size : 3.223rem;
	}
	#mv > div p span:nth-of-type( 2 ){
		font-size : 2.375rem;
		line-height : calc( 32.23 / 23.75 );
	}
	#mv > div a{
		height : calc( 50 var( --remBase ) );
		padding-left : calc( 20 * 100% / 251 );
		padding-right : calc( 18 * 100% / 251 );
		margin-top : calc( 8 var( --remBase ) );
		font-size : 2rem;
	}
	#mv > div a::after{
		height : calc( 16 var( --remBase ) );
	}
	#mv > p{
		grid-row : 4/-1;
		grid-column : 2;
		align-self : start;
		justify-self : start;
	}
	#mv > p > span:nth-of-type( 1 ){
		height : calc( 16 var( --remBase ) );
		font-size : 1.559rem;
	}
	#mv > p > span:nth-of-type( 2 ){
		font-size : 1.4rem;
		line-height : 1.75;
	}
}
@media screen and ( width > 1600px ){
	#mv{
		overflow-y : clip;
	}
	#mv::before , #mv::after{
		position : absolute;
		inset : 0;
		z-index : -2;
		display : block;
		font-size : 0;
		content : "";
		background-image : image-set( url( "../../images/multilingual/top/mv/bg_pc.avif" ) type( "image/avif" ) , url( "../../images/multilingual/top/mv/bg_pc.webp" ) type( "image/webp" ) );
		filter : blur( 20.8px );
		background-repeat : no-repeat;
		background-position-y : top;
		background-size : auto 100%;
	}
	#mv::before{
		background-position-x : 0;
	}
	#mv::after{
		background-position-x : 100%;
	}
}
@media ( hover : hover ){
	#mv a:hover{
		color : var( --orange );
		background-color : white;
	}
	#mv a:hover::after{
		filter : var( --filterOrange );
	}
}
@media ( prefers-reduced-motion : no-preference ){
	#mv a{
		transition : color var( --transitionBase ) , background var( --transitionBase );
	}
	#mv a::after{
		transition : filter var( --transitionBase );
	}
}

/* --------------------------------------------
MV RATE
--------------------------------------------- */
#mvRate{
	position : relative;
	overflow-x : clip;
	background-repeat : no-repeat;
	background-position : center top;
	background-size : auto 100%;
}
#mvRate::after{
	position : absolute;
	display : block;
	width : auto;
	content : "";
	background-repeat : no-repeat;
	background-position : 0 0;
	background-size : contain;
}
#mvRate p span{
	display : block;
	font-weight : 600;
	text-align : center;
}
#mvRate p span:nth-of-type( 1 ){
	color : #006fcf;
}
#mvRate p span:nth-of-type( 2 ){
	color : #003e62;
	text-align : center;
	text-indent : -.01em;
	letter-spacing : -.01em;
}
#mvRate h1{
	display : grid;
	align-items : end;
	justify-content : center;
	margin-inline : auto;
	font-family : "Bebas Neue" , serif;
	font-weight : 400;
	color : var( --orange );
	text-align : center;
	text-indent : .01em;
	letter-spacing : .01em;
	border-color : var( --orange );
	border-style : solid;
}
@media screen and ( width <= 750px ){
	#mvRate{
		height : calc( 726 var( --remBase ) );
		padding-top : calc( ( 71 - 2 ) var( --remBase ) );
		background-image : image-set( url( "../../images/multilingual/rate/bg_mv_sp.avif" ) type( "image/avif" ) , url( "../../images/multilingual/rate/bg_mv_sp.webp" ) type( "image/webp" ) );
	}
	#mvRate::after{
		top : calc( 361 var( --remBase ) );
		left : 0;
		height : calc( 255 var( --remBase ) );
		aspect-ratio : 750/255;
		background-image : image-set( url( "../../images/multilingual/rate/handshake_sp.avif" ) type( "image/avif" ) , url( "../../images/multilingual/rate/handshake_sp.webp" ) type( "image/webp" ) );
	}
	#mvRate p span{
		font-size : 5rem;
		line-height : calc( 54 / 50 );
	}
	#mvRate h1{
		width : calc( 530 var( --percentBase ) );
		height : calc( 410 var( --remBase ) );
		padding-bottom : calc( ( 27 - 7 ) var( --remBase ) );
		margin-top : calc( ( 36 - 2 ) var( --remBase ) );
		font-size : 5.2rem;
		border-width : calc( 30 var( --remBase ) );
	}
}
@media print , screen and ( width > 750px ){
	#mvRate{
		height : calc( 630 var( --remBase ) );
		padding-top : calc( ( 63 + 1.5 ) var( --remBase ) );
		background-image : image-set( url( "../../images/multilingual/rate/bg_mv_pc.avif" ) type( "image/avif" ) , url( "../../images/multilingual/rate/bg_mv_pc.webp" ) type( "image/webp" ) );
	}
	#mvRate::after{
		top : calc( 218 var( --remBase ) );
		left : 50%;
		width : auto;
		height : calc( 298 var( --remBase ) );
		aspect-ratio : 1198/298;
		background-image : image-set( url( "../../images/multilingual/rate/handshake_pc.avif" ) type( "image/avif" ) , url( "../../images/multilingual/rate/handshake_pc.webp" ) type( "image/webp" ) );
		translate : -50% 0;
	}
	#mvRate p span{
		font-size : 5rem;
		line-height : calc( 47 / 50 );
	}
	#mvRate h1{
		width : calc( 500 var( --percentBase ) );
		height : calc( 410 var( --remBase ) );
		padding-bottom : calc( 27 var( --remBase ) );
		margin-top : calc( ( 69 - 1.5 ) var( --remBase ) );
		font-size : 5.2rem;
		border-width : calc( 30 var( --remBase ) );
	}
}

/* --------------------------------------------
BREADCRUMBS
--------------------------------------------- */
#breadcrumbs ol{
	display : flex;
	flex-wrap : wrap;
}
#breadcrumbs ol > li:not( :last-child )::after{
	white-space : pre;
	content : " > ";
}
#breadcrumbs ol a , #breadcrumbs ol li:not( :last-child )::after , #breadcrumbs ol li:last-child{
	letter-spacing : .1em;
}
#breadcrumbs ol a{
	color : var( --blue );
	-webkit-text-decoration : underline;
	text-decoration : underline;
	text-decoration-color : transparent;
}
@media screen and ( width <= 750px ){
	#breadcrumbs{
		padding-top : calc( 10 var( --remBase ) );
		padding-bottom : calc( 14 var( --remBase ) );
	}
	#breadcrumbs a , #breadcrumbs li:not( :last-child )::after , #breadcrumbs li:last-child{
		font-size : 1.6rem;
		line-height : 1.4;
	}
}
@media print , screen and ( width > 750px ){
	#breadcrumbs{
		padding-top : calc( 10 var( --remBase ) );
		padding-bottom : calc( 30 var( --remBase ) );
	}
	#breadcrumbs a , #breadcrumbs li:not( :last-child )::after , #breadcrumbs li:last-child{
		font-size : 1.4rem;
		line-height : 1.5;
	}
}
@media ( hover : hover ){
	#breadcrumbs a:hover{
		text-decoration-color : currentColor;
	}
}
@media ( prefers-reduced-motion : no-preference ){
	#breadcrumbs a{
		transition : text-decoration var( --transitionBase );
	}
}

/* --------------------------------------------
COLUMN
--------------------------------------------- */
@media print , screen and ( width > 750px ){
	#column{
		display : grid;
		align-items : start;
		justify-content : space-between;
		padding-top : calc( ( 57 - 5 ) var( --remBase ) );
	}
}
@media screen and ( 750px < width < 1240px ){
	#column{
		grid-template-columns : calc( 20 var( --viewportBase ) ) calc( 930 var( --viewportBase ) ) calc( 30 var( --viewportBase ) ) calc( 240 var( --viewportBase ) ) calc( 20 var( --viewportBase ) );
	}
}
@media print , screen and ( width >= 1240px ){
	#column{
		grid-template-columns : 1fr 930px 30px 240px 1fr;
	}
}
@media print , screen and ( width > 750px ){
	#column > section:not( #says ){
		grid-column : 2;
	}
}
@media print , screen and ( width > 750px ){
	.disflex > #sidebar{
		width : calc( 240 * 100% / 1200 );
	}
}