@charset "utf-8";

.wf-roundedmplus1c { font-family: "Rounded Mplus 1c"; }
.right{float:right;}
body{
	background: url(../img/head_bg.jpg) no-repeat center top;
}
header{
	position: relative;
	height: 652px;
	margin:0 auto;
}
header:after{
	display: block;
	clear: both;
	content: '';
}
header h1{
	text-align: center;
	position: relative;
	top:190px;
}
header p{
	position: relative;
	top:210px;
	line-height: 1.3;
	font-family: "Rounded Mplus 1c";
	font-size: 2.4rem;
	color: #faee51;
	text-align: center;
	font-weight: bold;
}
header p span{
	font-size: 3rem;
	display: block;
	font-weight: normal;
	letter-spacing: 0.2em;
}
nav{
	margin:0;
	padding-top: 10px;
}
nav ul:after{
	display: block;
	content: '';
	clear:both;
}
nav ul li{
	float:left;
	padding:0 20px;
	text-align: center;
	border-right: 1px solid #333;
	font-size: 1.6rem;
	line-height: 1.3;
	margin:0;
	height: 35px;
}
nav ul li a{
	margin:0;
	text-decoration: none;
	color:#333;
	transition: 0.3s;
}
nav ul li a:hover{
	color: #aaa;
}
nav ul li:nth-child(2){
	border-left:1px solid #333;
}
/*content========================*/
#sec1{
	width:740px;
	padding:20px 50px;
	margin:60px auto 0 auto;
	font-family: "Rounded Mplus 1c";
	text-align: center;
	background-color:#faee51;
}
#sec1 h2{
	background-color:#faee51;
	text-align: center;
	color:#e85298;
	font-size: 3.6rem;
	padding:10px 0;
	width: 360px;
	margin:0 auto 20px auto;
	letter-spacing: 0.2em;
}
#lead{
	font-size: 4rem !important;
	text-align: center;
	color:#333;
	line-height: 1.5;
	margin-bottom: 1em;
}
#sec1 div p{
	font-size: 3rem;
	line-height: 1.5;
	margin-bottom: 1em;
}
#sec1 div p span{
	font-size: 3rem;
	color:#e85298;
	font-weight: bold;
}
#sec1 h3{
	background-color:#e85298;
	text-align: center;
	color:#faee51;
	font-size: 3.6rem;
	padding:10px 0;
	width: 360px;
	margin:0 auto 20px auto;
	letter-spacing: 0.2em;
	font-weight: normal;
}

#sec1:after,#sec2:after,#sec4head:after{
	display: block;
	clear: both;
	content: '';
}
#present{
	float: right;
	margin-top: 90px;
}
#lead{
	font-size: 3rem;
	text-align: center;
}
#flow{
	margin:60px auto;
}
#sec2{
	margin:80px auto;
}
#sec2 h2{
	background-color:#faee51;
	text-align: center;
	color:#e85298;
	font-size: 3.6rem;
	padding:15px 0;
	width: 360px;
	margin:0 auto 20px auto;
	letter-spacing: 0.2em;
	font-family: "Rounded Mplus 1c";
	font-weight: normal;
}
#sec2 figure{
	float:left;
	width:48%;
	text-align: center;
}
#sec2 figcaption{
	font-size: 2rem;
	line-height: 1.3;
	font-family: "Rounded Mplus 1c";
}

#sec3{
	background:#e85298 url(../img/bg_arrow.png) no-repeat center top;
	padding:50px;
	color:#000;
	margin-top:30px;
	font-family: "Rounded Mplus 1c";
}
#sec3 h3{
	font-size: 4rem;
	color:#fff;
	line-height: 1.3;
	margin-bottom: 0.5em;
}
#sec3head{
	text-align: right;
	color:#fff;
	margin-bottom: 2em;
}
#sec3 #sec3head p{
	font-size:2.6rem;
	margin-bottom: 0;
	line-height: 1.5;
}
#sec3 p{
	font-size: 2rem;
	line-height: 2;
	margin-bottom: 1em;
}
#sec3 p:first-letter{
	margin-left:1em;
}
#sec3 h4{
	text-align: center;
	font-size: 3.6rem;
	margin:60px auto 30px auto;
	letter-spacing: 0.1em;
}
#sec3 #movie{
	margin-bottom: 60px;
}
#sec3 #movie div{
	width:230px;
	text-align: center;
	float: left;
	font-size:2.1rem;
	letter-spacing: 
	color:#fff;
}
#sec3 #movie div + div{
	margin-left: 24px;
}
#sec3 iframe{
	width:230px;
	margin-bottom: 0.5em;
}
#sign{
	text-align: center;
}
#sign a{
	color:#fff;
}
#sec4{
	background:#faee51 url(../img/bg_arrow.png) no-repeat center top;
	padding:50px;
	margin-top: 70px;
	font-family: "Rounded Mplus 1c";
}
#sec4 p{
	font-size: 2rem;
	line-height: 2;
}
#sec4 p:first-letter{
	margin-left: 1em;
}
#sec4_campaign{
	width: 100%;
}
#sec4head{
	background:#faee51 url(../img/sec4_book.jpg) no-repeat left top;
	text-align: right;
	color:#e85298;
	margin-bottom: 2em;
	text-align: right;
	height: 310px;
}
#sec4head p{
	font-size: 2.6rem;
	line-height: 1.5;
}
#sec4head h5{
	font-size: 3.8rem;
	line-height: 1.3;
}
#sec4head iframe{
	margin-top: 30px;
}
#campaignbnr{
	margin-top: 60px;
	text-align: center;
}
/*foot========================*/
#footlogo{
	text-align: center;
}
small{
	display: block;
	margin:1em auto;
}

/*スマホ用＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
@media screen and (max-width:480px) { 
	.pc{display: none !important;}
	.sp{display: block !important;}
	.right,.left{float:none;}

	body{
		margin-top: 0;
		background-size: contain;
		background-position: 0 200px;
	}
	header{
		width: 100%;
		height: auto;
		background: none;
		margin-top: 30px;
	}
	header h1{
		left:0;
		text-align: center;
		top:40px;
	}
	header h1 img{
		width: 80%	;
	}
header p{
	position: relative;
	top:40px;
	line-height: 1.3;
	font-family: "Rounded Mplus 1c";
	font-size: 1.6rem;
	color: #faee51;
	text-align: center;
	font-weight: bold;
}
header p span{
	font-weight: normal;
	font-size: 1.6rem;
	letter-spacing: 0.2em;
}
	nav ul li{
		float:none;
		padding:10px 0;
		width:100%;
		border-right:none;
		font-size: 1.6rem;
		height: 35px;
		border-bottom: 1px dotted #fff;
		background-color: #e85298;
		transition: 0.3s;
	}
	#campaignname{
		background-color: #ccc;
		color:#e85298;
		height:26px;
		font-size: 2.4rem;
		border-bottom: 2px solid #fff;
		font-weight: bold;
		font-family: "Rounded Mplus 1c";
		letter-spacing: 0.1em;
	}
	nav{
		width:100%;
		padding-top: 0;
	}
	nav ul li:hover{
		background-color: #e8aacc;
	}
	nav ul li a{
		color:#fff;
	}
	nav ul li a:hover{
		color:#e85298;
	}
	nav ul li:last-child{
		border-left:none;
		height:auto;
		padding-top: 12px;
	}

	#sec1{
		width:100%;
		margin:130px 0;
		padding: 30px 0 20px 0;
		text-align: center;
		background-color: #faee51;
	}
	#sec1 div{
		width:100%;
	}
	#sec1 div img{
		width: 90%;
		margin:0;
	}
	#sec1 h2{
		padding:0;
		width: auto;
		letter-spacing:0;
	}
	#lead{
		text-align: left;
		padding:0 20px;
		margin-bottom:1em;
		font-size: 2.6rem !important;
	}
	#flow ol{
		width: 100%;
	}		
	#present{
		padding-bottom: 60px;
		float: none;
		width:90%;
	}
	#sec2 h2{
		font-family: "Rounded Mplus 1c";
		width: 100%;
		font-weight: normal;
	}
	#sec2 figure{
		float:none;
		width:100%;
		margin-bottom: 3em;
	}
	#sec3{
		padding:50px 20px;
	}
	#sec3 #movie div{
		float: none;
		margin:1em auto;
	}
	#sec3 #movie div + div{
		margin:1em auto;
	}
	#sec3head{
		text-align: center;
	}
	#sign{
		text-align: center;
	}
	#sign img{
		width: 90%;
	}

	#sec4{
	background:#faee51 url(../img/bg_arrow.png) no-repeat center top;
	padding:50px 20px;
	margin-top: 70px;
	}
	#sec4 p{
		font-size: 2rem;
		line-height: 2;
	}
	#sec4 p:first-letter{
		margin-left: 1em;
	}

	#sec4head{
		background:#faee51 url(../img/sec4_book.jpg) no-repeat center 150px;
		text-align: center;
		margin-bottom: 0;
		height: 350px;
		padding-bottom: 320px;
	}
	#sec4head iframe{
		margin-top: 330px;
	}





}

