@charset "UTF-8";

/* ------------------------------
    learn
------------------------------ */


/* ------------------------------
    sec_first
------------------------------ */
.sec_first{
	min-width: 1200px; /*min-width*/
	padding: 75px 0 65px;
	background: url(../img/common/check_bg01.png) #fff;
}
.sec_first .txt_lead{
	margin-bottom: 80px;
	text-align: center;
	font-style: italic;
	font-weight: 700;
	font-size: 2.4rem;
}
.cover_school{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: space-between;
}
.cover_school .box_school{
	width: 540px;
	margin-bottom: 60px;
	padding: 0 40px 15px;
	text-align: center;
	background-color: #fff;
	border: 5px solid #0065AF;
}
.cover_school .box_school .ttl_school {
    display: inline-block;
    height: 50px;
    margin-top: -25px;
    padding: 0 15px;
    line-height: 50px;
    font-style: italic;
    font-weight: 700;
    font-size: 3.4rem;
    color: #fff;
    background-color: #0065AF;
}
.cover_school .box_school .list_school{
	margin-top: 30px;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
}
.cover_school .box_school .list_school li{
	width: 90%;
	margin-bottom: 9px;
	line-height: 20px;
	letter-spacing: -0.01em;
	font-size: 1.6rem;
}

.cover_school .box_school .list_school li:last-child{
	width: 100%;
}

.cover_school .box_school .list_school li:before{
	content: "";
	display: inline-block;
	width: 20px;
	height: 20px;
	margin-right: 10px;
	vertical-align: middle;
	background: url(../img/common/ico_check02.svg) no-repeat;
}
.cover_school .box_school .txt01{
	margin: 40px 0 0.6em;
	text-align: center;
	line-height: 1.2;
	font-size: 1.8rem;
}
.cover_school .box_school .txt02{
	text-align: center;
	font-style: italic;
	font-weight: 700;
	font-size: 4.0rem;
}
.sec_first .txt_feature{
	line-height: 2;
	text-align: center;
	font-size: 1.6rem;
}

@media screen and (max-width: 768px) {
	.sec_first{
		min-width: 0;
		padding: 10% 0;
		background-size: 700px auto;
	}
	.sec_first .txt_lead{
		margin-bottom: 15%;
		line-height: 1.3;
		font-size: 1.3rem;
	}
	.cover_school{
		display: block;
	}
	.cover_school .box_school{
		width: auto;
		margin-bottom: 8%;
		padding: 0 5% 5%;
	}
	.cover_school .box_school .ttl_school{
		height: 30px;
		margin: -15px 0 1em;
		padding: 0 3%;
		line-height: 30px;
		font-size: 1.8rem;
	}
	.cover_school .box_school .list_school{
		margin-top: 3%;
	}
	.cover_school .box_school .list_school li{
		line-height: 15px;
		font-size: 1.4rem;
	}
	.cover_school .box_school .list_school li:before{
		width: 15px;
		height: 15px;
		margin-right: 5px;
	}
	.cover_school .box_school .txt01{
		margin-top: 3%;
		line-height: 1.3;
		font-size: 1.5rem;
	}
	.cover_school .box_school .txt02{
		font-size: 3.0rem;
		margin-bottom: 3%;
	}
	.sec_first .txt_feature{
		line-height: 1.5;
		font-size: 1.5rem;
	}
}
@media screen and (max-width: 380px) {
	.cover_school .box_school .list_school li{
		width: 100%;
	}
}


/* ------------------------------
    sec_system
------------------------------ */
.sec_system{
	min-width: 1200px; /*min-width*/
	padding: 55px 0 90px;
}
.sec_system .ttl_sec{
	margin-bottom: 60px;
	text-align: center;
	font-style: italic;
	font-weight: 700;
	font-size: 5.0rem;
	color: #0065AF;
}
.sec_system .txt_lead{
	margin-bottom: 95px;
	text-align: center;
	font-size: 1.6rem;
}
.sec_system .box_system{
	position: relative;
	padding: 0 80px 80px;
	text-align: center;
	border: 1px solid #141414;
	border-top: none;
}
.sec_system .box_system + .box_system{
	margin-top: 80px;
}
.sec_system .box_system .ttl_system{
	margin: -0.5em 0 55px;
	display: inline-block;
	font-style: italic;
	font-weight: 700;
	font-size: 3.4rem;
}
.sec_system .box_system .js-ttlbar{
	width: 100%;
	height: 1px;
}
.sec_system .box_system .js-ttlbar .bar01,
.sec_system .box_system .js-ttlbar .bar02{
	position: absolute;
	top: 0;
	content: "";
	display: block;
	width: 100%;
	height: 1px;
	background-color: #141414;
	opacity: 1;
}
.sec_system .box_system .js-ttlbar .bar01{
	left: 0;
}
.sec_system .box_system .js-ttlbar .bar02{
	right: 0;
}
.sec_system .box_system .txt{
	line-height: 1.875;
	font-size: 1.6rem;
}
.sec_system .box_system .txt .small{
	font-size: 1.4rem;
}
.sec_system .box_system .box_example{
	position: relative;
	margin-top: 35px;
	padding: 40px;
	background-color: #E5F0F7;
}
.sec_system .box_system .box_example .ttl{
	position: absolute;
	bottom: 100%;
	left: 40px;
	margin-bottom: -0.2em;
	font-style: italic;
	font-weight: 700;
	font-size: 1.9rem;
}
.box_cutup + .box_cutup{
	margin-top: 80px;
}
.box_cutup .ttl_cutup{
	margin-bottom: 25px;
	text-align: center;
	font-style: italic;
	font-weight: 700;
	font-size: 2.8rem;
	color: #0065AF;
}
.box_cutup .box_tree{
	position: relative;
	z-index: 1;
}
.box_cutup .box_tree .box_line{
	position: absolute;
	top: 100px;
	left: 50%;
	width: 536px;
	height: 24px;
	border: 1px solid #0065AF;
	border-bottom: none;
	transform: translateX(-50%);
	z-index: -1;
}
.box_cutup.cutup01 .box_tree .box_line:before{
	position: absolute;
	top: -32px;
	left: 50%;
	content: "";
	display: block;
	width: 1px;
	height: 32px;
	background-color: #0065AF;
	transform: translateX(-50%);
}
.box_cutup.cutup02 .box_tree .box_line{
	width: 715px;
}
.box_cutup.cutup02 .box_tree .box_line:before{
	position: absolute;
	top: -32px;
	left: 50%;
	content: "";
	display: block;
	width: 1px;
	height: 54px;
	background-color: #0065AF;
	transform: translateX(-50%);
}
.box_cutup .box_tree .parts_tree01{
	width: 505px;
	height: 70px;
	margin: 0 auto 60px;
	line-height: 70px;
	text-align: center;
	font-style: italic;
	font-weight: 700;
	font-size: 2.4rem;
	color: #fff;
	background-color: #0065AF;
}
.box_cutup .box_tree .flex_tree{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: space-between;
	margin-bottom: 30px;
}
.box_cutup .box_tree .parts_tree02{
	width: 505px;
}
.box_cutup.cutup02 .box_tree .parts_tree02{
	width: 326px;
}
.box_cutup .box_tree .parts_tree02 .ttl{
	position: relative;
	height: 70px;
	margin: 0 auto 20px;
	background-color: #E5F0F7;
	color: #0065AF;
}
.box_cutup.cutup01 .box_tree .parts_tree02:nth-child(1) .ttl,
.box_cutup.cutup02 .box_tree .parts_tree02:nth-child(n+2) .ttl{
	color: #FF6700;
	background-color: #FFF0E5;
}

.box_cutup .box_tree .parts_tree02 .ttl .num{
	position: absolute;
	bottom: 100%;
	left: 0;
	width: 100%;
    margin-bottom: -0.25em;
	text-align: center;
	font-size: 2.2rem;
}
.box_cutup .box_tree .parts_tree02 .ttl .ttl_txt{
	display: block;
	line-height: 70px;
	text-align: center;
	font-style: italic;
	font-weight: 700;
	font-size: 2.4rem;
}
.box_cutup .txt_feature{
	padding: 30px;
	text-align: center;
	font-size: 2.2rem;
	line-height: 1.4;
	background-color: #FFF0E5;
}
.box_cutup .txt_feature .em{
	font-style: normal;
	font-weight: 700;
	color: #FF6700;
}

@media screen and (max-width: 768px) {
	.sec_system{
		min-width: 0;
		padding: 10% 0;
	}
	.sec_system .ttl_sec{
		margin-bottom: 1em;
		font-size: 2.5rem;
	}
	.sec_system .txt_lead{
		margin-bottom: 15%;
		line-height: 1.5;
		font-size: 1.3rem;
	}
	.sec_system .box_system{
		padding: 0 5% 8%;
	}
	.sec_system .box_system + .box_system{
		margin-top: 15%;
	}
	.sec_system .box_system .ttl_system{
		margin-bottom: 1em;
		line-height: 1.3;
		text-align: center;
		font-size: 1.8rem;
	}
	.sec_system .box_system .txt{
		font-size: 1.3rem;
	}
	.sec_system .box_system .txt .small{
		font-size: 1.1rem;
	}
	.sec_system .box_system .box_example{
		padding: 5%;
		margin-top: 10%;
	}
	.sec_system .box_system .box_example .ttl{
		left: 5%;
		font-size: 1.5rem;
	}
	.box_cutup + .box_cutup{
		margin-top: 20%;
	}
	.box_cutup .ttl_cutup{
		margin-bottom: 8%;
		line-height: 1.5;
		text-align: left;
		font-size: 1.5rem;
	}
	.box_cutup .box_tree .box_line,
	.box_cutup.cutup02 .box_tree .box_line{
		display: none;
	}
	.box_cutup .box_tree .parts_tree01{
		width: auto;
		height: 35px;
		margin-bottom: 8%;
		padding: 0 5%;
		line-height: 35px;
		text-align: left;
		font-size: 1.5rem;
	}
	.box_cutup .box_tree .flex_tree{
		display: block;
		margin-bottom: 8%;
	}
	.box_cutup .box_tree .parts_tree02,
	.box_cutup.cutup02 .box_tree .parts_tree02{
		width: auto;
		margin-left: 5%;
		background-color: #fff;
	}
	.box_cutup .box_tree .parts_tree02 + .parts_tree02{
		margin-top: 8%;
	}
	.box_cutup .box_tree .parts_tree02 .ttl{
		height: 35px;
		margin-bottom: 5%;
	}
	.box_cutup .box_tree .parts_tree02 .ttl .num{
		bottom: 50%;
		width: auto;
		margin: 0 0 0 -0.5em;
		transform: translateY(50%);
	}
	.box_cutup .box_tree .parts_tree02 .ttl .ttl_txt{
		padding: 0 8%;
		line-height: 35px;
		text-align: left;
		font-size: 1.5rem;
	}
	.box_cutup .txt_feature{
		padding: 5%;
		line-height: 1.8;
		font-size: 1.7rem;
	}
}
@media screen and (max-width: 330px) {
	.sec_system .ttl_sec{
		font-size: 2.3rem;
	}
}


/* ------------------------------
    sec_welcome
------------------------------ */
.sec_welcome{
	min-width: 1200px; /*min-width*/
	padding-top: 80px;
	background-color: #0065af;
}
.sec_welcome .ttl_sec{
	margin-bottom: 180px;
	line-height: 1.3;
	text-align: center;
	letter-spacing: -0.02em;
	font-size: 5.0rem;
	color: #fff;
}
.sec_welcome .ttl_sec .line{
	text-decoration: underline;
}
.list_welcome{
	position: relative;
	padding-bottom: 80px;
	background: url(../img/common/check_bg01.png) #fff;
}
.list_welcome .inner{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: space-between;
	width: 1100px;
	margin: auto;
}
.list_welcome:after{
	content: "";
	position: absolute;
	left: 50%;
	bottom: -28px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 28px 34.5px 0 34.5px;
	border-color: #ffffff transparent transparent transparent;
	transform: translateX(-50%);
}
.list_welcome .items_welcome{
	width: 328px;
	margin-top: -125px;
}
.list_welcome .items_welcome .img{
	margin-bottom: 15px;
}
.list_welcome .items_welcome .box_txt{
	margin-left: -28px;
	transform: skewX(-10deg);
}
.list_welcome .items_welcome .txt01{
	margin-bottom: 0.3em;
	line-height: 1.3;
	text-align: center;
	font-style: italic;
	font-weight: 700;
	font-size: 1.8rem;
	transform: skewX(10deg);
}
.list_welcome .items_welcome .txt02{
	text-align: center;
	font-style: italic;
	font-weight: 900;
	font-size: 3.0rem;
	color: #ff6700;
	transform: skewX(10deg);
}

@media screen and (max-width: 768px) {
	.sec_welcome{
		min-width: 0;
		padding-top: 0;
	}
	.sec_welcome .ttl_sec{
		margin-bottom: 0;
		padding: 10% 0;
		line-height: 1.2;
		font-size: 2.5rem;
	}
	.list_welcome{
		padding: 7% 0;
		background-size: 700px auto;
	}
	.list_welcome .inner{
		display: block;
		width: 90.6%;
	}
	.list_welcome:after{
		bottom: -21px;
		transform: translateX(-50%) scale(0.5);
	}
	.list_welcome .items_welcome{
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		align-items: center;
		width: auto;
		margin-top: 0;
	}
	.list_welcome .items_welcome + .items_welcome{
		margin-top: 5%;
	}
	.list_welcome .items_welcome .img{
		width: 48.2%;
		margin: 0 2.3% 0 0;
	}
	.list_welcome .items_welcome .box_txt{
		margin-left: 0;
	}
	.list_welcome .items_welcome .txt01{
		margin-bottom: 1em;
		line-height: 1.58;
		text-align: left;
		font-size: 1.3rem;
	}
	.list_welcome .items_welcome .txt02{
		text-align: left;
		font-size: 2.0rem;
	}
}
@media screen and (max-width: 360px) {
	.list_welcome .items_welcome .txt01{
		font-size: 1.1rem;
	}
	.list_welcome .items_welcome .txt02{
		font-size: 1.7rem;
	}
}