@font-face {
	font-weight: normal;
	font-style: normal;
	font-family: "woodmart-font";
	src: url("//modelab.store/wp-content/themes/woodmart/fonts/woodmart-font-1-300.woff2?v=8.2.2") format("woff2");
}

:root {
	--wd-text-font: 'MS Sans Serif', Geneva, sans-serif;
	--wd-text-font-weight: 500;
	--wd-text-color: rgb(37,37,37);
	--wd-text-font-size: 16px;
	--wd-title-font: 'MS Sans Serif', Geneva, sans-serif;
	--wd-title-font-weight: 500;
	--wd-title-color: rgb(37,37,37);
	--wd-entities-title-font: 'MS Sans Serif', Geneva, sans-serif;
	--wd-entities-title-font-weight: 500;
	--wd-entities-title-color: rgb(37,37,37);
	--wd-entities-title-color-hover: rgb(51 51 51 / 65%);
	--wd-alternative-font: "Yu-gothic-pr6n", Arial, Helvetica, sans-serif;
	--wd-widget-title-font: 'MS Sans Serif', Geneva, sans-serif;
	--wd-widget-title-font-weight: 500;
	--wd-widget-title-transform: uppercase;
	--wd-widget-title-color: rgb(37,37,37);
	--wd-widget-title-font-size: 14px;
	--wd-header-el-font: 'MS Sans Serif', Geneva, sans-serif;
	--wd-header-el-font-weight: 500;
	--wd-header-el-transform: uppercase;
	--wd-header-el-font-size: 14px;
	--wd-primary-color: rgb(105,135,171);
	--wd-alternative-color: rgb(190,160,112);
	--wd-link-color: rgb(31,65,112);
	--wd-link-color-hover: rgb(49,103,178);
	--btn-default-bgcolor: #f7f7f7;
	--btn-default-bgcolor-hover: #efefef;
	--btn-accented-bgcolor: rgb(105,135,171);
	--btn-accented-bgcolor-hover: rgb(129,166,211);
	--wd-form-brd-width: 1px;
	--notices-success-bg: rgb(117,183,115);
	--notices-success-color: #fff;
	--notices-warning-bg: rgb(224,191,118);
	--notices-warning-color: #fff;
	--wd-sticky-btn-height: 95px;
}
.wd-popup.wd-age-verify {
	--wd-popup-width: 500px;
}
.wd-popup.wd-promo-popup {
	background-color: rgb(255,255,255);
	background-image: none;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	--wd-popup-width: 800px;
}
.header-banner {
	background-color: rgb(255,232,246);
	background-image: none;
}
:is(.woodmart-archive-shop .wd-builder-off,.wd-wishlist-content,.related-and-upsells,.cart-collaterals,.wd-shop-product,.wd-fbt) .wd-products-with-bg, :is(.woodmart-archive-shop .wd-builder-off,.wd-wishlist-content,.related-and-upsells,.cart-collaterals,.wd-shop-product,.wd-fbt) .wd-products-with-bg :is(.wd-product,.wd-cat) {
	--wd-prod-bg:rgb(255,255,255);
	--wd-bordered-bg:rgb(255,255,255);
}
:is(.woodmart-woocommerce-layered-nav, .wd-product-category-filter) .wd-scroll-content {
	max-height: 223px;
}
.wd-page-title {
	background-color: rgb(245,244,240);
	background-image: none;
	background-size: cover;
	background-position: center center;
}
.wd-footer {
	background-color: rgb(105,135,171);
	background-image: none;
}
html .product-image-summary-wrap .product_title, html .wd-single-title .product_title {
	font-family: "Lato-700", Arial, Helvetica, sans-serif;
}
html .post.wd-post:not(.blog-design-small) .wd-entities-title {
	font-size: 22px;
}
html .product.wd-cat .wd-entities-title, html .product.wd-cat.cat-design-replace-title .wd-entities-title, html .wd-masonry-first .wd-cat:first-child .wd-entities-title {
	text-transform: capitalize;
}
html .page-title > .container > .title, html .page-title .wd-title-wrapp > .title, html .page-title .wd-breadcrumbs a, html .page-title .wd-breadcrumbs span, html .page-title .yoast-breadcrumb a, html .page-title .yoast-breadcrumb span, html .wd-checkout-steps li {
	font-weight: 600;
	font-size: 24px;
	line-height: 24px;
	color: rgb(140,120,85);
}
.page .wd-page-content {
	background-color: rgb(252,252,252);
	background-image: none;
}
.woodmart-archive-shop:not(.single-product) .wd-page-content {
	background-color: rgb(252,252,252);
	background-image: none;
}
.single-product .wd-page-content {
	background-color: rgb(252,252,252);
	background-image: none;
}
.woodmart-archive-blog .wd-page-content {
	background-color: rgb(252,252,252);
	background-image: none;
}
.single-post .wd-page-content {
	background-color: rgb(252,252,252);
	background-image: none;
}
.woodmart-archive-portfolio .wd-page-content {
	background-color: rgb(252,252,252);
	background-image: none;
}
.single-portfolio .wd-page-content {
	background-color: rgb(252,252,252);
	background-image: none;
}
.product-labels .product-label.onsale {
	background-color: rgb(234,129,107);
}
.wd-popup.popup-quick-view {
	--wd-popup-width: 920px;
}

@media (max-width: 1024px) {
	:root {
		--wd-sticky-btn-height: 95px;
	}
	html .post.wd-post:not(.blog-design-small) .wd-entities-title {
		font-size: 20px;
	}

}

@media (max-width: 768.98px) {
	:root {
		--wd-sticky-btn-height: 42px;
	}
	html .post.wd-post:not(.blog-design-small) .wd-entities-title {
		font-size: 18px;
	}
	html .page-title > .container > .title, html .page-title .wd-title-wrapp > .title, html .page-title .wd-breadcrumbs a, html .page-title .wd-breadcrumbs span, html .page-title .yoast-breadcrumb a, html .page-title .yoast-breadcrumb span, html .wd-checkout-steps li {
		font-size: 16px;
	line-height: 16px;
	}

}
:root{
--wd-container-w: 1050px;
--wd-form-brd-radius: 5px;
--btn-default-color: #333;
--btn-default-color-hover: #333;
--btn-accented-color: #fff;
--btn-accented-color-hover: #fff;
--btn-default-brd-radius: 35px;
--btn-default-box-shadow: none;
--btn-default-box-shadow-hover: none;
--btn-accented-brd-radius: 35px;
--btn-accented-box-shadow: none;
--btn-accented-box-shadow-hover: none;
--wd-brd-radius: 8px;
}



@font-face {
	font-family: "hkgroteskpro";
	font-weight: 300;
	font-style: normal;
}

@font-face {
	font-family: "hkgroteskpro";
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: "hkgroteskpro";
	font-weight: 500;
	font-style: normal;
}

@font-face {
	font-family: "hkgroteskpro";
	font-weight: 600;
	font-style: normal;
}

/* 請求先住所と配送先住所の「国」フィールドを見えないように隠す */
#billing_country_field,
#shipping_country_field {
    display: none !important;
}

/*
 * ポイント機能のスタイルを変更
 */

/* 
 * 変更1: ポイントログのアコーデオンのスタイル 
 */
.wps_wpr_view_log_notice {
    background-color: var(--brdcolor-gray-300);
    border-radius: 5px;
    margin-bottom: 15px;
	padding: 15px;
}

/*
 * 変更2: ポイントログのアコーディオンの表のスタイル 
*/
.wps_wpr_common_table thead th {
    padding-bottom: 10px !important;
}

/* 
 * 変更3: ポイント獲得方法のボックスシャドウ 
*/
.points_log, .wps_wpr_each_section, .wps_wpr_membership_with_img {
    box-shadow: none !important;
}

/* 
 * 変更4: カートの画面でのポイント適用スタイル 
*/
/* カート内のセクション間の間隔調整 */
.woocommerce-cart-form > .cart .cart-actions {
    gap: 15px !important;
}

/* ポイント適用エリアの基本スタイル */
.wps_wpr_apply_custom_points {
    display: flex;
    flex-wrap: wrap !important;
    flex-grow: 1;
    gap: 10px;
    text-align: start;
    margin-bottom: 0 !important;
}

/* チェックアウトページのポイント欄の先頭アイコンを非表示にする */
.custom_point_checkout.woocommerce-info::before {
    display: none !important;
}

/* ポイント入力欄のスタイル */
#wps_cart_points {
    width: 100%;
    height: var(--wd-form-height);
    padding: 0 15px;
    border: var(--wd-form-brd-width) solid var(--wd-form-brd-color) !important;
    border-radius: var(--wd-form-brd-radius) !important;
    color: var(--wd-form-color);
    font-size: 14px !important;
    text-align: left !important;
    margin: 0 !important;
		background-color: #fcfcfc !important;
    -moz-appearance: textfield; /* Firefox用 */
}

/* 数値入力の上下矢印を非表示に */
#wps_cart_points::-webkit-inner-spin-button,
#wps_cart_points::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* プレースホルダーテキストのスタイル */
#wps_cart_points::placeholder {
    font-size: 14px !important;
    text-align: left !important;
}

/* ポイント適用ボタンのスタイル */
.wps_wpr_apply_custom_points .button {
    flex: 0 0 auto;
    font-size: var(--btn-font-size, 13px) !important;
    min-height: var(--btn-accented-min-height, var(--btn-min-height, 42px)) !important;
    border-radius: var(--btn-accented-brd-radius) !important;
    color: var(--btn-accented-color);
    box-shadow: var(--btn-accented-box-shadow);
    background-color: var(--btn-accented-bgcolor);
    text-transform: var(--btn-accented-transform, var(--btn-transform, uppercase));
    font-weight: var(--btn-accented-font-weight, var(--btn-font-weight, 600));
    padding: var(--btn-accented-padding, var(--btn-padding, 0 20px)) !important;
    margin-left: 0 !important;
    margin-bottom: 0 !important;
}

/* 利用可能ポイントテキストのスタイル */
.wps_wpr_restrict_user_message {
    width: 100% !important;
    margin-top: 5px !important;
    margin-bottom: 2px !important;
    margin-left: 0 !important;
    display: block;
    clear: both !important;
}

/* PC表示でのレイアウト調整 */
@media (min-width: 769px) {
    /* クーポン入力欄とポイント入力欄の共通スタイル */
    .wps_wpr_apply_custom_points,
    .wd-coupon-form {
        width: 100%;
        margin-bottom: 5px !important;
    }
    
    /* レイアウト調整 */
    .wps_wpr_apply_custom_points {
        display: flex;
        align-items: center;
        gap: 10px !important;
        justify-content: flex-start !important;
    }
    
    /* 入力欄の幅を統一 */
    #wps_cart_points {
        max-width: 230px !important;
        width: 230px !important;
        flex: 1;
        min-width: 0;
    }
    
    .wd-coupon-form #coupon_code {
        flex: 1;
        min-width: 0;
    }
    
    /* ボタンスタイル */
    .wps_wpr_apply_custom_points .button,
    .wd-coupon-form .button {
        width: auto;
        white-space: nowrap;
    }
}

/* モバイル表示でのレイアウト調整 */
@media (max-width: 768.98px) {
    /* フォームのレイアウト */
    .wps_wpr_apply_custom_points {
        padding: 25px;
        border: 2px dashed var(--brdcolor-gray-300);
        border-radius: var(--wd-brd-radius);
        background-color: transparent !important; /* 背景を透明に */
        box-shadow: none !important; /* 影を削除 */
        flex-direction: column;
        order: 3 !important;
        margin-bottom: 15px !important; /* クーポンとの間隔を調整 */
    }
    
    /* クーポン欄の順序と余白 */
    .wd-coupon-form {
        order: 2 !important;
        margin-bottom: 15px !important;
    }
    
    /* ボタンの高さ調整 */
    .wps_wpr_apply_custom_points .button,
    .wd-coupon-form .button {
        height: var(--wd-form-height) !important;
        line-height: var(--wd-form-height) !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        min-height: var(--btn-accented-min-height, var(--btn-min-height, 42px)) !important;
    }
}

/* 元のスタイルシートにある不要なmargin-top上書き */
.wps_wpr_apply_custom_points {
    margin-top: 0 !important;
    clear: both;
}

/* 
 * 変更5: チェックアウトの画面でのポイント適用スタイル 
*/
/* クーポンフォームの下部余白 */
.woocommerce-form-coupon {
    margin-bottom: 30px !important;
}

/* トグル部分のスタイル（アコーディオンヘッダー） */
:root :is(.woocommerce-form-coupon-toggle, .woocommerce-form-points-toggle) > div {
    display: inline-flex;
    gap: 5px 7px;
    padding: 0 !important;
    min-height: 0;
    background-color: transparent !important;
    color: var(--color-gray-900) !important;
    font-weight: 600;
    text-align: unset;
    width: 100%;
    justify-content: space-between;
}

/* PC表示ではトグルを左詰めに */
@media (min-width: 769px) {
    :root :is(.woocommerce-form-coupon-toggle, .woocommerce-form-points-toggle) > div {
        justify-content: flex-start;
    }
}

/* リンク部分のスタイル */
.woocommerce-form-points-toggle .woocommerce-info a.showpoints {
    color: var(--wd-primary-color) !important;
    text-decoration: underline !important;
}

/* ボーダーとアイコンを削除 */
:is(.woocommerce-form-coupon-toggle, .woocommerce-form-points-toggle) .woocommerce-info {
    border-top: none !important;
}

.woocommerce-form-points-toggle .woocommerce-info:before {
    display: none !important;
}

/* ポイント入力フォーム - 初期状態は非表示 */
.custom_point_checkout {
    display: none !important;
}

/* 表示状態のポイント入力フォーム全体のスタイル */
.custom_point_checkout:not([style*="display: none"]) {
    position: relative;
    display: flex !important;
    flex-wrap: wrap !important;
    margin-bottom: 30px !important;
    padding: 30px !important;
    background-color: #FFFFFF !important;
    border: 2px solid var(--brdcolor-gray-200) !important;
    border-radius: var(--wd-brd-radius) !important;
    text-align: start !important;
    width: 100% !important;
    max-width: 470px !important;
}

/* 入力欄のスタイル */
.custom_point_checkout input#wps_cart_points {
    flex: 1 1 auto !important;
    padding: 0 15px !important;
    height: 42px !important;
    border: var(--wd-form-brd-width) solid var(--wd-form-brd-color) !important;
    border-radius: var(--wd-form-brd-radius) !important;
    background-color: var(--wd-form-bg) !important;
    color: #767676 !important;
    font-size: 14px !important;
    margin-right: 15px !important;
}

/* プレースホルダーの色 */
.custom_point_checkout input#wps_cart_points::placeholder {
    color: #252525 !important;
}

/* ボタンのスタイル */
.custom_point_checkout button {
    flex: 0 0 auto !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 20px !important;
    border-radius: var(--btn-accented-brd-radius) !important;
    color: var(--btn-accented-color) !important;
    background-color: var(--btn-accented-bgcolor) !important;
    font-size: 13px !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    font-weight: normal !important; /* 太字を解除 */
    border: none !important;
    box-shadow: var(--btn-accented-box-shadow) !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
		font-weight: bold !important;
}

/* 「100ポイント = ¥100」の部分 */
.custom_point_checkout p {
    width: 100% !important;
    margin-top: 15px !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    font-size: 14px !important;
    color: #767676 !important;
}

/* ¥100の文字色 */
.custom_point_checkout .woocommerce-Price-amount,
.custom_point_checkout .woocommerce-Price-currencySymbol {
    color: #767676 !important;
}

/* レスポンシブ対応 - 画面サイズに応じた調整 */
/* 470px~421pxの間の動作（入力欄のみ縮小） */
@media (max-width: 470px) and (min-width: 421px) {
    .custom_point_checkout:not([style*="display: none"]) {
        max-width: 100% !important;
    }
    
    .custom_point_checkout input#wps_cart_points {
        width: auto !important;
        flex: 1 !important;
    }
}

/* 420px以下での動作（ボタンが改行） */
@media (max-width: 420px) {
    .custom_point_checkout {
        flex-direction: column !important;
    }
    
    .custom_point_checkout input#wps_cart_points {
        width: 100% !important;
        max-width: 100% !important;
        margin-right: 0 !important;
        margin-bottom: 15px !important; /* 上下の間に15pxのギャップ */
    }
    
    .custom_point_checkout button {
        width: auto !important;
        align-self: flex-start !important; /* 左揃えに */
        margin-left: 0 !important; /* 左余白をなくす */
    }
    
    .custom_point_checkout:not([style*="display: none"]) {
        max-width: 100% !important;
    }
}

/* トグル部分（アコーディオンヘッダー）の下部マージン追加 */
.woocommerce-form-coupon-toggle .woocommerce-info,
.woocommerce-form-points-toggle .woocommerce-info {
    margin-bottom: 10px !important;
		flex-wrap: wrap;
}

/* 上下のマージンを個別に0に設定 */
:is(.wd-checkout-login,.wd-checkout-coupon) :is(.woocommerce-form-coupon,.woocommerce-form-login.hidden-form) {
    margin-top: 0 !important;
    margin-bottom: 30px !important;
}


/* クーポンコード入力フォームの背景色とスタイルを調整 */
.checkout_coupon.woocommerce-form-coupon {
    background-color: #FFFFFF !important;
}




/* --- ポイント割引の行のレイアウト＆デザイン調整 --- */
tr.cart-discount:has(a.wps_remove_virtual_coupon) td {
    text-align: end;
    padding-inline-end: 0;
}

a.wps_remove_virtual_coupon {
    /* 基本スタイル */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    font-size: 0;
    vertical-align: middle;
    margin-inline-end: -10px;
}


a.wps_remove_virtual_coupon::before {
    font-family: "woodmart-font";
    content: "\f112";
    font-size: calc(var(--wd-text-font-size, 14px) / 1.2);
    transition: all .25s ease;
    color: var(--color-gray-800);
}


a.wps_remove_virtual_coupon:hover::before {
    color: var(--color-gray-500) !important;
}

/* 請求先情報フォームの上に余白を作り、上のブロックとの間隔を空ける */
form.checkout.woocommerce-checkout {
    margin-top: 2em;
}

/* 「請求先情報の詳細」の見出しのスタイル */
.woocommerce-billing-fields h3,

/* 「ご注文」の見出しのスタイル */
#order_review_heading {
    font-size: 25px;
    margin-bottom: 25px;
}

/* WooCommerce決済ロゴのカスタマイズ */

/* 不要なロゴとカウンターを非表示にする */
.payment_method_woocommerce_payments img[alt="amex"],
.payment_method_woocommerce_payments img[alt="discover"],
.payment-methods--logos-count {
    display: none !important;
}

/* ラベル内の画像をすべて右寄せにする */
label[for="payment_method_ml_paymentoptions"] img {
}


#wc-ml_paymentoptions-cc-form label {
	font-weight: 500;
}

/* カード番号入力欄の横にあるアイコン用のスペースを非表示にする */
.ml-paymentoptions-card-icon {
    display: none !important;
}


/* 姓名フィールドの親要素をflexコンテナーにする */
.woocommerce-EditAccountForm {
  display: block;
}

.woocommerce-EditAccountForm .form-row-first,
.woocommerce-EditAccountForm .form-row-last {
  display: inline-block !important;
  width: calc(50% - 10px) !important;
  vertical-align: top !important;
}

.woocommerce-EditAccountForm .form-row-first {
  margin-right: 20px !important;
}

/* 姓名フィールドコンテナー */
.name-fields-container {
  display: flex !important;
  gap: 20px !important;
  flex-wrap: nowrap !important;
}

.name-fields-container .form-row {
  flex: 1 !important;
  min-width: 0 !important;
}

label[for="payment_method_ml_paymentoptions"] img {
    height: 24px !important;
    max-height: 24px !important;
}


