@charset "utf-8";

/* メニューページ Ver.2：テーブル高級化 */

.ta1{
    width:100%;
    margin:20px 0 30px;
    border-collapse:collapse;
    border:none;
    background:#fffdf8;
}

.ta1 caption{
    background:linear-gradient(180deg,#9b764a,#7a5a2e);
    color:#fff;
    padding:13px;
    font-size:1.2em;
    font-weight:bold;
    border:none;
}

.ta1 th,
.ta1 td{
    border:none;
    border-bottom:1px solid #d8c8aa;
    padding:15px 8px;
    background:#fffdf8;
}

.ta1 th{
    text-align:left;
    color:#3f2b1b;
    font-weight:bold;
}

.ta1 th:before{
    content:"";
}

.ta1 tbody tr th:before{
    content:"●";
    color:#b2762b;
    margin-right:8px;
    font-size:.8em;
}

.ta1 td{
    text-align:center;
}

.ta1 td:nth-child(2){
    color:#5a3b22;
    font-size:.95em;
}

.ta1 td:nth-child(3){
    text-align:right;
    color:#8a4f12;
    font-size:1.45em;
    font-weight:bold;
    white-space:nowrap;
}

/* スマホ */
@media screen and (max-width:680px){

    .ta1{
        width:100% !important;
        margin:20px 0 30px !important;
        table-layout:fixed;
    }

    .ta1 caption{
        font-size:1.15em;
        padding:12px 4px;
    }

    .ta1 th,
    .ta1 td{
        padding:13px 4px !important;
        font-size:14px !important;
        line-height:1.5;
    }

    .ta1 th{
        width:45%;
        word-break:keep-all;
    }

    .ta1 td:nth-child(2){
        width:20%;
        font-size:13px !important;
    }

    .ta1 td:nth-child(3){
        width:35%;
        font-size:18px !important;
        white-space:nowrap;
    }

}
/* メニュー表 幅バランス調整 */
.ta1{
    table-layout:auto !important;
}

.ta1 th:first-child,
.ta1 td:first-child{
    width:45% !important;
}

.ta1 th:nth-child(2),
.ta1 td:nth-child(2){
    width:20% !important;
}

.ta1 th:nth-child(3),
.ta1 td:nth-child(3){
    width:35% !important;
}

.ta1 th{
    white-space:nowrap !important;
}

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

    .ta1 th:first-child,
    .ta1 td:first-child{
        width:42% !important;
    }

    .ta1 th:nth-child(2),
    .ta1 td:nth-child(2){
        width:23% !important;
    }

    .ta1 th:nth-child(3),
    .ta1 td:nth-child(3){
        width:35% !important;
    }

    .ta1 th{
        white-space:nowrap !important;
        font-size:13px !important;
    }

    .ta1 td:nth-child(3){
        font-size:16px !important;
    }

}
.ta1 td:nth-child(3){
    padding-right:18px !important;
}
@media screen and (max-width:680px){
    .ta1 td:nth-child(3){
        padding-right:6px !important;
    }
}
.payment_img{
    text-align:center;
    margin:20px 0;
}

.payment_img img{
    max-width:100%;
    height:auto;
    border-radius:8px;
}
