h4{  margin-bottom:1rem; text-align:center; }

.txt_y{  color:#ffff00; }

/*  .howtoplay  */
.howtoplay{
  /*border:1px dashed #ff8800;*/
  padding:3rem 8rem;
  line-height:200%;
  background:url(../images/special2024/img_bg01-pc.png) 100% 100% / cover;
  background-position:bottom;
  background-repeat:no-repeat;
  width:100%;
  color:#ffffff;
}
.howtoplay ul{
  margin-top:1rem;
  margin-bottom:2rem;
  list-style-type: none;
  margin-left:2rem;
}
.howtoplay ul li:before {
  content: '★';
  margin-left:-2rem;
  color:#ffff00;
}

/*  .presentbox  */
.presentbox{
  /*border:1px dashed #00ff00;*/
  padding:2rem 2rem 2rem 0;
  display: flex;
  flex-flow: row wrap;
  line-height:150%;
  border-radius:1rem;
  background-color:#262626;
  color:#ffffff;
}

.presentbox .left{
  /*border:1px dashed #ff8800;*/
  flex-basis:40%;
  position: relative;
}
.presentbox .point{
  /*border:1px dashed #ff0000;*/
  font-size:2rem;
  line-height:100%;
}
.presentbox .point .pInner{
  /*border:1px dashed #00ff00;*/
  display:inline;
  position:absolute;
  margin-top:1.5rem;
}
.presentbox .point::before{
  content: "";
  display: inline-block;
  background: url(../images/special2024/img_present_B.png) 100% 100% / cover;
  background-repeat:no-repeat;
  height: 4rem;
  width: 10rem;
  margin-right:1.5rem;
}
.presentbox .item{
  /*border:1px dashed #0000ff;*/
  padding:2rem 2.5rem;
  font-size:2.5rem;
  line-height:130%;
}
.presentbox .number{
  /*border:1px dashed #ffff00;*/
  margin-top:1rem;
  padding:0 2.5rem;
  color:#ffff00;
  font-size:2rem;
  font-weight:700;
  position: absolute;
  bottom: 0;
}
.presentbox .number .num{
  font-size:3rem;
}
.C_number, .D_number{
  right: 0;
}
.presentB .point::before{
  background: url(../images/special2025/img_present_A.png) 100% 100% / cover;
  background-repeat:no-repeat;
}
.presentC .point::before{
  background: url(../images/special2025/img_present_C.png) 100% 100% / cover;
  background-repeat:no-repeat;
}
.presentD .point::before{
  background: url(../images/special2025/img_present_D.png) 100% 100% / cover;
  background-repeat:no-repeat;
}
.presentE .point::before{
  background: url(../images/special2025/img_present_E.png) 100% 100% / cover;
  background-repeat:no-repeat;
}

.presentbox .right{
  /*border:1px dashed #00ffff;*/
  flex-basis:60%;
  position: relative;
}

.presentB .right .wrapper{
  display: flex;
  flex-flow: row wrap;
}
.presentB .right .wrapper div{
  flex-basis:48%;
  margin:0.3rem;
}

.presentbox .bottom{
  /*border:1px dashed #00ff00;*/
  flex-basis:100%;
  padding:2rem;
}
.presentbox .bottom a{
  display:inline;
  color:#ef0100;
  text-decoration:underline;
}

.presentbox .info{
  /*border:1px dashed #00ff00;*/
  flex-basis:100%;
  text-align:center;
  padding:2rem 0 0;
  margin-left:2rem;
  border-top:3px solid #000000;
}
.presentbox .info a{
  text-decoration:none;
  color:#ef0100;
  font-weight:700;
}

/* スクリーンサイズが767px以下の場合に適用 */
@media screen and (max-width: 767px) {
  
  .howtoplay{
    background:url(../images/special2024/img_bg01-sp.png) 100% 100% / cover;
  }
  
  .presentbox .point .pInner{
    /*border:1px dashed #00ff00;*/
    top:4.5rem;
    left:2rem;
  }
  
  .presentbox .item{
    margin-top:4rem;
  }
  
  .presentB .right .wrapper div{
    flex-basis:98%;
  }

}


/*  collaboration  */
.collaboration_box{
    position: relative;
    padding: 9rem 4rem;
    position: relative;
    width: 100%;
    margin: 0 auto;
    color: #8c0010;
    background-image: -webkit-linear-gradient(left, transparent, #000 5%, #000 95%, transparent);
    background-image: linear-gradient(to right, transparent, #000 5%, #000 95%, transparent);
    width: calc(670 / 750 * 100%);
    margin-bottom: 9rem;
}
.collaboration_box::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 2px;
    margin: 0 auto;
    text-align: center;
    background-image: -webkit-linear-gradient(left, transparent, #8c0010 10%, #8c0010 90%, transparent);
    background-image: linear-gradient(to right, transparent, #8c0010 10%, #8c0010 90%, transparent);
    background-position: center;
    background-repeat: no-repeat;
}
.collaboration_box::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 2px;
    margin: 0 auto;
    text-align: center;
    background-image: -webkit-linear-gradient(left, transparent, #8c0010 10%, #8c0010 90%, transparent);
    background-image: linear-gradient(to right, transparent, #8c0010 10%, #8c0010 90%, transparent);
    background-position: center;
    background-repeat: no-repeat;
}
.collaboration_box h3{
  width: calc(142 / 1600 * 100%);
  margin-left: auto;
  margin-right: auto;

}
.collaboration_box p{
  color: #e2e2e2;
  line-height: 150%;
  padding: 2rem;
  text-align: center;
  margin-bottom: 1em;
}

.text_logo{
    display: inline-block !important;
  width: calc(142 / 870 * 100%) !important;
}


.collaboration_box h4{
  font-size: 3.2rem;
  font-weight: bold;
  padding: 0.5em 0;
  margin: 2em auto 1em;
  color: #000;
  background-image: linear-gradient(to right, transparent, #aa160e 5%, #aa160e 95%, transparent);
}

@media screen and (max-width: 767px) {
/*  collaboration  */
.collaboration_box{
  position: relative;
  padding: 9rem 4rem;
  width: 100%;
}
.collaboration_box::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 2px;
    margin: 0 auto;
    text-align: center;
    background-image: -webkit-linear-gradient(left, transparent, #8c0010 10%, #8c0010 90%, transparent);
    background-image: linear-gradient(to right, transparent, #8c0010 10%, #8c0010 90%, transparent);
    background-position: center;
    background-repeat: no-repeat;
}
.collaboration_box h3{
  width: calc(539 / 750 * 100%);
  margin-left: auto;
  margin-right: auto;

}
.collaboration_box p{
  color: #e2e2e2;
  line-height: 150%;
  padding: 2rem;
}

.text_logo{
    display: inline-block !important;
    width: calc(295 / 750 * 100%) !important;
}

}