@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;700&display=swap');

/* ================================================================= */
/* ocnk001 -  商品詳細ページボタンレイアウト変更  */
/* ================================================================= */

/* カートに入れる/再入荷/お問い合わせ/お気に入りボタンのブロック要素をflexにする */
.ocnk001.responsive .detail_item_data .detail_section.add_cart:not(:has(input[type="image"], .button_image_link)) {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: 10px;
  gap: 10px;
}
/* 上部ブロック要素(カート、再入荷ボタン)を横幅100%に指定改行 */
.ocnk001.responsive .detail_item_data .detail_section.add_cart:not(:has(input[type="image"], .button_image_link)) .add_cart_btn_wrapper {
  width: 100%;
}
/* お問い合わせ/お気に入りボタン枠を50%にする ※gap分10pxを引く*/
.ocnk001.responsive .detail_item_data .detail_section.add_cart:not(:has(input[type="image"], .button_image_link)) .inquiry_btn,
.ocnk001.responsive .detail_item_data .detail_section.add_cart:not(:has(input[type="image"], .button_image_link)) .favorite_btn {
  width: calc((100% - 10px) / 2);
}
/* 各ボタン幅を100%に */
.ocnk001.responsive .detail_item_data .detail_section.add_cart:not(:has(input[type="image"], .button_image_link)) .add_cart_btn,
.ocnk001.responsive .detail_item_data .detail_section.add_cart:not(:has(input[type="image"], .button_image_link)) .restock_btn,
.ocnk001.responsive .detail_item_data .detail_section.add_cart:not(:has(input[type="image"], .button_image_link)) .add_cart_btn .btn_size_xxlarge,
.ocnk001.responsive .detail_item_data .detail_section.add_cart:not(:has(input[type="image"], .button_image_link)) .restock_btn .btn_size_large,
.ocnk001.responsive .detail_item_data .detail_section.add_cart:not(:has(input[type="image"], .button_image_link)) .inquiry_btn .btn_size_large,
.ocnk001.responsive .detail_item_data .detail_section.add_cart:not(:has(input[type="image"], .button_image_link)) .favorite_btn .btn_size_large {
  width: 100%;
}
/* カートに入れる/再入荷ボタンの縦幅を大きくする */
.ocnk001.responsive .detail_item_data .detail_section.add_cart:not(:has(input[type="image"], .button_image_link)) .add_cart_btn .btn_size_xxlarge,
.ocnk001.responsive .detail_item_data .detail_section.add_cart:not(:has(input[type="image"], .button_image_link)) .restock_btn .btn_size_large {
  min-height: 60px;
  line-height: 60px;
}
/* お問い合わせ/お気に入りボタンの縦幅を大きくする */
.ocnk001.responsive .detail_item_data .detail_section.add_cart:not(:has(input[type="image"], .button_image_link)) .inquiry_btn .btn_size_large,
.ocnk001.responsive .detail_item_data .detail_section.add_cart:not(:has(input[type="image"], .button_image_link)) .favorite_btn .btn_size_large {
  min-height: 45px;
  line-height: 45px;
}
/* 各ボタン上下marginリセット */
.ocnk001.responsive .detail_item_data .detail_section.add_cart:not(:has(input[type="image"], .button_image_link)) .global_btn,
.ocnk001.responsive .detail_item_data .detail_section.add_cart:not(:has(input[type="image"], .button_image_link)) .add_cart_btn_wrapper {
  padding: 0;
  margin: 0;
}
/* カートに入れる下部固定用指定 */
.ocnk001.responsive #contents .detail_item_data .add_cart_btn_wrapper:not(:has(input[type="image"])) .is_fixed .add_cart_btn {
  margin: 15px auto !important;
  max-width: 300px;
}
/* カートに入れるボタンを下部に固定する場合の下部固定ボタン枠の高さのCSS変数値を変更 */
.ocnk001 #container {
  --fixed-add-cart-btn-box-height: 90px;
}

/* =================================================================
   レスポンシブ840px以上
   ================================================================= */
@media screen and (min-width: 840px) {
/* 840px以上で余白、gapを15pxに変更 */
.ocnk001.responsive .detail_item_data .detail_section.add_cart:not(:has(input[type="image"], .button_image_link)) {
  padding: 15px 0px;
  gap: 15px;
  max-width: 600px;
  margin: auto;
}
.ocnk001.overlay_area .detail_item_data .detail_section.add_cart:not(:has(input[type="image"], .button_image_link)) {
  padding: 15px;
}
.ocnk001.responsive .detail_item_data .detail_section.add_cart:not(:has(input[type="image"], .button_image_link)) .inquiry_btn,
.ocnk001.responsive .detail_item_data .detail_section.add_cart:not(:has(input[type="image"], .button_image_link)) .favorite_btn {
  width: calc((100% - 15px) / 2);
}
}
/* ================================================================= */



/* ================================================================= */
/* ocnk002 - 人気ランキング番号位置変更 */
/* ================================================================= */

/* 基準位置指定 */
/* ランキング番号だけを表示にチェックが入ってる場合(.ranking_numbers_only)のみ適用 */
.ocnk002.responsive .ranking_numbers_only .item_rankno {
  position: relative;
  margin: 0;
}
/* デザインを●に変更 */
.ocnk002.responsive .ranking_numbers_only .item_data .rankno,
.ocnk002.responsive .ranking_numbers_only .list_item_photo .rankno {
  display: block;
  width: 18px;
  min-width: auto;
  height: 18px;
  margin: auto;
	padding: 3px;
  line-height: 18px;
  border-radius: 18px;
	background-color: #F5F5F5;
	background-image: none;
	border: none;
	color: #000000;
  position: absolute;
  top: 5px;
  left: 5px;
  z-index: 2;
  font-size: 12px;
}
.ocnk002.ocnk024.responsive .ranking_numbers_only .item_data .rankno,
.ocnk002.ocnk024.responsive .ranking_numbers_only .list_item_photo .rankno {
  line-height: 19px;
}
.ocnk002.responsive .ranking_numbers_only .text_layout_img80 .list_item_photo .rankno {
  width: 12px;
  height: 12px;
  line-height: 12px;
  border-radius: 12px;
  font-size: 10px;
}
/* 1位 */
.ocnk002.responsive .ranking_numbers_only .item_data .rankno1,
.ocnk002.responsive .ranking_numbers_only .list_item_photo .rankno1 {
  background-color: #BBB447;
  color: #FFFFFF;
}
/* 2位 */
.ocnk002.responsive .ranking_numbers_only .item_data .rankno2,
.ocnk002.responsive .ranking_numbers_only .list_item_photo .rankno2 {
  background-color: #A7A7A7;
  color: #FFFFFF;
}
/* 3位 */
.ocnk002.responsive .ranking_numbers_only .item_data .rankno3,
.ocnk002.responsive .ranking_numbers_only .list_item_photo .rankno3 {
  background-color: #B4643A;
  color: #FFFFFF;
}

/* =================================================================
   レスポンシブ840px以上
   ================================================================= */
@media screen and (min-width: 840px) {
/* 840px以上で位置を変更 */
.ocnk002.responsive .ranking_numbers_only .item_data .rankno {
  top: 10px;
  left: 15px;
}
/* 商品一覧100%を併用した場合の位置 */
.ocnk002.ocnk010.responsive #container:not(.use_lightweight_thumbnail) .ranking_numbers_only .item_data .rankno {
  left: 10px;
}
}

/* =================================================================
   レスポンシブ840px以下
   ================================================================= */
@media screen and (max-width: 840px) {
  .ocnk002.responsive #container .ranking_numbers_only .layout_photo .item_list .slide_item_cell :is(.list_item_photo, .list_item_photo .item_image),
	.ocnk002.responsive #container .ranking_numbers_only .item_list .tiled_list .wrapped_item :is(.list_item_photo, .list_item_photo .item_image) {
    max-width: 100%;
  }
  .ocnk002.responsive #container .ranking_numbers_only .layout_photo .list_item_photo {
    padding: 0;
  }
}
/* ================================================================= */



/* ================================================================= */
/* ocnk003 - バリエーション選択ラジオボタン変更 */
/* ================================================================= */

/* ラジオボタンのデザイン */
.ocnk003.responsive .detail_page_body .data_table .stocklist_radio {
  display: inline-block;
  padding: 7px 8px 7px 5px;
  background-color: #F9F9F9;
  border: 1px solid #CCCCCC;
  border-radius: 5px;
  margin-right: 0;
	color: #000000;
	line-height: 1;
}
.ocnk003.responsive .detail_page_body .data_table .stocklist_radio input[type=radio] {
  transform: none;
}
/* 各テンプレ指定
 # ================================================================= */
/* テクスチャパターン：017,018,023 */
.ocnk003.responsive.touch017 .detail_page_body .data_table .stocklist_radio,
.ocnk003.responsive.touch018 .detail_page_body .data_table .stocklist_radio,
.ocnk003.responsive.touch023 .detail_page_body .data_table .stocklist_radio {
	background-color: #FFFFFF;
  border: 1px solid #E0DFE3;
}
/* 黒背景パターン：005,013 */
.ocnk003.responsive.touch005 .detail_page_body .data_table .stocklist_radio,
.ocnk003.responsive.touch013 .detail_page_body .data_table .stocklist_radio {
  background-color: #555555;
  border: 1px solid #333333;
	color: #FFFFFF;
}

/* マウスオーバー
 # ================================================================= */
.ocnk003.responsive.use_hover .detail_page_body .data_table .stocklist_data:not(.soldout) .stocklist_radio:hover {
  display: inline-block;
  padding: 7px 8px 7px 5px;
  background-color: #E0DFE3;
}
/* 各テンプレ指定
 # ================================================================= */
/* テクスチャパターン：017,018,023 */
.ocnk003.responsive.touch017.use_hover .detail_page_body .data_table .stocklist_data:not(.soldout) .stocklist_radio:hover,
.ocnk003.responsive.touch018.use_hover .detail_page_body .data_table .stocklist_data:not(.soldout) .stocklist_radio:hover,
.ocnk003.responsive.touch023.use_hover .detail_page_body .data_table .stocklist_data:not(.soldout) .stocklist_radio:hover {
  background-color: #F5F5F5;
	border: 1px solid #999999;
	color: #000000;
}
/* 黒背景パターン：005,013 */
.ocnk003.responsive.touch005.use_hover .detail_page_body .data_table .stocklist_data:not(.soldout) .stocklist_radio:hover,
.ocnk003.responsive.touch013.use_hover .detail_page_body .data_table .stocklist_data:not(.soldout) .stocklist_radio:hover {
  background-color: #F5F5F5;
	color: #000000;
}
/* 選択中
 # ================================================================= */
.ocnk003.responsive .detail_page_body .data_table .selected_data .stocklist_radio {
  background-color: #E0DFE3;
  border: 1px solid #E0DFE3;
}
/* 各テンプレ指定
 # ================================================================= */
/* テクスチャパターン：017,018,023 */
.ocnk003.responsive.touch017 .detail_page_body .data_table .selected_data .stocklist_radio,
.ocnk003.responsive.touch018 .detail_page_body .data_table .selected_data .stocklist_radio,
.ocnk003.responsive.touch023 .detail_page_body .data_table .selected_data .stocklist_radio {
	background-color: #F5F5F5;
	border: 1px solid #999999;
	color: #000000;
}
/* 黒背景パターン：005,013 */
.ocnk003.responsive.touch005 .detail_page_body .data_table .selected_data .stocklist_radio,
.ocnk003.responsive.touch013 .detail_page_body .data_table .selected_data .stocklist_radio {
	background-color: #F5F5F5;
  border: 1px solid #F5F5F5;
	color: #000000;
}

/* afterでテキスト追加 */
.ocnk003.responsive .detail_page_body .data_table .stocklist_radio::after {
  content: "選択";
  margin: 0px 0px 0px 5px;
  font-size: 12px;
}
.ocnk003.responsive .detail_page_body .data_table .soldout .stocklist_radio {
  opacity: .6;
}
/* 英語版 */
.ocnk003.responsive .detail_page_body .en_version .data_table .stocklist_radio::after {
  content: "Select";
}
/* ================================================================= */



/* ================================================================= */
/* ocnk004 - サイド/メインエリアのコンテンツ間余白変更  */
/* ================================================================= */

/* トップページのみメインコンテンツ上部に20px追加 */
.ocnk004.responsive .top_page_body #contents {
  margin-top: 20px;
}
/* サイド、メインエリア下余白 */
.ocnk004.responsive #container .side_box {
  margin-bottom: 25px;
}
.ocnk004.responsive #container .main_box:not(.custom_toggle_box) {
  margin-bottom: 30px;
}

/* =================================================================
   レスポンシブ840px以上
   ================================================================= */
@media screen and (min-width: 840px) {
.ocnk004.responsive .top_page_body #contents {
  margin-top: 30px;
}
.ocnk004.responsive #container .side_box {
  margin-bottom: 40px;
}
.ocnk004.responsive #container .main_box:not(.custom_toggle_box) {
  margin-bottom: 60px;
}
.ocnk004.responsive.column_layout .has_left_side_menu:has(.side_col) .layout_2_col #main_container {
  padding-left: 40px;
}
.ocnk004.responsive.column_layout .has_right_side_menu:has(.side_col) .layout_2_col #main_container {
  padding-right: 40px;
}
/* サイド非表示、記事ページカテゴリ */
/* ================================================================= */
.ocnk004.responsive:has(.has_whatnew_category, .has_article_category, .has_diary_category) .layout_2_col #maincol {
  margin-left: 0;
}
.ocnk004.responsive:has(.has_whatnew_category, .has_article_category, .has_diary_category) .layout_2_col #main_container {
  padding-left: 40px;
}
.ocnk004.responsive:has(.has_whatnew_category, .has_article_category, .has_diary_category):has(.has_right_side_menu) .layout_2_col #main_container {
  padding-left: 0;
	padding-right: 40px;
}
/* 038適用時 */
.ocnk004.ocnk038.responsive.column_layout:not(:has(.has_whatnew_category, .has_article_category, .has_diary_category)) .has_left_side_menu:has(.side_col) .layout_2_col #main_container {
  padding-left: 15px;
	padding-right: 15px;
}
.ocnk004.ocnk038.responsive.column_layout:not(:has(.has_whatnew_category, .has_article_category, .has_diary_category)) .has_right_side_menu:has(.side_col) .layout_2_col #main_container {
	padding-left: 15px;
  padding-right: 15px;
}
}
/* ================================================================= */


	
/* ================================================================= */
/* ocnk005 - ナビゲーションアイコン非表示 */
/* ================================================================= */

/* グローバルナビ(…ポップアップメニュー、閉じるアイコン以外)、ポップアップナビ(カテゴリ、グループ)、サイドエリア各ナビ、フッターナビのbeforeを空 */
.ocnk005.responsive .global_nav .global_nav_item:not(.g_menu) A:not(.nav_close,.search_close) .fa:not(.right_side_nav_icon)::before,
.ocnk005.responsive .inner_popup_nav .fa:not(.right_side_nav_icon)::before,
.ocnk005.responsive .side_itemlist_nav .fa:not(.right_side_nav_icon)::before,
.ocnk005.responsive .side_nav .fa:not(.right_side_nav_icon)::before,
.ocnk005.responsive .basic_nav .fa:not(.right_side_nav_icon)::before,
.ocnk005.responsive .footer_nav .fa:not(.right_side_nav_icon)::before {
	display: none;
}

/* =================================================================
   レスポンシブ320px以上
   ================================================================= */
@media screen and (min-width: 320px) {
/* iタグの幅が反映されるのでabsoluteで非表示にする */
.ocnk005.responsive .global_nav .global_nav_item:not(:where(.g_menu, .g_cart)) A:not(:where(.nav_close, .search_close)) .fa:not(.right_side_nav_icon),
.ocnk005.responsive .global_nav .global_nav_item.g_cart .nav_text .fa.menu_nav_icon,
.ocnk005.responsive .inner_popup_nav .fa:not(.right_side_nav_icon),
.ocnk005.responsive .side_itemlist_nav .fa:not(.right_side_nav_icon),
.ocnk005.responsive .side_nav .fa:not(.right_side_nav_icon),
.ocnk005.responsive .basic_nav .fa:not(.right_side_nav_icon),
.ocnk005.responsive .footer_nav .fa:not(.right_side_nav_icon) {
  position: absolute;
  display: inline;
  margin-right: 0;
  font-size: 100%;
}
}
/* ================================================================= */

/* カートのみバッジの位置を調整：flexで並び順変更 */
.ocnk005.responsive .global_nav .global_nav_item.g_cart .nav_text,
.ocnk005.responsive .inner_popup_nav .popup_nav_item.t_cart .nav_text,
.ocnk005.responsive .side_nav .basic_nav_item.s_cart .nav_text,
.ocnk005.responsive .basic_nav .basic_nav_item.m_cart .nav_text,
.ocnk005.responsive .footer_nav .footer_nav_item.f_cart .nav_text {
  display: flex;
}
.ocnk005.responsive .global_nav .global_nav_item.g_cart .nav_text .nav_label,
.ocnk005.responsive .inner_popup_nav .popup_nav_item.t_cart .nav_text .nav_label,
.ocnk005.responsive .side_nav .basic_nav_item.s_cart .nav_text .nav_label,
.ocnk005.responsive .basic_nav .basic_nav_item.m_cart .nav_text .nav_label,
.ocnk005.responsive .footer_nav .footer_nav_item.f_cart .nav_text .nav_label {
  order: 1;
}
.ocnk005.responsive .global_nav .global_nav_item.g_cart .nav_text .fa.menu_nav_icon,
.ocnk005.responsive .inner_popup_nav .popup_nav_item.t_cart .nav_text .fa.menu_nav_icon,
.ocnk005.responsive .side_nav .basic_nav_item.s_cart .nav_text .fa.menu_nav_icon,
.ocnk005.responsive .basic_nav .basic_nav_item.m_cart .nav_text .fa.menu_nav_icon,
.ocnk005.responsive .footer_nav .footer_nav_item.f_cart .nav_text .fa.menu_nav_icon {
  order: 2;
	position: relative;
}
.ocnk005.responsive .global_nav .global_nav_item.g_cart .nav_text .fa.menu_nav_icon {
  width: 1em;
}
.ocnk005.responsive .global_nav .global_nav_item.g_cart .nav_text .fa-chevron-right,
.ocnk005.responsive .inner_popup_nav .popup_nav_item.t_cart .nav_text .fa-chevron-right,
.ocnk005.responsive .side_nav .basic_nav_item.s_cart .nav_text .fa-chevron-right,
.ocnk005.responsive .basic_nav .basic_nav_item.m_cart .nav_text .fa-chevron-right,
.ocnk005.responsive .footer_nav .footer_nav_item.f_cart .nav_text .fa-chevron-right {
  order: 3;
}
/* ================================================================= */



/* ================================================================= */
/* ocnk006 - スマートフォンでサムネイルスクロール表示 */
/* ================================================================= */

/* サムネイル横スクロール */
.ocnk006.responsive .itemdetail .thumbnail:has(ul .thumbnail_listbox:nth-child(6)) {
  width: 100%;
  overflow-x: scroll;
  scrollbar-color: #E0DFE3 #FFFFFF;
  scrollbar-width: thin;
}
/* 内部のULを最大幅にする */
.ocnk006.responsive .itemdetail .thumbnail > ul:has(.thumbnail_listbox:nth-child(6)) {
  width: max-content;
}

/* =================================================================
   レスポンシブ500px以上
   ================================================================= */
@media screen and (min-width: 500px) {
.ocnk006.responsive .itemdetail .thumbnail:has(ul .thumbnail_listbox:nth-child(6)) {
  overflow-x: visible;
}
.ocnk006.responsive .itemdetail .thumbnail > ul:has(.thumbnail_listbox:nth-child(6)) {
  width: auto;
}
}
/* ================================================================= */



/* ================================================================= */
/* ocnk007 - トップ画像画面幅100%表示 */
/* ================================================================= */

.ocnk007.responsive.wide_layout:not(:where(.touch006, .touch008, .touch010)) .top_page_body #photo .top_image_case,
.ocnk007.responsive.wide_layout:not(:where(.touch006, .touch008, .touch010)) .top_page_body #photo .top_image_slide,
.ocnk007.responsive.single_layout:not(:where(.touch006, .touch008, .touch010)) .top_page_body #photo .top_image_case,
.ocnk007.responsive.single_layout:not(:where(.touch006, .touch008, .touch010)) .top_page_body #photo .top_image_slide {
	max-width: 100%!important;
}

/* 写真100%幅にしobject-fit 縦幅は画面横幅で変動 */
.ocnk007.responsive:not(:where(.touch006, .touch008, .touch010)) #photo .item_image_box img {
  width: 100%;
  height: 400px;
  object-fit: cover;
}
/* =================================================================
   レスポンシブ600～1400px以上
   ================================================================= */
@media screen and (min-width: 600px) {
.ocnk007.responsive:not(:where(.touch006, .touch008, .touch010)) #photo .item_image_box img {
  height: 250px;
}
}
@media screen and (min-width: 840px) {
.ocnk007.responsive:not(:where(.touch006, .touch008, .touch010)) #photo .item_image_box img {
  height: 300px;
}
}
@media screen and (min-width: 900px) {
.ocnk007.responsive:not(:where(.touch006, .touch008, .touch010)) #photo .item_image_box img {
  height: 350px;
}
}
@media screen and (min-width: 980px) {
.ocnk007.responsive:not(:where(.touch006, .touch008, .touch010)).single_layout #inner_container {
  max-width: 100%;
}
}
@media screen and (min-width: 1000px) {
.ocnk007.responsive:not(:where(.touch006, .touch008, .touch010)) #photo .item_image_box img {
  height: 400px;
}
}
@media screen and (min-width: 1200px) {
.ocnk007.responsive.wide_layout:not(:where(.touch006, .touch008, .touch010)) #inner_container {
  max-width: 100%;
}
.ocnk007.responsive:not(:where(.touch006, .touch008, .touch010)) #photo .item_image_box img {
  height: 500px;
}
}
@media screen and (min-width: 1400px) {
.ocnk007.responsive:not(:where(.touch006, .touch008, .touch010)) #photo .item_image_box img {
  height: 600px;
}
}
/* ================================================================= */



/* ================================================================= */
/* ocnk008 - 通貨ラベル、税表示文字サイズ縮小 */
/* ================================================================= */

.ocnk008.responsive .tax_label,
.ocnk008.responsive .currency_label.before_price,
.ocnk008.responsive .currency_label.after_price {
  font-size: 85%;
}
.ocnk008.responsive .detail_page_body .tax_label,
.ocnk008.responsive .detail_page_body .currency_label.before_price,
.ocnk008.responsive .detail_page_body .currency_label.after_price {
  font-size: 77%;
}
/* ================================================================= */



/* ================================================================= */
/* ocnk009 - カートステップ2レイアウト変更 */
/* ================================================================= */

/* =================================================================
   レスポンシブ840px以上
   ================================================================= */
@media screen and (min-width: 840px) {
/* カート内各コンテンツ下余白 */
.ocnk009.responsive .shoppingcart_contents .contents_box {
  margin-bottom: 40px;
}
/* カート内各コンテンツタイトル下余白 */
.ocnk009.responsive .shoppingcart_contents .section_title h3 {
  margin-bottom: 10px;
}
/* 左右並び */
.ocnk009.responsive .shoppingcart_contents .cart_recipient_data,
.ocnk009.responsive .shoppingcart_contents .cart_sender_data,
.ocnk009.responsive .shoppingcart_contents .cart_subscription_cycle_data,
.ocnk009.responsive .shoppingcart_contents .cart_shipping_method_data,
.ocnk009.responsive .shoppingcart_contents .cart_option_data {
  display: flex;
}

/* 左欄 */
.ocnk009.responsive .shoppingcart_contents .cart_recipient_data .form_title,
.ocnk009.responsive .shoppingcart_contents .cart_sender_data .form_title,
.ocnk009.responsive .shoppingcart_contents .cart_subscription_cycle_data .form_title,
.ocnk009.responsive .shoppingcart_contents .cart_shipping_method_data .form_title,
.ocnk009.responsive .shoppingcart_contents .cart_option_data .form_title {
  width: 150px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #F5F5F5;
  border: none;
}
/* 各テンプレ指定
 # ================================================================= */
.ocnk009.responsive.touch002 .shoppingcart_contents .cart_recipient_data .form_title,
.ocnk009.responsive.touch002 .shoppingcart_contents .cart_sender_data .form_title,
.ocnk009.responsive.touch002 .shoppingcart_contents .cart_subscription_cycle_data .form_title,
.ocnk009.responsive.touch002 .shoppingcart_contents .cart_shipping_method_data .form_title,
.ocnk009.responsive.touch002 .shoppingcart_contents .cart_option_data .form_title {
  background-color: #E0D7D3;
}
.ocnk009.responsive.touch005 .shoppingcart_contents .cart_recipient_data .form_title,
.ocnk009.responsive.touch005 .shoppingcart_contents .cart_sender_data .form_title,
.ocnk009.responsive.touch005 .shoppingcart_contents .cart_subscription_cycle_data .form_title,
.ocnk009.responsive.touch005 .shoppingcart_contents .cart_shipping_method_data .form_title,
.ocnk009.responsive.touch005 .shoppingcart_contents .cart_option_data .form_title,
.ocnk009.responsive.touch013 .shoppingcart_contents .cart_recipient_data .form_title,
.ocnk009.responsive.touch013 .shoppingcart_contents .cart_sender_data .form_title,
.ocnk009.responsive.touch013 .shoppingcart_contents .cart_subscription_cycle_data .form_title,
.ocnk009.responsive.touch013 .shoppingcart_contents .cart_shipping_method_data .form_title,
.ocnk009.responsive.touch013 .shoppingcart_contents .cart_option_data .form_title {
  background-color: #222222;
}
.ocnk009.responsive.touch007 .shoppingcart_contents .cart_recipient_data .form_title,
.ocnk009.responsive.touch007 .shoppingcart_contents .cart_sender_data .form_title,
.ocnk009.responsive.touch007 .shoppingcart_contents .cart_subscription_cycle_data .form_title,
.ocnk009.responsive.touch007 .shoppingcart_contents .cart_shipping_method_data .form_title,
.ocnk009.responsive.touch007 .shoppingcart_contents .cart_option_data .form_title,
.ocnk009.responsive.touch025 .shoppingcart_contents .cart_recipient_data .form_title,
.ocnk009.responsive.touch025 .shoppingcart_contents .cart_sender_data .form_title,
.ocnk009.responsive.touch025 .shoppingcart_contents .cart_subscription_cycle_data .form_title,
.ocnk009.responsive.touch025 .shoppingcart_contents .cart_shipping_method_data .form_title,
.ocnk009.responsive.touch025 .shoppingcart_contents .cart_option_data .form_title,
.ocnk009.responsive.touch027 .shoppingcart_contents .cart_recipient_data .form_title,
.ocnk009.responsive.touch027 .shoppingcart_contents .cart_sender_data .form_title,
.ocnk009.responsive.touch027 .shoppingcart_contents .cart_subscription_cycle_data .form_title,
.ocnk009.responsive.touch027 .shoppingcart_contents .cart_shipping_method_data .form_title,
.ocnk009.responsive.touch027 .shoppingcart_contents .cart_option_data .form_title {
  background-color: #FFFFFF;
}
.ocnk009.responsive.touch017 .shoppingcart_contents .cart_recipient_data .form_title,
.ocnk009.responsive.touch017 .shoppingcart_contents .cart_sender_data .form_title,
.ocnk009.responsive.touch017 .shoppingcart_contents .cart_subscription_cycle_data .form_title,
.ocnk009.responsive.touch017 .shoppingcart_contents .cart_shipping_method_data .form_title,
.ocnk009.responsive.touch017 .shoppingcart_contents .cart_option_data .form_title {
  background-color: #CBC2C0;
}
.ocnk009.responsive.touch018 .shoppingcart_contents .cart_recipient_data .form_title,
.ocnk009.responsive.touch018 .shoppingcart_contents .cart_sender_data .form_title,
.ocnk009.responsive.touch018 .shoppingcart_contents .cart_subscription_cycle_data .form_title,
.ocnk009.responsive.touch018 .shoppingcart_contents .cart_shipping_method_data .form_title,
.ocnk009.responsive.touch018 .shoppingcart_contents .cart_option_data .form_title {
  background-color: #CBC2AD;
}
.ocnk009.responsive.touch023 .shoppingcart_contents .cart_recipient_data .form_title,
.ocnk009.responsive.touch023 .shoppingcart_contents .cart_sender_data .form_title,
.ocnk009.responsive.touch023 .shoppingcart_contents .cart_subscription_cycle_data .form_title,
.ocnk009.responsive.touch023 .shoppingcart_contents .cart_shipping_method_data .form_title,
.ocnk009.responsive.touch023 .shoppingcart_contents .cart_option_data .form_title {
  background-image: url(/res/touch023/style/img/alphab.png);
  background-color: transparent;
}
.ocnk009.responsive.touch026 .shoppingcart_contents .cart_recipient_data .form_title,
.ocnk009.responsive.touch026 .shoppingcart_contents .cart_sender_data .form_title,
.ocnk009.responsive.touch026 .shoppingcart_contents .cart_subscription_cycle_data .form_title,
.ocnk009.responsive.touch026 .shoppingcart_contents .cart_shipping_method_data .form_title,
.ocnk009.responsive.touch026 .shoppingcart_contents .cart_option_data .form_title {
  background-color: #FFF5F2;
  margin-bottom: 0px;
}

/* 右欄 */
.ocnk009.responsive .shoppingcart_contents .form_element,
.ocnk009.responsive .shoppingcart_contents .form_inner_element,
.ocnk009.responsive .shoppingcart_contents .cart_subscription_cycle_data .form_element {
  width: 80%;
}
.ocnk009.responsive .shoppingcart_contents #cart_payment_card .form_element {
	width: auto;
}

/* 各テンプレ指定
 # ================================================================= */
.ocnk009.responsive.touch026 .shoppingcart_contents .form_element,
.ocnk009.responsive.touch026 .shoppingcart_contents .form_inner_element,
.ocnk009.responsive.touch027 .shoppingcart_contents .form_element,
.ocnk009.responsive.touch027 .shoppingcart_contents .form_inner_element {
  padding: 10px;
}

/* 各コンテンツ内行区切り線、お支払い方法選択行区切り線 */
.ocnk009.responsive .shoppingcart_contents .cart_recipient .form_data,
.ocnk009.responsive .shoppingcart_contents .cart_payment_row {
  padding: 0px;
  border-bottom: 1px solid #E0DFE3;
}
/* 各テンプレ指定
 # ================================================================= */
.ocnk009.responsive.touch002 .shoppingcart_contents .cart_recipient .form_data,
.ocnk009.responsive.touch002 .shoppingcart_contents .cart_payment_row {
  border-bottom: 1px solid #C1B1A9;
}
.ocnk009.responsive.touch005 .shoppingcart_contents .cart_recipient .form_data,
.ocnk009.responsive.touch005 .shoppingcart_contents .cart_payment_row,
.ocnk009.responsive.touch013 .shoppingcart_contents .cart_recipient .form_data,
.ocnk009.responsive.touch013 .shoppingcart_contents .cart_payment_row {
  border-bottom: 1px solid #333333;
}
.ocnk009.responsive.touch007 .shoppingcart_contents .cart_recipient .form_data,
.ocnk009.responsive.touch007 .shoppingcart_contents .cart_payment_row {
  border-bottom: 1px solid #F49DC5;
}
.ocnk009.responsive.touch017 .shoppingcart_contents .cart_recipient .form_data,
.ocnk009.responsive.touch017 .shoppingcart_contents .cart_payment_row {
  border-bottom: 1px solid #661A00;
}
.ocnk009.responsive.touch018 .shoppingcart_contents .cart_recipient .form_data,
.ocnk009.responsive.touch018 .shoppingcart_contents .cart_payment_row,
.ocnk009.responsive.touch023 .shoppingcart_contents .cart_recipient .form_data,
.ocnk009.responsive.touch023 .shoppingcart_contents .cart_payment_row,
.ocnk009.responsive.touch026 .shoppingcart_contents .cart_recipient .form_data,
.ocnk009.responsive.touch026 .shoppingcart_contents .cart_payment_row,
.ocnk009.responsive.touch027 .shoppingcart_contents .cart_recipient .form_data,
.ocnk009.responsive.touch027 .shoppingcart_contents .cart_payment_row {
  border-bottom: 1px solid #000000;
}
.ocnk009.responsive.touch025 .shoppingcart_contents .cart_recipient .form_data,
.ocnk009.responsive.touch025 .shoppingcart_contents .cart_payment_row {
  border-bottom: 1px solid #59493F;
}

/* 発送方法、お支払い欄最終行下線非表示 */
.ocnk009.responsive .shoppingcart_contents .cart_recipient > .form_data:last-child,
.ocnk009.responsive .shoppingcart_contents .cart_recipient .shipping_radio_box:last-child .form_inner_title,
.ocnk009.responsive .shoppingcart_contents #cart_payment .cart_payment_row:last-child {
  border-bottom: none;
}
/* お支払い欄、タイトル下線非表示 */
.ocnk009.responsive .shoppingcart_contents .cart_payment_row .form_title {
  border-bottom: none;
}

/* 発送方法、お支払い欄、タイトル下線色 */
.ocnk009.responsive .shoppingcart_contents .form_inner_title {
  border-bottom: 1px solid #E0DFE3;
}
/* 各テンプレ指定
 # ================================================================= */
.ocnk009.responsive.touch002 .shoppingcart_contents .form_inner_title {
  border-bottom: 1px solid #C1B1A9;
}
.ocnk009.responsive.touch005 .shoppingcart_contents .form_inner_title,
.ocnk009.responsive.touch013 .shoppingcart_contents .form_inner_title {
  border-bottom: 1px solid #333333;
}
.ocnk009.responsive.touch007 .shoppingcart_contents .form_inner_title {
  border-bottom: 1px solid #F49DC5;
}
.ocnk009.responsive.touch017 .shoppingcart_contents .form_inner_title {
  border-bottom: 1px solid #661A00;
}
.ocnk009.responsive.touch018 .shoppingcart_contents .form_inner_title,
.ocnk009.responsive.touch023 .shoppingcart_contents .form_inner_title,
.ocnk009.responsive.touch026 .shoppingcart_contents .form_inner_title,
.ocnk009.responsive.touch027 .shoppingcart_contents .form_inner_title {
  border-bottom: 1px solid #000000;
}
.ocnk009.responsive.touch025 .shoppingcart_contents .form_inner_title {
  border-bottom: 1px solid #59493F;
}

/* 発送方法、お支払い欄、ラジオチェック時背景色 */
.ocnk009.responsive .shoppingcart_contents .form_area .checked_row > .form_title,
.ocnk009.responsive .shoppingcart_contents .form_inner_area .checked_row > .form_inner_title,
.ocnk009.responsive .shoppingcart_contents #cart_payment .checked_row .form_title,
.ocnk009.responsive .shoppingcart_contents #cart_payment .cart_payment_row.checked_row,
.ocnk009.responsive .shoppingcart_contents .cart_shipping_row.checked_row {
  background-color: #F5F5F5;
}
/* 各テンプレ指定
 # ================================================================= */
.ocnk009.responsive.touch002 .shoppingcart_contents .form_area .checked_row > .form_title,
.ocnk009.responsive.touch002 .shoppingcart_contents .form_inner_area .checked_row > .form_inner_title,
.ocnk009.responsive.touch002 .shoppingcart_contents #cart_payment .checked_row .form_title,
.ocnk009.responsive.touch002 .shoppingcart_contents #cart_payment .cart_payment_row.checked_row,
.ocnk009.responsive.touch002 .shoppingcart_contents .cart_shipping_row.checked_row {
  background-color: #FFEFBF;
}
.ocnk009.responsive.touch005 .shoppingcart_contents .form_area .checked_row > .form_title,
.ocnk009.responsive.touch005 .shoppingcart_contents .form_inner_area .checked_row > .form_inner_title,
.ocnk009.responsive.touch005 .shoppingcart_contents #cart_payment .checked_row .form_title,
.ocnk009.responsive.touch005 .shoppingcart_contents #cart_payment .cart_payment_row.checked_row,
.ocnk009.responsive.touch005 .shoppingcart_contents .cart_shipping_row.checked_row,
.ocnk009.responsive.touch013 .shoppingcart_contents .form_area .checked_row > .form_title,
.ocnk009.responsive.touch013 .shoppingcart_contents .form_inner_area .checked_row > .form_inner_title,
.ocnk009.responsive.touch013 .shoppingcart_contents #cart_payment .checked_row .form_title,
.ocnk009.responsive.touch013 .shoppingcart_contents #cart_payment .cart_payment_row.checked_row,
.ocnk009.responsive.touch013 .shoppingcart_contents .cart_shipping_row.checked_row{
  background-color: #444444;
}
.ocnk009.responsive.touch007 .shoppingcart_contents .form_area .checked_row > .form_title,
.ocnk009.responsive.touch007 .shoppingcart_contents .form_inner_area .checked_row > .form_inner_title,
.ocnk009.responsive.touch007 .shoppingcart_contents #cart_payment .checked_row .form_title,
.ocnk009.responsive.touch007 .shoppingcart_contents #cart_payment .cart_payment_row.checked_row,
.ocnk009.responsive.touch007 .shoppingcart_contents .cart_shipping_row.checked_row {
  background-color: #FBD5E6;
}
.ocnk009.responsive.touch009 .shoppingcart_contents .form_area .checked_row > .form_title,
.ocnk009.responsive.touch009 .shoppingcart_contents .form_inner_area .checked_row > .form_inner_title,
.ocnk009.responsive.touch009 .shoppingcart_contents #cart_payment .checked_row .form_title,
.ocnk009.responsive.touch009 .shoppingcart_contents #cart_payment .cart_payment_row.checked_row,
.ocnk009.responsive.touch009 .shoppingcart_contents .cart_shipping_row.checked_row {
  background-color: #FFFFCC;
}
.ocnk009.responsive.touch017 .shoppingcart_contents .form_area .checked_row > .form_title,
.ocnk009.responsive.touch017 .shoppingcart_contents .form_inner_area .checked_row > .form_inner_title,
.ocnk009.responsive.touch017 .shoppingcart_contents #cart_payment .checked_row .form_title,
.ocnk009.responsive.touch017 .shoppingcart_contents #cart_payment .cart_payment_row.checked_row,
.ocnk009.responsive.touch017 .shoppingcart_contents .cart_shipping_row.checked_row,
.ocnk009.responsive.touch018 .shoppingcart_contents .form_area .checked_row > .form_title,
.ocnk009.responsive.touch018 .shoppingcart_contents .form_inner_area .checked_row > .form_inner_title,
.ocnk009.responsive.touch018 .shoppingcart_contents #cart_payment .checked_row .form_title,
.ocnk009.responsive.touch018 .shoppingcart_contents #cart_payment .cart_payment_row.checked_row,
.ocnk009.responsive.touch018 .shoppingcart_contents .cart_shipping_row.checked_row {
  background-color: #EEE9C8;
}
.ocnk009.responsive.touch022 .shoppingcart_contents .form_area .checked_row > .form_title,
.ocnk009.responsive.touch022 .shoppingcart_contents .form_inner_area .checked_row > .form_inner_title,
.ocnk009.responsive.touch022 .shoppingcart_contents #cart_payment .checked_row .form_title,
.ocnk009.responsive.touch022 .shoppingcart_contents #cart_payment .cart_payment_row.checked_row,
.ocnk009.responsive.touch022 .shoppingcart_contents .cart_shipping_row.checked_row {
  background-color: #F8F8DA;
}
.ocnk009.responsive.touch023 .shoppingcart_contents .form_area .checked_row > .form_title,
.ocnk009.responsive.touch023 .shoppingcart_contents .form_inner_area .checked_row > .form_inner_title,
.ocnk009.responsive.touch023 .shoppingcart_contents #cart_payment .checked_row .form_title,
.ocnk009.responsive.touch023 .shoppingcart_contents #cart_payment .cart_payment_row.checked_row,
.ocnk009.responsive.touch023 .shoppingcart_contents .cart_shipping_row.checked_row {
  background-color: #FFFFEE4D;
}
.ocnk009.responsive.touch025 .shoppingcart_contents .form_area .checked_row > .form_title,
.ocnk009.responsive.touch025 .shoppingcart_contents .form_inner_area .checked_row > .form_inner_title,
.ocnk009.responsive.touch025 .shoppingcart_contents #cart_payment .checked_row .form_title,
.ocnk009.responsive.touch025 .shoppingcart_contents #cart_payment .cart_payment_row.checked_row,
.ocnk009.responsive.touch025 .shoppingcart_contents .cart_shipping_row.checked_row {
  background-color: #F0E4D8;
}
.ocnk009.responsive.touch026 .shoppingcart_contents .form_area .checked_row > .form_title,
.ocnk009.responsive.touch026 .shoppingcart_contents .form_inner_area .checked_row > .form_inner_title,
.ocnk009.responsive.touch026 .shoppingcart_contents #cart_payment .checked_row .form_title,
.ocnk009.responsive.touch026 .shoppingcart_contents #cart_payment .cart_payment_row.checked_row,
.ocnk009.responsive.touch026 .shoppingcart_contents .cart_shipping_row.checked_row {
  background-color: #FFF5F2;
}
.ocnk009.responsive.touch027 .shoppingcart_contents .form_area .checked_row > .form_title,
.ocnk009.responsive.touch027 .shoppingcart_contents .form_inner_area .checked_row > .form_inner_title,
.ocnk009.responsive.touch027 .shoppingcart_contents #cart_payment .checked_row .form_title,
.ocnk009.responsive.touch027 .shoppingcart_contents #cart_payment .cart_payment_row.checked_row,
.ocnk009.responsive.touch027 .shoppingcart_contents .cart_shipping_row.checked_row {
  background-color: #FFFFFFB3;
}

/* 発送方法、お支払い欄、ラジオチェック時タイトル色 */
.ocnk009.responsive .shoppingcart_contents .form_area .checked_row > .form_title,
.ocnk009.responsive .shoppingcart_contents .form_inner_area .checked_row > .form_inner_title {
  font-weight: 700;
  color: #000000;
}
/* 各テンプレ指定
 # ================================================================= */
.ocnk009.responsive.touch002 .shoppingcart_contents .form_area .checked_row > .form_title,
.ocnk009.responsive.touch002 .shoppingcart_contents .form_inner_area .checked_row > .form_inner_title {
  color: #CC0000;
}
.ocnk009.responsive.touch005 .shoppingcart_contents .form_area .checked_row > .form_title,
.ocnk009.responsive.touch005 .shoppingcart_contents .form_inner_area .checked_row > .form_inner_title,
.ocnk009.responsive.touch013 .shoppingcart_contents .form_area .checked_row > .form_title,
.ocnk009.responsive.touch013 .shoppingcart_contents .form_inner_area .checked_row > .form_inner_title {
  color: #FFFFFF;
}

/* お支払い方法選択欄余白削除 */
.ocnk009.responsive .shoppingcart_contents #payment_form .cart_payment_row {
  margin: 0px;
}
}
/* ================================================================= */



/* ================================================================= */
/* ocnk010 - 商品一覧画像を一覧枠100%表示  */
/* ================================================================= */

.ocnk010.responsive #container:not(.use_lightweight_thumbnail) .slider_box:not(.initial_loading) .layout_photo .item_list .slide_item_cell :is(.list_item_photo, .list_item_photo .item_image),
.ocnk010.responsive #container:not(.use_lightweight_thumbnail) .item_list .tiled_list .wrapped_item :is(.list_item_photo, .list_item_photo .item_image) {
  max-width: 100%;
  width: 100%;
  object-fit: contain;
}
.ocnk010.responsive #container:not(.use_lightweight_thumbnail) .layout_photo .list_item_photo {
  padding: 0;
}
.ocnk010.responsive #container:not(.use_lightweight_thumbnail) .itemlist_box .inner_item_data {
	padding: 10px;
}
/* ================================================================= */



/* ================================================================= */
/* ocnk011 - 商品詳細メイン画像の大/中選択時レイアウト  */
/* ================================================================= */

/* =================================================================
   レスポンシブ840px以上
   ================================================================= */
@media screen and (min-width: 840px) {
/* flexで.main_photo_slideと.large_product_info_boxを左右に並べる */
/* 840px以下ではサイドがない場合のみ */
.ocnk011.responsive:not(:has(.side_col)) .large_product_info_wrapper {
  display: flex;
}
/* メイン写真枠の横幅指定、サイド無し */
.ocnk011.responsive:not(:has(.side_col)) #container .large_product_info_wrapper .main_photo_slide {
  max-width: 400px;
}
/* 商品名/在庫/カートボタンなどのコンテンツ　両サイド幅MAXになるので左右に余白 */
.ocnk011.responsive .large_product_info_wrapper .large_product_info_box {
  padding-left: 20px;
  padding-right: 20px;
  flex: 1;
}
/* 写真外の左右スライド送りボタンを内側に入れる */
.ocnk011.responsive .large_product_info_wrapper .has_outside_controller .swiper-button-prev {
  left: 5px;
}
.ocnk011.responsive .large_product_info_wrapper .has_outside_controller .swiper-button-next {
  right: 5px;
}
}

/* =================================================================
   レスポンシブ980px以上
   ================================================================= */
@media screen and (min-width: 980px) {
/* flexで.main_photo_slideと.large_product_info_boxを左右に並べる */
/* 980px以上でサイドがある場合は適用 */
.ocnk011.responsive:has(.side_col) .large_product_info_wrapper {
  display: flex;
}
/* メイン写真枠の横幅指定、サイド有り無し */
.ocnk011.responsive:not(:has(.side_col)) #container .large_product_info_wrapper .main_photo_slide {
  max-width: 600px;
}
.ocnk011.responsive #container:has(.side_col) .large_product_info_wrapper .main_photo_slide {
  max-width: 300px;
}
/* メイン写真の横幅指定、サイド有り */
.ocnk011.responsive #container:has(.side_col) .large_product_info_wrapper .square_photo_slide_400 .item_image_box,
.ocnk011.responsive #container:has(.side_col) .large_product_info_wrapper .square_photo_slide_600 .item_image_box {
  width: 300px;
  height: 300px;
  line-height: 300px;
}
/* 幅を揃える　※画像が縮小される対応 */
.ocnk011.responsive #container:has(.side_col) .large_product_info_wrapper .align_widths_photo_slide_400 .item_image_box,
.ocnk011.responsive #container:has(.side_col) .large_product_info_wrapper .align_widths_photo_slide_600 .item_image_box {
  width: 300px;
}
/* サムネイルがresponsive.cssの120pxでは大き過ぎるので60pxに縮小 */
.ocnk011.responsive #container:has(.side_col) .main_photo_slide.square_photo_slide_600 .thumbnail_listbox,
.ocnk011.responsive #container:has(.side_col)	.main_photo_slide.align_widths_photo_slide_600 .thumbnail_listbox {
	width: 60px;
}
}

/* =================================================================
   レスポンシブ1000px以上
   ================================================================= */
@media screen and (min-width: 1080px) {

/* メイン写真枠の横幅指定、サイド無し */
.ocnk011.responsive #container:has(.side_col) .large_product_info_wrapper .main_photo_slide {
  max-width: 400px;
}
/* メイン写真の横幅指定、サイド有り */
.ocnk011.responsive #container:has(.side_col) .large_product_info_wrapper .square_photo_slide_400 .item_image_box,
.ocnk011.responsive #container:has(.side_col) .large_product_info_wrapper .square_photo_slide_600 .item_image_box {
  width: 400px;
  height: 400px;
  line-height: 400px;
}
/* 幅を揃える　※画像が縮小される対応 */
.ocnk011.responsive #container:has(.side_col) .large_product_info_wrapper .align_widths_photo_slide_400 .item_image_box,
.ocnk011.responsive #container:has(.side_col) .large_product_info_wrapper .align_widths_photo_slide_600 .item_image_box {
  width: 400px;
}
}

/* =================================================================
   レスポンシブ1200px以上
   ================================================================= */
@media screen and (min-width: 1200px) {
/* メイン写真枠の横幅指定、サイド有り */
.ocnk011.responsive #container:has(.side_col) .large_product_info_wrapper .main_photo_slide.align_widths_photo_slide_400,
.ocnk011.responsive #container:has(.side_col) .large_product_info_wrapper .main_photo_slide.square_photo_slide_400 {
  max-width: 400px;
}
.ocnk011.responsive #container:has(.side_col) .large_product_info_wrapper .main_photo_slide {
  max-width: 600px;
}
/* メイン写真の横幅指定、サイド有り */
.ocnk011.responsive #container:has(.side_col) .large_product_info_wrapper .square_photo_slide_600 .item_image_box {
  width: 600px;
  height: 600px;
  line-height: 600px;
}
.ocnk011.responsive:has(.side_col) .large_product_info_wrapper:has(.align_widths_photo_slide_600, .square_photo_slide_600) .large_product_info_box .cartinput.btn_size_xxlarge {
  width: 241px;
}
.ocnk001.ocnk011.responsive:has(.side_col) .large_product_info_wrapper:has(.align_widths_photo_slide_600, .square_photo_slide_600) .large_product_info_box .cartinput.btn_size_xxlarge {
  width: 100%;
}
/* 幅を揃える　※画像が縮小される対応 */
.ocnk011.responsive #container:has(.side_col) .large_product_info_wrapper .align_widths_photo_slide_600 .item_image_box {
  width: 600px;
}

/* 各テンプレ指定
 # ================================================================= */
/* 6番8番10番は横幅が狭いので余白を左右10pxにする */
.ocnk011.responsive:has(.side_col).touch006 .large_product_info_wrapper:has(.align_widths_photo_slide_600, .square_photo_slide_600) .large_product_info_box,
.ocnk011.responsive:has(.side_col).touch008 .large_product_info_wrapper:has(.align_widths_photo_slide_600, .square_photo_slide_600) .large_product_info_box,
.ocnk011.responsive:has(.side_col).touch010 .large_product_info_wrapper:has(.align_widths_photo_slide_600, .square_photo_slide_600) .large_product_info_box {
  padding-left: 10px;
  padding-right: 10px;
}

/* サムネイルをresponsive.cssに合わせて120pxにする */
.ocnk011.responsive #container:has(.side_col) .main_photo_slide.square_photo_slide_600 .thumbnail_listbox,
.ocnk011.responsive #container:has(.side_col)	.main_photo_slide.align_widths_photo_slide_600 .thumbnail_listbox {
	width: 120px;
}
}

/* =================================================================
   レスポンシブ1280px以上
================================================================= */
@media screen and (min-width: 1280px) {

.ocnk011.ocnk028.responsive:has(.side_col) .large_product_info_wrapper:has(.align_widths_photo_slide_600, .square_photo_slide_600) .large_product_info_box .cartinput.btn_size_xxlarge {
  width: 281px;
}
.ocnk001.ocnk011.ocnk028.responsive:has(.side_col) .large_product_info_wrapper:has(.align_widths_photo_slide_600, .square_photo_slide_600) .large_product_info_box .cartinput.btn_size_xxlarge {
  width: 100%;
}

/* 各テンプレ指定
 # ================================================================= */
/* ocnk028を設定すると横幅が広くなるので余白を左右20pxにする */
.ocnk011.ocnk028.responsive:has(.side_col).touch006 .large_product_info_wrapper:has(.align_widths_photo_slide_600, .square_photo_slide_600) .large_product_info_box,
.ocnk011.ocnk028.responsive:has(.side_col).touch008 .large_product_info_wrapper:has(.align_widths_photo_slide_600, .square_photo_slide_600) .large_product_info_box,
.ocnk011.ocnk028.responsive:has(.side_col).touch010 .large_product_info_wrapper:has(.align_widths_photo_slide_600, .square_photo_slide_600) .large_product_info_box {
  padding-left: 20px;
  padding-right: 20px;
}
}

/* =================================================================
   レスポンシブ840px～1400px以上
================================================================= */
@media screen and (min-width:840px) and (max-width:1420px) {
.ocnk011.ocnk034.responsive #inner_contents:not(:has(#left_side_col)) .large_product_info_wrapper {
	padding-left: 5px;
}
}
/* ================================================================= */


/* ================================================================= */
/* ocnk012 - スマートフォンで商品詳細画像を画面幅100%表示  */
/* ================================================================= */

/* =================================================================
   レスポンシブ500px以下
   ================================================================= */
@media screen and (max-width: 500px) {
/* スライド枠幅をmax500pxに変更 */
.ocnk012.responsive .main_photo_slide .inner_slider_box,
.ocnk012.responsive .main_photo_slide .slider_box .swiper-container {
  max-width: 500px;
}
/* 画像枠幅を100%に変更 */
.ocnk012.responsive .main_photo_slide .item_image_box {
  width: 100%;
  height: auto;
}
/* 縦横を横幅で固定、object-fitで比率調整 */
.ocnk012.responsive .main_photo_slide .item_image {
  max-width: 100%;
  object-fit: contain;
}
/* メイン画像の幅を揃える設定 */
.ocnk012.responsive .main_photo_slide:is(.align_widths_photo_slide_300, .align_widths_photo_slide_400, .align_widths_photo_slide_600) .item_image {
  width: 100dvw;
  height: auto;
  max-height: none;
}
  /* メイン画像の高さを揃える設定 */
.ocnk012.responsive .main_photo_slide:is(.square_photo_slide_300, .square_photo_slide_400, .square_photo_slide_600) .item_image {
  width: 100%;
  height: 100dvw;
  max-height: 100dvw;
}
/* 角丸のパーツと併用時に余白を付与 */
.ocnk012.ocnk034.responsive .main_photo_slide {
  padding: 0 5px;
}
/* 高さをを揃える場合の角丸のパーツ併用 (正方形 or 縦長画像) */
.ocnk012.ocnk034.responsive .main_photo_slide:is(.square_photo_slide_300, .square_photo_slide_400, .square_photo_slide_600) .portrait_item_image_box .item_image {
  width: auto;
  height: calc(100dvw - 10px);
  max-height: calc(100dvw - 10px);
}
/* 高さをを揃える場合の角丸のパーツ併用 (横長画像) */
.ocnk012.ocnk034.responsive .main_photo_slide:is(.square_photo_slide_300, .square_photo_slide_400, .square_photo_slide_600) :is(.square_item_image_box, .landscape_item_image_box) {
  width: auto;
  height: calc(100dvw - 10px);
  max-height: calc(100dvw - 10px);
  display: grid;
  place-items: center;
}
.ocnk012.ocnk034.responsive .main_photo_slide:is(.square_photo_slide_300, .square_photo_slide_400, .square_photo_slide_600) :is(.square_item_image_box, .landscape_item_image_box) .item_image {
  height: auto;
}
}
/* ================================================================= */



/* ================================================================= */
/* ocnk013 - PC表示でトップ画像のページ送りを長方形から●に変更  */
/* ================================================================= */

/* =================================================================
   レスポンシブ840px以上
   ================================================================= */
@media screen and (min-width: 840px) {
.ocnk013.responsive .has_inside_pagination .swiper-pagination .swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  border-radius: 8px;
}
}
/* ================================================================= */



/* ================================================================= */
/* ocnk014 - フォントをNoto Sans(ゴシック体)に変更   */
/* ================================================================= */
.ocnk014.responsive body,
.ocnk014.responsive select,
.ocnk014.responsive input,
.ocnk014.responsive button,
.ocnk014.responsive textarea,
.ocnk014.responsive button {
   font-family: 'Noto Sans JP', sans-serif;
}
/* ================================================================= */



/* ================================================================= */
/* ocnk015 - フォントをNoto Serif(明朝体)に変更   */
/* ================================================================= */
.ocnk015.responsive body,
.ocnk015.responsive select,
.ocnk015.responsive input,
.ocnk015.responsive button,
.ocnk015.responsive textarea,
.ocnk015.responsive button {
   font-family: 'Noto Serif JP', serif;
}
/* ================================================================= */



/* ================================================================= */
/* ocnk016 - ランキングタブデザインを変更   */
/* ================================================================= */

/* ランキングページ ランキングタブ下余白 */
.ocnk016.responsive .ranking_page_body .inner_ranking_navigation {
  margin-bottom: 20px;
}
/* 通常時タブ 下線3px */
.ocnk016.responsive .ranking_navigation.anchor_nav_area .nav_btn {
  border: none;
  background-color: transparent;
	background-image: none;
  border-bottom: 3px solid #E0DFE3;
}
/* マウスオーバー時タブ */
.ocnk016.responsive.use_hover .ranking_navigation.anchor_nav_area .nav_btn:hover {
  border: none;
  background-color: transparent;
	background-image: none;
  border-bottom: 3px solid #000000;
}
/* 選択時タブ */
.ocnk016.responsive .ranking_navigation.anchor_nav_area .nav_btn.nav_on {
  border: none;
  background-color: transparent;
	background-image: none;
  border-bottom: 3px solid #000000;
}

/* 各テンプレ指定
 # ================================================================= */
/* テクスチャパターン：002,017,018,023 */
.ocnk016.responsive.touch002 .ranking_navigation.anchor_nav_area .nav_btn,
.ocnk016.responsive.touch017 .ranking_navigation.anchor_nav_area .nav_btn,
.ocnk016.responsive.touch018 .ranking_navigation.anchor_nav_area .nav_btn,
.ocnk016.responsive.touch021 .ranking_navigation.anchor_nav_area .nav_btn,
.ocnk016.responsive.touch023 .ranking_navigation.anchor_nav_area .nav_btn,
.ocnk016.responsive.touch029 .ranking_navigation.anchor_nav_area .nav_btn {
	border-bottom: 3px solid #0000001A;
}
.ocnk016.responsive.touch002 .ranking_navigation.anchor_nav_area .nav_btn.nav_on,
.ocnk016.responsive.touch017 .ranking_navigation.anchor_nav_area .nav_btn.nav_on,
.ocnk016.responsive.touch018 .ranking_navigation.anchor_nav_area .nav_btn.nav_on,
.ocnk016.responsive.touch021 .ranking_navigation.anchor_nav_area .nav_btn.nav_on,
.ocnk016.responsive.touch023 .ranking_navigation.anchor_nav_area .nav_btn.nav_on,
.ocnk016.responsive.touch029 .ranking_navigation.anchor_nav_area .nav_btn.nav_on {
	border-bottom: 3px solid #000000;
}
/* 黒背景パターン:005,013 */
.ocnk016.responsive.touch005 .ranking_navigation.anchor_nav_area .nav_btn,
.ocnk016.responsive.touch013 .ranking_navigation.anchor_nav_area .nav_btn {
	border-bottom: 3px solid #333333;
}
.ocnk016.responsive.touch005.use_hover .ranking_navigation.anchor_nav_area .nav_btn:hover,
.ocnk016.responsive.touch013.use_hover .ranking_navigation.anchor_nav_area .nav_btn:hover {
  border-bottom: 3px solid #555555;
}
.ocnk016.responsive.touch005 .ranking_navigation.anchor_nav_area .nav_btn.nav_on,
.ocnk016.responsive.touch013 .ranking_navigation.anchor_nav_area .nav_btn.nav_on {
  border-bottom: 3px solid #555555;
}

/* =================================================================
   レスポンシブ840px以上
   ================================================================= */
@media screen and (min-width: 840px) {
.ocnk016.responsive .ranking_page_body .inner_ranking_navigation {
  margin-bottom: 40px;
}
.ocnk016.responsive .anchor_nav_area.ranking_navigation .flex_wrap .wrapped_item,
.ocnk016.responsive.wide_layout .layout_2_col .anchor_nav_area.ranking_navigation .flex_wrap .wrapped_item {
  flex: 1;
	width: auto;
}
}
/* ================================================================= */



/* ================================================================= */
/* ocnk017 - 販売価格の文字サイズを大きくする   */
/* ================================================================= */

/* 商品一覧 */
.ocnk017.responsive .list_item_data .selling_price > .figure,
.ocnk017.responsive .list_item_data .regular_price > .figure {
	font-size: 116%;
}

/* 商品詳細 */
.ocnk017.responsive .detail_item_data .selling_price .figure#pricech,
.ocnk017.responsive .detail_item_data .selling_price .figure#subscription_first_pricech,
.ocnk017.responsive .detail_item_data .selling_price .figure#subscription_second_pricech {
	font-size: 123.1%;
}
.ocnk017.responsive .detail_item_data .selling_price .figure#gen_price,
.ocnk017.responsive .detail_item_data .retail_price .figure {
	font-size: 116%;
}
/* 通貨リセット */
.ocnk017.responsive .currency_label {
	font-size: 77%;
}

/* =================================================================
   レスポンシブ840px以上
   ================================================================= */
@media screen and (min-width: 840px) {
  .ocnk017.responsive .list_item_data .selling_price > .figure,
	.ocnk017.responsive .list_item_data .regular_price > .figure {
	  font-size: 123.1%;
  }
  .ocnk017.responsive .detail_item_data .selling_price .figure#pricech,
  .ocnk017.responsive .detail_item_data .selling_price .figure#subscription_first_pricech,
  .ocnk017.responsive .detail_item_data .selling_price .figure#subscription_second_pricech {
	  font-size: 138.5%;
  }
	.ocnk017.responsive .detail_item_data .selling_price .figure#gen_price,
  .ocnk017.responsive .detail_item_data .retail_price .figure {
	  font-size: 123.1%;
  }
}
/* ================================================================= */



/* ================================================================= */
/* ocnk018 - スマートフォンでロゴを中央寄せ   */
/* ================================================================= */

/* =================================================================
   レスポンシブ840px以下
   ================================================================= */
/* サイドメニュー、右上ヘッダーボタン2つ設定時に左にロゴがずれるのを中央に寄せる */
@media screen and (370px <= width < 840px) {
  .ocnk018.responsive .has_left_side_menu #inner_header:has(.header_nav_size2) .header_left.menu_opener_box {
	  min-width: 110px;
  }
  .ocnk018.responsive .has_left_side_menu #inner_header:has(.header_nav_size2) .header_center.center_shop_name .shoplogo img,
	.ocnk018.responsive .has_min_nav #inner_header:has(.header_nav_size1) .header_center.center_shop_name .shoplogo img {
	  max-width: 140px;
  }
}
/* ================================================================= */



/* ================================================================= */
/* ocnk019 - スマートフォンでスライド左右矢印アイコン非表示   */
/* ================================================================= */

/* =================================================================
   レスポンシブ840px以下
   ================================================================= */
/* スライドの●〇〇両サイド矢印を非表示 */
@media screen and (max-width: 840px) {
.ocnk019.responsive .lower_slider_controller .swiper-button-next,
.ocnk019.responsive .lower_slider_controller .swiper-button-prev {
	display: none;
}
.ocnk019.responsive .slider_box .layout_photo .swiper-container {
	padding: 0;
}
}
/* ================================================================= */



/* ================================================================= */
/* ocnk020 - 検索デザイン変更   */
/* ================================================================= */

/* 検索フォームデザインをリセット */
.ocnk020.responsive .search_bar:has(.global_btn .searchinput) .search_form input[type="search"]{
	margin-right: 5px;
  background-color: transparent;
  border: none;
  border-radius: 0px;
  box-shadow: none;
	outline: none;
}
.ocnk020.responsive .search_bar:has(.global_btn .searchinput) .search_form input[type="search"]:focus {
  background-color: #FFFFFF;
}
/* 検索枠背景色 */
.ocnk020.responsive .search_bar:has(.global_btn .searchinput) .search {
	padding: 5px;
  background-color: #F5F5F5;
	text-align: left;
}
/* 検索ボタンをFontAwesomeの虫眼鏡アイコンに変更 */
.ocnk020.responsive .search_bar:has(.global_btn .searchinput) .global_btn .searchinput,
.ocnk020.responsive.use_hover .search_bar:has(.global_btn .searchinput) .global_btn .searchinput:hover {
  width: 1em;
  height: 30px;
  background-image: none;
  background-color: transparent;
	border: none;
	box-shadow: none;
	cursor: pointer;
	font: normal normal normal 14px/1 FontAwesome;
  text-transform: none;
	text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  line-height: 1;
  font-size: 22px;
  text-align: center;
	color: #000000;
}
.ocnk020.responsive .search_bar:has(.global_btn .searchinput) .global_btn .searchinput:before {
  content: "\f002";
}
/* ポップアップする商品検索バーの高さのCSS変数値を変更 */
.ocnk020 #container {
  --popup-search-bar-height: 49px;
}

/* 各テンプレ指定
 # ================================================================= */
.ocnk020.responsive.touch002 .search_bar:has(.global_btn .searchinput) .inner_search_bar .search_close {
	border-color: #000000;
}
.ocnk020.responsive.touch002.use_hover .search_bar:has(.global_btn .searchinput) .inner_search_bar .search_close:hover {
	border-color: #000000;
	background-color: #CCCCCC;
}
.ocnk020.responsive.touch002 .search_bar:has(.global_btn .searchinput) .inner_search_bar .close_btn_box .fa {
	color: #000000;
}
.ocnk020.responsive.touch028 #header_area .search_bar:has(.global_btn .searchinput) .global_btn button {
	background-color: transparent;
}

/* =================================================================
   レスポンシブ840px以下
   ================================================================= */
@media screen and (max-width: 840px) {
/* 検索フォームの横幅を広げる */
.ocnk020.responsive .search_bar:has(.global_btn .searchinput) .search_form input[type="search"]{
	width: 75%;
}

.ocnk020.responsive.compact_header_nav_opened .search_bar:has(.global_btn .searchinput) .search_form input[type="search"] {
	width: 85%;
	box-sizing: border-box;
}
}

/* =================================================================
   レスポンシブ840px以上
   ================================================================= */
@media screen and (min-width: 840px) {
/* 検索フォームを中央に寄せる */
.ocnk020.responsive .search_bar:has(.global_btn .searchinput) .search {
	text-align: center;
}
/* パソコンで検索枠が右上にある時は余白を狭くする */
.ocnk020.responsive .has_search_bar .search_bar:has(.global_btn .searchinput) .search {
  margin-top: 0;
  padding: 1px 5px;
	text-align: left;
}
/* パソコンで検索枠が右上にある時の位置調整 */
.ocnk020.responsive .has_search_bar .search_bar:has(.global_btn .searchinput) {
	top: 5px;
}
}
/* ================================================================= */



/* ================================================================= */
/* ocnk021 - スライドの左右矢印アイコンを小さくする   */
/* ================================================================= */

/* =================================================================
   レスポンシブ840px以上
   ================================================================= */
@media screen and (min-width: 840px) {
/* テンプレ27以外、縦幅いっぱいから長方形に変更し位置調整 */
.ocnk021.responsive:not(.touch027) .slider_box .layout_photo .lower_slider_controller .swiper-button-next,
.ocnk021.responsive:not(.touch027) .slider_box .layout_photo .lower_slider_controller .swiper-button-prev {
	width: 25px;
	height: 40px;
	top: 30%;
	border-radius: 5px;
	border: none;
	background-color: #FFFFFF80;
}
.ocnk021.responsive.use_hover:not(.touch027) .slider_box .layout_photo .lower_slider_controller .swiper-button-next:not(.swiper-button-disabled):hover,
.ocnk021.responsive.use_hover:not(.touch027) .slider_box .layout_photo .lower_slider_controller .swiper-button-prev:not(.swiper-button-disabled):hover {
	opacity: .7;
}
	
/* 各テンプレ指定
 # ================================================================= */
.ocnk021.responsive.touch002 .slider_box .layout_photo .lower_slider_controller .swiper-button-next,
.ocnk021.responsive.touch002 .slider_box .layout_photo .lower_slider_controller .swiper-button-prev {
	background-color: #E2D8D380;
}
.ocnk021.responsive.touch007 .slider_box .layout_photo .lower_slider_controller .swiper-button-next,
.ocnk021.responsive.touch007 .slider_box .layout_photo .lower_slider_controller .swiper-button-prev {
	background-color: #FACFE280;
}
.ocnk021.responsive.touch005 .slider_box .layout_photo .lower_slider_controller .swiper-button-next,
.ocnk021.responsive.touch005 .slider_box .layout_photo .lower_slider_controller .swiper-button-prev,
.ocnk021.responsive.touch013 .slider_box .layout_photo .lower_slider_controller .swiper-button-next,
.ocnk021.responsive.touch013 .slider_box .layout_photo .lower_slider_controller .swiper-button-prev {
	background-color: #22222280;
}
.ocnk021.responsive.touch017 .slider_box .layout_photo .lower_slider_controller .swiper-button-next,
.ocnk021.responsive.touch017 .slider_box .layout_photo .lower_slider_controller .swiper-button-prev,
.ocnk021.responsive.touch018 .slider_box .layout_photo .lower_slider_controller .swiper-button-next,
.ocnk021.responsive.touch018 .slider_box .layout_photo .lower_slider_controller .swiper-button-prev {
	background-color: #CFC1BA80;
}
.ocnk021.responsive.touch026 .slider_box .layout_photo .lower_slider_controller .swiper-button-prev,
.ocnk021.responsive.touch026 .slider_box .layout_photo .lower_slider_controller .swiper-button-next {
	background-color: #FAE4DD;
	width: 30px;
}
.ocnk021.responsive.touch025 .slider_box .layout_photo .lower_slider_controller .swiper-button-next,
.ocnk021.responsive.touch025 .slider_box .layout_photo .lower_slider_controller .swiper-button-prev,
.ocnk021.responsive.touch028 .slider_box .layout_photo .lower_slider_controller .swiper-button-next,
.ocnk021.responsive.touch028 .slider_box .layout_photo .lower_slider_controller .swiper-button-prev,
.ocnk021.responsive.touch030 .slider_box .layout_photo .lower_slider_controller .swiper-button-next,
.ocnk021.responsive.touch030 .slider_box .layout_photo .lower_slider_controller .swiper-button-prev,
.ocnk021.responsive.touch031 .slider_box .layout_photo .lower_slider_controller .swiper-button-next,
.ocnk021.responsive.touch031 .slider_box .layout_photo .lower_slider_controller .swiper-button-prev {
	background-color: #FFFFFF;
}
.ocnk021.responsive.touch028 .slider_box .layout_photo .lower_slider_controller .swiper-button-next,
.ocnk021.responsive.touch028 .slider_box .layout_photo .lower_slider_controller .swiper-button-prev,
.ocnk021.responsive.touch029 .slider_box .layout_photo .lower_slider_controller .swiper-button-next,
.ocnk021.responsive.touch029 .slider_box .layout_photo .lower_slider_controller .swiper-button-prev,
.ocnk021.responsive.touch030 .slider_box .layout_photo .lower_slider_controller .swiper-button-next,
.ocnk021.responsive.touch030 .slider_box .layout_photo .lower_slider_controller .swiper-button-prev,
.ocnk021.responsive.touch031 .slider_box .layout_photo .lower_slider_controller .swiper-button-next,
.ocnk021.responsive.touch031 .slider_box .layout_photo .lower_slider_controller .swiper-button-prev {
	background-size: 15px auto;
}
.ocnk021.responsive.touch030.use_hover .slider_box .layout_photo .lower_slider_controller .swiper-button-next:hover,
.ocnk021.responsive.touch030.use_hover .slider_box .layout_photo .lower_slider_controller .swiper-button-prev:hover {
	background-color: #D3A762;
}
.ocnk021.responsive.touch031.use_hover .slider_box .layout_photo .lower_slider_controller .swiper-button-next:hover,
.ocnk021.responsive.touch031.use_hover .slider_box .layout_photo .lower_slider_controller .swiper-button-prev:hover {
	background-color: #A6A6A6;
}
/* 非アクティブの場合非表示 */
.ocnk021.responsive .slider_box .layout_photo .swiper-button-next.swiper-button-disabled,
.ocnk021.responsive .slider_box .layout_photo .swiper-button-prev.swiper-button-disabled,
.ocnk021.responsive.use_hover .slider_box .layout_photo .swiper-button-next.swiper-button-disabled:hover,
.ocnk021.responsive.use_hover .slider_box .layout_photo .swiper-button-prev.swiper-button-disabled:hover {
	opacity: 0;
}
.ocnk021.responsive .slider_box .layout_photo .swiper-container {
	padding: 0px;
}
}
/* ================================================================= */



/* ================================================================= */
/* ocnk022 - フォーム入力欄とセレクトボックスのデザイン変更   */
/* ================================================================= */

/* 各入力フォーム(テキスト入力1行、テキストエリア、セレクトボックス)のデザインを変更*/
.ocnk022.responsive input[type="text"],
.ocnk022.responsive input[type="email"],
.ocnk022.responsive input[type="tel"],
.ocnk022.responsive input[type="url"],
.ocnk022.responsive input[type="search"],
.ocnk022.responsive input[type="number"],
.ocnk022.responsive input[type="password"],
.ocnk022.responsive textarea {
padding: 10px;
border: 2px solid #E0DFE3;
box-shadow: none;
}
.ocnk022.responsive select,
.ocnk022.responsive .ios select {
border: 2px solid #E0DFE3;
height: 40px;
}
/* ================================================================= */



/* ================================================================= */
/* ocnk023 - 商品一覧や購入履歴/レビューのソート欄デザイン変更   */
/* ================================================================= */

/* ソート欄に背景色を指定 */
.ocnk023.responsive .sort {
background-color: #F5F5F5;
border: none;
padding: 10px;
align-items: center;
}
/* 表示順変更ボタンを右端に寄せる */
.ocnk023.responsive .sort_toggle {
display: flex;
justify-content: flex-end;
}
/* 表示順変更ボタンを長方形に変更 */
.ocnk023.responsive .sort_toggle .toggle_open {
display: inline-block;
background-color: #FFF;
border: none;
border-radius: 0;
padding: 10px 20px;
}
/* 写真、説明付き切り替えボタンの背景色と枠線を非表示 */
.ocnk023.responsive .sort_layout_btn .icon_btn,
.ocnk023.responsive.use_hover .sort_layout_btn .icon_btn:hover {
background-color: transparent;
border: none;
}
/* ソート欄を開いた背景色 */
.ocnk023.responsive .sort_item {
background-color: #F9F9F9;
border: none;
padding: 20px;
}

/* 各テンプレ指定
 # ================================================================= */
/* テクスチャパターン：017,018,023 */
.ocnk023.responsive.touch017 .detail_page_body .data_table .stocklist_radio,
.ocnk023.responsive.touch018 .detail_page_body .data_table .stocklist_radio,
.ocnk023.responsive.touch023 .detail_page_body .data_table .stocklist_radio {
	background-color: #FFFFFF;
  border: 1px solid #E0DFE3;
}
/* 薄いテクスチャ：002 */
.ocnk023.responsive.touch002 .sort {
  background-color: #D9CECA;
}
.ocnk023.responsive.touch002 .sort_toggle .toggle_open {
	background-color: #E7DFDC;
}
/* テクスチャ：017,018 */
.ocnk023.responsive.touch017 .sort,
.ocnk023.responsive.touch018 .sort {
  background-color: #0000001A;
}
.ocnk023.responsive.touch017 .sort_toggle .toggle_open {
	background-color: #661A00;
}
.ocnk023.responsive.touch018 .sort_toggle .toggle_open,
.ocnk023.responsive.touch020 .sort_toggle .toggle_open{
	background-color: #000000;
}
.ocnk023.responsive.touch017 .sort_item,
.ocnk023.responsive.touch018 .sort_item {
  background-color: transparent;
}
/* 黒背景パターン：005,013 */
.ocnk023.responsive.touch005 .sort,
.ocnk023.responsive.touch013 .sort {
  background-color: #222222;
}
.ocnk023.responsive.touch005 .sort_toggle .toggle_open,
.ocnk023.responsive.touch013 .sort_toggle .toggle_open {
	background-color: #333333;
}
.ocnk023.responsive.touch005 .sort_item,
.ocnk023.responsive.touch013 .sort_item {
  background-color: #222222;
}
/* 例外 */
.ocnk023.responsive.touch007 .sort,
.ocnk023.responsive.touch009 .sort,
.ocnk023.responsive.touch023 .sort,
.ocnk023.responsive.touch025 .sort,
.ocnk023.responsive.touch026 .sort,
.ocnk023.responsive.touch027 .sort {
  background-color: #FFFFFF;
}
.ocnk023.responsive.touch007 .sort_toggle .toggle_open,
.ocnk023.responsive.touch009 .sort_toggle .toggle_open,
.ocnk023.responsive.touch023 .sort_toggle .toggle_open,
.ocnk023.responsive.touch025 .sort_toggle .toggle_open,
.ocnk023.responsive.touch026 .sort_toggle .toggle_open,
.ocnk023.responsive.touch027 .sort_toggle .toggle_open {
	background-color: #F9F9F9;
}
.ocnk023.responsive.touch009 .sort_toggle .toggle_open {
	background-color: #008C00;
}
.ocnk023.responsive.touch025 .sort_toggle .toggle_open {
	background-color: #59493F;
}
.ocnk023.responsive.touch026 .sort_toggle .toggle_open,
.ocnk023.responsive.touch027 .sort_toggle .toggle_open {
	background-color: #000000;
}
.ocnk023.responsive.touch007 .sort_item,
.ocnk023.responsive.touch009 .sort_item,
.ocnk023.responsive.touch023 .sort_item,
.ocnk023.responsive.touch025 .sort_item,
.ocnk023.responsive.touch026 .sort_item,
.ocnk023.responsive.touch027 .sort_item {
  background-color: #FFFFFF;
}
/* ================================================================= */



/* ================================================================= */
/* ocnk024 - フォントを英字/数字Roboto/和文Noto Sans(ゴシック体)に変更   */
/* ================================================================= */

.ocnk024.responsive body,
.ocnk024.responsive select,
.ocnk024.responsive input,
.ocnk024.responsive button,
.ocnk024.responsive textarea,
.ocnk024.responsive button {
   font-family: 'Roboto', 'Noto Sans JP', sans-serif;
}
.ocnk024.responsive body .en_version,
.ocnk024.responsive select .en_version,
.ocnk024.responsive input .en_version,
.ocnk024.responsive button .en_version,
.ocnk024.responsive textarea .en_version,
.ocnk024.responsive button .en_version {
   font-family: 'Roboto', sans-serif;
}
.ocnk024.responsive body .inner_global_nav .nav_btn,
.ocnk024.responsive body .inner_global_nav .header_nav_item {
	 letter-spacing: 0;
}
.ocnk024.responsive body .en_version .inner_global_nav .nav_btn,
.ocnk024.responsive body .en_version .inner_header_nav .header_nav_item{
	 letter-spacing: .05em;
}
/* ================================================================= */



/* ================================================================= */
/* ocnk025 - フォントを英字/数字Montserrat/和文Noto Sans(ゴシック体)に変更   */
/* ================================================================= */

.ocnk025.responsive body,
.ocnk025.responsive select,
.ocnk025.responsive input,
.ocnk025.responsive button,
.ocnk025.responsive textarea,
.ocnk025.responsive button {
   font-family: 'Montserrat', 'Noto Sans JP', sans-serif;
}
.ocnk025.responsive body .en_version,
.ocnk025.responsive select .en_version,
.ocnk025.responsive input .en_version,
.ocnk025.responsive button .en_version,
.ocnk025.responsive textarea .en_version,
.ocnk025.responsive button .en_version {
   font-family: 'Montserrat', sans-serif;
}
.ocnk025.responsive body .inner_global_nav .nav_btn {
	 letter-spacing: 0;
}
.ocnk025.responsive body .en_version .inner_global_nav .nav_btn {
	 letter-spacing: .05em;
}
/* ================================================================= */



/* ================================================================= */
/* ocnk026 - フォントを英字/数字Playfair Display/和文Noto Serif(明朝体)に変更   */
/* ================================================================= */

.ocnk026.responsive body,
.ocnk026.responsive select,
.ocnk026.responsive input,
.ocnk026.responsive button,
.ocnk026.responsive textarea,
.ocnk026.responsive button {
   font-family: 'Playfair Display', 'Noto Serif JP', serif;
}
.ocnk026.responsive body .en_version,
.ocnk026.responsive select .en_version,
.ocnk026.responsive input .en_version,
.ocnk026.responsive button .en_version,
.ocnk026.responsive textarea .en_version,
.ocnk026.responsive button .en_version {
   font-family: 'Playfair Display', serif;
	 letter-spacing: .05em;
}
.ocnk026.responsive body .inner_global_nav .nav_btn {
	 letter-spacing: 0;
}
.ocnk026.responsive body .en_version .inner_global_nav .nav_btn{
	 letter-spacing: .05em;
}
/* ================================================================= */



/* ================================================================= */
/* ocnk027 - 商品詳細サムネイルの選択時デザイン変更   */
/* ================================================================= */

/* サムネイル選択時の枠線を1pxに変更 */
.ocnk027.responsive .itemdetail .thumbnail .thumbnail_btn,
.ocnk027.responsive .itemdetail .thumbnail .current .thumbnail_btn {
	border-width: 1px;
}
/* サムネイル選択時の枠線色を黒色に変更 */
.ocnk027.responsive .itemdetail .thumbnail .current .thumbnail_btn {
	border-color: #000000;
}

/* 各テンプレ指定
 # ================================================================= */
/* 黒背景パターン：005,013 */
.ocnk027.responsive.touch005 .itemdetail .thumbnail .current .thumbnail_btn,
.ocnk027.responsive.touch013 .itemdetail .thumbnail .current .thumbnail_btn {
	border-color: #FFFFFF;
}
/* マウスオーバー時の上移動アニメーション削除 */
.ocnk027.responsive.use_hover .itemdetail .thumbnail .switching_link:hover img {
  -webkit-transform: translateY(0px);
  transform: translateY(0px);
	opacity: .7;
}
/* ================================================================= */



/* ================================================================= */
/* ocnk028 - パソコンでページ横幅を広げる   */
/* ================================================================= */

/* =================================================================
   レスポンシブ1200px以上
   ================================================================= */
@media screen and (min-width: 1200px) {
/* wide_layout、single_layoutともに1400pxに広げる */
.ocnk028.responsive.wide_layout .fix_center {
  max-width: 1400px;
}
.ocnk028.responsive.wide_layout .layout_2_col #inner_contents,
.ocnk028.responsive.wide_layout .layout_3_col #inner_contents {
  width: 100%;
  max-width: 1400px;
}
.ocnk028.responsive.single_layout #container:not(.has_min_nav) .fix_center {
  max-width: 1400px;
}
.ocnk028.responsive.single_layout .layout_2_col #inner_contents,
.ocnk028.responsive.single_layout .layout_3_col #inner_contents {
  width: 100%;
  max-width: 1400px;
}
.ocnk028.single_layout .product_info_wrapper:is(.product_info_wrapper_300,.product_info_wrapper_400) .detail_block_form {
  max-width: none;
}

/* 各テンプレ指定
 # ================================================================= */
/* #inner_containerにmax-width指定あり */
.ocnk028.responsive.wide_layout.touch006 #inner_container,
.ocnk028.responsive.single_layout.touch006 #inner_container,
.ocnk028.responsive.wide_layout.touch008 #inner_container,
.ocnk028.responsive.single_layout.touch008 #inner_container,
.ocnk028.responsive.wide_layout.touch010 #inner_container,
.ocnk028.responsive.single_layout.touch010 #inner_container {
	max-width: 1400px;
}
}
/* ================================================================= */



/* ================================================================= */
/* ocnk029 - 最新情報/店長日記/記事コンテンツの縦型で画像を一覧枠幅100%表示    */
/* ================================================================= */

/* =================================================================
   レスポンシブ350px以上
   ================================================================= */
@media screen and (min-width: 350px) {
/* 縦型に設定の場合に横幅を100%表示 */
.ocnk029.responsive .layout_column_text.layout_list_column .list_item_cell .list_item_photo img {
  height: auto;
  max-height: 100%;
}
.ocnk029.responsive .layout_column_text.layout_list_column .list_item_cell .list_item_photo {
  height: auto;
}
.ocnk029.responsive .layout_column_text.layout_list_column .list_item_cell .list_item_photo,
.ocnk029.responsive .layout_column_text.layout_list_column .list_item_cell .list_item_photo img {
  max-width: 100%;
  width: 100%;
}
.ocnk029.responsive .contents_box:has(.layout_column_text.layout_list_column) {
	margin: 0;
}
.ocnk029.responsive .layout_column_text.layout_list_column .list_item_cell {
	padding: 10px;
}
.ocnk029.responsive #container .layout_column_text.layout_list_column .list_item_cell .list_item_box {
	padding: 0;
}
}
/* ================================================================= */



/* ================================================================= */
/* ocnk030 - ナビゲーションアイコン矢印非表示 */
/* ================================================================= */

/* グローバルナビ(…ポップアップメニュー、閉じるアイコン以外)、ポップアップナビ(カテゴリ、グループ)、サイドエリア各ナビ、フッターナビのbeforeを空 */
.ocnk030.responsive .global_nav .global_nav_item:not(.g_menu) A:not(.nav_close,.search_close) .fa.right_side_nav_icon::before,
.ocnk030.responsive .inner_popup_nav .popup_nav_item:not(.popup_menu_opener) .fa.right_side_nav_icon::before,
.ocnk030.responsive:not(.compact_header_nav_opened) .inner_popup_nav .popup_nav_item.popup_menu_opener .fa.right_side_nav_icon::before,
.ocnk030.responsive .side_itemlist_nav .fa.right_side_nav_icon::before,
.ocnk030.responsive .side_nav .fa.right_side_nav_icon::before,
.ocnk030.responsive .basic_nav .fa.right_side_nav_icon::before,
.ocnk030.responsive .freepage_nav .fa.right_side_nav_icon::before,
.ocnk030.responsive .footer_nav .fa.right_side_nav_icon::before {
	display: none;
}

/* =================================================================
   レスポンシブ320px以上
   ================================================================= */
@media screen and (min-width: 320px) {
/* iタグの幅が反映されるのでabsoluteで非表示にする */
.ocnk030.responsive .global_nav .global_nav_item:not(.g_menu) A:not(.nav_close,.search_close) .fa.right_side_nav_icon,
.ocnk030.responsive .inner_popup_nav .fa.right_side_nav_icon,
.ocnk030.responsive .side_itemlist_nav .fa.right_side_nav_icon,
.ocnk030.responsive .side_nav .fa.right_side_nav_icon,
.ocnk030.responsive .basic_nav .fa.right_side_nav_icon,
.ocnk030.responsive .freepage_nav .fa.right_side_nav_icon,
.ocnk030.responsive .footer_nav .fa.right_side_nav_icon {
  position: absolute;
  display: inline;
  margin-right: 0;
  font-size: 100%;
}
}
/* ================================================================= */

/* =================================================================
   レスポンシブ839px以下
   ================================================================= */
@media screen and (max-width: 839px) {
/* コンパクトヘッダー設定時：開閉しないナビの後ろ矢印アイコン */
.ocnk030.responsive .folding_header .inner_global_nav .global_nav_item:not(.popup_menu_opener, .g_search) > .nav_btn:after {
	display: none;
}
}
/* ================================================================= */



/* ================================================================= */
/* ocnk031 - リンク、ボタンにアニメーション追加 */
/* ================================================================= */

.ocnk031.responsive A,
.ocnk031.responsive A:link,
.ocnk031.responsive A:visited,
.ocnk031.responsive.use_hover A:hover,
.ocnk031.responsive A:active,
.ocnk031.responsive .global_btn button,
.ocnk031.responsive A > span > img,
.ocnk031.responsive A > img {
	transition: .3s;
}

.ocnk031.responsive .site_list_dropdown[aria-hidden="true"] a,
.ocnk031.responsive .site_list_dropdown[aria-hidden="true"] img {
    transition: none;
}
/* ================================================================= */



/* ================================================================= */
/* ocnk032 - トップ画像を角丸にする */
/* ================================================================= */

.ocnk032.responsive .top_page_body #photo {
	padding: 15px;
}
.ocnk032.responsive .top_page_body #photo .top_image_case,
.ocnk032.responsive .top_page_body #photo .item_image_box .item_image {
	border-radius: 8px;
}
/* ================================================================= */



/* ================================================================= */
/* ocnk033 - 商品一覧の商品画像を角丸にする */
/* ================================================================= */

.ocnk033.responsive .item_list .list_item_photo .item_image {
border-radius: 8px;
}

/* ocnk010「商品一覧画像を一覧枠幅100%表示」と併用する場合、写真のみ表示の縦長画像に角丸を当てるための対応*/
.ocnk033.ocnk010.responsive #container:not(.use_lightweight_thumbnail) .item_list.square_photo_layout .tiled_list .list_item_photo .portrait_item_image_box .item_image,
.ocnk033.ocnk010.responsive #container:not(.use_lightweight_thumbnail) .slider_box:not(.initial_loading) .layout_photo .item_list.square_photo_layout .portrait_item_image_box .item_image {
  width: auto;
  height: 100%;
}
/* ================================================================= */



/* ================================================================= */
/* ocnk034 - 商品詳細の商品画像を角丸にする */
/* ================================================================= */

/* 幅で揃えるは枠に指定。高さで揃えるは画像に指定　※高さで揃えるの場合はマウスオーバーで角丸が切れる */
.ocnk034.responsive .main_photo_slide:is(.align_widths_photo_slide_300, .align_widths_photo_slide_400, .align_widths_photo_slide_600) .inner_slider_box .swiper-container,
.ocnk034.responsive .main_photo_slide:is(.square_photo_slide_300, .square_photo_slide_400, .square_photo_slide_600) .inner_slider_box .swiper-container .item_image {
border-radius: 8px;
}
/* ================================================================= */



/* ================================================================= */
/* ocnk035 - トップページの各タイトル下に余白を入れる */
/* ================================================================= */

.ocnk035.responsive .top_page_body #container :where(.side_box, .main_box) h2 {
  margin-bottom: 15px;
}
/* ================================================================= */



/* ================================================================= */
/* ocnk036 - ページタイトルをシンプルなデザインにする */
/* ================================================================= */

/* タイトル余白、罫線、背景、影、文字サイズリセット */
.ocnk036.responsive #container :where(.side_box, .main_box, .page_box) :where(.section_title, .page_title),
.ocnk036.responsive #container :where(.side_box, .main_box, .page_box) :where(.section_title, .page_title) :where(h1, h2),
.ocnk036.responsive #container :where(.side_box, .main_box, .page_box) :where(.section_title, .page_title) :where(h1, h2) .title_text {
padding: 0;
border: none;
background-color: transparent;
background-image: none;
box-shadow: none;
text-shadow: none;
font-size: 100%;
color: #000;
}
/* h1、h2に余白と文字サイズ指定 */
.ocnk036.responsive #container :where(.side_box, .main_box, .page_box) :where(.section_title, .page_title) :where(h1, h2) {
padding: 15px 10px;
font-size: 148%;
}
/* h1、h2に余白左右をサイドエリアは5px */
.ocnk036.responsive #container .side_box :where(.section_title, .page_title) :where(h1, h2) {
padding: 15px 5px;
}
/* title_textの余白リセット、太字指定　※ */
.ocnk036.responsive #container :where(.side_box, .main_box, .page_box) :where(.section_title, .page_title) :where(h1 ,h2) .title_text {
margin: 0;
font-weight: 700;
}
/* タイトルのbefore/afterをリセット */
.ocnk036.responsive :where(.section_title, .page_title) :where(h1, h2)::before,
.ocnk036.responsive :where(.section_title, .page_title) :where(h1, h2) .title_text::before,
.ocnk036.responsive :where(.section_title, .page_title) :where(h1, h2)::after,
.ocnk036.responsive :where(.section_title, .page_title) :where(h1, h2) .title_text::after {
content: ""!important;
display: none!important;
}

/* 各テンプレ指定
 # ================================================================= */
.ocnk036.responsive:where(.touch005, .touch013) #container :where(.side_box, .main_box, .page_box) :where(.section_title, .page_title),
.ocnk036.responsive:where(.touch005, .touch013) #container :where(.side_box, .main_box, .page_box) :where(.section_title, .page_title) :where(h1, h2),
.ocnk036.responsive:where(.touch005, .touch013) #container :where(.side_box, .main_box, .page_box) :where(.section_title, .page_title) :where(h1, h2) .title_text,
.ocnk036.responsive.touch023 #container :where(.whatnew, .diary):where(.side_box, .main_box) .section_title :where(h2, h2 .title_text) {
color: #FFF;
}
.ocnk036.responsive.touch029 #container .main_box {
padding-top: 0;
}
.ocnk036.responsive.touch027 #container :where(.main_box, .page_box) :where(.section_title, .page_title) {
margin: 0;
}

/* =================================================================
   レスポンシブ840px以下
   ================================================================= */
@media screen and (max-width: 840px) {
.ocnk036.responsive #container :where(.side_box, .page_box) .section_title .title_toggle_link :where(h2, h3) {
  padding-right: 24px;
}
}
/* ================================================================= */



/* ================================================================= */
/* ocnk037 - スマートフォンで検索ボックスを常に表示 */
/* ================================================================= */

@media screen and (max-width: 840px) {
.ocnk037.responsive #container:not(.use_folding_header, .has_min_nav) .header .hidden_search_bar {
  opacity: 1;
}
.ocnk037.responsive #container:not(.use_folding_header, .has_min_nav) .hidden_search_bar .inner_search_bar {
  display: block;
}
.ocnk037.responsive #container:not(.use_folding_header, .has_min_nav) .search_bar .close_btn_box {
  display: none;
}
.ocnk037.ocnk020.responsive #container:not(.use_folding_header, .has_min_nav) .search_bar:has(.global_btn .searchinput) .search_form input[type="search"] {
	width: 85%;
	box-sizing: border-box;
}
.ocnk037.ocnk020.responsive #container:not(.use_folding_header, .has_min_nav) .search_bar:has(.global_btn .searchinput) .search_form input[type="search"]{
	padding: 5px;
}
.ocnk037.ocnk020.responsive #container:not(.use_folding_header, .has_min_nav) .search_bar .search_close {
	top: 5px;
	bottom: auto;
}
}
/* ================================================================= */



/* ================================================================= */
/* ocnk038 - サイドメニューをパソコンでも格納表示する */
/* ================================================================= */

:root {
--large-menu: 500px;
--large-menu-minus: -500px;
}

/* =================================================================
   レスポンシブ840px以下
   ================================================================= */

@media screen and (min-width: 840px) {
.ocnk038.responsive.column_layout .side_col:has(.has_toggle_menu_list) {
  position: absolute;
  z-index: -1;
  overflow: hidden;
	padding-top: 0;
}
/* PC幅でトグル表示 */
.ocnk038.responsive.column_layout #container:has(.side_col .has_toggle_menu_list) .menu_opener_box,
.ocnk038.responsive.column_layout #container:has(.side_col .has_toggle_menu_list) .inner_header_nav .h_side_menu_opener {
  display: flex;
}
/* サイドエリアを右設定時非表示　※スクロール表示対策 */
.ocnk038.responsive.column_layout #container:has(.side_col .has_toggle_menu_list) #right_side_col {
  display: none;
}
	
/* 検索欄位置を調整 */
/* ================================================================= */
/* サイドエリアを右設定：右上ナビを両方非表示の場合　※右トグルのみ */
/* サイドエリアを左設定：右上ナビを片方非表示の場合　※右ナビ1つ */
.ocnk038.responsive .has_right_side_menu:has(.side_col .has_toggle_menu_list) .has_search_bar .search_bar,
.ocnk038.responsive .has_left_side_menu:has(.side_col .has_toggle_menu_list) .has_search_bar .search_bar.has_header_right_size1 {
  right: 90px;
}
/* テキストなしの場合 */
/* テキストがない場合、ボタン横幅が36pxになる。テキストありの場合は最大60px(4文字で45px)のためボタン1つにつき-10pxする */
.ocnk038.responsive .has_right_side_menu:has(.side_col .has_toggle_menu_list):has(.h_side_menu_opener.empty_nav_label) .has_search_bar .search_bar,
.ocnk038.responsive .has_left_side_menu:has(.side_col .has_toggle_menu_list):has(.header_nav_item.empty_nav_label) .has_search_bar .search_bar.has_header_right_size1 {
  right: calc(90px - 10px);
}
/* ================================================================= */
/* サイドエリアを右設定：右上ナビを片方非表示の場合に　※右ナビ1つ+トグル */
/* サイドエリアを左設定：右上ナビを両方表示の場合に　※左トグル+右ナビ2つ */
.ocnk038.responsive .has_right_side_menu:has(.side_col .has_toggle_menu_list) .has_search_bar .search_bar.has_header_right_size1,
.ocnk038.responsive .has_left_side_menu:has(.side_col .has_toggle_menu_list) .has_search_bar .search_bar.has_header_right_size2 {
  right: 150px;
}
/* テキストなしの場合 */
.ocnk038.responsive .has_right_side_menu:has(.side_col .has_toggle_menu_list):has(.header_nav_item.empty_nav_label, .h_side_menu_opener.empty_nav_label) .has_search_bar .search_bar.has_header_right_size1,
.ocnk038.responsive .has_left_side_menu:has(.side_col .has_toggle_menu_list):has(.header_nav_item.empty_nav_label) .has_search_bar .search_bar.has_header_right_size2 {
	right: calc(150px - 10px);
}
.ocnk038.responsive .has_right_side_menu:has(.side_col .has_toggle_menu_list):has(.header_nav_item.empty_nav_label + .h_side_menu_opener.empty_nav_label) .has_search_bar .search_bar.has_header_right_size1,
.ocnk038.responsive .has_left_side_menu:has(.side_col .has_toggle_menu_list):has(.header_nav_item.empty_nav_label + .header_nav_item.empty_nav_label) .has_search_bar .search_bar.has_header_right_size2 {
	right: calc(150px - 20px);
}
/* ================================================================= */
/* サイドエリアを右設定：右上ナビを両方表示の場合に　※右ナビ2つ+トグル */
.ocnk038.responsive .has_right_side_menu:has(.side_col .has_toggle_menu_list) .has_search_bar .search_bar.has_header_right_size2 {
  right: 210px;
}
/* テキストなしの場合 */
.ocnk038.responsive .has_right_side_menu:has(.side_col .has_toggle_menu_list):has(.h_side_menu_opener.empty_nav_label, .header_nav_item:not(.h_side_menu_opener, .empty_nav_label) + .header_nav_item.empty_nav_label, .header_nav_item.empty_nav_label + .header_nav_item:not(.h_side_menu_opener, .empty_nav_label)) .has_search_bar .search_bar.has_header_right_size2 {
	right: calc(210px - 10px);
}
.ocnk038.responsive .has_right_side_menu:has(.side_col .has_toggle_menu_list):has(.header_nav_item.empty_nav_label + .header_nav_item:not(.h_side_menu_opener, .empty_nav_label) + .h_side_menu_opener.empty_nav_label, .header_nav_item.empty_nav_label + .header_nav_item.empty_nav_label) .has_search_bar .search_bar.has_header_right_size2 {
	right: calc(210px - 20px);
}
.ocnk038.responsive .has_right_side_menu:has(.side_col .has_toggle_menu_list):has(.header_nav_item.empty_nav_label + .header_nav_item.empty_nav_label + .h_side_menu_opener.empty_nav_label) .has_search_bar .search_bar.has_header_right_size2 {
	right: calc(210px - 30px);
}

/* トグル/右上ナビのテキストありの場合に、縦積みの高さがあるため検索欄位置を下に8px移動 */
.ocnk038.responsive .use_side_menu:has(.side_col .has_toggle_menu_list) .has_search_bar .search_bar:where(.header_search_bar, .has_header_right_size2, .has_header_right_size1) {
	top: 8px;
}
.ocnk038.ocnk020.responsive .use_side_menu:has(.side_col .has_toggle_menu_list) .has_search_bar .search_bar:where(.header_search_bar, .has_header_right_size2, .has_header_right_size1) {
	top: 13px;
}
/* トグル/右上ナビのテキストなしの場合は、移動した8pxを0にリセット */
/* 左右トグル/右ナビ1つ利用時(inner_header_nav_column1)；トグルのテキストが空+右ナビのテキストが空 */
/* 左右トグル/右ナビ2つ利用時(inner_header_nav_column2)；トグルのテキストが空+右ナビのテキストが空が隣接である場合 */
/* 右トグル/右ナビ2つ利用時(inner_header_nav_column3)；トグルのテキストが空+右ナビのテキストが空が隣接である場合 */
.ocnk038.responsive .use_side_menu:has(.side_col .has_toggle_menu_list):has(.h_side_menu_opener.empty_nav_label):has(.header_right .inner_header_nav_column1 .header_nav_item.empty_nav_label, .inner_header_nav_column2 .header_nav_item.empty_nav_label + .header_nav_item.empty_nav_label, .header_right .inner_header_nav_column3 .header_nav_item.empty_nav_label + .header_nav_item.empty_nav_label + .h_side_menu_opener.empty_nav_label) .has_search_bar .search_bar:where(.has_header_right_size2, .has_header_right_size1) {
	top: 0;
}
.ocnk038.ocnk020.responsive .use_side_menu:has(.side_col .has_toggle_menu_list):has(.h_side_menu_opener.empty_nav_label):has(.header_right .inner_header_nav_column1 .header_nav_item.empty_nav_label, .inner_header_nav_column2 .header_nav_item.empty_nav_label + .header_nav_item.empty_nav_label, .header_right .inner_header_nav_column3 .header_nav_item.empty_nav_label + .header_nav_item.empty_nav_label + .h_side_menu_opener.empty_nav_label) .has_search_bar .search_bar:where(.has_header_right_size2, .has_header_right_size1) {
	top: 5px;
}
/* トグルのみテキストなしの場合はにtopを0にする */
/* ※検索欄の条件がトグルが空かつの指定のため、トグルのみの場合はリセットが必要 */
.ocnk038.responsive .use_side_menu:has(.side_col .has_toggle_menu_list):has(.h_side_menu_opener.empty_nav_label) .has_search_bar .search_bar:not(.has_header_right_size2, .has_header_right_size1) {
	top: 0;
}
.ocnk038.ocnk020.responsive .use_side_menu:has(.side_col .has_toggle_menu_list):has(.h_side_menu_opener.empty_nav_label) .has_search_bar .search_bar:not(.has_header_right_size2, .has_header_right_size1) {
	top: 5px;
}
/* 表示されたサイドエリアの高さを100%にする */
.ocnk038.responsive.open_side_col .side_container {
  height: 100%;
	min-height: fit-content;
	box-sizing: border-box;
}
/* トグルの固定横幅をリセット　※トグルのテキストなし用 */
.ocnk038.responsive .use_side_menu:has(.side_col .has_toggle_menu_list) .inner_header_nav .h_side_menu_opener {
  min-width: auto;
}
/* トグル/右上ナビの固定横幅をリセット、文字サイズを10pxに */
.ocnk038.responsive #container:has(.side_col .has_toggle_menu_list) .inner_header_nav .header_nav_item {
  width: auto;
  max-width: 60px;
	min-width: auto;
  font-size: 10px;
}
/* トグル/右上ナビのテキストなしの場合以外に余白を4pxにする */
/* ※条件は検索欄のtop値調整を同じ */
.ocnk038.responsive #container:has(.side_col .has_toggle_menu_list):not(:has(.h_side_menu_opener.empty_nav_label):has(.header_right .inner_header_nav_column1 .header_nav_item.empty_nav_label, .inner_header_nav_column2 .header_nav_item.empty_nav_label + .header_nav_item.empty_nav_label, .header_right .inner_header_nav_column3 .header_nav_item.empty_nav_label + .header_nav_item.empty_nav_label + .header_nav_item.empty_nav_label)) .inner_header_nav .header_nav_item .nav_btn {
	padding: 4px;
}
/* サイドエリアを左設定でテキストなしの場合に余白を0にする */
/* ※検索欄の条件がトグルが空かつの指定のため、トグルのみの場合はリセットが必要 */
.ocnk038.responsive #container:has(.side_col .has_toggle_menu_list):not(:has(.header_right)) .inner_header_nav .h_side_menu_opener.empty_nav_label .nav_btn {
  padding: 0!important;
}
/* inner_header_nav間の余白をmarginをやめgapにする */
.ocnk038.responsive #container:has(.side_col .has_toggle_menu_list) .inner_header_nav {
	gap: 5px;
}
.ocnk038.responsive #container:has(.side_col .has_toggle_menu_list) :where(.header_left, .header_right) .inner_header_nav .nav_btn {
	margin: 0;
}
/* サイドエリアを左設定時のトグルとロゴ間の余白 */
.ocnk038.responsive .use_side_menu:has(.side_col .has_toggle_menu_list) .header_left {
  padding-right: 15px;
}
/* アイコン/テキストが左右並びの場合のアイコンとテキスト間の余白をリセット　※縦積みのため */
.ocnk038.responsive #container:has(.side_col .has_toggle_menu_list) .inner_header_nav .header_nav_item .nav_text {
  padding-left: 0px;
}
/* アイコンの文字サイズ、縦積み指定 */
.ocnk038.responsive #container:has(.side_col .has_toggle_menu_list) .inner_header_nav .header_nav_item .nav_text .fa {
  font-size: 20px;
  position: static;
  display: block;
  margin: 0 auto;
}
/* 縦積みアイコンとテキスト間の余白　※テキストなしの時以外 */
.ocnk038.responsive #container:has(.side_col .has_toggle_menu_list) .inner_header_nav .header_nav_item:not(.empty_nav_label) .nav_text .fa {
  padding-bottom: 2px;
}
}
/* ================================================================= */

/* =================================================================
   レスポンシブ980px以上
   ================================================================= */

@media screen and (min-width: 980px) {
/* サイドエリア余白 */
.ocnk038.responsive.open_side_col .side_col .inner_side_container {
	padding: 15px 20px;
}
/* 変数--large-menu-minusでサイドエリアを表示エリア外に配置 */
.ocnk038.responsive #left_side_col:has(.has_toggle_menu_list) {
  left: var(--large-menu-minus);
}
.ocnk038.responsive #right_side_col:has(.has_toggle_menu_list) {
  right: var(--large-menu-minus);
}
/* 変数--large-menuでサイドエリアを表示エリアに移動 */
.ocnk038.responsive .side_col:has(.has_toggle_menu_list) {
  width: var(--large-menu)!important;
}
/* 変数--large-menuでオーバーレイ領域をメインエリアに重ねて表示 */
.ocnk038.responsive.open_side_col .left_menu_mode:has(.side_col .has_toggle_menu_list) .menu_blocker, .open_side_col .menu_blocker {
  left: var(--large-menu);
}
.ocnk038.responsive.open_side_col .right_menu_mode:has(.side_col .has_toggle_menu_list) .menu_blocker {
  right: var(--large-menu);
}
/* サイドエリアを左設定時、変数--large-menuで各コンテンツを右移動 */
.ocnk038.responsive.open_side_col .left_menu_mode:has(.side_col .has_toggle_menu_list) #inner_container :where(#contents_bottom, #contents_top, #footer_wrapper, #header_wrapper, #maincol, #non_approved, #photo, .breadcrumb_area, #article_left_side_col),
.ocnk038.responsive.open_side_col .left_menu_mode #left_side_col:has(.has_toggle_menu_list) {
  -webkit-transform: translateX(var(--large-menu));
  transform: translateX(var(--large-menu));
}
/* サイドエリアを右設定時、変数--large-menu-minusで各コンテンツを左移動 */
.ocnk038.responsive.open_side_col .right_menu_mode:has(.side_col .has_toggle_menu_list) #inner_container :where(#contents_bottom, #contents_top, #footer_wrapper, #header_wrapper, #maincol, #non_approved, #photo, .breadcrumb_area, #article_right_side_col),
.ocnk038.responsive.open_side_col .right_menu_mode #right_side_col:has(.has_toggle_menu_list) {
  -webkit-transform: translateX(var(--large-menu-minus));
  transform: translateX(var(--large-menu-minus));
}
}
/* ================================================================= */

/* =================================================================
   レスポンシブ1200px以上
   ================================================================= */
@media screen and (min-width: 1200px) {
.ocnk038.responsive.wide_layout #container:has(.side_col .has_toggle_menu_list) .product_info_wrapper .detail_block_form {
  max-width: none;
}
}
/* ================================================================= */

/* =================================================================
   レスポンシブ1700px以上
   ================================================================= */

@media screen and (min-width: 1700px) {
.ocnk038:not(.ocnk028).responsive.open_side_col .left_menu_mode:has(.side_col .has_toggle_menu_list) #inner_container :where(#contents_bottom, #contents_top, #footer_wrapper, #header_wrapper, #maincol, #non_approved, #photo, .breadcrumb_area, #article_left_side_col) {
   -webkit-transform: translateX(calc(var(--large-menu) / 2));
  transform: translateX(calc(var(--large-menu) / 2));
}
.ocnk038:not(.ocnk028).responsive.open_side_col .right_menu_mode:has(.side_col .has_toggle_menu_list) #inner_container :where(#contents_bottom, #contents_top, #footer_wrapper, #header_wrapper, #maincol, #non_approved, #photo, .breadcrumb_area, #article_right_side_col) {
  -webkit-transform: translateX(calc(var(--large-menu-minus) / 2));
  transform: translateX(calc(var(--large-menu-minus) / 2));
}
}
@media screen and (min-width: 2000px) {
.ocnk038.ocnk028.responsive.open_side_col .left_menu_mode:has(.side_col .has_toggle_menu_list) #inner_container :where(#contents_bottom, #contents_top, #footer_wrapper, #header_wrapper, #maincol, #non_approved, #photo, .breadcrumb_area, #article_left_side_col) {
   -webkit-transform: translateX(calc(var(--large-menu) / 2));
  transform: translateX(calc(var(--large-menu) / 2));
}
.ocnk038.ocnk028.responsive.open_side_col .right_menu_mode:has(.side_col .has_toggle_menu_list) #inner_container :where(#contents_bottom, #contents_top, #footer_wrapper, #header_wrapper, #maincol, #non_approved, #photo, .breadcrumb_area, #article_right_side_col) {
  -webkit-transform: translateX(calc(var(--large-menu-minus) / 2));
  transform: translateX(calc(var(--large-menu-minus) / 2));
}
}
/* ================================================================= */

/* =================================================================
   レスポンシブ2200px以上
   ================================================================= */
@media screen and (min-width: 2200px) {
.ocnk038:not(.ocnk028).responsive.open_side_col :is(.left_menu_mode, .right_menu_mode):has(.side_col .has_toggle_menu_list) #inner_container :where(#contents_bottom, #contents_top, #footer_wrapper, #header_wrapper, #maincol, #non_approved, #photo, .breadcrumb_area, #article_left_side_col, #article_right_side_col) {
  -webkit-transform: translateX(0);
  transform: translateX(0);
}
}
/* ================================================================= */

/* =================================================================
   レスポンシブ2400px以上
   ================================================================= */
@media screen and (min-width: 2400px) {
.ocnk038.ocnk028.responsive.open_side_col :is(.left_menu_mode, .right_menu_mode):has(.side_col .has_toggle_menu_list) #inner_container :where(#contents_bottom, #contents_top, #footer_wrapper, #header_wrapper, #maincol, #non_approved, #photo, .breadcrumb_area, #article_left_side_col, #article_right_side_col) {
  -webkit-transform: translateX(0);
  transform: translateX(0);
}
}
/* ================================================================= */

/* 各テンプレ指定
 # ================================================================= */
@media screen and (min-width: 840px) {
.touch010.ocnk038.responsive #inner_header {
	padding-bottom: 10px;
}
:where(.touch006, .touch010).ocnk038.responsive.open_side_col #inner_container,
.touch018.ocnk038.responsive.open_side_col #inner_contents {
  max-width: 100%;
}
.touch018.ocnk038.responsive.open_side_col #inner_contents #maincol {
	max-width: 1200px;
	margin: auto;
}
.touch023.ocnk038.responsive.open_side_col .side_col :where(.category_nav_box, .pickupcategory_nav_box) .section_title {
	background-position: center top;
}
.touch023.ocnk038.responsive.open_side_col .side_col :where(.category_nav_box, .pickupcategory_nav_box) .section_title h2 {
	background-position: center bottom;
}
}
/* ================================================================= */



/* ================================================================= */
/* ocnk039 - 最新情報/店長日記/記事コンテンツ一覧の画像を角丸 */
/* ================================================================= */

.ocnk039.responsive .item_list .list_item_photo :where(.diary_photo, .news_photo, .article_photo) img {
border-radius: 8px;
}
/* ================================================================= */



/* ================================================================= */
/* ocnk040 - 最新情報/店長日記/記事コンテンツ詳細の画像を角丸にする */
/* ================================================================= */

.ocnk040.responsive .pwhatnew .news_photo img,
.ocnk040.responsive .pdiary .diary_photo img {
border-radius: 8px;
}
/* ================================================================= */



/* ================================================================= */
/* ocnk041 - サイドメニュー格納時のメインエリアオーバーレイを黒半透明にする */
/* ================================================================= */

.ocnk041.responsive.open_side_col #container::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,.4);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 80;
}
.ocnk041.responsive.open_side_col .side_container {
  height: 100%;
	min-height: fit-content;
	box-sizing: border-box;
}
.ocnk041.responsive.open_side_col #container :where(#non_approved, #header_wrapper, #contents_top, #photo, .breadcrumb_area, #maincol, #contents_bottom, #footer_wrapper, #article_left_side_col, #article_right_side_col) {
  opacity: .8;
}
/* ================================================================= */



/* ================================================================= */
/* ocnk042 - PCでスクロール時にヘッダーを固定表示　※一括外 */
/* ================================================================= */

/* =================================================================
   レスポンシブ840px以上
   ================================================================= */
@media screen and (min-width: 840px) {
  .ocnk042.open_side_col.responsive #container:not(.has_min_nav) header {
    width: 100%;
    position: fixed;
  }
  .ocnk042.open_side_col.responsive #container:not(.has_min_nav) #main_wrapper {
    margin-top: var(--popup-container-margin-top);
  }
  .ocnk042.responsive #container:not(.has_min_nav) header {
    position: sticky;
    top: 0;
    left: 0;
    z-index: 15;
  }
  .ocnk042.has_opened_popup_menu.responsive #container:not(.has_min_nav) header {
    width: 100%;
    position: fixed;
  }
  .ocnk042.has_opened_popup_menu.responsive:has(#container:not(.has_min_nav)) {
    overflow: hidden;
  }
  .ocnk042.has_opened_popup_menu.responsive #container:not(.has_min_nav) .inner_popup_nav_area {
    max-height: calc(100dvh - var(--popup-visible-header-height));
    overflow-y: auto;
    overscroll-behavior-y: none;
  }
  .ocnk042.has_opened_popup_menu.responsive #container:not(.has_min_nav) {
    margin-top: var(--popup-container-margin-top);
  }

  /* サイドメニューを開いた場合、常に透過背景のafter疑似要素で被せるため、opacity指定を全て切る */
  .ocnk042.responsive.open_side_col #container :is(#non_approved, #header_wrapper, #contents_top, #photo, .breadcrumb_area, #maincol, #contents_bottom, #footer_wrapper) {
    opacity: 1;
  }
  /**
   * ocnk038「パソコン幅でもサイドメニューを格納」と併用し、
   * ocnk041「サイドメニュー格納時のメインエリアオーバーレイを黒半透明にする」を適用せずにサイドメニューを開いた場合
   * opacityで当てると、固定したヘッダーの背景が透けてしまうため、
   * ocnk041のパーツの同じ型式で、色を白透過にして要素を被せる
   */
  .ocnk042.ocnk038:not(.ocnk041).responsive.open_side_col #container::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(255,255,255,.8);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 80;
  }
  .ocnk042.ocnk038:not(.ocnk041).responsive.open_side_col .side_container {
    height: 100%;
    min-height: fit-content;
    box-sizing: border-box;
  }

  /* 各テンプレ指定
   # ================================================================= */
  .ocnk042.responsive:where(.touch026, .touch027, .touch030, .touch031) #container:not(.has_min_nav) #header_wrapper {
    background-color: #FFFFFF;
  }
  .ocnk042.responsive.touch025 #container:not(.has_min_nav) #header_wrapper {
    background-image: url(/res/touch025/style/img/bg.png);
    background-color: #E5D7BB;
  }
  .ocnk042.responsive.touch023 #container:not(.has_min_nav) #header_wrapper {
    background-image: url(/res/touch023/style/img/bg.gif);
    background-color: #EEAAC9;
  }
  .ocnk042.responsive.touch022 #container:not(.has_min_nav) #header_wrapper {
    background-image:url(/res/touch022/style/img/header_bg.gif), url(/res/touch022/style/img/body_bg.gif);
    background-size: 230px 10px, auto;
    background-repeat: repeat-x, repeat;
    background-position: left top, left top;
  }
}
/* ================================================================= */



/* ================================================================= */
/* ocnk043 - スマートフォンでスクロール時にヘッダーを固定表示　※一括外 */
/* ================================================================= */

.ocnk043.open_side_col.responsive #container:not(.use_folding_header, .has_min_nav) header {
  width: 100%;
  position: fixed;
}
.ocnk043.open_side_col.responsive #container:not(.has_min_nav) #main_wrapper {
  margin-top: var(--popup-container-margin-top);
}

/* =================================================================
   レスポンシブ840pxより小さい
   ================================================================= */
@media screen and (max-width: 839px) {
  .ocnk043.responsive #container:not(.use_folding_header, .has_min_nav) header {
    position: sticky;
    top: 0;
    left: 0;
    z-index: 15;
  }
  .ocnk043.has_opened_popup_menu.responsive #container:not(.use_folding_header, .has_min_nav) header {
    width: 100%;
    position: fixed;
  }
  .ocnk043.has_opened_popup_menu.responsive:has(#container:not(.use_folding_header, .has_min_nav)) {
    overflow: hidden;
  }
  .ocnk043.has_opened_popup_menu.responsive #container:not(.use_folding_header, .has_min_nav) .inner_popup_nav_area {
    max-height: calc(100dvh - var(--popup-visible-header-height));
    overflow-y: auto;
    overscroll-behavior-y: none;
  }
  .ocnk043.has_opened_popup_menu.responsive #container:not(.use_folding_header, .has_min_nav) {
    margin-top: var(--popup-container-margin-top);
  }

  /* サイドメニューを開いた場合、常に透過背景のafter疑似要素で被せるため、opacity指定を全て切る */
  .ocnk043.responsive.open_side_col #container :is(#non_approved, #header_wrapper, #contents_top, #photo, .breadcrumb_area, #maincol, #contents_bottom, #footer_wrapper) {
    opacity: 1;
  }
  /**
   * ocnk041「サイドメニュー格納時のメインエリアオーバーレイを黒半透明にする」を適用せずにサイドメニューを開いた場合
   * opacityで当てると、固定したヘッダーの背景が透けてしまうため、
   * ocnk041のパーツの同じ型式で、色を白透過にして要素を被せる
   */
  .ocnk043:not(.ocnk041).responsive.open_side_col #container::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(255,255,255,.8);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 80;
  }
  .ocnk043:not(.ocnk041).responsive.open_side_col .side_container {
    height: 100%;
    min-height: fit-content;
    box-sizing: border-box;
  }

  /* 各テンプレ指定
   # ================================================================= */
  .ocnk043.responsive:where(.touch026, .touch027, .touch030, .touch031) #container:not(.has_min_nav) #header_wrapper {
    background-color: #FFFFFF;
  }
  .ocnk043.responsive.touch025 #container:not(.has_min_nav) #header_wrapper {
    background-image: url(/res/touch025/style/img/bg.png);
    background-color: #E5D7BB;
  }
  .ocnk043.responsive.touch023 #container:not(.has_min_nav) #header_wrapper {
    background-image: url(/res/touch023/style/img/bg.gif);
    background-color: #EEAAC9;
  }
  .ocnk043.responsive.touch022 #container:not(.has_min_nav) #header_wrapper {
    background-image: url(/res/touch022/style/img/header_bg.gif), url(/res/touch022/style/img/body_bg.gif);
    background-size: 230px 10px, auto;
    background-repeat: repeat-x, repeat;
    background-position: left top, left top;
  }
}
/* ================================================================= */



/* ================================================================= */
/* ocnk044 - スマートフォンでスクロール時にヘッダーナビを固定表示　※一括外 */
/* ================================================================= */

/* =================================================================
   レスポンシブ840pxより小さい
   ================================================================= */
@media screen and (max-width: 839px) {
  .ocnk044 #container {
    /* ポップアップメニューを表示した際、ヘッダー領域で描画される要素のセレクター */
    --popup-fixed-header-selector: ".header_global_nav";
  }
  .ocnk044.responsive #container:not(.use_folding_header, .has_min_nav) header,
  .ocnk044.responsive #container:not(.use_folding_header, .has_min_nav) #header_wrapper {
    display: contents;
  }
  .ocnk044.open_side_col.responsive #container:not(.use_folding_header, .has_min_nav) header,
  .ocnk044.open_side_col.responsive #container:not(.use_folding_header, .has_min_nav) #header_wrapper {
    display: block;
  }
  .ocnk044.responsive #container:not(.use_folding_header, .has_min_nav) .header_global_nav {
    position: sticky;
    top: 0;
    left: 0;
    z-index: 15;
  }
  .ocnk044.has_opened_popup_menu.responsive #container:not(.use_folding_header, .has_min_nav) .header_global_nav {
    position: static;
  }
  .ocnk044.has_opened_popup_menu.responsive #container:not(.use_folding_header, .has_min_nav) header,
  .ocnk044:not(.has_opened_popup_menu) #container:not(.use_folding_header, .has_min_nav) header:has(.header_search_bar:not(.hidden_search_bar)) {
    width: 100%;
    position: fixed;
    top: 0;
    z-index: 15;
    display: block;
    box-sizing: border-box;
  }
  .ocnk044 #container:not(.use_folding_header, .has_min_nav) .header_search_bar:not(.hidden_search_bar) {
    width: 100%;
    position: fixed;
    top: var(--popup-visible-header-height);
  }
  .ocnk044:not(.has_opened_popup_menu) #container:not(.use_folding_header, .has_min_nav) :is(#header, #header_area):has(.header_search_bar:not(.hidden_search_bar)) {
    /* 上部にstickyで固定されているヘッダーナビゲーションの商品検索ボタンを開いた際、検索欄を囲う枠に不要な余白や高さやborderを持たせない */
    margin: 0;
    padding: 0;
    height: auto;
    min-height: auto;
    border: none;
  }
  .ocnk044.has_opened_popup_menu #container:not(.use_folding_header, .has_min_nav) .header_search_bar:not(.hidden_search_bar) {
    display: none;
  }
  .ocnk044.has_opened_popup_menu.responsive #container:not(.use_folding_header, .has_min_nav) #header,
  .ocnk044.responsive #container:not(.use_folding_header, .has_min_nav):has(.header_search_bar:not(.hidden_search_bar)) :is(.copy, #inner_header, #header_free_space) {
    /* 上部にstickyで固定されているヘッダーナビゲーションの商品検索ボタンを開いた際、header内で非表示にする必要がある箇所 */
    display: none;
  }
  .ocnk044.has_opened_popup_menu.responsive:has(#container:not(.use_folding_header, .has_min_nav)) {
    overflow: hidden;
  }
  .ocnk044.has_opened_popup_menu.responsive #container:not(.use_folding_header, .has_min_nav) .inner_popup_nav_area {
    max-height: calc(100dvh - var(--popup-visible-header-height));
    overflow-y: auto;
    overscroll-behavior-y: none;
  }
  .ocnk044.has_opened_popup_menu.responsive #container:not(.use_folding_header, .has_min_nav),
  .ocnk044 #container:not(.use_folding_header, .has_min_nav):has(.header_search_bar:not(.hidden_search_bar)) {
    margin-top: var(--popup-container-margin-top);
  }

  /* 各テンプレ指定
   # ================================================================= */
  .ocnk044.responsive:where(.touch026, .touch027, .touch030, .touch031) #container:not(.has_min_nav) .header_global_nav {
    background-color: #FFFFFF;
  }
  .ocnk044.responsive.touch022 #container:not(.has_min_nav, .use_folding_header) #header_wrapper .search_bar .search {
    background-color: #F5F5F5;
  }
  .ocnk044.responsive.touch028 #container:not(.has_min_nav, .use_folding_header) #header_wrapper .search_bar .search {
    background-color: #FFFFFF;
  }	
}
/* ================================================================= */



/* ================================================================= */
/* ocnk045 - スマートフォンでスクロール時にヘッダーナビをページ下部固定表示　※一括外 */
/* ================================================================= */

/* =================================================================
   レスポンシブ840pxより小さい
   ================================================================= */
@media screen and (max-width: 840px) {
  .ocnk045 #container {
    /* ポップアップメニューを表示した際、ヘッダー領域で描画される要素のセレクター */
    --popup-fixed-header-selector: ".header_global_nav";
  }
  .ocnk045.responsive #container:not(.use_folding_header, .has_min_nav) .header_global_nav {
    width: 100%;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 90;
  }
  .ocnk045.open_side_col.responsive #container:not(.use_folding_header, .has_min_nav) .header_global_nav {
    display: none;
  }

  /**
   * サイズの固定値
   * - ページトップボタン下部の余白: 10px
   * - カートに入れるボタンを下部に固定しない場合の右下固定ボタンの高さ: 45px
   */
  /* ページトップボタンが重なるので位置調整 */
  .ocnk045.responsive #container:not(.use_folding_header, .has_min_nav) .back_to_top {
    bottom: calc(var(--popup-visible-header-height) + 10px);
  }
  .ocnk045.responsive #container:not(.use_folding_header, .has_min_nav):has(.header_search_bar:not(.hidden_search_bar)) .back_to_top {
    bottom: calc(var(--popup-visible-header-height) + 10px + var(--popup-search-bar-height));
  }
  /* カート部分遷移ボタンが重なるので位置調整 (※商品詳細ページのカートに入れるボタンを下部に固定しない場合) */
  .ocnk045.responsive #container:not(.use_folding_header, .has_min_nav) .move_to_add_cart {
    bottom: calc(var(--popup-visible-header-height) + 10px + 45px + 10px);
  }
  .ocnk045.responsive #container:not(.use_folding_header, .has_min_nav):has(.header_search_bar:not(.hidden_search_bar)) .move_to_add_cart {
    bottom: calc(var(--popup-visible-header-height) + 10px + 45px + 10px + var(--popup-search-bar-height));
  }
  /* カート部分遷移ボタンが重なるので位置調整 (※商品詳細ページのカートに入れるボタンを下部に固定する場合) */
  .ocnk045.responsive #container:not(.use_folding_header, .has_min_nav):has(.fixed_add_cart_btn_box.is_fixed) .back_to_top {
    bottom: calc(var(--popup-visible-header-height) + 10px + var(--fixed-add-cart-btn-box-height));
  }
  .ocnk045.responsive #container:not(.use_folding_header, .has_min_nav):has(.fixed_add_cart_btn_box.is_fixed):has(.header_search_bar:not(.hidden_search_bar)) .back_to_top {
    bottom: calc(var(--popup-visible-header-height) + 10px + var(--fixed-add-cart-btn-box-height) + var(--popup-search-bar-height));
  }
  /* 商品詳細ページのカートに入れるボタンを下部に固定する場合の表示位置 */
  .ocnk045.responsive #container:not(.use_folding_header, .has_min_nav) .detail_item_data .add_cart_btn_wrapper .is_fixed {
    bottom: var(--popup-visible-header-height);
  }
  .ocnk045.responsive #container:not(.use_folding_header, .has_min_nav):has(.header_search_bar:not(.hidden_search_bar)) .detail_item_data .add_cart_btn_wrapper .is_fixed {
    bottom: calc(var(--popup-visible-header-height) + var(--popup-search-bar-height));
  }
  /* ポップアップメニューを下部に固定 */
  .ocnk045.responsive #container:not(.use_folding_header, .has_min_nav) .popup_menu .popup_menu_area,
  .ocnk045.responsive #container:not(.use_folding_header, .has_min_nav) .popup_primal_menu .inner_popup_nav_area {
    position: fixed;
    height: calc(100dvh - var(--popup-visible-header-height));
    overflow-y: auto;
    overscroll-behavior-y: none;
    bottom: var(--popup-visible-header-height);
  }
  .ocnk045.responsive #container:not(.use_folding_header, .has_min_nav) .popup_menu .inner_popup_nav_area {
    height: calc(100dvh - var(--popup-visible-header-height));
    overflow-y: auto;
    overscroll-behavior-y: none;
  }
  /* ポップアップメニューを下部に固定した際に背景スクロール無効 */
  .ocnk045.responsive.has_opened_popup_menu:not(:has(.use_folding_header, .has_min_nav)),
  .ocnk045.responsive.has_opened_popup_menu body:not(:has(#container:not(.use_folding_header, .has_min_nav))) {
    overflow: hidden;
  }
  /* ポップアップメニューを下部に余白を入れる */
  .ocnk045.responsive #container:not(.use_folding_header, .has_min_nav) .popup_menu .inner_popup_nav_area,
  .ocnk045.responsive #container:not(.use_folding_header, .has_min_nav) .popup_primal_menu .inner_popup_nav_area {
    padding-bottom: 30px;
  }
  /* ポップアップメニューを下部閉じるボタン非表示　※上にあるので */
  .ocnk045.responsive #container:not(.use_folding_header, .has_min_nav) .popup_menu .nav_close_box,
  .ocnk045.responsive #container:not(.use_folding_header, .has_min_nav) .popup_primal_menu .nav_close_box {
    display: none;
  }
  /* サブカテゴリ一覧の方が高さがある場合に戻ってきたナビゲーションの位置調整 */
  .ocnk045.has_opened_popup_menu.responsive #container:not(.use_folding_header, .has_min_nav) .popup_nav_area {
    bottom: var(--popup-visible-header-height);
  }
  .ocnk045.has_opened_popup_menu.responsive #container:not(.use_folding_header, .has_min_nav) .popup_menu:not(.active_sub) .popup_sub_menu,
  .ocnk045.has_opened_popup_menu.responsive #container:not(.use_folding_header, .has_min_nav) .popup_menu.active_sub .popup_main_menu {
    max-height: calc(100dvh - var(--popup-visible-header-height));
    overflow-y: hidden;
    overscroll-behavior-y: none;
  }
  .ocnk045.has_opened_popup_menu.responsive #container:not(.use_folding_header, .has_min_nav) .popup_sub_menu {
    bottom: 0;
  }
  /* 商品検索バーをポップアップする位置を下部ナビゲーションの上部にする */
  .ocnk045.responsive #container:not(.use_folding_header, .has_min_nav) .header_search_bar:not(.hidden_search_bar) {
    width: 100%;
    position: fixed;
    bottom: var(--popup-visible-header-height);
  }
  /* ポップアップメニューを開いた際に、ヘッダー部分が上に被らないようにする */
  .ocnk045.has_opened_popup_menu.responsive #container:not(.use_folding_header, .has_min_nav) #header {
    z-index: 1;
  }
  /* フッターのグローバルサイトリンクがポップアップした商品検索バーよりも上に来ないようにする */
  .ocnk045.responsive #container:not(.use_folding_header, .has_min_nav) #header {
    z-index: 90;
  }
  /* 下部固定ナビゲーションのSafaArea対応 */
  .ocnk045.responsive #container:not(.use_folding_header, .has_min_nav) .header_global_nav .global_nav {
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }
  /* フッターの最下部が下部固定のナビゲーションで見えなくならないように下部余白を調整 */
  .ocnk045.responsive #container:not(.use_folding_header, .has_min_nav) #inner_footer {
    padding-bottom: var(--popup-visible-header-height, 0px);
  }

  /* 各テンプレ指定
   # ================================================================= */
  .ocnk045.responsive:where(.touch026, .touch027, .touch030, .touch031) #container:not(.has_min_nav) .header_global_nav {
    background-color: #FFFFFF;
  }
  .ocnk045.responsive.touch022 #container:not(.has_min_nav, .use_folding_header) #header_wrapper .search_bar .search {
    background-color: #F5F5F5;
  }
  .ocnk045.responsive.touch028 #container:not(.has_min_nav, .use_folding_header) #header_wrapper .search_bar .search {
    background-color: #FFFFFF;
  }
}
/* ================================================================= */