@charset 'Shift_JIS';
body {
    background-color: white;
}

article {
    background-color: #FFF3CC;
    color: black;
}

img {
    display: block;
    width: 100%;
}

/* mv
-----------------------------------------------------------*/
.mainview {
    width: 100%;
    position: relative;
}

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

.product {
    width: calc(520 / 640 * 100vw);
    margin: 0 auto;
    background: #FFF;
    padding: calc(30 / 640 * 100vw);
    position: relative;
}

.product_comment {
    position: absolute;
    top: calc(75 / 640 * 100vw);
    right: calc(-30 / 640 * 100vw);
    width: calc(257 / 640 * 100vw);
    height: auto;
}

.product_title {
    font-size: calc(32 / 640 * 100vw);
    font-weight: bold;
    line-height: calc(40 / 640 * 100vw);
}

.priceList > li {
    background: #FFF;
    padding-bottom: calc(40 / 640 * 100vw);
}

.priceList > li + li {
    margin-top: calc(20 / 640 * 100vw);
}

.priceList_image {
    width: calc(220 / 640 * 100vw);
    display: block;
    margin: 0 auto;
    margin-top: calc(30 / 640 * 100vw);
}

.priceList_detail {
    flex: 1;
}

.priceList_title {
    background: #E4000F;
    color: #FFF;
    font-weight: bold;
    font-size: calc(22 / 640 * 100vw);
    padding: calc(10 / 640 * 100vw) 0;
    padding-left: calc(20 / 640 * 100vw);
    margin-top: calc(20 / 640 * 100vw);
}

.priceList_title.-ps5 {
    background: #D6DCE5;
    color: #000;
}

.priceTitle, .item_price {
    color: #FF1500;
}

.item_price .yen, .item_price .yen::before {
    font-weight: bold;
}

.priceTitle {
    font-weight: bold;
    font-size: calc(24 / 640 * 100vw);
    margin-top: calc(25 / 640 * 100vw);
    margin-bottom: calc(10 / 640 * 100vw);
    text-align: center;
}

.item_price {
    margin-bottom: calc(20 / 640 * 100vw);
}

.item_price .price_font {
    font-size: calc(110 / 640 * 100vw);
    letter-spacing: calc(-5 / 640 * 100vw);
}

.item_price .yen {
    font-size: calc(52 / 640 * 100vw);
    display: inline-block;
    margin-left: calc(10 / 640 * 100vw);
}

.item_price .yen::before {
    font-weight: bold;
    top: calc(-25 / 640 * 100vw);
    left: calc(-4 / 640 * 100vw);
}

.cta_btn {
    position: static;
    width: calc(390 / 640 * 100vw);
    display: block;
    margin: 0 auto;
}

.cta_btn > img {
    width: 100% !important;
}

/* movie
-----------------------------------------------------------*/
.movie {
    width: calc(580 / 640 * 100vw);
    margin: 0 auto;
}

/* �w�i�摜
-----------------------------------------------------------*/
.bg_wave {
    background-image: url(../img/background.png);
    background-size: cover;
    background-repeat: no-repeat;
    margin-top: calc(20 / 640 * 100vw);
    height: calc(10304 / 640 * 100vw);
}

/* feature
-----------------------------------------------------------*/
.feature {
    width: calc(570 / 640 * 100vw);
    margin: 0 auto;
}

.feature:first-child {
    padding-top: calc(1107 / 640 * 100vw);
}

.feature + .feature:nth-child(2) {
    margin-top: calc(368 / 640 * 100vw);
}

.feature + .feature:nth-child(3) {
    margin-top: calc(368 / 640 * 100vw);
}

.feature + .feature:nth-child(4) {
    margin-top: calc(368 / 640 * 100vw);
}

.feature + .feature:nth-child(5) {
    margin-top: calc(368 / 640 * 100vw);
}

.feature + .feature:nth-child(6) {
    margin-top: calc(150 / 640 * 100vw);
}

.feature:last-child {
    margin-top: calc(180 / 640 * 100vw);
    padding-bottom: calc(155 / 640 * 100vw);
}

.featureTitle {
    width: fit-content;
    margin: 0 auto;
}

.featureText {
    color: #003B5B;
    font-size: calc(26 / 640 * 100vw);
    line-height: calc(40 / 640 * 100vw);
    font-weight: bold;
    margin-top: calc(30 / 640 * 100vw);
    text-align: center;
}

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

.featureImages > li + li {
    margin-top: calc(30 / 640 * 100vw);
}

/* �Z�l�𒼐ڂ܂� */
.pick {
    background-image: url(../img/pick.png);
    background-size: cover;
    width: calc(540 / 640 * 100vw);
    height: calc(548 / 640 * 100vw);
    padding: calc(40 / 640 * 100vw);
    margin: calc(36 / 640 * 100vw) auto 0;
    position: relative;
    display: flex;
    align-items: end;
}

.pick_title {
    width: calc(274 / 640 * 100vw);
    height: calc(123 / 640 * 100vw);
    position: absolute;
    top: calc(225 / 640 * 100vw);
    right: calc(30 / 640 * 100vw);
}

.pick_text {
    color: #003B5B;
    font-size: calc(26 / 640 * 100vw);
    line-height: calc(40 / 640 * 100vw);
    font-weight: bold;
}

.feature_note {
    width: fit-content;
    margin: calc(30 / 640 * 100vw) auto 0;
}

.feature_note > li {
    font-size: calc(14 / 640 * 100vw);
}

.feature .cta_btn {
    display: block;
    width: fit-content;
    margin: 0 auto;
}

.feature_copy {
    display: block;
    text-align: center;
    font-size: calc(14 / 640 * 100vw);
    margin-top: calc(40 / 640 * 100vw);
}