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

body{
	margin: 0;
}

.wrapper{
	max-width: 1000px;
	width: 100%;
	margin: 0 auto;
	background-color: #FBE5D6;
	padding: 5% 0 3%;
	font-family: "Noto Sans JP", sans-serif;
    font-optical-sizing: auto;
}

.wrapper img{
	display: block;
	line-height: 0;
}

.title{
	width: 70%;
	margin: 0 auto;
}

.img1{
	width: 70%;
	margin: 8% auto;
}

.wrapper p{
	text-align: center;
	color: #4D434B;
	font-size: 13px;
	letter-spacing: 0.6px;
	line-height: 2.5;
	margin: 10% auto;
	font-weight: bold;
}

.movie{
	width: 70%;
	margin: 0 auto 5%;
}

video{
	width: 100%;
	height: auto;
}

.wrapper .other{
	width: 25%;
	margin-left: 70%;
}

.wrapper .staff{
	width: 90%;
	display: flex;
	column-gap: 15px;
	align-items: flex-start;
	justify-content: center;
	margin: 6% auto;
}

.wrapper .staff img{
	width: 30%;
	margin: 0;
	border-radius: 110px;
}

.wrapper .staff p{
	font-size: 11px;
	margin: 0;
	line-height: 1.6;
	text-align: left;
}

.wrapper .staff span{
	font-size: 15px;
}

.wrapper ul{
	width: 90%;
	margin: 10% auto;
	padding: 0;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	column-gap: 10px;
	grid-row-gap: 10px;
}

.wrapper ul li{
	width: calc(50% - 5px);
	}

.wrapper ul li a{
	display: block;
	background-color: #5b6e00;
	color: #fff;
	text-decoration: none;
	font-size: 16px;
	text-align: center;
	line-height: 2.6;
	border-radius: 50px;
	font-family: montserrat, sans-serif;
	font-weight: 700;
	font-style: normal;
}

@media(min-width:750px){
.title{
	width: 50%;
	margin: 0 auto;
}

.img1{
	width: 40%;
	margin: 8% auto;
}

.wrapper p{
	font-size: 15px;
}

.movie{
	width: 40%;
	margin: 0 auto 5%;
}


.wrapper .other{
	width: 15%;
	margin-left: 70%;
}

.wrapper .staff{
	width: 90%;
	column-gap: 30px;
	align-items: center;
}

.wrapper .staff img{
	width: 17%;
}

.wrapper .staff p{
	font-size: 13px;
}

.wrapper .staff span{
	font-size: 15px;
}

.wrapper ul{
	margin: 10% auto 3%;
	flex-wrap: nowrap;
	column-gap: 15px;
}


}