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

#lp_{
	margin: 0 auto 150px;
	width: 1120px;
	/*background-color: antiquewhite;*/
	color: #444;
}

#lp_ .frame_{
	margin: auto;
	width: 1000px;
	font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
}

#lp_ img{
	width: 100%;
}

#lp_ .credit{
	font-family: serif;
	font-size: 1.6rem;
	font-weight: bold;
	margin: 4% auto 15%;
	text-align: center;
}

#lp_ .credit a{
	text-decoration: underline;
}


#lp_ .cooperation_{
	width: 100%;
	margin: 30px 0 0;
	text-align: center;
	font-size:1.5rem;
	line-height:2.2;
	font-family: serif;
}

/* -----------------------------------------------
フェードインの動きの大きさ設定
-------------------------------------------------- */
@keyframes fadeInUpsmall{
	0%{opacity:0;transform:translate3d(0,10%,0)}
	to{opacity:1;transform:none}
}
.fadeInUpsmall{	animation-name:fadeInUpsmall}

@keyframes fadeInDownsmall{
	0%{opacity:0;transform:translate3d(0,-10%,0)}
	to{opacity:1;transform:none}
}
.fadeInDownsmall{animation-name:fadeInDownsmall}

@keyframes fadeInRightsmall{
	0%{opacity:0;transform:translate3d(10%,0,0)}
	to{opacity:1;transform:none}
}
.fadeInRightsmall{animation-name:fadeInRightsmall}

@keyframes fadeInLeftsmall{
	0%{opacity:0;transform:translate3d(-10%,0,0)}
	to{	opacity:1;transform:none}
}
.fadeInLeftsmall{animation-name:fadeInLeftsmall}

/* -----------------------------------------------
フェードインの動きの大きさ設定
-------------------------------------------------- */


.title_{
	margin: 50px auto 0;
	width: 500px;
/*	background-color: antiquewhite;*/
}

.title_ p{
	color: #757575;
	font-size: 4.4rem;
	margin: -6px 0 0 5px;
	letter-spacing: 0.8rem;
	text-align: center;
}

.conttitle_{
	margin: 50px auto 0;
	padding: 5px 0;
	background-color: #a9cb7c;
}

.conttitle_ p { 
	color: #fff;
	text-align: center;
	font-size: 2.5rem !important;
	letter-spacing: 0.1rem;
}

.period_{
	margin: 20px auto 30px;
}

.period_ img{
	display: block;
	margin: auto;
	width: 450px !important;
}

.period_ p{
	margin: 3px auto 0;
	font-size: 1.7rem;
    font-weight: 500;
    letter-spacing: 0.1rem;
	text-align: center;
}

.conttext_{
	width: 90%;
	text-align: left;
    line-height: 1.6;
    font-size: 1.5rem;
	margin: 20px auto 0;
}

.brandlist_{
	margin: 20px 0 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 30px 30px;
}

.brandlist_ .item_{
	width: 230px;
}

.bz_btn{
	width: 300px;
	margin:  40px auto 0;
}

.bz_btn p{
	text-align: center;
	padding: 20px;
	border: 1px solid;
	font-size: 1.5rem;
}

#lp_ li{
	margin: auto;
	width: 90%;
	list-style:inside;
	text-indent: -1.4em;
    padding-left: 1.5em;
	line-height: 1.6;
    font-size: 1.5rem;
}

.conttext_ a{
	text-decoration: underline !important;
	color: #568a2c;
}

@media (max-width: 599px) {
	#lp_{
		letter-spacing: 0.13rem;
		margin: 30px auto 80px;
		width: 100%;
		max-width: 599px;
		min-width: 300px;
		font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
	}
	
	#lp_ .frame_{
		
		margin: auto;
		width: 100%;
	}
	
	.title_{
		margin: 40px auto 0;
		width: 80%;
	}
	
	.title_ p{
		font-size: 1.65rem;
		letter-spacing: 0.3rem;
	}
	
	.conttitle_{
		margin: 40px auto 0;
		padding: 7px;
	}
	
	.conttitle_ p { 
		font-size: 1.1rem !important;
	}
	
	.period_{
		width: 90%;
	}
	
	.period_ img{
		display: block;
		margin: auto;
		width: 340px !important;
	}

	.period_ p{
		margin: 0px auto 0;
		font-size: 0.9rem;
		letter-spacing: 0.05rem;
	}
	
	.conttext_{
		width: 93%;
		text-align: left;
		line-height: 1.5;
		font-size: 0.8rem;
		margin: 15px auto 0;
	}
	
	.brandlist_{
		margin: 15px 0 0;
		gap: 10px 10px;
	}

	.brandlist_ .item_{
		width: 30%;
	}
	
	.bz_btn{
		width: 55%;
		max-width: 250px;
		margin:  30px auto 0;
	}

	.bz_btn p{
		padding: 15px;
		font-size: 0.8rem;
	}
	
	#lp_ li{
		width: 93%;
		text-indent: -1.4em;
		padding-left: 1.5em;
		line-height: 1.5;
		font-size: 0.8rem;
	}

}