@charset "Shift_JIS";
/* --------------------------------------------------------------------
「お歳暮」下部エリア　回遊ボタン（下層ページ・ブランド）
--------------------------------------------------------------------- */
/* --------------------------------------------------------------------
PC用 / .mainframe_
--------------------------------------------------------------------- */


/* おすすめ特集（#seibo_feature）
================================================== */
.mainframe_ #seibo_feature {
  margin-top: 60px;
}

.mainframe_ #seibo_feature > .bg {
  padding: 50px 20px;
  background: #FAF6F0;
}

.mainframe_ #seibo_feature ul.list {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 15px;
}

.mainframe_ #seibo_feature ul.list li {
  width: calc((100% - (15px * 3)) / 4);
}

.mainframe_ #seibo_feature ul.list li a {
  display: block;
}

.mainframe_ #seibo_feature ul.list li .img {
  width: 100%;
}

.mainframe_ #seibo_feature ul.list li .img img {
  width: 100%;
  height: auto;
}

.mainframe_ #seibo_feature ul.list li .txt {
  color: #000;
  font-size: 1.4rem;
  font-weight: bold;
  margin: 5px 0 0 0;
}

/* マウスオーバー */
.mainframe_ #seibo_feature ul.list li a:hover .txt {
  text-decoration: underline;
}


/* ナビメニュー（#navi_menu）
================================================== */
.mainframe_ .seibo #navi_menu {
  margin-top: 40px;
}

.mainframe_ .seibo #navi_menu ul {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  width: 100%;
  margin: 0 auto;
}

.mainframe_ .seibo #navi_menu ul li {
  width: calc((100% - (10px * 3)) / 4);
}

.mainframe_ .seibo #navi_menu ul li a {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-size: 1.5rem;
  font-weight: bold;
  line-height: 1.4;
  text-align: center;
  height: 70px;
  padding: 10px 0 15px 0;
  background: #534439;
  border: 1px solid #534439;
  border-radius: 3px;
  box-shadow: 0px 2px 3px 0px rgba(61, 61, 61, 0.15);
}

.mainframe_ .seibo #navi_menu ul li a span.txt_sub {
  font-size: 1.2rem;
  font-weight: normal;
  letter-spacing: normal;
}

.mainframe_ .seibo #navi_menu ul li a::after {
  content: '';
  position: absolute;
  bottom: 8px;
  width: 8px;
  height: 8px;
  border-right: solid 1px #fff;
  border-bottom: solid 1px #fff;
  transform: rotate(45deg);
}

/* マウスオーバー */
.mainframe_ .seibo #navi_menu ul li a:hover {
  opacity: 1;
  color: #000;
  background: #fff;
  border-color: #534439;
}
.mainframe_ .seibo #navi_menu ul li a:hover::after {
  border-color: #534439;
}


/* 回遊ボタン（#around_button_wrap）
================================================== */
/* フォントサイズ（デフォルト） */
.mainframe_ #around_button_wrap {
  font-size: 16px;
  line-height: 1.4;
}

.mainframe_ #around_button_wrap .ja_min {
  font-family: '游明朝', YuMincho, 'Hiragino Mincho ProN', 'Hiragino Mincho Pro', 'ＭＳ 明朝', serif;
  font-weight: 500; /* 機種による文字のかすれ防止 */
}

.mainframe_ #around_button_wrap {
  margin-bottom: 60px;
  margin-top: 60px; /* ジャンルページのpager無しの時に必要なmargin */
}

.mainframe_ #around_button_wrap {
  border-top: 2px solid #DFC39B;
  padding: 40px 0;
  background: #fdfbf4;
}
/* タイトル */
.mainframe_ .title_main {
  font-size: 2.4rem;
  text-align: center;
}


/* ボタン：すべての商品を見る（右矢印＞） */
.mainframe_ #around_button_wrap .btn_item_all {
  margin: 30px 0 0 0;
}

.mainframe_ #around_button_wrap .btn_item_all a {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  color: #fff;
  width: 400px;
  height: 60px;
  margin: 0 auto;
  background: #e67b29;
  border-radius: 60px;
  box-shadow: 0px 2px 3px 0px rgba(61, 61, 61, 0.15);
}

.mainframe_ #around_button_wrap .btn_item_all a::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 20px;
  width: 10px;
  height: 10px;
  border-right: solid 1px #fff;
  border-bottom: solid 1px #fff;
  transform: translateY(-50%) rotate(-45deg);
}

/* ボタン：トップへ戻る（右矢印＞） */
.mainframe_ #around_button_wrap .btn_pageback {
  margin: 20px 0 0 0;
}

.mainframe_ #around_button_wrap .btn_pageback a {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  color: #0a0a0a;
  width: 400px;
  height: 60px;
  margin: 0 auto;
  background: #fff;
  border: 1px solid #e67b29;
  border-radius: 60px;
  box-shadow: 0px 2px 3px 0px rgba(61, 61, 61, 0.15);
}

.mainframe_ #around_button_wrap .btn_pageback a::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 20px;
  width: 10px;
  height: 10px;
  border-right: solid 1px #0a0a0a;
  border-bottom: solid 1px #0a0a0a;
  transform: translateY(-50%) rotate(-45deg);
}

/* --------------------------------------------------------------------
SP用 / .wrapper_:not(:has(.mainframe_))
--------------------------------------------------------------------- */


/* おすすめ特集（#seibo_feature）
================================================== */
.wrapper_:not(:has(.mainframe_)) #seibo_feature > .bg {
  padding: 40px 3%;
  background: #FAF6F0;
}

.wrapper_:not(:has(.mainframe_)) #seibo_feature ul.list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.wrapper_:not(:has(.mainframe_)) #seibo_feature ul.list li {
  width: calc((100% - (10px * 1)) / 2);
}

.wrapper_:not(:has(.mainframe_)) #seibo_feature ul.list li a {
  display: block;
}

.wrapper_:not(:has(.mainframe_)) #seibo_feature ul.list li .img {
  width: 100%;
}

.wrapper_:not(:has(.mainframe_)) #seibo_feature ul.list li .img img {
  width: 100%;
  height: auto;
}

.wrapper_:not(:has(.mainframe_)) #seibo_feature ul.list li .txt {
  color: #000;
  font-size: 1.4rem;
  font-weight: bold;
  margin: 5px 0 0 0;
}

/* ナビメニュー（#navi_menu）
================================================== */
.wrapper_:not(:has(.mainframe_)) .seibo #navi_menu {
  margin-top: 20px;
}

.wrapper_:not(:has(.mainframe_)) .seibo #navi_menu ul {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  width: 100%;
  padding: 0 2%;
}

.wrapper_:not(:has(.mainframe_)) .seibo #navi_menu ul li {
  width: calc((100% / 2) - 2%);
  margin: 1%;
}

.wrapper_:not(:has(.mainframe_)) .seibo #navi_menu ul li a {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-size: 1.5rem;
  font-weight: bold;
  line-height: 1.2;
  text-align: center;
  height: 80px;
  padding: 10px 0 15px 0;
  background: #534439;
  border: 1px solid #534439;
  border-radius: 3px;
  box-shadow: 0px 2px 3px 0px rgba(61, 61, 61, 0.15);
}

.wrapper_:not(:has(.mainframe_)) .seibo #navi_menu ul li a span.txt_sub {
  font-size: 1.2rem;
  font-weight: normal;
  letter-spacing: normal;
}

.wrapper_:not(:has(.mainframe_)) .seibo #navi_menu ul li a::after {
  content: '';
  position: absolute;
  bottom: 8px;
  width: 8px;
  height: 8px;
  border-right: solid 1px #fff;
  border-bottom: solid 1px #fff;
  transform: rotate(45deg);
}

/* 回遊ボタン（#around_button_wrap）
================================================== */
/* フォントサイズ（デフォルト） */
.wrapper_:not(:has(.mainframe_)) #around_button_wrap {
  font-size: 1.4rem;
  line-height: 1.2;
}

.wrapper_:not(:has(.mainframe_)) #around_button_wrap .ja_min {
  font-family: '游明朝', YuMincho, 'Hiragino Mincho ProN', 'Hiragino Mincho Pro', 'ＭＳ 明朝', serif;
  font-weight: 500; /* 機種による文字のかすれ防止 */
}

.wrapper_:not(:has(.mainframe_)) #around_button_wrap {
  margin-bottom: 50px;
  margin-top: 50px; /* pager無しの時に必要なmargin */
}

.wrapper_:not(:has(.mainframe_)) #around_button_wrap {
  background: #fdfbf4;
  padding: 40px 3%;
}

.wrapper_:not(:has(.mainframe_)) #around_button_wrap .inner {
  width: 100%;
  max-width: 700px;
  padding: 40px 0;
  margin: 0 auto;
}

/* メインタイトル */
.wrapper_:not(:has(.mainframe_)) #around_button_wrap .title_main {
  display: flex;
  justify-content: center;
  color: #0a0a0a;
  font-size: 2.6rem;
  text-align: center;
}

.wrapper_:not(:has(.mainframe_)) #around_button_wrap .title_main::before,
.wrapper_:not(:has(.mainframe_)) #around_button_wrap .title_main::after {
  content: "";
  display: inline-block;
  width: 100%;
  height: 1px;
  margin: auto 0;
  background: #888;
}

.wrapper_:not(:has(.mainframe_)) #around_button_wrap .title_main span {
  display: block;
  width: 820%;
  max-width: 260px;
  margin: 0 3%;
}

/* ボタン：すべての商品を見る（右矢印＞） */
.wrapper_:not(:has(.mainframe_)) #around_button_wrap .btn_item_all {
  margin: 30px 0 0 0;
}

.wrapper_:not(:has(.mainframe_)) #around_button_wrap .btn_item_all a {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  color: #fff;
  font-size: 1.6rem;
  width: 100%;
  height: 80px;
  margin: 0 auto;
  background: #e67b29;
  border-radius: 60px;
  box-shadow: 0px 2px 3px 0px rgba(61, 61, 61, 0.15);
}

.wrapper_:not(:has(.mainframe_)) #around_button_wrap .btn_item_all a::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 20px;
  width: 10px;
  height: 10px;
  border-right: solid 1px #fff;
  border-bottom: solid 1px #fff;
  transform: translateY(-50%) rotate(-45deg);
}

/* ボタン：トップへ戻る（右矢印＞） */
.wrapper_:not(:has(.mainframe_)) #around_button_wrap .btn_pageback {
  margin: 20px 0 0 0;
}

.wrapper_:not(:has(.mainframe_)) #around_button_wrap .btn_pageback a {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  color: #0a0a0a;
  font-size: 1.6rem;
  width: 100%;
  height: 80px;
  margin: 0 auto;
  background: #fff;
  border: 1px solid #e67b29;
  border-radius: 60px;
  box-shadow: 0px 2px 3px 0px rgba(61, 61, 61, 0.15);
}

.wrapper_:not(:has(.mainframe_)) #around_button_wrap .btn_pageback a::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 20px;
  width: 10px;
  height: 10px;
  border-right: solid 1px #0a0a0a;
  border-bottom: solid 1px #0a0a0a;
  transform: translateY(-50%) rotate(-45deg);
}