@charset "UTF-8";

#page_head{
    background-image: url('../images/trade/');
}

.webp #page_head{
    background-image: url('../images/trade/');
}

#trade{
    margin: 0 40px 0 67px;
}

#trade h2{
    font-size: 18px;
    font-weight: 600;
    color: #5e6438;
    line-height: 1;
    letter-spacing: 0.2em;
    padding: 30px 0 3px;
    margin-bottom: 30px;
    border-bottom: 1px solid #808063;
    position: relative;
}

#trade h2::before{
    content: '';
    display: inline-block;
    width: 47px;
    height: 47px;
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: contain;
    background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%20100%20100%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.st0%20%7B%20fill%3A%20%23d5d6d5%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_11%22%20data-name%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%3E%20%3Cg%3E%20%3Cpath%20class%3D%22st0%22%20d%3D%22M84.8%2C42.9l-29.6-27.8c-.4-.3-.9-.3-1.2%2C0l-4%2C4.4-4-4.4c-.3-.4-.9-.4-1.2%2C0l-29.6%2C27.8c-.6.5-.2%2C1.5.6%2C1.5h8.9c.3%2C0%2C.5-.1.7-.3l19-21.5c.4-.4%2C1.1-.4%2C1.4%2C0l.7%2C1-5.4%2C6c-.5.5-.1%2C1.5.7%2C1.5h6.5c.3%2C0%2C.5-.1.7-.4l1.1-1.7%2C1.1%2C1.7c.2.2.4.4.7.4h6.5c.8%2C0%2C1.1-.9.7-1.5l-5.4-6%2C.7-1c.3-.5%2C1-.5%2C1.4%2C0l19%2C21.5c.2.2.4.3.7.3h8.9c.8%2C0%2C1.2-1%2C.6-1.5Z%22%2F%3E%20%3Cpath%20class%3D%22st0%22%20d%3D%22M71.1%2C70.8c-3.4-1.6-4.3-3.2-4.3-3.2-.1-.3-.5-.5-.8-.5s-.7.2-.8.5c0%2C0-.7%2C1.3-2.9%2C1.8-2.4.5-7.7.6-16.7.6h0c-9.3%2C0-12.7-1.9-12.8-2.6-.1-.4-.5-.7-.9-.7-.4%2C0-.8.4-.8.8%2C0%2C.2-.7.7-1.2%2C1.1-1.1.8-2.6%2C2-3.2%2C3.9-.8%2C2.4%2C1.5%2C5.2%2C2.8%2C6.3.2.2.4.3.5.5.8.8%2C1.6%2C1.4%2C2.9%2C1.4s1.9-.2%2C3.3-.7c1.8-.6%2C6.1-.9%2C8.7-1h.8c1.7-.1%2C2.5-.1%2C4-.1h2.8c3.3%2C0%2C6.4.5%2C9.2.9%2C3.4.5%2C6.3.9%2C8.5.4%2C2-.5%2C3.4-2.2%2C3.5-4.4.2-2.2-.8-4.2-2.4-4.9h0Z%22%2F%3E%20%3Cpath%20class%3D%22st0%22%20d%3D%22M31.6%2C45.9c-.3-.3-.9-.4-1.2%2C0-.5.4-.5%2C1-.6%2C1.5%2C0%2C.7-.1%2C1.2-1.1%2C1.6-.9.4-1.4%2C1-1.5%2C1.9-.4%2C2.1%2C1.6%2C4.5%2C2.2%2C5%2C.2.2.4.4.5.6.7.9%2C1.4%2C1.4%2C2.9%2C1.4s2.1-.2%2C3.8-.6c1.9-.4%2C5.7-.8%2C8.5-1%2C.3%2C5.5%2C1%2C9.7%2C2.7%2C11.3.5.5%2C1.1.7%2C1.7.7h0c3-.1%2C4.7-3.9%2C5.4-12%2C2.3.1%2C4.5.4%2C6.5.7%2C3.4.5%2C6.4.9%2C8.6.3%2C1.7-.4%2C2.8-1.5%2C3.2-3%2C.5-1.9-.3-4.2-1.8-5.8-2.2-2.1-5.1-4.1-5.3-4.2-.3-.2-.6-.2-.9%2C0-.3.1-.5.4-.5.7%2C0%2C.1-.1%2C1.2-2.1%2C1.6-1.4.3-3.9.4-7.3.5.1-3.4.3-5.5.7-6.3%2C0-.1.2-.3.3-.5.6-.9%2C1.4-2.3.8-3.5-.5-.9-1.6-1.3-3.4-1.3-1.3%2C0-1.8-.4-2.3-.9-.6-.5-1.3-1.1-2.8-1.1h0c-2.1%2C0-3%2C1-3.9%2C1.9-.9.9-1.7%2C1.8-4.1%2C2.1-.5%2C0-.8.4-.8.9s.4.8.8.9c0%2C0%2C4%2C.5%2C4.2%2C6.7%2C0%2C.4%2C0%2C.8%2C0%2C1.2-7.9%2C0-11.8%2C0-13.3-1.4h0Z%22%2F%3E%20%3Cpath%20class%3D%22st0%22%20d%3D%22M50%2C0C22.4%2C0%2C0%2C22.4%2C0%2C50s22.4%2C50%2C50%2C50%2C50-22.4%2C50-50S77.6%2C0%2C50%2C0ZM50%2C92.9c-23.7%2C0-42.9-19.3-42.9-42.9S26.3%2C7.1%2C50%2C7.1s42.9%2C19.3%2C42.9%2C42.9-19.3%2C42.9-42.9%2C42.9Z%22%2F%3E%20%3Cpath%20class%3D%22st0%22%20d%3D%22M50%2C8.9c-22.7%2C0-41.1%2C18.4-41.1%2C41.1s18.4%2C41.1%2C41.1%2C41.1%2C41.1-18.4%2C41.1-41.1S72.7%2C8.9%2C50%2C8.9ZM50%2C89.9c-22%2C0-39.9-17.9-39.9-39.9S28%2C10.1%2C50%2C10.1s39.9%2C17.9%2C39.9%2C39.9-17.9%2C39.9-39.9%2C39.9h0Z%22%2F%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%3C%2Fsvg%3E');
    position: absolute;
    top: 4px;
    left: -27px;
    z-index: -1;
}






.trade_table{
    margin-top: 10px;
}

.trade-image img{
    width: 650px;
    /*width: 100%;*/
    height: 340px;
}

.trade-textbox{
    margin-top: 20px;
    margin-left: 10px;
}

.trade-textbox p{
    margin: 0;
}

.trade_table-title img{
    width: 39px;
    height: 39px;
    position: absolute;
    top: 5px;
    left: -22px;
}




.payment-contents{
    width: auto;
    height: auto;
    border: solid 1px #5D6438;
    border-radius: 10px;
}

.h3_wrapp h3 {
    padding-left: 25px;
}

.payment-contents h3{
    font-size: 16px;
}

.payment-contents h3::before{
    content: '';
    display: inline-block;
    content: '■';
    color: #DB3828;
}

.h3_wrapp{
    background: #e1dfc5;
    height: 43px;
    line-height: 43px;
    border-radius: 10px 10px 0 0;
}

.textbox01{
    margin-top: 15px;
    margin-bottom: 12px;
    padding: 0 15px;
    letter-spacing: -0.08em;
}

.textbox01 p{
    font-size: 15px;
}

.textbox02{
    margin-bottom: 20px;
    padding: 0 15px;
}

.textbox02 p{
    font-size: 13px;
    color: #DB3828;
    margin: 0;
    letter-spacing: -0.07em;
    padding-left: 1.2em;
    position: relative;
}

.textbox02 p::before {
 content: '※';
 display: inline-block;
 position: absolute;
 top: 0;
 left: 0;
}

.imagebox01{
    display: flex;
    flex-wrap: wrap;
    padding: 0 25px;
}

.imagebox01 img{
    margin-bottom: 10px;
    margin-right: 7px;
}

.payment-contents02{
    margin-top: 20px;
}

.payment-contents03{
    margin-top: 20px;
}



.jcb img{
    width: 42px;
    height: 32px;
}

.visa img{
    width: 56.7px;
    height: 32px;
}

.master img{
    width: 45.5px;
    height: 32px;
}

.diners img{
    width: 48.3px;
    height: 32px;
}

.amex img{
    width: 33.6px;
    height: 32px;
}

.discover img{
    width: 53.2px;
    height: 32px;
}

.unionpay img{
    width: 54.6px;
    height: 32px;
}

.kitaca img{
    width: 37.8px;
    height: 32px;
}

.suica img{
    width: 52.5px;
    height: 32px;
}

.pasmo img{
    width: 53.2px;
    height: 32px;
}

.toica img{
    width: 65.8px;
    height: 32px;
}

.manaca img{
    width: 62.3px;
    height: 32px;
}

.icoca img{
    width: 52.5px;
    height: 32px;
}

.sugoca img{
    width: 58.1px;
    height: 32px;
}

.nimoca img{
    width: 73.5px;
    height: 32px;
}

.hayakaken img{
    width: 60.2px;
    height: 32px;
}

.applepay img{
    width: 52.5px;
    height: 32px;
}

.id img{
    width: 49.7px;
    height: 32px;
}

.quicpay img{
    width: 50.4px;
    height: 32px;
}


.payment-contents05{
    margin-top: 65px;
}

.payment-contents05 p{
    font-weight: 50;
    font-size: 16px;
    margin-top: 20px;
    margin-left: 20px;
}

.payment-contents05 iframe{
    width: 660px;
    height: 340px;
}








    .trade_table {
        border: 2px solid #808063; /* 外枠全体 */
        width: fit-content;
        border-collapse: collapse;
        font-weight: 700;
    }

    .table-li {
        display: flex;
        border-top: 2px solid #808063; /* 各行の上線 */
    }

    .table-li:last-child {
        border-bottom: none; /* liでは下線消す（親の外枠が下線になる） */
    }

    .table-li:first-child {
        border-top: none; /* 親の上枠で表示されるので不要 */
    }

    .trade_table .th {
        background-color: #E1DFC5;
        width: 160px;
        color: #5A5D34;
        border-right: 2px solid #808063; /* thとtdの間の線 */
        padding: 20px 18px;
        box-sizing: border-box;
        font-size: 16px;
    }

    .trade_table .td {
        width: 488px;
        padding: 20px 18px;
        box-sizing: border-box;
        font-size: 16px;
    }










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

#trade{
    margin: 0 3.125vw 0 5.234vw;
}

#trade h2{
    font-size: 1.406vw;
    padding: 2.344vw 0 0.234vw;
    margin-bottom: 2.34375vw;
}

#trade h2::before{
    width: 3.672vw;
    height: 3.672vw;
    position: absolute;
    top: 0.313vw;
    left: -2.109vw;
}

.trade_table{
    margin-top: 0.781vw;
}

.trade-image img{
    width: 50.781vw;
    height: 26.563vw;
}

.trade-textbox{
    margin-top: 1.563vw;
    margin-left: 0.781vw;
}

.trade_table-title img{
    width: 3.047vw;
    height: 3.047vw;
    position: absolute;
    top: 0.391vw;
    left: -1.719vw;
}

.payment-contents{
    border-radius: 0.781vw;
}

.h3_wrapp h3 {
    padding-left: 1.953vw;
}

.payment-contents h3{
    font-size: 1.25vw;
}

.h3_wrapp{
    height: 3.359vw;
    line-height: 3.359vw;
    border-radius: 0.781vw 0.781vw 0 0;
}

.textbox01{
    margin-top: 1.172vw;
    margin-bottom: 0.938vw;
    padding: 0 1.172vw;
}

.textbox01 p{
    font-size: 1.172vw;
}

.textbox02{
    margin-bottom: 1.563vw;
    padding: 0 1.172vw;
}

.textbox02 p{
    font-size: 1.016vw;
}

.imagebox01{
    padding: 0 1.953vw;
}

.imagebox01 img{
    margin-bottom: 0.781vw;
    margin-right: 0.547vw;
}

.payment-contents02{
    margin-top: 1.563vw;
}

.payment-contents03{
    margin-top: 1.563vw;
}



.jcb img{
    width: 3.281vw;
    height: 2.5vw;
}

.visa img{
    width: 4.43vw;
    height: 2.5vw;
}

.master img{
    width: 3.555vw;
    height: 2.5vw;
}

.diners img{
    width: 3.773vw;
    height: 2.5vw;
}

.amex img{
    width: 2.625vw;
    height: 2.5vw;
}

.discover img{
    width: 4.156vw;
    height: 2.5vw;
}

.unionpay img{
    width: 4.266vw;
    height: 2.5vw;
}

.kitaca img{
    width: 2.953vw;
    height: 2.5vw;
}

.suica img{
    width: 4.102vw;
    height: 2.5vw;
}

.pasmo img{
    width: 4.156vw;
    height: 2.5vw;
}

.toica img{
    width: 5.141vw;
    height: 2.5vw;
}

.manaca img{
    width: 4.867vw;
    height: 2.5vw;
}

.icoca img{
    width: 4.102vw;
    height: 2.5vw;
}

.sugoca img{
    width: 4.539vw;
    height: 2.5vw;
}

.nimoca img{
    width: 5.742vw;
    height: 2.5vw;
}

.hayakaken img{
    width: 4.703vw;
    height: 2.5vw;
}

.applepay img{
    width: 4.102vw;
    height: 2.5vw;
}

.id img{
    width: 3.883vw;
    height: 2.5vw;
}

.quicpay img{
    width: 3.938vw;
    height: 2.5vw;
}


.payment-contents05{
    margin-top: 5.078vw;
}

.payment-contents05 p{
    font-size: 1.25vw;
    margin-top: 1.563vw;
    margin-left: 1.563vw;
}

.payment-contents05 iframe{
    width: 51.563vw;
    height: 26.563vw;
}



.trade_table .th {
    width: 12.5vw;
    padding: 1.563vw 1.406vw;
    font-size: 1.25vw;
}

.trade_table .td {
    width: 38.125vw;
    padding: 1.563vw 1.406vw;
    font-size: 1.25vw;
}



}

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

    #trade h2 {
        font-size: 4.651vw;
        margin-bottom: 5.116279069767442vw;
    }

    #trade h2::before {
        width: 6.977vw;
        height: 6.977vw;
    }

    .h3_wrapp {
        height: 5.581vw;
    }

    .payment-contents h3 {
        font-size: 3.721vw;
        padding-top: 0.93vw;
    }

    .payment-contents02{
        margin-top: 3.488vw;
    }

    .payment-contents03{
        margin-top: 3.488vw;
        margin-bottom: 1.163vw;
    }


    .jcb img{
        width: 9.767vw;
        height: 7.442vw;
    }

    .visa img{
        width: 13.186vw;
        height: 7.442vw;
    }

    .master img{
        width: 10.581vw;
        height: 7.442vw;
    }

    .diners img{
        width: 11.233vw;
        height: 7.442vw;
    }

    .amex img{
        width: 7.814vw;
        height: 7.442vw;
    }

    .discover img{
        width: 12.372vw;
        height: 7.442vw;
    }

    .unionpay img{
        width: 12.698vw;
        height: 7.442vw;
    }

    .kitaca img{
        width: 8.791vw;
        height: 7.442vw;
    }

    .suica img{
        width: 12.209vw;
        height: 7.442vw;
    }

    .pasmo img{
        width: 12.372vw;
        height: 7.442vw;
    }

    .toica img{
        width: 15.302vw;
        height: 7.442vw;
    }

    .manaca img{
        width: 14.488vw;
        height: 7.442vw;
    }

    .icoca img{
        width: 12.209vw;
        height: 7.442vw;
    }

    .sugoca img{
        width: 13.512vw;
        height: 7.442vw;
    }

    .nimoca img{
        width: 17.093vw;
        height: 7.442vw;
    }

    .hayakaken img{
        width: 14vw;
        height: 7.442vw;
    }

    .applepay img{
        width: 12.209vw;
        height: 7.442vw;
    }

    .id img{
        width: 11.558vw;
        height: 7.442vw;
    }

    .quicpay img{
        width: 11.721vw;
        height: 7.442vw;
    }

    .payment-contents03 .imagebox01{
        margin: 10px auto;
    }

    .payment-contents05 iframe{
        width: 100%;
        height: auto;
    }
    .payment-contents05 p{
        font-size: 3.256vw;
    }




    .trade_table {
        width: 100%;
    }

    .table-li {
        display: block;
    }

    .trade_table .th {
        width: 100%;
        font-size: 3.488vw;
        padding-left: 1.86vw;
    }

    .trade_table .td {
        width: 100%;
        font-size: 3.488vw;
        padding: 3.488vw;
    }


    .trade_table .th {
        border-right: none;
    }

    .textbox01 p {
        font-size: 3.488vw;
    }

    .textbox02 p {
        font-size: 3.023vw;
    }

    .imagebox01 {
        margin: 2.326vw 0;
    }



    
}