@charset "UTF-8";

*,
*:before,
*:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}

html {
	width: 100%;
	height: 100%;
	font-size: 62.5%;
	scroll-behavior: smooth;
}

body {
	background-color: #fff;
	color: #000000;
	font-family: "新丸ゴ", "Shin Maru Go", "Noto Sans JP", serif;
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 1.5;
	width: 100%;
	height: 100%;
	position: relative;
	-webkit-text-size-adjust: 100%;
	min-width: 320px;
	display: flex;
	flex-direction: column;
}

a {
	text-decoration: none;
	color: #464646;
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
	cursor: pointer;
}

a,
button {
	transition: all .6s ease 0s;
}

p a,
label a {
	color: #014BB1;
}

a:hover,
button:hover {
	opacity: .7;
}

strong,
em {
	font-style: normal;
	font-weight: 300
}

ul,
li {
	list-style: none;
	word-wrap: break-word;
}

p {
	text-align: justify;
	word-wrap: break-word;
}

img {
	max-width: 100%;
}

.ib {
	display: inline-block;
}

.tc {
	text-align: center !important;
}

.tr {
	text-align: right !important;
}

.tl {
	text-align: left !important;
}

.bold {
	font-weight: bold !important;
}

.mb5 {
	margin-bottom: 5px;
}

.mb10 {
	margin-bottom: 10px;
}

.mb15 {
	margin-bottom: 15px;
}

.mb20 {
	margin-bottom: 20px;
}

.mb25 {
	margin-bottom: 25px;
}

.mb30 {
	margin-bottom: 30px;
}

.mb35 {
	margin-bottom: 35px;
}

.mb40 {
	margin-bottom: 40px;
}

.mb45 {
	margin-bottom: 45px;
}

.mb50 {
	margin-bottom: 50px;
}

.mb55 {
	margin-bottom: 55px;
}

.mb60 {
	margin-bottom: 60px;
}

.mb70 {
	margin-bottom: 70px;
}

.mb80 {
	margin-bottom: 80px;
}

.txt_color_orange {
	color: #FF7F3E;
}

@media screen and (min-width: 801px) {
	.smt {
		display: none !important;
	}
}

@media screen and (max-width: 800px) {
	.pc {
		display: none !important
	}
}

.application_btn {
	font-size: min(4.2vw,2.3rem);
	font-weight: bold;
	width: 510px;
	max-width: 100%;
	margin: 0 auto;
    height: 3.4em;
	min-height: 66px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 8px;
	color: #fff;
	background-color: #D41238;
	box-shadow: 2px 5px #91394E;
	position: relative;
	z-index: 2;
}

.application_btn:hover {
	box-shadow:none;
	transform: translate(5px,2px);
}

/* ===========================
 layout
=========================== */
.inr {
	width: 100%;
    max-width: 1040px;
    margin: 0 auto;
	padding: 0 6vw;
}

.inr_860 {
	width: 100%;
    max-width: 900px;
    margin: 0 auto;
	padding: 0 5vw;
}

@media (min-width: 800px) {

	.inr ,
	.inr_860 {
        padding: 0 20px;
    }

}


/* ===========================
 footer
=========================== */
.footer {
	background-color: #F3F1EA;
	padding: 3px 0 30px;
	font-size: 1.5rem;
}

.footer_logo {
	margin-bottom: 28px;
	display: block;
	text-align: center;
}

@media (min-width: 800px) {

	.footer {
		padding: 15px 0 40px;
	}

}

/* ===========================
 mv
=========================== */
.mv {
	text-align: center;
}


.mv_inr img {
	width: 100%;
}


/* ===========================
 lead
=========================== */
.lead {
	padding: 50px 0 40px;
	background-color: #3A92C2;
}

.lead_ttl {
	font-size: min(7vw,3.1rem);
	text-align: justify;
	font-weight: bold;
	color: #FFF000;
	margin-bottom: 35px;
}

.lead_catch {
	width: 90%;
	max-width: 428px;
	margin-bottom: 20px;
}

.lead_txt {
	color: #fff;
	font-size: 1.8rem;
	font-weight: 500;
	line-height: 1.66;
}

.lead_img {
	text-align: center;
	width: 266px;
	margin: 0 auto;
	text-align: center;
}

@media (min-width: 800px) {
	.lead {
		padding: 50px 0 40px;
	}

	.lead_body {
		flex: 1;
		max-width: 615px;
	}

	.lead_wrap {
		display: flex;
		gap: 3%;
		padding-right: 2%;
	}

	.lead_img {
		margin-top: -10px;
	}
}

/* ===========================
 ttl
=========================== */

.ondemand_course_ttl {
	color: #D25D8B;
	font-weight: 800;
	font-size: 23px;
	text-align: center;
	border: none;
	display: flex;
	justify-content: center;
	gap: 10px;
	font-size: 4vw;
}
.ondemand_course_ttl span {
	border: none;
}
.ondemand_course_ttl span:not(.ib) {
	border: none;
	padding-left: 0;
	letter-spacing: 0;
	padding: 8px 0;
}
.ondemand_course_ttl::before ,
.ondemand_course_ttl::after {
	content: "";
	display: block;
	width: 2px;
	background-color: #D25D8B;
}
.ondemand_course_ttl::before {
	transform: rotate(-27deg);
}
.ondemand_course_ttl::after {
	transform: rotate(27deg);
}

@media only screen and (min-width: 800px){
	.ondemand_course_ttl {
		gap: 30px;
		font-size: 23px;
	}
}

/* ===========================
 ondemand_app
=========================== */
.ondemand_app {
	padding: 90px 0 60px;
	position: relative;
	overflow: hidden;
}

.ondemand_app::before ,
.ondemand_app::after {
	content: "";
	display: block;
	position: absolute;
    width: 41%;
    padding-top: 25%;
}

.ondemand_app::before {
	background: url(../img/deco_flag.png) no-repeat;
	background-size: contain;
	top: 0;
	left: -1%;
}

.ondemand_app::after {
	background: url(../img/deco_flag2.png) no-repeat;
	background-size: contain;
	top: 0;
	right: -1%;
}

.ondemand_video {
	width: 100%;
	aspect-ratio: 1 /0.5;
}

.ondemand_video iframe {
	width: 100%;
	height: 100%;
}

.ondemand_app .ondemand_course_ttl {
	line-height: 1.43;
	margin-top: 20px;
}

.ondemand_app .ondemand_course_ttl span {
	padding: 0;
}

.ondemand_app_intro {
	margin-bottom: 60px;
}

.ondemand_app_intro_img {
	margin-top: 10px;
}

.ondemand_app_intro_img img {
	width: 100%;
}

@media only screen and (min-width: 800px){
	.ondemand_app::before ,
	.ondemand_app::after {
		width: 16%;
		padding-top: 7%;
	}

	.ondemand_app_intro {
		display: flex;
	}
	.ondemand_app_intro_txt {
		flex: 1;
	}
	.ondemand_app_intro_img {
		text-align: center;
		width: 293px;
		margin:0 0 0 23px;
	}
}

/* ===========================
 ondemand_content
=========================== */

.ondemand_content {
	padding: 70px 0 100px;
	background: url(../img/bg_deco.png);
	counter-reset: number 0;
	overflow: hidden;
}

.ondemand_content_catch {
	font-size: min(10vw,4rem);
	font-weight: bold;
	text-align: center;
	color: #3A92C2;
    margin-bottom: min(9vw, 65px);
}

.ondemand_content_deco {
    top: 0;
    position: absolute;
	width: clamp(131px, 39vw, 180px);
    height: clamp(131px, 39vw, 180px);
    background: url(../img/deco_content.png) no-repeat;
    background-size: contain;
    right: 0;
    transform: translate(0%, -28%);
    color: #fff;
    font-size: min(3.2vw, 1.4rem);
    line-height: 1.3;
    font-weight: bold;
    text-align: center;
    bottom: 97%;
    z-index: 9999;
}

.ondemand_content_deco_inr {
	position: relative;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	transform: rotate(7deg);
}

.ondemand_content_deco span {
	display: block;
	font-weight: bold;
    font-size: min(5vw, 2.8rem);
	color: #EFEF00;
	line-height: 1.2;
}

.ondemand_content_inr {
	background-color: #fff;
	padding: 60px 5%;
	margin-bottom: 90px;
	position: relative;
}

.ondemand_content .ondemand_content_ttl {
	padding: 17px 12px 17px 20px;
	margin-bottom: 30px;
}

.ondemand_content .ondemand_content_ttl::after {
	width: 37px;
	height: 37px;
	font-size: 25px;
}

.ondemand_content_box {
	max-width: 760px;
	margin: 0 auto;
}

.ondemand_content_box:not(:first-of-type) {
	padding: 35px 0 0;
}

.ondemand_content_img {
	margin-top: 10px;
}

.ondemand_content_img img {
	width: 100%;
}

.ondemand_content_list {
	counter-reset: number 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 14px 26px;
    margin: 35px 0;
}

.ondemand_content_ttl {
	position: relative;
	color: #333;
	border: 4px solid #6DAD19;
	background-color: #F5F8E8;
	border-radius: 11px;
	min-height: 63px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	font-size: min(5vw,19px);
	font-weight: bold;
	box-sizing: border-box;

}

a.ondemand_content_ttl {
	transition:  0.3s;
	overflow: visible;
}

a.ondemand_content_ttl:hover {
	opacity: 0.7;
	text-decoration: none;
}

.ondemand_content_ttl span {
	display: block;
	width: 100%;
	text-align: center;
    padding-top: 15px;
    margin-top: 12px;
	border-top: 1px solid #6DAD19;
}

.ondemand_content_ttl::after {
	counter-increment: number 1;
	content: counter(number);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	font-size: 19px;
	font-weight: bold;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translate(-50%,-50%);
	color: #fff;
	background-color: #6DAD19;
}

.ondemand_content_ttl.ondemand_content_ttl_quiz {
	border: 4px solid #ED6B00;
	background-color: #FFF4E4;
}

.ondemand_content_ttl.ondemand_content_ttl_quiz::after {
	background-color: #ED6B00;
}

.ondemand_content_ttl.ondemand_content_ttl_quiz span {
	border-top: 1px solid #ED6B00;
}

.ondemand_content_ttl.ondemand_content_ttl_summary {
	border: 4px solid #00A2E9;
	background-color: #E5F4FD;
}

.ondemand_content_ttl.ondemand_content_ttl_summary::after {
	background-color: #00A2E9;
}

.ondemand_content_ttl.ondemand_content_ttl_summary span {
	border-top: 1px solid #00A2E9;
}

.ondemand_content_ttl.ondemand_content_ttl_past {
	border: 4px solid #DF5092;
	background-color: #FBEAF2;
}

.ondemand_content_ttl.ondemand_content_ttl_past::after {
	background-color: #DF5092;
}

.ondemand_content_ttl.ondemand_content_ttl_past span {
	border-top: 1px solid #DF5092;
}

.ondemand_content_ttl.ondemand_content_ttl_guideline {
	border: 4px solid #8E4E95;
	background-color: #F1F0F8;
}

.ondemand_content_ttl.ondemand_content_ttl_guideline::after {
	background-color: #8E4E95;
}

.ondemand_content_ttl.ondemand_content_ttl_guideline span {
	border-top: 1px solid #8E4E95;
}

.ondemand_content_ttl.ondemand_content_ttl_goro {
	border: 4px solid #FFBE00;
	background-color: #FFFDE9;
}

.ondemand_content_ttl.ondemand_content_ttl_goro::after {
	background-color: #FFBE00;
}

.ondemand_content_ttl.ondemand_content_ttl_goro span {
	border-top: 1px solid #FFBE00;
}

.similar_txt {
	color: #fff;
	background-color: #24468B;
	text-align: center;
	padding: 8px 10px 5px;
	position: relative;
	font-size: 14px;
	display: block;
	line-height: 1.2;
	margin-bottom: 15px;
}

.similar_txt::after {
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-right: 7px solid transparent;
	border-left: 7px solid transparent;
	border-top: 13px solid #244680;
	border-bottom: 0;
	position: absolute;
	bottom: -10px;
	left: 50%;
	transform: translateX(-50%);
}

.similar_txt span:not(.ib) {
	font-size: min(5vw,17px);
	display: block;
}

.similar_txt span:not(.ib) span {
	color: #FFEA05;
	display: inline-block;
}


@media only screen and (min-width: 800px){
	.ondemand_content_catch {
		margin-bottom: 65px;
	}

	.ondemand_content_box {
		display: flex;
	}

	.ondemand_content_img {
		margin: 0 0 0 20px;
		width: 48%;
	}

	.ondemand_content_body {
		flex: 1;
	}

	.ondemand_content_deco {
		font-size: 1.9rem;
		width: 50vw;
		height: 50vw;
		max-width: 242px;
		max-height: 227px;
		top: -170px;
		bottom: initial;
		right: -35px;
		transform: none;
	}

	.ondemand_content_deco span {
		font-size: 3.7rem;
	}
}


/* ===========================
 cta
=========================== */

.cta {
	background-color: #3A92C2;
	overflow: hidden;
}

.cta_ttl {
	font-size: min(8vw,3.3rem);
	font-weight: bold;
	color: #FFF000;
	text-align: center;
	margin-bottom:30px;
}

.cta_ttl span {
	position: relative;
}

.cta_ttl span::before ,
.cta_ttl span::after {
	content: "";
	position: absolute;
	display: block;
}

.cta_ttl span::before {
	background: url(../img/deco_star.png) no-repeat;
	background-size: contain;
	width: 24px;
	height: 25px;
	left: -33px;
}

.cta_ttl span::after {
	background: url(../img/deco_star2.png) no-repeat;
	background-size: contain;
	width: 52px;
	height: 56px;
    top: -8px;
    right: -61px;
}

.cta_inr {
	padding: 35px 0 55px;
	max-width: 600px;
	margin: 0 auto;
	position: relative;
}

.cta_inr::before ,
.cta_inr::after {
	content: "";
	position: absolute;
	display: block;
}

.cta_inr::before {
	bottom: 0;
	background: url(../img/deco_man.png) bottom left no-repeat;
	background-size: contain;
    width: 31vw;
    padding-top: 55vw;
    margin-bottom: -2px;
    left: 0;
    z-index: 1;
    max-width: 185px;
}

.cta_inr::after {
	bottom: 0;
	background: url(../img/deco_woman.png) bottom right no-repeat;
	background-size: contain;
    width: 31vw;
    padding-top: 55vw;
    margin-bottom: -2px;
    right: 0;
    z-index: 1;
    max-width: 185px;
}

.cta_box {
	background-color: #fff;
	margin: 0 auto 24vw;
	padding: 6%;
}

.cta_box dl {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	flex-direction: column;
}

.cta_box dt {
	font-size: min(7vw,3.3rem);
	font-weight: bold;
	color: #fff;
	background-color: #3A92C2;
	border-radius: 8px;
	width: 158px;
    height: 1.75em;
	display: flex;
	align-items: center;
	justify-content: center;
}

.cta_box dd {
	font-size: min(9vw,4rem);
	font-weight: bold;
}

.cta_box dd span {
	font-size: min(5vw,2.4rem);
	font-weight: bold;
	padding-left: 0.4em;
}

.cta_box dd:nth-of-type(1) {
	margin-bottom: 5vw;
}

@media only screen and (min-width: 800px){

	.cta_ttl span::before {
		width: 24px;
		height: 25px;
		left: -70px;
		top: 14px;
	}

	.cta_ttl span::after {
		width: 52px;
		height: 56px;
		top: 0;
		right: -104px;
	}

	.cta_inr::before {
		bottom: 0;
		width: 185px;
		padding-top: 52%;
		margin-bottom: -2px;
		left: -197px;
	}
	
	.cta_inr::after {
		bottom: 0;
		width: 184px;
		padding-top: 51%;
		margin-bottom: -2px;
		right: -197px;
	}

	.cta_box {
		padding: 26px;
		margin-bottom: 42px;
	}

	.cta_box dl {
		flex-direction: row;
		gap: 20px 0;
	}

	.cta_box dd {
		width: calc(100% - 158px);
		padding-left: 15px;
	}

	.cta_box dd:nth-of-type(1) {
		margin-bottom: 0;
	}
}


/* ===========================
 schedule
=========================== */

.schedule {
	padding: 40px 0 45px;
}

.schedule_catch {
	font-size: min(5.8vw,4rem);
	font-weight: bold;
	text-align: center;
	color: #3A92C2;
	margin-bottom: 35px;
}

.schedule_ttl {
	color: #538FBD;
	letter-spacing: 0.04em;
	font-size: min(6vw,2.5rem);
	margin: 0 auto;
	background-color: #FBEE4A;
	text-align: center;
	font-weight: bold;
	padding: 7px 10px;
	position: relative;
}

.schedule_ttl span {
	display: inline-block;
}

.schedule_flow li:first-child .schedule_ttl::after {
	content: "忘れずに!";
	color: #FBEE4A;
	font-size: 1.5rem;
	font-weight: bold;
	display: block;
	width: 105px;
	height: 98px;
	background: url(../img/deco_content.png) center no-repeat;
	background-size: contain;
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
    top: 57%;
    right: 0;
    transform: translate(85%, -50%) rotate(20deg);
}

.schedule_label {
	display: block;
	margin: 0 auto;
	font-size: min(4.5vw,1.9rem);
	font-weight: bold;
	color: #fff;
	background-color: #538FBD;
	border-radius: 6px;
	padding: 1px 20px;
	max-width: 360px;
	margin-bottom: 10px;
}

.schedule_flow {
	max-width: 400px;
	margin: 0 auto;
}

.schedule_flow li {
	padding-bottom: 43px;
	position: relative;
}

.schedule_flow li::after {
	content: "";
	position: absolute;
	bottom: 10px;
	left: 50%;
	transform: translateX(-50%);
	width: 0;
	height: 0;
	border-style: solid;
	border-right: 8px solid transparent;
	border-left: 8px solid transparent;
	border-top: 13px solid #538fbd;
	border-bottom: 0;
}

.schedule_flow li:last-of-type {
	padding-bottom: 0;
}

.schedule_flow li:last-of-type::after {
	content: none;
}

.schedule_date {
    font-size: min(4vw, 2.2rem);
	font-weight: bold;
	padding: 0 17px;
}

.schedule_date span:not(.schedule_date_week) {
	font-size: min(7vw,3.4rem);
	font-weight: bold;
}

.schedule_date_week {
	font-size: min(9vw,2rem);
	font-weight: bold;
}

.schedule_note {
	display: block;
	font-size: 1.4rem;
	font-weight: 500;
	padding: 0 17px;
	margin-bottom: 8px;
}


@media only screen and (max-width: 799px){
	.schedule_flow li:first-child .schedule_ttl {
		margin-bottom: 10px;
		padding-right: 4em;	
	}

	.schedule_flow li:first-child .schedule_ttl::after {
		font-size: 1.5rem;
		width: 25vw;
		height: 25vw;
		max-width: 105px;
		max-height: 98px;
		top: 50%;
		right: 0;
		transform: translate(0, -50%) rotate(7deg);
	}

	.schedule_note ,
	.schedule_date { 
		padding: 0 3%;
	}
}

/* ===========================
 pay
=========================== */
.pay {
	padding: 60px 0 35px;
	line-height: 1.6;
}

.pay_inr {
	width: 100%;
	max-width: 800px;
	margin: 0 auto;
	padding: 0 6vw;
}

.pay_ttl {
	font-size: 4vw;
    border: 3px #999999 solid;
    padding: 5px 10px;
    font-weight: bold;
}

.pay_ttl span {
	border-left: 2px #FF7DAF solid;
    padding-left: 5px;
}

.pay_box {
    padding: 2%;
}

.cancel_txt {
	color: #ED6B00;
	font-weight: bold;
}

.bank-ad {
    border: solid 2px #FF7DAF;
    text-align: center;
    font-size: 110%;
    margin-top: 20px;
}
.bank-ad p {
    padding: 2%;
}
.bank-ad p:first-child {
    border-bottom: solid 1px #FF7DAF;
}

.credit_ttl {
	display: block;
    background: #ff7daf;
    color: #fff;
    padding: 0.5em;
    font-size: 110%;
    font-weight: bold;
    margin: 20px 0 10px;
}

.credit_img {
	text-align: center;
}

.credit_img img {
    width: 60%;
    min-width: 250px;
}

.credit_note {
	font-weight: bold;
	color: #2F69A9;
	margin-bottom: .5em;
	margin-top: 1em;
}

@media only screen and (min-width: 800px){
	.pay_inr {
		padding: 0 20px;
	}

	.pay_ttl {
		font-size: 20px;
		border: 3px #999999 solid;
		padding: 5px 10px;
		font-weight: bold;
	}
}