@charset "UTF-8";
.txtIndent a, .notesIndent a, .cpNotesItem a{
	display: inline;
	color: #0000ff;
	text-decoration: underline;
}
.contsWrap {
	padding: 0 3.125% 3.125%;
}
.box01{
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 2.083335%;
	border: solid 4px #e6000f;
}
.box01 h2{
	margin-top: -6.25%;
}
.box01 > p:nth-of-type(1){
	margin-top: 1em;
	font-size: 3.2vw;
}
.box01 > p:nth-of-type(2){
	margin-top: .2em;
	font-size: 4vw;
	font-weight: 700;
	text-align: center;
}
.box01 > p:nth-of-type(2) span{
	color: #e6000f;
}
.box01 > p.txtIndent{
	margin-top: .5em;
	font-size: 2.2vw;
}
.box02{
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 2.083335%;
	border: solid 4px #fcc800;
	border-radius: 21px;
}
.box02 h2{
	margin-top: -5.25%;
}
.box02 > div{
	margin-top: 7.5%;
	padding: 2.083335% 2.083335% 3.125%;
	border: solid 2px #969696;
}
.box02 > div h3{
	margin-top: 5%;
	margin-bottom: 4%;
}
.box02 > div h3:nth-of-type(1){
	margin-top: -5.85%;
	margin-bottom: 4%;
}
.box02 > div .btnWrap{
	position: relative;
	z-index: 10;
}
.box02 > div .btnWrap > p:nth-of-type(1){
	margin-top: 7%;
}
.box02 > div .btnWrap > .entBtn{
	margin: 2% 0;
}
.bg01{
	position: relative;
	padding-bottom: 18%
}
.bg01::before{
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
	background: url(../img/bg01.png) 0 100% no-repeat;
	background-size: 100%;
}
.bg02{
	background: #ffeca0;
}
.bg02 h2{
	padding: .4em 0 .3em;
	background: #fcc800;
	font-size: 3.6vw;
	font-weight: 700;
	text-align: center;
}
.bg02 .contsWrap > div{
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 0 2.083335% 3.125%;
	background: #fff;
}
.bg02 .contsWrap > div:nth-of-type(1){
	padding-top: 6.25%;
}
.bg02 .contsWrap > div h3{
	padding: .2em 1.5em .15em;
	border-radius: 2vw;
	background: #3c3c3c;
	color: #fff;
	font-size: 3.3vw;
	text-align: center;
}

.bg02 .contsWrap > div h3 + p{
	margin: .8em 0;
	font-size: 3.3vw;
	font-weight: 700;
	text-align: center;	
}

.bg02 .contsWrap > div .entBtn{
	margin-bottom: 5%;
}

.bg02 .contsWrap > div .txtIndent{
	margin-top: 5%;
	padding: 0 6%;
	font-size: 2.2vw;
}
.info h2{
	margin-bottom: 1em;
	padding: .25em 0 .15em;
	background: #3c3c3c;
	color: #fff;
	font-size: 2.3vw;
	font-weight: 700;
	text-align: center;
}
.info .txtIndent{
	padding: 0 3.8%;
	font-size: 2.2vw;
}
.info > div > p{
	margin-top: 1.5em;
	font-size: 2.2vw;
	text-align: right;
}
.info > div > p:nth-of-type(2){
	margin-top: 2.5em;
	text-align: center;
}
.campaign > p{
	font-size: 2.2vw;
	text-align: center;
}
.campaign > div{
	padding: 0 5%;
}
.campaign > div ul li{
	margin-top: 6%;
}
.campaign > div ul li:nth-child(1){
	margin-top: 0;
}

@media only screen and (min-width: 641px) {
	.contsWrap {
		padding: 0 4.16667% 3.125%;
	}
	.box01{
		padding: 2.083335%;
	}	
	.box02{
		padding: 2.083335%;
	}	
	.campaign > p{
		font-size: 18px;
	} 
	.campaign > div{
		padding: 0 12.5%;
	} 
}
@media only screen and (min-width: 961px) {
	.box01 > p:nth-of-type(1){
		font-size: 28px;
	}
	.box01 > p:nth-of-type(2){
		font-size: 36px;
	}
	.box01 > p.txtIndent{
		margin-top: .5em;
		font-size: 18px;
	}
	.bg02 h2{
		font-size: 32px;
	}
	.bg02 .contsWrap > div h3{
		border-radius: 20px;
		font-size: 30px;
	}
	.bg02 .contsWrap > div h3 + p{
		font-size: 30px;
	}
	.bg02 .contsWrap > div .txtIndent{
		font-size: 18px;
	}
	.info h2{
		font-size: 32px;
	}
	.info .txtIndent{
		font-size: 18px;
	}
	.info > div >  p{
		font-size: 18px;
	}
}