/* let's clear some floats */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }  
.clearfix:after { clear: both; }  
.clearfix { zoom: 1; }  

.sp{
	display: none;
}

.red{
	color:#DF0000;
}

.f12{
	font-size:12px;
}

.tCenter{
	text-align: center;
}

li{
	list-style-type: none;
}

p:not(:last-child){
	margin-bottom: 1.5em;
}

figure{
	margin: 0;
	display: block;
}

#contents{
	margin:10px auto 40px;
	width:940px;
	text-align: left;
	color:#333333;
	font-family: 'Noto Sans JP', sans-serif;
}

.main{
	background: #EDEDED;
	margin: 0 -500% 80px;
	padding: 0 500%;
}

.main .inner{
	display: flex;
}

.main .inner figure img{
	width: 300px;
}

.main .inner .txt{
	padding:50px;
	display: flex;
	align-items: center;
}

.main .inner .txt .logo img{
	width: 460px;
	margin-bottom: 30px;
}

.movie{
	text-align: center;
	margin-bottom: 40px;
}

.anchorLink{
	display: flex;
	justify-content: space-around;
	margin-top: 40px;
}

.anchorLink li{
	width:400px;
	text-align: center;
}

.anchorLink li a{
	display: block;
	border-radius: 10px;
	background: url("../img/anchor_arrow.png") no-repeat right 20px center / 20px auto, linear-gradient(to right, #929292, #AFAFAF, #929292);
	color: #FFF;
	padding: 20px;
	text-decoration: none;
	font-weight: bold;
	transition: all .3s;
}

.anchorLink li a:hover{
	opacity: .7;
}

.use{
	margin-top: 80px;
}

.use h3{
	font-size: 24px;
	text-align: center;
	font-weight: normal;
	margin-bottom: 30px;
}

.use .head{
	margin: 40px 0;
}

.use .head h4{
	font-size: 21px;
	font-weight: bold;
	margin-bottom: 20px;
}

.use .shareContent{
	margin-top:40px;
}

.use .shareContent h4{
	font-size: 21px;
	font-weight: normal;
	border-bottom: 1px solid #000;
	padding-bottom: 10px;
	margin-bottom: 30px;
}

.use .shareContent .imgBox{
	display: flex;
	justify-content: space-between;
	margin: 30px 0;
}

.use .shareContent .imgBox.imgRight{
	flex-direction: row-reverse;
}

.use .shareContent .imgBox figure,
.use .shareContent .imgBox figure img{
	width: 350px;
}

.use .shareContent .imgBox .txt{
	width: 550px;
}

.recommend{
	background: #F2F2F2;
	padding: 30px;
	margin-top: 30px;
}

.recommend h4{
	font-size: 20px;
	margin-bottom: 20px;
}

.recommend .list{
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}

.recommend .list li{
	width: 260px;
	text-align: center;
}

.recommend .list li img{
	max-width: 150px;
	margin-bottom: 10px;
}

.recommend .list li .txt{
	display: block;
}

.recommend .list li .txt:before{
	content: ">> ";
}

.recommend .inner{
	display: flex;
	align-items: center;
}

.recommend .inner .list{
	width: 560px;
}

.recommend .inner .notes{
	border: 1px solid #000;
	padding: 15px;
	font-size: 14px;
	margin-left: 30px;
	width: 340px;
}