@media all and (min-width: 641px) {
    .page-title-holder {
        background: url(../img/bg-main.jpg) center top no-repeat
    }

    .page-title-holder .title-svg {
        width: 317px
    }

    .page-title-holder .page-title-products {
        width: 139px;
        margin-left: 305px;
        bottom: 0;
        margin-bottom: -85px
    }

    .section-howto .section--inner {
        margin-top: 95px
    }

    .section-howto .accordion-holder {
        margin-top: 30px
    }

    .section-howto .accordion-holder .accordion-title {
        width: 280px;
        font-size: 16px;
        padding: 15px;
        border-bottom: 1px solid #000;
        position: relative;
        text-align: left
    }

    .section-howto .accordion-holder .accordion-title:hover,
    .section-howto .accordion-holder .accordion-title:visited {
        border-bottom: 1px solid #000
    }

    .section-howto .accordion-holder .accordion-title:before,
    .section-howto .accordion-holder .accordion-title:after {
        content: "";
        display: block;
        width: 13px;
        height: 1px;
        background-color: #000;
        position: absolute;
        top: 50%;
        right: 15px
    }

    .section-howto .accordion-holder .accordion-title:after {
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg)
    }

    .section-howto .accordion-holder .accordion-inner {
        width: 512px;
        margin-right: auto;
        opacity: 0;
        height: 0;
        visibility: hidden;
        -webkit-transition: opacity 0.3s;
        transition: opacity 0.3s
    }

    .section-howto .accordion-holder .accordion-inner .box {
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        justify-content: space-between;
        -webkit-box-align: center;
        -webkit-align-items: center;
        align-items: center;
        margin-top: 30px
    }

    .section-howto .accordion-holder .accordion-inner .box .box-content {
        width: 256px
    }

    .section-howto .accordion-holder .accordion-inner .box .box-content.right {
        padding: 0 20px
    }

    .section-howto .accordion-holder .accordion-inner .box .box-title {
        font-size: 16px;
        font-weight: bold;
        margin-bottom: 10px
    }

    .section-howto .accordion-holder .accordion-inner .box .box-text {
        font-size: 15px;
        line-height: 2.13333
    }

    .section-howto .accordion-holder .accordion-inner .box.n2 {
        width: 512px !important
    }

    .section-howto .accordion-holder .accordion-inner .box.n4 {
        padding: 10px;
        background: #eeeeee
    }

    .section-howto .accordion-holder .accordion-inner .box.n4 .box-text {
        width: 100%;
        display: block;
        color: #9d162e;
        line-height: 1.6;
        text-align: center
    }

    .section-howto .accordion-holder.open .accordion-inner {
        opacity: 1;
        height: 100%;
        visibility: visible
    }

    .section-howto .accordion-holder.open .accordion-title:after {
        display: none
    }

    .section-howto .block:nth-child(6) .box {
        width: 100% !important
    }
}

@media screen and (max-width: 640px) {
    .page-title-holder {
        height: 63.125vw;
        background: url("../img/page-title-base-sp.jpg") center top no-repeat;
        position: relative;
        text-align: center;
        padding-top: 9.375vw
    }

    .page-title-holder .page-title {
        margin: 0 auto
    }

    .page-title-holder .page-title img {
        width: 55vw
    }

    .page-title-holder .page-title-products {
        width: 22.8125vw;
        margin: auto;
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        margin-bottom: -14.0625vw !important
    }

    .section-howto {
        margin: auto
    }

    .section-howto .section--inner {
        padding: 0 4.6875vw;
        margin-top: 18.75vw
    }

    .section-howto .block .box.n1 {
        margin-top: 3.4375vw
    }

    .section-howto .block .pic-illust {
        width: 68.75vw;
        margin: 7.8125vw auto 0
    }

    .section-howto .accordion-holder {
        margin-top: 3.125vw
    }

    .section-howto .accordion-holder .accordion-title {
        display: block;
        width: 70.3125vw;
        padding: 3.125vw;
        margin-left: 8.59375vw;
        margin-right: 8.59375vw;
        font-size: 2.6rem;
        border-bottom: 1px solid #000;
        position: relative;
        text-align: center
    }

    .section-howto .accordion-holder .accordion-title:hover,
    .section-howto .accordion-holder .accordion-title:visited {
        border-bottom: 1px solid #000
    }

    .section-howto .accordion-holder .accordion-title:before,
    .section-howto .accordion-holder .accordion-title:after {
        content: "";
        display: block;
        width: 4.0625vw;
        height: .3125vw;
        background-color: #000;
        position: absolute;
        top: 50%;
        right: 3.125vw
    }

    .section-howto .accordion-holder .accordion-title:after {
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg)
    }

    .section-howto .accordion-holder .accordion-inner {
        margin-right: auto;
        opacity: 0;
        height: 0;
        visibility: hidden;
        -webkit-transition: opacity 0.3s;
        transition: opacity 0.3s
    }

    .section-howto .accordion-holder .accordion-inner .box {
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        justify-content: space-between;
        -webkit-box-align: center;
        -webkit-align-items: center;
        align-items: center;
        margin-top: 6.25vw
    }

    .section-howto .accordion-holder .accordion-inner .box .box-content {
        width: 50%
    }

    .section-howto .accordion-holder .accordion-inner .box .box-content.right {
        padding-left: 3.125vw
    }

    .section-howto .accordion-holder .accordion-inner .box .box-title {
        font-size: 2.4rem;
        font-weight: bold;
        margin-bottom: 2.34375vw
    }

    .section-howto .accordion-holder .accordion-inner .box .box-text {
        font-size: 2.4rem;
        line-height: 1.66667
    }

    .section-howto .accordion-holder .accordion-inner .box.n2 {
        width: 100% !important
    }

    .section-howto .accordion-holder .accordion-inner .box.n4 {
        padding: 3.90625vw;
        background: #eeeeee
    }

    .section-howto .accordion-holder .accordion-inner .box.n4 .box-text {
        width: 100%;
        display: block;
        color: #9d162e;
        font-size: 2.4rem;
        line-height: 1.5;
        text-align: center
    }

    .section-howto .accordion-holder.open .accordion-inner {
        opacity: 1;
        height: 100%;
        visibility: visible
    }

    .section-howto .accordion-holder.open .accordion-title:after {
        display: none
    }
}



@media all and (min-width: 641px) {
    .section-top .section-title {
        display: block
    }

    .section-top .section-title img {
        width: 99px;
        margin: auto
    }

    .section-qa {
        padding: 30px 0 120px
    }

    .section-qa .border-holder+.border-holder {
        margin-top: 40px
    }

    .section-qa .border-holder .box {
        display: block
    }

    .section-qa .border-holder .box.left {
        width: 280px;
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        align-items: center
    }

    .section-qa .border-holder .box.right {
        width: 545px
    }

    .section-qa .border-holder .box .text {
        width: 465px;
        font-size: 15px;
        line-height: 2.13333;
        padding-left: 1em;
        text-indent: -1em
    }

    .section-qa .border-holder .pic {
        display: block;
        position: relative;
        margin-bottom: -33px
    }

    .section-qa .border-holder .pic .icon {
        margin: auto;
        position: absolute;
        top: 205px;
        left: 0;
        right: 0
    }

    .section-qa .border-holder .item-name {
        font-weight: bold;
        font-size: 24px;
        padding-bottom: 27px;
        margin-bottom: 27px;
        border-bottom: 1px solid #ccc;
        padding-left: 45px;
        position: relative
    }

    .section-qa .border-holder .item-name .text-s {
        font-size: 16px
    }

    .section-qa .border-holder .item-name:before {
        content: "";
        display: block;
        background: url("../../../../faq/scalpd/files/img/icon-q.svg") left top/contain no-repeat;
        width: 34px;
        height: 34px;
        position: absolute;
        left: 0;
        top: 0
    }

    .section-qa .border-holder.n1 .pic {
        width: 138px
    }

    .section-qa .border-holder.n2 .pic {
        width: 169px
    }

    .section-qa .border-holder.n3 .pic {
        width: 154px
    }

    .section-qa .border-holder.n4 .pic {
        width: 125px;
        margin-bottom: -60px
    }

    .section-qa .border-holder.n5 .pic {
        width: 124px;
        margin-bottom: -50px
    }



}

@media screen and (max-width: 640px) {
    .section-top .section-title {
        text-align: center
    }

    .section-top .section-title img {
        width: 20vw
    }

    .section-qa {
        margin-bottom: 18.75vw
    }

    .section-qa .border-holder {
        display: block;
        border: 1px solid #ccc;
        margin-top: 9.375vw;
        padding: 4.6875vw 5.46875vw;
        position: relative
    }

    .section-qa .border-holder .item-name {
        font-weight: bold;
        font-size: 4.6875vw;
        padding-left: 9.375vw;
        padding-top: .9375vw;
        padding-bottom: 2.34375vw;
        margin-bottom: 8.59375vw;
        border-bottom: 1px solid #ccc;
        position: relative
    }

    .section-qa .border-holder .item-name .text-s {
        font-size: 3.75vw;
        display: block
    }

    .section-qa .border-holder .item-name:before {
        content: "";
        display: block;
        background: url("../../../../faq/scalpd/files/img/icon-q.svg") left top/contain no-repeat;
        width: 6.5625vw;
        height: 6.5625vw;
        position: absolute;
        left: 0;
        top: 0
    }

    .section-qa .border-holder .pic {
        display: block;
        position: relative;
        margin: auto
    }

    .section-qa .border-holder .pic .icon {
        margin: auto;
        position: absolute;
        bottom: 6.25vw;
        width: 20.9375vw;
        left: 0;
        right: 0
    }

    .section-qa .border-holder .box .text {
        margin-bottom: 1.5625vw;
        font-size: 3.75vw;
        line-height: 5.625vw;
        padding-left: 1em;
        text-indent: -1em
    }

    .section-qa .border-holder.n1 .pic {
        width: 36.09375vw
    }

    .section-qa .border-holder.n2 .pic {
        width: 45.78125vw
    }

    .section-qa .border-holder.n3 .pic {
        width: 45.78125vw
    }

    .section-qa .border-holder.n4 .pic {
        width: 35.15625vw;
        margin-bottom: -60px
    }

    .section-qa .border-holder.n5 .pic {
        width: 34.21875vw;
        margin-bottom: -50px
    }
}



.section-product .product-block.n7 .holder {
    flex-wrap: wrap;
}

.section-product .product-block.n7 .holder .item {
    width: 70%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    margin: auto;
    /* flex-direction: column; */
    /* margin: 0 0 10% 0; */
}

.section-product .product-block.n7 .holder .item .pic {
    /* margin-bottom: -70%; */
}

.section-product .product-block.n7 .holder .item .item-name {
    /* width: 100%; */
    text-align: center;
    font-weight: bold;
    letter-spacing: 0;
    font-size: 16px;
    line-height: 1.5;
}

.section-product .product-block.n7 .holder .item .item-type {
    width: 100%;
}

.section-product .product-block.n7 .holder .item .item-class {
    width: 100%;
}

.section-product .product-block.n7 .holder .item .products-btn-list {

    /* margin-top: auto; */
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;


}

@media screen and (max-width: 640px) {
    .section-product .product-block.n7 .holder {
        display: flex;
        align-items: stretch;
        flex-wrap: wrap;
    }

    .section-product .product-block.n7 .holder .item {
        width: 100%;
        display: initial;

        margin: 0;

    }

    .section-product .product-block.n7 .holder .item .pic {
        /* margin-bottom: -48%; */
        width: 75%;
        margin: auto;
    }

    .section-product .product-block.n7 .holder .item .item-name {
        width: 100%;
        font-weight: bold;
        font-size: 4.6875vw;
        margin-top: -9rem;
        margin-bottom: 3rem;
    }

    .section-product .product-block.n7 .holder .item .item-type {
        width: 100%;
    }

    .section-product .product-block.n7 .holder .item .item-class {
        width: 100%;
    }

    .section-product .product-block.n7 .holder .item .products-btn-list {

        margin-top: auto;
    }

    .section-product .product-block.n7 .holder .item .products-btn-list .btn-buy {
        margin-top: initial;
    }

    .section-product .product-block.n7 .holder .item .products-btn-list .btn-default {
        margin-top: 3.125vw;
    }
}