@charset "UTF-8";

:root {
  --usr-scrollbar-width: 0;
		
  --color-base:   #333333;
  --color-main:   #303068;
  --color-sub:    #BC8B2A;
  --color-bg:     #F2F2F2;
  --color-sale:   #E62019;
			
  --button-bg1:   #BC8B2A;
  --button-bg2:   #303068;
  --button-bg3:   #C9C9C9;
  --button-bg4:   #333333;
  --button-bg5:   #BC8B2A;
	
	--ttl-image1: url("../../img/usr/common/ico_title_bg_go.png");
	
	/* 米澤商店ヘッダー */
  --category-header-height: 58px;
  --category-header-bg: #080033;
	
	/* 商品一覧 カートボタン */
	--goods-list-cart-icon-image: url("../../img/usr/common/ico_cart_w.png");
	--goods-list-cart-icon-image-hover: url("../../img/usr/common/ico_cart_go.png");
	
}

/* ----------------------------------
 Header
---------------------------------- */
.pane-header { background-color: var(--category-header-bg);}

/* ----------------------------------
 米澤商店ヘッダー
---------------------------------- */
body.category-menu-on #yonezawa_header_wrap { background: var(--color-bg); position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 105;}
body.category-header-fixed .pane-header { opacity: 0;}
body.category-header-fixed #yonezawa_header_wrap { position: fixed; top: 0; left: 0; z-index: 105;}

.pane-category-header-frame { padding-top: var(--category-header-height); position: relative;}
#yonezawa_header_wrap { width: 100%; position: absolute; top: 0; left: 0; z-index: 100;}
#yonezawa_header { background-color: var(--category-header-bg); position: relative; z-index: 100;}
#yonezawa_header .yonezawa-header-inner { height: var(--category-header-height); padding: 0 10px; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; position: relative;}
#yonezawa_header .yonezawa-header-inner .yonezawa-logo {
	padding: 0;
	margin: 0;
	font-family: "Yu Mincho", "YuMincho", serif;
	font-size: var(--font-size-H2);
	font-weight: 700;
	line-height: 1.0;
	color: #FFF;
	position: absolute;
	left: calc(50% - 2em);
	top: calc(50% - 0.5em);
}
#yonezawa_header .yonezawa-header-inner .yonezawa-logo a {
	font-family: "Yu Mincho", "YuMincho", serif;
	font-size: var(--font-size-H2);
	font-weight: 700;
	text-decoration: none;
	line-height: 1.0;
	color: #FFF;
}
#header_yonezawa_menu_switch { width: 40px; height: 40px; border-radius: 40px; background-color: var(--color-sub); position: relative; cursor: pointer;}
#header_yonezawa_menu_switch span,
#header_yonezawa_menu_switch::before,
#header_yonezawa_menu_switch::after  { content: ''; width: 18px; border-top: #FFF 2px solid; transition: var(--transition); position: absolute; left: calc(50% - 9px);}
#header_yonezawa_menu_switch span    { top: calc(50% - 1px);}
#header_yonezawa_menu_switch::before { top: calc(50% - 7px);}
#header_yonezawa_menu_switch::after  { top: calc(50% + 5px);}
#header_yonezawa_menu_switch.active::before { top: calc(50% - 1px); transform: rotate(45deg);}
#header_yonezawa_menu_switch.active::after { top: calc(50% - 1px); transform: rotate(-45deg);}
#header_yonezawa_menu_switch.active span { display: none;}

.yonezawa-globalnav { width: 100%; padding: 0; position: absolute; top: 58px; left: 0; z-index: 100; display: none;}
.yonezawa-globalnav .yonezawa-block-global-visual { text-align: center;}
.yonezawa-globalnav .yonezawa-block-global-visual img { width: 100%;}
.yonezawa-globalnav .block-global-search { padding: 32px 20px; background: #FFF;}
.yonezawa-globalnav .yonezawa-globalnav-inner { height: calc(100vh - 58px); padding: 0 0 60px; margin: 0 auto; overflow: hidden; overflow-y: scroll;}
.yonezawa-globalnav .yonezawa-category-list { border-bottom: var(--color-bg) 2px solid;}
.yonezawa-globalnav .yonezawa-category-list p.list-title {
  min-height: 60px;
  padding: 10px 50px 10px 20px;
  border-top: var(--color-bg) 2px solid;
  font-size: var(--font-size-large);
	font-weight: 700;
  background: #FFF;
  display: flex;
  align-items: center;
  position: relative;
}
.yonezawa-globalnav .yonezawa-category-list p.list-title .opener { 
	width: 20px;
	height: 20px;
	border-radius: 20px;
	display: block;
	background: var(--button-bg1);
	position: absolute;
	top: calc(50% - 10px);
	right: 16px;
}
.yonezawa-globalnav .yonezawa-category-list p.list-title .opener::before,
.yonezawa-globalnav .yonezawa-category-list p.list-title .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;	
}
.yonezawa-globalnav .yonezawa-category-list p.list-title .opener::before { transform: rotate(90deg);}
.yonezawa-globalnav .yonezawa-category-list p.list-title.active .opener::before { transform: rotate(0deg);}
.yonezawa-globalnav .yonezawa-category-list ul.list {
  padding: 10px 0;
  margin: 0;
  border-top: var(--color-bg) 2px solid;
  display: none;
  justify-content: space-between;
  flex-wrap: wrap;
  background: #E8E8EB;
}
.yonezawa-globalnav .yonezawa-category-list ul.list.active { display: flex !important;}
.yonezawa-globalnav .yonezawa-category-list ul.list li { width: calc(50% - 7px); margin: 0; font-size: var(--font-size-sub); line-height: var(--line-height-low);}
.yonezawa-globalnav .yonezawa-category-list ul.list li a {
  min-height: 60px;
  padding: 10px 20px;
  font-size: var(--font-size-main);
	font-weight: 700;
  text-decoration: none !important;
  background: transparent;
  display: flex;
  align-items: center;
  position: relative;
}
.yonezawa-globalnav .yonezawa-category-list ul.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: 20px;
  top: calc(50% - 4px);
  display: block;
  transform: rotate(45deg);
}

/* ----------------------------------
 米澤商店フッター上 注意書き
---------------------------------- */
#yonezawa_common_footer { padding: 0 20px; margin: 0 auto; position: relative; top: -20px;}
#yonezawa_common_footer .attention-stop-drink { display: flex; align-items: center; column-gap: 20px;}
#yonezawa_common_footer .attention-stop-drink .icon { width: 50px; min-width: 50px;}
#yonezawa_common_footer .attention-stop-drink .indent-list {}
#yonezawa_common_footer .attention-stop-drink .indent-list li { list-style: none; padding-left: 1em; font-size: var(--font-size-sub); text-indent: -1em; color: var(--color-gray);}

/* ----------------------------------
 Footer
---------------------------------- */
.pane-footer:has(.block-footer-box-frame) .block-footer-inner { background-image: url("../../img/usr/footer/footer_bg_yonezawa_sp.png");}
.pane-footer .block-footer-box-frame { background: var(--color-main);}

.pane-footer .block-footer-box.head .logo a { width: 170px; height: 30px; display: block; background: url("../../img/usr/common/logo_kantenpapa_w.png") no-repeat left top / 170px auto;}
.pane-footer .block-footer-box.head .logo a img { opacity: 0 !important;}

.pane-footer .block-footer-sns--list li img { opacity: 0 !important;}
.pane-footer .block-footer-sns--list li.sns-x a { background: url("../../img/usr/common/ico_x_w.png") no-repeat center center / 28px auto;}
.pane-footer .block-footer-sns--list li.sns-instagram a { background: url("../../img/usr/common/ico_instagram_w.png") no-repeat center center / 30px auto;}
.pane-footer .block-footer-sns--list li.sns-youtube a { background: url("../../img/usr/common/ico_youtube_w.png") no-repeat center center / 27px auto;}

.pane-footer .block-footernav--item-list li a { color: #FFF;}
.pane-footer .block-footernav--item-list li a[target="_blank"]::after { background: var(--image-icon-blank-w);}
.pane-footer .block-copyright { background: var(--color-main); color: #FFF;}
.pane-footer .block-page-top a { border: #FFF 1px solid;}

/* ----------------------------------
 汎用クラス
---------------------------------- */
.design-headline,
.design-block-title .ttl { font-family: "Yu Mincho", "YuMincho", serif;}

/* ----------------------------------
 Swiper パーツ
---------------------------------- */
.swiper-controls .swiper-button-prev,
.swiper-controls .swiper-button-next { border: var(--button-bg1) 2px solid; background: var(--button-bg1);}
.swiper-controls .swiper-button-prev:hover::after,
.swiper-controls .swiper-button-next:hover::after { border-right: var(--button-bg1) 2px solid; border-top: var(--button-bg1) 2px solid;}

/* ----------------------------------
 絞り込み
---------------------------------- */
#block_of_filter { display: block !important;}
#block_of_filter .block-filter--header { display: block !important;}
#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 { background-image: url("../../img/usr/common/ico_filter_go.png");}
#block_of_filter .block-filter--modal .block-filter--frame .block-filter--frame-header { font-family: "Yu Mincho", "YuMincho", serif;}
#block_of_filter .block-filter--modal .block-filter--frame .block-filter--frame-close { border: var(--color-bg) 2px solid; background-color: var(--color-bg);}
#block_of_filter .block-filter--modal .block-filter--frame .block-filter--frame-close::before,
#block_of_filter .block-filter--modal .block-filter--frame .block-filter--frame-close::after { border-color: var(--color-main);}

#block_of_filter .block-filter--modal #div_filter15 .block-filter--select-label { font-size: var(--font-size-H4); font-weight: 700;}
#block_of_filter .block-filter--modal #div_filter15 + .js-filter-treelist-filterstyle,
#block_of_filter .block-filter--modal #div_filter15 + .js-filter-treelist-filterstyle.hidden,
#block_of_filter .block-filter--modal #div_filter15 + .js-filter-treelist-filterstyle ul.js-filter-tree,
#block_of_filter .block-filter--modal #div_filter15 + .js-filter-treelist-filterstyle.hidden ul.js-filter-tree { display: block !important;}
#block_of_filter .block-filter--modal #div_filter15 .block-filter--expand-icon,
#block_of_filter .block-filter--modal #div_filter15 + .js-filter-treelist-filterstyle .block-filter--treeitem-dir { display: none !important;}
#block_of_filter .block-filter--modal #div_filter15 + .js-filter-treelist-filterstyle .block-filter--treeitem-name { padding-right: 40px; position: relative;}
#block_of_filter .block-filter--modal #div_filter15 + .js-filter-treelist-filterstyle .block-filter--treeitem-name::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);
}

/* ----------------------------------
 GoodsList
---------------------------------- */
.btn-cart { border: var(--button-bg5) 2px solid; color: #FFF; background-color: var(--button-bg5);}
.btn-cart:hover { background-color: #FFF; color: var(--button-bg5);}
.block-pickup-list-p .block-goods-favorite .block-goods-list--favorite-registed--btn { background-image: url("../../img/usr/common/ico_goodslist_bookmark_reg_btn_go.png");}

/* ----------------------------------
 Category
---------------------------------- */
.page-category #category_top_contents_frame { margin: 0 0 40px !important;}
.page-category #category_top_contents_frame h2.design-headline { color: #FFF;}
.page-category #category_top_contents_frame .block-category-freespace1 { max-width: 100% !important; width: 100% !important; padding: 0 !important; margin: 0 !important;}
.page-category #category_top_contents_frame .block-category-list--sub { margin-bottom: 0 !important; background: #303068;}
.page-category #category_top_contents_frame .block-category-list--sub .design-block-title { margin: 0 0 30px;}
.page-category #category_top_contents_frame .block-category-list--sub .design-block-title .ttl { color: #FFF;}
.page-category #category_top_contents_frame .block-category-list--sub .design-block-title .eng { color: #707070;}

/* ----------------------------------
 GoodsDetail
---------------------------------- */
/* 購入グループマスタ 商品詳細コメント */
body.page-goods.goods-rules-fixed #block_goods_rules_frame { top: var(--category-header-height);}
body.page-goods.goods-rules-fixed #header::before { height: var(--category-header-height);}

/* 左フレーム */
.page-goods .pane-goods-left-side .block-goods-main-gallery .swiper-button-prev,
.page-goods .pane-goods-left-side .block-goods-main-gallery .swiper-button-next { border-color: var(--button-bg1); background: var(--button-bg1);}
.page-goods .pane-goods-left-side .block-goods-main-gallery .swiper-button-prev:hover::after,
.page-goods .pane-goods-left-side .block-goods-main-gallery .swiper-button-next:hover::after { border-color: var(--button-bg1);}

/* 右フレーム */
.page-goods .pane-goods-right-side .block-goods-name--text { color: var(--color-base);}
.page-goods .pane-goods-right-side .block-add-cart-qty .spin { background-repeat: no-repeat; background-position: center; -webkit-background-size: 32px 32px; background-size: 32px 32px;}
.page-goods .pane-goods-right-side .block-add-cart-qty .spin.spinminus { background-image: url("../../img/sys/spinminus_yonezawa.png");}
.page-goods .pane-goods-right-side .block-add-cart-qty .spin.spinplus  { background-image: url("../../img/sys/spinplus_yonezawa.png");}
.page-goods .pane-goods-right-side .block-add-cart-button-frame .block-add-cart-qty .spin img { opacity: 0 !important;}

/* カートボタン */
.page-goods .pane-goods-right-side .block-add-cart-button-frame .block-add-cart--btn { color: #FFF;}
.page-goods .pane-goods-right-side .block-add-cart-button-frame .block-add-cart--btn::before { background-image: url("../../img/usr/common/ico_cart_w.png");}
.page-goods .pane-goods-right-side .block-add-cart-button-frame .block-custom-order--btn { color: #FFF;}

/* お気に入り・入荷通知 */
.page-goods .pane-goods-right-side .block-goods-arrival-notice--btn,
.page-goods .pane-goods-right-side .block-variation-arrival-notice--btn { border-color: var(--color-main); color: var(--color-main);}
.page-goods .pane-goods-right-side .block-goods-arrival-notice--btn,
.page-goods .pane-goods-right-side .block-variation-arrival-notice--btn { background-image: url(../../img/usr/common/ico_arrival_notice_yonezawa.png);}
.page-goods .pane-goods-right-side .block-goods-arrival-notice-registed--btn { background-image: url(../../img/usr/common/ico_arrival_notice_yonezawa2_on.png);}

.page-goods .pane-goods-right-side .block-goods-favorite--btn { border-color: var(--color-main); color: var(--color-main);}
.page-goods .pane-goods-right-side .block-goods-favorite--btn::before { background-image: var(--goods-bookmark-icon-blue);}
.page-goods .pane-goods-right-side .block-goods-favorite-registed--btn  { border-color: var(--color-sub); background-color: #FFF; color:var(--color-sub);}
.page-goods .pane-goods-right-side .block-goods-favorite-registed--btn::before { background-image: var(--goods-bookmark-icon-gold);}

/* バリエーション用ボタン */
.page-goods .pane-goods-right-side .block-variation-add-cart--btn { color: #FFF;}
.page-goods .pane-goods-right-side .block-variation-add-cart--btn::before { background-image: url("../../img/usr/common/ico_cart_w.png");}

.page-goods .pane-goods-right-side .block-variation-favorite .block-variation-favorite-registed--btn::before { background-image: var(--goods-bookmark-icon-gold);}
.page-goods .pane-goods-right-side .block-variation-favorite .block-variation-favorite-registed--btn:hover   { border-color: var(--button-bg3);}

/* 追従カート（js）*/
.page-goods #block_add_cart_fixed_frame { background: rgba(48,48,104,0.15);}
.page-goods #block_add_cart_fixed_frame .cart-btn-frame a { color: #FFF;}

/* タブコンテンツ */
.page-goods #goods_detail_contents_frame { background: #F4F4F8;}

/* 左フレーム */
.page-goods .pane-goods-left-side .block-goods-main-gallery .swiper-button-prev,
.page-goods .pane-goods-left-side .block-goods-main-gallery .swiper-button-next { border-color: var(--button-bg1); background: var(--button-bg1);}
.page-goods .lb-nav a.lb-prev::before,
.page-goods .lb-nav a.lb-next::before { border-color: var(--button-bg1); background: var(--button-bg1);}