@charset "utf-8";
/*
 * Welcart カート・会員ページ用スタイル（子テーマ）
 *
 * 親テーマ Welcart Basic の usces_cart.css を土台に、その上から整える差分のみを記述。
 * （usces_cart.css は functions.php で親テーマから読み込み。本ファイルはその後に読み込まれる）
 *
 * 色はカスタマイザーの設定値を CSS 変数で参照:
 *   --wcc-btn-bg / --wcc-btn-text : ボタン色
 *   --wcc-accent / --wcc-accent-bg : 見出しアクセント色 / 見出し背景色
 *   --wcc-link                     : リンク色
 *
 * ブレークポイントは親テーマ usces_cart.css に合わせる（38.75em / 46.25em / 62.5em）
 *
 * 目次
 *  1. 共通（ページ幅・タイトル・入力欄・エラー表示）
 *  2. ボタン（主ボタン／副ボタン）
 *  3. カートステップ（cart_navi）
 *  4. カートページ（wc_cart_page.php）
 *  5. お客様情報・配送/支払い・会員フォーム（customer_form）
 *  6. 確認ページ（wc_confirm_page.php）
 *  7. 注文完了ページ（wc_completion_page.php）
 *  8. ログイン・パスワード関連
 *  9. マイページ（wc_member_page.php）
 * 10. 会員登録完了など
 * 11. レスポンシブ
 */

/* =========================================
   1. 共通
   ========================================= */
#main .cart-page,
#main .member-page {
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
    float: none;
}

/*---- ページタイトル ---*/
#main .cart_page_title,
#main .member_page_title {
    position: relative;
    font-size: 1.5em;
    font-weight: bold;
    line-height: 1.4;
    letter-spacing: .05em;
    margin: 0 0 1.5em;
    padding: 0 0 .6em;
    border-bottom: 2px solid #eeeeee;
}
#main .cart_page_title::after,
#main .member_page_title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 64px;
    height: 2px;
    background-color: var(--wcc-accent, #0066cc);
}

/*---- 説明文エリア ---*/
#main .cart-page div.header_explanation,
#main .member-page div.header_explanation {
    margin: 0 0 1.5em;
    line-height: 1.8;
}
#main .cart-page div.header_explanation:empty,
#main .member-page div.header_explanation:empty {
    display: none;
}
#main .cart-page div.footer_explanation,
#main .member-page div.footer_explanation {
    margin-top: 1.5em;
    line-height: 1.8;
}

/*---- エラーメッセージ ---*/
#main .cart-page .error_message:not(:empty),
#main .member-page .error_message:not(:empty) {
    margin: 0 0 1.5em;
    padding: 14px 18px;
    color: #b3261e;
    font-weight: bold;
    line-height: 1.7;
    background-color: #fdecea;
    border: 1px solid #f5c2c0;
    border-radius: 6px;
}

/*---- 入力欄 ---*/
#main .cart-page input[type="text"],
#main .cart-page input[type="email"],
#main .cart-page input[type="tel"],
#main .cart-page input[type="password"],
#main .cart-page input[type="number"],
#main .cart-page select,
#main .cart-page textarea,
#main .member-page input[type="text"],
#main .member-page input[type="email"],
#main .member-page input[type="tel"],
#main .member-page input[type="password"],
#main .member-page input[type="number"],
#main .member-page select,
#main .member-page textarea {
    box-sizing: border-box;
    max-width: 100%;
    min-height: 42px;
    padding: 8px 12px;
    font-size: 1em;
    line-height: 1.5;
    color: #333333;
    background-color: #ffffff;
    border: 1px solid #cccccc;
    border-radius: 4px;
    transition: border-color .2s ease, box-shadow .2s ease;
}
#main .cart-page textarea,
#main .member-page textarea {
    width: 100%;
    min-height: 120px;
}
#main .cart-page input:focus,
#main .cart-page select:focus,
#main .cart-page textarea:focus,
#main .member-page input:focus,
#main .member-page select:focus,
#main .member-page textarea:focus {
    border-color: var(--wcc-link, #0066cc);
    box-shadow: 0 0 0 3px rgba(0, 102, 204, .15);
    outline: none;
}
#main .cart-page input[type="radio"],
#main .cart-page input[type="checkbox"],
#main .member-page input[type="radio"],
#main .member-page input[type="checkbox"] {
    width: 18px;
    height: 18px;
    margin: 0 6px 0 0;
    vertical-align: middle;
    accent-color: var(--wcc-btn-bg, #0066cc);
}


/* =========================================
   2. ボタン
   ========================================= */
/*---- ボタンの並び ---*/
#main .cart-page .send,
#main .member-page .send {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 12px;
    padding: 1.75em 0 .5em;
    text-align: center;
}

/*---- 基本形（＝主ボタン：次へ・購入・登録・更新など） ---*/
#main .cart-page .send input[type="submit"],
#main .cart-page .send input[type="button"],
#main .cart-page .send a,
#main .member-page .send input[type="submit"],
#main .member-page .send input[type="button"],
#main .member-page .send a,
#main .member-page #member_login {
    display: inline-block;
    box-sizing: border-box;
    min-width: 220px;
    margin: 0;
    padding: 14px 28px;
    font-family: inherit;
    font-size: 1em;
    font-weight: bold;
    line-height: 1.4;
    letter-spacing: .05em;
    text-align: center;
    text-decoration: none;
    color: var(--wcc-btn-text, #ffffff);
    background-color: var(--wcc-btn-bg, #0066cc);
    border: 1px solid var(--wcc-btn-bg, #0066cc);
    border-radius: 6px;
    cursor: pointer;
    transition: opacity .2s ease, background-color .2s ease, color .2s ease;
    -webkit-appearance: none;
    appearance: none;
}
#main .cart-page .send input[type="submit"]:hover,
#main .cart-page .send input[type="button"]:hover,
#main .cart-page .send a:hover,
#main .member-page .send input[type="submit"]:hover,
#main .member-page .send input[type="button"]:hover,
#main .member-page .send a:hover,
#main .member-page #member_login:hover {
    opacity: .85;
    color: var(--wcc-btn-text, #ffffff);
    background-color: var(--wcc-btn-bg, #0066cc);
    text-decoration: none;
}
/* 最終アクション（注文確定）は少し大きく */
#main .cart-page .send input#purchase_button {
    min-width: 280px;
    padding: 16px 36px;
    font-size: 1.1em;
}
#main .cart-page .send input[disabled] {
    opacity: .5;
    cursor: not-allowed;
}

/*---- 副ボタン（戻る・買い物を続ける・トップへ など） ---*/
#main .cart-page .send input.continue_shopping_button,
#main .cart-page .send input.back_cart_button,
#main .cart-page .send input.back_to_customer_button,
#main .cart-page .send input.back_to_delivery_button,
#main .cart-page .send input#back_button,
#main .cart-page .send input[name="top"],
#main .cart-page .send input[name="back"],
#main .cart-page .send input[name="backCustomer"],
#main .member-page .send input.top,
#main .member-page .send input[name="top"],
#main .member-page .send input[name="back"] {
    color: #333333;
    background-color: #ffffff;
    border-color: #cccccc;
}
#main .cart-page .send input.continue_shopping_button:hover,
#main .cart-page .send input.back_cart_button:hover,
#main .cart-page .send input.back_to_customer_button:hover,
#main .cart-page .send input.back_to_delivery_button:hover,
#main .cart-page .send input#back_button:hover,
#main .cart-page .send input[name="top"]:hover,
#main .cart-page .send input[name="back"]:hover,
#main .cart-page .send input[name="backCustomer"]:hover,
#main .member-page .send input.top:hover,
#main .member-page .send input[name="top"]:hover,
#main .member-page .send input[name="back"]:hover {
    opacity: 1;
    color: #333333;
    background-color: #f5f5f5;
}

/*---- 小さな補助ボタン（数量更新・削除・住所検索・ポイント/クーポン適用） ---*/
#main #wc_cart #cart .upbutton input,
#main #cart .action input.delButton,
#main .customer_form input#search_zipcode,
#main #point_table td input.use_point_button,
#main #cart #coupon_table td .use_coupon_button {
    display: inline-block;
    min-width: 0;
    margin: 0;
    padding: 6px 14px;
    font-size: .9em;
    font-weight: normal;
    line-height: 1.5;
    color: #333333;
    background-color: #ffffff;
    border: 1px solid #cccccc;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color .2s ease;
}
#main #wc_cart #cart .upbutton input:hover,
#main #cart .action input.delButton:hover,
#main .customer_form input#search_zipcode:hover,
#main #point_table td input.use_point_button:hover,
#main #cart #coupon_table td .use_coupon_button:hover {
    opacity: 1;
    color: #333333;
    background-color: #f5f5f5;
}


/* =========================================
   3. カートステップ（1.カート → 2.お客様情報 → 3.発送・支払方法 → 4.内容確認）
   ========================================= */
#main div.cart_navi {
    margin: 0 0 2em;
}
#main div.cart_navi ul {
    display: flex;
    gap: 4px;
    margin: 0;
    padding: 0;
    list-style: none;
    overflow: visible;
}
#main div.cart_navi li {
    flex: 1 1 0;
    min-width: 0;
    width: auto;
    float: none;
    margin: 0;
    padding: 12px 10px 12px 22px;
    font-size: .9em;
    font-weight: bold;
    line-height: 1.4;
    text-align: center;
    color: #888888;
    background: #eeeeee;
    clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 50%, calc(100% - 14px) 100%, 0 100%, 14px 50%);
}
#main div.cart_navi li:first-child {
    padding-left: 12px;
    clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 50%, calc(100% - 14px) 100%, 0 100%);
}
#main div.cart_navi li:last-child {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 14px 50%);
}
#main div.cart_navi li::before,
#main div.cart_navi li::after {
    content: none;
    display: none;
}
#main div.cart_navi li.current {
    color: var(--wcc-btn-text, #ffffff);
    background: var(--wcc-btn-bg, #0066cc);
}


/* =========================================
   4. カートページ
   ========================================= */
#main #wc_cart #cart .upbutton {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    padding: 0 0 .75em;
    font-size: .9em;
    color: #666666;
}

/*---- カート／確認の商品テーブル ---*/
#main #cart_table {
    width: 100%;
    margin: 0 0 1em;
    border: none;
    border-top: 1px solid #e5e5e5;
    border-collapse: collapse;
}
#main #cart_table th {
    padding: 12px 10px;
    font-size: .9em;
    font-weight: bold;
    white-space: nowrap;
    background-color: #f7f7f7;
    border: none;
    border-bottom: 1px solid #e5e5e5;
}
#main #cart_table td {
    padding: 14px 10px;
    border: none;
    border-bottom: 1px solid #eeeeee;
}
#main #cart_table td.productname {
    line-height: 1.6;
}
#main #cart_table td.thumbnail img {
    display: block;
    width: 72px;
    max-width: none;
    height: 72px;
    margin: 0 auto;
    object-fit: contain;
    background-color: #f7f7f7;
    border-radius: 4px;
}
#main #cart_table td.unitprice,
#main #cart_table td.price,
#main #cart_table td.subtotal {
    white-space: nowrap;
}
#main #cart_table .quantity input {
    width: 64px;
    min-height: 38px;
    padding: 4px;
    text-align: center;
    border-radius: 4px;
}
#main #cart_table tfoot th,
#main #cart_table tfoot td {
    padding: 16px 10px;
    font-weight: bold;
    background-color: #fafafa;
    border-bottom: 2px solid #e5e5e5;
}
#main #cart_table .amount {
    font-size: 1.25em;
    letter-spacing: .02em;
    color: #cc0000;
}
#main #cart .action {
    width: 1%;
}
#main #wc_cart .currency_code,
#main #wc_confirm .currency_code {
    padding: 0 0 .5em;
    font-size: .85em;
    color: #888888;
    text-align: right;
}
#main #wc_cart .no_cart {
    padding: 4em 1em;
    font-weight: bold;
    color: #666666;
    text-align: center;
    background-color: #fafafa;
    border: 1px dashed #dddddd;
    border-radius: 8px;
}


/* =========================================
   5. お客様情報・配送/支払い・会員フォーム（customer_form）
   ========================================= */
#main #customer-info h5,
#main #delivery-info h5 {
    margin: 2em 0 1em;
    padding: .6em 1em;
    font-size: 1.1em;
    font-weight: bold;
    color: #333333;
    background-color: var(--wcc-accent-bg, #f7f7f7);
    border: none;
    border-left: 4px solid var(--wcc-accent, #0066cc);
}
#main .customer_form {
    width: 100%;
    margin: 0 0 1.5em;
    border-collapse: collapse;
}
#main .customer_form th {
    font-weight: bold;
    color: #333333;
    line-height: 1.5;
}
#main .customer_form th em {
    display: inline-block;
    margin-left: 4px;
    font-style: normal;
    color: #d63638;
}
#main .customer_form td {
    color: #555555;
    line-height: 1.6;
}
#main .customer_form td label {
    color: #333333;
}
#main .customer_form input#zipcode {
    width: 10em;
}
#main .customer_form input#search_zipcode {
    margin: 0 0 0 8px;
}
#main .customer_form #nav,
#main #customer-info .customer_form + #nav {
    margin: .5em 0;
}

/*---- 配送・支払方法（dl形式の選択肢） ---*/
#main #wc_delivery .customer_form dl {
    margin: 0;
}
#main #wc_delivery .customer_form dt {
    padding: .5em 0 .25em;
    font-weight: bold;
}
#main #wc_delivery .customer_form dt label {
    cursor: pointer;
}
#main #wc_delivery .customer_form dd {
    margin: 0 0 .75em 1.75em;
    font-size: .9em;
    color: #666666;
}

/*---- 会員規約など ---*/
#main .agree_member_area textarea,
#main #dlseller_terms .dlseller_terms {
    border-radius: 4px;
}


/* =========================================
   6. 確認ページ
   ========================================= */
#main #info-confirm .confiem_notice {
    padding: 0 0 1em;
    font-weight: bold;
    color: #b3261e;
}
#main #confirm_table {
    width: 100%;
    margin: 0 0 1.5em;
    border-collapse: collapse;
}
#main #confirm_table th {
    font-weight: bold;
    color: #333333;
    background-color: #f7f7f7;
    border: 1px solid #e5e5e5;
}
#main #confirm_table td {
    border: 1px solid #e5e5e5;
    line-height: 1.6;
}
#main #confirm_table tr.ttl td {
    padding: .6em 1em;
    background-color: var(--wcc-accent-bg, #f7f7f7);
    border-left: 4px solid var(--wcc-accent, #0066cc);
}
#main #confirm_table .ttl h3 {
    margin: 0;
    padding: 0;
    font-size: 1.05em;
    color: #333333;
    background: none;
    border: none;
}
#main #cart #point_table td,
#main #cart #coupon_table th,
#main #cart #coupon_table td {
    border-color: #e5e5e5;
}


/* =========================================
   7. 注文完了ページ
   ========================================= */
#main #wc_ordercompletion #cart_completion {
    max-width: 760px;
    margin: 0 auto;
    padding: 2.5em 1.5em;
    text-align: center;
    background-color: #ffffff;
    border: 1px solid #e5e5e5;
    border-radius: 8px;
}
#main #wc_ordercompletion #cart_completion > h3 {
    margin: 0 0 1em;
    font-size: 1.4em;
    font-weight: bold;
    line-height: 1.5;
    color: #333333;
    border: none;
}
#main #wc_ordercompletion #cart_completion > h3::before {
    content: "";
    display: block;
    width: 64px;
    height: 64px;
    margin: 0 auto .75em;
    border-radius: 50%;
    background-color: var(--wcc-btn-bg, #0066cc);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 30px;
}
#main #wc_ordercompletion .header_explanation {
    margin: 0 0 1.5em;
    line-height: 1.9;
    text-align: center;
}
/* 決済方法ごとの案内（銀行振込の振込先・コンビニ払込票など）は左揃えで読みやすく */
#main #wc_ordercompletion #cart_completion table {
    width: 100%;
    margin: 1em 0 1.5em;
    text-align: left;
    border-collapse: collapse;
}
#main #wc_ordercompletion #cart_completion table th,
#main #wc_ordercompletion #cart_completion table td {
    padding: 10px 14px;
    line-height: 1.6;
    border: 1px solid #e5e5e5;
}
#main #wc_ordercompletion #cart_completion table th {
    width: 30%;
    font-weight: bold;
    background-color: #f7f7f7;
}
#main #wc_ordercompletion .footer_explanation {
    line-height: 1.8;
}
#main #wc_ordercompletion .send {
    padding-top: 1em;
}


/* =========================================
   8. ログイン・パスワード関連
   ========================================= */
#main #wc_login .loginbox,
#main #wc_member .loginbox,
#main #wc_changepassword .loginbox,
#main #wc_lostmemberpassword .loginbox {
    box-sizing: border-box;
    width: auto;
    max-width: 520px;
    margin: 0 auto;
    padding: 2em;
    font-size: 1em;
    text-align: left;
    background-color: #ffffff;
    border: 1px solid #e5e5e5;
    border-radius: 8px;
}
#main #wc_login .error_message,
#main #wc_member .error_message,
#main #wc_changepassword .error_message,
#main #wc_lostmemberpassword .error_message {
    width: auto;
    max-width: 520px;
    margin-left: auto;
    margin-right: auto;
}
#main .loginbox label {
    display: inline-block;
    margin-bottom: 4px;
    font-weight: bold;
}
#main .loginbox .forgetmenot label {
    font-weight: normal;
}
#main .loginbox input.loginmail,
#main .loginbox input.loginpass {
    width: 100%;
    margin-bottom: 1em;
}
#main .loginbox .submit {
    padding: .75em 0;
}
#main .member-page .loginbox #member_login {
    width: 100%;
    min-width: 0;
}
#main .loginbox #nav {
    margin: .75em 0 0;
    text-align: center;
}
#main #wc_login .loginbox .new-entry,
#main #wc_member .loginbox .new-entry {
    margin: 1.5em 0 0;
    padding: 1.5em;
    text-align: center;
    background-color: #f7f7f7;
    border-radius: 6px;
}
#main .loginbox .new-entry h2 {
    margin: 0 0 .5em;
    padding: 0;
    font-size: 1.05em;
    background: none;
    border: none;
}
#main #wc_login .loginbox .new-entry #nav a,
#main #wc_member .loginbox .new-entry #nav a {
    display: inline-block;
    min-width: 220px;
    padding: 12px 24px;
    font-weight: bold;
    color: var(--wcc-btn-bg, #0066cc);
    background-color: #ffffff;
    border: 1px solid var(--wcc-btn-bg, #0066cc);
    border-radius: 6px;
    text-decoration: none;
}
#main #wc_login .loginbox .new-entry #nav a:hover,
#main #wc_member .loginbox .new-entry #nav a:hover {
    color: var(--wcc-btn-text, #ffffff);
    background-color: var(--wcc-btn-bg, #0066cc);
}
#main #wc_changepassword #member_login,
#main #wc_lostmemberpassword #member_login {
    width: 100%;
    min-width: 0;
}
#main #wc_lostmemberpassword #nav a {
    color: #333333;
    background-color: #ffffff;
    border: 1px solid #cccccc;
    border-radius: 6px;
}


/* =========================================
   9. マイページ
   ========================================= */
/*---- セクション見出し ---*/
#main #wc_member #memberinfo h3,
#main #wc_editmemberform #memberinfo h3 {
    margin: 2.5em 0 1em;
    padding: .6em 1em;
    font-size: 1.1em;
    font-weight: bold;
    color: #333333;
    background-color: var(--wcc-accent-bg, #f7f7f7);
    border: none;
    border-left: 4px solid var(--wcc-accent, #0066cc);
}

/*---- 会員情報（会員番号・氏名など） ---*/
#main #memberinfo > table {
    width: 100%;
    margin: 0 0 1.25em;
    border: 1px solid #e5e5e5;
    border-collapse: collapse;
}
#main #memberinfo > table th {
    font-weight: bold;
    color: #555555;
    white-space: nowrap;
    background-color: #f7f7f7;
    border: 1px solid #e5e5e5;
}
#main #memberinfo > table td {
    color: #333333;
    border: 1px solid #e5e5e5;
}
#main #memberinfo > table .space {
    background-color: transparent;
}

/*---- サブメニュー（会員情報編集・ログアウトなど） ---*/
#main #memberinfo .member_submenu {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 1.5em;
    padding: 0;
    list-style: none;
}
#main #memberinfo .member_submenu li {
    margin: 0;
}
#main #memberinfo .member_submenu li:empty {
    display: none;
}
#main #memberinfo .member_submenu a {
    display: inline-block;
    width: auto;
    padding: 10px 20px;
    font-size: .95em;
    color: #333333;
    background-color: #ffffff;
    border: 1px solid #cccccc;
    border-radius: 6px;
    text-decoration: none;
    transition: background-color .2s ease;
}
#main #memberinfo .member_submenu a:hover {
    background-color: #f5f5f5;
}
#main #memberinfo .member_submenu .member-logout {
    margin-left: auto;
}

/*---- 購入履歴：絞り込み ---*/
#main #memberinfo .usces_filter_history {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 8px 16px;
    margin: 0 0 1em;
    padding: 10px 14px;
    font-size: .9em;
    background-color: #fafafa;
    border: 1px solid #eeeeee;
    border-radius: 6px;
}
#main #memberinfo .usces_filter_history .usce_period {
    display: flex;
    align-items: center;
    gap: 8px;
}
#main #memberinfo .usces_filter_history select {
    min-height: 36px;
    padding: 4px 10px;
}
#main #memberinfo .currency_code {
    margin: 0 0 .5em;
    font-size: .85em;
    color: #888888;
    text-align: right;
}

/*---- 購入履歴：一覧 ---*/
#main #memberinfo .history-area {
    margin: 0 0 2em;
    padding: 0;
    border: none;
}
#main #memberinfo #history_head {
    width: 100%;
    margin: 1.5em 0 0;
    border-collapse: collapse;
}
#main #memberinfo .history-area > #history_head:first-of-type {
    margin-top: 0;
}
#main #memberinfo #history_head th,
#main #memberinfo .retail th {
    padding: 8px 10px;
    font-size: .85em;
    font-weight: bold;
    color: #555555;
    background-color: #f7f7f7;
    border: 1px solid #e5e5e5;
}
#main #memberinfo #history_head td,
#main #memberinfo .retail td {
    padding: 10px;
    font-size: .95em;
    line-height: 1.5;
    border: 1px solid #e5e5e5;
}
#main #memberinfo #history_head .order_head_value td {
    font-weight: bold;
    background-color: #ffffff;
}
#main #memberinfo #history_head td.order_number {
    color: var(--wcc-accent, #0066cc);
}
#main #memberinfo .retail {
    width: 100%;
    margin: -1px 0 0;
    border-collapse: collapse;
}
#main #memberinfo .retail td.thumbnail {
    width: 60px;
}
#main #memberinfo .retail td.thumbnail img {
    display: block;
    width: 60px;
    height: 60px;
    object-fit: contain;
    background-color: #f7f7f7;
    border-radius: 4px;
}
#main #memberinfo .retail td.productname a {
    color: #333333;
}
#main #memberinfo .retail td.productname a:hover {
    color: var(--wcc-link, #0066cc);
}
#main #memberinfo .history-area .rightnum {
    text-align: right;
    white-space: nowrap;
}

/*---- 会員情報編集フォーム ---*/
#main #memberinfo .customer_form th {
    font-weight: bold;
}

/*---- 退会ボタン（誤操作防止のため目立たせない） ---*/
#main .member-page #memberinfo .send input.deletemember {
    flex-basis: 100%;
    min-width: 0;
    margin: 1.5em auto 0;
    padding: 6px 12px;
    font-size: .85em;
    font-weight: normal;
    color: #b3261e;
    background-color: transparent;
    border: none;
    text-decoration: underline;
}
#main .member-page #memberinfo .send input.deletemember:hover {
    opacity: .75;
    color: #b3261e;
    background-color: transparent;
}


/* =========================================
   10. 会員登録完了・パスワード変更完了など
   ========================================= */
#main #wc_newcompletion #memberpages,
#main #wc_lostcompletion #memberpages,
#main #wc_changepasscompletion #memberpages {
    max-width: 760px;
    margin: 0 auto;
    padding: 2.5em 1.5em;
    line-height: 1.9;
    text-align: center;
    border: 1px solid #e5e5e5;
    border-radius: 8px;
}
#main #wc_newcompletion #memberpages p a,
#main #wc_lostcompletion #memberpages p a,
#main #wc_changepasscompletion #memberpages p a {
    color: #333333;
    background-color: #ffffff;
    border: 1px solid #cccccc;
    border-radius: 6px;
}


/* =========================================
   11. レスポンシブ
   ========================================= */

/*---- スマホ（〜619px） ---*/
@media screen and (max-width: 38.74em) {
    #main .cart_page_title,
    #main .member_page_title {
        font-size: 1.25em;
    }

    /* iOSで入力時にズームしないよう16px */
    #main .cart-page input[type="text"],
    #main .cart-page input[type="email"],
    #main .cart-page input[type="tel"],
    #main .cart-page input[type="password"],
    #main .cart-page select,
    #main .cart-page textarea,
    #main .member-page input[type="text"],
    #main .member-page input[type="email"],
    #main .member-page input[type="tel"],
    #main .member-page input[type="password"],
    #main .member-page select,
    #main .member-page textarea {
        font-size: 16px;
    }

    /* ステップ表示 */
    #main div.cart_navi li {
        padding: 10px 4px 10px 14px;
        font-size: 10px;
        clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 50%, calc(100% - 8px) 100%, 0 100%, 8px 50%);
    }
    #main div.cart_navi li:first-child {
        padding-left: 6px;
        clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 50%, calc(100% - 8px) 100%, 0 100%);
    }
    #main div.cart_navi li:last-child {
        clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 8px 50%);
    }

    /* ボタンは横幅いっぱい・主ボタンを上に（副ボタン → 退会の順に下へ） */
    #main .cart-page .send,
    #main .member-page .send {
        flex-direction: column;
        align-items: stretch;
    }
    #main .cart-page .send input.continue_shopping_button,
    #main .cart-page .send input.back_cart_button,
    #main .cart-page .send input.back_to_customer_button,
    #main .cart-page .send input.back_to_delivery_button,
    #main .cart-page .send input#back_button,
    #main .cart-page .send input[name="top"],
    #main .cart-page .send input[name="back"],
    #main .cart-page .send input[name="backCustomer"],
    #main .member-page .send input.top,
    #main .member-page .send input[name="top"],
    #main .member-page .send input[name="back"] {
        order: 1;
    }
    #main .member-page #memberinfo .send input.deletemember {
        order: 2;
    }
    #main .cart-page .send input[type="submit"],
    #main .cart-page .send input[type="button"],
    #main .cart-page .send a,
    #main .member-page .send input[type="submit"],
    #main .member-page .send input[type="button"],
    #main .member-page .send a,
    #main .cart-page .send input#purchase_button {
        width: 100%;
        min-width: 0;
    }
    #main .member-page #memberinfo .send input.deletemember {
        width: auto;
        align-self: center;
    }

    /* カートテーブル */
    #main #cart_table th,
    #main #cart_table td {
        padding: 10px 6px;
        font-size: .9em;
    }
    #main #cart_table .quantity input {
        width: 52px;
    }

    /* フォーム：氏名などの2分割欄 */
    #main .customer_form input#mailaddress1,
    #main .customer_form input#mailaddress2,
    #main .customer_form input#loginmail {
        width: 100%;
    }

    /* 注文完了 */
    #main #wc_ordercompletion #cart_completion {
        padding: 2em 1em;
        border: none;
    }
    #main #wc_ordercompletion #cart_completion table th,
    #main #wc_ordercompletion #cart_completion table td {
        display: block;
        width: auto;
    }
    #main #wc_ordercompletion #cart_completion table td {
        border-top: none;
    }

    /* ログインボックス */
    #main #wc_login .loginbox,
    #main #wc_member .loginbox,
    #main #wc_changepassword .loginbox,
    #main #wc_lostmemberpassword .loginbox {
        padding: 1.25em;
    }

    /* マイページ：サブメニュー */
    #main #memberinfo .member_submenu {
        flex-direction: column;
    }
    #main #memberinfo .member_submenu a {
        display: block;
        text-align: center;
    }
    #main #memberinfo .member_submenu .member-logout {
        margin-left: 0;
    }

    /* マイページ：購入履歴をカード表示（Welcartが出力する data-label を見出しとして利用） */
    #main #memberinfo #history_head,
    #main #memberinfo .retail {
        display: block;
        border: 1px solid #e5e5e5;
    }
    #main #memberinfo #history_head thead,
    #main #memberinfo .retail thead {
        display: none;
    }
    #main #memberinfo #history_head tbody,
    #main #memberinfo #history_head tr,
    #main #memberinfo .retail tbody,
    #main #memberinfo .retail tr {
        display: block;
    }
    #main #memberinfo #history_head td,
    #main #memberinfo .retail td {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        gap: 12px;
        padding: 8px 12px;
        font-size: .9em;
        text-align: right;
        border: none;
        border-bottom: 1px solid #f0f0f0;
    }
    #main #memberinfo #history_head td[data-label]::before,
    #main #memberinfo .retail td[data-label]::before {
        content: attr(data-label);
        flex-shrink: 0;
        font-weight: bold;
        color: #777777;
        text-align: left;
    }
    #main #memberinfo #history_head .order_head_value {
        background-color: #fafafa;
    }
    #main #memberinfo #history_head .order_head_value td {
        background-color: transparent;
    }
    #main #memberinfo .retail {
        margin: 0;
        border-top: none;
    }
    #main #memberinfo .retail tbody tr {
        border-bottom: 1px dashed #dddddd;
    }
    #main #memberinfo .retail tbody tr:last-child {
        border-bottom: none;
    }
    #main #memberinfo .retail td.cartrownum,
    #main #memberinfo .retail td.thumbnail {
        display: none;
    }
    #main #memberinfo .retail td.productname {
        display: block;
        font-weight: bold;
        text-align: left;
    }
    #main #memberinfo .retail td.productname::before {
        content: none;
    }
}

/*---- タブレット以上（620px〜） ---*/
@media screen and (min-width: 38.75em) {
    /* 親テーマは620px〜でマイページの編集フォームのみ表組みにする */
    #main #memberinfo .customer_form th {
        width: 28%;
        padding: 14px 16px;
        background-color: #f7f7f7;
        border: 1px solid #e5e5e5;
        vertical-align: middle;
    }
    #main #memberinfo .customer_form td {
        padding: 12px 16px;
        border: 1px solid #e5e5e5;
    }
    #main #memberinfo > table th,
    #main #memberinfo > table td {
        padding: 12px 16px;
    }
    #main #confirm_table th,
    #main #confirm_table td {
        padding: 12px 16px;
    }
}

/*---- 740px〜 ---*/
@media screen and (min-width: 46.25em) {
    #main .customer_form tr {
        border: none;
    }
    #main .customer_form th {
        width: 28%;
        padding: 14px 16px;
        background-color: #f7f7f7;
        border: 1px solid #e5e5e5;
    }
    #main .customer_form td {
        padding: 12px 16px;
        border: 1px solid #e5e5e5;
    }
    #main #confirm_table th {
        width: 28%;
    }
}

/*---- PC（1000px〜） ---*/
@media screen and (min-width: 62.5em) {
    /* 親テーマは購入履歴を高さ500pxの枠内スクロールにしているが、二重スクロールで見づらいため解除 */
    #main #memberinfo .history-area {
        max-height: none;
        overflow: visible;
        padding: 0;
        border: none;
    }
    #main #memberinfo h3 {
        font-size: 1.1em;
    }
    #main #memberinfo th {
        padding: 12px 16px;
    }
    #main #memberinfo #history_head th,
    #main #memberinfo .retail th {
        padding: 8px 10px;
    }
}