@charset "UTF-8";

/***************************************************

	training

***************************************************/

#movie_maincopy{
	display: table;
	margin: 0 0 60px;
}

#movie_maincopy .text,
#movie_maincopy .image{
	display: table-cell;
	vertical-align: middle;
}

#movie_maincopy .image{
	width: 143px;
}

#movie_maincopy .text{
	font-size: 18px;
	line-height: 1.8;
	padding-left: 30px;
}

#movie_maincopy .text strong{
	font-size: 1.8em;
	font-weight: bold;
	margin: 0 4px;
}

.image-box{
	margin: 40px 0 0;
}

.image-box ul {

}

.image-box ul li{
	float: left;
	width: 30%;
	margin: 0 5% 0 0;
}

.image-box ul li:nth-child(3n+3){
	margin-right: 0;
}

.image-box  ul li a{
	display: block;
	color: #000;
	text-decoration: none;
}

.image-box  ul li a .image {
	display: block;
	position: relative;
	margin: 0 0 8px;
	box-shadow: 4px 4px 8px -1px #d8d8d8;
}

.image-box ul li a .image::after {
    content: '';
    display: inline-block;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: contain;
    background-image: url(data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20id%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%20512%20512%22%20style%3D%22enable-background%3Anew%200%200%20512%20512%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%23FFFFFF%3B%7D%3C%2Fstyle%3E%3Cpath%20class%3D%22st0%22%20d%3D%22M416%2C208c0%2C45.9-14.9%2C88.3-40%2C122.7l126.6%2C126.7c12.5%2C12.5%2C12.5%2C32.8%2C0%2C45.3c-12.5%2C12.5-32.8%2C12.5-45.3%2C0%20L330.7%2C376c-34.4%2C25.2-76.8%2C40-122.7%2C40C93.1%2C416%2C0%2C322.9%2C0%2C208S93.1%2C0%2C208%2C0S416%2C93.1%2C416%2C208z%20M184%2C296c0%2C13.3%2C10.7%2C24%2C24%2C24%20s24-10.7%2C24-24v-64h64c13.3%2C0%2C24-10.7%2C24-24s-10.7-24-24-24h-64v-64c0-13.3-10.7-24-24-24s-24%2C10.7-24%2C24v64h-64%20c-13.3%2C0-24%2C10.7-24%2C24s10.7%2C24%2C24%2C24h64V296z%22%2F%3E%3C%2Fsvg%3E);
	position: absolute;
	bottom: 8px;
	right: 8px;
}

.image-box  ul li a .caption{
	display: block;
	font-size: 14px;
	line-height: 1.4;
}


.num_list{
	counter-reset: number 0;
	border: 2px solid #BD0404;
	padding: 16px 16px 2px;
	border-radius: 6px;
	margin: 0 0 40px;
}

.num_list li{
	display: inline-block;
	position: relative;
	padding: 0 0 0 26px;
	margin: 0 0 14px;
	font-size: 14px;
}

.num_list li:before {
	counter-increment: number 1;
	content: counter(number) ". ";
	position: absolute;
	top: 0;
	left: 0;
	color: #BD0404;
	font-weight: bold;
}

.num_list li strong{
	font-size: 1.1em;
	font-weight: bold;
}

.contents_top_img{
	width: 100%;
	margin: 0 0 40px;
}

.contents_top_img img{
	width: 100%;
	height: auto;
}


.image-position01{
    width: 33%;
    float: right;
    margin: 0 0 1em 1em;
}


.point{
	counter-reset: number 0;
	border: 2px solid #BD0404;
	padding: 16px;
	border-radius: 6px;
	margin: 0 0 40px;
}



/********************************************************************************
	スマートフォン用 CSS
********************************************************************************/

@media(max-width:768px){

#movie_maincopy{
	display: block;
	margin: 0 0 30px;
}

#movie_maincopy .text,
#movie_maincopy .image{
	display: block;
	vertical-align: middle;
}

#movie_maincopy .image{
	width: 40%;
	margin: 0 auto 18px;
}

#movie_maincopy .text{
	font-size: 1.6rem;
	line-height: 1.8;
	padding-left: 0;
}

#movie_maincopy .text strong{
	font-size: 1.6em;
}



.image-box{
	margin: 30px 0 0;
}

.image-box ul li{
	float: left;
	width: 48%;
	margin: 0 0 18px;
}

.image-box ul li:nth-child(even){
	float: right;
}

.image-box  ul li a .caption{
	font-size: 1.3rem;
}


.num_list{
	padding: 12px 12px 2px;
	margin: 0 0 30px;
}

.num_list li{
	padding: 0 0 0 21px;
	margin: 0 0 10px;
	font-size: 1.3rem;
}


.image-position01{
    width: 80%;
    float: none;
    margin: 0 auto 20px;
}




}