@charset "utf-8";

body::before {
	--shift: min(100vw * 160 / 1200, 160px);
	content: "";
	position: fixed;
	inset: 0 0 auto;
	height: min(var(--cw) * 200 / var(--aspect), 200px);
	background: white;
	clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--shift)), 0 100%);
}
.l-header {
	--gap: min(100vw * 40 / 1200, 40px);
	position: fixed;
	inset: 0 0 auto;
	padding: var(--gap);
}
.l-header .logo {
	position: relative;
	width: min(50vw - 240px - var(--gap) * 2, 290px);
}
.l-main,
.l-footer {
	width: var(--cw);
}
@media screen and (min-width: 641px) {
	.l-main, .l-footer {
		width: 480px;
		margin: 0 auto;
	}
}
.l-main {
	overflow-x: hidden;
	position: relative;
	padding-inline: var(--sidegap);
	background: white;
}
.l-footer {
	display: grid;
	justify-items: center;
	row-gap: calc(var(--basisgap) * 1.4);
	padding: var(--sidegap);
	padding-top: calc(var(--basisgap) * 1.2);
	background: var(--yellow);
}
.l-footer .logo {
	width: calc(var(--cw) * 250 / var(--aspect));
}
.l-footer .copyright {
	--fontBasis: 9;
}
@media screen and (min-width: 641px) {
	.l-footer .logo {
		width: 250px;
	}
}
@media screen and (max-width: 640px) {
	.l-footer {
		padding-bottom: var(--sectiongap);
	}
}

.paragraph {
	--fontBasis: 13;
	line-height: 1.75;
	text-align: justify;
}
.note {
	--fontBasis: 10;
	line-height: 1.2;
}

:where(.image, .graph, .cgraph)[style*="--w"] > img,
:where(.image, .graph, .cgraph)[style*="--w"] .wrap > img {
	width: calc(var(--cw) * var(--w) / var(--aspect));
	max-width: none;
}
@media screen and (min-width: 641px) {
	:where(.image, .graph, .cgraph)[style*="--w"] > img,
	:where(.image, .graph, .cgraph)[style*="--w"] .wrap > img {
		width: calc(var(--w) * 1.28px);
	}
}

/* forSafari */
ruby rt {
	margin-top: -1em;
	translate: 0 -.5em;
}
@-moz-document url-prefix() {
	/* forFirefox */
	ruby rt {
		position: relative;
		top: .5em;
	}
}
/* 諦めて擬似要素で出す */
ruby rt {
	display: none;
}
ruby[data-rt] {
	position: relative;
}
ruby[data-rt]::after {
	speak: none;
	content: attr(data-rt);
	position: absolute;
	inset: auto 0 2.25em;
	font-size: 50%;
	white-space: nowrap;
}
ruby[data-rt="ワケ"]::after {
	letter-spacing: 1em;
	text-indent: .75em;
}
ruby[data-rt="あんしょう"]::after {
	text-indent: -.25em;
}

.cv {
	display: block;
	z-index: 3;
	position: fixed;
	right: 0;
	bottom: 8px;
	padding: .5em .75em .6em 1.5em;
	border: 2.5px solid currentcolor;
	border-radius: 3em 0 0 3em;
	border-right: 0;
	color: var(--blue);
	font-weight: 600;
	--fontBasis: 17.5;
	line-height: 1.3428571428571427;
	letter-spacing: .12rem;
	background: var(--yellow);
}
.cv svg {
	position: relative;
	top: -.12em;
	width: 4em;
	height: auto;
	margin-left: .25em;
	vertical-align: middle;
	filter: drop-shadow(.1em .1em 0 currentcolor);
}
img {
	-webkit-touch-callout: none;
	pointer-events: none;
}

/**
 * 受験対策に、国語をプラス。
 * -------------------------------------------------- */
.p-visual {
	display: grid;
	grid-template-rows: 2fr 3fr 4fr;
}
.p-visual .image {
	grid-area: 1 / 1 / 4 / 2;
	max-height: 100dvh;
	min-height: 625px;
	margin-inline: calc(var(--sidegap) * -1);
	--shift: min(var(--cw) * 50 / var(--aspect), 50px);
	clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--shift)), 0 100%);
}
.p-visual .image img {
	height: 100%;
	object-fit: cover;
	object-position: 50% 10%;
}
.p-visual :where(.logo, .lead, .copy) {
	z-index: 1;
	font-weight: 700;
}
.p-visual .logo {
	grid-area: 1 / 1;
	padding-top: calc(var(--basisgap) * 1.2);
}
.p-visual .logo img {
	width: 100%;
}
.p-visual .lead {
	grid-area: 2 / 1;
	justify-self: flex-start;
	margin-top: 1em;
	color: white;
	--fontBasis: 20;
	line-height: 1.4;
	writing-mode: vertical-rl;
	white-space: nowrap;
}
.p-visual .lead b {
	font-weight: inherit;
	font-size: 120%;
}
.p-visual .copy {
	grid-area: 3 / 1;
	margin-top: 1.25em;
	--fontBasis: 37;
	line-height: 1.6891891891891893;
	filter: drop-shadow(.16em .16em 0 white);
}
.p-visual .copy .l {
	display: inline-block;
	position: relative;
	padding: .1em .25em .2em;
	padding-right: 1em;
	line-height: 1;
	background: var(--yellow);
	clip-path: polygon(0 0, calc(100% - .5em) 0, 100% 50%, calc(100% - .5em) 100%, 0 100%);
}
.p-visual .copy .l:last-of-type {
	padding-right: .5em;
}

/**
 * 国語の受験対策、できていますか？
 * -------------------------------------------------- */
.p-intro {
	--shift: 4px;
	position: relative;
	margin-top: calc(var(--sectiongap) * .8);
	margin-left: calc(var(--sidegap) * -.4);
	padding: calc(var(--basisgap) * 1.5) var(--sidegap);
	border: .5px solid #0008;
	background: var(--grid) center top / calc(var(--basisgap) * .6);
	box-shadow:
		calc(var(--shift) - 1px) calc(var(--shift) - 1px) 0 white,
		var(--shift) var(--shift) 0 #0004,
		calc(var(--shift) * 2 - 1px) calc(var(--shift) * 2 - 1px) 0 white,
		calc(var(--shift) * 2) calc(var(--shift) * 2) 0 #0004,
		calc(var(--shift) * 3 - 1px) calc(var(--shift) * 3 - 1px) 0 white,
		calc(var(--shift) * 3) calc(var(--shift) * 3) 0 #0004;
}
.p-intro .subject {
	justify-self: center;
	margin-right: -.5em;
	--fontBasis: 38.3039;
	line-height: 1.5592981393539562;
	letter-spacing: .04rem;
}
.p-intro .subject strong {
	padding-top: .2em;
	font-weight: inherit;
	background: top left / 1em .5em repeat-x radial-gradient(circle, var(--red) .1em, transparent .1em);
}
.p-intro .paragraph {
	margin-top: 2em;
	font-weight: 700;
	--fontBasis: 13;
	line-height: 1.9230769230769231;
	letter-spacing: .12rem;
}
.p-intro .clip {
	position: absolute;
	width: calc(29 * 1.28px);
}
.p-intro .clip {
	position: absolute;
	top: -6px;
	left: var(--sidegap);
	width: calc(29 * 1.28px);
}
@media screen and (max-width: 640px) {
	.p-intro .clip {
		top: calc(var(--cw) * -4.5 / var(--aspect));
		width: calc(var(--cw) * 29 / var(--aspect));
	}
}

/**
 * 国語で点差をつけている！
 * -------------------------------------------------- */
.p-topic1 {
	--underline-blue: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="7" viewBox="0 0 20 7" preserveAspectRatio="none" style="fill:none;stroke:%23284896;stroke-width:2"><path d="M0,1h20M0,6h20"/></svg>');
	--underline-yellow: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="7" viewBox="0 0 20 7" preserveAspectRatio="none" style="fill:none;stroke:%23f9ec38;stroke-width:2"><path d="M0,1h20M0,6h20"/></svg>');
}
.p-topic1 .keyword {
	position: relative;
	width: fit-content;
	margin-top: var(--basisgap);
	font-weight: 500;
	--fontBasis: 14;
	line-height: 1.7142857142857142;
	letter-spacing: .12rem;
}
.p-topic1 .keyword strong {
	padding-bottom: .1em;
	font-size: 232.14285714285716%;
	background: url(../img/topic1_underline1.svg) left bottom / 100% calc(var(--basisgap) * .2) no-repeat;
}
.p-topic1 .keyword::after {
	content: "";
	position: absolute;
	top: -.5em;
	right: -1em;
	aspect-ratio: 65 / 73;
	width: calc(var(--basisgap) * 1.5);
	height: auto;
	background: url(../img/topic1_pipi.svg) center / cover no-repeat;
}
.p-topic1 .subject {
	margin-top: var(--basisgap);
	font-weight: 500;
	--fontBasis: 20;
	line-height: 1.4619559198139327;
	letter-spacing: .02rem;
}
.p-topic1 .subject b {
	font-size: 140%;
	background: linear-gradient(to top, var(--yellow) .25em, transparent .25em);
}
.topic1_column {
	margin-top: calc(var(--basisgap) / 2);
	margin-left: calc(var(--sidegap) * -.2);
	padding: var(--basisgap) var(--sidegap);
	border: 1.5px solid black;
	border-top-right-radius: calc(var(--basisgap) / 2);
	border-bottom-right-radius: calc(var(--basisgap) / 4);
	border-bottom-left-radius: calc(var(--basisgap) / 4);
	background: var(--yellow);
	box-shadow: calc(var(--basisgap) / 4) calc(var(--basisgap) / 4) 0 var(--blue);
}
.p-topic1 .column_subject {
	display: flex;
	align-items: baseline;
	column-gap: 1em;
	padding-bottom: calc(var(--basisgap) / 2);
	background: var(--separator) left bottom / 15px 3px repeat-x;
	--fontBasis: 13;
	line-height: 1.2;
	letter-spacing: .12rem;
}
.p-topic1 .column_subject:nth-of-type(2) {
	margin-top: var(--basisgap);
}
.p-topic1 .column_subject b {
	z-index: 0;
	position: relative;
	padding: .4em .5em .5em;
	color: white;
	font-size: 137.17923076923078%;
}
.p-topic1 .column_subject b::before,
.p-topic1 .column_subject b::after {
	content: "";
	z-index: -1;
	position: absolute;
	inset: 0;
	border-radius: .2em;
	background: var(--blue);
}
.p-topic1 .column_subject b::before {
	inset: .2em -.2em -.2em .2em;
	border: 1.5px solid black;
	border-radius: .25em;
	background: white;
}
.p-topic1 .column_subject small {
	position: relative;
	top: .2em;
}
.topic1_column .graph {
	margin-top: calc(var(--basisgap) / 1.5);
	text-align: center;
}
.topic1_note {
	margin-top: 1.5em;
	--fontBasis: 10;
	line-height: 1.5;
	letter-spacing: .12rem;
}
/* そうはいっても */
.topic1_question {
	padding-block: calc(var(--sectiongap) * .8) var(--sectiongap);
	text-align: center;
	background: url(../img/bg_symbol.svg) 100% 50% / 80% auto no-repeat;
}
.topic1_question p {
	--fontBasis: 21;
	line-height: 1.9285714285714286;
	letter-spacing: .12rem;
}
.topic1_question .blue {
	padding-bottom: .2em;
	background: var(--underline-blue) left bottom / 1em .3em repeat-x;
}
.topic1_question .yellow {
	padding-bottom: .3em;
	background: var(--underline-yellow) left bottom / 1em .3em repeat-x;
}
.topic1_answer {
	margin-left: calc(var(--sidegap) * -.25);
	padding: var(--basisgap) var(--sidegap);
	border: 1.5px solid black;
	border-radius: 1em;
	text-align: center;
	background: var(--yellow);
	box-shadow: calc(var(--basisgap) / 4) calc(var(--basisgap) / 4) 0 var(--blue);
}
.topic1_answer .answer {
	position: relative;
	width: fit-content;
	margin-inline: auto;
	color: var(--blue);
	font-weight: 700;
	--fontBasis: 60;
	line-height: 1;
	letter-spacing: .12rem;
}
.topic1_answer .answer img {
	position: absolute;
	top: .36em;
	left: calc(100% + .12em);
	width: .27em;
	rotate: 30deg;
}
.topic1_answer .answer + p {
	margin-top: 1.5em;
	letter-spacing: .075rem;
}
.topic1_answer p {
	font-weight: 700;
	--fontBasis: 16;
	line-height: 1.84375;
}
.topic1_answer p .red {
	background: linear-gradient(to top, var(--red) .15em, transparent .15em);
}
.topic1_answer p .white {
	font-weight: inherit;
	background: linear-gradient(to top, white .5em, transparent .5em);
}
/* 事実 */
.topic1_answer strong {
	font-size: 156.25%;
	letter-spacing: .12rem;
}
.topic1_answer .note {
	font-weight: 500;
	--fontBasis: 12.5;
	letter-spacing: .06rem;
}
.topic1_answer + .arr {
	display: block;
	width: 118;
	height: auto;
	margin: calc(var(--sectiongap) / 1.75) auto;
	fill: var(--blue);
}
/* 国語の事実 */
.topic1_sections .section_subject {
	--w: calc(190px * 1.28);
	--h: calc(264px * 1.28);
}
@media screen and (max-width: 640px) {
	.topic1_answer + .arr {
		width: calc(var(--cw) * 118 / var(--aspect));
	}
	.p-topic1 .section_subject {
		--w: calc(var(--cw) * 190 / var(--aspect));
		--h: calc(var(--cw) * 264 / var(--aspect));
	}
}
.p-topic1 .section_subject .num {
	font-size: 128.33723304925546%;
	text-combine-upright: all;
}
.topic1_sections {
	margin-inline: calc(var(--sidegap) * -1);
	border-block: .25px solid var(--blue);
	background: var(--wallpaper) center top / calc(var(--basisgap) * .75) calc(var(--basisgap) * .2);
}
.topic1_sections section {
	display: grid;
	padding: var(--basisgap) var(--sidegap);
	padding-bottom: calc(var(--basisgap) * 2);
	background: url(../img/topic1_bg1.svg) center / contain no-repeat;
}
.topic1_sections .section1 {
	padding-top: 0;
	background-position: center 42%;
}
.topic1_sections .section2 {
	background-image: url(../img/topic1_bg2.svg);
}
.topic1_sections .section3 {
	background-image: url(../img/topic1_bg3.svg);
}
.topic1_sections .section_subject {
	grid-area: 1 / 1;
	width: fit-content;
	height: var(--h);
	margin-top: calc(var(--basisgap) * -1);
	padding: 2em 1.1em 0;
	--fontBasis: 26.8823;
	writing-mode: vertical-rl;
	font-feature-settings: normal;
}
.topic1_sections :is(.section1, .section3) .section_subject {
	margin-left: calc(var(--sidegap) * -1);
	background: url(../img/bg_book_left.svg) right bottom / var(--w) 100% no-repeat;
}
.topic1_sections .section2 .section_subject {
	justify-self: flex-end;
	grid-column: 2;
	margin-right: calc(var(--sidegap) * -1);
	background: url(../img/bg_book_right.svg) left bottom / var(--w) 100% no-repeat;
}
.topic1_sections .cgraph {
	grid-area: 1 / 2;
	margin-top: var(--basisgap);
	margin-right: calc(var(--sidegap) * -1 - var(--basisgap));
	margin-left: calc(var(--basisgap) * -.5);
}
.topic1_sections .section2 .cgraph {
	grid-column: 1;
	margin-right: calc(var(--basisgap) * -.5);
	margin-left: calc(var(--sidegap) * -1 - var(--basisgap));
}
.topic1_sections section :is(.arr, .sub, .note, .graph) {
	grid-column: span 2;
}
.topic1_sections .arr {
	justify-self: center;
	width: calc(var(--basisgap) * 1.2);
	height: auto;
	fill: white;
}
.topic1_sections .sub {
	margin-right: -.5em;
	color: white;
	--fontBasis: 27.5;
	line-height: 1.5818181818181818;
	letter-spacing: 0;
	text-shadow: .1em .1em 0 var(--blue);
}
.topic1_sections .section1 .sub {
	margin-top: -.5em;
}
.topic1_sections .sub .under {
	padding-bottom: .15em;
	background: linear-gradient(to top, var(--yellow) .25em, transparent .25em);
}
.topic1_sections .note {
	margin-top: 1em;
	color: white;
	--fontBasis: 9;
	line-height: 1.2;
	letter-spacing: .12rem;
}
.topic1_sections .cgraph {
	display: grid;
	place-items: center;
}
.topic1_sections .cgraph img {
	grid-area: 1 / 1;
}
.topic1_sections .cgraph figcaption {
	grid-area: 1 / 1;
	--fontBasis: 15;
	line-height: 1.3333333333333333;
	letter-spacing: .075rem;
}
.topic1_sections .cgraph figcaption strong {
	font-weight: inherit;
	font-size: 143.01333333333335%;
	line-height: 1;
	letter-spacing: .12rem;
}
.topic1_sections .cgraph figcaption .num {
	font-size: 251.7243147492075%;
}
.topic1_sections .cgraph figcaption .unit {
	font-size: 172.4137609546895%;
}
.topic1_sections .graph {
	margin-top: calc(var(--basisgap) / 2);
	padding: calc(var(--basisgap) * .5);
	border: 1.5px solid black;
	border-radius: 1em;
	background: white;
}
.topic1_sections .graph .wrap {
	position: relative;
}
.topic1_sections .graph .check {
	position: absolute;
	top: calc(var(--y) * 1.28px);
	left: calc(var(--x) * 1.28px);
	width: calc(var(--w) * 1.28px);
	height: calc(var(--h) * 1.28px);
	border: 3px solid var(--red);
	--fontBasis: 9;
	background: #da000044;
}
@media screen and (max-width: 640px) {
	.topic1_sections .graph .check {
		top: calc(var(--cw) * var(--y) / var(--aspect));
		left: calc(var(--cw) * var(--x) / var(--aspect));
		width: calc(var(--cw) * var(--w) / var(--aspect));
		height: calc(var(--cw) * var(--h) / var(--aspect));
	}
}
.topic1_sections .section1 .graph .check {
	--x: 141.0051;
	--y: 108.6765;
	--w: 109.116;
	--h: 51.3255;
}
.topic1_sections .section2 .graph .check {
	--x: 106.7882;
	--y: 72.0732;
	--w: 165.1888;
	--h: 105.7466;
}
.topic1_sections .section3 .graph .check {
	--x: 211.6974;
	--y: 106.7563;
	--w: 62.0744;
	--h: 51.7372;
}
.topic1_sections .graph .check::before {
	content: "";
}
.topic1_sections .graph .check .label {
	position: absolute;
	padding: .1em .75em .2em;
	color: white;
	font-weight: 700;
	text-transform: uppercase;
	background: var(--blue);
}
.topic1_sections .section1 .graph .check .label {
	left: 92%;
	bottom: 20%;
	rotate: -12deg;
}
.topic1_sections .section2 .graph .check .label {
	left: 84%;
	bottom: 16%;
	rotate: -12deg;
}
.topic1_sections .section3 .graph .check .label {
	right: 86%;
	top: 64%;
	rotate: -12deg;
}
.topic1_sections :is(.section1, .section2) .graph .check .label {
	padding-left: 1.25em;
	clip-path: polygon(0 50%, 1em 0, 100% 0, 100% 100%, 1em 100%);
}
.topic1_sections .section3 .graph .check .label {
	padding-right: 1.25em;
	clip-path: polygon(0 0, calc(100% - 1em) 0, 100% 50%, calc(100% - 1em) 100%, 0 100%);
}
/* これらは */
.topic1_result {
	margin-top: var(--basisgap);
	margin-inline: calc(var(--sidegap) * -1);
	padding: 0 var(--sidegap);
	padding-bottom: 410px;
	background: url(../img/bg_stationery.svg) center bottom / contain no-repeat;
}
.topic1_result p {
	font-weight: 700;
	--fontBasis: 18;
	line-height: 1.4444444444444444;
	text-align: center;
	letter-spacing: .1rem;
}
.topic1_result p b {
	font-weight: inherit;
	font-size: 119.44444444444444%;
}
.topic1_result p em {
	background: var(--yellow);
}
.topic1_result p strong {
	font-weight: inherit;
	font-size: 222.22222222222223%;
	letter-spacing: .12rem;
}
.topic1_result p .num {
	font-weight: 700;
	color: var(--blue);
	font-size: 162.5%;
	text-shadow: .05em .05em 0 var(--yellow);
	background: url(../img/topic1_underline2.svg) left bottom .06em / 100% .12em no-repeat;
}
.topic1_result p .small {
	font-size: 72.22222222222222%;
	letter-spacing: .12rem;
}
@media screen and (max-width: 640px) {
	.topic1_result {
		padding-bottom: calc(var(--sectiongap) * 2.7);
	}
}

/**
 * なぜ「入試の国語」はむずかしい？
 * -------------------------------------------------- */
.p-topic2 {
	position: relative;
}
.p-topic2 .q {
	position: absolute;
	top: calc(var(--sectiongap) * -1.94);
	right: 0;
	width: calc(101 * 1.28px);
}
.topic2_pickup {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-top: calc(var(--sectiongap) * 1.4);
	padding-bottom: calc(var(--basisgap) * 1.2);
	border: 1.5px solid var(--blue);
	border-radius: calc(var(--basisgap) * .45);
	border-top-left-radius: 0;
	text-align: center;
	background: var(--dots) center / calc(var(--basisgap) * .4);
	box-shadow: 0 calc(var(--basisgap) / 4) 0 var(--blue);
}
@media screen and (max-width: 640px) {
	.p-topic2 .q {
		width: calc(var(--cw) * 101 / var(--aspect));
	}
}
.topic2_pickup .image {
	--shift: calc(var(--basisgap) * .425);
	z-index: 0;
	align-self: flex-start;
	position: relative;
	width: fit-content;
	margin-top: calc(var(--sectiongap) * -1.2);
	margin-left: calc(var(--sidegap) * -1 - 1.5px);
}
.topic2_pickup .image > img,
.topic2_pickup .image::before {
	border: 7.5px solid var(--blue);
	border-left: 0;
	border-top-right-radius: calc(var(--basisgap) * 2);
}
.topic2_pickup .image::before {
	content: "";
	z-index: -1;
	position: absolute;
	inset: var(--shift) calc(var(--shift) * -1) calc(var(--shift) * -1) 0;
	background: var(--yellow);
}
.topic2_pickup .image figcaption {
	position: absolute;
	left: 70%;
	bottom: 15%;
	width: calc(139 * 1.28px);
	rotate: -6deg;
}
@media screen and (max-width: 640px) {
	.topic2_pickup .image figcaption {
		width: calc(var9--cw) * 139 / var9--aspect));
	}
}
.topic2_pickup .image figcaption svg {
	width: 100%;
	height: auto;
}
.topic2_pickup .subject {
	margin-top: var(--basisgap);
	color: var(--blue);
	--fontBasis: 33.4999;
	line-height: 1.456753602249559;
	rotate: -4deg;
	text-align: left;
}
.topic2_pickup .subject .under {
	background: linear-gradient(to top, var(--yellow) .4em, transparent .4em);
}
.topic2_pickup .lead {
	margin-top: 1.25em;
	--fontBasis: 20;
	line-height: 1.375;
	letter-spacing: .12rem;
}
.topic2_pickup .lead em {
	padding-bottom: .2em;
	background: url(../img/topic2_underline1.svg) left bottom / 100% .3em no-repeat;
}
.topic2_pickup .arr {
	margin-top: calc(var(--basisgap) * .7);
	width: calc(var(--basisgap) * 1.2);
	height: auto;
	fill: var(--blue);
}
.topic2_pickup .result {
	margin-top: .5em;
	--fontBasis: 21;
	line-height: 1.5238095238095237;
	letter-spacing: .12rem;
}
.topic2_pickup .result b {
	color: var(--blue);
	font-weight: inherit;
	font-size: 116.66666666666667%;
}
.topic2_pickup .note {
	--fontBasis: 9;
	letter-spacing: .06rem;
}
.topic2_pickup .button {
	z-index: 0;
	position: relative;
	margin-top: 1em;
	padding: .5em 1.5em .7em;
	color: var(--blue);
	font-weight: 700;
	--fontBasis: 22.5;
}
.topic2_pickup .button::before {
	content: "";
	z-index: -1;
	position: absolute;
	inset: 0;
	border: 1.5px solid currentcolor;
	border-radius: 3em;
	box-shadow: .25em .25em 0 currentcolor;
	background: var(--yellow);
}
@media (hover) {
	.topic2_pickup .button::before {
		transition: scale .4s var(--easeOut);
	}
	.topic2_pickup .button:hover::before {
		scale: 1.02 1.06;
		transition-duration: .2s;
		transition-timing-function: var(--easeBack);
	}
	.topic2_pickup .button:active::before {
		scale: .98 .94;
		transition-duration: .1s;
	}
}
/* 声でつかむ/筋をつかむ/出題意図をつかむ */
.topic2_list {
	margin-top: calc(var(--sectiongap) / 2);
	margin-inline: calc(var(--sidegap) * -1);
	font-weight: 500;
	--fontBasis: 41;
	line-height: 1.2;
}
.topic2_list li {
	position: relative;
	width: fit-content;
	margin-inline: auto;
	margin-bottom: calc(var(--basisgap) * 1.6);
	background: linear-gradient(to top, var(--yellow) .4em, transparent .4em);
}
.topic2_list :is(li:nth-child(1), li:nth-child(2))::after {
	content: "";
	position: absolute;
	inset: 100% 0 0;
	width: var(--w);
	height: var(--h);
	margin-inline: auto;
	background: var(--arrow) center bottom / var(--w) var(--h) no-repeat;
}
.topic2_list li:nth-child(1) {
	--w: calc(21 * 1.28px);
	--h: calc(62 * 1.28px);
	--arrow: url(../img/topic2_arrow1.svg);
	font-size: 120.15414634146342%;
	letter-spacing: .02rem;
}
.topic2_list li:nth-child(2) {
	--w: calc(23 * 1.28px);
	--h: calc(53 * 1.28px);
	--arrow: url(../img/topic2_arrow2.svg);
	font-size: 120.15414634146342%;
	letter-spacing: .06rem;
}
@media screen and (max-width: 640px) {
	.topic2_list li:nth-child(1) {
		--w: calc(var(--cw) * 21 / var(--aspect));
		--h: calc(var(--cw) * 62 / var(--aspect));
	}
	.topic2_list li:nth-child(2) {
		--w: calc(var(--cw) * 23 / var(--aspect));
		--h: calc(var(--cw) * 53 / var(--aspect));
	}
}
.topic2_list li:nth-child(3) {
	letter-spacing: -.06rem;
}
.topic2_brackets {
	position: relative;
	width: fit-content;
	margin: var(--basisgap) auto 0;
	padding: calc(var(--basisgap) * .5) var(--basisgap);
	--fontBasis: 27;
	line-height: 1.3;
	letter-spacing: .06rem;
	text-align: center;
}
.topic2_brackets::before,
.topic2_brackets::after {
	content: "";
	position: absolute;
	width: 60%;
	height: var(--basisgap);
	border: 2.5px solid black;
}
.topic2_brackets::before {
	inset: 0 0 auto auto;
	border-bottom: 0;
	border-left: 0;
	border-top-right-radius: var(--basisgap);
}
.topic2_brackets::after {
	inset: auto auto 0 0;
	border-top: 0;
	border-right: 0;
	border-bottom-left-radius: var(--basisgap);
}
.topic2_brackets .small {
	font-size: 94.78518518518518%;
	letter-spacing: .12rem;
}
.topic2_brackets strong {
	position: relative;
	padding-bottom: .1em;
	font-weight: inherit;
	font-size: 139.0185185185185%;
	letter-spacing: .12rem;
	background: url(../img/topic2_underline2.svg) left bottom / 100% .25em no-repeat;
}
.topic2_brackets strong::before,
.topic2_brackets strong::after {
	content: "";
	position: absolute;
	width: calc(var(--w) * .64px);
	height: calc(var(--h) * .64px);
	background: var(--img) center / cover no-repeat;
}
.topic2_brackets strong::before {
	--w: 92;
	--h: 63;
	--img: url(../img/book.svg);
	bottom: 54%;
	right: 96%;
}
.topic2_brackets strong::after {
	--w: 82;
	--h: 62;
	--img: url(../img/glasses.svg);
	bottom: 50%;
	left: 98%;
}
.topic2_brackets b {
	display: inline-block;
	margin-top: .3em;
	color: var(--red);
}
.topic2_balloon {
	z-index: 0;
	position: relative;
	width: fit-content;
	margin: var(--basisgap) auto 0;
	padding: calc(var(--basisgap) / 2) var(--basisgap);
	--tail: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="16" viewBox="0 0 14 16"><polyline fill="white" points="1 16.5 1 15.47 7 1.5 13 15.47 13 16.5"/><polyline style="fill:none;stroke:%23284896" points="0 15.47 1 15.47 7 1.5 13 15.47 14 15.47"/></svg>');
}
.topic2_balloon::before,
.topic2_balloon::after {
	content: "";
	--shift: calc(var(--basisgap) * .25);
	z-index: -1;
	position: absolute;
	inset: 0;
	border: 1.5px solid black;
	border-radius: calc(var(--basisgap) / 4);
}
.topic2_balloon::before {
	inset: var(--shift) calc(var(--shift) * -1) calc(var(--shift) * -1) var(--shift);
	background: var(--yellow);
}
.topic2_balloon::after {
	background: white;
}
.topic2_balloon .paragraph {
	--fontBasis: 13;
	text-align: center;
	letter-spacing: .12rem;
}
.topic2_balloon .paragraph::after {
	content: "";
	position: absolute;
	bottom: calc(100% - 1.6px);
	left: calc(50% - .6em);
	width: 1.2em;
	height: 1.5em;
	background: var(--tail) center / cover no-repeat;
}
.topic2_balloon .paragraph strong {
	font-weight: inherit;
	font-size: 134.61538461538463%;
}
.topic2_balloon .paragraph .under {
	background: linear-gradient(to top, var(--red) .15em, transparent .15em);
}
.topic2_balloon .paragraph .small {
	font-size: 92.30769230769231%;
}

/**
 * モーダルの中身
 * -------------------------------------------------- */
.topic2_detail {
	display: flex;
	flex-direction: column;
	padding: var(--basisgap) var(--sidegap);
}
.topic2_detail .photo {
	display: grid;
	justify-items: center;
}
.topic2_detail .photo img {
	width: calc(150 * 1.28px);
	border: 3.3444px solid var(--blue);
	border-radius: 50%;
	box-shadow: .2em .2em 0 var(--blue);
}
@media screen and (max-width: 640px) {
	.topic2_detail .photo img {
		width: calc(var(--cw) * 150 / var(--aspect));
	}
}
.topic2_detail .profile {
	margin-top: 1em;
	font-weight: 600;
	--fontBasis: 11.5;
	line-height: 1.4782608695652173;
}
.topic2_detail .profile b {
	font-weight: inherit;
	font-size: 152.17391304347827%;
}
.topic2_detail .profile span {
	display: inline-block;
	margin-top: .25em;
}
.topic2_detail .detail_title {
	align-self: center;
	margin-top: .5em;
	margin-inline: calc(var(--sidegap) * -1);
	color: var(--blue);
	font-weight: 600;
	--fontBasis: 35;
	line-height: 1.394322857142857;
}
.topic2_detail .detail_title .under {
	background: linear-gradient(to top, var(--yellow) .4em, transparent .4em);
}
.topic2_detail .paragraph {
	margin-top: 2em;
	--fontBasis: 12;
	line-height: 2.0833333333333335;
}

/**
 * 声でつかむ/筋をつかむ/出題意図をつかむ
 * -------------------------------------------------- */
.topic2_section {
	z-index: 0;
	position: relative;
	margin-top: var(--sectiongap);
}
.topic2_section::before {
	content: "";
	z-index: -1;
	position: absolute;
	inset: calc(var(--basisgap) * -1) calc(var(--sidegap) * -1) auto;
	height: calc(var(--sectiongap) * 1.4);
	background: var(--yellow);
	transform: skewY(-14deg);
}
.topic2_section.section2::before {
	transform: skewY(14deg);
}
.topic2_section.section1 {
	--themecolor: var(--green);
	--tag: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 30.2 30.2" preserveAspectRatio="none" fill="%2300a45c"><path d="M1.65.41L.09,13.88c-.07.61-.07,1.67,0,2.28l1.56,13.44c.03.26.07.41.11.41h28.28V0H1.76s-.08.15-.11.41Z"/><path vector-effect="non-scaling-stroke" style="fill:none;stroke:%23353535;stroke-linecap:round;stroke-width:.4" d="M.09,16.16l1.56,13.44c.03.26.07.41.11.41h28.28V.29"/></svg>');
}
.topic2_section.section2 {
	--themecolor: var(--orange);
	--tag: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 30.2 30.2" preserveAspectRatio="none" fill="%23ff7f2c"><path d="M1.65.41L.09,13.88c-.07.61-.07,1.67,0,2.28l1.56,13.44c.03.26.07.41.11.41h28.28V0H1.76s-.08.15-.11.41Z"/><path vector-effect="non-scaling-stroke" style="fill:none;stroke:%23353535;stroke-linecap:round;stroke-width:.4" d="M.09,16.16l1.56,13.44c.03.26.07.41.11.41h28.28V.29"/></svg>');
}
.topic2_section.section3 {
	--themecolor: var(--blue);
	--tag: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 30.2 30.2" preserveAspectRatio="none" fill="%23284896"><path d="M1.65.41L.09,13.88c-.07.61-.07,1.67,0,2.28l1.56,13.44c.03.26.07.41.11.41h28.28V0H1.76s-.08.15-.11.41Z"/><path vector-effect="non-scaling-stroke" style="fill:none;stroke:%23353535;stroke-linecap:round;stroke-width:.4" d="M.09,16.16l1.56,13.44c.03.26.07.41.11.41h28.28V.29"/></svg>');
}
.topic2_section.section2 .heading {
	width: fit-content;
	margin-left: auto;
}
.topic2_section .title {
	width: fit-content;
	padding-bottom: .2em;
	--fontBasis: 49.2632;
	line-height: 1.2;
	letter-spacing: .02rem;
	background: url(../img/topic2_underline3.svg) left bottom / 100% .2em no-repeat;
}
.topic2_section .lead {
	margin-top: 1em;
	--fontBasis: 18;
	line-height: 1.5;
	letter-spacing: .08rem;
}
.question_subject {
	--fontBasis: 20;
	line-height: 1;
	letter-spacing: .06rem;
}
.topic2_section .image {
	margin-top: calc(var(--basisgap) / 2);
	text-align: center;
}
.topic2_section .image img {
	width: var(--w);
}
@media screen and (max-width: 640px) {
	.topic2_section .image img {
		width: calc(var(--cw) * var(--w) * .8 / var(--aspect));
	}
}
/* 例えば、こんな入試問題 */
.topic2_question {
	overflow: hidden;
	margin-top: var(--basisgap);
	padding: calc(var(--basisgap) / 2);
	padding-top: var(--basisgap);
	padding-bottom: 0;
	border: 1.5px solid var(--blue);
	border-radius: calc(var(--basisgap) / 2);
}
.topic2_question .cite {
	position: relative;
	margin: 1.5em 10% 0;
	padding: .5em;
	border-radius: 3em;
	border: calc(var(--basisgap) / 4) solid white;
	color: white;
	--fontBasis: 10;
	line-height: 1.6;
	letter-spacing: .06rem;
	text-align: center;
	background: var(--themecolor);
}
.topic2_question .ex {
	margin-top: calc(var(--basisgap) * -.85 - var(--basisgap) / 4);
	padding: calc(var(--basisgap) / 2);
	padding-top: calc(var(--basisgap) * 1.15);
	border: 1.5px solid var(--blue);
	border-radius: calc(var(--basisgap) / 4);
	--fontBasis: 12;
	letter-spacing: .12rem;
}
.topic2_question .ex dt {
	font-size: 112%;
	letter-spacing: .02rem;
}
.topic2_question .ex dd {
	margin-top: .5em;
}
.topic2_question .ex dd[data-label] {
	display: flex;
	column-gap: .5em;
}
.topic2_question .ex dd[data-label]::before {
	content: "（" attr(data-label) "）";
	font-size: 92.85714285714286%;
}
.topic2_question .memo {
	position: relative;
	margin-top: calc(var(--basisgap) / 2);
	margin-inline: calc(var(--basisgap) / -2);
	padding: 1.5em 1em;
	--fontBasis: 13;
	line-height: 1.6666666666666667;
	letter-spacing: .12rem;
	text-align: center;
	background: var(--yellow);
}
.topic2_question .memo em {
	background: linear-gradient(to top, white .5em, transparent .5em);
}
.topic2_question .memo::before {
	content: "";
	position: absolute;
	inset: -1.5px 0 auto;
	height: 3px;
	background: var(--separator) left top / 15px 3px repeat-x;
}
.topic2_section > .arr {
	display: block;
	margin: calc(var(--basisgap) * -.4) auto 0;
	fill: var(--themecolor);
}
/* そんな課題には、このトレーニングが有効！ */
.topic2_answer {
	margin-top: calc(var(--basisgap) * 1.5);
	margin-left: calc(var(--sidegap) * -1);
	background: #f2f2f2;
	box-shadow: .4em .4em 0 var(--themecolor);
}
.answer_subject {
	width: fit-content;
	position: relative;
	top: -1.6em;
	margin-left: var(--sidegap);
	padding: .3em 1.2em .4em 1.6em;
	color: white;
	--fontBasis: 13.5;
	line-height: 1.6521652173913044;
	rotate: -2.571deg;
	background: var(--tag) left top / 100% 100% no-repeat;
}
.topic2_answer {
	position: relative;
}
.topic2_answer::before {
	content: "";
	position: absolute;
	inset: var(--sidegap) 0 var(--sidegap) var(--sidegap);
	width: 1em;
	background: top left / 1em 1.9em repeat-y radial-gradient(circle, white 40%, transparent 40%);
}
.topic2_answer .ex {
	padding: calc(var(--basisgap) / 2);
	padding-top: 0;
	padding-left: calc(var(--basisgap) + var(--sidegap));
	--fontBasis: 13.5;
	line-height: 2;
	letter-spacing: .1rem;
}
.topic2_answer .ex dt {
	width: fit-content;
	font-weight: 700;
	font-size: 140%;
	line-height: 1.8857142857142857;
	background: linear-gradient(to top, #9e9e9f .5px, transparent .5px);
}
.topic2_answer .ex dd {
	margin-top: .5em;
	padding-bottom: .5px;
	background: linear-gradient(to top, #9e9e9f .5px, transparent .5px);
	background-size: calc(1em * 2) calc(1em * 2); /* 1lh 1lh */
}
.topic2_answer .clip {
	position: absolute;
	top: -8px;
	right: calc(var(--sidegap) / 2);
	width: calc(23 * 1.28px);
	height: auto;
	fill: var(--themecolor);
}
@media screen and (max-width: 640px) {
	.topic2_answer .clip {
		top: calc(var(--cw) * -7 / var(--aspect));
		width: calc(var(--cw) * 23 / var(--aspect));
	}
}

/**
 * POINT
 * -------------------------------------------------- */
.topic2_point {
	display: flex;
	flex-direction: column;
	position: relative;
	margin-top: calc(var(--sectiongap) * 1.5);
	margin-inline: calc(var(--sidegap) * -.5);
	padding: var(--basisgap) var(--sidegap);
	padding-top: 0;
	border: 2.7703px solid var(--blue);
	border-radius: calc(var(--basisgap) / 2);
	background: var(--yellow);
}
.topic2_point .balloon {
	display: grid;
	place-items: center;
	position: absolute;
	bottom: calc(100% + 1em);
	left: 1em;
	aspect-ratio: 129 / 47;
	width: calc(129 * 1.28px);
	height: auto;
	padding-bottom: .7em;
	color: white;
	--fontBasis: 15;
	line-height: 1.2;
	text-transform: uppercase;
	background: url(../img/point.svg) center / 100% 100% no-repeat;
	transform-origin: left bottom;
	rotate: -6deg;
}
@media screen and (max-width: 640px) {
	.topic2_point .balloon {
		width: calc(var(--cw) * 129 / var(--aspect));
	}
}
.topic2_point .subject {
	align-self: center;
	position: relative;
	margin-top: calc(.5em * -1.4545454545454546); /* .5lh */
	margin-inline: -.5em;
	--fontBasis: 22;
	line-height: 1.4545454545454546;
	letter-spacing: .12em;
	background: linear-gradient(to top, var(--blue) 1.5px, transparent 1.5px);
}
.topic2_point .subject span {
	background: linear-gradient(to top, transparent .1em, white .1em, white calc(100% - .2em), transparent calc(100% - .2em));
}
.topic2_point .subject img {
	position: absolute;
	bottom: 0;
	left: calc(100% - .25em);
	width: .5em;
	transform-origin: center bottom;
	rotate: 40deg;
}
.topic2_point .paragraph {
	margin-top: 1em;
	--fontBasis: 13;
	line-height: 1.9230769230769231;
	letter-spacing: .1em;
}
.topic2_point .paragraph em {
	background: linear-gradient(to top, white .5em, transparent .5em);
}
.topic2_point .note {
	margin-top: .5em;
	--fontBasis: 10.5;
	line-height: 1.7142857142857142;
	letter-spacing: .1em;
}
.point_case {
	margin-top: var(--basisgap);
	margin-inline: calc(var(--sidegap) * -.5);
	padding-top: calc(var(--basisgap) / 1.5);
	border: 1.638px solid var(--blue);
	border-radius: calc(var(--basisgap) / 2);
	text-align: center;
}
.point_case .label {
	margin-inline: -.5em;
	--fontBasis: 30.5;
	line-height: 1.1475409836065573;
	letter-spacing: .02em;
}
.point_case .note {
	margin-top: 0;
	--fontBasis: 13;
	letter-spacing: .06em;
}
.point_case hr {
	width: 100%;
	height: calc(var(--basisgap) * 1.4);
	margin: 0;
	border: 0;
	background: url(../img/hr_line.svg) center / contain no-repeat;
	filter: drop-shadow(.25em .25em 0 white);
}
.topic2_point .graph {
	position: relative;
	margin-top: calc(var(--basisgap) / 3);
	padding: calc(var(--basisgap) / 1.5) 0;
	border-top: 1.638px solid black;
	border-radius: 0 0 calc(var(--basisgap) / 2) calc(var(--basisgap) / 2);
	background: white var(--grid-dark) center top / calc(var(--basisgap) * .4);
}
.topic2_point .graph :where(.circle, .arrow) {
	position: absolute;
	height: auto;
}
.topic2_point .graph .circle {
	top: 24%;
	left: 45%;
	width: calc(66 * 1.28px);
}
.topic2_point .graph .arrow {
	top: 43%;
	left: 65%;
	width: calc(86 * 1.28px);
}
@media screen and (max-width: 640px) {
	.topic2_point .graph .circle {
		width: calc(var(--cw) * 66 / var(--aspect));
	}
	.topic2_point .graph .arrow {
		width: calc(var(--cw) * 86 / var(--aspect));
	}
}
.topic2_point .graph img {
	box-sizing: content-box;
	padding: 1em;
	border: 2.5px solid black;
	border-radius: 1em;
	box-shadow: .2em .2em 0 black;
	background: white;
}
.topic2_point .advice {
	margin-top: var(--basisgap);
	--fontBasis: 16;
	line-height: 1.875;
	letter-spacing: .12em;
	text-align: center;
}
.topic2_point .advice :where(.l1, .l2, .l3) {
	padding-bottom: .2em;
	background: url(../img/point_underline1.svg) left bottom / 100% .4em no-repeat;
}
.topic2_point .advice .l2 {
	background-image: url(../img/point_underline2.svg);
}
.topic2_point .advice .l3 {
	background-image: url(../img/point_underline3.svg);
}

/**
 * 類塾プラス生の声
 * -------------------------------------------------- */
.p-topic3 {
	margin: var(--basisgap) calc(var(--sidegap) * -1) 0;
	--underline: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="115" height="3" viewBox="0 0 115 3" preserveAspectRatio="none" style="fill:none;stroke:%23284896;stroke-linecap:round;stroke-width:.5px"><path d="M113.8.6H.33M113.58,2.4H.25"/></svg>');
}
.topic3_title {
	display: grid;
	place-items: center;
	aspect-ratio: 270 / 247;
	width: calc(270 * 1.28px);
	height: auto;
	margin-inline: auto;
	padding-left: 2.4em;
	padding-bottom: .1em;
	color: var(--blue);
	--fontBasis: 20;
	background: url(../img/topic3_title.svg) center / cover no-repeat;
	rotate: -6deg;
}
.topic3_title .t {
	display: flex;
	align-items: center;
	rotate: -1deg;
}
.topic3_title .t span {
	background: var(--underline) left bottom / 100% .2em no-repeat;
}
.topic3_title b {
	display: grid;
	place-items: center;
	z-index: 0;
	position: relative;
	width: 1.75em;
	height: 1.75em;
	margin-left: .2em;
	border-radius: 1.75em;
	font-size: 145%;
}
.topic3_title b::before,
.topic3_title b::after {
	content: "";
	z-index: -1;
	position: absolute;
	inset: 0;
	border-radius: inherit;
}
.topic3_title b::before {
	inset: .1em .1em -.1em -.1em;
	background: white;
}
.topic3_title b::after {
	border: 1.5px solid currentcolor;
}
@media screen and (max-width: 640px) {
	.topic3_title {
		width: calc(var(--cw) * 270 / var(--aspect));
	}
}
/* Splide */
.topic3_slide {
	--subject-size: calc(86 * 1.28px);
	--image-size: calc(183 * 1.28px);
	background: white var(--grid) center top / calc(var(--basisgap) * .4);
	--pipi: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" style="fill:none;stroke:%23284896;stroke-linecap:round;stroke-width:1.5"><path d="M10.08,1.02L.91,12.29M11.66,18.98l7.42-5.1"/></svg>');
}
@media screen and (max-width: 640px) {
	.topic3_slide {
		--subject-size: calc(var(--cw) * 86 / var(--aspect));
		--image-size: calc(var(--cw) * 183 / var(--aspect));
	}
}
.topic3_slide .splide__arrow {
	--size: calc(var(--basisgap) / 2);
	z-index: 1;
	position: absolute;
	top: calc(var(--subject-size) + var(--image-size) / 2 + var(--size) / 2);
	filter: drop-shadow(.2em .2em 0 var(--blue));
}
.topic3_slide .splide__arrow--prev {
	left: var(--sidegap);
}
.topic3_slide .splide__arrow--next {
	right: var(--sidegap);
}
.topic3_slide .splide__arrow svg {
	width: calc(var(--basisgap) * 1.2);
	height: auto;
	fill: var(--yellow);
	stroke: var(--blue);
	stroke-width: 1.5;
}
.topic3_slide .splide__arrow--prev svg {
	scale: -1 1;
}
@media (hover) {
	.topic3_slide .splide__arrow {
		transition: scale .4s var(--easeOut);
	}
	.topic3_slide .splide__arrow:hover {
		scale: 1.08;
		transition-duration: .2s;
		transition-timing-function: var(--easeBack);
	}
	.topic3_slide .splide__arrow:active {
		scale: .94;
		transition-duration: .1s;
	}
}
.topic3_slide .splide__track {
	padding-top: var(--basisgap);
	padding-bottom: calc(var(--basisgap) * 2);
	transition: height .4s var(--easeOut);
}
.topic3_slide .splide__list {
	align-items: flex-start;
}
.topic3_slide .splide__slide {
	padding-inline: var(--sidegap);
}
.topic3_subject {
	display: grid;
	align-content: center;
	row-gap: .25em;
	z-index: 0;
	position: relative;
	width: 80%;
	height: var(--subject-size);
	margin: 0 auto;
	padding-inline: 1em .5em;
	color: var(--blue);
	font-weight: 700;
	--fontBasis: 17;
	line-height: 1.2894736842105263;
	letter-spacing: .06rem;
}
.topic3_subject::after {
	content: "";
	position: absolute;
	top: 0;
	right: 1em;
	width: 1.2em;
	height: 1.2em;
	background: var(--pipi) center / cover no-repeat;
}
.section3 .topic3_subject {
	--fontBasis: 16;
	letter-spacing: 0;
}
.topic3_subject .bln {
	content: "";
	z-index: -1;
	position: absolute;
	inset: 0;
	border: 1px solid var(--blue);
	border-radius: .5em;
	background: var(--yellow);
	transform: skewY(-6deg);
	filter: drop-shadow(.2em .2em 0 var(--blue));
}
.topic3_subject .bln::after {
	content: "";
	position: absolute;
	top: calc(100% - .04em);
	right: 2em;
	width: 1em;
	height: .8em;
	background: url(../img/topic3_tail.svg) center top / contain no-repeat;
}
.topic3_subject .t {
	rotate: -6deg;
}
.topic3_subject small {
	justify-self: flex-end;
	color: black;
	font-weight: 500;
	font-size: 47.368421052631576%;
	letter-spacing: .12rem;
	rotate: -6deg;
	translate: 0 -1em;
}
.topic3_slide .image {
	display: grid;
	place-content: center;
	position: relative;
	overflow: hidden;
	aspect-ratio: 1 / 1;
	width: var(--image-size);
	height: var(--image-size);
	margin: -1em auto 0;
	border: 3px solid var(--blue);
	border-radius: 50%;
	background: white;
	box-shadow: .2em .2em 0 var(--blue);
}
.topic3_slide .paragraph {
	position: relative;
	margin-top: calc(var(--basisgap) * -1);
	padding: calc(var(--basisgap) / 2);
	border-block: 1.5px solid var(--blue);
	--fontBasis: 12;
	line-height: 2.0833333333333335;
	letter-spacing: .12rem;
	background: var(--yellow);
	box-shadow: calc(var(--basisgap) / 4) calc(var(--basisgap) / 4) 0 var(--blue);
}
.topic3_slide .graph {
	margin-top: var(--basisgap);
	padding: calc(var(--basisgap) / 2);
	padding-left: 0;
	border: 1.5px solid var(--blue);
	border-radius: calc(var(--basisgap) / 4);
	text-align: center;
	background: white;
	box-shadow: calc(var(--basisgap) / 4) calc(var(--basisgap) / 4) 0 var(--blue);
}

/**
 * Information
 * -------------------------------------------------- */
.p-topic4 {
	margin-top: calc(var(--sectiongap) / 2);
	--titletail: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="248" height="20" viewBox="0 0 248 20" style="fill:none;stroke:%23f9ec38;stroke-width:1.5"><polyline points=".13 .75 114 .75 124 18.25 134 .75 247.87 .75"/></svg>');
	--tail: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="375" height="150" viewBox="0 0 375 150"><path d="M0,0v15.69l181.71,132.42c3.45,2.52,8.13,2.52,11.58,0L375,15.69V0"/></svg>');
	--dots: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAdCAYAAABWk2cPAAAA3klEQVR42u3VKwpCURAG4AEfQTDdM2fmJnVGEawuQIvFYrEYNLoEg+Iq3IQWi27BJLgTMYv44ARBLjaZ5Plg8s8wMD9EfyEnhDNhd1DGfc37HlgTditlfH7MXSnpgpVWC4pCeM2EPoVxA1bSNC0p4yMEZWYHlsIdv4ROwFKdGZXcVhhvSnhWdguIoij6RQcgL+z6yjiuMlfAWjNJykp4fL/OUBx1xiFYUu/m2Z8d3mgboGDYw7gOQdmpEFUty3/5ZdNL6GjTmwrh6aP4b+LdCKyFrdT7gaZu2vBeIPobL+2STJGbPNNUAAAAAElFTkSuQmCC");
}
.p-topic4 .title {
	font-weight: 600;
	--fontBasis: 22.455;
	line-height: 1.9;
	letter-spacing: .12rem;
	text-align: center;
}
.p-topic4 .title .t {
	position: relative;
}
.p-topic4 .title .t::after {
	content: "";
	--w: 248px;
	position: absolute;
	top: calc(100% + .1em);
	left: calc(50% - var(--w) / 2);
	aspect-ratio: 248 / 20;
	width: var(--w);
	height: auto;
	background: var(--titletail) center bottom / contain no-repeat;
}
.p-topic4 .title img {
	z-index: 1;
	position: absolute;
	top: -.9em;
	left: 64%;
	width: calc(90 * 1.28px);
}
@media screen and (max-width: 640px) {
	.p-topic4 .title .t::after {
		--w: calc(var9--vw) * 248 / var(--aspect));
	}
	.p-topic4 .title img {
		width: calc(var(--cw) * 90 / var(--aspect));
	}
}
.p-topic4 .lead {
	width: fit-content;
	z-index: 2;
	position: relative;
	margin: calc(var(--basisgap) + .5em) auto 0;
	padding: 1em;
	border: 1.5px solid var(--blue);
	border-top-right-radius: 1em;
	border-bottom-left-radius: 1em;
	--fontBasis: 13;
	line-height: 1.5384615384615385;
	letter-spacing: .12rem;
	text-align: center;
	background: white;
	box-shadow: .25em .25em 0 var(--blue);
}
.p-topic4 .lead b {
	font-weight: inherit;
	font-size: 153.84615384615385%;
	background: linear-gradient(to top, var(--yellow) .4em, transparent .4em);
}
.topic4_sections {
	--limit: calc(144 * 1.28px);
	display: grid;
	justify-content: center;
	row-gap: calc(var(--basisgap) * 1.8);
	z-index: 1;
	position: relative;
	margin-inline: calc(var(--sidegap) * -1);
	padding-top: var(--basisgap);
	padding-bottom: calc(var(--sectiongap) * 2);
	filter: drop-shadow(0 calc(var(--basisgap) / 3) 0 var(--blue));
	--bg: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="235" height="11" viewBox="0 0 235 11" preserveAspectRatio="none" style="fill:none;stroke:%23284896;stroke-width:2.5"><path d="M0,1.28h234.76M0,9.72h221.25"/></svg>');
}
.topic4_sections::before {
	content: "";
	z-index: -1;
	position: absolute;
	inset: calc(var(--sectiongap) * -1) 0 0;
	background: url(../img/topic4_bg1.svg) center 7% / contain no-repeat,
		url(../img/topic4_bg2.svg) center 31% / contain no-repeat,
		url(../img/topic4_bg3.svg) center 58% / contain no-repeat,
		url(../img/topic4_bg4.svg) center 96% / contain no-repeat;
	background-color: var(--yellow);
	mask: linear-gradient(to top, #0000 var(--limit), #000 var(--limit)), var(--tail) center bottom / contain no-repeat;
	clip-path: polygon(0 var(--sectiongap), 100% 0, 100% 100%, 0 100%);
}
@media screen and (max-width: 640px) {
	.topic4_sections {
		--limit: calc(var(--cw) * 144 / var(--aspect));
	}
}
.topic4_sections section {
	z-index: 0;
	position: relative;
	width: calc(244.759 * 1.28px);
	padding: var(--basisgap) calc(var(--sidegap) * .8) calc(var(--basisgap) * .8);
}
.topic4_sections section::before {
	content: "";
	position: absolute;
	top: calc(100% + 6px);
	left: 0;
	width: 96%;
	height: 12px;
	background: var(--bg) left top / 100% 100% no-repeat;
}
.topic4_sections section::after {
	content: "";
	position: absolute;
	top: calc(var(--basisgap) / 4);
	left: calc(50% - .6em);
	width: 1.4em;
	height: 1.4em;
	background: url(../img/pin.svg) center / cover no-repeat;
}
.topic4_sections .paper {
	--earsize: calc(var(--basisgap) * .8);
}
.topic4_sections .paper::before {
	content: "";
	z-index: -1;
	position: absolute;
	inset: 0;
	border: 2.5px solid var(--blue);
	background: white;
	clip-path: polygon(0 0, calc(100% - var(--earsize)) 0, 100% var(--earsize), 100% 100%, 0 100%);
}
.topic4_sections .paper::after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: var(--earsize);
	height: var(--earsize);
	background: url(../img/dogear.svg) right top / contain no-repeat;
}
.p-topic4 .section_title {
	padding-bottom: calc(var(--basisgap) / 3);
	border-bottom: 1.25px solid var(--blue);
	color: var(--blue);
	font-weight: 600;
	--fontBasis: 17.5;
	line-height: 1.8857142857142857;
	letter-spacing: .12rem;
	text-align: center;
}
.p-topic4 .section_title .under {
	background: linear-gradient(to top, var(--yellow) .4em, transparent .4em);
}
.p-topic4 .image {
	z-index: 0;
	position: relative;
	margin-top: calc(var(--basisgap) / 2);
}
.p-topic4 .image img {
	width: 100%;
}
.p-topic4 .image::before {
	content: "";
	z-index: -1;
	position: absolute;
	inset: .6em -.6em -.6em .6em;
	background: var(--dots) center / calc(var(--basisgap) * .2);
}
.p-topic4 .paragraph {
	margin-top: calc(var(--basisgap) / 2);
	--fontBasis: 13;
	line-height: 2.0384615384615383;
	letter-spacing: .12rem;
}
.topic4_sections .section1 .paragraph {
	--fontBasis: 16;
	line-height: 1.8674375;
}
.topic4_sections .section2 .paragraph {
	letter-spacing: 0;
}
.topic4_sections :where(.wave, .double) {
	padding-bottom: .2rem;
	background: url(../img/topic4_underline2.svg) left bottom / 8rem .3rem repeat-x;
}
.topic4_sections .double {
	background-image: url(../img/topic4_underline3.svg);
}
.topic4_sections .section1 .wave {
	background-image: url(../img/topic4_underline1.svg);
}
.topic4_sections .section1 .note {
	--fontBasis: 11;
}
@media screen and (max-width: 640px) {
	.topic4_sections section {
		width: calc(var(--cw) * 244.759 / var(--aspect));
	}
}
/* キャンペーン */
.topic4_last {
	z-index: 0;
	position: relative;
	margin-top: calc(var(--sectiongap) * -1.5);
	margin-inline: calc(var(--sidegap) * -1);
	padding-top: calc(var(--sectiongap) * 2);
	padding-bottom: calc(var(--sectiongap) * 1.4);
	color: white;
	--fontBasis: 47.5;
	line-height: 1.1;
	letter-spacing: .12rem;
	text-align: center;
}
.topic4_last::before {
	content: "";
	z-index: -1;
	position: absolute;
	inset: 0;
	background: var(--orange-dark);
	clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--basisgap) * 2), 50% 100%, 0 calc(100% - var(--basisgap) * 2));
}
.topic4_last::after {
	content: "";
	position: absolute;
	bottom: -.4em;
	left: 10%;
	aspect-ratio: 104 / 116;
	width: 2em;
	height: auto;
	background: url(../img/pointer.svg) center / cover no-repeat;
}
.topic4_last .pipi {
	position: relative;
}
.topic4_last .pipi::after {
	content: "";
	position: absolute;
	bottom: calc(100% - .25em);
	right: -.5em;
	aspect-ratio: 43 / 57;
	width: calc(var(--basisgap) * 1.4);
	height: auto;
	background: url(../img/topic4_pipi.svg) center / cover no-repeat;
}
.topic4_last .small {
	display: inline-block;
	margin-top: .4em;
	color: var(--yellow);
	font-size: 90.90231578947369%;
	letter-spacing: -.08rem;
}
.topic4_last .double {
	position: relative;
	padding-bottom: .1em;
	color: var(--yellow);
	font-size: 167.64294736842105%;
}
.topic4_last .double::before {
	content: "";
	position: absolute;
	inset: auto .1em 0 0;
	height: .15em;
	border-block: .05em solid white;
}

/**
 * 写真
 * -------------------------------------------------- */
.p-topic5 {
	margin-top: calc(var(--basisgap) * -2);
	margin-inline: calc(var(--sidegap) * -1);
	padding: var(--sectiongap) var(--sidegap) calc(var(--sectiongap) / 2);
	background: var(--dots) center / calc(var(--basisgap) * .4);
}
.topic5_photos {
	--radius: var(--basisgap);
	display: grid;
	grid-template-columns: repeat(4, auto);
	gap: calc(var(--basisgap) * .4);
	margin-inline: calc(var(--sidegap) * -1);
}
.topic5_photos img:nth-child(1) {
	grid-area: 1 / 3 / 2 / 5;
	border-top-left-radius: var(--radius);
}
.topic5_photos img:nth-child(2) {
	grid-area: 1 / 1 / 2 / 3;
	align-self: flex-end;
	border-top-right-radius: var(--radius);
}
.topic5_photos img:nth-child(3) {
	grid-area: 2 / 1;
	border-bottom-left-radius: var(--radius);
}
.topic5_photos img:nth-child(4) {
	grid-area: 2 / 2 / 3 / 4;
	border-top-left-radius: var(--radius);
}
.topic5_photos img:nth-child(5) {
	grid-area: 2 / 4 / 4 / 5;
	border-bottom-left-radius: var(--radius);
}
.topic5_photos img:nth-child(6) {
	grid-area: 3 / 1 / 4 / 4;
	justify-self: flex-end;
	border-bottom-left-radius: var(--radius);
}
.topic5_photos img[width="410"] {
	width: calc(205 * 1.28px);
}
.topic5_photos img[width="316"] {
	width: calc(158 * 1.28px);
}
.topic5_photos img[width="202"] {
	width: calc(101 * 1.28px);
}
.topic5_photos img[width="360"] {
	width: calc(180 * 1.28px);
}
@media screen and (max-width: 640px) {
	.topic5_photos img[width="410"] {
		width: calc(var(--cw) * 205 / var(--aspect));
	}
	.topic5_photos img[width="316"] {
		width: calc(var(--cw) * 158 / var(--aspect));
	}
	.topic5_photos img[width="202"] {
		width: calc(var(--cw) * 101 / var(--aspect));
	}
	.topic5_photos img[width="360"] {
		width: calc(var(--cw) * 180 / var(--aspect));
	}
}

/**
 * もれなく全員に
 * -------------------------------------------------- */
.topic5_title {
	position: relative;
	margin-top: calc(var(--sectiongap) / 2);
	padding: 1em .5em;
	border: 1.5px solid currentcolor;
	border-radius: calc(var(--basisgap) / 2);
	color: var(--blue);
	font-weight: 600;
	--fontBasis: 28.5;
	line-height: 1.2982456140350878;
	text-align: center;
	background: #f8f8f8;
	--tail: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="24" viewBox="0 0 20 24" preserveAspectRatio="none"><polygon fill="%23f8f8f8" points="20 -1 20 1.87 18.75 1.87 10 22.11 1.25 1.87 0 1.87 0 -1 20 -1"/><polyline style="fill:none;stroke:%23284896;stroke-width:1.5" points="20 1.87 18.75 1.87 10 22.11 1.25 1.87 0 1.87"/></svg>');
}
.topic5_title svg {
	overflow: visible;
	position: absolute;
	top: -.75em;
	left: calc(50% - .5em);
	width: 1em;
	height: auto;
	stroke-width: 12;
	stroke-linejoin: round;
}
.topic5_title::after {
	content: "";
	position: absolute;
	top: calc(100% - 1.3px);
	left: calc(50% - .32em);
	width: .64em;
	height: .8em;
	background: var(--tail) center / 100% 100% no-repeat;
}
.topic5_title .main {
	position: relative;
}
.topic5_title .main::after {
	content: "";
	position: absolute;
	bottom: calc(100% - .3em);
	right: -.8em;
	aspect-ratio: 45 / 59;
	width: calc(var(--basisgap) * 1.4);
	height: auto;
	background: url(../img/topic5_pipi.svg) center / cover no-repeat;
}
.topic5_title em {
	background: linear-gradient(to top, var(--yellow) .4em, transparent .4em);
}
.topic5_add {
	margin-top: .5em;
	color: var(--blue);
	--fontBasis: 50.0972;
	line-height: 1.2;
	letter-spacing: .02rem;
	white-space: nowrap;
	background: linear-gradient(to top, var(--yellow) .4em, transparent .4em);
}
.topic5_flow {
	z-index: 0;
	position: relative;
	margin-top: calc(var(--basisgap) * .75);
	margin-inline: calc(var(--sidegap) * -1);
	padding-top: calc(var(--sectiongap) * 1.06);
	padding-inline: var(--sidegap);
	border-top-left-radius: var(--basisgap);
	border-top-right-radius: var(--basisgap);
	color: white;
	text-align: center;
	background: var(--orange-dark) url(../img/topic5_bg1.svg) center top / contain no-repeat;
	--tail: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="375" height="140" viewBox="0 0 375 140"><path fill="%23284896" d="M0,0v34.4l174.25,101.99c8.18,4.82,18.32,4.82,26.5,0l174.25-101.99V0"/><path fill="%23de5a24" d="M0,0v14l174.25,101.99c8.18,4.82,18.32,4.82,26.5,0L375,14V0"/></svg>');
}
.topic5_flow::after {
	content: "";
	z-index: -1;
	position: absolute;
	inset: calc(100% - var(--basisgap) * .8) -.5px auto;
	aspect-ratio: 375 / 140;
	height: auto;
	background: var(--tail) center top / contain no-repeat;
}
.topic5_flow p {
	--fontBasis: 42.2682;
	line-height: 1.1714291121930909;
	letter-spacing: .08rem;
}
.topic5_flow .plus img {
	width: .8em;
	margin-top: 2.25em;
}
.topic5_flow .plus + p {
	position: relative;
	margin-top: .75em;
}
.topic5_flow .plus + p::before {
	content: "";
	position: absolute;
	inset: -.75em calc(var(--sidegap) * -1) auto;
	aspect-ratio: 375 / 84;
	height: auto;
	background: url(../img/topic5_bg2.svg) center top / contain no-repeat;
}
.topic5_flow .under {
	background: linear-gradient(to top, var(--blue) .4em, transparent .4em);
}
.topic5_flow .small {
	font-size: 68.14792207853658%;
}
/* LINE で */
.topic5_column {
	padding-top: calc(var(--sectiongap) * .8);
	--tail: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="25" height="28" viewBox="0 0 25 28" preserveAspectRatio="none"><polyline fill="%23f9ec38" points="21.15 -2 21.15 2 12.57 22 4 2 4 -2"/><polyline style="fill:none;stroke:%23284896;stroke-width:4" points="25 2 21.15 2 12.57 22 4 2 0 2"/></svg>');
}
.topic5_column .image {
	float: right;
	z-index: 1;
	position: relative;
	overflow: hidden;
	width: fit-content;
	margin-right: calc(var(--basisgap) * -1.5);
	margin-left: -2em;
	border: 3.3444px solid var(--blue);
	border-radius: 50%;
	box-shadow: .25em .25em 0 black;
}
.topic5_column .message {
	position: relative;
	margin-top: calc(var(--sectiongap) * .85);
	border: 4.5px solid var(--blue);
	border-radius: calc(var(--basisgap) * 2);
	padding: var(--basisgap) var(--sidegap);
	color: var(--blue);
	font-weight: 600;
	--fontBasis: 14.5;
	background: var(--yellow);
	filter: drop-shadow(.25em .25em 0 var(--blue));
}
.topic5_column .message::after {
	content: "";
	position: absolute;
	top: 100%;
	left: calc(50% - .85em);
	width: 1.7em;
	height: 1.8em;
	background: var(--tail) center top / 100% 100% no-repeat;
}
.topic5_column .message b {
	font-weight: inherit;
	font-size: 103.44827586206897%;
}
.topic5_column .message em {
	background: linear-gradient(to top, white .4em, transparent .4em);
}
.topic5_column .message .line {
	font-size: 166.66666666666667%;
}
.p-topic5 > img {
	width: calc(100% + var(--sidegap) * 2);
	max-width: none;
	margin: calc(var(--basisgap) * -1.3) calc(var(--sidegap) * -1) 0;
}
.p-topic5 .button {
	z-index: 0;
	display: block;
	position: relative;
	margin-top: 1em;
	padding: .2em 1.5em .4em;
	color: white;
	font-weight: 700;
	--fontBasis: 22.5;
	line-height: 1.3555555555555556;
	text-align: center;
}
.p-topic5 .button::before {
	content: "";
	z-index: -1;
	position: absolute;
	inset: 0;
	border: 1.5px solid black;
	border-radius: 3em;
	background: var(--green);
	box-shadow: .25em .25em 0 black;
}
@media (hover) {
	.p-topic5 .button::before {
		transition: scale .4s var(--easeOut);
	}
	.p-topic5 .button:hover::before {
		scale: 1.02 1.06;
		transition-duration: .2s;
		transition-timing-function: var(--easeBack);
	}
	.p-topic5 .button:active::before {
		scale: .98 .95;
		transition-duration: .1s;
	}
}
.p-topic5 .exclamation {
	display: inline-block;
	rotate: 16deg;
	scale: 1.12;
	transform-origin: left bottom;
}

/**
 * よくある質問
 * -------------------------------------------------- */
.p-faq {
	padding-block: calc(var(--sectiongap) / 2);
	--pull: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="19" height="11" viewBox="0 0 19 11" style="fill:none;stroke:currentcolor;stroke-linecap:round;stroke-width:1.5"><polyline points=".76 .97 9.5 9.71 18.24 .97"/></svg>');
}
.faq_title {
	display: grid;
	justify-content: center;
	--fontBasis: 20;
	line-height: 1.2;
}
.faq_title .t {
	grid-area: 1 / 2;
	position: relative;
	padding: .5em 1.25em;
	border: 1.5px solid white;
	border-radius: .25em;
	color: white;
	background: var(--blue);
}
.faq_title .t::after {
	content: "";
	position: absolute;
	top: calc(100% - 3px);
	left: calc(50% - .3em);
	width: .6em;
	height: .6em;
	background: var(--blue);
	clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.faq_title i {
	grid-area: 1 / 1;
	margin-right: -.25em;
	color: var(--green);
	font-size: 374.97149999999997%;
	line-height: 0;
}
.faq_title i + i {
	margin-inline: -.25em 0;
	grid-area: 1 / 3;
}
/* アコーディオン */
.p-faq details:first-of-type {
	margin-top: calc(var(--basisgap) / 2);
}
.p-faq details {
	margin-inline: calc(var(--sidegap) * -.5);
	border-bottom: .5px solid #7f7f7f;
	--fontBasis: 11.5;
	line-height: 1.8695652173913044;
	letter-spacing: .06rem;
}
.p-faq details::details-content {
	height: 0;
	overflow: clip;
	transition: height .4s, content-visibility .4s allow-discrete;
	transition-timing-function: var(--easeOut);
}
.p-faq summary {
	display: grid;
	align-items: center;
	grid-template-columns: 2em 1fr auto;
	column-gap: .6em;
	padding: 1.2em 1em;
	font-size: 118.18181818181819%;
	line-height: 1.5769230769230769;
	letter-spacing: .06rem;
}
.p-faq summary::marker {
	content: "";
}
.p-faq summary::before {
	content: "Q";
	display: grid;
	place-items: center;
	width: 2em;
	height: 2em;
	padding-bottom: .2em;
	border-radius: 2em;
	color: white;
	background: var(--blue);
}
.p-faq summary::after {
	content: "";
	width: 1.4em;
	height: 1.4em;
	background: var(--pull) center / contain no-repeat;
	transition: scale .4s var(--easeOut);
}
.p-faq details[open] summary::after {
	scale: 1 -1;
	transition-duration: .2s;
}
.p-faq summary::-webkit-details-marker {
	display: none;
}
.p-faq p {
	padding: 0 1em 1.5em;
	padding-left: 4.3em;
	line-height: 1.75;
}
@supports (interpolate-size: allow-keywords) {
	details[open]::details-content {
		height: auto;
	}
}
@supports not (interpolate-size: allow-keywords) {
	details[open]::details-content {
		height: calc(5em * 1.75 + 1.5em); /* 5lh + 1.5em */
		overflow-y: scroll;
	}
}
@media (hover) {
	.p-faq details {
		cursor: pointer;
	}
}

/**
 * モーダルコンテンツ
 * -------------------------------------------------- */
.l-modal {
	z-index: 3;
	position: fixed;
	inset: 0;
	margin: 0 auto;
	width: var(--cw);
	height: 100dvh;
}
.l-modal .modal_close {
	display: grid;
	place-items: center;
	z-index: 1;
	position: absolute;
	top: var(--basisgap);
	right: var(--basisgap);
	width: var(--basisgap);
	height: var(--basisgap);
	color: var(--blue);
}
.l-modal .modal_close::before {
	content: "";
	z-index: -1;
	position: absolute;
	inset: 0;
	border: 1.5px solid currentcolor;
	border-radius: var(--basisgap);
	background: var(--yellow);
	box-shadow: .15em .15em 0 currentcolor;
}
@media (hover) {
	.l-modal .modal_close::before {
		transition: scale .4s var(--easeOut);
	}
	.l-modal .modal_close:hover::before {
		scale: 1.08;
		transition-duration: .2s;
		transition-timing-function: var(--easeBack);
	}
	.l-modal .modal_close:active::before {
		scale: .94;
		transition-duration: .1s;
	}
}
.l-modal .modal_close svg {
	width: 48%;
	height: auto;
	fill: none;
	stroke: currentcolor;
	stroke-width: 1.5;
	stroke-linecap: round;
}
.l-modal .modal_overlay {
	position: absolute;
	inset: 0;
	background: #0002;
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}
.l-modal .modal_container {
	position: absolute;
	overflow: auto;
	inset: 0;
	width: calc(100% - var(--sidegap));
	height: calc(100% - var(--basisgap));
	border: 1.5px solid var(--blue);
	border-radius: var(--basisgap);
	margin: auto;
	background: white;
}
.l-modal .modal_container {
	overflow-y: scroll;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
}
.l-modal .modal_container {
	scrollbar-width: none;
}
.l-modal .modal_container::-webkit-scrollbar {
	display: none;
}
.l-modal:not(.is-active) {
	display: none;
}
.l-modal .modal_overlay:not(.is-open) {
	opacity: 0;
}
.l-modal .modal_container:not(.is-open),
.l-modal .modal_close:not(.is-open) {
	opacity: 0;
	scale: .94;
}
.l-modal .modal_close:not(.is-open) {
	scale: .6;
}
.l-modal .modal_overlay.is-motion {
	transition: opacity .2s;
}
.l-modal .modal_container.is-motion,
.l-modal .modal_close.is-motion {
	transition: opacity .2s, scale .2s var(--easeOut);
}
.l-modal .modal_close.is-motion {
	transition-timing-function: ease, var(--easeBack);
}
.l-modal .modal_overlay.is-motion {
	transition-delay: .2s;
}
.l-modal .modal_overlay.is-motion.is-open,
.l-modal .modal_container.is-motion.is-open,
.l-modal .modal_close.is-motion.is-open {
	transition-duration: .4s;
}
.l-modal .modal_overlay.is-motion.is-open {
	transition-delay: 0s;
}
.l-modal .modal_container.is-motion.is-open {
	transition-delay: .1s;
}
.l-modal .modal_close.is-motion.is-open {
	transition-delay: .2s;
}
@media screen and (min-width: 641px) {
	.l-modal {
		width: 480px;
		margin: 0 auto;
	}
}

/**
 * Utility / JavaScript
 * -------------------------------------------------- */
.u-visuallyhidden {
	position: absolute;
	overflow: hidden;
	top: 0;
	left: 0;
	width: 1px;
	height: 1px;
	margin: -1px;
	white-space: nowrap;
	clip: rect(0 0 0 0);
}

:root {
	interpolate-size: allow-keywords; /* height:autoを有効にする */
	--aspect: 375;
	
	--yellow: #f9ec38;
	--orange: #ff7f2c;
	--blue: #284896;
	--red: #da0000;
	--green: #00a45c;
	--orange-dark: #de5a24;
	
	--font: "Noto Sans JP", sans-serif;
	--easeIn: cubic-bezier(.3,0,.7,0);
	--easeOut: cubic-bezier(.3,1,.7,1);
	--easeInOut: cubic-bezier(.7,0,.3,1);
	--easeBack: cubic-bezier(.3,1.6,.7,1);
}
body {
	--cw: 100cqi;
	--sidegap: calc(24 * 1.28px);
	--basisgap: 40px;
	--sectiongap: 120px;
	--grid: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAQAAABu4E3oAAAAHklEQVR42mPACaRwSYxqGdVCohYpUuFoII9qobUWAGfBBPuwh0d9AAAAAElFTkSuQmCC");
	--grid-dark: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAQAAABu4E3oAAAAHklEQVR42mPACWJwSYxqGdVCopYYUuFoII9qobUWANisEZ1ygDKaAAAAAElFTkSuQmCC");
	--wallpaper: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAAQCAYAAABKkhw/AAAAUElEQVR4AWNQd5/aoOExbQLDCAGjHh62YNTDwx2MepjOQM1jqp66+zT1EeNhoGcPAvH6EeNhFY+Jorre0wRHcB4e9fCoh0c9POrhUQ+PehgA/Hc5liOjJosAAAAASUVORK5CYII=");
	--dots: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAdCAYAAABWk2cPAAAAV0lEQVR42u3NMQqAQBBD0akED2AjeDePYeUpB4ZJugXxGLpbWFq6IOTBJ2VMRET+geSSmWtb68HdB5BH7UrgLKWM9jUAUzt8iojZegCwgYy6u4mIiLy5AYvxMVn///vwAAAAAElFTkSuQmCC");
	--separator: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="3" viewBox="0 0 15 3" preserveAspectRatio="none" style="fill:none;stroke:black;stroke-width:1.5"><line y1="1.5" x2="7.5" y2="1.5"/></svg>');
}
:where(h1,h2,h3,h4,h5,h6,p,ul,ol,dl,details,figcaption,button,.button,.cv) {
	--fontSize: calc(var(--fontBasis) * 1.28 * .0625rem);
	font-size: var(--fontSize);
}
@media not (any-hover) {
	body { --cw: 100vw; }
}
@media print, (max-width: 1023.98px) {
	.u-dtonly { display: none; }
}
@media screen and (max-width: 640px) {
	body {
		--sidegap: calc(var(--cw) * 24 / var(--aspect));
		--basisgap: calc(var(--cw) * 32 / var(--aspect));
		--sectiongap: calc(var(--cw) * 96 / var(--aspect));
	}
	:where(h1,h2,h3,h4,h5,h6,p,ul,ol,dl,details,figcaption,button,.button,.cv) {
		--fontSize: calc(var(--cw) * var(--fontBasis) / var(--aspect));
	}
}
html {
	scroll-behavior: smooth;
	-webkit-text-size-adjust: 100%;
}
body {
	overscroll-behavior: auto;
	color: black;
	font: 600 1em / 1.75 var(--font);
	font-feature-settings: "palt" 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	background: var(--blue);
}
body.is-fixed {
	position: fixed;
	inset: 0;
}
body.scrollbar {
	overflow-y: scroll;
}
*,*::before,*::after{box-sizing:border-box;}
:where(ul,ol){list-style:none;padding:0;}
:where(img,svg,video,iframe){vertical-align:middle;}
:where(img[height],picture>img,video[height]){height:auto;}
:where(input,button,textarea,select,small){font-family:inherit;}
:where(body,h1,h2,h3,h4,h5,h6,p,figure,blockquote,ul,ol,dl,dd){margin:0;}
:where(img,picture,video,iframe){display:inline-block;max-width:100%;}
:where(a){color:inherit;text-decoration:inherit;text-decoration-skip-ink:auto;}
:where(button){-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;padding:0;color:inherit;background:none;}
:where(sub){vertical-align:baseline;}
:where(em,cite,i){font-style:normal}
@media(hover){:where(a[href],button){cursor:pointer;}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important;}}

/** cdn.jsdelivr.net/npm/@splidejs/splide@4.1.4/dist/css/splide-core.min.css */
@keyframes splide-loading{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.splide__track--draggable{-webkit-touch-callout:none;-webkit-user-select:none;-ms-user-select:none;user-select:none}.splide__track--fade>.splide__list>.splide__slide{margin:0!important;opacity:0;z-index:0}.splide__track--fade>.splide__list>.splide__slide.is-active{opacity:1;z-index:1}.splide--rtl{direction:rtl}.splide__track--ttb>.splide__list{display:block}.splide__container{box-sizing:border-box;position:relative}.splide__list{backface-visibility:hidden;display:-ms-flexbox;display:flex;height:100%;margin:0!important;padding:0!important}.splide.is-initialized:not(.is-active) .splide__list{display:block}.splide__pagination{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-pack:center;justify-content:center;margin:0;pointer-events:none}.splide__pagination li{display:inline-block;line-height:1;list-style-type:none;margin:0;pointer-events:auto}.splide:not(.is-overflow) .splide__pagination{display:none}.splide__progress__bar{width:0}.splide{position:relative;visibility:hidden}.splide.is-initialized,.splide.is-rendered{visibility:visible}.splide__slide{backface-visibility:hidden;box-sizing:border-box;-ms-flex-negative:0;flex-shrink:0;list-style-type:none!important;margin:0;position:relative}.splide__slide img{vertical-align:bottom}.splide__spinner{animation:splide-loading 1s linear infinite;border:2px solid #999;border-left-color:transparent;border-radius:50%;bottom:0;contain:strict;display:inline-block;height:20px;left:0;margin:auto;position:absolute;right:0;top:0;width:20px}.splide__sr{clip:rect(0 0 0 0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.splide__toggle.is-active .splide__toggle__play,.splide__toggle__pause{display:none}.splide__toggle.is-active .splide__toggle__pause{display:inline}.splide__track{overflow:hidden;position:relative;z-index:0}