body {
    font-family: "yu-mincho-pr6n", sans-serif;
}

/* PCレスポンシブ */

.yazi {
    font-size: 16px;
    text-align: center;
    margin: auto;

}

.sv {
    margin: auto;
    max-width: 600px;
    text-align: center;
}

.sv img {
    margin: auto;
    width: 100%;
    text-align: center;
}

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

    .maxwidth {
        width: 96%;
        margin: auto;
    }

    .maintext {
        text-align: center;
        font-size: 20px;
    }

    .tab-box {
        width: 100%;
        max-width: 600px;
        margin: 0 auto;
    }

    .tabs {
        display: flex;
        border-bottom: 2px solid #ccc;
    }

    .tab {
        flex: 1;
        text-align: center;
        padding: 12px;
        cursor: pointer;
        background: #f5f5f5;
        border: 1px solid #ccc;
        border-bottom: none;
    }

    .tab.active {
        background: #fff;
        font-weight: bold;
        border-bottom: 2px solid #fff;
    }

    .tab-content {
        display: none;
    }

    .tab-content.active {
        display: block;
    }

    .tab-content img {
        width: 100%;
    }

    .tabtitle {
        text-align: left;
    }

    .tab-contentbutton {
        text-align: right;
    }

    .accordion-icon {
        transition: transform 0.3s ease;
        display: inline-block;
        margin-left: 5px;
    }

    .tab-contentbutton.open .accordion-icon {
        transform: rotate(180deg);
    }

    .toggle-icon {
        display: inline-block;
        width: 0;
        height: 0;
        margin-left: 8px;
        vertical-align: middle;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        border-top: 8.6px solid #000;
        /* 高さをやや高めにする */
        transition: transform 0.3s ease;
    }

    .toggle-icon.rotate {
        transform: rotate(180deg);
    }


    .accordion-body {
        display: none;
        margin-top: 10px;
        padding: 10px;
        background: #f0f0f0;
        border-top: 1px solid #ccc;
    }

    .accordion-body.active {
        display: block;
    }

    .inner-tabs {
        display: flex;
        justify-content: space-between;
        margin-top: 10px;
    }

    .inner-tab {
        flex: 1;
        text-align: center;
        padding: 8px;
        background: #eee;
        border: 1px solid #ccc;
        cursor: pointer;
        font-size: 16px;
    }

    .inner-tab.active {
        background: #fff;
        font-weight: bold;
        border-bottom: none;
    }

    .inner-tab-content {
        display: none;
        /* padding: 10px;
        border: 1px solid #ccc;
        border-top: none;
        background: #fafafa; */
        margin-top: -1px;
    }

    .inner-tab-content.active {
        display: block;
    }

    .inner-tabs-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
        margin: 10px 0;
    }

    .inner-tab {
        text-align: center;
        padding: 10px;
        background: black;
        border: 1px solid #ccc;
        cursor: pointer;
        font-size: 16px;
        color: white;
    }

    .inner-tab.active {
        background: #ccc;
        font-weight: bold;
        color: #4d4d4d;
    }

    .feature-line {
        padding: 8px 12px;
        border-left: 2px solid #000;
        /* 左線 */
        border-bottom: 1px solid #ddd;
        /* 下線 */
        font-size: 16px;
        width: 100%;
        margin: auto;
        margin-top: 6px;
        margin-bottom: 6px;
    }

    .center {
        text-align: center;
    }

}