@charset "utf-8";
/* CSS Document */
#sec_intro .flex_space .area_img{
	width:34%;
}
#sec_intro .flex_space .area_txt{
	width: 61%;
}
#sec_intro .flex_space .area_img img{
	transform: translateY(-5em);
	z-index: -1;
    position: relative;
}
.box_chrt{
	max-width: 397px;
	width:43.3%;
	padding: 1em;
	position: relative;
	background: #fff;
}
.box_chrt .area_cnt{
	padding-left: 1em;
}
.box_chrt .area_ttl:first-letter{
	font-size: 2.5em;
	letter-spacing: -0.05em
}
.flex_center .box_chrt{
	margin-bottom: 80px;
}
.flex_center .box_chrt::before{
	content: '';
    border-left: 10px solid #33CC4B;
    position: absolute;
	left: 50%;
    bottom: 0;
    height: 150px;
    transform: rotate(30deg) translate(0, 90%);
    z-index: -1;
}
.flex_center .box_chrt::after{
	content: '';
    border-left: 10px solid #33CC4B;
    position: absolute;
	left: 50%;
    bottom: 0;
    height: 150px;
    transform: rotate(330deg) translate(0, 90%);
    z-index: -1;
}
.flex_space .box_chrt:nth-child(1)::after{
	content: '';
    border-top: 10px solid #33CC4B;
    position: absolute;
	right: 0;
    top: 50%;
    width: 150px;
    transform: translate(90%, -50%);
    z-index: -1;
}
.flex_space .box_chrt:nth-child(1) .area_ttl:first-letter{
	letter-spacing: -0.1em
}
.flex_space .box_chrt:nth-child(2) .area_ttl:first-letter{
	letter-spacing: -0.3em
}
.blk_lesson .blk_ttl{
	padding: 2em 0;
}
.blk_lesson h4{
	font-size: 7.142em;
}
.blk_lesson .flex_row_3 img{
	width:33%;
}
.counter_increment dt{
	counter-increment: title;
}
.counter_increment dt::before{
	/*content: counter(title, decimal-leading-zero);
	font-family: 'Roboto Condensed', sans-serif;
    font-weight: 300;*/
	font-family: "icontennoz";
	content: "\ea10";
	color: #33CC4B;
	font-size: 0.9em;
	padding-right: 8px;;
}
#sec_simulator .blk_ttl_left{
	transform: translateY(-50%);
	margin-top: 11em;
}
#sec_simulator .blk_cnt{
	margin-top: -110px;
}
#sec_simulator .blk_simulator{
	padding-top: 3%;
	padding-bottom: 3%;
}
#sec_simulator .blk_simulator h4{
	font-size: 5.714em;
	margin-bottom: 0.3em;
}
#sec_simulator .box_desc .area_img{
	width:20%;
}
#sec_simulator .box_desc .area_txt{
	width:78%;
}
#sec_simulator .box_slide{
	height: 480px;
	width: 640px;
	margin-bottom: 70px;
}
#sec_simulator .box_smartphone .area_img{
	width: 58%;
}
#sec_simulator .box_smartphone .area_txt{
	width: 40%;
}
#sec_simulator .box_mode li{
	width: 330px;
}
#sec_simulator .box_mode li:first-child{
	margin-right: 30px;
}
#sec_simulator .box_slide_vtcl{
	height: 640px;
	width: 480px;
	margin-bottom: 70px;
}
#sec_simulator .area_youtube{
	width: 100%;
	aspect-ratio: 16 / 9;
}
#sec_simulator .area_youtube iframe {
	width: 100%;
	height: 100%;
}

/*===============================================*/
@media screen and (max-width: 900px) {
	.box_chrt{
		display: block;
	}
	.box_chrt .area_cnt{
		padding-left: 0;
	}
	.flex_center .box_chrt {
    	margin-bottom: 80px;
	}
}
@media screen and (max-width: 767px) {
	#sec_simulator .box_slide{
		height: 62.5%;
		width: 83.4%;
	}
}
/*===============================================*/
@media screen and (max-width: 480px) {
	.blk_lesson .flex_row_3 img{
		width:100%;
		padding-bottom: 5px;
	}
	#sec_simulator .box_slide{
		height: 75%;
		width: 100%;
	}
	#sec_simulator .box_slide_vtcl{
		height: 133%;
		width: 100%;
	}
	#sec_simulator .box_mode.dsp_flex{
		display: block;
	}
	#sec_simulator .box_mode li{
		width: 100%;
	}
	#sec_simulator .box_mode li:first-child{
		margin-right: 0;
		margin-bottom: 1em;
	}
}