@charset "utf-8";
/** *****************************************************************
メディア情報学科（/department）
最終更新日：2025.06.26
***************************************************************** **/


/* 
 背景画像
--------------------------------------------------------------------* */
#MEDIA #MAINPIC{	background-image: url(images/fv_pc.jpg);
	display: block;
	background-repeat: no-repeat;
	background-size: 100%;
	width:100%;    height:0;
	padding-top: 56.22%;
	margin-top: 80px;
}
#MEDIA.comingsoon #MAINPIC{	background-image: url(images/comingsoon.jpg);
	display: block;
	background-repeat: no-repeat;
	background-size: 100%;
	width:100%;    height:0;
	padding-top: 188.41%;
}
#MEDIA #MAINPIC #title{
	display: none;
}


@media only screen and (max-width: 768px) {

#MEDIA #MAINPIC{	background-image: url(images/fv_sp.jpg);
	padding-top: 188.41%;
	margin-top: 0;

}
}


/* コースリンク */
#courseBLOCK{margin-top: 60px !important;}


.courseBOX +.courseBOX{margin-top: 40px;}

.courseBOX a{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	pointer-events: none
}

.courseBOX .picture {
	display: block;
	background-repeat: no-repeat;
	background-size: 100%;
	width:20%;    height:0;
	padding-top: -webkit-calc( 100% * 0.2) ;
	padding-top: calc(100% * 0.2) ;
}
.courseBOX .text {
	width:80% ;
	padding: 20px 40px;
	color: #000000;
}

.courseBOX:nth-of-type(1) .picture{	background-image: url(images/course01.jpg);}
.courseBOX:nth-of-type(2) .picture{	background-image: url(images/course02.jpg);}
.courseBOX:nth-of-type(3) .picture{	background-image: url(images/course03.jpg);}

.courseBOX:nth-of-type(1) a{	background-color:#fafafa;}
.courseBOX:nth-of-type(2) a{	background-color:#fafafa;}
.courseBOX:nth-of-type(3) a{	background-color:#fafafa;}

@media only screen and (max-width: 768px) {

#courseBLOCK{margin-top: 30px !important;}
.courseBOX +.courseBOX{margin-top: 20px;}

.courseBOX a{
	flex-direction: column;
}

.courseBOX .picture {

	width:100%;    height:0;
	padding-top:100% ;
}
.courseBOX .text {
	width:100% ;
	padding: 20px;
}

#MEDIA .btnblock a + a{
	margin: 8px 0 0 0;

}

}