﻿@charset "UTF-8";

/* ----------------------------------
 Layout
---------------------------------- */
.wrapper { background: #fff; overflow-x: hidden;}
.container .pane-main,
.pane-contents .container .pane-main { width: 100%; min-height: 50vh; padding: 20px var(--layout-basic-padding) 40px; margin: 0;}
.pane-contents:has(.block-topic-path) .container .pane-main { padding: 0 var(--layout-basic-padding) 40px;}

.page-top .pane-main,
.page-brandtop .pane-main,
.page-sales_landingpage .pane-main { padding: 0 !important;}

.body-fixed { width: 100%; height: 100%; position: fixed; left: 0;}

/* ----------------------------------
 MenuBg
---------------------------------- */
.bgfilter { width: 100%; height: 100%; background: rgba(51,51,51,0.6); position: fixed; top: 0; bottom: 0; left: 0; right: 0; z-index: 100; display: none;}
.bgfilter.menu-on,
.bgfilter.contact-on,
.bgfilter.category-menu-on { display: block;}

body.menu-on,
body.contact-on,
body.category-menu-on { overflow: hidden;}
body.menu-on .pane-header #header_box { border-radius: 0; box-shadow: none;}

/* ----------------------------------
 Header
---------------------------------- */
.pane-header { height: var(--layout-header-height); position: relative;}
.pane-header #header_box { height: var(--layout-header-height); padding: 0 8px; border-radius: 0 0 16px 16px; display: flex; justify-content: center; align-items: center; background: #FFF; box-shadow: var(--box-shadow);}
.pane-header #header_box .block-headermenu { width: 96px; margin: 0 auto 0 0;}
.pane-header:not(.pane-order-header) #header_box { position: fixed; top: 0; left: 0; right: 0; z-index: 101;}
.pane-header #header_menu_switch { width: 40px; height: 40px; border-radius: 40px; background-color: var(--color-bg); position: relative; cursor: pointer;}
.pane-header #header_menu_switch span,
.pane-header #header_menu_switch::before,
.pane-header #header_menu_switch::after  { content: ''; width: 18px; border-top: var(--color-main) 2px solid; transition: var(--transition); position: absolute; left: calc(50% - 9px);}
.pane-header #header_menu_switch span    { top: calc(50% - 1px);}
.pane-header #header_menu_switch::before { top: calc(50% - 7px);}
.pane-header #header_menu_switch::after  { top: calc(50% + 5px);}
.pane-header #header_menu_switch.active::before { top: calc(50% - 1px); transform: rotate(45deg);}
.pane-header #header_menu_switch.active::after { top: calc(50% - 1px); transform: rotate(-45deg);}
.pane-header #header_menu_switch.active span { display: none;}

.pane-header #header_box .block-header-logo { width: 160px; min-width: 160px; padding: 0 20px; margin: 0 auto; line-height: 1.0;}
.pane-header #header_box .block-header-logo img { width: 120px; vertical-align: middle;}

.pane-header #header_box .block-headernav { width: 96px; margin: 0 0 0 auto; display: flex; justify-content: flex-end; align-items: center;}
.pane-header #header_box .block-headernav-buttons { display: flex; justify-content: flex-end; align-items: center; column-gap: 16px;}
.pane-header #header_box .block-headernav-buttons li { height: 40px; position: relative; transition: var(--transition);}
.pane-header #header_box .block-headernav-buttons li.hnav-contact { width: 40px; height: 40px;}
.pane-header #header_box .block-headernav-buttons li.hnav-contact .switch {
  width: 100%;
  height: 100%;
  border-radius: 48px;
  font-size: var(--font-size-sub);
  font-weight: 700;
	text-decoration: none;
  color: #FFF;
  display: flex;
  justify-content: center;
  align-items: center;
	background-color: var(--color-orange);
	background-image: url("../../img/usr/common/ico_faq_w.png");
	background-repeat: no-repeat;
	background-position: center center;
	-webkit-background-size: 20px auto;
	background-size: 20px auto;
}
.pane-header #header_box .block-headernav-buttons li.hnav-cart { width: 40px; height: 40px;}
.pane-header #header_box .block-headernav-buttons li.hnav-cart a { 
  width: 100%;
  height: 100%;
  border-radius: 48px;
  font-size: var(--font-size-sub);
  font-weight: 700;
	text-decoration: none;
  color: #FFF;
  display: flex;
  justify-content: center;
  align-items: center;
	background-color: var(--color-yellow);
	background-image: url("../../img/usr/common/ico_cart_br.png");
	background-repeat: no-repeat;
	background-position: center center;
	-webkit-background-size: 26px auto;
	background-size: 26px auto;
  position: relative;
	transition: var(--transition);
	cursor: pointer;
}
.pane-header #header_box .block-headernav--cart-count {
  width: 20px;
  height: 20px;
  border-radius: 24px;
  font-size: 12px;
	color: #FFF;
  display: flex;
  justify-content: center;
  align-items: center;
	background: var(--color-orange);
	position: absolute;
	top: -6px;
	right: -6px;
}

.pane-order-header { height: var(--layout-header-height);}
.pane-cardupdate-header { height: var(--layout-header-height);}

/* ----------------------------------
 Header CONTACTMENU
---------------------------------- */
#hnav_contact_menu { padding: 30px 20px; border-radius: 16px 16px 0 0; background: #FFF; position: fixed; bottom: 0; left: 0; right: 0; z-index: 101; display: none;}
#hnav_contact_menu_head { margin: 0 0 16px; display: flex; justify-content: space-between; align-items: center;}
#hnav_contact_menu_head .design-close { margin: 0; text-align: center; position: relative; top: -10px;}
#hnav_contact_menu_head .design-close-btn { background-color: var(--color-bg);}
#hnav_contact_menu .hnav-contact-menu-inner { max-height: 70vh; overflow: hidden; overflow-y: scroll;}
#hnav_contact_menu .list { margin: 0 0 20px;}
#hnav_contact_menu .list li + li { margin-top: 10px; font-size: var(--font-size-main);}
#hnav_contact_menu .list li a {
  padding: 10px 30px 10px 10px;
  font-size: var(--font-size-main);
	font-weight: 500;
  text-decoration: none;
  line-height: var(--line-height-low);
  display: flex;
  align-items: center;
  position: relative;
	transition: var(--transition);
}
#hnav_contact_menu .list li a::after {
  content: '';
  width: 8px;
  height: 8px;
  border-right: var(--color-base) 2px solid;
  border-top: var(--color-base) 2px solid;
  position: absolute;
  right: 16px;
  top: calc(50% - 4px);
  display: block;
  transform: rotate(45deg);
}
#hnav_contact_menu .list li a:hover { color: var(--color-sub);}
#hnav_contact_menu .list li a:hover::after { border-right: var(--color-sub) 2px solid; border-top: var(--color-sub) 2px solid;}
#hnav_contact_menu .box { padding: 18px 14px; border-radius: var(--border-radius-half); background: var(--color-bg);}
#hnav_contact_menu .box + .box { margin-top: 12px;}
#hnav_contact_menu .ttl { margin: 0 0 5px; font-size: var(--font-size-main); font-weight: 500; text-align: center;}
#hnav_contact_menu .number { display: flex; justify-content: center; align-items: center;}
#hnav_contact_menu .number .icon { width: 30px; margin: 0 10px 0 0;}
#hnav_contact_menu .number .text { font-size: var(--font-size-H2); font-weight: 700; color: var(--color-base);}
#hnav_contact_menu .form .design-button-frame { width: 246px; height: 48px; margin: 0 auto;}
#hnav_contact_menu .form .design-button { font-size: var(--font-size-main);}

/* ----------------------------------
 Globalnav
---------------------------------- */
.pane-globalnav { height: calc(100vh - 58px); padding: 0; background: #F2F2F2; position: fixed; top: 58px; left: 0; right: 0; z-index: 101; overflow: hidden; display: none;}
.pane-globalnav .block-globalnav { width: 100%; height: calc(100vh - 58px); padding-bottom: 40px; margin: 0 auto; color: var(--color-base); overflow: hidden; overflow-y: scroll;}
.pane-globalnav .block-globalnav .block-globalnav-category-list { margin: 0 0 24px;}

/* 会員メニュー 上部 */
.block-global-customer-menu { padding: 28px 20px; background: #FFF;}
.block-global-customer-menu-list { display: flex; justify-content: space-between; align-items: center;}
.block-global-customer-menu-list li { width: calc(50% - 9px); height: 48px;}
.block-global-customer-menu-list li.gnav-login a { font-size: var(--font-size-large); background: var(--button-bg1);}
.block-global-customer-menu-list li.gnav-entry a { border: var(--button-bg1) 1px solid; background: #FFF; font-size: var(--font-size-large); color: var(--button-bg1);}
.block-global-customer-menu-list li.gnav-entry a::after { border-color: var(--button-bg1);}
.block-global-customer-menu-list li.gnav-mypage { width: 80%;}
.block-global-customer-menu-list li.gnav-mypage a { font-size: var(--font-size-large); background: var(--button-bg1);}
.block-global-customer-menu-list:has(.gnav-mypage) { justify-content: center;}

/* 検索窓 */
.block-global-search { padding: 0 20px 28px; margin: 0 auto; background: #FFF;}
.block-global-search form { width: 100%; height: 44px; display: flex; justify-content: space-between; align-items: center;}
.block-global-search form .block-global-search--keyword {
  width: calc(100% - 44px);
  height: 44px;
  min-height: 44px;
	padding: 0 16px;
  border: var(--border-solid3);
  border-right: none;
	border-radius: 4px 0 0 4px;
	font-size: var(--font-size-sub);
	font-weight: 500;
  display: flex;
  align-items: center;
}
.block-global-search form .block-global-search--submit {
  width: 44px;
  height: 44px;
	border: var(--button-bg2) 2px solid;
	border-radius: 0 4px 4px 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
	background: var(--button-bg2) url("../../img/usr/common/ico_search_w.png") no-repeat center center / 28px 28px;
	transition: var(--transition);
}
.block-global-search form .block-global-search--submit:hover {
	opacity: var(--opacity);
}

/* 商品メニュー 中部 */
.block-globalnav-middle-menu { border-top: var(--color-bg) 2px solid; background: #FFF;}
.block-globalnav-middle-menu .menu-list-item { border-bottom: var(--color-bg) 2px solid;}
.block-globalnav-middle-menu .menu-list-item.link a {
  min-height: 60px;
  padding: 10px 20px;
  font-size: var(--font-size-large);
	font-weight: 700;
  text-decoration: none !important;
  background: #FFF;
  display: flex;
  align-items: center;
  position: relative;
}
.block-globalnav-middle-menu .menu-list-item.link a::after {
  content: '';
  width: 8px;
  height: 8px;
  border-right: var(--color-base) 2px solid;
  border-top: var(--color-base) 2px solid;
  position: absolute;
  right: 20px;
  top: calc(50% - 4px);
  display: block;
  transform: rotate(45deg);
}
.block-globalnav-middle-menu .menu-list-item.parent p.ttl {
  min-height: 60px;
  padding: 10px 50px 10px 20px;
  font-size: var(--font-size-large);
	font-weight: 700;
  display: flex;
  align-items: center;
  background: #FFF;
  position: relative;
}
.block-globalnav-middle-menu .menu-list-item.parent p.ttl .opener { 
	width: 20px;
	height: 20px;
	border-radius: 20px;
	display: block;
	background: var(--button-bg1);
	position: absolute;
	top: calc(50% - 10px);
	right: 16px;
}
.block-globalnav-middle-menu .menu-list-item.parent p.ttl .opener::before,
.block-globalnav-middle-menu .menu-list-item.parent p.ttl .opener::after {
  content: '';
  width: 10px;
  height: 0;
  border: none;
  border-top: #FFF 1px solid;
  display: block;
  position: absolute;
  top: calc(50% - 0.5px);
  right: calc(50% - 5px);
  transform: rotate(0deg);
  transition: all 0.3s;	
}
.block-globalnav-middle-menu .menu-list-item.parent p.ttl .opener::before { transform: rotate(90deg);}
.block-globalnav-middle-menu .menu-list-item.parent p.ttl.is-open .opener::before { transform: rotate(0deg);}
.block-globalnav-middle-menu .menu-list-item.parent .child-box { padding: 30px 20px 10px; background: var(--color-salmon); display: none;}
.block-globalnav-middle-menu .menu-list-item.parent .child-box .design-button-frame { width: 246px; height: 48px; margin: 16px auto 20px;}

/* カテゴリー */
.block-globalnav-middle-menu .block-globalnav-category--body { display: flex; flex-wrap: wrap; justify-content: space-between;}
.block-globalnav-middle-menu .block-globalnav-category--row { width: calc(50% - 12px); margin: 0 0 20px 0; font-size: var(--font-size-main);}
.block-globalnav-middle-menu .block-globalnav-category--row a {
	padding: 0 20px 0 0;
  font-size: var(--font-size-main);
	font-weight: 700;
  text-decoration: none !important;
  color: var(--color-base);
  display: block;
	position: relative;
}
.block-globalnav-middle-menu .block-globalnav-category--row a::after {
  content: '';
  width: 8px;
  height: 8px;
  border-right: var(--color-base) 2px solid;
  border-top: var(--color-base) 2px solid;
  position: absolute;
  right: 0;
  top: calc(50% - 4px);
  display: block;
  transform: rotate(45deg);
}


/* 会員メニュー 下部 */
.block-globalnav-bottom-menu { padding: 16px 20px 56px;}
.block-globalnav-bottom-menu-list { margin: 0; display: flex; justify-content: space-between; flex-wrap: wrap;}
.block-globalnav-bottom-menu-list li { width: calc(50% - 7px); margin: 24px 0 0 0; font-size: var(--font-size-sub); line-height: var(--line-height-low);}
.block-globalnav-bottom-menu-list li a { color: var(--color-base); text-decoration: none !important;}
.block-globalnav-bottom-menu-list li a[target="_blank"]::after {
	content: '';
	width: 14px;
	height: 14px;
	margin: 0 0 0 8px;
	vertical-align: middle;
	display: inline-block;
	background: var(--image-icon-blank);
}

/* 閲覧履歴 */
.pane-globalnav .block-recent-item-header-title.design-headline { margin-bottom: 0;}
.pane-globalnav .block-thumbnail-h--goods-image { border-radius: var(--border-radius-half); background: #FFF;	overflow: hidden;}

/* お問い合わせ */
.block-globalnav-contact { padding: 24px 52px; margin: 20px; border-radius: var(--border-radius-half); background: #FFF;}
.block-globalnav-contact .ttl { margin: 0 0 5px; font-size: var(--font-size-sub); color: var(--color-base); text-align: center;}
.block-globalnav-contact .number { margin: 0 0 10px; display: flex; justify-content: center; align-items: center;}
.block-globalnav-contact .number .icon { width: 30px; margin: 0 10px 0 0;}
.block-globalnav-contact .number .text { font-size: 20px; font-weight: 700; color: var(--color-base);}
.block-globalnav-contact .design-button-frame { height: 48px;}
.block-globalnav-contact .design-button { padding-right: 10px; font-size: var(--font-size-main);}

/* ----------------------------------
 重要なお知らせ
---------------------------------- */
#block_of_top_important_news { padding: 40px 0 0; margin: 0 0 40px;}
#block_of_top_important_news .block-news-list { padding: 0 20px;}
.block-news-list li { margin: 0; border-bottom: var(--border-dot); background: #FFF;}
.block-news-list li .nolink,
.block-news-list li a { padding: 16px 20px 16px 0; text-decoration: none; display: block; position: relative;}
.block-news-list dl { width: 100%;}
.block-news-list dt { margin: 0 0 10px; display: flex; align-items: center;}
.block-news-list dt .icon:has(img),
.block-news-list dt .icon:has(span) { width: 86px;}
.block-news-list dt .icon img { height: 24px; vertical-align: top;}
.block-news-list dt .icon .ico-important {
  width: 70px;
  height: 24px;
  display: block;
  font-size: 0;
  background-image: url(../../img/icon/important.png);
	background-repeat: no-repeat;
	background-position: left top;
	-webkit-background-size: 70px 24px;
	background-size: 70px 24px;
}
.block-news-list dt .date { font-size: var(--font-size-main); font-weight: 700; line-height: 1.0;}
.block-news-list dd { width: 100%; font-size: var(--font-size-main); font-weight: 700; line-height: 1.0; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden;}
.block-news-list li a dd::after {
  content: '';
  width: 8px;
  height: 8px;
  border-right: var(--color-base) 2px solid;
  border-top: var(--color-base) 2px solid;
  position: absolute;
  right: 5px;
  top: calc(50% + 12px);
  display: block;
  transform: rotate(45deg);
}
.block-news-list li a:hover dd::after { border-color: var(--color-sub);}

/* ----------------------------------
 重要なお知らせのピックアップ表示
---------------------------------- */
#header_pickup_important_news { padding: 0 0 16px; background: transparent;}
#header_pickup_important_news .block-news-list { margin: 0 auto; padding: 0 20px;}
#header_pickup_important_news .block-news-list li { border-bottom: none; background: transparent;}
#header_pickup_important_news .block-news-list li + li { border-top: var(--border-dot);}
#header_pickup_important_news .block-news-list li .nolink,
#header_pickup_important_news .block-news-list li a { background: transparent;}
#header_pickup_important_news .block-news-list li:last-child .nolink,
#header_pickup_important_news .block-news-list li:last-child a { padding-bottom: 0;}

/* ----------------------------------
 Footer
---------------------------------- */
.pane-footer { padding: 0; margin: 0; position: relative;}
.pane-footer .container { width: 100%; max-width: unset; padding: 0;}
.pane-footer .block-switcher { display: none !important;}
.pane-footer:has(.block-footer-box-frame) .block-footer-inner {
	padding-top: 28px;
	background-image: url("../../img/usr/footer/footer_bg_sp.png");
	background-repeat: no-repeat;
	background-position: top left;
	-webkit-background-size: 100% 28px;
	background-size: 100% 28px;
}
.pane-footer .block-footer-box-frame { padding: 36px 20px 8px; background: var(--color-yellow);}
.pane-footer .block-footer-box.head { margin: 0 auto 36px; display: flex; justify-content: space-between; align-items: center;}
.pane-footer .block-footer-box.head .logo { width: 170px;}
.pane-footer .block-footer-box.head .logo a { transition: var(--transition);}
.pane-footer .block-footer-sns--list { display: flex; justify-content: flex-end; flex-wrap: nowrap; column-gap: 8px;}
.pane-footer .block-footer-sns--list li { width: 46px;}
.pane-footer .block-footer-sns--list li a { width: 100%; height: 100%; padding: 10px; display: flex; justify-content: center; align-items: center;}
.pane-footer .block-footer-sns--list li.sns-instagram a { padding: 8px;}
.pane-footer .block-footer-sns--list li.sns-youtube a { padding: 10px 5px;}

.pane-footer .block-footernav--item-list { margin: 0 0 32px; display: flex; justify-content: space-between; flex-wrap: wrap;}
.pane-footer .block-footernav--item-list li { width: calc(50% - 7px); margin: 24px 0 0 0; font-size: var(--font-size-sub); font-weight: 500; line-height: var(--line-height-low);}
.pane-footer .block-footernav--item-list li:nth-child(1),
.pane-footer .block-footernav--item-list li:nth-child(2) { margin-top: 0;}
.pane-footer .block-footernav--item-list li a { font-weight: 500; color: var(--color-base); text-decoration: none;}
.pane-footer .block-footernav--item-list li a[target="_blank"]::after {
	content: '';
	width: 14px;
	height: 14px;
	margin: 0 0 0 8px;
	vertical-align: middle;
	display: inline-block;
	background: var(--image-icon-blank);
}

.pane-footer .block-footer-banner--list { margin: 0; display: flex; justify-content: space-between; flex-wrap: wrap;}
.pane-footer .block-footer-banner--list li { width: calc(50% - 7px); margin: 14px 0 0 0;}
.pane-footer .block-footer-banner--list li:nth-child(1),
.pane-footer .block-footer-banner--list li:nth-child(2) { margin-top: 0;}
.pane-footer .block-footer-banner--list li img { width: 100%; vertical-align: top;}

/* コピーライト */
.pane-footer .block-copyright {
  height: 60px;
  font-size: var(--font-size-xsmall);
	font-weight: 500;
  text-align: center;
  color: var(--color-base);
  display: flex;
  justify-content: center;
  align-items: center;
  background: var(--color-yellow);
}

/* ページトップへ */
.pane-footer .block-page-top { display: none; position: fixed; top: auto; bottom: 10px; right: 10px; z-index: 15;}
.pane-footer .block-page-top a { width: 44px; height: 44px; border-radius: var(--border-radius-half); display: block; background-color: var(--button-bg2); position: relative;}
.pane-footer .block-page-top a:after {
  content: '';
  width: 12px;
  height: 12px;
  border-right: #FFF 2px solid;
  border-top: #FFF 2px solid;
  display: block;
  position: absolute;
  left: calc(50% - 6px);
  top: calc(50% - 3px);
  transform: rotate(-45deg);
}

/* ----------------------------------
 閲覧履歴 - アイレコ
---------------------------------- */
#block_of_itemhistory_aireco { padding: 40px 0 0 0; margin: 0 0 40px; position: relative;}
#block_of_itemhistory_aireco::before { content: ''; width: 200vw; border-top: var(--border-solid3); display: block; position: absolute; top: 0; left: -50vw;}
.block-recent-item--items { width: 100%; margin: 0 auto;}
.block-recent-item--header {
  padding: 0 20px;
  margin: 0 0 26px;
  border: 0;
  font-size: var(--font-size-H2);
  font-weight: 700;
  text-align: left;
  line-height: 1.0;
  letter-spacing: 0.04em;
  color: var(--color-main);
}
.block-recent-item { width: 100%;}
.block-recent-item .block-recent-item--empty-message,
.block-recent-item .block-recent-item--history-message { text-align: center;}
.block-recent-item .block-recent-item--keep-history { display: none;}

/* ----------------------------------
 BlockParts ジャンル
---------------------------------- */
#block_of_genre { border: none;}

/* ----------------------------------
 BlockParts カテゴリー
---------------------------------- */
#block_of_category { border: none;}

/* ----------------------------------
 Contents お問い合わせ
---------------------------------- */
#block_top_contact { padding: 40px 20px; margin: 0; text-align: center; background: var(--color-cream); display: none;}
#block_top_contact .title { margin: 0 0 24px; font-size: var(--font-size-H3); text-align: center; color: var(--color-main);}
#block_top_contact .text  { margin: 0 0 24px; font-size: var(--font-size-main);}
#block_top_contact .design-button-frame { width: calc(100% - 20px); height: 56px; margin: 0 auto;}
#block_top_contact .design-button-frame a.design-button { font-size: 18px;}
#block_top_contact .design-button-frame a.design-button::after { width: 10px; height: 10px; right: 24px; top: calc(50% - 5px);}

/* ----------------------------------
 Contents カテゴリで探す
---------------------------------- */
#block_top_category { padding: 40px 20px 20px;}
#block_top_category .design-headline { margin: 0 0 32px;}
#block_top_category .block-category-list--sub { padding: 0; margin: 0; border: none;}
#block_top_category .block-category-style-l { display: flex; flex-wrap: wrap; justify-content: space-between;}
#block_top_category .block-category-style-l .block-category-style-l--item-name { width: calc(50% - 12px); margin: 0 0 20px 0; font-size: var(--font-size-main);}
#block_top_category .block-category-style-l .block-category-style-l--item-name a {
	padding: 0 20px 0 0;
  font-size: var(--font-size-main);
	font-weight: 700;
  text-decoration: none !important;
  color: var(--color-base);
  display: block;
	position: relative;
}
#block_top_category .block-category-style-l .block-category-style-l--item-name a::after {
  content: '';
  width: 8px;
  height: 8px;
  border-right: var(--color-base) 2px solid;
  border-top: var(--color-base) 2px solid;
  position: absolute;
  right: 0;
  top: calc(50% - 4px);
  display: block;
  transform: rotate(45deg);
}

#block_top_category .block-dynamic-category--body { display: flex; flex-wrap: wrap; justify-content: space-between;}
#block_top_category .block-dynamic-category--body .block-dynamic-category--row { width: calc(50% - 12px); margin: 0 0 20px 0; font-size: var(--font-size-main);}
#block_top_category .block-dynamic-category--body .block-dynamic-category--row a {
	padding: 0 20px 0 0;
  font-size: var(--font-size-main);
	font-weight: 700;
  text-decoration: none !important;
  color: var(--color-base);
  display: block;
	position: relative;
}
#block_top_category .block-dynamic-category--body .block-dynamic-category--row a::after {
  content: '';
  width: 8px;
  height: 8px;
  border-right: var(--color-base) 2px solid;
  border-top: var(--color-base) 2px solid;
  position: absolute;
  right: 0;
  top: calc(50% - 4px);
  display: block;
  transform: rotate(45deg);
}

/* ----------------------------------
 件数・並べ替え
---------------------------------- */
#goods_list_navigation_head_frame { padding: 0 0 20px; margin: 24px 0; border-bottom: var(--border-solid3); line-height: 1.0;}
#goods_list_navigation_head_frame .pager-total { padding: 0; margin: 0 0 24px; font-size: 16px; text-align: center; word-break: keep-all; line-height: 1.0;}
#goods_list_navigation_head_frame .pager-count { font-size: 16px; line-height: 1.0;}
#goods_list_navigation_head_frame .pager-count span { margin: 0 3px 0 0; font-size: 24px; font-weight: 700;}

/* ----------------------------------
 絞り込み
---------------------------------- */
#block_of_filter {
	width: calc(100% - 180px);
	min-width: calc(100% - 180px);
	display: none;
}
.block-filter--header {
	display: none !important;
}
.block-filter--header {
	width: 100%;
	min-width: 100%;
	height: 40px;
  padding: 0;
  margin: 0;
  border: none;
  display: flex;
  justify-content: center;
  align-items: center;
  background: none;
  cursor: pointer;
}
.block-filter--header h2.block-filter--header-label {
	width: 100%;
	min-width: 100%;
	height: 40px;
  padding: 10px 20px 10px 40px;
  margin: 0 0 0 auto;
  border: var(--border-solid3);
  border-radius: 40px;
  font-size: var(--font-size-main);
  font-weight: 700;
  text-align: center;
  color: var(--color-base);
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #FFF;
  background-image: url("../../img/usr/common/ico_filter.png");
  background-repeat: no-repeat;
  background-position: 16px center;
  -webkit-background-size: 24px 24px;
  background-size: 24px 24px;
  cursor: pointer;
}
#block_of_filter:has(input:checked) .block-filter--header h2.block-filter--header-label,
#block_of_filter.has-select-value .block-filter--header h2.block-filter--header-label {
	border: var(--color-sub) 1px solid;
	color: var(--color-sub);
	background-image: url("../../img/usr/common/ico_filter_or.png");
}
#block_of_filter:has(input:checked) .block-filter--header h2.block-filter--header-label::after,
#block_of_filter.has-select-value .block-filter--header h2.block-filter--header-label::after {
	content: '中';
}
.block-filter--header.block-filter--open { display: none;}
.block-filter--modal { width: 100%; height: 100%; display: none; position: fixed; top: 0; left: 0; z-index: 99999;}
.block-filter--modal .block-filter--frame {
  width: 100%;
  max-height: calc(100% - 60px);
	height: auto;
  padding: 30px 20px;
  border-radius: 16px 16px 0 0;
  overflow-x: hidden;
  overflow-y: auto;
  background: #FFF;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}
.block-filter--modal .block-filter--frame .block-filter--frame-header {
	padding: 0 0 0 36px;
	margin: 0 0 20px;
	font-size: var(--font-size-H3);
	font-weight: 700;
	line-height: var(--line-height-low);
	color: var(--color-main);
	position: relative;
}
.block-filter--modal .block-filter--frame .block-filter--frame-header::before {
	content: '';
	width: 24px;
	height: 24px;
	background-image: var(--ttl-image1);
	background-repeat: no-repeat;
	background-position: center center;
	-webkit-background-size: 24px 24px;
	background-size: 24px 24px;
	position: absolute;
	top: 0;
	left: 0;
}
.block-filter--modal .block-filter--frame .block-filter--frame-close {
  width: 40px;
  height: 40px;
  margin: 0 auto;
	border: var(--button-bg3) 2px solid;
  border-radius: 40px;
  font-size: 0;
  background: var(--button-bg3);
  display: block;
  position: absolute;
  top: 20px;
  right: 20px;
  cursor: pointer;
  transition: var(--transition);
}
.block-filter--modal .block-filter--frame .block-filter--frame-close::before,
.block-filter--modal .block-filter--frame .block-filter--frame-close::after { 
	content: '';
	width: 18px;
	border-top: #FFF 2px solid;
	display: block;
	position: absolute;
	top: calc(50% - 1px);
	left: calc(50% - 9px);
	transform: rotate(45deg);
}
.block-filter--modal .block-filter--frame .block-filter--frame-close::after { transform: rotate(-45deg);}
.block-filter--modal .block-filter--frame .block-filter--list-item { border-bottom: var(--border-solid1); display: block;}
.block-filter--modal .block-filter--frame .block-filter--select-label { height: 52px; padding-left: 20px;}
.block-filter--modal .block-filter--frame .block-filter--expand-icon { width: 50px; height: 52px; padding: 0 18px;}
.block-filter--modal .block-filter--frame .block-filter--expand-icon .block-icon-image-double-small { position: relative; width: 14px; height: 14px; background: none;}
.block-filter--modal .block-filter--frame .block-filter--expand-icon .block-icon-image-double-small::before,
.block-filter--modal .block-filter--frame .block-filter--expand-icon .block-icon-image-double-small::after {
  content: '';
  width: 14px;
  height: 2px;
  border-radius: 1px;
  background: var(--color-base);
  position: absolute;
  top: 6px;
  left: 0;
}
.block-filter--modal .block-filter--frame .block-filter--expand-icon .block-icon-image-double-small::after { transform: rotate(90deg);}
.block-filter--modal .block-filter--frame .block-filter--expand-icon .block-icon-image-double-small.block-icon-image--minus::after { display: none;}
.block-filter--modal .block-filter--frame .block-filter--element { border-bottom: 0;}
.block-filter--modal .block-filter--frame .block-filter--filter-options { border-top: var(--border-solid1);}
.block-filter--modal .block-filter--frame .block-filter--option-items { height: 52px; padding-left: 20px; background: #FFF;}
.block-filter--modal .block-filter--frame .block-filter--treelist-layer { border-top: var(--border-solid1);}
.block-filter--tree-2,
.block-filter--tree-3,
.block-filter--tree-4 { margin: 0; border-top: var(--border-solid1); background: #FFF;}
.block-filter--tree-2 > li,
.block-filter--tree-3 > li,
.block-filter--tree-4 > li { padding: 0;}
.block-filter--tree-2 > li .block-filter--treeitem-name { padding-left: 20px !important;}
.block-filter--tree-3 > li .block-filter--treeitem-name { padding-left: 40px !important;}
.block-filter--tree-4 > li .block-filter--treeitem-name { padding-left: 60px !important;}
.block-filter--modal .block-filter--frame .block-filter--treeitem { border-top: var(--border-solid1);}
.block-filter--modal .block-filter--frame .block-filter--treeitem:first-of-type { border-top: 0;}
.block-filter--modal .block-filter--frame .block-filter--treeitem-name { height: 52px; text-decoration: none; background: #FFF;}
.block-filter--modal .block-filter--frame .block-filter--treeitem .block-filter--treeitem-dir { width: 50px; height: 52px; padding: 0 18px; background: #FFF;}
.block-filter--modal .block-filter--frame .block-filter--treeitem .block-filter--treeitem-dir .block-icon-image-double-small { width: 14px; height: 14px; position: relative; background: none;}
.block-filter--modal .block-filter--frame .block-filter--treeitem .block-filter--treeitem-dir .block-icon-image-double-small::before,
.block-filter--modal .block-filter--frame .block-filter--treeitem .block-filter--treeitem-dir .block-icon-image-double-small::after {
  content: '';
  width: 14px;
  height: 2px;
  border-radius: 1px;
  background: var(--color-base);
  position: absolute;
  top: 6px;
  left: 0;
}
.block-filter--modal .block-filter--frame .block-filter--treeitem .block-filter--treeitem-dir .block-icon-image-double-small::after { transform: rotate(90deg);}
.block-filter--modal .block-filter--frame .block-filter--treeitem .block-filter--treeitem-dir .block-icon-image-double-small.block-icon-image--minus::after { display: none;}
.block-filter--modal .block-filter--frame-bg { width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); cursor: pointer;}

/* ----------------------------------
 Youtube埋め込み
---------------------------------- */
.youtube-frame { width: 100%; height: 0; padding-top: 56.25%; position: relative; overflow: hidden;}
.youtube-frame iframe { width: 100%; height: 100%; border: 0; position: absolute; top: 0; left: 0;}
