@charset "UTF-8";
/* CSS Document */



.ul_pagetitle--ca              { font-size: 5vw; text-align: center; color: #795a1c; line-height: 1; margin-bottom: 2.5vw; }


.section__dlc                 { max-width: 960px;  margin: 5% auto 0; padding: 0 5%; }

.section__dlc h2                { font-size: 3vw; text-align: center; color: #795a1c; line-height: 1.4; margin-bottom: 1.5vw; letter-spacing: -0.05em; }


.inner_contents_title {
  position: relative;
  -webkit-transform: translate(0%, 0%); /* Safari用 */
  transform: translate(0%, 0%);

  
  padding-left: 1.5em;
  margin-right: 0;
   /* margin-left: 2em; */ /* lo chg */
}



.dlcitem--wrapper       { padding: 5% 0; }

.date               { display: inline-block; width: 12em; box-sizing: border-box; text-align: center; font-size: 130%;
  background-color: #795a1c; color: #fff; padding: 0.4em 0.4em; margin-right: 0.1em; line-height: 1.0; text-indent: 0;}

.date-end           { background-color: hsl(0, 0%, 22%); width: 5.6em; padding: 0.4em 0.2em; }

.benef              { font-size: 130%; width: 12em; display: block; text-align: center; box-sizing: border-box;
  background-color: hsla(0, 0%, 100%, 0.5); color: #795a1c;  padding: 0.4em 0.4em ; line-height: 1.0; text-indent: 0;}

.dlcitem .update_patch    { margin-bottom: 0; }           


.inner_contents_title       { margin: 2.0em auto; }


.dlc-img                    { margin: 2em auto; }
 


.dlc-captch         { color: #795a1c; font-size: 2.4em; margin-bottom: 0.5em; }

.dlc-body           { font-size: 1.5em; margin-bottom: 1.5em; }


.dlcitem li         { list-style-type: none; margin-left: 1em; text-indent: -1em; }
.dlcitem li.limit   { font-weight: bold; }


.dlc-table        { border-collapse: separate; border-spacing: 0px 6px; border: none; margin-bottom: 1.5em; width: 100%; }

.dlc-table tr       { margin-bottom: 0.25em;  }
.dlc-table th       { background-color: hsl(41, 27%, 42%); color: #fff; width: 20%; text-align: center;  }
.dlc-table td       { background-color: #e1ded9; }


.dlc-table h5       {  font-size: 1.2em;   }

.dlc-table p       { text-indent: 0;   }

.dic-btn-wrap .buybtn-img      { margin: 0 auto; }



.genre_selector_wrapper-cl        { display: none; }

input[type="radio"]       {  display: none; }




.tab_area label {
  box-sizing: border-box;
  margin: 0 0.5em 0.5em 0.5em;
  display: inline-block;
  padding: 1em 0;
  color: hsl(0, 0%, 100%);
  background: #79591c;
  text-align: center;
  font-size: 100%;
  cursor: pointer;

  width: 15%;
  letter-spacing: 0;
  border-radius: 0.5em;
/*
  border: 1px solid hsl(0, 100%, 17%);
  border-top: 2px solid  hsl(0, 100%, 17%);
  border-bottom: 2px solid  hsl(0, 100%, 17%); */
}


.tab_area               { justify-content: center; margin: 3em auto; }

.tab_area .tab1_label    { /* margin-left: 0; */ }


#tab1:checked ~ .tab_area .tab1_label,
#tab2:checked ~ .tab_area .tab2_label,
#tab3:checked ~ .tab_area .tab3_label,
#tab4:checked ~ .tab_area .tab4_label,
#tab5:checked ~ .tab_area .tab5_label,
#tab6:checked ~ .tab_area .tab6_label {
  background: hsl(0, 91%, 23%);  color: #fff;
}


.genre_selector_wrapper-cl      { margin-bottom: 2%; }



.btn_area_wrapper         { justify-content: center; margin-top: 1em; }

.dlc_btn_wrap             { box-sizing: border-box; padding: 0 5px;  }

.dlc_shop--btn {
  font-family: "Noto Serif JP", serif ;
  background: #aa2216;
  color: #fff;
  display: block;
  margin: 0.5em auto ;
  max-width: 14em;
  text-align: center;
  border-radius: 1.5em;
  padding: 1em 0.5em;
  line-height: 1;
  position: relative;
  font-size: 0.9em;
}









img     { }


.multi--wrap            {}

.multi--wrap .blk_wrap                        { margin: 0 0 3em 0;  }
.multi--wrap .blk_wrap .thn_blk                       { margin: 0 2%;  }
.multi--wrap .blk_wrap:nth-child( 2n+1 ) .thn_blk           { margin-left: 0; }
.multi--wrap .blk_wrap:nth-child( 2n ) .thn_blk            { margin-right: 0; }


.multi--wrap .blk_wrap.first_l_new             { margin-top: -1.5em; }


.attention--wrap        { margin: 5vh auto; width: 95%; }
.attention              {  }
.attention li             { list-style: none; text-indent: -1em; margin-left: 1em; margin-bottom: 0.5em; }


hr.spacer           { border: none; margin: 8% auto; }


.thn_blk a        { display: block; }


body.movie .update_patch     { margin-bottom: 0.5em;  }

body.movie .update_patch.no_update     { background: none; }

.section__extra-0 {
  margin-bottom: 20vh;
}


.mov_box {
  width: 100%;
  max-width: 768px; margin: 0 auto 6vh; }

  .mov_box .mov_box-caption     { width: 98%; }


 .text__btn {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: 5% auto 1%;
}


.btn-defaultstyle--products {
  position: relative;
  overflow: hidden;
  display: block;
  padding: 20px 18px;
  color: #fff;
  width: 100%;
  background: #be0006;
  box-sizing: border-box;
  text-align: center;
}

 .text__btn a {
  width: 49.5%;
  margin: 0 1% 1% 0;
}

 .text__btn a {
  max-width: 40%;
}

.btn-defaultstyle--products[target="_blank"]:after {
  content: '';
  display: inline-block;
  vertical-align: bottom;
  width: 20px;
  height: 20px;
  background: url(https://www.gamecity.ne.jp/img/common/icon-outbound-w.svg) no-repeat center/contain;
  margin-left: 4px;
}



@media screen and (min-width: 1280px) {
  .ul_pagetitle--ca                { font-size: 64px; }
  .section__movie h2               { font-size: 41px;  }
  .section__movie .caption         { font-size: 21px;  }

}


@media screen and (max-width: 769px) {



  .benef,
  .date               { font-size: 100%; }

  .dlc-captch         { font-size: 6.0vw; }

  .dlc-body           { font-size: 3.5vw; }

  .dlc-table th       { font-size: 3.0vw;}
  .dlc-table td       { font-size: 3.0vw;}

  .dlc-table h5       {  font-size: 3.5vw;  }

  .multi--wrap .blk_wrap .thn_blk                       { margin: 0;  }

  .ul_pagetitle--ca                { font-size: 7vw; }
  .section__movie h2               { font-size: 4.5vw;  }
  .section__movie .caption         {  font-size: 3.2vw; }


  .btn-defaultstyle--products {
    padding: 5vw 4vw;
    margin: 0 2% 0 0;
    font-size: 80%;
}

.text__btn a {
  max-width: 80%;
  width: 80%;
}

.dlc_shop--btn { max-width: 100%; }




  
}