@charset "utf-8";
/* CSS Document */

#kanban{
	position:relative;
	top:0;
	left:0;
	margin-bottom:80px;
	overflow:hidden;
	background-color:#E7ECF0;
}


#kanban p img{
	object-fit:scale-down;
	/*object-fit: cover;
	height:800px;*/
	height:auto;
	/* object-position: 36% 0; */
}
/*
#kanban dl{
	width:49%;
	max-width:450px;
	position:absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	background:rgba(255, 255, 255, .5);
	right:6%;
	padding:5% 2%;
}

#kanban dd{
	font-size:18px;
	margin-top:20px;
	line-height:2;
}*/

#intro .image img{
	width:428px;
}




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



#kanban p img{
	height:/*600px*/auto;
}
#kanban dd{
	font-size:15px;
}



}


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



#kanban{
	position:static;
}

#kanban p img{
object-fit: cover;
	/*height:400px;*/
	height:320px;
	object-position: /*63% 0*/50% 0;
}
#kanban dl{
	width:90%;
	max-width:none;
	position:static;
	top: 0;
	-webkit-transform: translateY(0);
	transform: translateY(0);
	left:0;
	margin:30px auto 0;
}

}















#scratch{
	background:#E5E5E5;
	max-width:1000px;
	margin:20px auto;
	padding:3% 0;
}

#scratch p{
	width:80%;
	margin:auto;
}

#scratch ul{
	margin-top:30px;
}

#scratch li{
	width:45%;
	display:inline-block;
	vertical-align:top;
}

#scratch li span{
	font-size:12px;
	display:block;
}

#special{
	max-width:1000px;
	margin:80px auto;
	position:relative;
}

#special #img{
	text-align:left;
}



#special #right{
	width:50%;
	right:0;
	position:absolute;
	bottom:0;
	font-size:20px;
}

#special #right p{
	margin-bottom:30px;
	line-height:2;
}



@media only screen and (max-width: 700px) { 
#special #right{
	width:90%;
	position:static;
	font-size:15px;
	margin:0 auto
}

#scratch li{
	width:90%;
	display:block;
	margin:0 auto 10px;
}

#scratch li span{
	text-align:left;
}


}












#main #menu{
	/* width:90%;
	max-width:1150px; */
	margin:20px auto;
}

#main #menu .comm_ttl{
	font-size:24px;
	letter-spacing:0em;
	font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
}
#main #menu h2{

	letter-spacing:0em;
	font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;

}
#main #menu li{
	width:30%;
	display:inline-block;
	text-align:center;
	margin:0 1.5%;
	vertical-align:top !important;
}

#main #menu li:first-child{
	margin-right:1%;
}


#main #menu li .inner{
	max-width:300px;
	margin:45px auto 10px;
	font-size:14px;
}






#main #menu li h2{
	font-size:18px;
	font-family: 'Poppins', sans-serif;
	margin-bottom:5px;
	letter-spacing:3px;
}

#main #menu li h3{
	margin-bottom:15px;
}

#main #menu li p:last-child{
	margin-top:30px;
}

#main #menu li p:last-child:before{
/*	content:url(img/top/arrow.gif);
	margin-right:10px;*/
}
	
#main p.more{
	font-family: 'Poppins', sans-serif;
	letter-spacing:0.25em;
		border:1px solid #ccc;

}





#main p.more a{
	display:block;
		padding:10px 0;

}

#main p.more a:hover{
	text-decoration:none;
}




@media only screen and (max-width: 789px) { 
#main #menu li{
	width:90%;
	margin:0 auto 50px;
	display:inline-block;
}

}







#movie{
	width:/*90%*/100%;
	max-width:1200px !important;
	margin:100px auto 0; 
}

#movie .movie_box{
	width:45%;
	display:inline-block;
	margin:0 2%;
}




#movie iframe{
	width:100%;
	height:350px;
}




#main #movie .inner{
	max-width:300px;
	margin:45px auto 10px;
	font-size:14px;
}



#main #movie p.more{
	max-width:300px;
	margin:0 auto;
	margin-top:30px;
}





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

#main #movie{
	width:90%;
	margin:0 auto 50px;
}

#movie .movie_box{
	width:90%;
	display:block;
	margin:0 auto 50px auto;
}


#movie iframe{
	width:100%;
	height:250px;
}





}







#main .o_ttl {
	background-color:#E88166;
	color:#FFF;
	padding:15px 0;
	margin-bottom:50px;
}


#main .o_ttl h2{
	font-size:34px;


}

#main .o_ttl p{
	font-size:24px;


}









.series .block{
	
		max-width:980px;
	margin:0 auto 100px;
	text-align:left;

	position:relative;
	margin-bottom:50px
}


.series .image{
	/* width:40%; */
}
.series .block  dl{
	width:40%;
	position:absolute;
	right:5%;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);

}

.series .block dt{
	font-size:18px;
	font-weight:bold;
	margin-bottom:5px;
	letter-spacing:2px;
}

.series .block dt:nth-of-type(2){
	padding-bottom:10px;
}

.series .block dd{
	margin-top:20px;
}


.series .right{
	text-align:right;
}


#intro .right dl{
	left:5%;
	text-align:left;
}


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

.series {
	text-align:center;
}

.series .block{
	position:static;
	margin-bottom:50px
}
.series .block  dl{
	width:90%;
	position:static;
	right:0;
	top: 0;
	-webkit-transform: translateY(0);
	transform: translateY(0);
	margin:0 auto 20px;
}

.series  .block dt{
	font-size:18px;
}

#intro .block dd{
	text-align:left;
}

.series .right{
	text-align:center;
}


.series .right dl{
	left:0;
	text-align:center;
}

#main .o_ttl h2{
	font-size:20px;


}

#main .o_ttl p{
	font-size:14px;


}





}