@charset "utf-8";
/* commons頁面較共同元素 */
@import url("commons.css");

.wrapper-learn1{
	padding-bottom:var(--section-padding-tb);
	margin-bottom:var(--section-padding-tb)	
	}
.col-learn1-p{ flex: 1 1 60%;}
.col-learn1-w{ flex: 1 1 40%;
margin-left:20px;}
.title-learn{
	color:#000000;
	font-size:2.5em;
	 justify-content: start;
	 margin-bottom:var(--section-padding-tb)}
.title-learn span{
	color:#ffffff;
	background-color:var(--main-color);
	width:50px;
	height:50px;
	margin-right:30px}
.des-learn-1{
	font-style: italic;
}



/*editstyel-fee-block*/
.wrapper-class-fee{
	flex-wrap:wrap;
	margin-bottom:var(--blcokin-padding-tb);
	margin-top:var(--blcokin-padding-tb);
	}
.class-fee-row{
	flex: 0 0 100%;

	}
.class-fee-row-in{
	}
.col-class{
	flex: 1 1 auto;
	font-size: 0.9em;
}
.col-class-title{
	font-weight:bolder;
	flex:0 0 auto;
	text-align:center
}
.box-class{
	padding: 5px;
	border: 1px solid var(--suplight-gray);
	clear: both;
	float: left;
	width: calc(100% - 11px);
	margin-top: -1px;
	white-space: nowrap;
	text-align:center
}
.box-class.t{padding: 5px 20px;width: calc(100% - 41px);
background-color:#000000;
color:#b49e7d;
border: 1px solid #000000;
font-size:1.1em}
.box-class.t em{
font-style: normal;}
.box-class.t i:before,.box-class.t em:before{
	content: "";
	display: inline-block;
	width: 30px;
	height: 30px;
	background-image: url(../img/learn/decprice.svg);
	background-repeat: no-repeat;
	background-position: left center;
	vertical-align: middle;
	margin-top: -5px;
	
	}
.box-class.t i:after,.box-class.t em:after{
	content: "";
	display: inline-block;
	width: 30px;
	height: 30px;
	background-image: url(../img/learn/decprice2.svg);
	background-repeat: no-repeat;
	background-position: right center;
	vertical-align: middle;
	margin-top: -5px;
	}
.wrapper-des-learn{
	float:left;
	clear:both;
	width:100%;
	flex-wrap:wrap;
	margin-bottom:50px;
	margin-top:50px}
.col-des-learn{flex:0 0 auto;
width:calc(50% - 62px);
margin:10px 10px;
border:solid 1px var(--suplight-gray);
padding:20px;
border-radius:20px
}
.col-des-learn.col-100{width:calc(100% - 62px);}
.col-des-learn-in{
	width:100%}
.box-des-learn-p{flex:0 0 130px;  margin-right:5%}
.box-des-learn-w{flex:0 0 auto;
color:#000000;
overflow:hidden;
width:calc(100% - 160px)}
.box-des-learn-t{
	font-size:1.2em;
	font-weight:bolder
	}
	.box-des-learn-des{font-size:1.1em
}
@media screen  and (max-width: 1025px) {
.col-des-learn{width:calc(100% - 62px);
}
.class-fee-row-in{
	flex-wrap:wrap
	}
.col-class{flex:0 0 100%;}
.col-class-title{
	flex:0 0 100%;}
.box-class{
	width: calc(50% - 11px);
	float: left;
	clear: none;
	border: 1px solid var(--suplight-gray);
	margin-left:-1px;
}
.box-class.t{padding: 5px 20px;width: calc(50% - 41px);
border: 1px solid #000000;}

}
@media screen  and (max-width: 700px) {
.wrapper-learn1{flex-wrap:wrap}
.col-learn1-p{ flex: 0 1 100%;}
.col-learn1-w{ flex: 0 1 100%;
margin-left:0px;}
}
@media screen  and (max-width: 600px) {
.col-des-learn-in{
	flex-wrap:wrap}
.box-des-learn-p{flex:0 0 200px;  margin-right:auto;
margin-left:auto}
.box-des-learn-w{width:calc(100% - 0px)}
}