@charset "utf-8";


/* subscription */


/* ================================================================= */

/* 商品詳細 */

/* ================================================================= */

/* 定期購入/通常購入全体枠　余白 */
.detail_block_subscription_price:has(.subscription_sales_box):has(.regular_sales_box) {
    padding: 10px 0;
}

/* 定期購入/通常購入各枠　余白 */
.detail_block_subscription_price:has(.subscription_sales_box):has(.regular_sales_box) .detail_section {
    padding-top: 10px;
    padding-bottom: 10px;
}

/* 定期購入/通常購入ラジオボタン */
.purchase_method_normal input[type="radio"],
.purchase_method_subscription input[type="radio"] {
    margin-right: 10px;
}

/* 定期購入/通常購入ラジオボタンラベル */
.price_parent_section .sales_label {
    font-weight: 600;
    font-size: 123.1%;
}

/* 定期購入/通常購入　価格枠 */
.price_parent_section .price_section {
    margin: 5px 0 0;
}

/* 通常+定期商品の詳細で、通常購入の選択欄内の在庫表示で、在庫切れ商品時に販売価格を表示しない設定時の余白指定 */
.price_section_stock {
    margin-top: 5px;
}

/* @type {string} 在庫管理する時(通常購入)に在庫表枠につけるclass名 */
.without_stock_list_label .only_subscription_radio {
    display: inline-block;
    pointer-events: auto;
}

/* @type {string} 在庫管理しない時(定期購入)に在庫表枠につけるclass名 */
.enabled_stock_control .only_subscription_radio {
    display: none;
    pointer-events: none;
}

/* バリエーション在庫 && 通常商品の在庫切れがある && 在庫表示設定で在庫表示しない場合 */
/* 通常購入を選択でdisabledなラジオボタンを表示したい */
.enabled_stock_control.stock_display_hidden .only_subscription_radio {
    display: inline-block;
}

/* バリエーション在庫 && 通常商品の在庫切れがある && 在庫表示設定で在庫表示しない && 再入荷お知らせありの場合 */
/* 通常購入を選択で在庫表の在庫切れとなっているラジオボタンを表示させない */
.enabled_stock_control.stock_display_hidden .restocklink + .only_subscription_radio {
    display: none;
}


/* ================================================================= */
/* 定期購入について枠
/* ================================================================= */

/* 定期購入について枠 */
.detail_subscription_info_data {
    margin: 0px;
    padding: 10px 5px;
    box-sizing: border-box;
}

/* 定期購入についてtable */
.detail_subscription_info_data .data_table {
    table-layout: fixed;
}

/* 定期購入について　※左列スマホ120px/パソコン200px */
.detail_subscription_info_data .data_table .cell_header {
    width: 120px;
}

/* 定期購入についてのお届けサイクルラベル　※月ごとなど */
.cycle_month_header,
.cycle_week_header {
    font-weight: bold;
}

/* 定期購入について お届けサイクル各サイクル情報　※1ヶ月など */
.cycle_overview_element {
    display: inline-block;
}

/*　定期購入について お届けサイクル区切りスラッシュ */
.detail_subscription_info_data .slash {
    margin-left: 3px;
    margin-right: 3px;
}

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

@media screen and (min-width: 480px) {
    .responsive .detail_subscription_info_data {
        padding-left: 10px;
        padding-right: 10px;
    }
}

@media screen and (min-width: 840px) {
    .detail_subscription_info_data .data_table .cell_header {
        width: 200px;
    }
}


/* ================================================================= */

/* カート */

/* ================================================================= */


/* ================================================================= */
/* カートステップ2　お届けサイクル */
/* ================================================================= */

/* お届けサイクル枠 */
.cart_subscription_cycle_data #subscription_cycle {
    margin-top: 10px;
	  padding: 15px;
    background-color: #F9F9F9;
}

/* 2回目以降のお届けサイクルラベル */
.cycle_label {
    font-weight: 600;
    font-size: 123.1%;
}

/* 月ごと/週ごと各枠 */
.cycle_list {
    padding: 10px 5px;
}

/* 月ごと/週ごとラベル */
.cycle_list_label {
    font-size: 108%;
    font-weight: 700;
}

/* 月ごと/週ごとラジオボタン */
.cycle_list input[type="radio"] {
    margin-right: 10px;
}

/* 月ごと/週ごとセレクトボックス枠 */
.cycle_list .cycle_list_select {
    margin-top: 5px;
}

.cycle_list_select select:first-child {
    margin-right: 3px;
}

.cycle_list_select select:not(:first-child):not(:last-child) {
    margin-right: 4px;
}

.cycle_list_select select {
    margin-bottom: 2px;
}

/* 月ごと/週ごと　「ごと」 */
.per_month_label_string,
.per_week_label_string {
    font-size: 108%;
    margin-right: 6px;
    vertical-align: middle;
}

/* お届け目安/お届けサイクル/継続回数枠 */
.subscription_cycle .shipping_box {
    padding: 10px 0 0;
}

/* お届け目安枠 */
.subscription_cycle .shipping_data_box {
    padding: 5px;
}
.subscription_cycle .inner_shipping_data_box {
    font-size: 100%;
    padding: 5px 0;
}

/* お届け目安/お届けサイクル/継続回数ラベル */
.subscription_cycle .shipping_label {
    border-bottom: 1px solid #E0DFE3;
    padding-bottom: 5px;
    font-size: 100%;
    font-weight: 700;
}

/* お届け目安　初回/2回目お届け日各枠 */
.subscription_cycle .shipping_date {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

/* お届け目安　初回/2回目お届け日各ラベル　※初回お届け日など */
.subscription_cycle .shipping_date_label {
    display: inline-block;
    min-width: 45px;
}
.large_font .subscription_cycle .shipping_date_label {
    min-width: 50px;
}

/* お届け目安　日時/サイクル/継続回数太字　※2025年2月14日(金)/2週間ごと 火曜日など */
.subscription_cycle .shipping_day,
.subscription_cycle .shipping_time,
.subscription_cycle .cycle_day {
    font-weight: 700;
}

/* お届け目安　日時 ※左右余白 */
.subscription_cycle .shipping_day {
    margin: 0 5px;
    letter-spacing: .03em
}

/* お届け目安　注意書き */
.subscription_cycle .shipping_desc {
    font-size: 93%;
}

/* お届け日時選択欄の初回お届け日時ラベル */
.subscription_first_delivery_date_label {
    font-weight: 600;
    font-size: 123.1%;
}

/* ================================================================= */
/* カートステップ3　最終確認 */
/* ================================================================= */

/* 初回合計金額　2回目以降価格　価格 */
.grand_total_second_price .grandtotal_price {
    font-size: 116%;
    font-weight: bold;
}

/* 内訳表示時　オーバーレイ */
.cart_second_price_breakdown_overlay .overlay_front {
    max-width: 320px;
}

/* 内訳ボタン */
.cart_second_price_breakdown {
    padding: 40px 15px;
}

/* 内訳　2回目以降価格の内訳タイトル */
.cart_second_price_breakdown .section_title {
    margin-bottom: 5px;
}

/* 内訳　価格欄 */
.cart_second_price_breakdown .cart_price_box {
    text-align: right;
}

/* ポイント、クーポン利用時　OKメッセージ　※初回価格のみ適用など */
.subscription_coupon_point_use_message {
    display: inline-block;
    font-size: 77%;
}

/* 定期購入情報　各タイトル */
.disp_subscription_info_label {
    font-weight: 700;
    display: inline-block;
}

/* 定期購入情報　各内容 */
.cycle_change_info .cycle_change_desc {
    inline-size: fit-content;
    margin-inline: auto;
}


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

@media screen and (min-width: 580px) {
    #subscription_cycle {
        padding: 15px;
    }

    .cycle_list {
        padding: 10px;
    }

    .cycle_list_label {
        font-size: 116%;
    }

    .subscription_cycle .shipping_box {
        padding: 10px 10px 0;
    }

    .subscription_cycle .inner_shipping_data_box {
        font-size: 108%;
    }

    .subscription_cycle .shipping_label {
        font-size: 108%;
    }
}

@media screen and (min-width: 600px) {
    .disp_subscription_info_label {
        min-width: 180px;
    }
}


/* ================================================================= */

/* 定期購入/通常購入の切り替えタブの各タブ幅 */

/* ================================================================= */

.page_box .page_contents .subscription_tab_nav.tablayout_navigation.anchor_nav_area .wrapped_item.tab_nav_item {
    width: 50%;
}


/* ================================================================= */

/* マイページ */

/* ================================================================= */

/* 定期購入ポイント利用リンク */
.subscription_point_link_box {
    padding-top: 0;
}

/* お届け予定日　日付 */
.subscription_history_data .history_purchase_date .date_with_day_of_week,
.subscription_history_data .history_reg_date .date_with_day_of_week {
    font-size: 100%;
}
.subscription_history_data .history_reg_date .date_with_day_of_week {
    margin-left: 2px;
}


/* ================================================================= */
/* 定期内容 */
/* ================================================================= */

/* スキップ/解約枠 */
.subscription_history_data .inner_contents_box.box_both_ends_space {
    padding: 5px;
}

/* スキップ・解約期限注意書き枠　※スキップ・解約をご希望の場合は～ */
.subscription_history_data .shipping_cycle_change {
    padding-bottom: 0;
}

/* スキップ・解約期限注意書き（.passed_skip_deadline_message）がある時にブロック要素にする ※左寄せ用 */
.inner_cycle_change_info:has(.passed_skip_deadline_message) {
    display: block;
}
/* ブロック要素にする ※左に余白入れる用 */
.inner_cycle_change_info .passed_skip_deadline_message {
    display: block;
    padding: 0 10px
}

/* スキップ・解約期限日付　※2025年3月21日(金) */
.inner_cycle_change_info .date_with_day_of_week {
    display: inline-block;
    font-weight: 700;
    font-size: 116%;
}

/* スキップ/解約/お問い合わせボタン枠 */
.subscription_history_data .form_btn_npad {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
}
.large_font .subscription_history_data .form_btn_npad .btn_size_fit {
    width: auto;
}

/* スキップ/解約ボタンまたはスキップ・解約注意書きがある時は注意書き枠下部に余白  */
.subscription_history_data .cycle_change_info:has(.global_btn) .shipping_cycle_change,
.subscription_history_data .cycle_change_info:has(.cycle_desc) .shipping_cycle_change {
    padding-bottom: 10px;
}

/* スキップ/解約注意書き(自由記入欄) */
.cycle_change_info .cycle_desc {
    padding: 10px 5px;
    margin: 10px 5px;
    border-left: none;
    border-right: none;
}
.inner_cycle_change_info + .form_btn_npad:not(:has(button)) + .cycle_desc,
.inner_cycle_change_info + .cycle_desc {
    margin-top: 0px;
}
.cycle_change_info:not(:has(.inner_cycle_change_info)) .cycle_desc {
    border: none;
    padding: 0;
    margin: 0;
}


/* ================================================================= */
/* スキップ/解約クリック時　スキップ/解約画面モーダル */
/* ================================================================= */

/* スキップ/解約画面モーダル枠 */
.overlay_area .cycle_change_info {
    padding: 30px 20px;
    margin-bottom: 0;
}

/* スキップ/解約画面モーダル内ボタン */
.overlay_area .cycle_change_info .btn_box {
    margin-bottom: 0;
}

/* モーダル閉じるボタン */
.overlay_area .cycle_change_info .btn_box .form_btn_npad {
    margin-top: 5px;
}

/* スキップ/解約画面モーダル内スキップ期限枠右余白 */
.inner_cycle_change_info .shipping_cycle_skip {
    margin-right: 10px;
}

/* スキップ/解約画面モーダル内説明 ※スキップする場合は 「スキップする」ボタンをクリックして下さい。 */
.cycle_change_info .cycle_change_desc {
    padding-top: 5px;
}

/* 解約画面モーダル説明　※（お届け予定日: 2025年3月9日(日)）から解約が適用～ */
.next_delivery_date_note,
.next_delivery_date_value {
    display: inline-block;
}


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

@media screen and (max-width: 600px) {
    /* 定期購入ID */
    .subscription_order_id_info {
        margin-top: 5px;
        margin-left: 0;
    }
}


/* ================================================================= */

/* エラー表示 */

/* ================================================================= */

/* ================================================================= */
/* error_cycle_info */
/* ================================================================= */

.error_cycle_info .error_box {
    margin: 5px;
}

.error_cycle_info .error_status {
    font-size: 100%;
}

.error_cycle_info .global_bottom_info {
    margin-top: 0;
}

.error_cycle_info .form_btn {
    padding-top: 10px;
}


/* ================================================================= */
/* mypage_error_box */
/* ================================================================= */

.mypage_error_box {
    padding: 8px;
}

#subscription_scheduled_orders .mypage_error_box {
    margin-bottom: 0;
}

.mypage_error_box .error_status {
    padding-left: 0;
}

.mypage_error_box .error_list {
    padding: 2px 0 0 23px;
    font-size: 12px;
}

.mypage_error_box .error_list A {
    font-size: 12px;
    text-decoration: underline;
}

.mypage_history .list_item_data .error_icon .fa {
    width: 8px;
    height: 8px;
    margin-top: -1px;
    line-height: 8px;
    font-size: 9px;
}