@charset "utf-8";

/* -----------------------------------------------
  contents
----------------------------------------------- */
#Cont{
	width:100% !important;
	line-height: 1.4;
}
#Cont img {
	width: 100%;
	vertical-align: top;
}

#campaign_end{
	line-height: 1.6;
	background-color:#004ea2;
	color:#fff100;
	text-align: center;
}
.campaign_parent{
	background: #7BC1E5;
}

@media screen and (min-width: 641px) {
	.isSP{
		display: none;
	}
	#Cont .inner {
		max-width: 960px;
		margin: 0 auto;
		position: relative;
	}
	section h2{
		padding:6.25% 0 4.166%;
		width:50%;
		margin:auto;
	}
	#campaign_end{
		font-size: 26px;
	}
	#campaign_end .inner{
		padding:0.6em;
	}
	.campaign_parent{
		padding-bottom: 24px;
	}
}
@media screen and (max-width: 640px) {
	.isPC{
		display: none;
	}
	#campaign_end .inner{
		padding:1em 0;
		font-size:3.75vw;
		font-weight:bold;
	}

	section h2{
		padding:11.875% 0 6%;
		width:60%;
		margin:auto;
	}
	section h3{
		width:75.333%;
		margin: auto;
	}
	.campaign_parent{
		margin-bottom:3.125%;
	}
}

/* -----------------------------------------------
  campaign_head
----------------------------------------------- */

#campaign_head{
	width:100%;
	background-size: contain;
}

#campaign_head .content{
	position: relative;
	overflow: hidden;
}
#campaign_head .content>*{
	position: absolute;
}
#campaign_head .content::after{
	content:'';
	display:block;width:100%;height:100%;
	position: relative;

}

#head_term{
	width:100%;
	background: #D8EDF7;
	background-size: contain;
}

@media screen and (min-width: 641px) {

	max-width: 100%;;
		background: #fff url(../img/top.jpg) no-repeat center top;
		background-size: cover;

        width:100%;                                          
        height:100vh   
        
	}
    #campaign_head .pc { display: block !important; }
    #campaign_head .sp { display: none !important; }
    
    
	
	#campaign_head h1, #campaign_head p{
		width:66.562%;
		margin:2.604% 0 0 0;
		z-index: 1;
		text-indent: 100%;
		color: transparent;
		font-size: 0;
	}

	#campaign_head .can{
		margin:-0.8% 0 0 -0.73%;
		width:49.166%;height:100%;
	}
	#campaign_head .can .ratio{
		position: absolute;
		width:14.218%;
		bottom:0;right:0;
		margin:0 19.49% 1.72% 0;
	}
	#campaign_head .legal_icon{
		width:6.875%;
		bottom:0;right:0;
		margin:0 1.45% 1.04% 0;
		z-index:6;
	}

	#head_term .inner{
		max-height:66px;
	}
	#head_term img{
		margin:auto;
		padding:1.25% 0;
	}
}
@media screen and (min-width: 2001px) {
	#campaign_head {
		background-size: cover;
	}
	
}

@media screen and (max-width: 640px) {

	#campaign_head>.inner{
		position: relative;
		background: #fff url(../img/top_sp.jpg) no-repeat center top;
		background-size:contain;
	}
    
     #campaign_head .pc { display: none !important; }
     #campaign_head .sp { display: block !important; }
    

    #campaign_head h1, #campaign_head p{
        width:66.562%;
        margin:2.604% 0 0 33.437%;
        z-index: 1;
        text-indent: 100%;
        color: transparent;
        font-size: 0;
    }
	#campaign_head .content::after{
		padding-bottom:177%;
	}
	#campaign_head h1{
		top:0;left:0;
		margin:1.25% 0 0 6.718%;
		width:84.843%;
		z-index:2;
	}
	#campaign_head .can{
		bottom:0;left:0;
		width:70.781%;
		margin:0 0 0 14.687%;
	}
	#campaign_head .can .ratio{
		position: absolute;
		width:19.362%;
		bottom:0;right:0;
		margin:0 9.56% 3.09% 0;
	}
	#campaign_head .txt{
		bottom:0;
		margin:0 0 11.875% 3.125%;
		width:93.281%;
		z-index:5;
	}
	
	#campaign_head .legal_icon{
		width:10.3125%;
		margin:0 3.4375% 1.5625% 0;
		bottom:0;right:0;
		z-index:6;
	}
	#head_term .inner{
		width: 94.531%;
		padding:2.5% 0;
		margin:auto;
	}
}

/* -----------------------------------------------
  campaign_method
----------------------------------------------- */

#campaign_method li{
	background: #D8EDF7;
	box-sizing: border-box;
}
#campaign_method li.step1 a{
	background: #1da1f2;
}
@media screen and (min-width: 641px) {

	#campaign_method ul{
		display: flex;
	}

	#campaign_method li{

		width:31.25%;
		margin-right:3.125%;
		position:relative;
	}

	#campaign_method li .title{
		width:29.3333%;
		margin:8% auto 0;
	}
	#campaign_method li .content{
		width:90%;
		margin:0 auto 0;
		padding-top:2.96%;
	}
	#campaign_method li.step1 .content{
		padding-top:0;
	}
	#campaign_method li.step1 a{
		display: block;
		width:90%;
		padding:6.29% 0;
		margin:6% auto 6%;
		border-radius: 6px;
	}
	#campaign_method li.step1 a img{
		width:91.481%;margin:auto;
	}
	#campaign_method li.step3{
		margin-right:0;
	}

}

@media screen and (max-width: 640px) {

	#campaign_method ul{
		width:93.75%;
		margin:auto;
	}
	#campaign_method li{margin-bottom:3.125%;padding:4.33% 0 8.333% 0;}
	#campaign_method li .title{
		margin:0 auto 6%;
		width:30%;
	}

	#campaign_method .content{
		width:88.333%;margin:0 auto ;
	}

	#campaign_method li.step1 a{
		display: block;
		width:69.166%;
		padding:5.33% 0;
		margin:6% auto 0;
		border-radius: 6px;
	}
	#campaign_method li.step1 a img{
		width:94.698%;margin:auto;
	}
	#campaign_method li:last-child{
		margin-bottom: 0;
	}
}

/* -----------------------------------------------
  campaign_prize
----------------------------------------------- */
#campaign_prize .prize{
}

@media screen and (min-width: 641px) {
	#campaign_prize .prize{

		position: relative;	}

	#campaign_prize .txt{
		width:72.395%;
		margin:0 auto 2.291%;
		padding-top:2.916%;
	}
	#campaign_prize .image{
		width:100%;
		margin-left:0;
		position: relative;
	}
	#campaign_prize .image .ratio{
		position: absolute;
		width:8.595%;
		bottom:0;right:0;
		margin: 0 -9.619% 1.719% 0;
	}
	
}
@media screen and (max-width: 640px) {

	#campaign_prize .prize{
		width: 93.75%;
		margin:auto;
		text-align: center;
	}
	#campaign_prize .txt{
		width:91.666%;margin:auto;
		padding-bottom:10%;
	}
	#campaign_prize .image{
		width:100%;
		margin:0 auto 0;
		position: relative;
	}
	#campaign_prize .image .ratio{
		width:13.379%;
		position: absolute;
		top:0;right: 0;
		margin:-6.33% 1.5% 0 0;
	}


}


/* -----------------------------------------------
  campaign_guideline
----------------------------------------------- */

#campaign_guideline{
	color:#333;
	line-height:1.4;
}
#campaign_guideline .guideline{
			background: #D8EDF7;

}

#campaign_guideline .guideline2{
			background: #7BC1E5;

}


#campaign_guideline a{
	color:#333;
	text-decoration: underline;
}
#campaign_guideline dt{
	color:#333;
	font-weight: bold;
	margin:1.5em 0 0.4em 0;

}

#campaign_guideline dd li{
	padding-left:1em;
	text-indent: -1em;
	margin-bottom:0.4em;
}
#campaign_guideline p{
	margin-bottom:0.4em;
}

#campaign_guideline .mail_img_txt{
	display: inline;
	width: 13.125em;
    vertical-align: sub;
}

@media screen and (min-width: 641px) {
	#campaign_guideline{
		font-size: 16px;
	}
	#campaign_guideline>.inner{
		padding-bottom:20px;
	}

	#campaign_guideline dl{
		padding:2% 6.25% 4%;
	}
	#campaign_guideline dt{
		font-size:16px;
	}
	
	#campaign_guideline .mail_img_txt.isPC{
		display: inline;
	}
	#campaign_guideline .mail_img_txt.isSP{
		display: none;
	}
}
@media screen and (max-width: 640px) {
	
	#campaign_guideline{
		font-size: 4vw;
		line-height: 1.4em;
	}

	#campaign_guideline .guideline{
		width:93.75%;margin:auto;
		box-sizing: border-box;
		padding:2.5% 0 6%;
	}
	#campaign_guideline>.inner{
		padding-bottom:3.125%;
	}
	#campaign_guideline .guideline dl{
		width:90%;margin:auto;
	}

	#campaign_guideline .mail_img_txt{
		width: 13.33em;
	}
	#campaign_guideline .mail_img_txt.isPC{
		display: none;
	}
	#campaign_guideline .mail_img_txt.isSP{
		display: inline;
	}
}

#legal .inner{
	text-align: right;
	padding-bottom:20px;
}
#legal img{display:inline;width:66px;}
@media screen and (max-width: 640px) {
	#legal .inner{
		width:93.75%;margin:auto;
		padding-bottom:6.25%;
		margin-bottom:3%;
	}

}

/* ----------------------------------------------
*footer
----------------------------------------------- */
.footer {
     background: #fff;
    height: auto;
    font-size: 0.5rem;
    padding-bottom: 5px;
}

.footer p {
    font-size: 0.5rem;
    font-weight: bold;
    padding: 5px 0;
    color: #333333;
    text-align: center;
    
}
