.hidden_box {
    /* top: 90%; */
    left: 0;
    right: 0;
    margin: auto;
    padding: 0px 0px 29px 0px;
    z-index: 999;
    /* position: absolute; */
}

/*ボタン装飾*/
.hidden_box label {
    padding: 15px;
    font-weight: bold;
    border: solid 2px #870001;
    color: #fff;
    cursor: pointer;
    background: #bf0001;
}

/*ボタンホバー時*/
.hidden_box label:hover {
    background: #870001;
}

/*チェックは見えなくする*/
.hidden_box input {
    display: none;
}

/*中身を非表示にしておく*/
.hidden_box .hidden_show {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.8s;
}

/*クリックで中身表示*/
.hidden_box input:checked ~ .hidden_show {
    padding: 23px 0;
    height: auto;
    opacity: 1;
}



.rakuten_navi {
    position: absolute;
    top: 23%;
    right: 0;
    left: 0;
    margin: auto;
    width: 52%;
}
.rakuten_coment1 {
    position: absolute;
    top: 7%;
    left: 3%;
    margin: auto;
    width: 52%;
}

.rakuten_coment2 {
    position: absolute;
    top: 10%;
    right: 3%;
    margin: auto;
    width: 40%;
}

.rakuten_navi2 {
    position: absolute;
    top: 49%;
    left: 0;
    right: 0;
    margin: auto;
    width: 86%;
}

.rakuten_navi3 {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    margin: auto;
    width: 92%;
}

.rakuten_navi4 {
    position: absolute;
    top: 3%;
    left: 0;
    right: 0;
    margin: auto;
    width: 83%;
}

.rakuten_navi5 {
    position: absolute;
    top: 13%;
    left: 0;
    right: 0;
    margin: auto;
    width: 100%;
}



.rakuten_navi6 {
    position: absolute;
    top: 12%;
    left: 0;
    right: 0;
    margin: auto;
    /* width: 102%; */
}

.rakuten_navi7 {
    position: absolute;
    top: 3%;
    left: 0;
    right: 0;
    margin: auto;
    width: 74%;
}



.rakuten_navi8 {
    position: absolute;
    top: 40%;
    left: 0;
    right: 0;
    margin: auto;
    width: 23%;
}

.rakuten_navi9 {
    position: absolute;
    top: 66%;
    left: 0;
    right: 0;
    margin: auto;
    width: 95%;
}

.rakuten_navi10 {
    position: absolute;
    top: 6%;
    left: 0;
    right: 0;
    margin: auto;
    width: 83%;
}


.rakuten_navi11 {
    position: absolute;
    top: 48%;
    left: 0;
    right: 0;
    margin: auto;
    width: 87%;
}

.rakuten_navi12 {
    position: absolute;
    top: 4%;
    left: 0;
    right: 0;
    margin: auto;
    width: 80%;
}

.rakuten_navi13 {
    position: absolute;
    top: 18%;
    left: 0;
    right: 0;
    margin: auto;
    width: 80%;
}

.rakuten_navi14 {
    position: absolute;
    top: 41%;
    left: 0;
    right: 0;
    margin: auto;
    width: 80%;
}

.rakuten_navi15 {
    position: absolute;
    top: 63%;
    left: 0;
    right: 0;
    margin: auto;
    width: 80%;
}


.rakuten_navi16 {
    position: absolute;
    top: 35%;
    left: 0;
    right: 0;
    margin: auto;
    width: 88%;
}

.rakuten_navi17 {
    position: absolute;
    top: 8%;
    left: 0;
    right: 0;
    margin: auto;
    width: 78%;
}

.rakuten_navi18 {
    position: absolute;
    top: 52%;
    left: 0;
    right: 0;
    margin: auto;
    width: 23%;
}

.rakuten_toroku {
    position: absolute;
    top: 70%;
    left: 0;
    right: 0;
    margin: auto;
    width: 93%;
    z-index: 9999;
}


.rakuten_step1 {
    position: absolute;
    top: 23%;
    left: 1%;
    margin: auto;
    width: 31%;
}
.rakuten_step2 {
    position: absolute;
    top: 23%;
    left: 34.5%;
    margin: auto;
    width: 31%;
}

.rakuten_step3 {
    position: absolute;
    top: 23%;
    left: 68%;
    margin: auto;
    width: 31%;
}


.rakuten_step4 {
    position: absolute;
    top: 52%;
    left: 30%;
    margin: auto;
    width: 42%;
}

.rakuten_ft {
    position: absolute;
    top: 0%;
    right: 5.5%;
    margin: auto;
    font-size: 2rem;
}

#demo {max-width:640px; margin:0 auto;}

.timer, .timer-1 {
    font-size: 20px;
    font-size: 4rem;
    color: #bf0001;
    font-weight: bold;
}

.timer-2 {
   
    color: #ffffff;
    font-weight: bold;
}

@media (max-width: 320px) {
.timer-2 {
  
    color: #ffffff;
    font-weight: bold;
}

}
.timer-3 {
  
    color: #fff;
    font-weight: bold;
}
.timer div,
.timer-1 div,
.timer-2 div,
.timer-3 div{display:inline-block;}


.timer-title {margin:0 0 4px 0;}

.rakuten_cptimer {
    position: absolute;
    top: 69.5%;
    left: 0;
    right: 0;
    margin: auto;
    /* width: 102%; */
    font-size: 3rem;
}

@media screen and (max-width: 360px) {
   .timer-3 {
    font-size: 40px;
    color: #fff;
    font-weight: bold;
}
.rakuten_cptimer {
    position: absolute;
    top: 71.5%;
    left: 0;
    right: 0;
    margin: auto;
   font-size: 2rem;
}
}
.is-complete {
color:red;
-webkit-animation-name: blinker;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: cubic-bezier(1.0,0,0,1.0);
-webkit-animation-duration: 1s;
}

@-webkit-keyframes blinker {
from { opacity: 1.0; }
to { opacity: 0.0; }
}


.double-flash {
  animation: double-flash_1027 4s ease infinite;
  transform-origin: 50% 50%;
}

@keyframes double-flash_1027 {
  0% { opacity:1 }
  12.5% { opacity:0 }
  25% { opacity:1 }
  37.5% { opacity:0 }
  50% { opacity:1 }
  100% { opacity:1 }
}

.tada {
  animation: tada_3472 3.6s linear infinite;
  transform-origin: 50% 50%;
}

@keyframes tada_3472 {
  0% { transform: scale(1) }
  5.55556% { transform:scale(.9) rotate(-8deg) }
  11.11111% { transform:scale(.9) rotate(-8deg) }
  16.66667% { transform:scale(1.3) rotate(8deg) }
  22.22222% { transform:scale(1.3) rotate(-8deg) }
  27.77778% { transform:scale(1.3) rotate(8deg) }
  33.33333% { transform:scale(1.3) rotate(-8deg) }
  38.88889% { transform:scale(1.3) rotate(8deg) }
  44.44444% { transform:scale(1) rotate(0) }
  100% { transform:scale(1) rotate(0) }
}


.rakuten_curia{
    background: #c00001;
    padding: 5px;
    color: #fff600;
    font-size: 20px;
    text-align: center;
}
@media (max-width: 360px) {
.rakuten_curia {
    background: #c00001;
    padding: 5px;
    color: #fff600;
    font-size: 17px;
    text-align: center;
}
}