@charset "utf-8";

body {
	counter-reset: usp-counter;
}
main {
	display: flex;
	flex-direction: column;
	gap: 1px;
	background-color: #fff;
	border: solid #fff;
	border-width: 1px 0;
}
p:last-of-type {
	margin-bottom: 0;
}
.under1023 {
	display: none;
}
.only_tablet {
	display: none;
}
.not_tablet {
	display: block;
}
@media screen and (max-width: 834px) and (min-width: 601px) {
	.only_tablet {
		display: block;
	}
	.not_tablet {
		display: none;
	}
}
@media screen and (max-width: 1024px) {
	.under1023 {
		display: block;
	}
}

/***********************************************************************
FV
***********************************************************************/
.firstView {
	width: 100%;
	height: 350px;
	background-image: url(/area/assets/images/general_exam/general_exam_FV_left.svg), url(/area/assets/images/general_exam/general_exam_FV_right.png), linear-gradient(to bottom right, #fdf7ea, #fcf4e4);
	background-repeat: no-repeat;
	background-size: auto 100%, auto 100%, cover;
	background-position: calc(50% - 70rem) 0, calc(50% + 38rem) 50%, 50% 50%;
	position: relative;
}
.firstView h1 {
	font-family: var(--fontFamily-sans-noto);
	font-weight: 900;
	font-size: 8rem;
	line-height: 1.2;
	color: var(--colorOrange);
	text-shadow: 3px 3px 0 #fff;
	margin-bottom: 0;
	position: absolute;
	left: calc(50% - 56rem);
	top: 50%;
	transform: translateY(-50%);
	letter-spacing: 0.03em;
}
.firstView h1 span {
	display: block;
}
.firstView h1 span span {
	display: inline;
	font-size: 75%;
}
.firstView h1 .subCatch {
	font-weight: 500;
	font-size: 3rem;
	line-height: 1;
	color: var(--colorDarkBlue);
	margin-bottom: 0.5em;
	background-image: linear-gradient(transparent 70%, #ffec0e 70%);
	width: fit-content;
	padding-inline: 0.3em;
	padding-bottom: 0.15em;
	text-shadow: none !important;
	letter-spacing: 0;
}
.firstView h1 .smallTxt {
	font-size: 75%;
	letter-spacing: 0;
}
@media screen and (max-width: 1279px) {
	.firstView {
		height: fit-content;
		background-position: -19vw 0, 50vw 50%, 50% 50%;
		padding-block: 18vw;
	}
	.firstView h1 .subCatch {
		font-size: 3.2vw;
	}
	.firstView h1 {
		font-size: 8vw;
		left: 4.5vw;
	}
}
@media screen and (max-width: 600px) {
	.firstView {
		background-image: url(/area/assets/images/general_exam/general_exam_FV_left.svg), url(/area/assets/images/general_exam/general_exam_FV_sp.png), url(/area/assets/images/general_exam/general_exam_FV_right_sp.svg), linear-gradient(to bottom right, #fdf7ea, #fcf4e4);
		background-position: -18vw 0, 0 calc(100% - 4vw), 82vw -14vw, 50% 50%;
		background-size: 30vw auto, contain, 50vw auto, cover;
		padding-block: 8.5vw 47.5vw;
		padding-inline: 4vw;
	}
	.firstView h1 {
		position: relative;
		top: unset;
		transform: unset;
		width: fit-content;
		font-size: 13vw;
		left: 4vw;
	}
	.firstView h1 .subCatch {
		font-size: 5.2vw;
	}
}

/***********************************************************************
Lead
***********************************************************************/
.leadWrap {
	width: 100%;
	background-image: linear-gradient(90deg, #f1f2f3, #fff 20% 80%, #f1f2f3);
	padding-block: 8rem;
	padding-inline: 5vw;
	position: relative;
	filter: drop-shadow(0 5px 10px rgba(79, 66, 58, 0.3));
	z-index: 2;
}
.leadWrap::after {
	position: absolute;
	content: '';
	background-color: #fff;
	width: 50%;
	height: 6rem;
	left: 50%;
	bottom: -5.9rem;
	transform: translateX(-50%);
	clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.leadWrap .inner {
	width: 100%;
	max-width: 800px;
	margin: 0 auto;
}
.leadWrap h2 {
	font-family: var(--fontFamily-serif-noto);
	font-weight: 700;
	font-size: 3rem;
	color: var(--colorMidNightBlue);
	margin-bottom: 0.5em;
}
.leadWrap .balloon {
	background-color: #fff;
	border-radius: 50em;
	border: 2px solid var(--colorDarkBlue);
	font-family: var(--fontFamily-sans-noto);
	font-weight: 500;
	font-size: clamp(2rem, var(--sp-20px), 2.3rem);
	line-height: 1;
	color: var(--colorDarkBlue);
	padding-block: 0.65em 0.8em;
	padding-inline: 2em;
	display: flex;
	flex-direction: column;
	justify-content: center;
	position: relative;
	margin-bottom: 2.25rem;
}
.leadWrap .balloon::before,
.leadWrap .balloon::after {
	position: absolute;
	content: '';
	clip-path: polygon(0 0, 100% 0, 50% 100%);
	left: 50%;
	transform: translateX(-50%);
	width: 3rem;
	aspect-ratio: 3/2;
}
.leadWrap .balloon::before {
	background-color: var(--colorDarkBlue);
	bottom: -2rem;
}
.leadWrap .balloon::after {
	background-color: #fff;
	bottom: -1.7rem;
}
.leadWrap .balloon span {
	display: block;
	background-color: #fffbcd;
	border-radius: 50em;
	font-size: 2rem;
	color: var(--colorOrange);
	padding-block: 0.4em;
	padding-inline: 3em 0.75em;
	width: fit-content;
	position: relative;
	margin-bottom: 0.3em;
}
.leadWrap .balloon span::before {
	position: absolute;
	content: '';
	background-image: url(/area/assets/images/general_exam/videoIcon.svg);
	background-repeat: no-repeat;
	background-size: contain;
	height: 3rem;
	aspect-ratio: 221/150;
	left: 0.5em;
	top: 43%;
	transform: translateY(-50%);
}
.leadWrap .onlineMovie_box {
	margin-block: 3rem 8rem;
}
@media screen and (max-width: 1024px) {
	.leadWrap {
		padding-block: 10vw 12vw;
	}

	.leadWrap .balloon {
		line-height: 1.2;
		align-items: center;
	}
	.leadWrap .balloon span {
		line-height: 1;
	}
}
@media screen and (max-width: 600px) {
	.leadWrap::after {
		height: 10vw;
		bottom: -9.9vw;
	}
	.leadWrap h2 {
		font-size: 7vw;
		line-height: 1.3;
	}
}

/***********************************************************************
背景固定
***********************************************************************/
.backFixed {
	position: relative;
	z-index: 0;
}
.backFixed .bgWrap {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	clip-path: inset(0);
	z-index: -1;
}
.backFixed .bgWrap .bg {
	position: fixed;
	left: 0;
	top: 0;
	width: 100vw;
	height: 100vh;
	pointer-events: none;
}

/***********************************************************************
Problem Wrap
***********************************************************************/
.problemWrap {
	width: 100%;
	padding-inline: 5vw;
	padding-block: 9rem 8rem;
}
.problemWrap .bg {
	background-image: url(/area/assets/images/general_exam/paper_bg.png);
}
.problemWrap .inner {
	width: 100%;
	max-width: 95rem;
	margin: 0 auto;
}
.problemWrap h2 {
	font-family: var(--fontFamily-sans-noto);
	font-weight: 700;
	font-size: clamp(2.4rem, var(--sp-24px), 3.5rem);
	line-height: 1.3;
	color: var(--colorMidNightBlue);
	margin-bottom: clamp(2rem, var(--sp-20px), 3.4rem);
	position: relative;
	text-align: center;
}
.problemWrap h2::before {
	position: relative;
	content: '';
	display: inline-block;
	background-image: url(/area/assets/images/general_exam/problemTtl_icon.svg);
	background-repeat: no-repeat;
	background-size: contain;
	width: 1.5em;
	aspect-ratio: 149/150;
	margin-right: 0.6rem;
	bottom: -0.6rem;
}
.problemWrap h2 strong {
	font-size: 120%;
	font-weight: 900;
}
.problemWrap h2:not(:first-child) {
	margin-top: 10rem;
}
.problemWrap .flexBox {
	display: flex;
	gap: 2rem;
	width: 100%;
	max-width: 90rem;
	margin: 0 auto;
}
.problemWrap .flexBox .txtBox {
	width: calc(100% - 37.5rem);
}
.problemWrap .flexBox img {
	height: 100%;
	margin-top: 0.6rem;
}
.problemWrap .flexBox .finishWrap {
	padding-top: 0.75em;
	display: flex;
	flex-direction: column;
	gap: 2rem;
}
.problemWrap .flexBox .finishWrap .departmentBox {
	width: 22em;
	background-color: #fff;
	border: 1px solid var(--colorMidNightBlue);
	border-radius: 1rem;
	padding-block: 0 1rem;
	padding-inline: 1rem;
	box-shadow: 2px 2px 8px rgba(76, 74, 52, 0.3);
}
.problemWrap .flexBox .finishWrap .departmentName {
	background-color: var(--colorMidNightBlue);
	color: #fff;
	font-family: var(--fontFamily-sans-noto);
	font-weight: 700;
	font-size: 1.8rem;
	line-height: 1;
	padding: 0.25em 1.5em 0.35em;
	border-radius: 50em;
	margin: -0.75em auto 1rem;
	display: flex;
	justify-content: center;
	align-items: center;
	width: fit-content;
}
.problemWrap .flexBox .finishWrap ul {
	padding-left: 3.2rem !important;
	margin-bottom: 0;
}
.problemWrap .flexBox .finishWrap p {
	margin-inline: auto;
	margin-top: -0.25em;
	font-family: var(--fontFamily-sans-noto);
	font-weight: 900;
	font-size: clamp(2.3rem, var(--sp-23px), 2.5rem);
	color: var(--colorOrange);
	line-height: 1;
	position: relative;
}
.problemWrap .flexBox .finishWrap p::before {
	position: relative;
	content: '';
	display: inline-block;
	background-color: var(--colorOrange);
	width: 1.5em;
	aspect-ratio: 1.5/1;
	clip-path: polygon(0 25%, 50% 25%, 50% 0, 100% 50%, 50% 100%, 50% 75%, 0 75%);
	margin: 0 0.5rem -0.3rem 0;
}
/* 入試内容 学部比較 */
.problemWrap .comparisonBox {
	background-color: #fff;
	border-radius: 1rem;
	box-shadow: 0 0 10px rgba(76, 74, 52, 0.3);
	width: 100%;
	max-width: 860px;
	margin: 5rem auto;
	padding-block: 2.8rem;
	padding-inline: 2.8rem;
	overflow: hidden;
	background-repeat: no-repeat;
	background-size: 45rem auto;
	background-position: right top;
	position: relative;
}
.problemWrap .comparisonBox::after {
	position: absolute;
	content: '';
}
.problemWrap .comparisonBox h3 {
	font-family: var(--fontFamily-sans-noto);
	font-weight: 700;
	font-size: clamp(2.4rem, var(--sp-24px), 2.8rem);
	margin-bottom: 1em;
	color: var(--colorLogoBlue);
	line-height: 1.2;
}
.problemWrap .comparisonBox .department {
	width: 100%;
	margin: 0 auto;
	display: flex;
	gap: 2rem;
	position: relative;
}
.problemWrap .comparisonBox .department:first-of-type {
	margin-bottom: 6rem;
}
.problemWrap .comparisonBox .department:first-of-type::after {
	position: absolute;
	content: '';
	background-color: #d6d6d8;
	width: 96%;
	height: 1px;
	left: 50%;
	bottom: -3rem;
	transform: translateX(-50%);
}
.problemWrap .comparisonBox .department .scoreBox {
	width: calc(100% - 24rem);
}
.problemWrap .comparisonBox .department .scoreBox h4 {
	background-color: #e2f1ff;
	padding: 0.5em 0.75em;
	border-radius: 0.4rem;
	line-height: 1.2;
	font-size: 1.8rem;
	margin-bottom: 0.75em;
}
.problemWrap .comparisonBox .department .scoreBox .totalscore {
	font-family: var(--fontFamily-sans-noto);
	font-weight: 700;
	font-size: 1.8rem;
	line-height: 1;
	margin-bottom: -0.5rem;
	text-align: center;
}
.problemWrap .comparisonBox .department .scoreBox .bar-graph {
	display: flex;
	margin-top: 1.2rem;
}
.problemWrap .comparisonBox .department .scoreBox .bar {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 8rem;
}
.problemWrap .comparisonBox .department .scoreBox .bar:not(:last-child) {
	border-right: 1px solid #fff;
}
.problemWrap .comparisonBox .department .scoreBox .bar.blue {
	background: var(--colorMidNightBlue);
}
.problemWrap .comparisonBox .department .scoreBox .bar.orange {
	background: var(--colorOrange);
}
.problemWrap .comparisonBox .department .scoreBox .label {
	color: #fff;
	font-weight: bold;
	font-size: clamp(1.2rem, var(--sp-12px), 1.5rem);
	line-height: 1.2;
	text-align: center;
	word-break: keep-all;
	z-index: 1;
}
.problemWrap .comparisonBox .department .scoreBox .bar.blue .label {
	text-shadow: 2px 2px 2px var(--colorMidNightBlue), -2px 2px 2px var(--colorMidNightBlue), 2px -2px 2px var(--colorMidNightBlue), -2px -2px 2px var(--colorMidNightBlue), 3px 0px 2px var(--colorMidNightBlue), -3px 0px 2px var(--colorMidNightBlue), 0px 3px 2px var(--colorMidNightBlue), 0px -3px 2px var(--colorMidNightBlue), 3px 3px 2px var(--colorMidNightBlue), -3px 3px 2px var(--colorMidNightBlue), 3px -3px 2px var(--colorMidNightBlue), -3px -3px 2px var(--colorMidNightBlue), 0px 0px 2px var(--colorMidNightBlue);
}
.problemWrap .comparisonBox .department .plusMark {
	font-family: var(--fontFamily-sans-noto);
	font-weight: 900;
	font-size: 3rem;
	line-height: 1;
	color: #8c959b;
	text-align: center;
	margin-block: 1rem 1.5rem;
}
.problemWrap .comparisonBox .department .pointWrap {
	border-radius: 6px;
	border: 1px solid var(--colorLightBlue);
	position: relative;
	padding-block: 2.3rem 1rem;
	padding-inline: 1.6rem;
	height: fit-content;
	background-color: rgba(255, 255, 255, 0.9);
	font-size: 1.6rem;
	line-height: 1.55;
	width: 17.5em;
	text-align: justify;
	margin-top: 1.6rem;
}
.problemWrap .comparisonBox .department .pointWrap::before {
	position: absolute;
	content: 'POINT';
	background-color: var(--colorLightBlue);
	color: #fff;
	font-family: 'Oswald';
	font-weight: 900;
	font-size: 1.8rem;
	line-height: 1;
	padding: 0.35em 1.25em;
	border-radius: 50em;
	left: 0.5rem;
	top: -0.95em;
}
/* 塾とメガスタの比較 */
.problemWrap .juku_megastaWrap {
	width: 375px;
	height: fit-content;
	background-color: #fff;
	border-radius: 1rem;
	box-shadow: 2px 2px 8px rgba(76, 74, 52, 0.3);
	padding: 2.4rem 1.6rem 1.6rem;
	margin-bottom: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.problemWrap .juku_megastaWrap p {
	margin-bottom: 0;
}
.problemWrap .juku_megastaWrap .juku_megastaBoxTtl {
	font-family: var(--fontFamily-sans-noto);
	font-weight: 900;
	font-size: clamp(2.4rem, var(--sp-24px), 2.6rem);
	color: var(--colorDarkBlue);
	text-align: center;
	line-height: 1;
	margin-bottom: 0.75em;
}
.problemWrap .juku_megastaWrap .caseBox {
	width: 100%;
}
.problemWrap .juku_megastaWrap .caseBox.juku {
	margin-bottom: 2rem;
}
.problemWrap .juku_megastaWrap .case {
	font-family: var(--fontFamily-sans-noto);
	font-size: 1.8rem;
	text-align: center;
	line-height: 1;
	padding: 0.5em;
	width: 100%;
	border-radius: 0.6rem;
}
.problemWrap .juku_megastaWrap .juku .case {
	font-weight: 500;
	border: 1px solid var(--colorLogoBlue);
	color: var(--colorLogoBlue);
}
.problemWrap .juku_megastaWrap .megasta .case {
	font-weight: 700;
	border: 2px solid var(--colorOrange);
	color: var(--colorOrange);
}
.problemWrap .juku_megastaWrap img {
	height: auto;
	display: inline;
	margin-top: 0;
}
.problemWrap .juku_megastaWrap ul {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
	gap: 0.5rem;
	width: 100%;
	list-style: none;
	padding: 0.75rem 0.5rem;
	margin: 0;
	writing-mode: vertical-lr;
}
.problemWrap .juku_megastaWrap li {
	display: flex;
	align-items: center;
	padding: 1rem;
	font-family: var(--fontFamily-sans-noto);
	font-weight: 500;
	line-height: 1.2;
	border-radius: 0.4rem;
	writing-mode: vertical-rl;
}
.problemWrap .juku_megastaWrap .juku li {
	background-color: #ececf9;
}
.problemWrap .juku_megastaWrap .megasta li {
	background-color: #fce5d9;
}
.problemWrap .juku_megastaWrap .answer {
	font-family: var(--fontFamily-sans-noto);
	line-height: 1.2;
	position: relative;
	text-indent: -1.75em;
	padding-left: 1.75em;
}
.problemWrap .juku_megastaWrap .juku .answer {
	font-weight: 700;
	font-size: 2rem;
	color: var(--colorLogoBlue);
}
.problemWrap .juku_megastaWrap .megasta .answer {
	font-weight: 900;
	font-size: 2.5rem;
	color: var(--colorOrange);
}
.problemWrap .juku_megastaWrap .answer::before {
	position: relative;
	content: '';
	display: inline-block;
	width: 1.5em;
	aspect-ratio: 1.5/1;
	clip-path: polygon(0 25%, 50% 25%, 50% 0, 100% 50%, 50% 100%, 50% 75%, 0 75%);
	margin: 0 0.5rem -0.3rem 0;
}
.problemWrap .juku_megastaWrap .juku .answer::before {
	background-color: var(--colorLogoBlue);
}
.problemWrap .juku_megastaWrap .megasta .answer::before {
	background-color: var(--colorOrange);
}
@media screen and (max-width: 960px) {
	.problemWrap .flexBox {
		flex-direction: column;
	}
	.problemWrap .flexBox .txtBox {
		width: 100%;
	}
	.problemWrap .flexBox img {
		margin-inline: auto;
	}
	.problemWrap .comparisonBox {
		padding-inline: 3vw;
		padding-block: 5vw 3vw;
		margin-block: 5vw;
	}
	.problemWrap .comparisonBox h3 {
		text-align: center;
		margin-bottom: 0.5em;
	}
	.problemWrap .comparisonBox .department {
		flex-direction: column;
	}
	.problemWrap .comparisonBox .department .scoreBox,
	.problemWrap .comparisonBox .department .pointWrap {
		width: 100%;
	}
	.problemWrap .comparisonBox .department .pointWrap {
		margin-top: 0;
	}
	.problemWrap .comparisonBox .department .scoreBox {
		margin-bottom: 1.5rem;
	}
	.problemWrap .comparisonBox .department .plusMark {
		margin-block: 1.5vw 2vw;
	}
	.problemWrap .flexBox .finishWrap {
		flex-direction: row;
		flex-wrap: wrap;
		gap: 2vw;
	}
	.problemWrap .flexBox .finishWrap .departmentBox {
		width: calc(50% - 1vw);
	}
	.problemWrap .juku_megastaWrap {
		width: 100%;
		flex-direction: row;
		flex-wrap: wrap;
		gap: 2vw;
	}
	.problemWrap .juku_megastaWrap .juku_megastaBoxTtl {
		width: 100%;
		text-align: center;
		margin-bottom: 0;
	}
	.problemWrap .juku_megastaWrap .caseBox {
		width: calc(50% - 1vw);
	}
	.problemWrap .juku_megastaWrap .case {
		min-height: 3.1em;
	}
	.problemWrap .juku_megastaWrap .juku .case {
		display: flex;
		justify-content: center;
		align-items: center;
	}
}
@media screen and (max-width: 600px) {
	.problemWrap {
		padding-block: 16vw 24vw;
	}
	.problemWrap h2:not(:first-child)::after {
		position: absolute;
		content: '';
		width: 98%;
		height: 1px;
		background-color: #9e9e9e;
		left: 50%;
		transform: translateX(-50%);
		top: -12.5vw;
	}
	.problemWrap .juku_megastaWrap .caseBox {
		width: 100%;
	}
	.problemWrap .juku_megastaWrap .juku_megastaBoxTtl {
		line-height: 1.2;
	}
	.problemWrap .flexBox .finishWrap {
		flex-direction: column;
		gap: 6vw;
	}
	.problemWrap .flexBox .finishWrap .departmentBox {
		width: 100%;
	}
}

/***********************************************************************
中間CTAwrap
***********************************************************************/
.problemWrap .buttonWrap {
	width: 100%;
	max-width: 76rem;
	margin: 8rem auto 0;
	flex-direction: row;
	gap: 4rem;
}
.problemWrap .buttonWrap .calltxt {
	font-family: var(--fontFamily-sans-noto);
	font-size: 1.5rem;
	font-weight: 500;
	text-align: center;
	line-height: 1.2;
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 2.4em;
	margin-bottom: 0.5em;
	color: var(--colorMidNightBlue);
	position: relative;
}
.problemWrap .buttonWrap .calltxt::before,
.problemWrap .buttonWrap .calltxt::after {
	position: relative;
	content: '';
	display: block;
	width: 2px;
	height: 2.4em;
	background-color: var(--colorMidNightBlue);
	bottom: 0;
}
.problemWrap .buttonWrap .calltxt::before {
	margin-right: 1em;
	transform: rotate(-30deg);
}
.problemWrap .buttonWrap .calltxt::after {
	margin-left: 1em;
	transform: rotate(30deg);
}
.problemWrap .buttonWrap a {
	width: 50%;
}
.problemWrap #entryBtn .smallText {
	margin-block: -0.15em 0.25em;
	font-size: 1.7rem;
	background-color: #fff;
	padding: 0.3em 1em;
	border-radius: 50em;
	font-weight: 700;
	color: var(--colorRed);
}
@media screen and (max-width: 834px) {
	.problemWrap .buttonWrap {
		flex-direction: column;
	}
	.problemWrap .buttonWrap .calltxt {
		margin-bottom: 0.3em;
	}
	.problemWrap .buttonWrap .calltxt::before,
	.problemWrap .buttonWrap .calltxt::after {
		bottom: -0.5vw;
	}
	.problemWrap .buttonWrap .calltxt::before {
		margin-right: 2.5vw;
	}
	.problemWrap .buttonWrap .calltxt::after {
		margin-left: 2.5vw;
	}
	.problemWrap .buttonWrap a {
		width: 90%;
	}
	.problemWrap :is(#telBtn, #entryBtn) {
		aspect-ratio: 277/80;
	}
}

/***********************************************************************
サービス紹介wrap
***********************************************************************/
.aboutWrap {
	width: 100%;
	padding-block: 8rem 7rem;
	padding-inline: 3vw;
}
.aboutWrap .bg {
	background-image: url(/area/assets/images/general_exam/usp_left.svg), url(/area/assets/images/general_exam/usp_right.svg), linear-gradient(60deg, rgba(255, 255, 255, 0.75), transparent, rgba(255, 255, 255, 0.75)), linear-gradient(90deg, #fcf8d9, #fce5d9);
	background-repeat: no-repeat;
	background-position: left bottom, right top, center, center;
	background-size: 30rem auto, 30rem auto, cover, cover;
}
.aboutWrap .inner {
	width: 100%;
	max-width: 110rem;
	margin: 0 auto;
	padding-block: 6rem 7rem;
	padding-inline: 9.9rem;
	background-color: rgba(255, 255, 255, 0.75);
	backdrop-filter: blur(0.6rem);
	border: 1px solid #fff;
	border-radius: 2rem;
	box-shadow: -5px -5px 10px rgba(254, 252, 242, 1), 3px 3px 6px rgba(124, 66, 31, 0.2);
	background-repeat: no-repeat;
	background-position: top left, top right;
	background-size: 30% auto;
}
.aboutWrap .inner:nth-of-type(2) {
	background-image: url(/area/assets/images/general_exam/usp_bg_left.png), url(/area/assets/images/general_exam/usp_bg_right.png);
}
.aboutWrap .inner:last-of-type {
	background-image: url(/area/assets/images/general_exam/uspTtl_left.png), url(/area/assets/images/general_exam/uspTtl_right.png);
}
.aboutWrap .inner:not(:last-of-type) {
	margin-bottom: 5rem;
}
.aboutWrap .aboutTtl {
	font-family: var(--fontFamily-sans-noto);
	font-weight: 900;
	font-size: clamp(4.5rem, 5.389vw, 5.5rem);
	line-height: 1.2;
	color: var(--colorLightBlue);
	text-align: center;
	margin-bottom: 3.4rem;
	text-shadow: 0 0 0.2em #fff, 0 0 0.2em #fff, 0 0 0.2em #fff, 0 0 0.2em #fff, 0 0 0.2em #fff, 0 0 0.2em #fff, 0 0 0.2em #fff, 0 0 0.2em #fff, 0 0 0.2em #fff, 0 0 0.2em #fff;
}
.aboutWrap .inner:last-of-type .aboutTtl {
	margin-bottom: 11rem;
}
.aboutWrap h2 .firstLine {
	background-color: var(--colorOrange);
	color: #fff;
	font-size: clamp(1.8rem, var(--sp-18px), 2.8rem);
	display: block;
	width: fit-content;
	padding: 0.5em 1.5em;
	text-align: center;
	margin: 0 auto 1.3rem;
	border-radius: 50em;
	filter: drop-shadow(3px 3px 0 rgba(130, 42, 99, 0.3));
	position: relative;
	text-shadow: none;
	letter-spacing: 0.02em;
}
.aboutWrap h2 .firstLine::after {
	position: absolute;
	content: '';
	background-color: var(--colorOrange);
	width: 1.5em;
	height: 0.6em;
	clip-path: polygon(20% 0, 80% 0, 0 100%);
	left: 50%;
	bottom: -0.59em;
	transform: translateX(-50%);
}
.aboutWrap h2 .firstLine span {
	font-size: 125%;
}
.aboutWrap h2 .smallTxt {
	font-size: 75%;
}
.aboutWrap .media_inner.public {
	margin-block: 4.5rem 10rem !important;
}
.media_inner.public::after {
	bottom: -5rem !important;
}
.aboutWrap .media_inner h2 {
	font-size: clamp(2.4rem, var(--sp-24px), 3.5rem);
	margin-bottom: 1.75rem;
}
.media_inner .mediaCard div {
	box-shadow: unset !important;
}
.media_inner .mediaCard div p {
	padding-inline: 0;
}
.media_inner.public .mediaCard div {
	background-color: #e2f1ff;
	border-color: var(--colorLightBlue);
}
.media_inner.mass_media .mediaCard div {
	background-color: #fce5d9;
	border-color: var(--colorOrange);
}
.aboutWrap h3 {
	font-family: var(--fontFamily-sans-noto);
	font-weight: 700;
	font-size: 3.2rem;
	line-height: 1.2;
	color: var(--colorDarkBlue);
	width: 100%;
	margin-block: 6rem 3rem;
	position: relative;
}
.aboutWrap h3:not(:first-of-type) {
	margin-top: 18rem;
}
.aboutWrap h3::before {
	position: absolute;
	counter-increment: usp-counter 1;
	content: '理由 ' counter(usp-counter, decimal-leading-zero);
	display: block;
	background-image: linear-gradient(var(--colorLogoBlue), var(--colorMidNightBlue));
	color: #fff;
	font-family: 'Oswald', var(--fontFamily-sans-noto);
	font-weight: 400;
	font-size: 2.5rem;
	line-height: 1;
	padding-block: 0.5em;
	padding-inline: 10rem 1em;
	border-radius: 0 0.6rem 0.6rem 0;
	left: -9.9rem;
	top: -6rem;
}
.aboutWrap .imgLazy {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	width: 100%;
	max-width: 74rem;
	margin: 1.6rem auto;
}
.aboutWrap sup {
	font-size: 60%;
	top: -0.65em;
}
.aboutWrap .inner p {
	padding-inline: 1em;
}
.aboutWrap .note {
	display: block;
	font-size: 85%;
	color: #8c959b;
}
.aboutWrap .teacherSliderWrap {
	margin-block: -2rem;
	width: calc(100% + 19.8rem);
}
.aboutWrap .swiper.teacherSlider .item img {
	width: clamp(12rem, var(--sp-12px), 18rem);
}
.aboutWrap .swiper.teacherSlider .item .info .comment {
	padding-inline: 0;
	font-size: clamp(1.7rem, var(--sp-17px), 2rem);
}
.aboutWrap .university_photo {
	display: flex;
	gap: 0;
	width: 100%;
	max-width: 80rem;
	height: clamp(12rem, var(--sp-120px), 20rem);
	margin: 2rem auto;
}
.aboutWrap .university_photo div {
	width: 100%;
}
.aboutWrap .university_photo img {
	object-fit: cover;
	width: 100%;
	height: 100%;
}
.aboutWrap #reason_system {
	padding: clamp(2rem, var(--sp-20px), 3rem);
	margin-bottom: 25px;
	border: solid 1px #bc2141;
	background: #fffcf4;
}
.aboutWrap #reason_system img {
	height: 100%;
}
.aboutWrap #reason_system_ttl {
	margin-bottom: 1rem;
	color: #bc2141;
	text-align: center;
	font: 700 clamp(1.95rem, 5.2vw, 2.4rem) / 1.3 'YuGothic', Yu Gothic, 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN', 'Hiragino Sans', Quicksand, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	font-feature-settings: 'halt';
}
.aboutWrap .onlineMovie_box picture {
	margin-block: 0 0.6rem;
}
.aboutWrap .onlineMovie_box p {
	line-height: 1.3;
	margin-bottom: 0;
}
.aboutWrap #reason_system:nth-last-of-type(2) .imgLazy {
	margin-top: -2rem;
}
.aboutWrap .reason_system_txt {
	width: 100%;
	max-width: 75.2rem;
	margin: 2rem auto 0;
}
.aboutWrap .reason_system_txt li {
	position: relative;
	margin-bottom: 10px;
	padding-left: 20px;
	line-height: 1.4;
	font-weight: 700;
	font-size: 1.8rem;
}
.aboutWrap .reason_system_txt li:last-child {
	margin-bottom: 0;
}
.aboutWrap .reason_system_txt li::before {
	content: '・';
	position: absolute;
	top: 0;
	left: -5px;
	font: inherit;
}
.aboutWrap .annotation {
	font-size: 1.4rem;
	color: #555555;
	line-height: 1;
	font-weight: normal;
	text-indent: -1em;
	margin-left: -1em;
}
.aboutWrap .supportWrap {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 2rem;
	margin-block: 2rem 4rem;
}
.aboutWrap .supportWrap .imgLazy {
	gap: 0;
	margin-block: 0;
}
.aboutWrap .supportWrap img {
	width: 236px;
	height: auto;
	aspect-ratio: 236/146;
	object-fit: contain;
	margin: 0 auto;
}
.aboutWrap .supportWrap .item {
	border-radius: 1rem;
	padding: 1rem;
	box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.15);
	border: 2px solid;
}
.aboutWrap .supportWrap .item h4 {
	font-family: var(--fontFamily-sans-noto);
	font-weight: 900;
	font-size: 2.15rem;
	line-height: 1.2;
	background-color: #fff;
	padding: 1rem;
	border-radius: 0.6rem;
	text-align: center;
	margin-bottom: 1rem;
}
.aboutWrap .supportWrap .item h4 span {
	color: #656565;
	font-weight: 500;
	font-size: 1.7rem;
	display: block;
	text-align: center;
	margin-bottom: 0.4rem;
}
.aboutWrap .supportWrap .item.mimamori {
	background-color: #edffe6;
	border-color: #108831;
	& h4 {
		color: #108831;
	}
}
.aboutWrap .supportWrap .item.up {
	background-color: #fff2e7;
	border-color: #f64b00;
	& h4 {
		color: #f64b00;
	}
}
.aboutWrap .supportWrap .item.system {
	background-color: #fff6e1;
	border-color: #f6a002;
	& h4 {
		color: #f6a002;
	}
}
@media screen and (max-width: 834px) {
	.aboutWrap {
		padding-block: 8vw;
	}
	.aboutWrap .bg {
		background-size: 50% auto, 50% auto, cover, cover;
	}
	.aboutWrap h2 .firstLine {
		padding-inline: 1.5em;
	}
	.aboutWrap .aboutTtl {
		font-size: clamp(3rem, var(--sp-30px), 4.5rem);
		margin-bottom: 5vw;
	}
	.aboutWrap .inner {
		padding-inline: 3vw;
		padding-block: 5.5vw 4vw;
	}
	.aboutWrap .inner p {
		padding-inline: unset;
	}
	.aboutWrap .inner:nth-of-type(2) {
		background-size: 50% auto;
	}
	.aboutWrap h3:not(:first-of-type) {
		margin-block: 14rem 2rem;
	}
	.aboutWrap h3::before {
		left: -3vw;
		padding-left: 3vw;
	}
	.aboutWrap .teacherSliderWrap {
		width: calc(100% + 2em);
	}
	.aboutWrap .supportWrap {
		grid-template-columns: 1fr 1fr;
	}
}
@media screen and (max-width: 600px) {
	.aboutWrap .inner {
		padding-inline: 1em;
		padding-block: 10vw 7vw;
	}
	.aboutWrap .inner:last-of-type {
		padding-top: 5vw;
		background-size: 45% auto;
	}
	.aboutWrap .inner:last-of-type .aboutTtl {
		margin-bottom: 20vw;
	}
	.aboutWrap h3::before {
		font-size: 5vw;
		top: -12vw;
		left: -1em;
		padding-left: 1em;
	}
	.aboutWrap h3 {
		font-size: 6.4vw;
		margin-block: 12vw 6vw;
	}
	.aboutWrap h3:not(:first-of-type) {
		margin-block: 30vw 3.5vw;
	}
	.media_inner.public h2::before {
		left: -0.5em !important;
	}
	.media_inner.public h2::after {
		right: -0.3em !important;
	}

	.aboutWrap .onlineMovie_box p {
		text-align: left;
	}
	.aboutWrap .supportWrap {
		display: flex;
		flex-direction: column;
		margin-bottom: 7vw;
	}
	.aboutWrap .supportWrap img {
		aspect-ratio: auto;
	}
}

/* USPスライダー */
.aboutWrap .usp_passWrap {
	position: relative;
	content: '';
	width: 110rem;
	left: 50%;
	transform: translateX(-50%);
	background-image: url(/koukousei/site_wp/wp-content/themes/site/images/top/mainView_bg_before.png), url(/koukousei/site_wp/wp-content/themes/site/images/top/mainView_bg_after.png), linear-gradient(0.25turn, #fbc5be, #fcefed 50%, #fbc5be);
	background-repeat: no-repeat;
	background-size: 55rem auto, 55rem auto, cover;
	background-position: calc(50% - 52rem) 0, calc(50% + 52rem) 0, 50% 50%;
	overflow: hidden;
}
.aboutWrap .usp_passWrap h2 {
	text-align: center;
	font-size: clamp(2rem, var(--sp-20px), 3.2rem);
	padding-block: 6rem;
	position: relative;
}
.aboutWrap .usp_passWrap h2::before,
.aboutWrap .usp_passWrap h2::after {
	position: absolute;
	content: '';
	aspect-ratio: 450/271;
	width: 40rem;
	background-repeat: no-repeat;
	background-size: contain;
	top: 1rem;
}
.aboutWrap .usp_passWrap h2::before {
	background-image: url('/koukousei/site_wp/wp-content/themes/site/images/top/pass_ttl_before.png.webp');
	left: calc(50% - 58rem);
}
.aboutWrap .usp_passWrap h2::after {
	background-image: url('/koukousei/site_wp/wp-content/themes/site/images/top/pass_ttl_after.png.webp');
	right: calc(50% - 59rem);
}
.aboutWrap .usp_passWrap .swiper-slide {
	width: 27.4rem;
}
.aboutWrap .usp_passWrap .swiper-slide .item {
	background-color: #fff;
	border: solid 1px #b95367;
}
.aboutWrap .usp_passWrap .swiper-slide .item .pass_copy {
	font-weight: bold;
	font-size: 2rem;
	color: #c21538;
	line-height: 1.2;
	font-feature-settings: 'halt';
	margin-bottom: 0;
	text-indent: -0.5em;
	padding-block: 0.5em;
	padding-inline: 1em 0.5em;
}
.aboutWrap .usp_passWrap .swiper-slide .item img {
	width: 100%;
	height: 18rem;
	object-fit: cover;
}
.aboutWrap .usp_passWrap .swiper-slide .item .pass_name {
	font-size: 1.5rem;
	line-height: 1.3;
	margin-bottom: 0;
	padding: 0.5em;
	color: #333;
	min-height: 4.9em;
	font-feature-settings: 'halt';
}
.aboutWrap .usp_passWrap .swiper-slide .item .pass_name span {
	font-weight: bold;
}
.aboutWrap .usp_passWrap :is(.swiper-button-prev, .swiper-button-next) {
	width: 6rem;
	height: 6rem;
	background-image: linear-gradient(#ffffff, #d9d9d9);
	border-radius: 50em;
	outline: 2px solid #fff;
	box-shadow: 0 0 20px rgba(110, 110, 110, 0.65);
	top: 50%;
}
.aboutWrap .usp_passWrap .swiper-button-prev {
	left: 1.6rem;
}
.aboutWrap .usp_passWrap .swiper-button-next {
	right: 1.6rem;
}
.aboutWrap .usp_passWrap :is(.swiper-button-prev, .swiper-button-next)::after {
	content: '';
	background-color: rgba(26, 41, 74, 0.5);
	width: 2rem;
	height: 3rem;
	clip-path: polygon(0 0, 100% 50%, 0 100%);
}
.aboutWrap .usp_passWrap .swiper-button-prev::after {
	transform: scaleX(-1);
	margin-left: -6px;
}
.aboutWrap .usp_passWrap .swiper-button-next::after {
	margin-right: -6px;
}
.aboutWrap .usp_passWrap .note {
	font-size: clamp(1.2rem, var(--sp-12px), 1.4rem);
	color: #3c3c3c;
	line-height: 1;
	text-align: right;
	margin-bottom: 0;
	width: 100%;
	padding-inline: 2rem;
	padding-block: 1em;
}
@media screen and (max-width: 834px) {
	.aboutWrap .usp_passWrap {
		width: calc(100% + 6vw);
		background-size: 70vw auto, 70vw auto, cover;
		background-position: calc(50% - 55vw) 0, calc(50% + 55vw) 0, 50% 50%;
	}
	.aboutWrap .usp_passWrap h2 {
		padding-block: 4.5vw;
		line-height: 1.2;
	}
	.aboutWrap .usp_passWrap h2::before,
	.aboutWrap .usp_passWrap h2::after {
		width: 35vw;
	}
	.aboutWrap .usp_passWrap h2::before {
		left: calc(50% - 51vw);
	}
	.aboutWrap .usp_passWrap h2::after {
		right: calc(50% - 53vw);
	}
	.aboutWrap .usp_passWrap .swiper-slide {
		width: 20rem;
	}
	.aboutWrap .usp_passWrap .swiper-slide .item .pass_copy {
		font-size: 1.65rem;
	}
	.aboutWrap .usp_passWrap .swiper-slide .item img {
		height: 16vw;
	}
	.aboutWrap .usp_passWrap :is(.swiper-button-prev, .swiper-button-next) {
		width: 4.5rem;
		height: 4.5rem;
	}

	.aboutWrap .usp_passWrap :is(.swiper-button-prev, .swiper-button-next)::after {
		width: 1.5rem;
		height: 2.5rem;
	}
}
@media screen and (max-width: 600px) {
	.aboutWrap .usp_passWrap {
		width: calc(100% + 2em);
	}
	.aboutWrap .usp_passWrap h2 {
		padding-block: 8vw;
	}
	.aboutWrap .usp_passWrap h2::before,
	.aboutWrap .usp_passWrap h2::after {
		width: 21vw;
		top: 2vw;
	}
	.aboutWrap .usp_passWrap h2::before {
		background-image: url(/koukousei/site_wp/wp-content/themes/site/images/top/pass_ttl_before_sp.png.webp);
		aspect-ratio: 87/148;
		left: -1vw;
	}
	.aboutWrap .usp_passWrap h2::after {
		background-image: url(/koukousei/site_wp/wp-content/themes/site/images/top/pass_ttl_after_sp.png.webp);
		aspect-ratio: 89/145;
		right: -1vw;
	}
	.aboutWrap .usp_passWrap .swiper-slide .item img {
		height: 27vw;
	}
	.aboutWrap .usp_passWrap .swiper-button-prev {
		left: 1vw;
	}
	.aboutWrap .usp_passWrap .swiper-button-next {
		right: 1vw;
	}
	.aboutWrap .usp_passWrap .note {
		line-height: 1.3;
	}
}

/***********************************************************************
クロージング
***********************************************************************/
.before-closing {
	background-image: linear-gradient(90deg, #f1f2f3, #fff 20% 80%, #f1f2f3);
	padding-block: clamp(5rem, var(--sp-50px), 7rem);
	padding-inline: 5vw;
}
.before-closing .inner {
	width: 100%;
	max-width: 80rem;
	margin: 0 auto;
}
.before-closing h2 {
	font-family: var(--fontFamily-serif-noto);
	font-weight: 900;
	font-size: clamp(2.4rem, var(--sp-24px), 3.4rem);
	line-height: 1.4;
	margin-bottom: clamp(2rem, var(--sp-20px), 2.8rem);
	color: var(--colorOrange);
}