@charset "UTF-8";

/* --------------------------------------------
TITLE
--------------------------------------------- */
.title-home{
	font-weight : 900;
	line-height : 1.2;
}
.title-home[data-en]::before{
	position : absolute;
	z-index : 0;
	z-index : -1;
	line-height : 1;
	letter-spacing : .05em;
	content : attr( data-en );
}
@media screen and ( max-width : 750px ){
	.title-home{
		font-size : 7rem;
	}
	.title-home[data-en]::before{
		font-size : 20rem;
	}
}
@media print , screen and ( min-width : 750.02px ){
	.title-home[data-en]::before{
		writing-mode : vertical-rl;
	}
}
@media screen and ( min-width : 750.02px ) and ( max-width : 1240px ){
	.title-home{
		font-size : 3rem;
	}
	.title-home::before{
		font-size : 20rem;
	}
}
@media print , screen and ( min-width : 1240.02px ){
	.title-home::before{
		font-size : 26rem;
	}
}

/* --------------------------------------------
LINK
--------------------------------------------- */
.more{
	position : relative;
	display : block;
	display : grid;
	grid-template-columns : auto auto;
	align-items : center;
	width : fit-content;
	margin-left : auto;
	overflow : hidden;
	font-family : Roboto Flex;
	font-weight : 700;
	letter-spacing : .05em;
}
.more::before{
	position : absolute;
	bottom : 0;
	left : 0;
	display : block;
	width : 100%;
	font-size : 0;
	content : "";
	background-color : currentColor;
}
.more::after{
	aspect-ratio : 1;
	font-size : 0;
	content : "";
	background : url( "../images/ui/arrow/right01.svg" ) center / contain no-repeat;
}
@media screen and ( max-width : 750px ){
	.more{
		column-gap : calc( 57 var( --remBase ) );
		padding-bottom : calc( 3 var( --remBase ) );
		padding-left : calc( 2 var( --remBase ) );
		font-size : 3rem;
	}
	.more::after{
		height : calc( 36 var( --remBase ) );
	}
	.more::before{
		height : calc( 2 var( --remBase ) );
	}
}
@media screen and ( min-width : 750.02px ) and ( max-width : 1240px ){
	.more{
		column-gap : calc( 65 var( --remBase ) );
		padding-bottom : calc( 3 var( --remBase ) );
		padding-left : calc( 22 var( --remBase ) );
		padding-right : calc( 12 var( --remBase ) );
		font-size : 2.4rem;
	}
	.more::after{
		height : calc( 36 var( --remBase ) );
	}
	.more::before{
		height : calc( 3 var( --remBase ) );
	}
}
@media print , screen and ( min-width : 1240.02px ){
	.more{
		column-gap : calc( 56 var( --remBase ) );
		padding-bottom : calc( 7 var( --remBase ) );
		padding-left : calc( 7 var( --remBase ) );
		padding-right : calc( 5 var( --remBase ) );
		font-size : 3.5rem;
	}
	.more::after{
		height : calc( 24 var( --remBase ) );
	}
	.more::before{
		height : calc( 2 var( --remBase ) );
	}
}
@media ( hover : hover ){
	.more:hover::before{
		animation : more .6s;
	}
}
@keyframes more{
	0%{
		opacity : 100;
		translate : 0 0;
	}
	25%{
		opacity : 0;
		translate : -100% 0;
	}
	25.1%{
		opacity : 1;
	}
	100%{
		translate : 0 0;
	}
}

/* --------------------------------------------
NEWS
--------------------------------------------- */
#news{
	position : relative;
	overflow : hidden;
}
#news .title-home::first-letter{
	color : var( --b );
}
#news .title-home[data-en]::before{
	color : rgb( 49 59 149 / .1 );
}
#news > ul > li + li{
	border-top-color : #dcd5d5;
	border-top-style : solid;
}
#news > ul > li > a{
	display : grid;
}
#news a > picture{
	width : 100%;
}
#news a > picture img{
	width : 100%;
	height : 100%;
	object-fit : cover;
}
#news a > .tags{
	display : flex;
	flex-wrap : wrap;
}
#news a > .tags > li:not( .accepting ){
	display : grid;
	place-items : center;
	color : #fff;
	text-align : center;
	text-indent : .05em;
	letter-spacing : .05em;
	background : var( --bg );
}
#news a > h3{
	font-weight : 900;
	line-height : 1.5;
	-webkit-text-decoration : underline;
	text-decoration : underline;
	letter-spacing : .05em;
}
#news .excerpt{
	letter-spacing : .05em;
}
#news .excerpt > *{
	letter-spacing : .05em;
}
@media screen and ( max-width : 750px ){
	#news{
		padding-top : calc( ( 115 - ( 13 * 2 / 3 ) ) var( --remBase ) );
		padding-bottom : calc( 90 var( --remBase ) );
	}
	#news .title-home[data-en]::before{
		top : calc( ( -13 - ( 45 * 2 / 3 ) ) var( --remBase ) );
		left : calc( ( 187 - 16 ) var( --viewportBase ) - .05em );
	}
	#news > ul{
		margin-top : calc( ( 56 + ( 13 * 1 / 3 ) ) var( --remBase ) );
	}
	#news > ul > li + li{
		padding-top : calc( 68 var( --remBase ) );
		margin-top : calc( ( 68 - 8.4 ) var( --remBase ) );
		border-top-width : calc( 4 var( --remBase ) );
	}
	#news > ul > li > a{
		grid-template-rows : auto calc( ( 23 - 4 ) var( --remBase ) ) auto 1fr calc( ( 29 - 8.4 ) var( --remBase ) ) auto;
		grid-template-columns : calc( 200 * 100% / 702 ) 1fr;
		column-gap : calc( 9 * 100% / 702 );
	}
	#news a > picture{
		grid-row : 1/5;
		grid-column : 1;
		height : calc( 200 var( --remBase ) );
	}
	#news .tags{
		grid-row : 1;
		grid-column : 2;
		row-gap : calc( 8 var( --remBase ) );
		column-gap : calc( 8 * 100% / 493 );
	}
	#news .tags > li:not( .accepting ){
		min-width : calc( 132 * 100% / 493 );
		height : calc( 36 var( --remBase ) );
		padding-inline : calc( 13 var( --remBase ) );
		font-size : 2.2rem;
	}
	#news .tags .accepting{
		margin-top : calc( -12 var( --remBase ) );
	}
	#news .tags .accepting img{
		height : calc( 48 var( --remBase ) );
	}
	#news a > h3{
		grid-row : 3;
		grid-column : 2;
		font-size : 4rem;
		text-underline-offset : calc( 8 var( --remBase ) );
	}
	#news .excerpt{
		grid-row : 6;
		grid-column : 1/3;
		font-size : calc( 24 var( --remBase ) );
		line-height : calc( 40.8 / 24 );
	}
	#news .excerpt > *{
		font-size : calc( 24 var( --remBase ) );
		line-height : calc( 40.8 / 24 );
	}
	#news .more{
		margin-top : calc( ( 59 - 8.4 ) var( --remBase ) );
	}
}
@media print , screen and ( min-width : 750.02px ){
	#news{
		display : grid;
		grid-template-rows : auto auto;
		align-items : start;
	}
	#news h2{
		grid-row : 1;
		grid-column : 1;
	}
	#news > ul{
		grid-row : 1;
		grid-column : 2;
	}
	#news > ul > li + li{
		border-top-width : 1px;
	}
	#news > ul > li > a{
		align-items : start;
	}
	#news a > picture{
		grid-row : 1/7;
		grid-column : 1;
		align-self : start;
	}
	#news .tags{
		grid-row : 1;
		grid-column : 2;
	}
	#news a > h3{
		grid-row : 3;
		grid-column : 2;
	}
	#news .excerpt{
		grid-row : 5/7;
		grid-column : 2;
	}
	#news .more{
		grid-row : 2;
		grid-column : 1/3;
		justify-self : end;
	}
}
@media screen and ( min-width : 750.02px ) and ( max-width : 1240px ){
	#news{
		grid-template-columns : calc( 200 var( --percentBase ) ) 1fr;
		row-gap : calc( ( 40 - 5.6 ) var( --remBase ) );
		padding-top : calc( 37 var( --remBase ) );
		padding-bottom : calc( 68 var( --remBase ) );
	}
	#news .title-home{
		margin-top : calc( ( -5 * 2 / 3 ) var( --remBase ) - .1em );
	}
	#news .title-home[data-en]::before{
		top : calc( -23 var( --remBase ) );
		left : calc( ( -58 * 1 / 3 ) var( --percentBase ) );
	}
	#news > ul > li + li{
		padding-top : calc( 22 var( --remBase ) );
		margin-top : calc( ( 22 - 5.6 ) var( --remBase ) );
	}
	#news > ul > li > a{
		grid-template-rows : auto calc( ( 18 - 2.6 ) var( --remBase ) ) auto calc( 10 var( --remBase ) ) auto 1fr;
		grid-template-columns : calc( 180 * 100% / 960 ) 1fr;
		column-gap : calc( 20 * 100% / 960 );
	}
	#news a > picture{
		height : calc( 180 var( --remBase ) );
	}
	#news .tags{
		row-gap : calc( 5 var( --remBase ) );
		column-gap : calc( 5 * 100% / 780 );
	}
	#news .tags > li:not( .accepting ){
		min-width : calc( 100 * 100% / 780 );
		height : calc( 25 var( --remBase ) );
		padding-inline : calc( 13 var( --remBase ) );
		font-size : 1.4rem;
	}
	#news .tags .accepting{
		margin-top : calc( -13 var( --remBase ) );
	}
	#news .tags .accepting img{
		height : calc( 38 var( --remBase ) );
	}
	#news a > h3{
		font-size : 2.6rem;
		text-underline-offset : calc( 10 var( --remBase ) );
	}
	#news .excerpt{
		font-size : 16px;
		line-height : 1.7;
	}
	#news .excerpt > *{
		font-size : 16px;
		line-height : 1.7;
	}
}
@media print , screen and ( min-width : 1240.02px ){
	#news{
		grid-template-columns : calc( 320 var( --percentBase ) ) 1fr;
		row-gap : calc( 54 var( --remBase ) );
		padding-top : calc( 100 var( --remBase ) );
		padding-bottom : calc( 91 var( --remBase ) );
	}
	#news .title-home{
		margin-top : calc( ( -11 * 2 / 3 ) var( --remBase ) - .1em );
		font-size : 6rem;
	}
	#news .title-home[data-en]::before{
		top : calc( -23 var( --remBase ) );
	}
	#news > ul > li + li{
		padding-top : calc( 30 var( --remBase ) );
		margin-top : calc( ( 30 - 6.3 ) var( --remBase ) );
	}
	#news > ul > li > a{
		grid-template-rows : auto calc( ( 15 - 3 ) var( --remBase ) ) auto calc( 10 var( --remBase ) ) auto 1fr;
		grid-template-columns : calc( 270 * 100% / 1560 ) 1fr;
		column-gap : calc( 30 * 100% / 1560 );
	}
	#news a > picture{
		height : calc( 251 var( --remBase ) );
	}
	#news .tags{
		row-gap : calc( 5 var( --remBase ) );
		column-gap : calc( 5 * 100% / 1260 );
	}
	#news .tags > li:not( .accepting ){
		min-width : calc( 100 * 100% / 1260 );
		height : calc( 25 var( --remBase ) );
		padding-inline : calc( 10 var( --remBase ) );
		font-size : 1.6rem;
	}
	#news .tags .accepting{
		margin-top : calc( -13 var( --remBase ) );
	}
	#news .tags .accepting img{
		height : calc( 38 var( --remBase ) );
	}
	#news a > h3{
		font-size : 3rem;
		text-underline-offset : calc( 10 var( --remBase ) );
	}
	#news .excerpt{
		font-size : 18px;
		line-height : 1.7;
	}
	#news .excerpt > *{
		font-size : 18px;
		line-height : 1.7;
	}
}
@media print , screen and ( min-width : 1240.02px ) and ( max-width : 2000px ){
	#news .title-home[data-en]::before{
		left : calc( ( -58 * 1 / 3 ) var( --percentBase ) );
	}
}
@media print , screen and ( min-width : 2000.02px ){
	#news .title-home[data-en]::before{
		left : calc( 50% - ( 940 + 40 + 8 + 9 ) var( --percentBase ) - ( ( 58 * 1 / 3 ) var( --percentBase ) ) );
	}
}
@media ( hover : hover ){
	#news a{
		transition : opacity var( --transitionBase );
	}
	#news h3{
		transition : text-decoration-color var( --transitionBase );
	}
	#news li a:hover{
		opacity : .8;
	}
	#news li a:hover h3{
		text-decoration-color : transparent;
	}
}

/* --------------------------------------------
ACTIVITIES
--------------------------------------------- */
#activities{
	position : relative;
	z-index : 1;
	overflow : hidden;
	background : url( "../images/ui/bg/bg01.webp" ) 0 0 repeat;
}
#activities .title-home::first-letter{
	color : var( --c );
}
#activities .title-home[data-en]::before{
	color : white;
}
#activities > ul > li + li{
	border-top-color : #dcd5d5;
	border-top-style : solid;
}
#activities > ul > li > a{
	display : grid;
}
#activities picture{
	width : 100%;
}
#activities picture img{
	width : 100%;
	height : 100%;
	object-fit : cover;
}
#activities .tags{
	display : flex;
	flex-wrap : wrap;
}
#activities .tags li{
	display : grid;
	place-items : center;
	color : #fff;
	text-align : center;
	text-indent : .05em;
	letter-spacing : .05em;
	background : var( --bg );
}
#activities h3{
	font-weight : 900;
	line-height : 1.5;
	-webkit-text-decoration : underline;
	text-decoration : underline;
	letter-spacing : .05em;
}
#activities .excerpt{
	letter-spacing : .05em;
}
@media screen and ( max-width : 750px ){
	#activities{
		padding-top : calc( ( 98 - 7 ) var( --remBase ) );
		padding-bottom : calc( 155 var( --remBase ) );
	}
	#activities .title-home[data-en]::before{
		top : calc( ( -19 - ( 45 * 2 / 3 ) ) var( --remBase ) );
		left : calc( 56 var( --viewportBase ) );
	}
	#activities > ul{
		margin-top : calc( ( 71 - 7 ) var( --remBase ) );
	}
	#activities > ul > li + li{
		padding-top : calc( 34 var( --remBase ) );
		margin-top : calc( ( 34 - 8.4 ) var( --remBase ) );
		border-top-width : calc( 4 var( --remBase ) );
	}
	#activities > ul > li > a{
		grid-template-rows : auto calc( ( 23 - 4 ) var( --remBase ) ) auto 1fr calc( ( 24 - 8.4 ) var( --remBase ) ) auto;
		grid-template-columns : calc( 200 * 100% / 702 ) 1fr;
		column-gap : calc( 10 * 100% / 702 );
	}
	#activities picture{
		grid-row : 1/5;
		grid-column : 1;
		height : calc( 200 var( --remBase ) );
	}
	#activities .tags{
		grid-row : 1;
		grid-column : 2;
		row-gap : calc( 8 var( --remBase ) );
		column-gap : calc( 10 * 100% / 492 );
	}
	#activities .tags > li{
		min-width : calc( 102 * 100% / 492 );
		height : calc( 36 var( --remBase ) );
		padding-inline : calc( 12 var( --remBase ) );
		font-size : 2.2rem;
	}
	#activities h3{
		grid-row : 3;
		grid-column : 2;
		font-size : 4rem;
		text-underline-offset : calc( 8 var( --remBase ) );
	}
	#activities .excerpt{
		grid-row : 6;
		grid-column : 1/3;
		font-size : calc( 24 var( --remBase ) );
		line-height : calc( 40.8 / 24 );
	}
	#activities .more{
		margin-top : calc( ( 55 - 4 ) var( --remBase ) );
	}
}
@media print , screen and ( min-width : 750.02px ){
	#activities{
		display : grid;
		grid-template-rows : auto auto;
		align-items : start;
	}
	#activities h2{
		grid-row : 1;
		grid-column : 1;
	}
	#activities > ul{
		grid-row : 1;
		grid-column : 2;
	}
	#activities > ul > li + li{
		border-top-width : 1px;
	}
	#activities > ul > li > a{
		align-items : start;
	}
	#activities picture{
		grid-row : 1/7;
		grid-column : 1;
		align-self : start;
	}
	#activities .tags{
		grid-row : 1;
		grid-column : 2;
	}
	#activities h3{
		grid-row : 3;
		grid-column : 2;
	}
	#activities .excerpt{
		grid-row : 5/7;
		grid-column : 2;
	}
	#activities .more{
		grid-row : 2;
		grid-column : 1/3;
		justify-self : end;
	}
}
@media screen and ( min-width : 750.02px ) and ( max-width : 1240px ){
	#activities{
		grid-template-columns : calc( 200 var( --percentBase ) ) 1fr;
		row-gap : calc( 32 var( --remBase ) );
		padding-top : calc( 67 var( --remBase ) );
		padding-bottom : calc( 63 var( --remBase ) );
	}
	#activities .title-home{
		margin-top : calc( -3 var( --remBase ) );
	}
	#activities .title-home[data-en]::before{
		top : 0;
		left : calc( ( -58 * 1 / 3 ) var( --percentBase ) );
	}
	#activities > ul > li + li{
		padding-top : calc( 16 var( --remBase ) );
		margin-top : calc( 16 var( --remBase ) );
	}
	#activities > ul > li > a{
		grid-template-rows : auto calc( ( 22 - 2.6 ) var( --remBase ) ) auto calc( 10 var( --remBase ) ) auto 1fr;
		grid-template-columns : calc( 180 * 100% / 960 ) 1fr;
		column-gap : calc( 20 * 100% / 960 );
	}
	#activities picture{
		height : calc( 180 var( --remBase ) );
	}
	#activities .tags{
		row-gap : calc( 5 var( --remBase ) );
		column-gap : calc( 5 * 100% / 780 );
	}
	#activities .tags > li{
		min-width : calc( 100 * 100% / 780 );
		height : calc( 25 var( --remBase ) );
		padding-inline : calc( 16 var( --remBase ) );
		font-size : 1.4rem;
	}
	#activities h3{
		font-size : 2.6rem;
		text-underline-offset : .2em;
	}
	#activities .excerpt{
		font-size : 16px;
		line-height : 1.7;
	}
}
@media print , screen and ( min-width : 1240.02px ){
	#activities{
		grid-template-columns : calc( 320 var( --percentBase ) ) 1fr;
		row-gap : calc( 74 var( --remBase ) );
		padding-top : calc( 102 var( --remBase ) );
		padding-bottom : calc( 92 var( --remBase ) );
	}
	#activities .title-home{
		margin-top : calc( -5.5 var( --remBase ) );
		font-size : 5.5rem;
	}
	#activities .title-home[data-en]::before{
		top : 0;
	}
	#activities > ul{
		display : grid;
		grid-template-columns : repeat( 2 , calc( 750 * 100% / 1560 ) );
		row-gap : calc( 56 var( --remBase ) );
		column-gap : calc( 60 * 100% / 1560 );
	}
	#activities > ul > li:nth-child( n+3 ){
		padding-top : calc( 22 var( --remBase ) );
		margin-top : calc( 22 var( --remBase ) );
	}
	#activities > ul > li > a{
		grid-template-rows : auto calc( ( 18 - 3 ) var( --remBase ) ) auto calc( 10 var( --remBase ) ) auto 1fr;
		grid-template-columns : calc( 270 * 100% / 750 ) 1fr;
		column-gap : calc( 30 * 100% / 750 );
	}
	#activities picture{
		height : calc( 270 var( --remBase ) );
	}
	#activities .tags{
		row-gap : calc( 5 var( --remBase ) );
		column-gap : calc( 5 * 100% / 450 );
	}
	#activities .tags > li{
		min-width : calc( 100 * 100% / 450 );
		height : calc( 25 var( --remBase ) );
		padding-inline : calc( 7 var( --remBase ) );
		font-size : 1.6rem;
	}
	#activities h3{
		font-size : 3rem;
		text-underline-offset : .2em;
	}
	#activities .excerpt{
		font-size : 18px;
		line-height : 1.7;
	}
}
@media print , screen and ( min-width : 1240.02px ) and ( max-width : 2000px ){
	#activities .title-home[data-en]::before{
		left : calc( ( -58 * 1 / 3 ) var( --percentBase ) );
	}
}
@media print , screen and ( min-width : 2000.02px ){
	#activities .title-home[data-en]::before{
		left : calc( 50% - ( 940 + 40 + 6 ) var( --percentBase ) - ( 58 * 1 / 3 ) var( --percentBase ) );
	}
}
@media ( hover : hover ){
	#activities a{
		transition : opacity var( --transitionBase );
	}
	#activities h3{
		transition : text-decoration-color var( --transitionBase );
	}
	#activities li a:hover{
		opacity : .8;
	}
	#activities li a:hover h3{
		text-decoration-color : transparent;
	}
}

/* --------------------------------------------
HISTORY
--------------------------------------------- */
#history{
	background-repeat : no-repeat;
	background-position : center;
	background-size : cover;
}
#history > p{
	font-weight : 800;
	line-height : 1.2;
	color : white;
	letter-spacing : .05em;
}
#history li{
	display : grid;
	background-color : rgb( 255 255 255 / .9 );
}
#history picture{
	grid-row : 1/6;
	grid-column : 1;
	align-self : start;
	aspect-ratio : 1;
}
#history picture img{
	width : 100%;
	height : 100%;
	object-fit : cover;
}
#history h3{
	grid-row : 2;
	grid-column : 2;
	font-weight : 900;
	line-height : 1.2;
	letter-spacing : .05em;
}
#history li p{
	grid-row : 4/6;
	grid-column : 2;
	letter-spacing : .05em;
}
@media screen and ( max-width : 750px ){
	#history{
		padding-top : calc( ( 255 - 3.4 ) var( --remBase ) );
		padding-bottom : calc( 97 var( --remBase ) );
		background-image : url( "../images/home/history/bg_sp.webp" );
	}
	#history > p{
		font-size : 3.4rem;
	}
	#history ul{
		margin-top : calc( ( 31 - 3.4 ) var( --remBase ) );
	}
	#history li{
		grid-template-rows : calc( ( 9 - 3.4 ) var( --remBase ) ) auto calc( 5 var( --remBase ) ) auto 1fr;
		grid-template-columns : calc( 120 * 100% / 702 ) 1fr;
		column-gap : calc( 15 * 100% / 702 );
		padding-bottom : calc( ( 18 - 5.3 ) var( --remBase ) );
	}
	#history li + li{
		margin-top : calc( 18 var( --remBase ) );
	}
	#history h3{
		font-size : 3.4rem;
	}
	#history li p{
		font-size : calc( 20 var( --remBase ) );
		line-height : 1.53;
	}
}
@media screen and ( min-width : 750.02px ) and ( max-width : 1240px ){
	#history{
		padding-top : calc( ( 123 - 2.8 ) var( --remBase ) );
		padding-bottom : calc( 102 var( --remBase ) );
		background-image : url( "../images/home/history/bg_pc.webp" );
	}
	#history > :where( p , ul ){
		margin-left : calc( 260 var( --percentBase ) );
	}
	#history > p{
		font-size : 2.8rem;
	}
	#history ul{
		width : calc( 900 var( --percentBase ) );
		margin-top : calc( ( 27 - 2.8 ) var( --remBase ) );
	}
	#history li{
		grid-template-rows : calc( ( 26 - 3 ) var( --remBase ) ) auto calc( 10 var( --remBase ) ) auto 1fr;
		grid-template-columns : calc( 120 * 100% / 900 ) 1fr;
		column-gap : calc( 15 * 100% / 900 );
	}
	#history li + li{
		margin-top : calc( 5 var( --remBase ) );
	}
	#history h3{
		font-size : 3rem;
	}
	#history li p{
		font-size : calc( 18 var( --remBase ) );
		line-height : 1.7;
	}
}
@media print , screen and ( min-width : 1240.02px ){
	#history{
		position : relative;
		padding-top : calc( ( 151 - 2.8 ) var( --remBase ) );
		padding-bottom : calc( 82 var( --remBase ) );
		overflow : hidden;
		background-image : url( "../images/home/history/bg_pc02.webp" );
	}
	#history::before{
		position : absolute;
		top : calc( -22 var( --remBase ) );
		display : block;
		height : calc( 929 var( --remBase ) );
		aspect-ratio : 292 / 1032;
		content : "";
		background : url( "../images/home/history/logo.svg" ) center / contain no-repeat;
	}
	#history > :where( p , ul ){
		margin-left : calc( 800 var( --percentBase ) );
	}
	#history > p{
		font-size : 2.8rem;
	}
	#history ul{
		width : calc( 920 var( --percentBase ) );
		margin-top : calc( ( 22 - 2.8 ) var( --remBase ) );
	}
	#history li{
		grid-template-rows : calc( ( 26 - 3 ) var( --remBase ) ) auto calc( 10 var( --remBase ) ) auto 1fr;
		grid-template-columns : calc( 120 * 100% / 920 ) 1fr;
		column-gap : calc( 15 * 100% / 920 );
	}
	#history li + li{
		margin-top : calc( 5 var( --remBase ) );
	}
	#history h3{
		font-size : 3rem;
	}
	#history li p{
		font-size : calc( 18 var( --remBase ) );
		line-height : 1.7;
	}
}
@media print , screen and ( min-width : 1240.02px ) and ( max-width : 2000px ){
	#history::before{
		left : calc( -4 var( --viewportBase ) );
	}
}

/* --------------------------------------------
BANNERS
--------------------------------------------- */
#banners a{
	display : block;
}
@media print , screen and ( min-width : 750.02px ){
	#banners ul{
		display : flex;
		flex-wrap : wrap;
		row-gap : calc( 40 var( --remBase ) );
		column-gap : calc( 40 var( --percentBase ) );
		align-items : center;
		justify-content : center;
	}
	#banners ul + ul{
		margin-top : calc( 40 var( --remBase ) );
	}
}
@media screen and ( max-width : 750px ){
	#banners{
		padding-top : calc( 87 var( --remBase ) );
		padding-bottom : calc( 113 var( --remBase ) );
	}
	#banners .l > li + li{
		margin-top : calc( 47 var( --remBase ) );
	}
	#banners :where( .m , .s ){
		display : flex;
		flex-wrap : wrap;
		justify-content : center;
		margin-top : calc( 32 var( --remBase ) );
	}
	#banners .m{
		row-gap : calc( 32 var( --remBase ) );
		column-gap : calc( 22 var( --percentBase ) );
	}
	#banners .m > li{
		width : calc( 340 var( --percentBase ) );
	}
	#banners .s{
		row-gap : calc( 27 var( --remBase ) );
		column-gap : calc( 27 var( --percentBase ) );
	}
	#banners .s > li{
		width : calc( 218 var( --percentBase ) );
	}
	#banners img{
		width : 100%;
		height : auto;
	}
}
@media screen and ( min-width : 750.02px ) and ( max-width : 1240px ){
	#banners{
		padding-top : calc( 91 var( --remBase ) );
		padding-bottom : calc( 84 var( --remBase ) );
	}
	#banners .l img{
		height : calc( 140 var( --remBase ) );
	}
	#banners .m img{
		height : calc( 90 var( --remBase ) );
	}
	#banners .s img{
		height : calc( 67 var( --remBase ) );
	}
}
@media print , screen and ( min-width : 1240.02px ){
	#banners{
		padding-top : calc( 91 var( --remBase ) );
		padding-bottom : calc( 84 var( --remBase ) );
	}
	#banners .l img{
		height : calc( 200 var( --remBase ) );
	}
	#banners .m img{
		height : calc( 120 var( --remBase ) );
	}
	#banners .s img{
		height : calc( 100 var( --remBase ) );
	}
}