@charset "utf-8";
/**
/* 料金ページ CSS
----------------------------------------------- */
.course-fee-guide .inner{
	max-width: 1080px;
}
@media screen and (max-width: 1500px) {
	.course-fee-guide .inner{
		max-width: 900px;
	}
}
.fee .sl-subpage-ttl .eng-ttl{
	font-size: 3rem;
}
.fee .sl-subpage-ttl .jp-ttl{
	font-family: "Noto Sans JP", serif;
	color: #fff;
	font-size: 1.5rem;
	font-weight: 300;
	letter-spacing: 0;
	margin-top: 0.5rem;
}
@media only screen and (max-width: 767px) {
	.fee .sl-subpage-ttl .eng-ttl{
		font-size: 2rem;
	}
	.fee .sl-subpage-ttl .jp-ttl{
		font-size: 1.125rem;
		margin-top: 0.375rem;
	}
}
/*　　コース授業料　　*/
.course-fee-guide{
	background: #fff;
	padding: 5.5rem 0;
}
.course-fee-content .course-fee-box:not(:last-child){
	margin-bottom: 6.25rem;
}
.course-fee-box h2{
	background: #273f97;
	font-family: "Noto Sans JP", serif;
	color: #fff;
	font-size: 1.5rem;
	font-weight: 500;
	line-height: 1.35;
	text-align: center;
	padding: 0.625rem;
	margin-bottom: 1.875rem;
}
.course-fee-box .course-fee-head{
	column-gap: 1.875rem;
}
.course-fee-box .course-fee-head .col-2{
	width: calc(50% - 0.9375rem);
}
.course-fee-box .course-fee-head .p-note{
	font-size: 0.75rem;
	font-weight: 400;
	line-height: 1.25;
	letter-spacing: -0.01em;
	margin-top: 0.9375rem;
}
.course-fee-box .fee-flow{
	column-gap: 1.25rem;
	row-gap: 0.5rem;
	margin-top: 0.8125rem;
}
.course-fee-box .fee-flow .flow-items{
	background: #f8f6f6;
	width: calc(25% - 0.9375rem);
	padding: 0.875rem 0.875rem 0.875rem 1rem;
}
.course-fee-box .fee-flow .flow-items .icon{
	width: 3rem;
}
.course-fee-box .fee-flow .flow-items .contentArea{
	width: calc(100% - 3rem);
	padding-left: 1rem;
}
.course-fee-box .fee-flow .flow-items .ttl{
	font-family: "Noto Sans JP", serif;
	color: #273f97;
	font-size: 1.125rem;
	font-weight: 500;
	line-height: 1.25;
	letter-spacing: 0.1em;
	padding-top: 1rem;
	margin-bottom: 0.375rem;
}
.course-fee-box .fee-flow .flow-items .ttl.small{
	font-size: 1rem;
	padding-top: 0;
	margin-bottom: 0.25rem;
}
.course-fee-box .fee-flow .flow-items .note{
	font-size: 0.625rem;
	font-weight: 400;
	line-height: 1.35;
}
.course-fee-box .option-box .option-ttl{
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.25;
	letter-spacing: -0.01em;
	margin-bottom: 0.8125rem;
}
.course-fee-box .option-box .option_btn{
	display: flex;
	column-gap: 2.5rem;
}
.course-fee-box .option-box .option_btn li{
	text-align: center;
}
.course-fee-box .option-box .option_btn li span{
	display: block;
	font-size: 0.875rem;
	font-weight: 400;
	line-height: 1.25;
	letter-spacing: -0.01em;
	margin-bottom: 0.35rem;
}
.course-fee-box .option-box .option_btn li input[type=radio]{
	appearance: none;
	position: relative;
	width: 1.5rem;
	height: 1.5rem;
	border: 1px solid #4f4f4f;
	border-radius: 9999px;
	cursor: pointer;
}
.course-fee-box .option-box .option_btn li input.us{
	background-color: #78d9ff;
}
.course-fee-box .option-box .option_btn li input.us:checked{
	border: 0.125rem solid #0692ff;
}
.course-fee-box .option-box .option_btn li input.cad{
	background-color: #d9e5f8;
}
.course-fee-box .option-box .option_btn li input.cad:checked{
	border: 0.125rem solid #0692ff;
}
.course-fee-box .option-box .option_btn li input.aud{
	background-color: #bef2c7;
}
.course-fee-box .option-box .option_btn li input.aud:checked{
	border: 0.125rem solid #0692ff;
}
.course-fee-box .option-box .option_btn li input.en{
	background-color: #d0d0d0;
}
.course-fee-box .option-box .option_btn li input.en:checked{
	border: 0.125rem solid #0692ff;
}
.course-fee-box .option-box .option_btn li input.euro{
	background-color: #f2cded;
}
.course-fee-box .option-box .option_btn li input.euro:checked{
	border: 0.125rem solid #0692ff;
}
.course-fee-box .option-box .option_btn li input[type=radio]:checked::after{
	display: block;
	position: absolute;
	top: -0.375rem;
	left: -0.375rem;
	content: "";
	width: 2rem;
	height: 2rem;
	border: 0.125rem solid #0692ff;
	border-radius: 100%;
}
.course-fee-box .course_btn{
	margin-top: 1.5rem;
}
.course-fee-box .course_btn li{
	display: flex;
	align-items: center;
	background: #ffffff;
	color: #333333;
	border: 0.125rem solid #cccccc;
	border-radius: 0.625rem;
	padding: 1.25rem;
	cursor: pointer;
}
.course-fee-box .course_btn li.current,
.course-fee-box .course_btn li:hover{
	border: 0.125rem solid #0692ff;
}
.course-fee-box .course_btn li + li{
	margin-top: 0.8125rem;
}
.course-fee-box .course_btn li .course-name{
	width: 11rem;
	font-family: "Noto Sans JP", serif;
	font-size: 1.125rem;
	font-weight: 500;
	line-height: 1.25;
	letter-spacing: 0.1em;
}
.course-fee-box .course_btn li .course-name span{
	font-feature-settings: "palt";
}
.course-fee-box .course_btn li .time{
	width: calc(100% - 11rem);
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.25;
	letter-spacing: -0.01em;
	padding-left: 1.25rem;
}
.course-fee-box .course-fee-body{
	margin-top: 2.5rem;
}
.course-fee-box .course-fee-body h3{
	font-family: "Noto Sans JP", serif;
	color: #333333;
	font-size: 1.125rem;
	font-weight: 500;
	line-height: 1.25;
	letter-spacing: 0.1em;
	margin-bottom: 1.5rem;
}
.course-fee-box .course-fee-body .course-fee-cont{
	display: none;
}
.course-fee-box .course-fee-body .course-fee-cont.current{
	display: block;
}
.course-fee-box .course-fee-list{
	column-gap: 0.625rem;
}
.course-fee-box .course-fee-list .course-fee-items{
	width: calc(25% - 0.5rem);
	background: #ffffff;
	color: #333333;
	text-align: center;
	border: 2px solid #0692ff;
	border-radius: 0.625rem;
	padding: 1.25rem 0.625rem 1.125rem 0.625rem;
}
.course-fee-box .course-fee-list .course-fee-items .course-fee-name{
	font-family: "Noto Sans JP", serif;
	font-size: 1.125rem;
	font-weight: 500;
	line-height: 1.25;
	letter-spacing: 0.1em;
	margin-bottom: 0.25rem;
}
.course-fee-box .course-fee-list .course-fee-items .course-week{
	font-family: "Noto Sans JP", serif;
	font-size: 1.5rem;
	font-weight: 500;
	line-height: 1.25;
	letter-spacing: 0.1em;
	margin-bottom: 0.5rem;
}
.course-fee-box .course-fee-list .course-fee-items .course-month{
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.25;
	letter-spacing: -0.01em;
}
.course-fee-box .course-fee-list .course-fee-items .course-fee{
	margin-top: 1.25rem;
}
.course-fee-box .course-fee-list .course-fee-items .course-fee .price{
	display: none;
	font-family: "Noto Sans JP", serif;
	font-size: 1.5rem;
	font-weight: 500;
	line-height: 1.25;
	letter-spacing: 0.1em;
}
.course-fee-box .course-fee-list .course-fee-items .course-fee .price.active{
	display: block;
}
.course-fee-box .course-fee-list .course-fee-items .course-fee .price span{
	font-size: 2rem;
}
.course-fee-box .course-fee-list .course-fee-items .course-fee .price .tax{
	display: block;
    font-size: 0.875rem;
    margin-top: 0.3125rem;
}
.course-fee-box .course-fee-list .course-fee-items .block_btn{
	margin-top: 1rem;
}
.course-fee-box .course-fee-list .course-fee-items .block_btn li{
	max-width: 11.875rem;
}
.course-fee-box .course-fee-list .course-fee-items .block_btn li .btn{
	font-size: 1.125rem;
	border-radius: 0.3125rem;
	padding: 0.625rem;
}
.course-fee-box .en-note,
.course-fee-box .fee-note{
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.25;
	letter-spacing: -0.01em;
	margin-top: 0.875rem;
}
.course-fee-box .en-note{
	display: none;
}
.course-fee-box .en-note.active{
	display: block;
}
@media screen and (max-width: 1280px) and (min-width: 769px){
	.course-fee-box .option-box .option_btn li input[type=radio]:checked::after{
		top: -0.3275rem;
		left: -0.3275rem;
	}
}
@media only screen and (max-width: 767px) {
	.course-fee-guide{
		padding: 3rem 0;
	}
	.course-nav{
		margin-bottom: 3rem;
	}
	.course-nav .nav{
		row-gap: 0.625rem;
	}
	.course-nav .nav li{
		width: 27.5%;
	}
	.course-nav .nav li:nth-child(1),
	.course-nav .nav li:nth-child(4){
		width: 45%;
	}
	.course-nav .nav li a{
		display: block;
		color: #1f5c99;
		font-size: 0.78125rem;
		font-weight: 500;
		line-height: 1.35;
		letter-spacing: 0.1em;
	}
	.course-fee-content .course-fee-box:not(:last-child){
		margin-bottom: 3.125rem;
	}
	.course-fee-box h2{
		font-size: 1.125rem;
		line-height: 1.25;
		padding: 0.5rem;
		margin-bottom: 1rem;
	}
	.course-fee-box .course-fee-head{
		column-gap: 0;
		row-gap: 1.25rem;
	}
	.course-fee-box .course-fee-head .col-2{
		width: 100%;
	}
	.course-fee-box .course-fee-head .p-note{
		font-size: 1rem;
		margin-top: 1.25rem;
	}
	.course-fee-box .fee-flow{
		column-gap: 0.625rem;
		row-gap: 0.3125rem;
		margin-top: 0.9375rem;
	}
	.course-fee-box .fee-flow .flow-items{
		width: calc(50% - 0.3125rem);
		padding: 0.625rem 0.625rem 0.625rem 0.75rem;
	}
	.course-fee-box .fee-flow .flow-items .icon{
		width: 2.25rem;
	}
	.course-fee-box .fee-flow .flow-items .contentArea{
		width: calc(100% - 2.25rem);
		padding-left: 0.625rem;
	}
	.course-fee-box .fee-flow .flow-items .ttl{
		font-size: 0.875rem;
		padding-top: 0.37rem;
		margin-bottom: 0.375rem;
	}
	.course-fee-box .fee-flow .flow-items .ttl.small{
		font-size: 0.75rem;
		padding-top: 0;
		margin-bottom: 0.25rem;
	}
	.course-fee-box .fee-flow .flow-items .note{
		font-size: 0.5rem;
	}
	.course-fee-box .option-box .option-ttl{
		margin-bottom: 0.8125rem;
	}
	.course-fee-box .option-box .option_btn{
		-webkit-justify-content: space-between;
		justify-content: space-between;
		column-gap: 2.5rem;
	}
	.course-fee-box .option-box .option_btn li span{
		font-size: 0.8125rem;
		margin-bottom: 0.125rem;
	}
	.course-fee-box .course_btn{
		margin-top: 1.25rem;
	}
	.course-fee-box .course_btn li{
		border-radius: 0.3125rem;
		padding: 0.5rem 0.875rem;
	}
	.course-fee-box .course_btn li + li{
		margin-top: 0.5rem;
	}
	.course-fee-box .course_btn li .course-name{
		width: 10rem;
	}
	.course-fee-box .course_btn li .course-name span{
		font-size: 0.875rem;
	}
	.course-fee-box .course_btn li .time{
		width: calc(100% - 10rem);
		padding-left: 0.875rem;
	}
	.course-fee-box .course-fee-body{
		margin-top: 1.5rem;
	}
	.course-fee-box .course-fee-body h3{
		margin-bottom: 0.875rem;
	}
	.course-fee-box .course-fee-list{
		column-gap: 0.5rem;
		row-gap: 0.5rem;
	}
	.course-fee-box .course-fee-list .course-fee-items{
		width: calc(50% - 0.25rem);
		border-radius: 0.3125rem;
		padding: 1.25rem 0.75rem 0.75rem 0.75rem;
	}
	.course-fee-box .course-fee-list .course-fee-items .course-fee-name{
		font-size: 0.875rem;
		margin-bottom: 0.125rem;
	}
	.course-fee-box .course-fee-list .course-fee-items .course-week{
		font-size: 1.125rem;
		margin-bottom: 0.3125rem;
	}
	.course-fee-box .course-fee-list .course-fee-items .course-fee{
		margin-top: 1rem;
	}
	.course-fee-box .course-fee-list .course-fee-items .course-fee .price{
		font-size: 1rem;
	}
	.course-fee-box .course-fee-list .course-fee-items .course-fee .price span{
		font-size: 1.375rem;
	}
	.course-fee-box .course-fee-list .course-fee-items .course-fee .price .tax{
	    font-size: 0.75rem;
	    margin-top: 0.25rem;
	}
	.course-fee-box .course-fee-list .course-fee-items .block_btn{
		margin-top: 0.75rem;
	}
	.course-fee-box .course-fee-list .course-fee-items .block_btn li .btn{
		border-radius: 0.1875rem;
		padding: 0.625rem;
	}
	.course-fee-box .en-note,
	.course-fee-box .fee-note{
		font-size: 0.875rem;
		margin-top: 0.5rem;
	}
}
