html{width :100%; height:100%;}

body{
	font-family: 'Inter', 'Noto Sans JP', sans-serif;
	background: #F8F8F8;
	height:100%;
}

.ec-layoutRole{
	background: #F8F8F8;
	width:100%; margin: 0 auto; position:relative; 
	height:100%; min-height: 100%; height: auto !important;
	padding-bottom:700px;
}


.registration_page .ec-layoutRole{
	padding-bottom:500px;
}

@media screen and (max-width: 767px){
	.registration_page .ec-layoutRole{
		padding-bottom:200px;
	}
	
	
	#page_product_detail .ec-layoutRole,
	#page_prize .ec-layoutRole{
		background: #FFF;
	}
}

.ec-layoutRole__footer{
	position:absolute;
	bottom:0;
	width:100%;
}


@media screen and (min-width: 767px){   
  .pc { display:inline; }
  .sp { display:none; }
}
@media screen and (max-width: 767px){   
  .pc { display:none; }
  .sp { display:inline; }
}

@media screen and (min-width: 768px){
  .bpc { display:block; }
  .bsp { display:none; }  
}
@media screen and (max-width: 767px){
  .bpc { display:none; }
  .bsp { display:block; }
  
  .ec-layoutRole{
	padding-bottom:112px;
  }
}

.fnt1{font-family:'Inter'}
.fnt2{font-family:'Noto Sans JP';}
.fnt3{font-family:sans-serif;}


.fll{float:left;}
.flr{float:right;}

.ml50{margin-left:50px;}
.ml40{margin-left:40px;}
.ml30{margin-left:30px;}
.ml20{margin-left:20px;}
.ml10{margin-left:10px;}
.ml5 {margin-left: 5px;}

.mr50{margin-right:50px;}
.mr40{margin-right:40px;}
.mr30{margin-right:30px;}
.mr20{margin-right:20px;}
.mr10{margin-right:10px;}
.mr5 {margin-right: 5px;}

.mt50{margin-top:50px;}
.mt40{margin-top:40px;}
.mt30{margin-top:30px;}
.mt20{margin-top:20px;}
.mt10{margin-top:10px;}
.mt5 {margin-top: 5px;}

.mb50{margin-bottom:50px;}
.mb40{margin-bottom:40px;}
.mb30{margin-bottom:30px;}
.mb20{margin-bottom:20px;}
.mb10{margin-bottom:10px;}
.mb5 {margin-bottom: 5px;}


.pl50{padding-left:50px;}
.pl40{padding-left:40px;}
.pl30{padding-left:30px;}
.pl20{padding-left:20px;}
.pl10{padding-left:10px;}
.pl5 {padding-left: 5px;}

.pr50{padding-right:50px;}
.pr40{padding-right:40px;}
.pr30{padding-right:30px;}
.pr20{padding-right:20px;}
.pr10{padding-right:10px;}
.pr5 {padding-right: 5px;}

.pt50{padding-top:50px;}
.pt40{padding-top:40px;}
.pt30{padding-top:30px;}
.pt20{padding-top:20px;}
.pt10{padding-top:10px;}
.pt5 {padding-top: 5px;}

.pb50{padding-bottom:50px;}
.pb40{padding-bottom:40px;}
.pb30{padding-bottom:30px;}
.pb20{padding-bottom:20px;}
.pb10{padding-bottom:10px;}
.pb5 {padding-bottom: 5px;}

/*----- テーマ別サイズ -----*/
.ml8 {margin-left: 8px;}
.ml16{margin-left: 16px;}
.ml32{margin-left: 32px;}
.ml64{margin-left: 64px;}

.mr8 {margin-right: 8px;}
.mr16{margin-right: 16px;}
.mr32{margin-right: 32px;}
.mr64{margin-right: 64px;}

.mt8 {margin-top: 8px;}
.mt16{margin-top: 16px;}
.mt32{margin-top: 32px;}
.mt64{margin-top: 64px;}

.mb8 {margin-bottom:8px;}
.mb16{margin-bottom:16px;}
.mb32{margin-bottom:32px;}
.mb64{margin-bottom:64px;}

.pl8 {padding-left: 8px;}
.pl16{padding-left: 16px;}
.pl32{padding-left: 32px;}
.pl64{padding-left: 64px;}

.pr8 {padding-right:8px;}
.pr16{padding-right:16px;}
.pr32{padding-right:32px;}
.pr64{padding-right:64px;}

.pt8 {padding-top:8px;}
.pt16{padding-top:16px;}
.pt32{padding-top:32px;}
.pt64{padding-top:64px;}

.pb8 {padding-bottom:8px;}
.pb16{padding-bottom:16px;}
.pb32{padding-bottom:32px;}
.pb64{padding-bottom:64px;}



.m0{margin:0;}
.p0{padding:0;}

.m10{margin :10px;}
.p10{padding:10px;}

.m20{margin :20px;}
.p20{padding:20px;}

.m30{margin :30px;}
.p30{padding:30px;}

.m40{margin :40px;}
.p40{padding:40px;}

.m50{margin :50px;}
.p60{padding:50px;}

.m010{margin :0 10px;}
.p010{padding:0 10px;}

.m020{margin :0 20px;}
.p020{padding:0 20px;}


.w200{width:200px;}
.w160{width:160px;}
.w150{width:150px;}
.w120{width:120px;}
.w100{width:100px;}
.w90 {width:90px;}
.w60 {width:60px;}
.w50 {width:50px;}

.w100p{width:100%;}
.w90p {width: 90%;}
.w80p {width: 80%;}
.w70p {width: 70%;}
.w60p {width: 60%;}
.w50p {width: 50%;}

.w49p {width: 49%;}
.w48p {width: 48%;}
.w47p {width: 47%;}
.w46p {width: 46%;}
.w45p {width: 45%;}
.w44p {width: 44%;}
.w43p {width: 43%;}
.w42p {width: 42%;}
.w41p {width: 41%;}
.w40p {width: 40%;}

.w30p {width: 30%;}
.w25p {width: 25%;}
.w20p {width: 20%;}
.w10p {width: 10%;}
.w5p  {width:  5%;}


.fz48{font-size:48px;}
.fz32{font-size:32px;}
.fz30{font-size:30px;}
.fz28{font-size:28px;}
.fz26{font-size:26px;}
.fz24{font-size:24px;}
.fz22{font-size:22px;}
.fz20{font-size:20px;}
.fz18{font-size:18px;}
.fz16{font-size:16px;}
.fz14{font-size:14px;}
.fz12{font-size:12px;}
.fz11{font-size:11px;}
.fz10{font-size:10px;}

.tar{text-align:right;}
.tal{text-align:left;}
.tac{text-align:center;}

.fw800{font-weight:800;}
.fw600{font-weight:600;}

.ovh{overflow:hidden;}
.ova{overflow:auto;}

.dsn{display:none;}
.block       {display: block;}
.inline      {display: inline;}
.inline-block{display: inline-block;}

.posr{position:relative;}
.posa{position:absolute;}
.posf{position:fixed;}


/*--- flex ---*/
.dflx_cc{
	/* display        :flex; */
	justify-content:center;
	align-items    :center;
	
	/* display: -webkit-flex; */
	-webkit-justify-content:center;
	-webkit-align-items:center;
}

.dflx_cc_footer{
	display        :flex;
	justify-content:center;
	align-items    :center;
	
	display: -webkit-flex;
	-webkit-justify-content:center;
	-webkit-align-items:center;
}

.dflx_sbc{
	display        :flex;
	justify-content:space-between;
	align-items    :center;
	
	display: -webkit-flex;
	-webkit-justify-content:space-between;
	-webkit-align-items:center;
}

.dflx_sbb{
	display        :flex;
	justify-content:space-between;
	align-items    :baseline;
	
	display: -webkit-flex;
	-webkit-justify-content:space-between;
	-webkit-align-items:baseline;
}

.dflx_sac{
	display        :flex;
	justify-content:space-around;
	align-items    :center;
	
	display: -webkit-flex;
	-webkit-justify-content:space-around;
	-webkit-align-items:center;
}

.dflx_fsfs{
	display        :flex;
	justify-content:flex-start;
	align-items    :flex-start;
	
	display: -webkit-flex;
	-webkit-justify-content:flex-start;
	-webkit-align-items:flex-start;
}

.dflx_fsc{
	display        :flex;
	justify-content:flex-start;
	align-items    :center;
	
	display: -webkit-flex;
	-webkit-justify-content:flex-start;
	-webkit-align-items:center;
}

.dflx_fec{
	display        :flex;
	justify-content:flex-end;
	align-items    :center;
	
	display: -webkit-flex;
	-webkit-justify-content:flex-end;
	-webkit-align-items:center;
}


.dflx_fscw{
        display        :flex;
        justify-content:flex-start;
        align-items    :center;
        flex-wrap      : wrap;

        display: -webkit-flex;
        -webkit-justify-content:flex-start;
        -webkit-align-items:center;
        -webkit-flex-wrap: wrap;
}

.dflx_sbfs{
	display        :flex;
	justify-content:space-between;
	align-items    :flex-start;
	
	display: -webkit-flex;
	-webkit-justify-content:space-between;
	-webkit-align-items:flex-start;
}

.dflx_sbfe{
	display        :flex;
	justify-content:space-between;
	align-items    :flex-end;
	
	display: -webkit-flex;
	-webkit-justify-content:space-between;
	-webkit-align-items:flex-end;
}

.dflx_dc_cc{
	display        :flex;
	flex-direction :column;
	justify-content:center;
	align-items    :center;
	
	display: -webkit-flex;
	-webkit-flex-direction :column;
	-webkit-justify-content:center;
	-webkit-align-items    :center;
}

.dflx_dc_sbfe{
	display        :flex;
	flex-direction :column;
	justify-content:space-between;
	align-items    :flex-end;
	
	display: -webkit-flex;
	-webkit-flex-direction :column;
	-webkit-justify-content:space-between;
	-webkit-align-items:flex-end;
}

.dflx_dc{
	flex-direction :column;
}

.dflx_noshrink{
	flex-shrink: 0;
}