/* --------------------------------------------
UNIT
--------------------------------------------- */
@media screen and ( width <= 768px ){
	:root{
		--breakPoint : 400;
		--remBase : 100vw / var( --breakPoint );
	}
}
@media print , screen and ( width > 768px ){
	:root{
		--breakPoint : 1200;
		--remBase : min( 1px , 100vw / var( --breakPoint ) );
	}
}
:root{
	--viewportBase : 100% / var( --breakPoint );
}

/* --------------------------------------------
COLOR
--------------------------------------------- */
@property --red01{
	syntax : "<color>";
	inherits : false;
	initial-value : #db0037;
}
@property --red02{
	syntax : "<color>";
	inherits : false;
	initial-value : #e53754;
}
@property --gray01{
	syntax : "<color>";
	inherits : false;
	initial-value : #868686;
}
@property --orange01{
	syntax : "<color>";
	inherits : false;
	initial-value : #ed9623;
}
@property --borderColor01{
	syntax : "<color>";
	inherits : false;
	initial-value : #cecece;
}

/* --------------------------------------------
FILTER COLOR
--------------------------------------------- */
@property --filterWhite{
	syntax : "*";
	inherits : false;
	initial-value : invert( 99% ) sepia( 28% ) saturate( 2% ) hue-rotate( 3deg ) brightness( 108% ) contrast( 100% );
}
@property --filterRed01{
	syntax : "*";
	inherits : false;
	initial-value : invert( 45% ) sepia( 78% ) saturate( 6415% ) hue-rotate( 333deg ) brightness( 96% ) contrast( 87% );
}
@property --filterRed02{
	syntax : "*";
	inherits : false;
	initial-value : invert( 100% ) sepia( 100% ) saturate( 0% ) hue-rotate( 307deg ) brightness( 103% ) contrast( 103% );
}
@property --filterGray01{
	syntax : "*";
	inherits : false;
	initial-value : invert( 58% ) sepia( 0% ) saturate( 702% ) hue-rotate( 238deg ) brightness( 92% ) contrast( 86% );
}
@property --filterOrange01{
	syntax : "*";
	inherits : false;
	initial-value : invert( 56% ) sepia( 98% ) saturate( 394% ) hue-rotate( 352deg ) brightness( 95% ) contrast( 95% );
}

/* --------------------------------------------
DEFAULT
--------------------------------------------- */
a{
	-webkit-text-decoration : none;
	text-decoration : none;
}

/* --------------------------------------------
SETTINGS
--------------------------------------------- */
@media screen and ( width <= 768px ){
	:root{
		--headerCampusHeight : calc( 67 * var( --remBase ) );
	}
}
@media print , screen and ( width > 768px ){
	:root{
		--headerCampusHeight : min( 157px , calc( 157 * var( --remBase ) ) );
	}
}

/* --------------------------------------------
TOP
--------------------------------------------- */
#top-banner{
	.cap{
		width : 100%;
		height : auto;
		padding-top : 0;
	}
	.slick-dots li.slick-active button{
		background : rgb( 182 0 20 );
		border-radius : 50%;
	}
	@media screen and ( width <= 768px ){
		.cap{
			aspect-ratio : 1;
		}
		figure.slider01{
			background-image : url( "../images/slider/slider-img01_sp.png" ) ! important;
		}
		figure.slider02{
			background-image : url( "../images/slider/slider-house_sp.jpg" ) ! important;
		}
		figure.slider03{
			background-image : url( "../images/slider/slider-img03_sp-2026" .png ) ! important;
		}
		figure.slider04{
			background-image : url( "../images/slider/slider-img04_sp.png" ) ! important;
		}

		/* figure.slider05{
              background-image: url( "../images/slider/slider-img05_sp.png" ) !important;
          } */
		figure.slider06{
			background-image : url( "../images/slider/slider-goodmeeting_sp.jpg" ) ! important;
		}
		figure.slider07{
			background-image : url( "../images/slider/slider-online_sp.jpg" ) ! important;
		}
	}
	@media print , screen and ( width > 768px ){
		.cap{
			aspect-ratio : 1905 / 666.75;
		}
	}
}

/* --------------------------------------------
CAMPUS COMMON
--------------------------------------------- */
@media screen and ( width <= 768px ){
	.is-pc{
		display : none;
	}
}
@media print , screen and ( width > 768px ){
	:root{
		--headerCampusHeight : min( 157px , calc( 157 * var( --remBase ) ) );
	}
	.is-sp{
		display : none;
	}
}
.wpmem_msg{
	width : 100% ! important;
}
@media screen and ( width <= 768px ){
	.wpmem_msg{
		font-size : 16px ! important;
		line-height : calc( 32 / 16 );
	}
}
@media print , screen and ( width > 768px ){
	.wpmem_msg{
		font-size : 18px ! important;
		line-height : calc( 32 / 18 );
	}
}
:where( .page-user_registrations , .basic_information , #wpmem_login_form , .mypage , #singleEs , #singleCompany , #template_es-create , #template_es-edit , #template_interview-create , #template_interview-edit , #template_drafts ){
	.color-red01{
		color : var( --red01 );
	}
	.color-red02{
		color : var( --red02 );
	}
	.color-gray01{
		color : var( --gray01 );
	}
	.link-text01{
		a{
			width : fit-content;
			color : currentColor;
		}
	}
	.ms-auto{
		margin-left : auto;
	}
	.me-auto{
		margin-right : auto;
	}
	a:where( .ms-auto , .me-auto ){
		display : block;
		width : fit-content;
	}
	[data-before]{
		&::before{
			content : attr( data-before );
		}
	}
	span.error{
		font-weight : 400;
		line-height : 1.4;
		color : var( --red02 );
	}
	.div_radio{
		flex-wrap : wrap;
		span.error{
			flex-shrink : 0;
			width : 100%;
		}
	}
	@media screen and ( width <= 768px ){
		&.wrap{
			padding-inline : 1rem;
		}
		.link-text01{
			a{
				font-size : 12px;
				line-height : calc( 24 / 12 );
			}
		}
	}
	@media print , screen and ( width > 768px ){
		&.wrap{
			padding-inline : calc( ( 100% - 1320px ) / 2 );
		}
		.link-text01{
			a{
				font-size : 15px;
				line-height : calc( 24 / 15 );
			}
		}
	}
}

/* --------------------------------------------
CAMPUS HEADER
--------------------------------------------- */
body:has( #headerCampus ){
	padding-top : var( --headerCampusHeight );
}
#headerCampus{
	position : fixed;
	top : 0;
	left : 0;
	z-index : 1002;
	display : grid;
	align-items : center;
	width : 100%;
	height : var( --headerCampusHeight );
	background-color : white;
	#menuBtn{
		z-index : 12;
		display : grid;
		grid-row : 1;
		grid-column : 1;
		grid-auto-flow : row;
		align-items : center;
		justify-content : center;
		justify-items : center;
		justify-self : start;
		padding : 0;
		margin : 0;
		overflow : hidden;
		cursor : pointer;
		&[aria-expanded="true"]{
			overflow : hidden;
		}
		> span:nth-of-type( 1 ){
			position : relative;
			display : block;
			height : 100%;
			font-size : 0;
			> span{
				position : absolute;
				left : 0;
				display : block;
				width : 100%;
				transition : all .4s;
				&:nth-of-type( 1 ){
					top : 0;
				}
				&:nth-of-type( 4 ){
					bottom : 0;
				}
			}
		}
		&[aria-expanded="true"]{
			> span:nth-of-type( 1 ){
				span:nth-of-type( 1 ){
					scale : 0;
					translate : calc( $( top ) var( --remBase ) ) 0;
				}
				span:nth-of-type( 2 ){
					rotate : -45deg;
				}
				span:nth-of-type( 3 ){
					rotate : 45deg;
				}
				span:nth-of-type( 4 ){
					scale : 0;
					translate : calc( -$( top ) var( --remBase ) ) 0;
				}
			}
		}
		> span{
			&:nth-of-type( 1 ){
				span{
					background-color : #db0037;
				}
			}
			&:nth-of-type( 2 ){
				display : block;
				color : #db0037;
				text-align : center;
			}
		}
	}
	.logo{
		display : block;
		grid-row : 1;
		grid-column : 2;
		width : fit-content;
	}
	.login{
		display : grid;
		grid-row : 1;
		align-items : center;
		justify-content : center;
		width : 100%;
		font-weight : 700;
		color : white;
		background-color : var( --red01 );
		border-radius : 100vmax;
	}
	@media screen and ( width <= 768px ){
		grid-template-columns : calc( 40 * 100% / 376 ) auto 1fr calc( 104 * 100% / 376 );
		padding-inline : calc( 12 * var( --viewportBase ) );
		box-shadow : 0 0 calc( 3 * var( --remBase ) ) color-mix( in sRGB , black 25% , transparent );
		&.has-scrolled.is-view{
			translate : 0 0;
		}
		&.has-scrolled:not( .is-view ):has( #menuBtn[aria-expanded="false"] ){
			translate : 0 -100%;
		}
		#menuBtn{
			row-gap : calc( 4 * var( --remBase ) );
			> span{
				&:nth-of-type( 1 ){
					width : calc( 20 * var( --remBase ) );
					height : calc( 14 * var( --remBase ) );
					> span{
						height : calc( 1 * var( --remBase ) );
						&:nth-of-type( 2 ) , &:nth-of-type( 3 ){
							top : calc( 6.5 * var( --remBase ) );
						}
					}
				}
				&:nth-of-type( 2 ){
					font-size : calc( 10 * var( --remBase ) );
				}
			}
		}
		.logo{
			img{
				height : calc( 33 * var( --remBase ) );
			}
		}
		.login{
			grid-column : 4;
			height : calc( 35 * var( --remBase ) );
			font-size : calc( 16 * var( --remBase ) );
		}
	}
	@media print , screen and ( width > 768px ){
		grid-template-columns : min( 62px , calc( 62 * 100% / 1778 ) ) auto  min( 72px , calc( 72 * 100% / 1778 ) ) auto 1fr min( 240px , calc( 240 * 100% / 1778 ) );
		padding-inline : min( 66px , calc( 66 * 100% / 1920 ) );
		box-shadow : 0 0 min( 10px , calc( 10 * var( --remBase ) ) ) color-mix( in sRGB , black 25% , transparent );
		#menuBtn{
			row-gap : min( 4px , calc( 4 * var( --remBase ) ) );
			> span{
				&:nth-of-type( 1 ){
					width : min( 30px , calc( 30 * var( --remBase ) ) );
					height : min( 22px , calc( 22 * var( --remBase ) ) );
					> span{
						height : min( 2px , calc( 2 * var( --remBase ) ) );
						&:nth-of-type( 2 ) , &:nth-of-type( 3 ){
							top : min( 9px , calc( 9 * var( --remBase ) ) );
						}
					}
				}
				&:nth-of-type( 2 ){
					font-size : min( 16px , calc( 16 * var( --remBase ) ) );
				}
			}
		}
		.logo{
			img{
				height : min( 86px , calc( 86 * var( --remBase ) ) );
			}
		}
		nav{
			display : grid;
			grid-row : 1;
			grid-column : 4;
			grid-auto-flow : column;
			column-gap : min( 4px , calc( 4 * var( --remBase ) ) );
			align-items : center;
			justify-content : start;
			img{
				height : min( 137px , calc( 137 * var( --remBase ) ) );
			}
		}
		.login{
			grid-column : 6;
			height : min( 80px , calc( 80 * var( --remBase ) ) );
			font-size : min( 28px , calc( 28 * var( --remBase ) ) );
		}
	}
}
#sp-menubox.navCampus{
	@media screen and ( width <= 768px ){
		padding-top : calc( ( 40 * var( --remBase ) ) + var( --headerCampusHeight ) );
	}
	@media print , screen and ( width > 768px ){
		padding-top : min( calc( 80px + var( --headerCampusHeight ) ) , calc( ( 80 * var( --remBase ) ) + var( --headerCampusHeight ) ) );
	}
}
body:has( #menuBtn[aria-expanded="false"] ) #sp-menubox.navCampus{
	right : -100%;
}
body:has( #menuBtn[aria-expanded="true"] ) #sp-menubox.navCampus{
	right : 0;
}

/* --------------------------------------------
HEADER
--------------------------------------------- */
#header{
	#header-nav{
		.wrap-box{
			> div{
				>span{
					position : relative;
					display : block;
					width : 1.875rem ! important;
					margin-top : 4px;
					font-size : 1rem;
					font-weight : 500;
					color : #b60014;
					text-align : center;
					white-space : pre;
					> span{
						position : absolute;
						left : 50%;
						translate : -50% 0;
					}
				}
			}
		}
	}
	@media screen and ( width <= 768px ){
		#header-nav{
			.wrap-box{
				> div{
					>span{
						margin-left : 10px;
					}
				}
			}
		}
	}
	@media print , screen and ( width > 768px ){
		#header-nav{
			.wrap-box{
				> div{
					>span{
						margin-left : 20px;
					}
				}
			}
		}
	}
}

/* --------------------------------------------
FOOTER
--------------------------------------------- */
@media screen and ( width <= 768px ){
	.global_navigation .g{
		align-items : end;
	}
}
footer#footer{
	.footer_inner{
		position : relative;
	}
	.topbutton.is-absolute{
		position : absolute;
		top : 12px;
	}
	@media print , screen and ( width > 768px ){
		.g{
			align-items : end;
		}
	}
}

/* --------------------------------------------
COLUMNS
--------------------------------------------- */
:is( #template_mypage , #template_es-create , #template_es-edit , #template_interview-create , #template_interview-edit , #template_drafts ){
	padding-top : 9.1875rem;
	padding-bottom : 5.3125rem;
	background-color : #f2f4f6;
	.names , .informations > li , .details-content > li{
		background-color : white;
	}
	.names{
		p{
			font-weight : 700;
		}
		h2{
			display : flex;
			flex-wrap : wrap;
			align-items : center;
			justify-content : start;
			img{
				width : auto;
				font-size : 0;
			}
			span{
				font-weight : 700;
			}
		}
	}
	:where( .informations , .details-content ){
		a{
			font-weight : 500;
		}
		a:not( [data-count] ){
			display : block;
		}
		a[data-count]{
			display : flex;
			align-items : center;
			justify-content : space-between;
			&::after{
				display : grid;
				place-items : center;
				font-weight : 700;
				color : white;
				content : attr( data-count );
				background-color : var( --red01 );
				border-radius : 100vmax;
			}
		}
	}
	details{
		summary{
			display : block;
			font-weight : 700;
			list-style : none;
			background-color : #e5e9ef;
			&::-webkit-details-marker{
				display : none;
			}
		}
	}
	.column02{
		h3{
			font-weight : 700;
		}
		.box{
			background-color : white;
		}
		header{
			display : flex;
			align-items : center;
			justify-content : space-between;
		}
		h4{
			font-weight : 700;
		}
		dl{
			border-top-color : #d9d9d9;
			border-top-style : solid;
		}
	}
	@media screen and ( width <= 768px ){
		.columns02{
			margin-top : 40px;
		}
		.names{
			padding-block : 24px;
			padding-inline : 30px;
			border-radius : 12px 12px 0 0;
			p{
				font-size : 14px;
				line-height : calc( 24 / 14 );
			}
			h2{
				column-gap : 4px;
				img{
					height : 21px;
				}
				span{
					font-size : 20px;
					line-height : calc( 24 / 20 );
				}
			}
		}
		:where( .informations , .details-content ){
			> li + li{
				margin-top : 4px;
			}
			a{
				padding-inline : 30px;
				font-size : 14px;
				line-height : calc( 24 / 14 );
			}
			> li:not( :has( ul ) ){
				> a{
					padding-block : 24px;
				}
			}
			> li:has( ul ){
				padding-block : 16px;
				a{
					padding-block : 6px;
				}
			}
			a[data-count]::after{
				height : 26px;
				padding-inline : 11px;
				font-size : 13px;
				line-height : calc( 24 / 13 );
				text-indent : -.06em;
				letter-spacing : -.06em;
			}
		}
		.informations{
			margin-top : 4px;
		}
		details{
			margin-top : 4px;
			overflow : hidden;
			border-radius : 0 0 16px 16px;
			summary{
				position : relative;
				display : flex;
				align-items : center;
				justify-content : space-between;
				padding-block : 24px;
				padding-inline : 30px;
				font-size : 16px;
				line-height : calc( 24 / 16 );
				&::after{
					display : block;
					width : auto;
					height : 6.65px;
					aspect-ratio : 11.67 / 6.65;
					font-size : 0;
					content : "";
					background : url( "../../../../wp-content/uploads/2025/07/Vector.png" ) center / contain no-repeat;
				}
			}
			&[open]{
				summary::after{
					rotate : 0;
				}
			}
			&:not( [open] ){
				summary::after{
					rotate : -180deg;
				}
			}
		}
		.column02{
			margin-top : 60px;
		}
	}
	@media print , screen and ( width > 768px ){
		.columns02{
			display : grid;
			grid-template-columns : 360px 904px;
			align-items : start;
			justify-content : space-between;
			margin-top : 80px;
		}
		.column01{
			grid-row : 1;
			grid-column : 1;
		}
		.names{
			padding-inline : 30px;
			padding-top : 24px;
			padding-bottom : 30px;
			border-radius : 16px 16px 0 0;
			p{
				margin-bottom : 8px;
				font-size : 16px;
				line-height : calc( 24 / 16 );
			}
			h2{
				column-gap : 10px;
				img{
					height : 24px;
				}
				span{
					font-size : 22px;
					line-height : calc( 26 / 22 );
				}
			}
		}
		:where( .informations , .details-content ){
			> li + li{
				margin-top : 4px;
			}
			a{
				padding-inline : 32px;
				font-size : 18px;
				line-height : calc( 24 / 18 );
			}
			> li:not( :has( ul ) ){
				> a{
					padding-block : 28px;
				}
			}
			> li:has( ul ){
				padding-block : 16px;
				a{
					padding-block : 12px;
				}
			}
			a[data-count]::after{
				height : 28px;
				padding-inline : 11px;
				font-size : 15px;
				line-height : calc( 24 / 15 );
				text-indent : -.06em;
				letter-spacing : -.06em;
			}
		}
		.informations{
			margin-top : 4px;
		}
		details{
			summary{
				padding-block : 20px;
				padding-inline : 32px;
				font-size : 18px;
				line-height : calc( 24 / 18 );
				pointer-events : none;
			}
			.details-content{
				overflow : hidden;
				border-radius : 0 0 16px 16px;
			}
		}
	}
}

/* --------------------------------------------
MYPAGE
--------------------------------------------- */
.mypage{
	.icon-upload-wrapper{
		position : relative;
		width : 100%;
		overflow : hidden;
		picture{
			display : block;
			width : 100%;
			height : 100%;
			img{
				width : 100%;
				max-width : inherit;
				height : 100%;
				max-height : inherit;
				object-fit : cover;
			}
		}
		.icon-upload-overlay{
			position : absolute;
			top : 10px;
			right : 10px;
			display : flex;
			align-items : center;
			justify-content : center;
			padding : 6px;
			color : white;
			cursor : pointer;
			background : color-mix( in sRGB , black 60% , transparent );
			border-radius : 50%;
			transition : background .3s;
		}
		.icon-upload-overlay:hover{
			background : color-mix( in sRGB , black 80% , transparent );
		}
		.icon-upload-overlay svg{
			width : 20px;
			height : 20px;
			fill : white;
		}
	}
	.icon-upload-input{
		display : none;
	}
	@media screen and ( width <= 768px ){
		.icon-upload-wrapper{
			height : 166px;
			border-radius : 12px;
		}
		.columns02{
			margin-top : 40px;
		}
		.column02{
			margin-top : 60px;
			h3{
				font-size : 24px;
				line-height : calc( 29 / 24 );
			}
			.box{
				margin-top : 24px;
				border-radius : 16px;
			}
			header{
				padding-block : 32px;
				padding-inline : 30px;
				h4{
					font-size : 18px;
					line-height : calc( 24 / 18 );
				}
				a{
					font-size : 13px;
					line-height : calc( 24 / 13 );
				}
			}
			dl{
				display : grid;
				grid-template-columns : 144px 1fr;
				row-gap : 24px;
				align-items : start;
				padding-block : 32px;
				padding-inline : 30px;
				border-top-width : 2px;
			}
			:where( dt , dd ){
				font-size : 16px;
				line-height : calc( 24 / 16 );
			}
		}
	}
	@media print , screen and ( width > 768px ){
		.icon-upload-wrapper{
			height : 304px;
			border-radius : 16px;
		}
		.column02{
			grid-row : 1;
			grid-column : 2;
			h3{
				font-size : 32px;
				line-height : calc( 38 / 32 );
			}
			.box{
				margin-top : 32px;
				border-radius : 16px;
			}
			header{
				padding-block : 32px;
				padding-inline : 40px;
				h4{
					font-size : 20px;
					line-height : calc( 24 / 20 );
				}
				a{
					font-size : 15px;
					line-height : calc( 24 / 15 );
				}
			}
			dl{
				display : grid;
				grid-template-columns : 216px 1fr;
				row-gap : 40px;
				align-items : start;
				padding-block : 48px;
				padding-inline : 64px;
				border-top-width : 2px;
			}
			:where( dt , dd ){
				font-size : 18px;
				line-height : calc( 24 / 18 );
			}
		}
	}
}
#wpmem_login{
	background-color : white;
	border-radius : 16px;
	fieldset{
		margin-block : 0 ! important;
	}
	h2{
		font-weight : 700;
		color : black;
	}
	.div_text:not( :first-of-type ){
		margin-top : 15px;
	}
	label:empty{
		display : none;
	}
	.div_text{
		margin-bottom : 0 ! important;
		&:first-of-type{
			margin-top : 0;
		}
	}
	:where( input[type="email"] , input[type="text"] , input[type="password"] ){
		height : 47px;
		padding-inline : 20px;
		font-size : 15px;
		line-height : calc( 24 / 15 );
		background-color : #f8f8f8 ! important;
		border : solid 1px #cecece ! important;
		&::placeholder{
			color : var( --gray01 ) ! important;
		}
	}
	.button_div{
		display : flex;
		row-gap : 0 ! important;
		align-items : center;
		justify-content : start ! important;
		padding : 0 ! important;
		margin-top : 15px;
		margin-bottom : 24px;
		font-size : 0;
		input[type="checkbox"]{
			margin : 0;
		}
		label{
			margin-bottom : 0;
			font-size : 13px;
			line-height : calc( 24 / 13 );
			color : var( --gray01 );
		}
		input[type="submit"]{
			display : grid;
			place-items : center;
			width : 100% ! important;
			height : 66px ! important;
			margin-inline : auto;
			font-size : 15px ! important;
			font-weight : 700;
			line-height : calc( 24 / 15 ) ! important;
			color : white ! important;
			background-color : var( --red01 ) ! important;
			border-radius : 100vmax ! important;
		}
	}
	.link-text{
		padding : 0 ! important;
	}
	.button_div + .link-text{
		margin-top : 0 ! important;
	}
	.link-text-forgot > a{
		display : block;
		width : fit-content;
		margin-left : auto;
		color : var( --red01 );
		-webkit-text-decoration : none ! important;
		text-decoration : none ! important;
	}
	.link-text .link-text-register{
		margin-top : 36px;
		> a{
			display : grid;
			place-items : center;
			width : 100%;
			height : 66px;
			margin-inline : auto;
			font-size : 15px;
			font-weight : 500;
			line-height : calc( 24 / 15 );
			color : var( --red01 );
			-webkit-text-decoration : none;
			text-decoration : none;
			background-color : white;
			border-color : var( --red01 );
			border-style : solid;
			border-width : 2px;
			border-radius : 100vmax;
		}
	}
	@media screen and ( width <= 768px ){
		width : 100%;
		padding-inline : 30px;
		padding-top : 32px;
		padding-bottom : 40px;
		margin-top : 48px;
		h2{
			margin-bottom : 29px;
			font-size : 20px;
			line-height : calc( 24 / 20 );
		}
		:where( input[type="email"] , input[type="text"] , input[type="password"] ){
			border-radius : 6px;
		}
		.button_div{
			column-gap : calc( 8px / 2 );
			input[type="checkbox"]{
				width : 18px;
				height : 18px;
			}
			input[type="submit"]{
				margin-top : 32px;
			}
		}
		:where( .link-text-forgot > a , .link-text-register > a:first-of-type ){
			font-size : 12px;
			line-height : calc( 24 / 12 );
		}
		.link-text-register{
			> span{
				column-gap : 23px;
				margin-top : 32px;
				font-size : 14px;
				line-height : calc( 24 / 14 );
			}
			> a:nth-of-type( 2 ){
				margin-top : 16px;
			}
		}
	}
	@media print , screen and ( width > 768px ){
		max-width : 540px;
		padding-inline : 51px;
		padding-top : 44px;
		padding-bottom : 60px;
		margin-inline : auto;
		margin-top : 40px;
		h2{
			margin-bottom : 40px;
			font-size : 22px;
			line-height : calc( 26 / 22 );
		}
		:where( input[type="email"] , input[type="text"] , input[type="password"] ){
			border-radius : 3px;
		}
		.button_div{
			column-gap : calc( 9px / 2 );
			input[type="checkbox"]{
				width : 16px;
				height : 16px;
			}
			input[type="submit"]{
				margin-top : 24px;
			}
		}
		:where( .link-text-forgot > a , .link-text-register > a:first-of-type ){
			font-size : 15px;
			line-height : calc( 24 / 15 );
		}
		.link-text-register{
			> span{
				column-gap : 8px;
				margin-top : 36px;
				font-size : 16px;
				line-height : calc( 24 / 16 );
			}
			> a:nth-of-type( 2 ){
				margin-top : 12px;
			}
		}
	}
}
.page-resetPassword{
	#wpmem_login{
		fieldset{
			margin-block : 0;
		}
		.button_div{
			margin-top : 24px;
			margin-bottom : 0;
			input[type="submit"]{
				margin-top : 0;
			}
		}
		.link-text:has( > span:empty ){
			display : none;
		}
	}
}

/* --------------------------------------------
COMPANY
--------------------------------------------- */
#singleCompany{
	background-color : #f2f4f6;
	.breadcrumb{
		margin-block : 0;
	}
	.company{
		overflow : hidden;
		background-color : white;
		border-radius : 20px;
		header{
			h2{
				position : relative;
				font-weight : 700;
				color : var( --red02 );
				&::before , &::after{
					position : absolute;
					top : 50%;
					display : block;
					font-size : 0;
					content : "";
					background-color : currentColor;
					translate : 0 -50%;
				}
				&::before{
					height : 6px;
				}
				&::after{
					width : auto;
					height : 14px;
					aspect-ratio : 1;
					border-radius : 50%;
				}
			}
			p{
				font-weight : 700;
				color : black;
			}
		}
		dl{
			display : grid;
			color : black;
			dt , dd{
				align-self : center;
				border-bottom : solid 1px #d9d9d9;
			}
			dt{
				position : relative;
				font-weight : 700;
				text-align : center;
				&::after{
					position : absolute;
					bottom : -1.5px;
					left : 0;
					width : 100%;
					height : 3px;
					font-size : 0;
					content : "";
					background-color : var( --red01 );
				}
			}
		}
	}
	.relation{
		h3{
			width : fit-content;
			font-weight : 700;
			color : black;
			border-bottom-color : var( --red02 );
			border-bottom-style : solid;
		}
		> ul{
			> li{
				background-color : white;
				border-radius : 20px;
			}
		}
		section{
			display : grid;
			align-items : start;
			picture{
				display : block;
				img{
					width : auto;
				}
			}
			.categories{
				display : flex;
				flex-wrap : wrap;
				column-gap : 8px;
				p{
					display : grid;
					place-items : center;
					padding-block : 8px;
					padding-inline : 12px;
					font-weight : 700;
					color : white;
					background-color : var( --red02 );
					border-radius : 100vmax;
				}
				ul{
					display : flex;
					align-items : center;
					justify-content : center;
					padding-block : 8px;
					padding-inline : 4px;
					border-radius : 100vmax;
					outline : solid 1px var( --red02 );
					outline-offset : -1px;
				}
				li{
					padding-inline : 12px;
					font-weight : 700;
					color : var( --red02 );
					+ li{
						border-left : solid 1px currentColor;
					}
				}
			}
		}
		h4{
			font-weight : 700;
			color : black;
		}
		.excerpt{
			position : relative;
			overflow-y : hidden;
			color : black;
			letter-spacing : -.06em;
			background-color : #f8f8f8;
			&::after{
				position : absolute;
				left : 0;
				display : block;
				width : 100%;
				content : "";
				background-image : linear-gradient( to bottom , color-mix( in srgb , #f8f8f8 0% , transparent ) , color-mix( in srgb , #f8f8f8 100% , transparent ) );
			}
		}
		a{
			display : grid;
			place-items : center;
			font-weight : 700;
			color : white;
			background-color : var( --red02 );
			border-radius : 100vmax;
		}
	}
	@media screen and ( width <= 768px ){
		padding-inline : 20px;
		padding-top : 106px;
		padding-bottom : 88px;
		.company{
			padding-block : 32px;
			padding-inline : 20px;
			margin-top : 26px;
			header{
				padding-inline : 20px;
				h2{
					font-size : 24px;
					line-height : calc( 30 / 24 );
					&::before{
						left : -40px;
						width : 25px;
					}
					&::after{
						left : -22px;
					}
				}
				p{
					margin-top : 8px;
					font-size : 14px;
					line-height : calc( 17 / 14 );
				}
			}
			dl{
				grid-template-columns : 120px 1fr;
				dt{
					padding-block : 16px;
					font-size : 14px;
					line-height : calc( 32 / 14 );
				}
				dd{
					padding-block : 19px;
					padding-inline : 16px;
					font-size : 14px;
					line-height : calc( 26 / 14 );
				}
			}
		}
		.relation{
			margin-top : 80px;
			h3{
				padding-bottom : 8px;
				font-size : 18px;
				line-height : calc( 22 / 18 );
				border-bottom-width : 4px;
			}
			> ul{
				margin-top : 32px;
				> li{
					padding-inline : 20px;
					padding-top : 20px;
					padding-bottom : 16px;
					+ li{
						margin-top : 16px;
					}
				}
			}
			section{
				grid-template-rows : auto 16px auto 16px auto 8px auto;
				grid-template-columns : auto 16px auto 1fr;
			}
			.categories{
				grid-row : 1;
				grid-column : 1 / -1;
				p{
					font-size : 12px;
					line-height : calc( 19 / 12 );
				}
				li{
					font-size : 12px;
					line-height : calc( 19 / 12 );
				}
			}
			picture{
				grid-row : 3;
				grid-column : 1;
				align-self : center;
				img{
					height : 66px;
				}
			}
			h4{
				grid-row : 3;
				grid-column : 3;
				align-self : center;
				font-size : 16px;
				line-height : calc( 26 / 16 );
			}
			.excerpt{
				grid-row : 5;
				grid-column : 1 / 5;
				max-height : 167px;
				padding-block : 16px;
				padding-inline : 16px;
				font-size : 12px;
				line-height : calc( 21 / 12 );
				border-radius : 4px;
				&::after{
					top : 92px;
					height : 75px;
				}
			}
			a{
				grid-row : 7;
				grid-column : 1 / 5;
				width : 100%;
				padding-block : 5px;
				padding-inline : 20px;
				font-size : 12px;
				line-height : calc( 19 / 12 );
			}
		}
		.sidebar{
			margin-top : 80px;
		}
	}
	@media print , screen and ( width > 768px ){
		padding-inline : calc( ( 100% - 1580px ) / 2 );
		padding-top : 203px;
		padding-bottom : 100px;
		.breadcrumb{
			padding-inline : 130px;
		}
		.columns02{
			display : grid;
			grid-template-columns : 1160px 360px;
			row-gap : 120px;
			align-items : start;
			justify-content : space-between;
			margin-top : 40px;
		}
		.company{
			grid-row : 1;
			grid-column : 1;
			padding-block : 80px;
			padding-inline : 130px;
			header{
				h2{
					font-size : 35px;
					line-height : calc( 50 / 35 );
					&::before{
						left : -130px;
						width : 107px;
					}
					&::after{
						left : -32px;
					}
				}
				p{
					font-size : 18px;
					line-height : calc( 22 / 18 );
				}
			}
			dl{
				grid-template-columns : 240px 1fr;
				dt{
					padding-block : 24px;
					font-size : 15px;
					line-height : calc( 32 / 15 );
				}
				dd{
					padding-block : 27px;
					padding-inline : 24px;
					font-size : 15px;
					line-height : calc( 26 / 15 );
				}
			}
		}
		.relation{
			grid-row : 2/4;
			grid-column : 1;
			align-self : start;
			h3{
				padding-bottom : 10px;
				font-size : 26px;
				line-height : calc( 31 / 26 );
				border-bottom-width : 5px;
			}
			> ul{
				margin-top : 40px;
				> li{
					padding-inline : 40px;
					padding-top : 36px;
					padding-bottom : 24px;
					+ li{
						margin-top : 40px;
					}
				}
			}
			section{
				grid-template-rows : 6px auto 10px auto auto 16px auto;
				grid-template-columns : auto 24px auto 1fr auto;
			}
			picture{
				grid-row : 1 / 6;
				grid-column : 1;
				img{
					height : 86px;
				}
			}
			.categories{
				grid-row : 2;
				grid-column : 3;
				p{
					font-size : 14px;
					line-height : calc( 19 / 14 );
				}
				li{
					font-size : 14px;
					line-height : calc( 19 / 14 );
				}
			}
			h4{
				grid-row : 4/6;
				grid-column : 3;
				align-self : start;
				font-size : 20px;
				line-height : calc( 28 / 20 );
			}
			a{
				grid-row : 4/6;
				grid-column : 5;
				align-self : start;
				padding-block : 5px;
				padding-inline : 20px;
				font-size : 12px;
				line-height : calc( 19 / 12 );
			}
			.excerpt{
				grid-row : 7;
				grid-column : 1 / 6;
				max-height : 256px;
				padding-block : 16px;
				padding-inline : 20px;
				font-size : 15px;
				line-height : calc( 24 / 15 );
				border-radius : 4px;
				&::after{
					top : 148px;
					height : 108px;
				}
			}
		}
		.sidebar{
			grid-row : 1/3;
			grid-column : 2;
			align-self : start;
		}
	}
}

/* --------------------------------------------
LOGIN POPUP
--------------------------------------------- */
body:has( #loginPopup[open] ){
	overflow : hidden;
}
#loginPopup{
	position : fixed;
	inset : 0;
	place-items : center;
	width : 100%;
	max-width : inherit;
	height : 100%;
	max-height : inherit;
	background-color : color-mix( in srgb , #3d3d3d 95% , transparent );
	&:not( [open] ){
		display : none;
	}
	&[open]{
		z-index : 10;
		display : grid;
	}
	.dialog-container{
		width : 100%;
		background-color : white;
		border-radius : 16px;
	}
	#wpmem_reg{
		width : 100%;
		background-color : white;
		legend{
			display : block;
			font-weight : 700;
			color : black;
			text-align : center;
		}
		label{
			display : flex;
			align-items : baseline;
			color : black;
			span{
				display : flex;
				align-items : baseline;
				justify-content : start;
				color : var( --gray01 );
			}
			img{
				width : auto;
			}
			.req{
				display : none;
			}
		}
		.div_text{
			margin-bottom : 0;
		}
		:where( input[type="text"] , input[type="email"] , input[type="password"] ){
			background-color : #f8f8f8;
			border : solid 1px #cecece;
			&::placeholder{
				color : var( --gray01 ) ! important;
			}
		}
		fieldset{
			margin : 0;
			> p{
				color : var( --gray01 );
				a{
					color : var( --red01 );
				}
			}
		}
		input[type="submit"]{
			display : grid;
			place-items : center;
			width : 100%;
			height : 66px;
			font-size : 15px;
			font-weight : 700;
			line-height : calc( 24 / 15 );
			color : white;
			background-color : var( --red01 );
			border : solid 1px var( --red01 );
			border-radius : 100vmax;
		}
		fieldset{
			> a{
				display : grid;
				place-items : center;
				width : 100%;
				height : 66px;
				margin-top : 24px;
				font-size : 15px;
				font-weight : 700;
				line-height : calc( 24 / 15 );
				color : var( --red01 );
				background-color : white;
				border-color : var( --red01 );
				border-style : solid;
				border-width : 1px;
				border-radius : 100vmax;
			}
		}
		.button_div{
			padding-block : 0;
		}
	}
	@media screen and ( width <= 768px ){
		.dialog-container{
			max-width : 360px;
			padding-block : 40px;
			padding-inline : 30px;
		}
		#wpmem_reg{
			legend{
				margin-bottom : 37px;
				font-size : 20px;
				line-height : calc( 24 / 20 );
			}
			label{
				column-gap : 10px;
				font-size : 16px;
				line-height : calc( 24 / 16 );
				span{
					column-gap : 4px;
					font-size : 11px;
					line-height : calc( 24 / 11 );
					img{
						height : 12px;
					}
				}
			}
			.div_text{
				margin-top : 12px;
			}
			:where( input[type="text"] , input[type="email"] , input[type="password"] ){
				height : 47px;
				font-size : 15px;
				line-height : calc( 24 / 15 );
				border-radius : 6px;
			}
			fieldset{
				> label:not( :first-of-type ){
					margin-top : 24px;
				}
				> p{
					&:nth-of-type( 1 ){
						margin-top : 32px;
						font-size : 14px;
						line-height : calc( 24 / 14 );
					}
					&:nth-of-type( 2 ){
						margin-top : 24px;
						font-size : 11px;
						line-height : calc( 18 / 11 );
					}
				}
			}
			.button_div{
				margin-top : 32px;
			}
		}
	}
	@media print , screen and ( width > 768px ){
		.dialog-container{
			max-width : 500px;
			padding-inline : 60px;
			padding-top : 48px;
			padding-bottom : 48px;
		}
		#wpmem_reg{
			legend{
				margin-bottom : 40px;
				font-size : 22px;
				line-height : calc( 26 / 22 );
			}
			label{
				column-gap : 10px;
				font-size : 18px;
				line-height : calc( 24 / 18 );
				span{
					column-gap : 3px;
					font-size : 13px;
					line-height : calc( 24 / 13 );
					img{
						height : 12px;
					}
				}
			}
			.div_text{
				margin-top : 10px;
			}
			:where( input[type="text"] , input[type="email"] , input[type="password"] ){
				height : 47px;
				font-size : 15px;
				line-height : calc( 24 / 15 );
				border-radius : 3px;
			}
			fieldset{
				> label:not( :first-of-type ){
					margin-top : 32px;
				}
				> p{
					&:nth-of-type( 1 ){
						margin-top : 40px;
						font-size : 16px;
						line-height : calc( 24 / 16 );
					}
					&:nth-of-type( 2 ){
						margin-top : 24px;
						font-size : 13px;
						line-height : calc( 18 / 13 );
					}
				}
			}
			.button_div{
				margin-top : 40px;
			}
		}
	}
}

/* --------------------------------------------

--------------------------------------------- */
.popup_wrap.popup_view{
	z-index : calc( infinity );
}

/* --------------------------------------------
VIDEOS
--------------------------------------------- */
.post-type-archive-videos{
	#archive__videos{
		.video-left{
			> a{
				display : block;
				overflow : hidden;
			}
		}
		.video-right{
			.company-logo{
				overflow : hidden;
				border-radius : 8px;
			}
		}
		.swiper-controller{
			.video-swiper__pagination{
				position : relative;
				bottom : 0;
				column-gap : 12px;
				span{
					margin : 0;
				}
			}
			.video-slide__nav{
				position : relative;
				button{
					top : 0;
					bottom : 0;
					padding : 0;
					padding-inline : 0;
					margin : 0;
				}
				img{
					width : auto;
					height : 100%;
				}
			}
		}
	}
	@media screen and ( width <= 768px ){
		#archive__videos{
			.video-slider-wrapper{
				padding-inline : 0;
			}
			.video-slide-inner{
				row-gap : 17px;
			}
			.video-left{
				padding-inline : 20px;
				> a{
					border-radius : 12px;
				}
			}
			.video-right{
				column-gap : 20px;
				padding-inline : 20px;
				padding-bottom : 0;
				.company-name{
					margin-top : -2px;
					font-size : 18px;
					line-height : calc( 22 / 18 );
				}
				.video-title{
					margin-top : 13px;
					font-size : 14px;
					line-height : calc( 22 / 14 );
				}
			}
			.swiper-controller{
				margin-top : 40px;
				.video-slide__nav{
					height : 52px;
					margin-top : 32px;
					.video-swiper__prev{
						left : 112px;
					}
					.video-swiper__next{
						right : 112px;
					}
				}
			}
		}
	}
	@media print , screen and ( width > 768px ){
		#archive__videos{
			.video-slider-wrapper{
				max-width : calc( 1320px + 2rem );
			}
			.swiper{
				display : grid;
				grid-template-rows : 1fr 48px auto 16px;
				grid-template-columns : 1fr 372px;
				column-gap : calc( ( 1580 - 1160 - 372 ) * 100% / 1580 );
			}
			.swiper-wrapper{
				grid-row : 1/-1;
				grid-column : 1 / -1;
			}
			.swiper-controller{
				grid-row : 3;
				grid-column : 2;
			}
			.video-left{
				flex-grow : 1;
				flex-shrink : 0;
				width : auto;
				> a{
					border-radius : 16px;
				}
			}
			.video-right{
				flex-shrink : 0;
				width : 372px;
				padding-bottom : 162px;
				.company-name{
					margin-top : 16px;
					font-size : 20px;
					line-height : calc( 24 / 20 );
				}
				.video-title{
					margin-top : 40px;
					font-size : 18px;
					line-height : calc( 30 / 18 );
				}
			}
			.swiper-controller{
				.video-slide__pagination{
					column-gap : 12px;
				}
				.video-slide__nav{
					height : 52px;
					margin-top : 32px;
					.video-swiper__prev{
						left : 108px;
					}
					.video-swiper__next{
						right : 108px;
					}
				}
			}
		}
	}
}

/* --------------------------------------------
SP MENUBOX
--------------------------------------------- */
#sp-menubox{
	@media ( 768px <= width < 1560px ){
		padding-inline : calc( 32 * 100% / 1560 );
		.global_navigation{
			padding-inline : 0;
		}
		.menu-content-wrapper{
			column-gap : calc( 32 * 100% / 1496 );
		}
	}
}

/* --------------------------------------------
SINGLE CAMPUS
--------------------------------------------- */
.single-curner-box .contents-box .single-sns-box li.x{
	background : black;
}

/* --------------------------------------------
SIDEBAR
--------------------------------------------- */
.campus_sidebar_container{
	@media print , screen and ( width > 768px ){
		.sidebar{
			> div:first-of-type{
				margin-top : 0;
			}
		}
	}
}

/* --------------------------------------------
FORM PARTS
--------------------------------------------- */
#single_materials{
	.form-dl{
		select{
			flex-shrink : 0;
			font-size : 1.125rem;
			line-height : 1.3333333333;
			border : 1px solid #cecece;
		}
	}
	input::placeholder{
		color : #868686 ! important;
	}
	.materials-wysiwyg{
		li span{
			color : var( --red02 );
		}
	}
	@media screen and ( width <= 768px ){
		.form-dl{
			select{
				width : 100%;
			}
		}
	}
	@media print , screen and ( width > 768px ){
		.form-dl{
			select{
				width : 24.4375rem;
			}
		}
	}
}

/* --------------------------------------------
ARCHIVE VIDEO
--------------------------------------------- */
.video-search{
	@media screen and ( width <= 768px ){
		.video-search-fields{
			display : block;
		}
		.video-search-form{
			.video-search-fields{
				.search-taxonomy{
					width : 100%;
					margin-top : 10px;
				}
				.search-button{
					width : 100%;
					margin-top : 24px;
				}
			}
		}
	}
}

/* --------------------------------------------
SINGLE VIDEO
--------------------------------------------- */
#single_videos{
	.video-category-tabs-scroll{
		width : 100%;
		max-width : inherit;
		padding-right : 0;
		overflow : visible;
	}
	.video-category-tabs{
		flex-wrap : wrap;
		inline-size : inherit;
	}
	@media print , screen and ( width > 768px ){
		.single_videos__head{
			display : block;
		}
		.video-search-fields{
			justify-content : end;
		}
		.search-box{
			width : auto;
		}
	}
}

/* --------------------------------------------
SIDEBAR
--------------------------------------------- */
.sidebar{
	.app-promo-icon{
		flex-shrink : 0;
		img{
			width : auto;
			height : 90px;
		}
	}
}

/* --------------------------------------------
CTA
--------------------------------------------- */
.top_cta{
	padding : 32px 24px;
	margin-top : 50px;
	line-height : 1.2;
	background : #f7f7f7;
	border : 3px solid #bd0e10;
	.cta_tit{
		padding : 10px 0 10px 45px;
		margin-bottom : 1em;
		font-size : 19px;
		font-weight : 700;
		color : #383838;
		background : url( "../images/campus/common/icon_ranking_crown.png" ) no-repeat left center / 38px auto;
	}
	.cta_tit span{
		display : inline-block;
		padding : .2em .5em;
		margin-left : .5em;
		font-size : 16px;
		font-weight : 600;
		background : #fff;
		border : 2px solid #bd0e10;
		border-radius : 1em;
	}
	ol{
		list-style : none;
	}
	li{
		padding-bottom : 1em;
		margin-bottom : 1em;
		border-bottom : 2px dashed #cbcbcb;
	}
	li:last-child{
		padding-bottom : 0;
		margin-bottom : 0;
		border-bottom : none;
	}
	li::before{
		content : none;
	}
	li span{
		box-sizing : border-box;
		display : inline-flex;
		align-items : center;
		justify-content : center;
		width : 35px;
		height : 35px;
		margin-right : 15px;
		font-size : 22px;
		font-weight : 500;
		line-height : 1;
		color : #fff;
		background : #bd0e10;
		border-radius : 50%;
	}
	li:nth-child( 4 ) span ,
	li:nth-child( 5 ) span{
		background : #4a4a4a;
	}
	li a{
		font-size : 22px;
		font-weight : 600;
		color : #2085d9 ! important;
		-webkit-text-decoration : underline;
		text-decoration : underline;
	}
	li a:hover{
		-webkit-text-decoration : none;
		text-decoration : none;
	}
	li p{
		padding-left : 50px;
		margin-bottom : 0 ! important;
		font-size : 16px ! important;
		font-weight : 600;
		line-height : 1.4 ! important;
		color : #383838;
	}
	@media screen and ( width <= 768px ){
		.cta_tit{
			background : url( "../images/campus/common/icon_ranking_crown.png" ) no-repeat left top .5em / 38px auto;
		}
		.cta_tit span{
			margin : .5em 0 0;
		}
	}
}
.btn_cta{
	margin : 30px 0;
	text-align : center;
	p{
		margin-bottom : 0 ! important;
		color : #676767;
	}
	p span{
		position : relative;
		display : inline-block;
		padding : 0 1em;
		font-size : 18px;
		font-weight : 600;
	}
	p span::before ,
	p span::after{
		position : absolute;
		top : 0;
		display : block;
		width : 2px;
		height : 1em;
		content : "";
		background : #676767;
	}
	p span::before{
		left : 0;
		transform : rotate( -30deg );
	}
	p span::after{
		right : 0;
		transform : rotate( 30deg );
	}
	.red{
		color : #bd0e10;
	}
	.note{
		font-size : 14px ! important;
	}
	.mockup_img{
		width : 80%;
	}
	a{
		position : relative;
		display : block;
		padding : 1em 3em 1em 1em;
		margin : .5em 2em;
		font-size : 22px;
		font-weight : 600;
		color : #fff ! important;
		border-radius : 2em;
		box-shadow : 0 2px 2px 0 rgb( 0 0 0 / .5 ) , inset 0 -3px 6px -2px rgb( 0 0 0 / .3 );
	}
	a:hover{
		opacity : .7;
	}
	a::before{
		position : absolute;
		top : 0;
		bottom : 0;
		right : 40px;
		display : block;
		width : 24px;
		height : 24px;
		margin : auto;
		content : "";
		background : #fff;
		border-radius : 50%;
	}
	a::after{
		position : absolute;
		top : 0;
		bottom : 0;
		right : 44px;
		display : block;
		width : 0;
		height : 0;
		margin : auto;
		content : "";
		border-style : solid;
		border-width : 7px 0 7px 12.1px;
	}
	.img_link{
		position : relative;
		display : block;
		padding : 0;
		margin : 0;
		border-radius : 0;
		box-shadow : none;
	}
	.img_link:hover{
		opacity : 1;
	}
	.img_link::before{
		content : none;
	}
	.img_link::after{
		content : none;
	}
	.btn_line{
		background : #06c755;
	}
	.btn_line::after{
		border-color : transparent transparent transparent #06c755;
	}
	.btn_01{
		background : #ed9623;
	}
	.btn_01::after{
		border-color : transparent transparent transparent #ed9623;
	}
	.btn_02{
		background : #bd0e10;
	}
	.btn_02::after{
		border-color : transparent transparent transparent #bd0e10;
	}
}

/* --------------------------------------------
MODULE
--------------------------------------------- */
.custom-pagination ul li a , .custom-pagination ul li{
	a , span{
		width : auto;
		aspect-ratio : 1;
	}
	@media screen and ( width <= 768px ){
		&.distance-2 , &.distance2{
			display : none;
		}
		span , a{
			height : calc( 38 * 100vw / 400 );
			font-size : calc( 12 * 100vw / 400 );
		}
	}
	@media print , screen and ( width > 768px ){
		a , span{
			height : 4rem;
		}
	}
}

/* --------------------------------------------
MATERIAL THANKS
--------------------------------------------- */
body.page-template-template-materials-thanks{
	.message{
		.btn-download{
			display : grid;
			place-items : center;
			margin-inline : auto;
			font-weight : 700;
			color : white;
			background-color : var( --red01 );
			border-radius : 100vmax;
		}
	}
	@media screen and ( width <= 768px ){
		.message{
			p{
				font-size : calc( 15 * 100vw / 400 );
				line-height : calc( 24 / 15 );
			}
			.btn-download{
				width : 100%;
				height : calc( 66 * 100vw / 400 );
				margin-top : calc( 24 * 100vw / 400 );
				font-size : calc( 15 * 100vw / 400 );
				line-height : calc( 24 / 15 );
			}
		}
	}
	@media print , screen and ( width > 768px ){
		.message{
			p{
				font-size : 18px;
				line-height : calc( 24 / 18 );
			}
			.btn-download{
				width : calc( 438 * 100% / 558 );
				height : 66px;
				margin-top : 24px;
				font-size : 15px;
				line-height : calc( 24 / 15 );
			}
		}
	}
}