@charset "UTF-8";
/*sp_link*/
.sp_link{
	width: 70%;
	margin: 30px auto;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	
}
.sp_link_item{
	width: 19%;
	margin:0;
}
.sp_link_item img:hover{
	opacity: 0.7
}

.sp_title{
	width:35%;
	margin:30px auto;
}
.sp_title2{
	width:35%;
	margin:30px auto;
}
.sp_title img{
	width: 100%;
}
.sp_title2 img{
	width: 100%;
}
.sp_catch{
	width: 50%;
	margin: 40px auto;
}
.sp_cp{
	width: 90%;
	text-align: center;
	margin: 30px auto;
}
/*ボックス１個あたりの設定*/
.p-box {
	width: 96%;
	margin: 30px auto;
	display: flex;
	justify-content: space-between;
}

/*ボックス内の画像設定*/
.p-box .img {
	width: 31%;
}

.line{
	clear:both;
	width:100%;
	height:40px;
	margin-top:50px;
	margin-bottom:30px;
	background-image:url(../education/education_image/line_bg.png);
	background-repeat:repeat-x;
	background-position:bottom;
	font-size:9px;
	color:#FFF;
}

/*ビデオの設定*/
.bgv {
  width: 94%;
  height: auto;
  	background-color:#FFF;
	border:1px solid #ccc;
	-webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);	/*影の設定。右へ、下へ、ぼかし幅。rgbaは色設定で0,0,0は黒。0.2が透明度。*/
	box-shadow: 1px 1px 2px rgba(0,0,0,0.2);			/*同上*/
	padding:10px;
    margin: 30px auto;

}
.bgv source{
  width:100%;
  height:auto;
	max-width: 1400px;
	margin: 40px auto;
}


/*画面幅800px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:900px){
.sp_link{
	width: 90%;
	margin: 30px auto;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	
}
.sp_link_item{
	width: 19%;
	margin:0;
}

.sp_title{
	width:60%;
	margin-left:auto;
	margin-right:auto;
}
.sp_title2{
	width:50%;
	margin-left:auto;
	margin-right:auto;
}
}

/*画面幅480px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:480px){
.sp_link{
	width: 90%;
	margin: 30px auto;
	display: flex;
	flex-direction: row;
	justify-content: center;
	flex-wrap: wrap;
}
.sp_link_item{
	width: 30%;
	margin:10px 1.5%;
}
.p-box {
	width: 96%;
	margin: 30px auto 0;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

/*ボックス内の画像設定*/
.p-box .img {
	width: 48%;
	margin: 10px 0;
}

.sp_catch{
	width: 80%;
	margin: 40px auto;
}
.sp_title{
	width:60%;
	margin-left:auto;
	margin-right:auto;
}
.sp_title2{
	width:70%;
	margin-left:auto;
	margin-right:auto;
}
.sp_cp{
	width: 90%;
	text-align: left;
	margin: 30px auto 0;
	font-size:14px;
}
}