@charset 'UTF-8';

@media screen and (min-width:641px) {

	#saiyo-cm{
		width:100%;
		margin:50px 0;
/*		padding-left:10px;*/
		box-sizing:border-box;
		text-align: left;
	}

	#saiyo-cm h3 {
		font-size:100%;
		background-color:#2c63b6;
		text-align:left;
		padding:5px 10px;
		color: #ffffff;
		font-weight:normal;
		margin:20px 0 10px;
	}

	#saiyo-cm div.ttl1 {
		font-size:100%;
		text-align:left;
		margin:10px 0;
		padding:5px 0;
		font-weight:bold;
		border-bottom: 2px solid #2c63b6;
	}

	#saiyo-cm div.ttl1 p {
		background: url(../../../images/ttl1-line.gif) repeat-y 0 0;
		padding:0 5px 0 20px;
	}

	#saiyo-cm ul{
		padding:0;
		margin:0 auto;
		list-style-type:none;
	}
	
	#saiyo-cm li{
		width:182px;
		display:inline-block;
		text-align:center;
		position:relative;
		margin:0 12px 15px 12px;
		vertical-align:top;
	}
	
	.saiyo-cm_icon{
		position: absolute;
		top: 40px;
		left: 65px;
	}

	.cmimgs:after{
		display: block;
		content: url(./img/playicon.png);
		width: 100%;
		margin: 40px 0;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 99;
	}

	.labelh27:before, 
	.labelh28:before, 
	.labelh29:before, 
	.labelh30:before {
		display: block;
		width: 50%;
		position: absolute;
		top: 0;
		right: 0;
		z-index: 999;
		font-size: 11px;
		color: #ffffff;
	}

	.labelh27:before {
		content: '平成27年度制作';
		background-color: #1b9ce2;
	}
	.labelh28:before {
		content: '平成28年度制作';
		background-color: #69db30;
	}
	.labelh29:before {
		content: '平成29年度制作';
		background-color: #fa8d00;
	}
	.labelh30:before {
		content: '平成30年度制作';
		background-color: #fc636b;
	}
}
/*----*/

@media screen and (min-width: 0px) and (max-width: 640px) {
	
	#saiyo-cm{
		margin-top:50px;
		text-align: left;
	}

	#saiyo-cm h3 {
		background-color:#2c63b6;
		text-align:left;
		font-size:2.1rem;
		padding:10px;
		color: #ffffff;
		font-weight:normal;
		margin:20px 0 10px;
	}

	#saiyo-cm div.ttl1 {
		font-size:100%;
		text-align:left;
		margin:20px 0 10px;
		padding:5px 0;
		font-weight:bold;
		border-bottom: 2px solid #2c63b6;
	}

	#saiyo-cm div.ttl1 p {
		background: url(../../../images/ttl1-line.gif) repeat-y 0 0;
		padding:0 5px 0 20px;
	}

	#saiyo-cm li{
		width:182px;
		display:inline-block;
		text-align:center;
		position:relative;
		margin:0 5px 10px 5px;
		vertical-align:top;
	}
	
	.saiyo-cm_icon{
		position: absolute;
		top: 40px;
		left: 65px;
	}

	.cmimgs:after{
		display: block;
		content: url(./img/playicon.png);
		width: 100%;
		margin: 40px 0;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 99;
	}

	.labelh27:before, 
	.labelh28:before, 
	.labelh29:before, 
	.labelh30:before {
		display: block;
		width: 50%;
		position: absolute;
		top: 0;
		right: 0;
		z-index: 999;
		font-size: 11px;
		color: #ffffff;
	}

	.labelh27:before {
		content: '平成27年度制作';
		background-color: #1b9ce2;
	}
	.labelh28:before {
		content: '平成28年度制作';
		background-color: #69db30;
	}
	.labelh29:before {
		content: '平成29年度制作';
		background-color: #fa8d00;
	}
	.labelh30:before {
		content: '平成30年度制作';
		background-color: #fc636b;
	}

}