@charset "UTF-8";

:root {
    /* Main Colors */
    --primary-color: #C03032;
    /* メインの赤 */
    --primary-light: #F8EBEB;
    /* 薄い赤（背景用） */
    --primary-border: #F3D7D8;
    /* ボタンの枠線など */

    /* Backgrounds */
    --bg-light: #F7F7F7;
    /* 薄いグレー背景 */
    --bg-white: #ffffff;

    /* Borders */
    --border-color: #dddddd;
    /* 標準の線 */
    --border-dark: #bbbbbb;
    /* 濃い目の線 */

    /* Text */
    --text-main: #333333;
    /* 基本の文字色 */
    --text-muted: #666666;
    /* 補足の文字色 */

    /* Labels & Status */
    --label-blue-bg: #ebf7fa;
    --label-blue-text: #2aa5cb;
    --label-green-bg: #DEF3DD;
    --label-green-text: #2ab27b;
    --label-yellow-bg: #fdeddb;
    --label-yellow-text: #e08300;
    --status-denied: #F8CAC3;
    --status-approved: #D0E4B3;
    --status-pending: #FFEDC0;
}

#trial-banner {
    display: none !important;
}

.body-home ul,
.header ul,
.aside ul,
.footer ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.header .__banner .__wrap a.__logo {
    padding: 0;
}


/* color change ------------*/
.gnav-sp .__drawer .__menu .__content .__heading {
    background-color: var(--bg-light);
}

.c-table-dl tr th {
    background-color: var(--bg-light);
}

.c-card>.c-card-header {
    background-color: var(--bg-light);
}

/* .p-product-set table thead tr th {
    background-color: var(--bg-light);
} */

.p-pagination .__link ul.__page li.__active span {
    background: var(--bg-light);
    border: 1px solid var(--bg-light);
}

/* .p-pagination .__link ul.__page li.__link a:hover {
    background: var(--bg-light);
} */

.p-pagination .__link .__prev a:hover,
.p-pagination .__link .__next a:hover {
    background: var(--bg-light);
}

.p-news-notifier>ul li.__item.__item--bgcolor-1 {
    background-color: var(--bg-light);
}

.p-product-option {
    background-color: var(--bg-light);
}

.main.main--product-list section.__control {
    background: var(--bg-light);
}

.main.main--product-list section.__control .__quickorder a:hover {
    background: var(--bg-light);
}

.main.main--product-list section.__list.__list--row ul.__product {
    background-color: var(--bg-light);
}

.main.main--product-detail section.__information .__primary .__photo .__main.__is-no-image span,
.main.main--product-detail section.__information .__primary .__photo .__main.__is-hidden span {
    background-color: var(--bg-light);
}

.main.main--send-cost-list .__price table tr th {
    background-color: var(--bg-light);
}

.main.main--send-cost-list .__price table tbody tr:hover th,
.main.main--send-cost-list .__price table tbody tr:hover td {
    background-color: var(--bg-light);
}

.main.main--send-cost-list .js-hover {
    background-color: var(--bg-light);
}

.main.main--quickorder-form .__input-form .__body .__table tr th {
    background-color: var(--bg-light);
}

.main.main--quickorder-confirm .__input-form .__table tr th {
    background-color: var(--bg-light);
}

.main.main--mypage-order-list-agent section.__list table.__table tr th {
    background-color: var(--bg-light);
}

.main.main--mypage-point section.__list table tr th {
    background-color: var(--bg-light);
}

.main.main--mypage-approval-detail section.__requester .__table tr th {
    background-color: var(--bg-light);
}

.main.main--mypage-group-policy-index section.__list table.__table tr th {
    background-color: var(--bg-light);
}

.main.main--mypage-estimate-detail section.__information .__table tr th,
.main.main--mypage-estimate-detail section.__detail .__delivery .__information .__table tr th {
    background-color: var(--bg-light);
}

/* .p-product-set table thead tr th,
.p-product-set table tbody tr td {
    border-color: var(--border-color);
} */

.p-form-table tr th,
.p-form-table tr td {
    border-color: var(--border-color);
}

.p-cart .__total-price dl {
    border-color: var(--border-color);
}

.p-mypage-navi nav.__menu,
.main.main--product-list section.__child ul li a {
    border-color: var(--border-color);
}

.p-mypage-search .__heading .__toggle span.__button,
.main.main--mypage-bookmarklist-index section.__list>ul>li .__information .__control .__toggle span.__button,
.c-tabs .__nav .__nav-link.__is-active,
.c-tabs .__nav,
.main.main--send-cost-list .__price table thead tr th,
.main.main--send-cost-list .__price table tr th,
.main.main--send-cost-list .__price table tr td {
    border-color: var(--border-color) !important;
}

.main.main--mypage-address-list section.__list table.__table thead tr th {
    border-color: var(--border-color);
    background-color: var(--bg-light);
}

.main.main--mypage-estimate-detail section.__information .__table tr th,
.main.main--mypage-estimate-detail section.__information .__table tr td,
.main.main--mypage-estimate-detail section.__detail .__delivery .__information .__table tr th,
.main.main--mypage-estimate-detail section.__detail .__delivery .__information .__table tr td {
    border-color: var(--border-color);
}

.c-table-dl tr th,
.c-table-dl tr td,
.p-product-set table tbody tr {
    border-color: var(--border-color);
}

.c-form select:focus,
.c-form textarea:focus {
    border-color: var(--border-color);
}

.c-form input[type="text"]:focus,
.c-form input[type="password"]:focus,
.c-form input[type="email"]:focus,
.c-form input[type="url"]:focus,
.c-form input[type="date"]:focus,
.c-form input[type="month"]:focus,
.c-form input[type="time"]:focus,
.c-form input[type="datetime"]:focus,
.c-form input[type="datetime-local"]:focus,
.c-form input[type="week"]:focus,
.c-form input[type="number"]:focus,
.c-form input[type="search"]:focus,
.c-form input[type="tel"]:focus,
.c-form input[type="color"]:focus {
    border-color: var(--border-color);
}

.c-form input:not([type]):focus {
    border-color: var(--border-color);
}

.c-form input[type="file"]:focus,
.c-form input[type="radio"]:focus,
.c-form input[type="checkbox"]:focus {
    outline: thin solid var(--border-color);
    outline: 1px auto var(--border-color);
}

.c-form label:hover,
.c-form label:focus {
    border-color: var(--border-color);
}

.c-tax-type {
    color: var(--primary-color);
}

.p-product-set table tbody tr td.__description .__payment>span {
    background-color: var(--primary-color);
}

.p-form-table tr.__is-error>td p.__message {
    color: var(--primary-color);
}

.p-form-table tr.__is-required>th:after {
    background-color: var(--primary-color);
}

.p-cart .__product table tbody td.__description a .__detail .__payment>span {
    background-color: var(--primary-color);
}

.p-mypage-search .__body .__input dl.__is-error dd .__message {
    color: var(--primary-color);
}

.p-product-option .__option-body ul li.__item.__is-required dl dt .__name:after {
    background-color: var(--primary-color);
}

.main.main--product-list section.__list.__list--row ul.__product>li.__item .__set table tr td.__description .__payment>span {
    background-color: var(--primary-color);
}

.main.main--product-list section.__list .__no-result .__title {
    color: var(--primary-color);
}

.main.main--order-form section.__block.__block--payment .__body table tr td>ul>li .__description .__prepend.__is-mf,
.main.main--order-confirm section.__block.__block--payment .__body table tr td>ul>li .__description .__prepend.__is-mf {
    color: var(--primary-color);
}

.main.main--quickorder-confirm .__input-form .__table tbody tr.__is-error td .__message {
    color: var(--primary-color);
    margin-bottom: .3em;
}

.main.main--mypage-paid-form section.__notice {
    text-align: center;
    color: var(--primary-color);
}

.main.main--mypage-mfkessai section.__notice,
.main.main--mypage-bcart_kakebarai section.__notice {
    color: var(--primary-color);
}

.main.main--mypage-point section.__total dl dd span {
    font-size: 1.15em;
    font-weight: bold;
    color: var(--primary-color);
}

.main.main--mypage-point section.__list table td.__detail dl.__order dd span {
    font-size: 1.15em;
    font-weight: bold;
    color: var(--primary-color);
}

.main.main--mypage-approval-detail section.__approval-form .__not-allow .__button {
    background-color: var(--primary-color);
}

.main.main--product-list section.__list.__list--row ul.__product>li.__item .__set .__to-cart .__button {
    background-color: var(--primary-color);
}

.main.main--mypage-approval-detail section.__result>.__message.__is-denied span.__status {
    color: var(--status-denied);
}

.main.main--mypage-approval-detail section.__result>.__message.__is-approved span.__status {
    color: var(--status-approved);
}

.main.main--mypage-approval-detail section.__result>.__message.__is-unapproved span.__status {
    color: var(--status-pending);
}

.main.main--mypage-approval-detail section.__result>ul.__approvers li.__item.__is-denied span.__status {
    color: var(--status-denied);
}

.main.main--mypage-approval-detail section.__result>ul.__approvers li.__item.__is-approved span.__status {
    color: var(--status-approved);
}

.main.main--mypage-approval-detail section.__result>ul.__approvers li.__item.__is-unapproved span.__status {
    color: var(--status-pending);
}

.__block--news .c-news-label.c-news-label--color-2,
.main--news .c-news-label.c-news-label--color-2 {
    background-color: var(--label-blue-bg);
    border: 1px solid var(--label-blue-bg);
    color: var(--label-blue-text);
    font-weight: 500;
}

.__block--news .c-news-label.c-news-label--color-3,
.main--news .c-news-label.c-news-label--color-3 {
    color: var(--label-green-text);
    font-weight: 500;
    background-color: var(--label-green-bg);
    border: 1px solid var(--label-green-bg);
}

.__block--news .c-news-label.c-news-label--color-4,
.main--news .c-news-label.c-news-label--color-4 {
    background-color: var(--label-yellow-bg);
    border: 1px solid var(--label-yellow-bg);
    color: var(--label-yellow-text);
    font-weight: 500;
}

.__block--news .c-news-label.c-news-label--color-5,
.main--news .c-news-label.c-news-label--color-5 {
    background-color: var(--primary-light);
    border: 1px solid var(--primary-light);
    color: var(--primary-color);
    font-weight: 500;
}
.main.main--product-list section.__list.__list--row ul.__product > li.__item a table tr td.__detail .__status ul li.__label.__label--recommend,
.p-product-block ul.__product li.__item a .__status ul li.__label.__label--recommend {
    background-color: var(--primary-light);
    color: var(--primary-color);
    font-weight: 500;
}
.main.main--product-list section.__list.__list--row ul.__product > li.__item a table tr td.__detail .__status ul li.__label.__label--new,
.p-product-block ul.__product li.__item a .__status ul li.__label.__label--new {
  color: var(--label-green-text);
  font-weight: 500;
  background-color: var(--label-green-bg);
}

.main.main--product-list section.__list.__list--row ul.__product > li.__item a table tr td.__detail .__status ul li.__label.__label--limited,
.p-product-block ul.__product li.__item a .__status ul li.__label.__label--limited {
  color: var(--label-yellow-text);
  font-weight: 500;
  background-color: var(--label-yellow-bg);
}

.main.main--product-detail section.__information .__secondary .__status ul li.__item.__item--recommend {
    background-color: var(--primary-light);
    color: var(--primary-color);
    font-weight: 500;
}
.main.main--product-detail section.__information .__secondary .__status ul li.__item.__item--new {
  color: var(--label-green-text);
  font-weight: 500;
  background-color: var(--label-green-bg);
}
.main.main--product-detail section.__information .__secondary .__status ul li.__item.__item--limited {
  color: var(--label-yellow-text);
  font-weight: 500;
  background-color: var(--label-yellow-bg);
}

.main.main--product-list section.__list .__no-result {
    padding: 1em;
    background-color: #FFF2D8;
    margin: 1em 0;
}

.main.main--quickorder-confirm .__input-form .__table tbody tr.__is-warning td {
    background-color: #FFF2D8;
}

.main.main--mypage-point section.__total {
    padding: 1em;
    background-color: #FFF2D8;
}

.c-alert.c-alert--warning {
    background-color: #FFF2D8;
}

.main.main--product-list section.__list.__list--row ul.__product>li.__item .__set .__to-cart .__button {
    background-color: var(--primary-color);
}

.main.main--login section.__to-order .__link {
    color: var(--primary-color);
    border: 1px solid var(--primary-color);
}

.main.main--cart section.__shipping-wrap .__shipping .__control ul li.__to-estimate .__button {
    color: var(--primary-color);
    border: 1px solid var(--primary-color);
}

.main.main--cart section.__shipping-wrap .__shipping .__control ul li.__to-order .__button {
    background-color: var(--primary-color);
}

.main.main--mypage-group-member-edit section.__delete button.__button {
    color: var(--primary-color);
    border: 1px solid var(--primary-color);
}

.main.main--mypage-group-policy-edit section.__delete button.__button {
    color: var(--primary-color);
    border: 1px solid var(--primary-color);
}

.p-mypage-search .__body .__control .__submit .__button {
    background-color: var(--primary-color);
}


/* item */
.aside section.__block.__block--category .__body ul.__tree>li.__item {
    margin-top: 0;
    border: unset;
}

.aside section.__block.__block--category .__body ul.__tree li.__item a {
    border-top: 1px solid var(--border-color);
}

/* main--product-list  */
.main.main--product-list section.__list.__list--row ul.__product>li.__item a:hover table tr td.__detail h2.__title {
    text-decoration: none;
}

.main.main--product-list section.__breadcrumb {
    padding: 0;
}

/* calendar */
.aside section.__block.__block--calendar ul li table.cal thead th {
    font-weight: 600;
}

.aside section.__block.__block--calendar ul li table.cal tbody th {
    font-weight: 500;
}

.aside section.__block.__block--calendar ul li table.cal tbody td {
    font-weight: 400;
    border-width: 2px;
}

/* main  */
.wrapper.wrapper--column-2 .__inner .main .__content {
    padding: 0;
}

/* breadcrumb----------- */
.c-breadcrumb li::after {
    padding-left: .8em;
    color: var(--text-muted);
    font-size: 0.8em;
    transform: translateY(-1px);
}

/* product-list----- */
/* __view-control */
.__pagination.p-pagination {
    margin-bottom: 6rem;
}

.main.main--product-list section.__control .__view-control .__select .__button.c-button-active {
    box-shadow: none;
    border: 2px solid var(--border-dark);
    overflow: hidden;
}

.main.main--product-list section.__control .__view-control .__select .__button {
    margin-left: 3px;
    padding: .52em .92em;
    background-color: var(--bg-white);
    border: 2px solid var(--border-color);
    border-radius: .3333em;
}

.main.main--product-list section.__control .__view-control .__select .__button:before {
    color: var(--text-main) !important;
    font-weight: 900;
    content: "\f009";
}

.main.main--product-list section.__control .__view-control .__select .__button--row:before {
    color: var(--text-main) !important;
    font-weight: 900;
    content: "\f00b";
}

.body-product-list .c-form select {
    border: 2px solid var(--border-color);
}

.c-form select,
.c-form textarea {
    box-shadow: none;
    border-radius: 0.333em;
}

.p-pagination .__link ul.__page li {
    line-height: 0.85;
}

.p-pagination .__link ul.__page li.__link a,
.p-pagination .__link ul.__page li.__active span,
.p-pagination .__link .__next a,
.p-pagination .__link .__prev a {
    margin: 0 1px;
    border-radius: 50px;
    background-color: var(--bg-white);
    border: 2px solid var(--primary-border);
    font-weight: 700;
    color: var(--text-main);
    line-height: 0.85;
    font-family: "Poppins", sans-serif;
}

.p-pagination .__link ul.__page li.__active span {
    color: var(--bg-white);
    border: 2px solid var(--primary-color);
    background: var(--primary-color);
}

.main.main--product-list section.__control .__view-control .__select .__button:hover {
    background-color: var(--bg-white);
}

.c-button:hover,
.c-button-submit:hover,
.c-button:focus,
.c-button-submit:focus {
    filter: unset;
    background-image: none;
}

.c-button:active,
.c-button-submit:active {
    box-shadow: unset;
    border-color: 0;
}

.main.main--product-list section.__list.__list--row ul.__product>li.__item {
    border-bottom: 1px solid var(--border-color);
}

.main.main--product-list section.__list.__list--row ul.__product>li.__item a table tr td.__photo {
    aspect-ratio: 1 / 1;
}

.main.main--product-list section.__list.__list--row ul.__product>li.__item a table tr td.__photo img {
    aspect-ratio: 1;
    object-fit: cover;
}

/* product-detail---------- */
.main.main--product-detail section.__information .__secondary .__status,
.main.main--product-detail section.__information .__secondary .__title,
.main.main--product-detail section.__information .__secondary .__catch,
.main.main--product-detail section.__information .__secondary .__description {
    padding: 0;
}

.c-form input[type=text], .c-form input[type=password], .c-form input[type=email], .c-form input[type=url], .c-form input[type=date], .c-form input[type=month], .c-form input[type=time], .c-form input[type=datetime], .c-form input[type=datetime-local], .c-form input[type=week], .c-form input[type=number], .c-form input[type=search], .c-form input[type=tel], .c-form input[type=color] {
    box-shadow: none;
}


@media screen and (max-width: 959px) {
    .main.main--mypage-paid-form section.__description {
        background-color: var(--bg-light);
    }

    .main.main--mypage-group-member-index section.__list table.__table tr th {
        background-color: var(--bg-light);
    }

    .main.main--sitemap .__wrap .__block, .main.main--privacy .__content, .main.main--kiyaku .__content, .main.main--law .__content-top, .main.main--law .__content-bottom, .main.main--corporate .__open .__title, .main.main--corporate .__open .__text, .main.main--product-detail section.__breadcrumb, .main.main--product-detail section.__information, .main.main--howto .__content-top, .main.main--howto .__content-bottom, .main.main--howto .__step .__heading, .main.main--howto .__step .__body, .main.main--login section.__content-top, .main.main--regist-finish section.__message, .main.main--regist-finish section.__back-home, .main.main--password-form section.__description, .main.main--quickorder-form section.__content-top, .main.main--quickorder-form section.__csv-form .__heading, .main.main--quickorder-form section.__input-form .__heading, .main.main--quickorder-form section.__add, .main.main--mypage-estimate-list section.__pagination, .main.main--mypage-estimate-list section.__description, .main.main--mypage-bookmark section.__description, .main.main--mypage-bookmarklist-index section.__description, .main.main--mypage-bookmarklist-index section.__pagination, .main.main--mypage-address-list section.__description, .main.main--mypage-address-list section.__create, .main.main--mypage-address-list section.__pagination, .main.main--mypage-setting section.__description, .main.main--order-form section.__block>.__heading, .main.main--order-form section.__block>.__body>.__description, .main.main--order-form section.__block.__block--order, .main.main--order-form section.__content-top, .main.main--order-form section.__content-bottom, .main.main--order-form section.__back, .main.main--order-confirm section.__block>.__heading, .main.main--order-confirm section.__block>.__body>.__description, .main.main--order-confirm section.__block.__block--order, .main.main--order-confirm section.__content-top, .main.main--order-confirm section.__content-bottom, .main.main--order-confirm section.__back, .main.main--cart section.__content-top, .main.main--cart section.__content-bottom, .main.main--news-detail section, .main.main--news-detail section, .main.main--news-list section:not(.__news), .main.main--product-list section.__breadcrumb, .main.main--regist-confirm .__description, .main.main--quickorder-confirm section.__content-top, .main.main--page-detail-1column section:not(.__heading), .main.main--page-detail-2column section:not(.__heading), .main.main--order-finish section.__content-top, .main.main--order-finish section.__back-home, .main.main--mypage-estimate-detail section.__detail {
        padding: 0;
    }

}

@media screen and (min-width: 600px) and (max-width: 959px) {
    .aside section.__block.__block--calendar ul li table.cal tbody th {
        background-color: var(--bg-light);
    }

    .main.main--mypage-order-detail section.__information .__table tr th {
        background-color: var(--bg-light);
    }

    .main.main--mypage-estimate-detail section.__information .__table tr th {
        background-color: var(--bg-light);
    }

}

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

    /* form */
    .p-form-table tr th {
        padding: 0.5em 0.8em;
        background: var(--bg-light);
    }

    .p-form-table tr td {
        background: unset;
        padding: 1em 0;
    }

    .p-form-table tr {
        padding: 0;
        border-bottom: unset;
        background: unset;
    }

    .p-form-table tr th {
        font-weight: 400;
    }

    .p-product-set table tbody {
        padding: 0;
    }

    .p-product-set table tbody tr td.__price,
    .p-product-set table tbody tr td.__order {
        border-color: var(--border-color);
    }


    .main.main--cart section.__shipping-wrap {
        background-color: var(--bg-light);
    }

    .main.main--mypage-order-detail section.__detail .__delivery .__information .__table tr th {
        background-color: var(--bg-light);
    }

    .main.main--mypage-estimate-detail section.__detail .__delivery .__information .__table tr th {
        background-color: var(--bg-light);
    }

    .main.main--mypage-approval-detail section.__information .__table tr th {
        background-color: var(--bg-light);
    }

    .main.main--mypage-approval-detail section.__detail .__delivery .__information .__table tr th {
        background-color: var(--bg-light);
    }

    .p-cart .__product table tbody tr,
    .p-cart .__product table tbody {
        border-color: var(--border-color);
    }

    .p-mypage-navi nav.__menu .__heading .__toggle span.__button,
    .p-mypage-navi nav.__menu .__body ul li,
    .main.main--mypage-address-list section.__list table.__table tbody tr td {
        border-color: var(--border-color);
    }

    .main.main--mypage-estimate-list section.__list table.__table tbody tr {
        border-color: var(--border-color);
    }

    .main.main--news-list section.__news ul li {
        padding: 1em 0;
    }

    .main.main--howto .__content-top, .main.main--howto .__content-bottom, .main.main--howto .__step .__heading, .main.main--howto .__step .__body {
        padding: 0;
    }


}


@media screen and (min-width: 600px) {
    .p-form-table tr th {
        background-color: var(--bg-light);
    }

    .p-form-table tr td {
        background: var(--bg-white);
    }

    .p-form-table tr {
        background-color: var(--bg-light);
    }

    .p-cart .__product table thead th {
        background-color: var(--bg-light);

    }

    .p-cart .__product table thead th,
    .p-cart .__product table tbody td {
        border-color: var(--border-color);
    }

    .main.main--mypage-order-list section.__list table.__table tr th {
        background-color: var(--bg-light);
    }

    .main.main--mypage-order-detail section.__detail .__delivery .__product table thead th {
        background-color: var(--bg-light);
    }

    .main.main--mypage-estimate-list section.__list table.__table tr th {
        background-color: var(--bg-light);
    }

    .main.main--mypage-estimate-detail section.__detail .__delivery .__product table thead th {
        background-color: var(--bg-light);
    }

    .main.main--mypage-address-list section.__list table.__table thead tr th {
        background-color: var(--bg-light);
    }

    .main.main--mypage-approval-index section.__list table.__table tr th {
        background-color: var(--bg-light);
    }

    .main.main--mypage-approval-detail section.__detail .__delivery .__product table thead th {
        background-color: var(--bg-light);
    }

    .p-mypage-navi nav.__menu .__body ul li a,
    .main.main--mypage-order-list section.__list table.__table tr th,
    .main.main--mypage-order-list section.__list table.__table tr td,
    .main.main--mypage-estimate-list section.__list table.__table tr th,
    .main.main--mypage-estimate-list section.__list table.__table tr td {
        border-color: var(--border-color);
    }

}


@media screen and (min-width: 960px) {

    /* calendar */
    .aside section.__block.__block--calendar ul li {
        padding: 0;

    }
}