@charset "UTF-8";
/* ============================================================
  1. COMMON (共通)
============================================================ */

body {
	background-color: #000;
	color: #fff; 
} 
a {
	color: #cdcdcd; /* リンクテキスト */
	text-decoration: none;
}
a:hover {
	color: #fff;
	text-decoration:underline ;
}
/* マウスでクリックした時だけ、あの気になる点線を消す */
:focus:not(:focus-visible) {
    outline: none !important;
}
/* ロゴ画像専用のスタイル */
.header_logo {
    width: 40% !important; /* 横幅を50%に固定 */
    height: auto !important; /* 縦横比を維持 */
    display: block;        /* 余白調整をしやすくするためブロック化 */
}
/* 検索フォーム */
.s-box {
	background-color: #222 !important; /* ここに好きな色のカラーコードを入力 */
	border: none !important;
	border-radius: 5px;
	padding: 0px 0px;
}
/* 検索フォームのアイコン */
.s-box .searchsubmit {
    color: #fff !important;
	margin-left: -2px;
	margin-right: 1px;
}
/* メインnavi下部に全てのページで余白を追加 */
#site-navigation {
        margin-bottom: 24px;
}
/* パンくずリスト */
.breadcrumbs {
    max-width: 1000px; /* サイトのコンテンツ幅に合わせて調整してください */
    margin: 0px auto;  /* 上下に20pxの隙間を作り、左右中央に配置 */
    padding: 0 12px;    /* 画面端に密着しないよう左右に余白 */
    font-size: 0.9em;   /* 文字サイズを少し小さく */
    color: #fff;        /* 文字色をグレーに */
}
/* リンクの色を調整 */
.breadcrumbs a {
    color: #0082d9;     /* リンクの色 */
    text-decoration: none;
}
.breadcrumbs a:hover {text-decoration: underline; /* ホバー時に下線を表示 */}

/* トップ画像のコンテナ設定 */
.main-image {
    max-width: 920px;   /* 最大幅を800pxに制限 */
    max-height: 400px;
    margin: 0 auto;     /* 左右中央に配置 */
    overflow: hidden;   /* はみ出し防止 */
}
/* トップ画像自体の設定 */
.main-image img {
    display: block;
    width: 100%;        /* 親要素(800px)に対して100% */
    height: 400px;      /* 高さを400pxに固定 */
    object-fit: cover;  /* 画像を歪ませず、枠に合わせて切り取る */
    object-position: center; /* 中央を基準に表示 */
}

/* グリッド画像のスライドTOP */
.top-grid {
    /* 1. absolute を relative に変更（これで高さが認識されます） */
    position: relative; 
    /* 2. 横幅を維持して中央に寄せる */
    width: 920px;
    height: 440px;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    background: #111;
    border: 1px #00a0e9 solid;
    /* 3. おすすめアイテムとの間に好きなだけ隙間を作る */
    margin-bottom: 0px;
}

/* slickスライド_画像のコンテナ設定 */
.slide-items {
    max-width: 920px;   
    margin: 0 auto; /* 左右中央に配置 */
}
/* slickスライド_画像自体の設定 */
.slide-items img {
    width: 100%;        
    height: 400px; 
    object-fit: cover;
    display: block; /* ブロック要素にしてマージンを有効にする */
}
/* slickスライド_ドットの位置を画像の上に被せる */
.slick-dots {
  bottom: 12px; /* 下からの位置を調整 */
}
/* slickスライド_ドットの基本色（半透明の白） */
.slick-dots li button:before {
  color: #0082d9 !important; /* 文字色を白に */
  opacity: 0.3;           /* 未選択時は少し薄くする */
}
/* slickスライド_表示中のドットの色（くっきりした白） */
.slick-dots li.slick-active button:before {
  color: #0082d9 !important;
  opacity: 1;             /* アクティブ時は不透明に */
}
/* slickスライド_ドットのサイズを大きくする */
.slick-dots li button:before {
  font-size: 12px; /* デフォルトは6px程度 */
}
/* slickスライド_ドットを押したときの枠をなくす */
.slick-dots li button:focus {
    outline: none !important;
}
/* 共通スタイル：位置やサイズの調整 */
.slick-prev, .slick-next {
    z-index: 1;
    width: 40px;
    height: 40px;
}
/* 矢印の記号を自作（Font Awesomeや画像を使用する場合） */
.slick-prev::before {
    content: '〈'; /* 任意の文字やUnicode */
    font-size: 40px;
    color: #00a6ff; /* 矢印の色 */
    opacity: 1;
}
.slick-next::before {
    content: '〉'; /* 任意の文字やUnicode */
    font-size: 40px;
    color: #00a6ff; /* 矢印の色 */
    opacity: 1;
}

/* トップ画下のテーマオプション */
#main.one-column #content {
	max-width: 900px;   /* トップ同様 */
    margin: 0 auto;     /* 左右中央に配置 */
}
/* テーマオプションのタイトル */
.category-title {
    font-size: 1.0rem;
    margin: 0;
    margin-bottom: -35px !important;
    padding: 10px 15px 10px 15px !important;
    color: #0099ff;
    border: #0099ff 1px solid;
    border-bottom: none !important;
}
/* テーマオプション内部 */
.front-il {
    margin-top: 0px !important;
    padding: 0 40px 15px 40px !important;
    border: #0099ff 1px solid;
    border-top: none !important;
}
.front-il .itemprice {
    display: none !important; /* 価格非表示*/
}
.front-il .itemname {
    font-size: 11px !important;
    font-weight: normal !important;
    line-height: 1.6em !important;
    letter-spacing: 0.0em !important;
    margin-top: 8px !important;
}

/* 各ウィジェットのタイトルカラー（共通） */
#secondary h3 {
    color: #0099ff !important;
	border-bottom: 1.5px solid #0099ff !important;
    margin-bottom: 10px !important;
}

/* トップページのサイドバー（セカンダリー） */
/* ログインウィジェットのボタン配色 */
.widget_welcart_login {
    margin-bottom: 20px !important;
}
.widget_welcart_login input#member_loginw,
.widget_welcart_login input#member_login {
    background-color: #0099ff !important;
    padding: 14px 6px !important;
    border-radius: 5px !important;
	margin-top: 10px !important;
    margin-bottom: 10px !important;
}
.widget_welcart_login input#member_loginw:hover,
.widget_welcart_login input#member_login:hover {
    opacity: 0.7 !important;
}
.widget_welcart_login label{
    font-size: 12px !important;
    line-height: 1.6em !important;
}
/* リンク */
.widget_welcart_login .loginbox a {
	font-size: 12px !important;
}
/* ログイン後の「〇〇様」の文字色 */
.widget_welcart_login .loginbox div {
    color: #00a6ff !important; /* 任意の色を指定 */
	margin-left: 13px !important;
    margin-bottom: 2px !important;
    font-size: 13px !important;
}
/* 共通ウィジェット（ welcartベストセラー ） */
.widget_welcart_bestseller li {
    margin-top: -5px !important;
}
.widget_welcart_bestseller .itemname {
    width: 60% !important;
}
.widget_welcart_bestseller .itemname a {
    font-size: 11px !important;
    line-height: 1.6em;
}
.widget_welcart_bestseller .itemimg {
    width: 36% !important;
}
.widget_welcart_bestseller .itemsoldout {
    text-align: left !important;
}
.widget_welcart_bestseller .itemsoldout::before {
    content: "※" !important;
}
.widget_welcart_bestseller .itemprice {
    display: none !important;
}
/* ホームウィジェット右：投稿一覧ウィジェットの仕様 */
.widget_welcart_post li a {
	pointer-events: none; /* クリックを無効化 */
	cursor: default;      /* カーソルを指マークにしない */
	text-decoration: none; /* 下線を消す */
    font-size: 13px !important;
    font-weight: bold;
	color:#00a6ff !important;
    margin-bottom: 0px !important;
	color: inherit;       /* 文字色を親要素と同じにする */
}
.widget_welcart_post li a::before {
    content: "❯"; /* 好きな記号や絵文字に変更してください */
    color: #00a6ff;   /* 記号の色 */
	font-size: 1.1em;
	margin-right: 3px;
}
.widget_welcart_post li p {
	margin-bottom: 4px !important;
    font-size: 11px !important;
    line-height: 1.7em !important;
}

.banner-category {
    display: block !important;
    width: 95%;
    margin: 0 auto;
    padding: 0 auto;
}

/* --- ホームウィジェット：3連バナーの基本構造 --- */
.home .banner-flex-container {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px;
    box-sizing: border-box;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 30px 5px !important;
    border-top: #0099ff  1.5px solid;
}
.home .banner-link {
/*  flex: 0 0 calc(50% - 8px) !important;
    box-sizing: border-box; */
    display: block !important;
    margin-bottom: 15px;
}
.home .banner-link img {
    width: 100%;
    height: auto;
    display: block; 
}
/* --- ホーム以外のウィジェットバーバナー：縦1列で並べる --- */
.banner-flex-container {
    display: block; /* 初期値は縦並び */
    width: 100%;
    margin-top: 0px !important;
    padding: 25px 0px !important;
    border-top: #0099ff  1.5px solid;
}
.banner-link {
    display: block !important;
    padding: 0 15px;
    margin-bottom: 25px; /* 縦並びの時の隙間 */
    width: 100% !important;
    box-sizing: border-box;
}

/* Welcart カテゴリーのアイコンを変更 */
/* 元のカテゴリーアイコン（imgタグ）を消す */
.widget_welcart_category h3 img {
    display: none !important;
}
/* 「SELL DVD」にオリジナルアイコンを表示 */
#welcart_category-5 h3,
#welcart_category-6 h3,
#welcart_category-9 h3,
#welcart_category-10 h3 {
    background-image: url("/active2/wp-content/themes/welcart_basic-child/images/icon_dvd.png"); 
    background-repeat: no-repeat;
    background-size: 20px 20px; /* アイコンのサイズ */
    background-position: 1px 0px;
    padding-bottom: 7px !important; /* ★見出し全体と下のリストとの間の隙間 */
    padding-left: 31px !important;
}
/* 「SELL MOVIE」にオリジナルアイコンを表示 */
#welcart_category-7 h3,
#welcart_category-8 h3,
#welcart_category-11 h3 {
    background-image: url("/active2/wp-content/themes/welcart_basic-child/images/icon_movie.png"); 
    background-repeat: no-repeat;
    background-size: 20px 20px; /* アイコンのサイズ */
    background-position: 1px 0px;
    padding-bottom: 7px !important; /* ★見出し全体と下のリストとの間の隙間 */
    padding-left: 31px !important;
}

/* 各ページのタイトルデザイン */
#content header {
	margin-bottom: 20px;
}
#content h1.page-title,
#content h1.entry-title {
	padding-bottom: 15px;
	border-bottom:#fff solid 1px;
    color: #fff !important;
	margin-bottom: 10px !important;
}
#content h1.page-title::before,
#content h1.entry-title::before {
    content: "❯"; /* 好きな記号や絵文字に変更してください */
    color: #fff;   /* 記号の色 */
	font-size: 1.1em;
	margin-left: 1px;
	margin-right: 6px;
}
#content h1.member_page_title {
	padding-bottom: 15px;
	border-bottom:#00a6ff solid 1px;
    color: #00a6ff !important;
    margin-bottom: 0px !important;
}
#content h1.member_page_title::before {
    content: "❯"; /* 好きな記号や絵文字に変更してください */
    color: #00a6ff;   /* 記号の色 */
	font-size: 1.1em;
	margin-left: 1px;
	margin-right: 6px;
}
#content h1.cart_page_title {
	padding-bottom: 15px;
	border-bottom:#00a6ff solid 1px;
    color: #00a6ff !important;
    margin-bottom: 25px !important;
}
#content h1.cart_page_title::before {
    content: "❯"; /* 好きな記号や絵文字に変更してください */
    color: #00a6ff;   /* 記号の色 */
	font-size: 1.1em;
	margin-left: 1px;
	margin-right: 6px;
}
#content h1.item_page_title {
    color: #00a6ff !important; /* 各タイトルのカラー */
}
/* 商品詳細ページ */
#content h1.item_page_title::before {
    content: "❯"; /* 好きな記号や絵文字に変更してください */
    color: #00a6ff;   /* 記号の色 */
	font-size: 1.1em;
	margin-left: 1px;
	margin-right: 6px;
}
/* カテゴリーロゴのコンテナ */
#cat_img {
    float: right;        /* 左に浮かせる */
    max-width: 140px;  /* ロゴのサイズ調整 */
    background-color: #000;
    margin-right: 10px;
    margin-bottom: -30px;
}
/* ロゴ画像自体の設定 */
#cat_img img {
    display: block;
    height: auto;
    max-width: 100%;
}

/* カテゴリーページの情報テキスト */
.taxonomy-description p {
    color: #00a6ff;
    font-weight: nomal;
	border-left: #00a6ff solid 3px;
	padding: 2px 8px;
	margin-left: 4px;
}

/* 投稿・商品一覧の表示 */
/* 商品一覧・カテゴリーページ */
.item-content .itemname {
    margin-top: -1px !important;
}
.item-content .itemname a {
    color: #00a6ff !important;
}
.item-content .itemdescription {
    margin-top: 2px !important;
}
.item-content .itemsoldout {
    margin-top: 5px !important;
}
/* インフォメーション */
.post-li time {
    display: none !important; /* 日付の非表示 */
    padding: 5px 8px 5px 8px !important;
    color: #fff;
    display: block;
    width: 110px;
    border: #fff 1px solid;
    text-align: center;
    letter-spacing: 0.05em;
}
.post-title {
    margin-top: 10px !important;
    margin-bottom: 8px !important;
}
.post-title a {
    color: #00b3ff !important;
    pointer-events: none;    /* クリック・タッチを無効化 */
    cursor: default;         /* カーソルを矢印に戻す */
    text-decoration: none;   /* 下線を消す（必要であれば） */
}
/* ページ内移動 */
.pagination_wrapper {
    margin-top: 20px !important;
    margin-bottom: 10px !important;
}
.pagination_wrapper li a {
    border: 1px solid #0c44de !important;
    background-color: #000 !important;
    color: #999 !important;
}
.pagination_wrapper li .current {
    border: 1px solid #0c44de !important;
    background-color: #00a6ff !important;
    color: #fff !important;
}
.page-numbers.next  {
    border: none !important;
    color: #00a6ff !important;
}
.page-numbers.prev  {
    border: none !important;
    color: #00a6ff !important;
}

/* サイドバー（ welcartカテゴリー ） */
.widget_welcart_category ul { /* 外枠：テーマの干渉を徹底的に排除 */
	 display: block !important;
	 margin-top: 17px;
}
.widget_welcart_category li {
    position: relative !important;
    display: block !important; /* flexなどが効いている可能性を排除 */
    list-style: none !important;
    margin-bottom: 8px !important;
    padding: 0 !important;
    border: #999 solid 1px !important;
	border-radius: 0px ;
    overflow: hidden !important;
    font-size: 12.4px !important;
}
/* ボタン全体：上下の余白を完全に均等にする */
.widget_welcart_category li a {
    display: block !important;
    padding: 8px 0px 10px 10px !important; /* 上下を12pxで固定 */
    text-decoration: none !important;
    color: #e0e0e0;    
    /* 背景色を透明からじわっと変える設定 */
    background-color: transparent; 
    /* 0.3〜0.4秒かけてふわっと変化させる */
    transition: background-color 0.4s ease, color 0.4s ease;
}
/* ホバー時の処理（その場でふわっと色が変わる） */
.widget_welcart_category li a:hover {
    background-color: #00a6ff; /* お好みの背景色 */
    color: #fff !important;
}
/* 矢印：aタグを基準点にするよう変更（これが解決の鍵） */
/* liではなくaの中に矢印を配置するように擬似要素を変更 */
.widget_welcart_category li a::after {
    content: "❯";
    position: absolute;
    right: 10px;   
    /* 垂直中央配置の絶対指定 */
    top: 50% !important;
    transform: translateY(-50%) !important;   
    /* 記号自体の位置微調整（もし上にズレてたら+1px、下なら-1px） */
    margin-top: -1px;    
    font-size: 1.0em;
    color: #00a6ff;
    transition: color 0.4s linear;
}
/* ホバー時の矢印の色 */
.widget_welcart_category li a:hover::after {
    color: #fff;
}
/* アクティブなカテゴリーの背景色と文字色を固定 */
.widget_welcart_category li.current-cat a {
    background-color:#00a6ff ;
    color: #fff !important;   /* 文字を白に固定 */
    pointer-events: none;     /* カテゴリー表示中なのでクリック無効化 */
    cursor: default;
	font-weight: bold;
}
/* アクティブなカテゴリーの矢印の色を固定 */
.widget_welcart_category li.current-cat a::after {
    color: #fff !important;   /* 矢印を白に固定 */
}

/* ※商品ページ表示時に親のカテゴリーメニューをアクティブ状態に */
/* 
   bodyにある「parent-cat-XX」というクラスと、
   メニューにある「cat-item-XX」というクラスが一致した時だけ強調
   この時は商品購入ページなので、戻るためカテゴリーは押せるように
*/
/* sell-dvdのwelcartカテゴリーメニュー */
body.parent-cat-12 .cat-item-12 > a, 
body.parent-cat-17 .cat-item-17 > a,
body.parent-cat-13 .cat-item-13 > a,
body.parent-cat-16 .cat-item-16 > a,
/* sell-movieのwelcartカテゴリーメニュー */
body.parent-cat-24 .cat-item-24 > a {
	background-color:#00a6ff;
    color: #fff !important; /* お好みのアクセントカラー（例：赤） */
    font-weight: bold;         /* 太字にする */
}
/* sell-dvdのwelcartカテゴリーメニュー */
body.parent-cat-12 .cat-item-12 > a::after,
body.parent-cat-17 .cat-item-17 > a::after,
body.parent-cat-13 .cat-item-13 > a::after,
body.parent-cat-16 .cat-item-16 > a::after,
/* sell-movieのwelcartカテゴリーメニュー */
body.parent-cat-24 .cat-item-24 > a::after {
    color: #fff !important;   /* 矢印を白に固定 */
}

/* 商品購入ページ */
.zaikostatus {
    color: #0059ff; font-weight: bold !important;
    font-size: 12px !important; }
.item-name {
    font-size: 16px !important;
}
#itempage .item-info {
    padding: 0 !important;
}
/* カッコの中の文字の位置を微調整する例 */
.itemcode {
    align-items: center; /* 垂直方向の中央揃え */
    font-family: sans-serif; /* ズレにくいフォントを指定 */
    margin-top: 5px !important;
}
.item-description p {
    margin-top: -10px !important;
    font-size: 12px !important;
    line-height: 1.6em !important;
}
/* サムネイル画像サイズ変更 */
.itemsubimg a {
    width: 52.5px !important;  /* 好みの横幅に */
    height: 52.5px !important; /* 横幅と同じにして正方形に */
}
/* Luminous（拡大表示）がカートボタンの下に隠れないように調整 */
.lum-lightbox {
    z-index: 99999 !important; /* 拡大画面を最前面に */
}
.field_price {margin-bottom: 10px !important; /* 価格全体のレイアウト */ }
/* 定価（通常価格）のデザイン */
.field_price .field_cprice {
	font-size: 15px;
    color: #fff;
	text-decoration: line-through double !important; /* 打ち消し線を消去 */
    margin-right: 4px;
	position: relative;
    padding-left: 6em; /* ::before の文字数に合わせて左側に余白を作る */
    display: inline-block;
}
 /* 定価の前に〇〇価格と表示させる */
.field_price .field_cprice::before {
	content: "オフィシャルストア販売価格";
    font-size: 12px; /* 少し小さく表示 */
	text-decoration: none !important; /* 打ち消し線を消去 */
	position: absolute;
    left: -60px;
	bottom: -0px;
    text-decoration: none !important; /* 線を拒否 */
    display: inline-block;
    color: #fff; /* 文字色を濃くすることも可能 */
}
/* 販売価格（値引き後）のデザイン */
.field_price {
    font-size: 26px !important;
    color: #44a5ff; /* 赤色で強調 */
}
/* 販売価格の数字の後に（税込）を表示 */
.field_price::after {
    content: "（税込）";
    font-size: 0.5em; /* 少し小さく表示 */
    color: #44a5ff;    /* グレー系の色にする */
    margin-left: -12px;
    font-weight: bold;
}
/*---- 購入パート ---*/
.item-info .c-box{margin-top: 10px;}
/* 個数入力 */
.item-info .quantity {display: inline-block; margin-right: 10px;}
.quantity .skuquantity{margin-left: 10px !important;}
.item-info .quantity input.skuquantity {
	width: 50px !important;
	height: 35px;
	margin: 0 .357143em;
	padding: .357143em;
	border: 1px solid #ccc;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 5px;
	text-align: center;
}
/* 購入ボタン */
.item-info .skubutton {
	background-color: #0099ff;
	color: #fff;
	font-family: FontAwesome;
	letter-spacing: 1px;
	text-align: center;
	border: 2px solid #fff;   /* 枠線の太さ・種類・色（濃いオレンジなど） */
    border-radius: 8px;          /* 角丸の大きさ（数値が大きほど丸くなります） */
    box-sizing: border-box;       /* 枠線を含めたサイズ調整 */
    margin-bottom: 30px !important; /* サンプルムービーとの隙間 */
}
.item-info .skubutton:hover {
	background-color: #0099ffbe;
	cursor: pointer;
}
/* 廃盤カテゴリーの商品詳細ページで価格とカートを非表示 */
.category-discontinued .sku_meta,
.category-discontinued .skumulti_form,
.category-discontinued .sku_form,
.category-discontinued .field_price {
    display: none !important;
}
/* 動画購入リンクボタン（右寄せ・水色バージョン） */
.vod-button-wrapper {
    text-align: right !important; /* ボタン全体を右寄せにする */
    margin: 20px 0;
}
.vod-purchase-btn {
    display: inline-block;
    background-color: #00adef; /* 水色の背景色（お好みのトーンに調整してください） */
    color: #ffffff !important; /* 文字色（白） */
    padding: 12px 18px;
    font-size: 15px;
    font-weight: bold;
    text-decoration: none !important;
    border-radius: 5px; /* 緩やかな角丸 */
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    transition: all 0.3s ease;
}
/* マウスを乗せたとき（ホバー時）の動き */
.vod-purchase-btn:hover {
    background-color: #008ec4; /* ホバー時に少し濃い水色にする */
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
    text-decoration: none !important;
}

/* サンプルムービー配置 */
.sample-movie-section {
    background-color: #111; /* ★好きな背景色（薄いグレーなど） */
    padding: 15px;            /* 背景と動画の間に余白を作る */
    border-radius: 0px;      /* 角を少し丸くすると柔らかい印象に */
    margin-top: 40px;         /* カートボタンとの間隔 */
    margin-bottom: 30px;      /* 下の要素との間隔 */
}
.sample-movie-section h3 { /* 動画セクションタイトルの装飾 */
    margin-top: 0px;            /* 背景内の余白調整 */
    color: #999;              /* 文字色 */
    border-bottom: 1px solid #999; /* タイトルの下に線を入れる */
    padding-bottom: 10px;
}
.sample-movie-section h3::before { /* タイトルの前にアイコンを追加 */
    content: "❯"; /* ユニコード定数（ここでは「▶」） */
    color: #888;    /* アイコンの色だけ赤にする、なども可能 */
    margin-right: 5px; /* テキストとの間の余白 */
    font-size: 1.1em;  /* アイコンのサイズ微調整 */
}
.sample-movie-section video { /* 動画ファイルの位置調整 */
    display: block;
    padding: 25px 0 10px 0;
    margin-left: auto;   /* 左側を自動で埋めて右に寄せる */
    margin-right: auto;
    max-width: 80%;      /* 全幅だと動かないので、少しサイズを小さくします */
}

/* --- 非ログイン時のサンプルムービーを非表示に --- */
/* 親コンテナの調整 */
.video-placeholder-container {
    padding: 25px 0;
    text-align: center;
}
/* 線枠だけのスタイリッシュなボタン */
.login-button-outline {
    display: inline-block; /* ボタンとして独立させる */
    padding: 12px 30px;
    border: 1px solid #555; /* 線枠 */
    color: #888 !important;   /* 文字色 */
    text-decoration: none !important; /* 下線を完全に消す */
    font-size: 0.9em;
    transition: all 0.3s ease;
    background: transparent; /* 背景は透過 */
    margin-top: 10px;
}
/* ホバー時の演出（色が反転する） */
.login-button-outline:hover {
    background-color: #fff;
    color: #111 !important;
    border-color: #fff;
    text-decoration: none !important;
}
/* ログインガイドテキストの調整 */
.login-guide-text {
    color: #fff;
    font-size: 0.9em;
    margin-top: 15px;
}

/* 問い合わせページ */
/* 「Welcart ページ」の現在ページをアクティブにする */
.widget_welcart_page .page_item a {
    font-size: 12.4px !important;
}
.widget_welcart_page li.current_page_item a {
    color: #00a6ff !important; /* お好みのアクセントカラー（例：赤） */
    font-weight: bold;         /* 太字にする */
    pointer-events: none;    /* クリック・タップを無効化 */
    border-left: 4px solid #00a6ff;
    padding-left: 8px;
	padding-top: 4px;
	margin-top: -2px;
	margin-bottom: 4px;
}
/* 「Welcart ページ」：現在のページ、およびその親・祖先ページを強調する */
.widget_welcart_page li.current_page_item a,
.widget_welcart_page li.current_page_ancestor > a,
.widget_welcart_page li.current_page_parent > a {
    color: #00a6ff !important; /* アクセントカラー（青） */
    font-weight: bold;         /* 太字 */
    border-left: 4px solid #00a6ff;
    padding-left: 8px;
    padding-top: 4px;
    margin-top: -2px;
    margin-bottom: 4px;
    display: block; /* 枠線を正しく表示させるため */
    pointer-events: none; /* クリックを無効化 */
}
/* 問い合わせページ内レイアウト */
.entry-header {margin-bottom: 10px !important;}
.entry-content {margin-top: 20px !important;}
.entry-content p {margin-bottom: 20px !important;}
.entry-content p strong {color: #00b3ff;}
.entry-content p a {color: #0082d9;}
.entry-content li a {color: #0082d9;}
ul.wp-block-list {margin-top: -10px;}
h3.wp-block-heading {
    border-left-color: #0082d9 !important; /* #ff0000 を好きな色コードに変更 */
    color: #0082d9;
    padding-left: 8px;
    font-weight: bold;
    font-size: 16px;
    margin-top: 5px;
    margin-bottom: 15px;
}
h4.wp-block-heading {
    background-color: transparent !important; /* #ff0000 を好きな色コードに変更 */
    padding: 8px 0px 8px 12px;
    margin-top: 50px !important;
    border: #0082d9 1px solid;
    color: #0082d9;
}
h4.wp-block-heading::before {content: "❯"; margin-right: 5px !important;}

 /* 問い合わせフォーム */
.entry-content p.lead {margin-top: -5px !important;}
.entry-content p.lead a {color: #0082d9 !important;}
.entry-content .contact_form_area{
	padding-top: 30px;
	padding-left: 40px;
    padding-right: 40px;
	margin-top: 0px;
	border-top: #2453d5 solid 0px;
	background-color: #111;
}
.contact_form_area .form_confirm {
	border-bottom: #fff solid 1px;
	padding-top: 5px;
	margin-bottom: 15px;
}
/* 最後の項目だけボーダーを解除 */
.contact_form_area .form_confirm:last-child {
    border-bottom: none !important;
}
/* 必須マーク */
.form_input .input_label span,
.form_confirm span {
    background-color: #00b3ff;
	color: #111;
    font-size: 10px;
    padding: 4px 4px 3px 5px;
    margin-left: 8px;
    border-radius: 2px;
}
/* プルダウンの枠内の幅調整（２種あるのでパディングで調整） */
.wpcf7 select {
    background-color: #333333; /* 濃いグレー。真っ黒なら #000000 */
	padding: 9px 28px 8px 7px;
    border-radius: 6px;    
    color: #ffffff;            /* 文字色を白に */
}
/* 年齢入力フォームの幅調整 */
.wpcf7 input[type="number"] {
    width: 100%; /* 幅を広げる場合 */
    max-width: 66px; /* 年齢なら短めにするのが一般的 */
}
/* 縦横のサイズを指定 */
.wpcf7 textarea {
    width: 100%;       /* 横幅を親要素いっぱいに */
    max-width: 420px;  /* 広がりすぎないよう制限（お好みで） */
    height: 180px;     /* 高さを指定 */
    margin: 0 auto;    /* センター配置 */
}
/* 規約同意チェックの位置調整 */
.entry-content .contact_form_area .form_check {
    text-align: center;
    margin-top: 20px;    /* 上に少し隙間を作る */
    margin-bottom: 20px; /* 下（送信ボタン）との隙間を作る */
}
/* 規約同意チェックのエラーメッセージの位置調整 */
.contact_form_area .form_check span.wpcf7-not-valid-tip {
	margin-left: 18px;
	color: #ff9900;
}
.note {
    text-align: right !important;
    margin: 0 ;
}
.note small {
	color: #999;
    font-size: 12px;
}
/* 確認画面の入力したテキスト（共通） */
.form_confirm .confirm_input {
    color: #ff9900;
}


/* ログインページ */
#wc_login .loginbox .new-entry {
    margin-top: 30px !important;
    background-color: #111;
}
#wc_login .loginbox .new-entry h2 {
    color: #fff !important; /* アイコンの色（お好みで） */
}
#wc_login .loginbox .new-entry h2::before {
    content: "❯" !important; /* ここにユニコードを指定（例：右矢印） */
    margin-right: 5px !important; /* テキストとの間隔 */
    color: #fff !important; /* アイコンの色（お好みで） */
}
#wc_login .loginbox .new-entry .nav a {
    background-color: transparent !important;
    border: #fff 1px solid !important;
    border-radius: 7px !important;
    color: #fff !important;
}
#wc_login .loginbox .new-entry .nav a:hover {
    background-color: #333 !important;
}
#wc_login .loginbox .forgetmenot {
    text-align: center !important;
    margin-top: 5px !important;
}
#wc_login .loginbox .submit {text-align: center !important;}
#wc_login .loginbox .nav {text-align: center !important;}

/* 会員登録完了ページ */
#wc_newcompletion #memberpages .send,
#memberpages .send { /* ボタンの並びと余白 */
    margin-top: 15px;
    display: flex;
    gap: 15px; /* ボタン同士の間隔 */
    justify-content: center; /* 中央寄せ */
    flex-wrap: wrap; /* スマホで並ばない時に折り返す */
}
/* ボタン共通デザイン */
#wc_newcompletion #memberpages .send a,
#memberpages .send a {
    display: inline-block;
    padding: 15px 30px;
    text-decoration: none !important;
    background-color: transparent !important;
    border: #fff 1px solid !important;
    border-radius: 7px !important;
    color: #fff !important;
}
/* ホバー（マウスを乗せた）時 */
#wc_newcompletion #memberpages .send a:hover,
#memberpages .send a:hover {
    background-color: #222 !important;
}

/* 会員情報画面（マイページ） */
#memberinfo {
    background-color: #111 !important;
    color: #ffffff !important;
    padding: 30px !important;
    margin-top: 25px !important;
}
#memberinfo table {
    border: #fff 2px solid !important;
}
/* 会員情報のテーブル（見出し部分） */
#memberinfo th {
    background-color: #222 !important;
    border: #555 1px solid !important;
    width: 20% !important; /* 項目名の幅を固定する場合 */
}
/* 会員情報のテーブル（データ表示・入力部分） */
#memberinfo td {
    color: #ffffff !important;
   border: #555 1px solid !important;
}
/* 購入履歴タイトル */
#memberinfo h3 {
    color: #fff;
    font-size: 16px !important;
    padding: 10px 0 !important;
    margin-bottom: 10px !important;
}
/* 会員情報の購入履歴の調整 */
#memberinfo #history_head {
    margin: 0 !important;
    margin-top: 10px !important;
    border: #fff solid 2px !important;
    border-bottom: none !important;
}
#memberinfo .retail {
    margin-bottom: 50px !important;
    border: #fff solid 2px !important;
    border-top: none !important;
}
/* 見出しのth.thumbnailに文字を表示 */
#memberinfo th.thumbnail::before {
    content: "商品画像";
}
/* 会員情報の購入履歴のサムネイル画像 */
#memberinfo td img {
    width: 120px !important;
}
/* 会員情報編集ページ */
#memberedit .customer_form {
    margin-top: 25px !important;
}
/* 会員情報のプルダウンの外観（セレクトボックス本体） */
.usces_filter_history select {
    background-color: #111 !important; /* ボックスの背景 */
    color: #fff !important;           /* 選択されている文字色 */
    border-radius: 5px !important;
    cursor: pointer !important;
}
/* 会員情報再編集 */
#memberedit h2 {
    font-size: 15px !important;
    margin-bottom: 10px !important;
    padding: 0 20px !important;
}
#memberedit p {
    font-size: 13px !important;
    padding: 0 20px !important;
}
/* 会員情報再編集ボタン並び */
.member_submenu a {
    margin: 0 3px !important;
    background-color: #fff !important;
    border-radius: 8px !important;
}
.member_submenu a:hover {
    background-color: #ffffffab !important;
}
/* 元の文字「送信する」を非表示に */
#member_reg_button {
    color: transparent !important;
    position: relative !important;
}
/* 新しい文字「登録を完了する」を表示させる */
#member_reg_button::before {
    content: "登録を完了する" !important;
    color: #fff !important; /* ボタンの文字色。背景に合わせて調整してください */
    position: absolute !important;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    display: flex !important;
    align-items: center;
    justify-content: center;
    pointer-events: none; /* クリックを阻害しない */
    font-size: 16px !important;
}

/* 新パスワード取得画面 */
/* 共通 */
#member_login {
    display: block !important;    /* ブロック要素にする */
    margin-left: auto !important; /* 左の余白を自動調整 */
    margin-right: auto !important;/* 右の余白を自動調整 */
    width: fit-content;           /* 中身の文字幅に合わせる */

    background-color: #0099ff !important;
    border-radius: 7px !important;
    margin-top: 0px !important;
    padding: 15px 30px !important;
}
#member_login:hover {
    background-color: #0099ffcc !important;
}
/* 各調整 */
#wc_lostmemberpassword  #member_login{
        margin-top: 25px !important;
}
#wc_changepassword #member_login{
    margin-top: 10px !important;
    max-width: 150px !important;
}
p.change_pass {
    text-align: center !important;
    margin-top: 20px !important;
}
#wc_changepassword .loginpass {
    height: 30px !important;
}

/* 買い物カゴページ */
#wc_cart {margin-top: 30px;}
/* カートページに商品が入っていない状態 */
#wc_cart .no_cart {color: #00b3ff !important;}
/* カートページ数量更新ボタンの説明文 */
#wc_cart #cart .upbutton {color: #00b3ff;}
/* カートページの数量更新ボタン */
#cart input[name="upButton"] {
    background-color: #0082d9 !important; /* （お好みで変更可） */
    color: #fff !important;           /* 文字色は白 */
    border: none !important;
    padding: 5px 15px !important;
    border-radius: 4px !important;       /* 角を少し丸く */
    cursor: pointer !important;
    font-size: 12px !important;
    transition: background-color 0.3s;    /* ホバー時の動きを滑らかに */
}
/* ホバー（マウスを乗せた時）の色 */
#cart input[name="upButton"]:hover {
    background-color: #025cb5 !important; /* ホバー時に少し明るく */
}
/* 進行状況全体のコンテナ */
.cart_navi {
    background-color: #000 !important; /* 周辺と合わせた黒 */
    margin-bottom: 30px !important;
}
/* 通常時（現在地以外） */
.cart_navi ul li {
    background-color: #b5b5b5 !important; /* 少し明るめのグレー背景 */
    color: #333 !important;           /* 文字色 */
    font-weight: normal !important;
}
.cart_navi ul li::after,
.cart_navi ul li::before {
    background-color: #b5b5b5 !important; /* 少し明るめのグレー背景 */
}
/* 現在地の（今いるページ） */
.cart_navi ul li.current {
    background-color: #0e52d0 !important;
    color: #fff !important;           /* 現在地の文字色は白 */
    font-weight: bold !important;
}
.cart_navi ul li.current::after,
.cart_navi ul li.current::before {
    background-color: #0e52d0 !important;
}
/* カート内商品のサムネイル画像（トリミングも可能） */
#cart_table .thumbnail img {
    /* 1. 表示サイズを60pxに固定（お好みのサイズに） */
    width: 100px !important;
    height: auto !important;
    /* 2. medium画像（大きい画像）を枠いっぱいに収める */
    object-fit: cover !important;
    /* 3. これで左端を基準にする */
    object-position: left center !important;
}
/* お客様情報ページの会員規約エリア */
.agree_member_area {
    margin-top: 40px !important;
}
/* 会員規約エリア下のチェック */
.at_check_area {
    margin-top: 10px !important;
}
/* 配送・支払い方法のプルダウン（セレクトボックス本体） */
.customer_form select {
    background-color: #333333 !important; /* ボックスの背景 */
    color: #ffffff !important;           /* 選択されている文字色 */
    border-radius: 5px !important;       /* 少し角を丸く */
    cursor: pointer !important;
}
/* 内容確認ページのトップテキストを非表示 */
    .confiem_notice {
    display: none;
}
/* 内容確認ページの注文内容フォーム内の大項目セル */
#confirm_table tr.ttl td {
/* 記号と文字を横並びにする設定 */
    display: flex !important; 
    align-items: center !important; /* 上下中央揃え */
    background-color: #407fb9 !important;
    padding-left: 9px !important;
}
/* 大項目セルの先頭に記号を追加 */
#confirm_table tr.ttl td::before {
    content: "❯";
    margin-right: 5px;
    font-size: 12px;
    /* 記号が勝手に改行したり縮んだりするのを防ぐ */
    flex-shrink: 0 !important;
}
/* 内容確認ページのフッターテキスト位置 */
#info-confirm .footer_explanation {
    display: block !important; /* 横幅いっぱいに広げる */
    text-align: center !important;
    color: #0099ff !important;
    font-size: 13px !important;
}
/* 特定商取引法に基づく表記のテーブル設定 */
.my-tokusho-table table {
    table-layout: fixed;
    width: 90% !important;
    font-size: 12px;
    color: #d1d1d1;
    margin: 0 auto;
}
.my-tokusho-table td:nth-child(1) {
    width: 200px;
    vertical-align: middle; /* 垂直方向を真ん中に */
}
/* 完了ページの冒頭挨拶 */
#wc_ordercompletion h3 {
    color: #00b3ff !important;    
}
/* 完了ページのトップへ戻るボタン */
#wc_ordercompletion .send a {
    width: 130px !important;
    background-color: transparent !important;
    border: #fff 1px solid !important;
    border-radius: 5px;
    color: #fff !important;  
}
#wc_ordercompletion .send a:hover {
    background-color: #222 !important;
}

/* お探しのページが見つかりませんページ */
.error-404 .page-content p {color: #0082d9 !important;}
/* 検索フォームを非表示 */
.error-404 .page-content .s-box {display: none !important;}


/* その他 */

/* 商品詳細タイトル用ラベルスタイル */
.item-label {
    display: inline-block;
    padding: 2px 3px 2px 3px;
    margin-right: 2px;
    font-size: 0.7em; /* 少し大きくして視認性アップ */
    font-weight: nomal;
    line-height: 1.0;
    border-radius: 0px;
    color: #fff;
    text-transform: uppercase;    
    /* --- ここで上下位置を微調整 --- */
    vertical-align: middle; 
    position: relative;
    top: -2px; /* この数字を -3px や -1px に変えて高さを調整してください */
}
/* リンク内の下線を消す設定（念のため追加） */
a .item-label {text-decoration: none !important;}
/* DVDラベルの色（例：深い青） */
.label-dvd {
    background-color: #0059ff;
}
/* VODラベルの色（例：鮮やかな赤またはオレンジ） */
.label-vod {
    background-color: red;
}

/* 売り切れ商品の「入荷待ち」カラー */
.itemsoldout {
    color: #ff7700 !important;
}

/* 非ログイン時のみ、商品画像のリンク・クリック・下線を徹底排除*/
.welcart-not-logged-in #itempage .itemimg a,
.welcart-not-logged-in #itempage .itemimg a:hover {
  /*pointer-events: none !important; ← これを削除またはコメントアウト */
    text-decoration: none !important;
    border: none !important;
    cursor: pointer !important;
    display: block !important;
}
/* 非ログイン時のみ、商品ギャラリーのリンク・クリック・下線を徹底排除 */
.welcart-not-logged-in #img-box .itemsubimg a,
.welcart-not-logged-in #img-box .itemsubimg a:hover {
    pointer-events: none !important; /* クリック不可 */
    text-decoration: none !important; /* 下線消去 */
    border: none !important;
    cursor: default !important;
    display: block !important;
}
/* 黒いボックス（プレースホルダー）の設定 */
.item-image-placeholder {
    width: 100%;
    aspect-ratio: 4 / 3;
    background-color: #333 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    color: #fff !important;
    font-size: 0.8em !important;
    padding: 0 8px !important;
    pointer-events: none !important;
    line-height: 1.2em;
}
.item-image-placeholder.sub-image-limiter {
    aspect-ratio: 1 / 1 !important;
}
/* ログイン時は、ポインターイベントを元に戻す */
.welcart-logged-in #itempage .itemimg a,
.welcart-logged-in #img-box .itemsubimg a {
    pointer-events: auto !important;
    text-decoration: none; /* ここはお好みで調整 */
}
/* 全ユーザー対象：サイト全体の画像・動画のドラッグ（持ち出し）を禁止 */
img, video {
    -webkit-user-drag: none !important;
    user-drag: none !important;
}

/* 戻る、次へボタンの仕様と間隔 */
.send input {
    margin: 0 5px !important; /* 数値はお好みで調整してください */
    display: inline-block !important;
    background-color: transparent !important;
    border: #fff 1px solid !important;
    border-radius: 8px !important;
    color: #fff !important;
}
.send input:hover {
    background-color: #222 !important;
}
/* 隙間のバランス調整 */
.send input.back_to_customer_button {margin: 0 0px !important;}
.send input.back_to_delivery_button {margin: 0 8px !important;}

/* プレースホルダー（ヒント文字）*/
::placeholder {color: #666666 !important;}

/* サイト全体の入力フォームをモダンなグレーに変更 */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
input[type="number"],
input[type="search"],
textarea {
    background-color: #222 !important; /* 真っ黒ではなく、深いグレー */
    border: 0px solid #333 !important; /* 縁は白ではなく、背景より少しだけ明るいグレー */
    color: #dddddd !important;           /* 文字は真っ白を避け、目に優しいオフホワイト */
    border-radius: 6px;                  /* 角を少し丸くするのが今のトレンド */
    padding: 8px 8px;
    box-sizing: border-box;
    transition: all 0.3s ease;           /* 変化を滑らかに */
}

/* カートページ、確認ページのテーブルフォーム */
/* ID指定グループ（カゴ・確認・会員情報） */
#cart_table, #confirm_table,
#cart_table th, #confirm_table th,
#cart_table td, #confirm_table td {
    background-color: #000 !important;
    color: #ffffff !important;
    border: 1px solid #555 !important;
}
/* クラス指定グループ（入会・発送先・支払） */
.customer_form, .delivery_table, .payment_table,
.customer_form th, .delivery_table th, .payment_table th,
.customer_form td, .delivery_table td, .payment_table td {
    background-color: #000 !important;
    color: #ffffff !important;
    border: 1px solid #555 !important;
}
/* 見出し(th)のデザイン（視認性向上のため少しグレーに） */
#cart_table th, #confirm_table th,
.customer_form th, .delivery_table th, .payment_table th {
    background-color: #222 !important;
}
/* 見にくいところを微調整 */
.customer_form td label,
.customer_form dd,
#confirm_table h3 {
    color: #fff !important;
}

/* カートページなどの「数量」入力欄など、特殊なinputにも対応 */
.usces_cart input,
#member_login input {
    background-color: #2a2a2a !important;
    border: 0px solid #fff !important;
    color: #fff !important;
}

/* 検索結果の画像エリアのサイズを固定 */
.search-results .search-li .itemimg a {
    display: block;
    width: 100%;
    height: 130px; /* ここで希望の高さを指定（例: 200px） */
    overflow: hidden;
    position: relative;
    background-color: #000; /* 余白がある場合の背景色 */
}
/* 画像を枠いっぱいに、かつ縦横比を崩さず表示 */
.search-results .search-li .itemimg img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain; /* 枠内に収める（切れない）。隙間が嫌なら cover に変更 */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/* ページのトップに戻るボタン */
#toTop {
	position: fixed;
	right: 35px;
	bottom: 4% !important;
}
#toTop a {
	display: block;
}
#toTop i {
	-webkit-transition: .3s ease all;
	-moz-transition: .3s ease all;
	-o-transition: .3s ease all;
	transition: .3s ease all;
	color: #11b6fd !important;
	font-size: 3.214289em;
}
#toTop i:hover {color: #fff !important;}
/* クリック時の点線枠（アウトライン）を消す */
#toTop a, 
#toTop a:focus, 
#toTop a:active {
    outline: none !important;
    text-decoration: none;
}

.footer-bottom {
    background-color: #333 !important;
}
/* 印刷禁止 */
@media print {
  body { display: none; }
}

/* ============================================================
  PC (1000px以上)
============================================================ */

@media screen and (min-width: 62.5em) {
/* ヘッダー全体の余白調整 */
.site-header {
    padding-top: 20px !important;
    border-top: 0px solid #2453d5 !important;
}
/* サイトディスクリプションの配置 */
.site-description {
    display: block !important;
    text-align: left !important; /* 左寄せ */
    width: 60% !important;
    margin: -10px 0 10px 0 !important; /* ロゴとの間の隙間（5px） */
    padding: 0 !important;
    background: none !important; /* 背景はなし */
    font-size: 10px !important; /* 文字の大きさ */
    color: #206efe !important; /* 文字色（適宜変更してください） */
}
/* キャッチコピーの前にロゴを表示 */
.site-description::before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 160px; /* ロゴの幅（調整してください） */
    height: 20px; /* ロゴの高さ（調整してください） */
    margin-right: 15px; /* コピーとの間隔 */
    background-image: url("/active2/wp-content/uploads/2026/02/field_logo_color.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
/* サイトロゴ画像を位置調整用 */
    .header_logo {
        position: relative !important;
        top: -18px !important; /* ★数値を調整してください。-30pxでさらに上がります */
        margin-bottom: -35px !important;
    }

/* 右側のグループ全体を、今の形のまま上にずらす */
.site-header .snav {
    position: relative !important;
    top: -23px !important; /* ★この数値で高さを調整してください */
    margin-bottom: -50px !important; /* ずらした分の余白を相殺して崩れを防ぐ */
}
.snav .membership ul {
    margin-left: 7px !important;
}
/* カートボタンを画面の右下に固定配置する */
.incart-btn {
    position: absolute !important; /* 画面に対して固定 */
    top: 72px !important;    /* 下からの距離（お好みで調整） */
    right: -50px !important;     /* 右からの距離（お好みで調整） */
    z-index: 10000 !important;  /* 他の要素より前面に表示 */
}
.incart-btn a {
    width: 98px !important;   
    background-color: #00a0e9 !important;
    display: block !important;
    text-decoration: none !important;
    padding :17px 0 10px 15px !important;
    border-radius: 12px 12px 0 0 !important;
}
.incart-btn a:hover {
    background-color: #025cb5 !important;
}    
/* アイコンと数字のバランスを整える（必要に応じて） */
.incart-btn i {
    font-size: 40px !important; /* アイコンを少し大きく */
}
/* カートボタン内の「カートの中」テキスト */
.incart-btn i span {
    display: block !important;
    font-size: 10px !important;
    margin: 10px 0 0 -14px !important;
    letter-spacing: 0.05em !important;
}
/* 購入数量の位置・サイズを調整 */
.incart-btn .total-quant {
    position: absolute !important; /* 画面に対して固定 */
    top:11px !important;
    margin-left: 11px !important;
    color: #00a0e9 !important;
}
.incart-btn .total-quant p {
    margin-left: 2px;

}
.membership li:first-child {
    color: #fff !important; /* ログイン名を目立たせる */
}

/* メインnavi全体カラー */
.nav-menu-open {
    background-color: #111 !important;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #00a0e9;
}
/* 1. メインナビの親要素の設定 */
#site-navigation > div > ul {
    display: flex;
    justify-content: left; /* メニュー全体を中央寄せ */
    flex-wrap: wrap;        /* 画面幅が狭い時に折り返し許可 */
}
/* 2. 各メニューボタンの設定 */
#site-navigation > div > ul > li {
    list-style: none;
    margin: 0;
    padding: 0;
}
/* 3. ボタンの中身（ここが重要） */
#site-navigation > div > ul > li > a {
    display: flex !important;
    flex-direction: column;   /* 上下2行にする */
    align-items: center;      /* 左右の中央揃え */
    justify-content: center;  /* 上下の中央揃え */   
    width: 110px !important;  /* 【重要】ここで幅を統一（お好みで調整） */
    height: auto !important;
    min-height: 50px;         /* 高さを最低限確保 */
    padding: 0px 0px !important;
    font-size: 12px !important; /* メニュー文字の大きさ */
    text-align: center !important;
    box-sizing: border-box;
}
/* メインnaviホバー時の変更 */
#site-navigation li a:hover {
	background-color: #00a0e9 !important;
	text-decoration: none;
}
/* メインnaviのsubパネルホバー時にホバー色を維持 */
#site-navigation ul li:hover > a {
	background-color: #00a0e9 !important;
	text-decoration: none;
}
/* メインnaviのアクティブ時 */
#site-navigation li.current-menu-item > a,
#site-navigation li.current-menu-parent > a,
#site-navigation li.current-menu-ancestor > a {
	background-color: #0c44de !important;
}
/* 親ページ(ID:687)と、その配下にある全ての子ページで「お問い合わせ」ボタンをアクティブ状態 */
body.page-id-687 .menu-contact > a,
body.parent-pageid-687 .menu-contact > a {
    background-color: #0c44de !important; 
}
/* サブnaviのカテゴリーページ閲覧時 */
#site-navigation li li.current-menu-item > a,
#site-navigation li li.current-menu-parent > a,
#site-navigation li li.current-menu-ancestor > a {
	color: #fff !important;
}
/* メインnaviホバーで第2階層を表示 */
#site-navigation ul li:hover > ul {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}
/* サブnavi第2階層の設定（現在のコードを維持） */
#site-navigation ul ul {
    display: block !important;
    visibility: hidden;
    opacity: 0;
    position: absolute;
    z-index: 99999;
    top: 45px;
    left: -5px;
    min-width: 120px;
    width: 295px; /* パネルの幅 */
    border: 0px !important;
    border-left: 4px solid #0c44de !important;
    background-color: #fff !important;  
    white-space: nowrap;
    transform: translateY(10px);
    transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s;
    pointer-events: none;
    box-shadow: 0 10px 25px rgba(0,0,0,0.1);
}
/* 1. リスト項目自体の余白を消す */
#site-navigation ul li ul li {
    padding: 0 !important;
}
/* 2. リンク（aタグ）をブロック要素にして、内側に余白を作る */
#site-navigation ul li ul li a {
    display: block;      /* 枠いっぱいに広げる */
    padding: 12px 10px;  /* ここで上下 左右 の隙間を調整 */
    text-decoration: none;
    font-size: 14px;     /* お好みのサイズに */
}
/* 3. ホバー時の色指定（これで背景色が枠いっぱいになります） */
#site-navigation ul li ul li a:hover {
    background-color: #00a6ff !important;
    color: #fff;              /* ホバー時の文字色 */
}

/* スリックスライドの←→の位置調整 */
.slick-prev { left: -60px; }
.slick-next { right: -60px; }

/* ホームサイドバーウィジェット */
.one-column #secondary {
    border-top: 0px solid #2453d5;
	padding: 0px 30px !important;
}
.one-column #secondary .columnleft {
	width: 240px;
	margin-right: 20px !important;
	float: left;
}
.one-column #secondary .columncenter {
	width: 420px;
	float: left;
}
.one-column #secondary .columnright {
	width: 240px;
	float: right;
}

/* 問い合わせフォームレイアウト */
/* 横並びにする設定 */
.form_input {
    display: flex;
    flex-wrap: wrap; /* スマホでは縦に並ぶように */
    margin-bottom: 20px;
    align-items: center;
}
/* 左側：項目のラベル */
.input_label {
    flex: 0 0 200px; /* 左側の幅を200pxに固定 */
    font-weight: nomal;
}
/* 右側：入力フォーム */
.input_form {
    flex: 1; /* 残りの幅をすべて使う */
    margin-left: 20px;
}
/* 入力画面のボタンの配置 */
.contact_form_area .form_buttons {
    text-align: right;
    border-top: 1px solid #fff ;
	padding-top: 25px;
	padding-bottom: 15px; /*背景との間隔*/
    padding-right: 100px;
}
/* 入力画面のボタンの仕様 */
.form_buttons .my-reset-btn,
.form_buttons .my-submit-btn {
    margin-right: 15px;
	width:130px;
    border: 1px solid #fff;
    background-color: transparent !important;
    border-radius: 8px;
    color: #fff;
    font-size: 12px !important;
}
/* 確認画面のボタンの配置 */
.form_confirm_buttons {
    text-align: right;
	padding-top: 10px;
	padding-bottom: 15px; /*背景との間隔*/
    padding-right: 100px;
}
/* 確認画面のボタンの仕様 */
.form_confirm_buttons .my-back-btn,
.form_confirm_buttons .my-send-btn {
    margin-right: 15px;
	width:130px;
    border: 1px solid #fff;
    background-color: transparent !important;
    border-radius: 8px;
    color: #fff;
    font-size: 12px !important;
}
/* 確認画面*/
.form_confirm {
    display: flex;
    flex-wrap: wrap; /* スマホでは縦に並ぶように */
    margin-bottom: 20px;
    align-items: center;
}
/* 左側：項目のラベル */
.confirm_label {
    flex: 0 0 200px; /* 左側の幅を200pxに固定 */
    font-weight: nomal;
}
/* 右側：入力済テキスト */
.confirm_input {
    flex: 1; /* 残りの幅をすべて使う */
}

/* 買い物カゴ */
/* テーブル本体 */
html body table#confirm_table {
    display: block !important;
    width: 70% !important; /* 画面全体の70% */
    margin: 0 auto !important;
}
/*【ここが重要】tbodyもブロック化して幅を100%にする */
html body #confirm_table thead,
html body #confirm_table tbody {
    display: block !important;
    width: 100% !important;
}
/* 行を横並びに */
html body #confirm_table tr {
    display: flex !important;
    width: 100% !important;
}
/* 各列の比率を固定 */
html body #confirm_table th {
    flex: 0 0 40% !important;
    width: 40% !important;
    box-sizing: border-box !important;
}
html body #confirm_table td {
    flex: 1 1 60% !important; /* 残り全部を埋める */
    width: 60% !important;
    box-sizing: border-box !important;
}
/* 内容確認ページの特定商取引法のリンク */
.wc_confirm_notes_area {
    display: block; /* 横幅いっぱいに広げる */
    width: 85% !important;
    text-align: right;
    font-size: 12px;
    margin-top: 5px !important;
}

/* サイト表示サイズの最終調整法 */
    html {
        /* zoomなら幅の再計算(108.7%)が不要で、固定ボタンもズレにくい */
        zoom: 0.9;
    }
    /* トップへ戻るボタンが小さくなりすぎるのを防ぎたい場合はここを1に */
    #toTop {
        zoom: 1; 
    }
}