@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:100,300,400,500,700,900');
/*------------------------------------base*/
body{
font-family: 'Noto Sans JP', sans-serif;
font-size:100%
-webkit-text-size-adjust: none;
margin:0;
background: #930000;
background: -moz-linear-gradient(left,  #930000 0%, #d10000 35%, #d10000 65%, #930000 100%);
background: -webkit-linear-gradient(left,  #930000 0%,#d10000 35%,#d10000 65%,#930000 100%);
background: linear-gradient(to right,  #930000 0%,#d10000 35%,#d10000 65%,#930000 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#930000', endColorstr='#930000',GradientType=1 );

}
* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}


.inner{	padding: 0;	margin: 0 auto;}
.inner66{width:66%;	padding: 0;	margin: 0 auto;}
.inner80{width:80%;	padding: 0;	margin: 0 auto;}
.inner86{width:86%;	padding: 0;	margin: 0 auto;}
.inner90{width:90%;	padding: 0;	margin: 0 auto;}
.item{position:relative;margin:0 0 1.25em 0;}



.center{text-align: center;}
.flex{display:flex;justify-content: center;flex-flow:row wrap;}
.bg_white{	background: #fff;}
.bg_red{	background: #d10015;}
.bg_gold{	background: #ecd680;}
.red{color:#b90015}
.bold500{font-weight:500;}
.notice{text-align:center;color:#fff;font-size:85%;}

span.largetext{font-size:123%;font-weight:500;display:block;text-align: center;margin:0 0 0.5em 0;}
span.largetext_btm{font-size:85%;font-weight:500;display:block;text-align: center;}
.smallfont{font-size:80%;}


img{width:100%;height:auto;}
a{transition: 0.2s;color:#0071ba; display:block;}
a:hover{opacity:0.6;}

.flex{display:flex; justify-content: space-between; flex-flow:row wrap;}



@media screen and (max-width: 320px) {
.notice{font-size:75%;}
span.largetext_btm{font-size:80%;}
}


/* アスタリスク　注釈用 */
ul.ast {	list-style: none;font-size: 90%;line-height: 120%;margin: 10px 0 0 0;text-align: left;}
ul.ast li {	margin: 0 0 5px 0;	padding-left: 1em;	text-indent: -1em;}
ul.ast li:before {	content: "\203b";	color: #000;}
ul.ast li.red:before {	content: "\203b";	color: #f00;}


/*まる数字のスタイル*/
ol.num {
  counter-reset: my-counter;
  list-style: none;
  padding: 0;
  margin: 0 0 0.5em 0;
}
ol.num li {
font-size:111%;
  line-height: 1.5;
  padding-left: 1.25em;
  position: relative;
}
ol.num li:before {
  content: counter(my-counter);
  counter-increment: my-counter;
  border: 1px solid #000; 
  border-radius: 50%;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 17px;
  width: 17px;
  font-size: 70%;
	font-weight:500;
  line-height: 1;
  position: absolute;
  top: 0.45em;
  left: 0;
}


@keyframes delay {
0% {
    opacity: 0;

  }   
    
 50% {
    opacity: 0;

  }
  
  100% {
    opacity: 1;
  }
}
.delay {
  animation-name: delay;
  animation-duration: 1s;
  animation-timing-function: ease-out;
  animation-fill-mode:  forwards;

}

/*境界*/
.border01{height:30px; background: url(../img/border01.png) repeat-x center top;
/*transform: scale(1, -1);*/
-moz-background-size:cover;
-webkit-background-size:cover;
-o-background-size:cover;
-ms-background-size:cover;
background-size:cover;	
}


/*メニュー要素の出現アニメ*/

.fadein { opacity: 0;  transition: 1s;}
.fadein.is-show {  opacity: 1;}



/*右から*/
.fadein_right {  opacity: 0;  transform: translate(0, 20%);  transition: 1s;}
.fadein_right.is-show {  transform: translate(0, 0);  opacity: 1;}

/*左から*/
.fadein_left {  opacity: 0;  transform: translate(-88%, 0);  transition: 3s;

  animation-name: delay;
  animation-duration: 3s;
  animation-timing-function: ease-out;
  animation-fill-mode:  forwards;

}
.fadein_left.is-show {  transform: translate(0, 0);  opacity: 1;




}

/*下から*/
.fadein_up {  opacity: 0;  transform: translate(0, 10%);  transition: 1s;}
.fadein_up.is-show {  transform: translate(0, 0);  opacity: 1;}


/*上から*/
.fadein_down {  opacity: 0;  transform: translate(0, -50%);  transition: 1s;}
.fadein_down.is-show {  transform: translate(0, 0);  opacity: 1;}


/*------------------------------------*/

header{ display:block;position: relative;}
h2{width:86%;margin:0 auto 2em auto;}

/*upper*/
#header_upper{padding:0.25em;position: absolute;margin:auto;left:0;right:0;top:0;z-index: 1}
#header_upper .inner{justify-content: space-between;z-index:1;}
#logo{flex-basis:16%;}
#headersns{flex-basis:80%;text-align: right;}
#headersns ul{display:flex;justify-content: flex-end;flex-flow:row wrap; align-items: center;}
#headersns li.icon {flex-basis:7%;margin:0 3px 0 0}
#headersns li.headline{flex-basis:60%;line-height: 1;}


/*header_main*/
#header_main{margin:0; padding:0; position: relative;}
#header_main .copy{position: absolute;width:5%;top:15%;right:10%;}
#header_main h1{position: absolute;width:80%;bottom:15%;left:0;right:0;margin:auto;}
#header_main .kikan{position: absolute;width:70%;bottom:1%;left:0;right:0;margin:auto;}


/*navi*/
#navi{padding:0.5em 1em;}
#navi li{flex-basis:31%;text-align: center;}
#navi li a{ background: #000; color:#fff;font-weight:700; text-decoration: none;padding:0.5em;
border:2px double #bf0100;
box-shadow: 0 0 0 1px #000;
}

/*upper_bnr*/
#upper_bnr{margin:0 0 1.5em 0;}
#upper_bnr a{margin:0 0 0.5em 0;}
#upper_bnr .hukidasi{width:55%;margin:auto;}
#upper_bnr .ended{margin:0 0 0.5em 0;text-align: center;
	background: #fff;
    font-size: 100%;
    color: #bf0100;
    font-weight: 700;
    text-decoration: none;
    padding: 0.375em 0;
    border: 2px double #bf0100;
    box-shadow: 0 0 0 1px #fff;}

.entry_ended{margin:auto; background: #000;font-size:122%;border-radius:0.5em;color:#fff;text-align: center;padding:0.5em;}

/*goods*/
#goods{margin:0 0 2em 0;position: relative;}


/*prize*/
#prize{margin:0 0 2em 0;position: relative;}
#prize .bnr_start{width:90%;margin:auto; position: absolute;bottom:6%;left:0;right:0;}
#prize .tw_forrow{width:80%;margin:auto; position: absolute;bottom:21%;left:0;right:0;}
/*#prize .tw_retweet{width:60%;margin:auto; position: absolute;bottom:12%;left:0;right:0;}*/
#prize .tw_koteitweet{width:85%;margin:auto; position: absolute;bottom:14%;left:0;right:0;}
#prize .oubokiyaku{width:30px;margin:auto; position: absolute;bottom:6.5%;left:18%; }
#prize .oubokiyaku a{height:0.75em}
#prize .tw_everyday{width:28%;margin:auto; position: absolute;top:-2%;left:-3%;}

/*oubo*/
#oubo{margin:0 0 2em 0;position: relative;}
#oubo .inner{width:94%;margin:auto; position: relative;}
#oubo .step_detail{width:90%;margin:auto; position:absolute;top:25%;left:0;right:0;}
#oubo .step_detail .btn_login{width:50%;margin:auto; position:absolute;bottom:5%;left:28%;}
#oubo .step_detail .step{position:relative;left:-2.5%;}
#oubo .step_detail a.here{width:20%;height:1em; position:absolute;top:38%;left:10%; display:block;}

/*clubjra*/
#clubjra{margin:2em 0 4em 0;position: relative;}

/*Q&A*/
#qa{margin:0;position: relative;}
#qa .qawrap{ }
#qa .qawrap p{margin:0 0 1em 0;}
#qa .qawrap a{display:inline-block;}
#qa dt{display:flex;justify-content:flex-start;flex-flow: row nowrap;margin:0 0 0.5em 0;position:relative;}
#qa dt:after{content:"\25bc";position: absolute;right:0;border:1px solid #fff;border-radius:50%;font-size:80%;padding:0.25em;line-height: 1.2;}
#qa dt.active:after{content:"\25b2";border:1px solid #EDE809;color:#EDE809}
#qa dt .icon{flex-basis:8%;margin:0 2% 0 0;}
#qa dt .text{flex-basis:80%;}
#qa dd{display:none; border-bottom:1px solid #fff;margin: 1em 0;font-size:80%;}
#qa dt.active + dd{display:block;}
#qa dd .icon{width:8%;display:inline-block;vertical-align: top;margin:0 2% 0 0;}
#qa dd .text{width:88%;display:inline-block;vertical-align: top;}

#qa .qatab{margin:0 1em 1em 1em;width:;}
#qa .qatab li{flex-basis: 19%; padding:0.25em 0;font-size:90%;color:#fff;border:3px double #fff;text-align: center;transition: 0.2s; display:flex;align-items: center;justify-content: center;}
#qa .qatab li.qatab_current{color:#c00;border:3px double #f00;background: #fff;}
#qa .qatab li:hover{cursor: pointer;opacity: 0.5;}
#qa .qatabcontents{background: rgba(41,0,0,0.7);padding:1em;font-size:90%;color:#fff;margin:0 1em;}
#qa .qatabcontents dl{display:none;}
#qa .qatabcontents dl.all{display:block;}

#goods .bg01{position: absolute;top:-24%;z-index: -1}
#prize .bg02{position: absolute;top:-6.5%;z-index: -1}
#prize .bg03{position: absolute;top:12%;z-index: -1}
#prize .bg04{position: absolute;top:44%;z-index: -1}
#prize .bg05{position: absolute;top:77%;z-index: -1}
#oubo .bg06{position: absolute;top:-2%;z-index: -1}
#clubjra .bg07{position: absolute;top:-22%;z-index: -1}
#qa .bg08{position: absolute;top:-14%;z-index: -1}
#qa .bg09{position: absolute;top:50%;z-index: -1}
#footer_derby .bg10{position: absolute;top:18%;z-index: -1}

/*shodoka_info*/
#shodoka_info{margin:0;}

/*footer_derby*/
#footer_derby{position:relative;top:-2em;margin:0 0 -1em 0}
#footer_derby .item.entry{margin:2em 0;}
#footer_derby .item.kikan{margin:0 0 4em 0;}
#footer_derby .item.ftbnr{margin:0 0 0.5em 0;}


/* footer
================================================== */
footer{
padding:1em 0.5em 3em 0.5em;
text-align: center;
	color:#fff;
}
#footerlogo{width:22%;margin:0 auto 0.5em auto;}
#copyright{font-size: 70%;}


#totop {z-index: 100;
    position: fixed;
    bottom:0em;
    right: 1em;
}
#totop a {
    width: 40px;
    display: block;
}