/*******************************************
	mainvisual
*******************************************/

.specialPayPayCampaignBackground{
  padding-top: 8px;
  padding-bottom: 8px;
  text-align: center;
  background-color: #FF0033;
}

.mainvisual{
	text-align: center;
	color: #fff;
}

.mainvisual__inner{
	position: relative;
	width: 100%;
  background: #FFF5DB;
}
.mainvisual__image{
	width: 100%;
	height: auto;
}

.mainvisual__supplement{
	padding:12px 24px 0;
	font-size: 12px;
	color: #606060;
	text-align: left;
}

.mainvisual__buttonArea{
	margin:24px 24px 0;
}
.mainvisual__buttonAreatext{
	text-align: center;
	font-size: 14px;
	font-weight: 600;
	color: #606060;
}

.mainvisual__button{
	position: relative;
	display: block;
	margin-top: 12px;
	margin-right: auto;
	margin-left: auto;
	max-width: 327px;
	font-weight: bold;
	font-size: 18px;
	height: 44px;
	color: #fff;
	line-height: 44px;
	background: #3895FF;
	border-radius: 8px;
}

.mainvisual__button:after {
    content: "";
    position: absolute;
    right: 22px;
    top:  18px;
    width: 10px;
    height: 10px;
    border-right: 3px solid #fff;
    border-top: 3px solid #fff;
    display: inline-block;
    transform: rotate(45deg);
}


/* SP */
@media screen and (max-width: 767px){


	.mainvisual__qrArea{
		display: none;
	}
}
/******
	pc
******/
@media screen and (min-width: 768px){


	.mainvisual__inner{
		height: 340px;
		background: #FFF5DB url(../images/mainPcBg@2x.png) no-repeat center center;
		background-size:1200px 340px;
	}

	.mainvisual__image{
		width:  563px;
		margin-top: 14px;
		height: auto;
	}


	.mainvisual__qrArea{
		display: block;
		position: absolute;
    right: 36px;
    bottom: -200px;
		background: #fff;
		padding:20px 16px;
	}

	.mainvisual__qrAreaTitle{
		color: #242323;
		font-size: 16px;
		font-weight: bold;
	}
	.mainvisual__qrImage{
		margin-top: 8px;
	}

	.mainvisual__qrAreaText{
		color: #242323;
		font-size: 10px;
		margin-top: 8px;
	}
	.mainvisual__supplement{
		width: 580px;
		margin-right:auto;
		margin-left: auto;
	}
	.mainvisual__buttonArea{
		display: none;
	}

}

/*******************************************
	mainArea
*******************************************/


.mainArea{
	padding:56px 16px 0;
}
.mainArea__bgOdd{
	background: #F7F7F7;
}

.mainArea__title{
	text-align: center;
	font-weight: bold;
	font-size: 24px;
	color: #242323;
}
.mainArea__titleSmall{
	font-size: 16px;
	color: #606060;
}

.mainArea__title:after{
	content:"";
	display: block;
	width: 40px;
	height: 4px;
	background: #FFB900;
	border-radius: 2px;
	margin: 17px auto 0;
}

.mainArea__pageLinks{
  margin-bottom: 56px;
  padding :12px;
  border: 1px solid #C4C4C4;
  border-radius: 8px;
  font-size: 12px;
}
.mainArea__pageLink{
  margin-left: 1em;
  text-indent: -1em;
}
.mainArea__pageLink:before{
  content:"・";
  color: #3895FF;
}

/******
	pc
******/
@media screen and (min-width: 768px){

	.mainArea{
		margin-top: 44px;
	}

	.mainArea__inner{
		width: 747px;
		margin-left: auto;
		margin-right: auto;
	}
}


/****************************
	shippingArea , campaignDetail
****************************/

.shipping,
.campaignDetail,
.campaignUsage,
.campaignMethod{
	text-align: center;
}

.shippingTitle{
	height: 96px;
	text-align: center;
	font-size: 24px;
	font-weight: 600;
	background: url(../images/reparation.svg) no-repeat top center;
}

.campaignDetailTitle{
	height: 96px;
	text-align: center;
	font-size: 24px;
	font-weight: 600;
	background: url(../images/campaign.svg) no-repeat top center;
}

.campaignUsageTitle{
	height: 96px;
	text-align: center;
	font-size: 24px;
	font-weight: 600;
	background: url(../images/icon_system_friends_twoTone.svg) no-repeat top center;
}

.campaignMethodTitle{
	height: 96px;
	text-align: center;
	font-size: 24px;
	font-weight: 600;
	background: url(../images/icon_card_smartPhone_twoTone.svg) no-repeat top center;
}

.qaTitleText{
	height: 96px;
	text-align: center;
	font-size: 24px;
	font-weight: 600;
	background: url(../images/message_question.svg) no-repeat top center;
}

.shippingTitleText,
.campaignDetailTitleText,
.campaignUsageTitleText,
.campaignMethodTitleText,
.campaignContentTitleText,
.qaTitleText
{
	display: block;
	text-align: center;
	padding-top: 60px;
}

.campaignContentTitle{
	height: 96px;
	text-align: center;
	font-size: 24px;
	font-weight: 600;
	background: url(../images/icon_content.svg) no-repeat top center;
}

.campaignDetailText{
	font-size: 14px;
	color: #606060;
	text-align: center;
	margin-top: 32px;
}

.shippingImgae{
	margin-top:32px;
	width: 100%;
	height: auto;
	max-width: 327px;
}

.campaignDetailImgae{
	margin-top:24px;
	width: 100%;
	height: auto;
	max-width: 327px;
}

.campaignDetail__supplement{
	width: 100%;
	max-width: 327px;
	text-align:left;
	margin-top: 11px;
	margin-right: auto;
	margin-left: auto;
	font-size: 12px;
	color: #606060;
}

.campaignUsage__InnerArea,
.campaignMethod__InnerArea{
	margin-top: 32px;
	padding-top:32px;
	padding-bottom:32px;
	background: #FFF3E7;
	width: 100%;
	max-width: 747px;
}
.campaignMethod__InnerArea{
	position: relative;
	margin-top: 67px;
	padding:32px 24px;
	border-radius: 8px

}

.campaignMethod__InnerAreaIntroduced{
	margin-top: 32px;
	padding-top:32px;
	padding-bottom:48px;
	background: #E7FFFF;
	width: 100%;
	max-width: 747px;
	position: relative;
	margin-top: 67px;
	padding:32px 24px;
	border-radius: 8px
}

.campaignMethod__InnerAreaIntroduced::before{
	content:"";
	position: absolute;
	top: -35px;
	left: 50%;
	transform: translate(-50%,0);
	width: 64px;
	height: 64px;
	background: url(../images/campaignMethod02@2x.png) no-repeat center center;
	background-size:64px 64px;
}


.campaignMethod__InnerArea::before{
	content:"";
	position: absolute;
	top: -35px;
	left: 50%;
	transform: translate(-50%,0);
	width: 64px;
	height: 64px;
	background: url(../images/campaignMethod01@2x.png) no-repeat center center;
	background-size:64px 64px;
}

.campaignUsage__InnerImageHr{
	margin-right: 16px;
	margin-left: 16px;
	padding-bottom: 32px;
	margin-bottom:32px;
	text-align: center;
	border: none;
	border-bottom: 2px dashed #FFBA8B;
}

.campaignUsage__InnerImage{
	width: 100%;
	max-width: 327px;
	height: auto;
}


.campaignMethod__InnerTitle{
	text-align: center;
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 24px;
}

.campaignMethod__InnerImage{
	margin-top: 32px;
	width: 100%;
	max-width: 279px;
	height: auto;
}

.campaignContent__area{
	color: #606060;
	margin-top: 32px;
}

.campaignContent__box{
	border-bottom: 1px solid #EEEEEE;
	padding-bottom: 8px;
	margin-bottom: 12px;
}

.campaignContent__title{
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 8px;
}


.campaignContent__text{
	font-size: 14px;
}

/******
	pc
******/
@media screen and (min-width: 768px){

}



/****************************
	qaArea
****************************/


.qaArea__inner{
	padding-top: 40px;
}

.qaArea__listInner{
	padding-left: 8px;
	padding-right: 8px;
	padding-bottom: 16px;
	border-bottom: 1px solid #EEEEEE;
}
.qaArea__listInner:not(:first-child){
	padding-top: 24px;
}

.qaArea__listInnerTouchArea{
	position: relative;
}

.qaArea__listInnerTouchArea:after{
	content: "";
	position: absolute;
	z-index: -1;
	width: 24px;
	height: 24px;
	background: url("../images/arrow.svg") no-repeat right top 2px;
  top: 2px;
	right: 0;
	transform: rotate(180deg);
	transition:  0.2s;
}
.qaArea__listInnerTouchArea.open:after{
	transform: rotate(360deg);
	transition:  0.2s;
}


.qaArea__listInnerQuestion{
	background: url("../images/iconQ.svg") no-repeat left top 2px;
	background-size:24px 24px;
	padding:0 36px 6px;
	font-size: 16px;
	color:#606060;
}
.qaArea__listInnerAnswer{
	display: none;
	background: url("../images/iconA.svg") no-repeat left top 2px;
	margin-top: 6px;
	background-size:24px 24px;
	padding:0 0 0 36px;
	font-size: 16px;
	color:#606060;
}

.qaArea__listInnerAnswerTitle{
	padding-top: 2px;
	padding-bottom: 2px;
}

.qaArea__listInnerAnswerText{
	margin-top: 8px;
	color:#909090;
	font-size: 14px;
}
.qaArea__listInnerAnswerTextInner{
	display: block;
	margin-top: 8px;
}

.qaArea__subText{
	margin-top: 24px;
	margin-left: 8px;
	font-size: 16px;
	color:#606060;
}



/****************************
	終了対応
****************************/

.campaignEndModule{
    text-align: center;
}
.campaignEndModule_inner{
    font-size: 16px;
    padding: 4px 8px;
    border: 1px solid #FD5C5C;
    color: #FD5C5C;
    font-weight: bold;
    max-width: 770px;
    margin: 0 auto 20px;
}