@charset "UTF-8";

#header {
	position: relative;
}
#header::before {
	content: " ";
	display: block;
	width: 100vw;
	height: 102px;
	background-color: #fff;
	position: absolute;
	top: 0;
	left: 50%;
	z-index: -1;
	margin-left: -50vw;
}

#contentsMainInner {
	margin-right: 0;
}

#contentsTopWrapper {
	width: 100vw;
	position: relative;
	left: 50%;
	right: 50%;
	margin-left: -50vw;
	margin-right: -50vw;
}

#mothersday {
	margin-bottom: 80px;
	color: #555;
}
#mothersday a {
	color: #777777;
}
#mothersday .c-inner {
	width: 1200px;
	margin: 0 auto;
}

#mothersday .main_tit {
	margin-bottom: 30px;
}
#mothersday .main_tit img {
	width: 100%;
	height: auto;
}

#mothersday .top_area {
    margin: 50px auto 50px;
}

#mothersday .top_area h2 {
    margin-bottom: 22px;
    font-size: 24px;
    font-weight: bold;
    color: #000;
    line-height: 1.5;
    text-align: center;
}

#mothersday .top_area .lead_text {
    font-size: 14px;
    line-height: 2;
    color: #000;
    text-align: center;
}

#mothersday .anchor {
	margin-left: 0;
	margin-bottom: 28px;
}
#mothersday .anchor ul {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
#mothersday .anchor li {
	width: 23%;
	float: left;
	font-size: 14px;
	font-weight: bold;
}
#mothersday .anchor li a {
	display: block;
	padding: 12px 0;
	border: 1px solid #313131;
	text-align: center;
	color: #313131;
	text-decoration: none;
}
#mothersday .anchor li a:hover {
	background-color: #000;
	color: #fff;
}
#mothersday .anchor .sub li {
	width: 18%;
}
#mothersday .anchor .sub li.cur a {
	background-color: #000;
	color: #fff;
}
#mothersday .lead {
	padding: 0 20px;
	margin-bottom: 20px;
	font-size: 14px;
	line-height: 2;
	text-align: center;
	color: #000;
}
#mothersday .date {
	padding: 0 20px;
	margin-bottom: 40px;
	font-size: 12px;
	text-align: right;
}

#mothersday .anchor02 {
	margin-bottom: 25px;
}
#mothersday .anchor02 dl {
	padding: 10px 10px 10px 30px;
	overflow: hidden;
	color: #313131;
	line-height: 1.5;
}
#mothersday .anchor02_category {
	background-color: #f9f9f9;
}
#mothersday .anchor02_price {
	background-color: #ececec;
}
#mothersday .anchor02 dt {
	/*padding: 10px 0 10px 35px;*/
	padding: 10px 0 10px 10px;
	width: 180px;
	font-size: 14px;
	font-weight: bold;
	float: left;
}
/*
#mothersday .anchor02_category dt {
	background: url(/images/special/mothers_day/ico_item.png) 0 6px no-repeat;
}
#mothersday .anchor02_price dt {
	background: url(/images/special/mothers_day/ico_price.png) 0 6px no-repeat;
}
*/
#mothersday .anchor02 dd {
	margin-left: 215px;
	padding: 10px 10px 10px 45px;
	background-color: #fff;
	font-size: 13px;
	color: #000000;
}
#mothersday .anchor02 dd a {
	color: #000000;
	padding-left: 12px;
	background: url(/images/special/mothers_day/arrow.png) 0 center no-repeat;
}
#mothersday .anchor02 dd ul {
	overflow: hidden;
}
#mothersday .anchor02 dd li {
	padding-right: 10px;
	float: left;
	width: 20%;
	float: left;
	box-sizing: border-box;
}


#mothersday .sub-title {
	margin-bottom: 40px;
	font-size: 24px;
	font-weight: 600;
	text-align: center;
	line-height: 1.2;
	color: #000;
	letter-spacing: 0.01em;
}
#mothersday .sub-title.vol02 {
	font-size: 20px;
}

/* ---------------------------------------------------------
■GIFT SET
--------------------------------------------------------- */

#mothersday .mothersday-section {
	display: flex;
	align-items: center;
	background: #ab2329;
	padding: 40px 60px;
	max-width: 900px;
	margin: 40px auto;
	border-radius: 12px;
	box-sizing: border-box;
  }
  #mothersday .mothersday-image img {
	width: 320px;
	height: auto;
	border-radius: 8px;
	box-shadow: 0 4px 16px rgba(0,0,0,0.08);
	display: block;
  }
  #mothersday .mothersday-image {
	flex: 0 0 340px;
	margin-right: 48px;
  }
  #mothersday .mothersday-text {
	flex: 1;
	color: #fff;
  }
  #mothersday .mothersday-text h3 {
	font-size: 1.6rem;
	margin-bottom: 18px;
	font-weight: bold;
	letter-spacing: 0.05em;
  }
  #mothersday .mothersday-text p {
	font-size: 1.1rem;
	line-height: 1.8;
	margin-bottom: 32px;
  }
  #mothersday .mothersday-btn {
	display: inline-block;
	padding: 12px 36px;
	font-size: 1rem;
	color: #ab2329;
	background: #fff;
	border: 1px solid #ab2329;
	border-radius: 24px;
	text-decoration: none;
	transition: background 0.2s, color 0.2s;
	font-weight: bold;
  }

  #mothersday .mothersday-btn:hover {
	background: #000;
	color: #fff;
  }

/* ---------------------------------------------------------
■CATEGORY
--------------------------------------------------------- */
#mothersday .top-category {
	margin: 50px 0 140px;
}
#mothersday .top-category ul {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
#mothersday .top-category ul li {
	width: 21.6%;
	text-align: center;
	font-size: 14px;
}
#mothersday .top-category ul li a {
	display: block;
	text-decoration: none;
	color: #000;
}
#mothersday .top-category ul li img {
	max-width: 100%;
	height: auto;
}
#mothersday .top-category ul li figure {
	margin: 0;
}
#mothersday .top-category ul li p {
	margin-top: 15px;
}

/* ---------------------------------------------------------
■CATEGORY
--------------------------------------------------------- */
#mothersday .top-ideas {
	margin: 50px 0 140px;
}
#mothersday .top-ideas ul {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
#mothersday .top-ideas ul li {
	width: 32%;
	font-size: 14px;
}
#mothersday .top-ideas ul li a {
	display: block;
	padding: 13px;
	text-decoration: none;
	color: #000;
	background-color: #f8f8f8;
}
#mothersday .top-ideas ul li img {
	max-width: 100%;
	height: auto;
}
#mothersday .top-ideas ul li figure {
	margin: 0;
}
#mothersday .top-ideas ul li p {
	padding: 15px 0 2px;
	line-height: 2;
}

/* ---------------------------------------------------------
■ランキング
--------------------------------------------------------- */

#mothersday .ranking {
	padding: 0 40px 20px 40px;
}
#mothersday .ranking h3 {
	text-align: center;
}
#mothersday .rank-anchor {
	padding: 0 80px;
	margin: 0 -5px;
	margin-bottom: 40px;
}
#mothersday .rank-anchor li {
	width: 33%;
	float: left;
}
#mothersday .rank-anchor li a {
	display: block;
	margin: 0 5px;
	padding: 20px 20px;
	text-align: center;
	border: 1px solid #313131;
	color: #333;
	font-size: 14px;
	font-weight: bold;
}
#mothersday .rank-anchor li a:hover {
	border: 1px solid #f7eedf;
	background-color: #f7eedf;
	text-decoration: none;
}
#mothersday .rank-anchor li a span {
	display: inline-block;
	padding: 0 20px;
	position: relative;
}
#mothersday .rank-anchor li a span:after {
	content: " ";
	width: 0;
	height: 0;
	border: 6px solid transparent;
	border-top: 8px solid #333;
	position: absolute;
	top: 50%;
	right: -10px;
	margin-top: -6px;
}
#mothersday .ranking .cateBox {
	position: relative;
	min-height: 1033px;
	font-size: 13px;
}
#mothersday .ranking .cate06 {
	margin-bottom: 0;
}
#mothersday .ranking .tit-area {
	padding: 0 0 14px;
	margin-bottom: 40px;
	border-bottom: 1px solid #808080;
	position: relative;
	width: 1120px;
	overflow: hidden;
}
#mothersday .ranking .tit-area h4 {
	padding-bottom: 10px;
	font-size: 24px;
	font-weight: bold;
	color: #000;
	line-height: 1.3;
}
#mothersday .ranking .tit-area .btn {
	/*
	position: absolute;
	bottom: 12px;
	right: 0;
	*/
	font-size: 14px;
	float: right;
	margin-left: 20px;
}
#mothersday .ranking .tit-area .btn a {
	display: inline-block;
	padding: 15px 30px 15px 47px;
	color: #000000;
	border: 1px solid #000000;
	text-decoration: none;
	background-color: #fff;
	position: relative;
	box-sizing: border-box;
}
#mothersday .ranking .tit-area .btn a:after {
	content: ' ';
	width: 0;
	height: 0;
	border: 6px solid transparent;
	border-left: 6px solid #000000;
	position: absolute;
	top: 50%;
	left: 24px;
	margin-top: -6px;
}
#mothersday .ranking .tit-area .btn a:hover {
	background-color: #000000;
	color: #fff;
}
#mothersday .ranking .tit-area .btn a:hover:after {
	border-left: 6px solid #fff;
}
#mothersday .ranking .tit-area .c-lead {
	/*padding-right: 250px;*/
	font-size: 13px;
	line-height: 1.6;
	color: #222222;
}
#mothersday .ranking .item-area {
	position: relative;
}
#mothersday .ranking .cateBox .img img {
	max-width: 100%;
}
#mothersday .ranking .cateBox .rank1 .img {
	width: 320px;
}
#mothersday .ranking .cateBox .rank2 .img,
#mothersday .ranking .cateBox .rank3 .img {
	width: 320px;
}
#mothersday .ranking .cateBox .rank4 .img,
#mothersday .ranking .cateBox .rank5 .img,
#mothersday .ranking .cateBox .rank6 .img,
#mothersday .ranking .cateBox .rank7 .img {
	width: 270px;
}
#mothersday .ranking .cateBox .rank1 .img { position: absolute; top:23px; left:50px; }
#mothersday .ranking .cateBox .rank1 .icon { position: absolute; top:358px; left:78px; }
#mothersday .ranking .cateBox .rank1 .name { position: absolute; top:358px; left:140px; }
#mothersday .ranking .cateBox .rank2 .img { position: absolute; top:23px; left:420px; }
#mothersday .ranking .cateBox .rank2 .icon { position: absolute; top:358px; left:460px; }
#mothersday .ranking .cateBox .rank2 .name { position: absolute; top:353px; left:513px; width:250px ;}
#mothersday .ranking .cateBox .rank3 .img { position: absolute; top:23px; left:773px; }
#mothersday .ranking .cateBox .rank3 .icon { position: absolute; top:358px; left:851px; }
#mothersday .ranking .cateBox .rank3 .name { position: absolute; top:353px; left:904px; width:250px }
#mothersday .ranking .cateBox .rank4 .img { position: absolute; top:463px; left:0; }
#mothersday .ranking .cateBox .rank4 .icon { position: absolute; top:746px; left:20px; }
#mothersday .ranking .cateBox .rank4 .name { position: absolute; top:743px; left:70px; width:210px }
#mothersday .ranking .cateBox .rank5 .img { position: absolute; top:463px; left:280px; }
#mothersday .ranking .cateBox .rank5 .icon { position: absolute; top:746px; left:300px; }
#mothersday .ranking .cateBox .rank5 .name { position: absolute; top:743px; left:346px; width:210px }
#mothersday .ranking .cateBox .rank6 .img { position: absolute; top:463px; left:560px; }
#mothersday .ranking .cateBox .rank6 .icon { position: absolute; top:746px; left:580px; }
#mothersday .ranking .cateBox .rank6 .name { position: absolute; top:743px; left:626px; width:210px }
#mothersday .ranking .cateBox .rank7 .img { position: absolute; top:463px; left:840px; }
#mothersday .ranking .cateBox .rank7 .icon { position: absolute; top:746px; left:860px; }
#mothersday .ranking .cateBox .rank7 .name { position: absolute; top:743px; left:907px; width:210px }
#mothersday .ranking .cateBox .name span {
	font-size: 11px;
}
#mothersday .ranking .fee {
    background-image: url("/images/special/mothers_day/bg_grid_line.png");
    background-position: 0 6px;
    background-repeat: no-repeat;
    font-weight: bold;
    padding-top: 15px;
}

#mothersday .ranking .rank1 a:hover .img img,
#mothersday .ranking .rank1 a:hover .img img {
	opacity: 0.8;
	filter: alpha(opacity=0.8);
	-ms-filter: "alpha(opacity=80)";
}
#mothersday .ranking .rank1 a:hover .name,
#mothersday .ranking .rank-sub a:hover .name {
	text-decoration: underline
}


/* ---------------------------------------------------------
■ラッピング
--------------------------------------------------------- */
#mothersday .wrapping {
	padding: 130px 40px 40px;
	margin-bottom: 60px;
	position: relative;
	font-size: 14px;
	line-height: 1.5;
	background: #953441;
}
#mothersday .wrapping .fs12 {
	font-size: 12px;
}
#mothersday .wrapping .mb20 {
	margin-bottom: 20px;
}
#mothersday .wrapping h3 {
	padding-top: 25px;
	font-size: 32px;
	text-align: center;
	font-weight: bold;
	color: #fff;
	position: absolute;
	top: 45px;
	left: 250px;
	width: 700px;
	background: url(/images/special/mothers_day/wrapping_tit.png) no-repeat top center ;
}
#mothersday .wrapping .m-text {
	margin-bottom: 15px;
	text-align: center;
	color: #fff;
	font-size: 14px;
	line-height: 1.75;
}
#mothersday .wrapping .box {
	padding: 30px;
	background-color: #fff;
}
#mothersday .wrapping .list01 {
	padding-bottom: 35px;
	border-bottom: 1px solid #ccc;
	margin-bottom: 30px;
}
#mothersday .wrapping .tit-area {
	padding-left: 44px;
	margin-bottom: 15px;
	background: url(/images/special/mothers_day/wrapping_icon01.png) 0 0 no-repeat;
	min-height: 44px;
}
#mothersday .wrapping .list02 {
	margin-bottom: 30px;
}
#mothersday .wrapping .list02 .tit-area {
	background-image: url(/images/special/mothers_day/wrapping_icon02.png);
}
#mothersday .wrapping .tit-area h4 {
	padding-top: 3px;
	font-size: 20px;
	line-height: 1.5;
	color: #555;
	font-weight: bold;
}
#mothersday .wrapping .tit-area h4 span {
	display: block;
	font-size: 12px;
}
#mothersday .wrapping .img01 {
	margin-bottom: 20px;
}
#mothersday .wrapping .how {
	overflow: hidden;
	_zoom: 1;
}
#mothersday .wrapping .how li {
	width: 250px;
	float: left;
	margin-right: 20px;
	text-align: center;
}
#mothersday .wrapping .how li.last {
	margin-right: 0;
}
#mothersday .wrapping .how li p {
	padding-top: 10px;
	font-size: 12px;
	color: #555;
}
#mothersday .wrapping .message {
	border: 1px solid #b0a096;
	padding: 20px;
}
#mothersday .wrapping .message .img02 {
	float: left;
}
#mothersday .wrapping .message .txt-area {
	padding-top: 15px;
	margin-left: 310px;
	font-size: 14px;
}
#mothersday .wrapping .message .txt-area .tit {
	margin-bottom: 22px;
	font-size: 16px;
	font-weight: bold;
	color: #d62a28;
}




/* ---------------------------------------------------------
■一覧
--------------------------------------------------------- */

#mothersday .sub-list .section {
	padding: 20px 0 40px 0;
	margin: 40px 0 90px;
	position: relative;
}
#mothersday .sub-list .tit-area {
	margin-bottom: 40px;
	padding-bottom: 15px;
	border-bottom: 1px solid #808080;
}
#mothersday .sub-list .tit-area.price {
	padding-bottom: 0;
	border-bottom: 0;
}
#mothersday .sub-list .tit-area h3 {
	margin-bottom: 12px;
	font-size: 24px;
	font-weight: bold;
	color: #000;
}
#mothersday .sub-list .tit-area.price h3 {
	margin: 0 -28px 15px;
	padding: 8px 28px 8px 65px;
	background: url(/images/special/mothers_day/ico_price02.png) 32px center no-repeat #ececec;
}
#mothersday .sub-list .tit-area .lead {
	padding: 0;
	margin: 0;
	font-size: 13px;
	line-height: 1.7;
	text-align: left;
}
#mothersday .sub-list ul {
	padding-left: 60px;
	overflow: hidden;
}
#mothersday .sub-list ul li {
	width: 350px;
	margin: 30px 30px 0 0;
	float: left;
	box-sizing: border-box;
	padding: 0 20px;
}
#mothersday .sub-list ul li a {
	display: block;
	color: #555;
}
#mothersday .sub-list ul li a:hover {
	text-decoration: none;
	color: #818181;
}
#mothersday .sub-list ul li .img {
	margin-bottom: 15px;
}
#mothersday .sub-list ul li .img img {
	max-width: 100%;
}
#mothersday .sub-list ul li .name {
	padding-bottom: 14px;
	font-size: 13px;
	line-height: 1.5;
	position: relative;
}
#mothersday .sub-list ul li .name:after {
	content: ' ';
	width: 8px;
	height: 1px;
	line-height: 1px;
	background-color: #555;
	position: absolute;
	bottom: 8px;
	left: 0;
}
#mothersday .sub-list ul li .fee {
	font-size: 13px;
	font-weight: bold;
}
#mothersday .sub-list ul li .fee span {
	font-size: 11px;
	font-weight: normal;
	vertical-align: baseline;
}
#mothersday .sub-list ul li:nth-child(1),
#mothersday .sub-list ul li:nth-child(2),
#mothersday .sub-list ul li:nth-child(3) {
	margin-top: 0;
	width: 340px;
}
#mothersday .sub-list ul li:nth-child(4) {
	clear: both;
}
#mothersday .sub-list ul li.clear-first {
	clear: both;
}
#mothersday .sub-list ul li.type-2column {
	width: 540px;
	position: relative;
}
#mothersday .sub-list ul li.type-2column .text-area {
	width: 170px;
	position: absolute;
	top: 50%;
	left: 370px;
	transform: translate(0,-50%);
}
#mothersday .sub-list ul li.type-2column .img {
	width: 310px;
}
#mothersday .sub-list ul li.type-3column .img {
	width: 280px;
	margin: 0 auto 10px;
}
#mothersday .sub-list ul li.type-4column {
	width: 240px;
}
#mothersday .sub-list ul li.type-5column {
	margin-right: 10px;
	width: 210px;
}



#mothersday .archive_column {
	margin-top: -50px;
	border-top: 1px solid #dcdcdc;
	padding-top: 43px;
	margin-bottom: 75px;
}
#mothersday .archive_column ul {
	overflow: hidden;
}
#mothersday .archive_column li {
	margin-right: 1%;
	margin-bottom: 15px;
	width: 15.833333%;
	float: left;
}
#mothersday .archive_column li:nth-child(6n) {
	margin-right: 0;
}
#mothersday .archive_column li:nth-child(6n+1) {
	clear: both;
}
#mothersday .archive_column li p {
	padding-top: 8px;
	font-size: 11px;
	line-height: 1.5;
}
#mothersday .archive_column li a {
	display: block;
}
#mothersday .archive_column li a:hover {
	text-decoration: none;
}
#mothersday .archive_column li img {
	width: 100%;
}

/* ---------------------------------------------------------
■商品履歴
--------------------------------------------------------- */
#historyWrapper {
	clear: both;
	padding: 0 0 55px; }

#history .gridInner {
	overflow: hidden;
	height: 111px;
	margin-right: -10px;
	zoom: 1; }

/* ========================================
   メインビジュアル調整（モダンフルワイド対応）
   - 最大幅 1920px で超ワイドモニターに対応
   - 最大高さ 600px で縦長になりすぎを防止
   ======================================== */
#mothersday .main_tit {
  max-width: 1920px;
  margin: 0 auto;
  overflow: hidden;
}
#mothersday .main_tit img {
  width: 100%;
  height: auto;
  max-height: 600px;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* ========================================
   sticky ヘッダー幅問題対策
   base.js が #header の width を #contents の幅に合わせて固定するため、
   コンテンツ幅が100%のLPでは、スクロール時のposition:fixedヘッダーが
   ビューポート幅を超える問題が発生する。
   ZUTTO標準の1200px中央寄せで固定する。
   ======================================== */
#header {
  max-width: 100% !important;
}
#header.scrollNav {
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 1200px !important;
  max-width: 100% !important;
}

/* メインビジュアル下の余白調整
   モダンフルワイド版の margin: 0 auto により既存の margin-bottom が消えるため、
   別ルールで復元する */
#mothersday .main_tit {
  margin-bottom: 40px !important;
}

/* 「最近見たアイテム」エリアの中央寄せ
   #contentsTopWrapper が width: 100vw でビューポート全幅化されるため、
   #historyWrapper 自身に max-width と margin: auto を設定して中央寄せする */
#historyWrapper {
  max-width: 1200px;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 16px;
  padding-right: 16px;
  box-sizing: border-box;
}

/* ========================================
   SP対応（スマートフォン用レスポンシブCSS）
   2025年SPデザインを今年のビュー構造に移植
   ブレイクポイント: 768px以下
   ======================================== */
@media (max-width: 768px) {

  /* ==========================================================
     ZUTTO共通CSS干渉対策
     common.css #content img { width:100% }
     base.css .clearfix { overflow:hidden }
     を確実に上書きする
     ========================================================== */
  #wrapper {
    min-width: 0 !important;
    max-width: 100% !important;
    padding: 0 !important;
  }
  #contents {
    padding: 0 !important;
    margin: 0 !important;
  }
  #pankuzu {
    display: none !important;
  }
  #contentsTopWrapper {
    width: 100% !important;
    padding: 0 !important;
    left: auto !important;
    right: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  #mothersday img {
    max-width: 100% !important;
    height: auto !important;
  }

  /* ==========================================================
     ルート・メインコンテナ
     去年: #mothersday-content { padding-bottom:20px }
     ========================================================== */
  #mothersday {
    margin-bottom: 16px !important;
    padding-bottom: 20px !important;
  }
  #mothersday .c-inner {
    width: 100% !important;
    padding: 0 10px !important;
    box-sizing: border-box !important;
  }

  /* ==========================================================
     メインビジュアル
     去年: .mainTit { margin:0 -10px 20px; border-bottom:1px solid #ccc }
     ========================================================== */
  #mothersday .main_tit {
    margin: 0 -10px 20px !important;
    border-bottom: 1px solid #ccc !important;
  }
  #mothersday .main_tit img {
    max-width: 100% !important;
    height: auto !important;
  }

  /* ==========================================================
     トップエリア（タイトル・リード文）
     去年: .top_area { margin:0 -10px 15px; text-align:center }
     ========================================================== */
  #mothersday .top_area {
    margin: 0 -10px 15px !important;
    text-align: center !important;
  }
  #mothersday .top_area h2 {
    margin-bottom: 8px !important;
    font-size: 18px !important;
    font-weight: bold !important;
  }
  #mothersday .top_area .lead,
  #mothersday .top_area .lead_text {
    font-size: 13px !important;
    text-align: center !important;
  }

  /* ==========================================================
     共通: サブタイトル
     去年: .sub-title { margin-bottom:25px; font-size:18px }
     ========================================================== */
  #mothersday .sub-title {
    margin-bottom: 25px !important;
    font-size: 18px !important;
    font-weight: bold !important;
    text-align: center !important;
  }
  #mothersday .sub-title.vol02 {
    font-size: 14px !important;
  }
  #mothersday .lead {
    padding: 0 8px !important;
    font-size: 13px !important;
    line-height: 1.8 !important;
  }

  /* ==========================================================
     カテゴリナビ（top-category）⭐ 同一構造
     去年: .top-category ul { padding:0 10px; display:flex;
           justify-content:space-between; flex-wrap:wrap }
           .top-category ul li { width:47.5%; margin-bottom:15px }
     ========================================================== */
  #mothersday .top-category {
    margin: 40px 0 40px !important;
  }
  #mothersday .top-category ul {
    padding: 0 10px !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
    flex-wrap: wrap !important;
  }
  #mothersday .top-category ul li {
    margin-bottom: 15px !important;
    width: 47.5% !important;
    text-align: center !important;
    float: none !important;
    box-sizing: border-box !important;
  }
  #mothersday .top-category ul li a {
    display: block !important;
    text-decoration: none !important;
  }
  #mothersday .top-category ul li figure {
    margin: 0 !important;
  }
  #mothersday .top-category ul li figure img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
  }
  #mothersday .top-category ul li p {
    margin-top: 10px !important;
  }

  /* ==========================================================
     メインカテゴリナビ（横スクロール式タブ）
     ========================================================== */
  #mothersday .anchor {
    margin: 20px -10px 8px !important;
    padding: 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    border: none !important;
    background: none !important;
    position: relative !important;
    scrollbar-width: none !important;
  }
  #mothersday .anchor::-webkit-scrollbar {
    display: none !important;
  }
  #mothersday .anchor::after {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    width: 30px !important;
    height: 100% !important;
    background: linear-gradient(to right, transparent, rgba(255,255,255,0.95)) !important;
    pointer-events: none !important;
  }
  #mothersday .anchor ul,
  #mothersday .anchor ul.sub {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 0 !important;
    width: max-content !important;
    padding: 0 16px !important;
    margin: 0 !important;
    border: none !important;
    background: none !important;
    list-style: none !important;
    overflow: visible !important;
  }
  #mothersday .anchor li,
  #mothersday .anchor ul.sub li {
    width: auto !important;
    flex-shrink: 0 !important;
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    float: none !important;
    list-style: none !important;
    font-size: 13px !important;
    box-sizing: border-box !important;
  }
  #mothersday .anchor li a,
  #mothersday .anchor ul.sub li a {
    display: block !important;
    padding: 12px 16px !important;
    font-size: 13px !important;
    color: #666 !important;
    border-bottom: 2px solid transparent !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    white-space: nowrap !important;
    text-decoration: none !important;
    background: transparent !important;
    text-align: center !important;
    font-weight: normal !important;
    transition: all 0.2s ease !important;
  }
  #mothersday .anchor li.cur a,
  #mothersday .anchor ul.sub li.cur a {
    color: #000 !important;
    font-weight: bold !important;
    border-bottom-color: #000 !important;
  }
  #mothersday .anchor li a:active {
    color: #000 !important;
    background: rgba(0,0,0,0.03) !important;
  }

  /* ==========================================================
     カテゴリ内アンカーナビ（チップ型ボタン）
     ========================================================== */
  #mothersday .anchor02 {
    margin: 24px 0 !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
  }
  #mothersday .anchor02 dl,
  #mothersday .anchor02 .anchor02_category,
  #mothersday .anchor02 .anchor02_price {
    margin: 0 0 20px !important;
    padding: 0 !important;
    overflow: visible !important;
    border: none !important;
    background: none !important;
  }
  #mothersday .anchor02 dl:last-child {
    margin-bottom: 0 !important;
  }
  #mothersday .anchor02 dt {
    width: 100% !important;
    float: none !important;
    margin: 0 0 12px !important;
    padding: 0 0 6px !important;
    font-size: 13px !important;
    font-weight: bold !important;
    color: #333 !important;
    border-bottom: 1px solid #e0e0e0 !important;
    background: none !important;
    text-align: left !important;
  }
  #mothersday .anchor02 dd {
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
  }
  #mothersday .anchor02 dd ul {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    border: none !important;
    background: none !important;
    overflow: visible !important;
  }
  #mothersday .anchor02 dd li {
    width: auto !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
    list-style: none !important;
    float: none !important;
    box-sizing: border-box !important;
  }
  #mothersday .anchor02 dd li::before,
  #mothersday .anchor02 dd li::after {
    content: '' !important;
    display: none !important;
  }
  #mothersday .anchor02 dd li a {
    display: inline-block !important;
    padding: 8px 16px !important;
    font-size: 13px !important;
    color: #333 !important;
    text-decoration: none !important;
    border: 1px solid #ccc !important;
    border-radius: 999px !important;
    background: #fff !important;
    white-space: nowrap !important;
    transition: all 0.15s ease !important;
  }
  #mothersday .anchor02 dd li a::before {
    content: '' !important;
    display: none !important;
  }
  #mothersday .anchor02 dd li a:active {
    background: #f5f5f5 !important;
    border-color: #999 !important;
    color: #000 !important;
  }

  /* ==========================================================
     ランキング商品（2列グリッド）
     今年固有: .ranking > .cateBox > .item-area > div.rank1〜7
     去年のデザイン値（フォントサイズ・余白）を参考に調整
     ========================================================== */
  #mothersday .ranking {
    margin: 0 -10px 0 !important;
    padding: 0 10px 40px !important;
    overflow: visible !important;
  }
  #mothersday .ranking .cateBox {
    height: auto !important;
    overflow: visible !important;
    position: relative !important;
    margin-bottom: 20px !important;
    padding-bottom: 20px !important;
    border-bottom: 1px solid #d3d0b9 !important;
  }
  #mothersday .ranking .cateBox:last-of-type {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    border-bottom: 0 !important;
  }
  #mothersday .ranking .cateBox .tit-area {
    position: static !important;
    width: 100% !important;
    float: none !important;
    margin-bottom: 10px !important;
    border-bottom: none !important;
    border-top: none !important;
    background: none !important;
  }
  #mothersday .ranking .cateBox .tit-area h4 {
    margin-bottom: 5px !important;
    font-size: 14px !important;
  }
  #mothersday .ranking .cateBox .tit-area .btn {
    margin-bottom: 8px !important;
    padding: 0 !important;
    background: none !important;
  }
  #mothersday .ranking .cateBox .tit-area .btn a {
    display: block !important;
    padding: 10px 15px !important;
    text-align: center !important;
    color: #000 !important;
    text-decoration: none !important;
    font-size: 12px !important;
    border: 1px solid #000 !important;
    background: #fff !important;
    background-image: none !important;
  }
  #mothersday .ranking .cateBox .tit-area .btn a::before,
  #mothersday .ranking .cateBox .tit-area .btn a::after {
    content: '' !important;
    display: none !important;
    background: none !important;
  }
  #mothersday .ranking .cateBox .tit-area .c-lead {
    padding-bottom: 8px !important;
    border-bottom: 1px solid #000 !important;
    margin-bottom: 5px !important;
    line-height: 1.4 !important;
    font-size: 12px !important;
  }
  #mothersday .ranking .cateBox .item-area {
    position: static !important;
    height: auto !important;
    width: 100% !important;
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: space-between !important;
    gap: 0 !important;
    float: none !important;
    clear: both !important;
  }
  #mothersday .ranking .cateBox [class^="rank"] {
    position: static !important;
    width: 48% !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    float: none !important;
    box-sizing: border-box !important;
    margin-bottom: 12px !important;
  }
  #mothersday .ranking .cateBox [class^="rank"] .img {
    width: 100% !important;
    margin-bottom: 5px !important;
    overflow: hidden !important;
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    height: auto !important;
  }
  #mothersday .ranking .cateBox [class^="rank"] .icon {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    width: auto !important;
  }
  #mothersday .ranking .cateBox [class^="rank"] .img a {
    display: block !important;
    overflow: hidden !important;
  }
  #mothersday .ranking .cateBox [class^="rank"] .img img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
  }
  #mothersday .ranking .cateBox [class^="rank"] .name {
    position: static !important;
    width: 100% !important;
    top: auto !important;
    left: auto !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
    margin-top: 0 !important;
  }
  #mothersday .ranking .cateBox [class^="rank"] .fee {
    font-size: 12px !important;
    font-weight: bold !important;
    padding-top: 2px !important;
  }
  #mothersday .ranking .cateBox [class^="rank"] .fee span {
    font-weight: normal !important;
  }

  /* ==========================================================
     下階層: 商品リスト（sub-list）
     今年: .sub-list > .section > ul > li
     去年の .goods スタイルを参考に
     ========================================================== */
  #mothersday .sub-list {
    margin: 0 -10px 20px !important;
    padding: 0 10px !important;
  }
  #mothersday .sub-list .section {
    margin-bottom: 20px !important;
  }
  #mothersday .sub-list .tit-area {
    padding-bottom: 8px !important;
    margin-bottom: 15px !important;
    border-bottom: 1px solid #000 !important;
  }
  #mothersday .sub-list .tit-area h3 {
    margin-bottom: 5px !important;
    font-size: 14px !important;
  }
  #mothersday .sub-list .tit-area .lead {
    padding-bottom: 5px !important;
    border-bottom: 1px solid #ccc !important;
    margin-bottom: 5px !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
  }
  #mothersday .sub-list ul {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: space-between !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    gap: 0 !important;
  }
  #mothersday .sub-list ul li {
    width: 48% !important;
    margin: 0 0 12px 0 !important;
    padding: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
  }
  #mothersday .sub-list ul li a {
    display: block !important;
    text-decoration: none !important;
    color: #555 !important;
  }
  #mothersday .sub-list ul li .img {
    margin-bottom: 5px !important;
    padding: 0 !important;
    border: 0 !important;
  }
  #mothersday .sub-list ul li .img img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
  }
  #mothersday .sub-list ul li .name {
    font-size: 12px !important;
    line-height: 1.4 !important;
    padding-bottom: 4px !important;
  }
  #mothersday .sub-list ul li .fee {
    font-size: 12px !important;
    font-weight: bold !important;
    padding-top: 2px !important;
  }
  #mothersday .sub-list ul li .fee span {
    font-weight: normal !important;
  }

  /* ==========================================================
     ラッピング案内（PC版赤背景デザインを尊重しつつSP最適化）
     ========================================================== */
  #mothersday .wrapping {
    /* 赤背景はPC用 background を継承（打ち消さない） */
    padding: 40px 16px 30px !important;
    margin: 20px 0 !important;
    color: #fff !important;
    overflow-x: hidden !important;
    overflow-y: visible !important;
    min-height: 0 !important;
    height: auto !important;
    box-sizing: border-box !important;
    max-width: 100% !important;
  }
  #mothersday .wrapping h3 {
    /* PC用 absolute 配置を打ち消し */
    position: relative !important;
    top: auto !important;
    left: auto !important;
    /* 幅を画面幅に */
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    height: auto !important;
    /* 装飾画像「GIFT WRAPPING」を維持（去年の正解値: 208px幅） */
    background: url(/images/special/mothers_day/wrapping_tit.png) center 0 no-repeat !important;
    background-size: 208px auto !important;
    /* テキストスタイル（去年の値を踏襲） */
    padding-top: 16px !important;
    margin: 0 0 17px !important;
    text-indent: 0 !important;
    font-size: 18px !important;
    color: #fff !important;
    text-align: center !important;
    font-weight: bold !important;
    line-height: 1.4 !important;
  }
  #mothersday .wrapping .m-text {
    color: #fff !important;
    font-size: 13px !important;
    text-align: center !important;
    margin: 0 0 24px !important;
    line-height: 1.6 !important;
  }
  #mothersday .wrapping .box {
    padding: 20px 16px !important;
    background-color: #fff !important;
    color: #333 !important;
    border-radius: 0 !important;
    box-sizing: border-box !important;
    max-width: 100% !important;
  }
  #mothersday .wrapping .list01,
  #mothersday .wrapping .list02 {
    padding: 0 0 24px !important;
    margin-bottom: 24px !important;
    border-bottom: 1px solid #ccc !important;
    color: #333 !important;
  }
  #mothersday .wrapping .list01:last-child,
  #mothersday .wrapping .list02:last-child {
    border-bottom: none !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }
  /* tit-area: PC用アイコン画像(wrapping_icon01.png等)は維持 */
  #mothersday .wrapping .list01 .tit-area,
  #mothersday .wrapping .list02 .tit-area {
    padding-left: 50px !important;
    margin-bottom: 12px !important;
    min-height: 44px !important;
  }
  #mothersday .wrapping .tit-area h4 {
    padding-top: 4px !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
    color: #555 !important;
  }
  #mothersday .wrapping .tit-area h4 span {
    display: block !important;
    font-size: 12px !important;
    margin-bottom: 4px !important;
    font-weight: normal !important;
  }
  #mothersday .wrapping .list01 p,
  #mothersday .wrapping .list02 p {
    color: #333 !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
  }
  #mothersday .wrapping .red {
    color: #b71c2e !important;
  }
  #mothersday .wrapping .img01 {
    margin: 16px 0 !important;
    width: 100% !important;
  }
  #mothersday .wrapping .img01 img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    display: block !important;
  }
  #mothersday .wrapping .how {
    overflow: visible !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    padding: 0 !important;
    margin: 16px 0 0 !important;
  }
  #mothersday .wrapping .how li {
    width: calc(50% - 6px) !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    text-align: center !important;
    list-style: none !important;
  }
  #mothersday .wrapping .how li.last {
    margin: 0 !important;
  }
  #mothersday .wrapping .how li img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    display: block !important;
  }
  #mothersday .wrapping .how li p {
    padding-top: 6px !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
    color: #333 !important;
  }
  /* メッセージカードセクション（縦書き解消） */
  #mothersday .wrapping .message,
  #mothersday .wrapping .messege {
    display: block !important;
    flex-direction: unset !important;
    width: 100% !important;
    padding: 16px !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    margin-top: 16px !important;
  }
  #mothersday .wrapping .message::before,
  #mothersday .wrapping .message::after {
    content: '' !important;
    display: none !important;
  }
  #mothersday .wrapping .message > * {
    width: 100% !important;
    float: none !important;
    margin: 0 0 12px !important;
    box-sizing: border-box !important;
  }
  /* img02（メッセージカード画像：PC用float解除） */
  #mothersday .wrapping .message .img02,
  #mothersday .wrapping .message .img-area {
    float: none !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 12px !important;
  }
  #mothersday .wrapping .message .img02 img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    display: block !important;
  }
  /* txt-area（PC用 margin-left:310px を打ち消し） */
  #mothersday .wrapping .message .txt-area {
    margin-left: 0 !important;
    margin: 0 !important;
    padding: 12px 0 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    float: none !important;
    display: block !important;
    writing-mode: horizontal-tb !important;
    flex: none !important;
    flex-basis: auto !important;
    min-width: 0 !important;
  }
  #mothersday .wrapping .message .txt-area p,
  #mothersday .wrapping .message .txt-area * {
    width: auto !important;
    max-width: 100% !important;
    writing-mode: horizontal-tb !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
  }
  #mothersday .wrapping .message .txt-area .tit,
  #mothersday .wrapping .message .tit,
  #mothersday .wrapping .messege .tit {
    margin-bottom: 12px !important;
    font-size: 14px !important;
    color: #d62a28 !important;
    font-weight: bold !important;
    writing-mode: horizontal-tb !important;
    width: 100% !important;
  }
  #mothersday .wrapping .message img {
    max-width: 100% !important;
    height: auto !important;
  }

  /* ==========================================================
     閲覧履歴（snapList）横スクロール対応
     ZUTTO共通CSS（common.css）は #content（単数形）に対するスタイルだが、
     母の日LPは #contents（複数形）のため効かない。ここで再適用する。
     ========================================================== */
  #contents .history {
    margin: 30px 0 !important;
    padding: 0 !important;
  }
  #contents .history h2 {
    padding: 0 10px !important;
    margin-bottom: 12px !important;
    font-size: 14px !important;
    font-weight: bold !important;
  }
  #contents .snapList {
    margin: 0 -10px !important;
    clear: both !important;
    overflow: hidden !important;
  }
  #contents .snapList .wrap {
    width: 100% !important;
    overflow-x: scroll !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    -ms-scroll-chaining: chained !important;
    -webkit-transform: translateZ(0) !important;
  }
  #contents .snapList .wrap::-webkit-scrollbar {
    display: none !important;
    height: 0 !important;
  }
  #contents .snapList ul {
    padding-left: 10px !important;
    width: 2000px !important;
    overflow: hidden !important;
    margin: 0 !important;
    display: block !important;
    list-style: none !important;
    white-space: nowrap !important;
  }
  #contents .snapList li {
    position: relative !important;
    float: none !important;
    width: auto !important;
    display: inline-block !important;
    vertical-align: top !important;
    white-space: normal !important;
  }
  #contents .snapList li > a,
  #contents .snapList li > div {
    display: inline-block !important;
    margin-right: 15px !important;
    text-decoration: none !important;
    width: auto !important;
  }
  #contents .snapList li img {
    max-width: none !important;
    width: auto !important;
    height: auto !important;
  }
  #contents .snapList li.new:after {
    content: 'NEW' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    display: inline-block !important;
    font-size: 10px !important;
    font-weight: bold !important;
    line-height: 14px !important;
    padding: 0 3px !important;
    border: 1px dotted #cb1511 !important;
    color: #cb1511 !important;
  }

  /* ==========================================================
     閲覧履歴（develop_v3 の .grid > .gridInner 構造）横スクロール対応
     ========================================================== */
  #historyWrapper {
    margin: 16px 0 !important;
    padding: 0 !important;
  }
  #historyWrapper .contentsHead {
    padding: 0 10px !important;
    margin-bottom: 12px !important;
  }
  #historyWrapper .contentsHead h2,
  #historyWrapper .contentsHead .midashi18 {
    font-size: 14px !important;
    font-weight: bold !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  #historyWrapper .grid,
  #history.grid {
    margin: 0 -10px !important;
    padding: 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    width: auto !important;
    max-width: none !important;
  }
  #historyWrapper .grid::-webkit-scrollbar,
  #history.grid::-webkit-scrollbar {
    display: none !important;
    height: 0 !important;
  }
  #historyWrapper .gridInner,
  #history .gridInner {
    display: flex !important;
    flex-wrap: nowrap !important;
    width: max-content !important;
    padding: 0 10px !important;
    margin: 0 !important;
    list-style: none !important;
    white-space: nowrap !important;
  }
  #historyWrapper .gridInner li,
  #history .gridInner li {
    display: inline-block !important;
    flex-shrink: 0 !important;
    width: 120px !important;
    margin-right: 10px !important;
    padding: 0 !important;
    list-style: none !important;
    float: none !important;
    vertical-align: top !important;
    white-space: normal !important;
  }
  #historyWrapper .gridInner li:last-child,
  #history .gridInner li:last-child {
    margin-right: 0 !important;
  }
  #historyWrapper .gridInner li .lh0,
  #history .gridInner li .lh0 {
    width: 100% !important;
    line-height: 0 !important;
  }
  #historyWrapper .gridInner li a,
  #history .gridInner li a {
    display: block !important;
    width: 100% !important;
    text-decoration: none !important;
  }
  #historyWrapper .gridInner li img,
  #history .gridInner li img {
    width: 100% !important;
    max-width: 120px !important;
    height: auto !important;
    display: block !important;
  }

  /* === 閲覧履歴の prev/next ボタンをSPでは非表示 === */
  #historyfellowPrev,
  #historyfellowNext,
  #historyWrapper a.prev,
  #historyWrapper a.next {
    display: none !important;
  }
}