@charset 'Shift_JIS';
/************************************************************************************
*  ysx section
************************************************************************************/
body {
    position: relative;
    background-color: white;
}

article.ysx {      
    background-image: url(../../img/sp/bg_small.png);
    background-repeat-x: repeat;
    background-size: 100%;
    display: block;
    width: 100%;
    background-color: white;
    color: black;
}



.ysx p + p {
    margin-top: calc(24/640*100vw);
}

.ysx img {
    display: block;
    position: relative;
    width: auto;
    max-width: 100%;
    height: auto;
    margin: 0 auto;
}


.cta_btn{          
    position: relative;
}



section {
    position: relative;
    background-position: top center;
    background-repeat: no-repeat;
}

/* mv
-----------------------------------------------------------*/
section.mv {
    height: 0;
    margin-top: 0;
    padding-top: calc(1156/640*100vw);
    overflow: hidden;
    background-image: url('../../img/sp/mv.png');
    background-size: 100%;     
    margin-bottom: calc(100/640*100vw);
}

/* contents cmn
-----------------------------------------------------------*/
.bar {
    margin: 0 auto calc(40*100vw/640);
    width: calc(550*100vw/640);
}

section.-contents {
    margin: 0 auto calc(90/640*100vw);
    width: 100%;
}

.ysx p.contents-about {
    color: #2E1665;              
    font-weight: bold;
    padding: calc(30/640*100vw) 0;
}

p.contents-about strong {
    color: #AE2A41;
    font-weight: bold;
    padding: calc(26/640*100vw) 0;
}

/* items
-----------------------------------------------------------*/
section.items {
    margin-top: calc(40/640*100vw);
}     

itemData_wrapper img {
    width: 100%;
    height: auto;
}

.itemData_wrapper {
    box-sizing: border-box;
    font-weight: bold;
    margin: 0 auto calc(60/640*100vw);
    width: calc(600/640*100vw);
}


.prodact_wrapper > .title {
    margin: 0 calc(10/640*100vw) calc(30/640*100vw);
}

.limited_text {
    background: #BBE3F5;
    padding: calc(30/640*100vw);
    margin-bottom: calc(30/640*100vw);
}

.linkArea {
    text-align: center;
}


.linkArea a img,
.priceArea a img {
    width: calc(400/640*100vw) !important;
}


.prodact_wrapper.-basic {
    margin-top:  calc(30/640*100vw);
}

.prodact_wrapper.-basic li {
    background: #FFFFFF;
    margin-bottom: calc(30/614*100%);
    padding-bottom: calc(60/614*100%);
}

.prodact_wrapper {
    background: #F2F2F2;
    border: 3px solid #254678;
    border-radius: 10px;
    margin: 0 auto;
    overflow: hidden;
    padding: calc(40/640*100vw) 0;   
    width: calc(600*100vw/640);
}

.topText_wrapper {
    background: #2B2048;
    border-radius: calc(10/640*100vw);
    border: 3px solid #A48B59;
    color: #fff;
    font-size: calc(40/640*100vw);
    font-weight: bold;
    text-align: center;
    padding: calc(16/640*100vw);
}
          
.ysx .topText_wrapper p.contents-about {
    color: #2E1665;              
    font-size: calc(30/640*100vw);
    font-weight: bold;
    padding: calc(30/640*100vw) 0;
}

.topText_wrapper p {
    color: #fff;
    font-size: calc(32/640*100vw);
}

.topText_wrapper p.-b {
    font-size: calc(40/640*100vw);
}

.price_col {
    align-items: center;
    padding: calc(50/640*100vw) calc(10/640*100vw);
}

.imgBox {
    padding-bottom: calc(50/640*100vw);
}

.imgBox img {
    width: calc(330/640*100vw);
}

.priceArea .priceTitle {
    color: #FF1500;
}

.priceArea .priceTitle span {
    display: block;
    margin-top: 1.2em;
    color: red;
    font-weight: bold;
}

.priceArea .item_price {
    margin: calc(5/640*100vw) auto calc(20/640*100vw);
    color: red;
}

section.items .cta_btn {
    position: relative;
}

ul.item_notes {
    color: #000000;
    font-size: calc(18/640*100vw);
    font-weight: normal;
    text-indent: -1em;
    padding-left: 1em;
    text-align: left;
    margin: calc(30/640*100vw) auto;
    width: calc(500/640*100vw);
}


.gameconsole {
    width: calc(580/640*100%);
    margin: 0 auto;
}

.gameconsole li + li {
    margin-top: calc(80/614*100%);
}
.gameconsole li h3 {
    font-size: calc(32/640*100vw);
    font-weight: bold;
    line-height: calc(72/32);
    text-align: center;
}

.gameconsole li:nth-of-type(1) h3 {
    color: #FFFFFF;
    background: #FF000C;
}

.gameconsole li:nth-of-type(2) h3 {
    background: #E3E3E3;
}

.gameconsole li:nth-of-type(3) h3 {
    color: #FFFFFF;
    background: #0033CC;
}

.gameconsole li .-flex {
    margin-top: calc(50/614*100%);
}

.gameconsole li .product {
    margin: 0 auto;
}

.gameconsole li:nth-of-type(1) .product {
    width: calc(279/614*100%);
}

.gameconsole li:nth-of-type(2) .product {
    width: calc(325/614*100%);
}

.gameconsole li:nth-of-type(3) .product {
    width: calc(320/614*100%);
}


.item-notes {
    width: calc(600*100vw/640);
    margin: calc(20/640*100%) auto;
    color: #284879;
}


.item-notes p {
    font-weight: bold;
}

.item-notes ul li:before {
    content: "��";
}

.item-notes ul li {
    font-size: calc(12/375*100vw);
    text-indent: -1em;
    padding-left: 1em;
}


/* contents
-----------------------------------------------------------*/


.contents{
  color:#254678;
    margin-top: calc(120/640*100%);

}

.contents + .contents{     
    margin-top: calc(120/640*100%);

}                   

.movie .title {
    width: calc(254/640*100%);
    margin: 0 auto calc(30/640*100%);
}

.prologue .title {
    width: calc(415/640*100%);
    margin: 0 auto calc(30/640*100%);
}

.mocharactervie .title {
    width: calc(415/640*100%);
    margin: 0 auto calc(30/640*100%);
}

.system .title {
    width: calc(415/640*100%);
    margin: 0 auto calc(30/640*100%);
}

                         
/* prologue
-----------------------------------------------------------*/
.prologue_about {
    text-align: center;
    font-weight: bold;
}


/* movie
-----------------------------------------------------------*/
.movie .movie_box {
    margin: 0;
    padding: calc(20*100vw/640) 0;
    text-align: center;
    background-image: url(../../img/pc/mv_bg.png);
    display: block;
    background-position: center;
    background-repeat: no-repeat;
}

/* charactors
-----------------------------------------------------------*/

p.charactor_text.contents-about strong {
    color: #2E1665;
}


.character  .about {
    margin: calc(40*100vw/640) auto calc(60*100vw/640);
    width: calc(600*100vw/640);
}


/* system 
-----------------------------------------------------------*/
p.system_note {
    font-size: calc(14/640*100vw);
    padding-top: calc(15/640*100vw);
    text-align: center;
}


.system_subtitle {
    width: calc(600*100vw/640); 
    margin: calc(30/640*100vw) auto 0;
}

.system_subcatch {     
    font-weight:bold;
    margin: calc(30/640*100vw) auto 0;
    width: calc(600*100vw/640);
}

.sysytem_text{
    margin: calc(30/640*100vw) auto 0;
}

.sysytem_imgCon {
    width: calc(550/640*100%);
    margin: calc(60/640*100vw) auto;
}


.sysytem_text span {
    color: #DA6A38;
}

/* cta_btn bottom
-----------------------------------------------------------*/
section.cta_btn_bottom {
    margin: calc(80/640*100vw) 0;
    text-align: center;
}

section.cta_btn_bottom .cta_btn {
    position: relative;
}

/* inner footer
-----------------------------------------------------------*/
section.inner_footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-content: center;
    align-items: center;
    margin: 0;
    background-image: url(../../img/sp/footer.png);
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-content: center;
    align-items: center;
    padding: 0;     
    background-size: contain;
    background-repeat-x: inherit;
}

section.inner_footer p {
    width: 100%;
    color: white;
    font-size: calc(16/640*100vw);
    padding: calc(30/640*100vw) calc(40/640*100vw) calc(80/640*100vw);
    text-align: center;
}