@charset "UTF-8";

a {
  color: var(--color-text);
}

.pane-header+.pane-globalnav+.block-faq,
.pane-header+.pane-globalnav+.block-guide,
.pane-header+.pane-globalnav+.block-privacy {
  padding-top: 112px;
}

/* fade image in after load */
.lazyload {
  opacity: 0;
}

.lazyloading {
  opacity: 1;
}

.lazyloaded {
  opacity: 1;
  transition: opacity 200ms;
}

/* よくあるご質問 */
.block-faq {
  padding: 0 20px;
  margin: 12px 0 40px;
}

.block-faq h1 {
  padding: 12px 0 0;
}

.block-faq-intro {
  margin: 0 0 40px;
}

.block-faq-intro--text {
  margin: 0 0 20px;
}

.block-faq-intro--nav li:not(:last-child) {
  margin: 0 0 8px;
}

.block-faq-intro--nav a {
  position: relative;
  display: block;
  border: 1px solid #dedede;
  border-radius: 3px;
  font-size: 15px;
  padding: 13px 15px;
}

.block-faq-intro--nav a:after {
  content: "";
  position: absolute;
  top: 17px;
  right: 15px;
  width: 10px;
  height: 10px;
  border-right: 1px solid #111;
  border-bottom: 1px solid #111;
  transform: rotate(45deg);
}

.block-faq h2 {
  padding: 0 0 5px;
}

.block-faq-section:not(:last-child) {
  margin: 0 0 40px;
}

.block-faq-section dl:not(:last-child) {
  margin: 0 0 4px;
}

.block-faq-section dt {
  position: relative;
  background: #eee;
  border-radius: 3px;
  padding: 13px 35px 13px 15px;
}

.block-faq-section dt:before,
.block-faq-section dt:after {
  content: "";
  position: absolute;
  top: 0;
  right: 15px;
  bottom: 0;
  margin: auto;
  width: 14px;
  height: 2px;
  background: #111;
  transition: 0.3s ease;
}

.block-faq-section dt:after {
  transform: rotate(90deg);
}

.block-faq-section dt.open:after {
  transform: rotate(180deg);
}

.block-faq-section dt span {
  position: relative;
  font-size: 14px;
  padding: 0 0 0 25px;
}

.block-faq-section dt span:before {
  content: "Q.";
  position: absolute;
  top: -5px;
  left: 0;
  font-size: 18px;
}

.block-faq-section dd {
  display: none;
  position: relative;
  margin: 16px 0 20px;
  padding: 0 0 0 40px;
  font-size: 13px;
}

.block-faq-section dd:before {
  content: "A.";
  position: absolute;
  top: -4px;
  left: 18px;
  font-size: 18px;
}

.block-faq-section dd p:not(:last-child) {
  margin: 0 0 20px;
}

.block-faq-section dd span {
  color: #d53100;
}

/* ご利用ガイド */
.block-guide {
  padding: 0 20px;
  margin: 12px 0 40px;
}

.block-guide h1 {
  padding: 12px 0 0;
}

.block-guide-intro {
  margin: 0 0 40px;
}

.block-guide-intro--text {
  margin: 0 0 20px;
}

.block-guide-intro--nav li:not(:last-child) {
  margin: 0 0 8px;
}

.block-guide-intro--nav a {
  position: relative;
  display: block;
  border: 1px solid #dedede;
  border-radius: 3px;
  font-size: 15px;
  padding: 13px 15px;
}

.block-guide-intro--nav a:after {
  content: "";
  position: absolute;
  top: 17px;
  right: 15px;
  width: 10px;
  height: 10px;
  border-right: 1px solid #111;
  border-bottom: 1px solid #111;
  transform: rotate(45deg);
}

.block-guide h2 {
  padding: 0 0 5px;
}

.block-guide-section:not(:last-child) {
  margin: 0 0 40px;
}

.block-guide-section--box:not(:last-child) {
  margin: 0 0 32px;
}

.block-guide-section--text {
  font-size: 13px;
  margin: 0 0 32px;
}

.block-guide-section--text a {
  text-decoration: underline;
}

.block-guide h3 {
  font-size: 16px;
  padding: 0 0 5px;
  margin: 0 0 15px;
}

.block-guide-section--text p:not(:last-child) {
  margin: 0 0 20px;
}

#payment .block-guide-section--box:nth-of-type(2) .block-guide-section--text p:nth-child(3) {
  margin: 0;
}

#payment .block-guide-section--box:nth-of-type(2) .block-guide-section--text ul {
  margin: 0 0 20px;
}

/* プライバシーポリシー */
.block-privacy {
  padding: 0 20px;
  margin: 12px 0 40px;
}

.block-privacy h1 {
  padding: 12px 0 0;
}

.block-privacy h2 {
  font-size: 16px;
  padding: 0 0 5px;
  margin: 0 0 15px;
  border-bottom: 1px solid #dedede;
}

.block-privacy-section:not(:last-child) {
  margin: 0 0 42px;
}

.block-privacy-section--text p {
  margin: 0 0 20px;
  font-size: 13px;
}

.block-privacy-section--text p:last-child {
  margin: 0;
}

/* ----ランディングページ---- */
/* common */
.pane-landingpage-contents {
  background: #fff;
}

.block-landingpage h2[class^="block-landingpage"] {
  margin: 20px 0 10px 0;
  padding: 0;
  font-size: 19px;
  border: none;
}

.block-landingpage .block-landingpage-login--member h2.block-landingpage-login--member-header {
  margin: 0 0 10px;
}

.block-landingpage h2.block-landingpage-form--goods-title,
.block-landingpage h2.block-landingpage-form--guest-title,
.block-landingpage h2.block-landingpage-form--sales-append-title,
.block-landingpage h2.block-landingpage-order--host-title {
  padding: 0;
  margin: 0 0 10px 0;
  font-size: 14px;
  border: none;
}

.block-landingpage h2.block-landingpage-form--sales-append-title {
  margin: 20px 0 5px 0;
}

.block-landingpage #method_spec h3 {
  padding: 0;
  margin: 0 0 10px 0;
  font-size: 14px;
  border: none;
}

.block-landingpage #method_pay h3 {
  display: none;
}

.block-landingpage .block-landingpage--dest-amazonpay h3 {
  padding: 0;
  margin: 0 0 10px 0;
  font-size: 14px;
  border: none;
}

.block-landingpage .block-landingpage-login--member-message {
  margin: 0 0 20px 0;
  font-size: 14px;
  text-align: center;
}

.block-landingpage .block-landingpage-login--ask-password {
  margin: 20px 0 0 0;
  font-size: 14px;
  text-align: center;
}

.block-landingpage .block-landingpage-login--ask-password a {
  text-decoration: underline;
}

.block-landingpage .block-landingpage-login--guest {
  padding: 0;
  margin: 0;
  border: none;
}

.block-landingpage .block-landingpage-other--dest {
  margin: 30px 0 10px;
  padding: 20px;
  border: none;
}

.block-landingpage .block-landingpage-login--member-body {
  width: auto !important;
  margin: 0 0 20px 0;
  border: #dcdcdc 1px solid;
}

.block-landingpage .block-landingpage-form {
  width: auto !important;
  margin: 0 0 20px 0;
  border: #dcdcdc 1px solid;
  display: block;
}

.block-landingpage .block-landingpage-login--first-time-message {
  margin: 0;
  font-size: 14px;
  text-align: center;
}

.block-landingpage .block-landingpage-login--first-time-body {
  width: auto !important;
  border: #dcdcdc 1px solid;
  display: block;
}

.block-landingpage .block-landingpage-form .block-landingpage-form--goods,
.block-landingpage .block-landingpage-form .block-landingpage-form--sales-append-content {
  padding: 0;
  border: none;
}

.block-landingpage-form--spec-content dl dt {
  float: left;
}

.block-landingpage-form--spec-content dl dd {
  margin-left: 8em;
}

.block-landingpage input {
  max-width: 100%;
}

.pane-landingpage-contents #frmLP {
  margin: 0 20px;
}

.pane-landingpage-contents #frmLP .fieldset-vertical {
  border: none !important;
}

.pane-landingpage-contents #frmLP .form-group {
  border: none;
}

.form-group .form-label-required {
  color: var(--color-red);
}

.block-landingpage-form--sales-append-content .form-label {
  background: none;
}

.pane-landingpage-contents .block-landingpage-other--dest-change {
  border: none !important;
}

.pane-landingpage-contents #frmLP .action-buttons {
  margin: 30px 0 40px;
}

.pane-landingpage-contents .action-buttons .btn.btn-primary {
  width: 80%;
  padding: 12px 0;
  margin: 0 auto;
  border-radius: 3px;
  font-size: 15px;
  text-align: center;
  display: block;
}

.pane-landingpage-contents #frmLP .action-buttons .btn.btn-primary {
  width: 100%;
}

/* details */
.pane-landingpage-contents #lp_details {
  margin: 40px 20px 0;
}

.pane-landingpage-contents .detail-box {
  margin: 0 0 30px 0;
}

.pane-landingpage-contents .detail-box#detail_bottom {
  margin: 0 0 10px 0;
}

.pane-landingpage-contents .detail-box .detail-ttl {
  padding: 10px 0;
  margin: 0;
  border: none;
  font-size: 13px;
  font-weight: bold;
  text-align: center;
  background: var(--color-gray);
  color: #fff;
}

.pane-landingpage-contents .detail-box .detail-inbox {
  padding: 10px;
  border-left: #dedede 2px solid;
  border-right: #dedede 2px solid;
  border-bottom: #dedede 2px solid;
}

.pane-landingpage-contents .detail-box .detail-inbox.table {
  padding: 0;
}

.pane-landingpage-contents .detail-box p {
  font-size: 12px;
}

.pane-landingpage-contents .detail-box p+p {
  margin-top: 10px;
}

.pane-landingpage-contents .detail-box .notice-list {
  margin: 0 1em 10px;
}

.pane-landingpage-contents .detail-box .notice-list li {
  font-size: 12px;
  list-style: disc inside;
  padding-left: 1em;
  text-indent: -1em;
}

.pane-landingpage-contents .detail-box .dl-table {
  display: flex;
  align-items: stretch;
}

.pane-landingpage-contents .detail-box .dl-table+.dl-table {
  border-top: #dedede 2px solid;
}

.pane-landingpage-contents .detail-box .dl-table dt {
  width: 30%;
  padding: 10px;
  border-right: #dedede 2px solid;
  font-size: 12px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pane-landingpage-contents .detail-box .dl-table dd {
  width: 70%;
  height: 100%;
  padding: 10px;
  font-size: 12px;
  box-sizing: border-box;
}

/* LP:CLEAR SKIN */
#lp_clear_skin .for-pc {
  display: none;
}

#lp_clear_skin * {
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
}

#lp_clear_skin section {
  position: relative;
}

#lp_clear_skin section .inner {
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

#lp_clear_skin h1,
#lp_clear_skin h2,
#lp_clear_skin h3 {
  padding: 0;
  margin: 0;
  border: none;
}

#lp_clear_skin #sec_main .top-pop {
  width: 100%;
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
}

#lp_clear_skin #sec_main .visual img {
  width: 100%;
}

#lp_clear_skin #sec_main .desc-box {
  width: 100%;
  height: 100%;
  padding: 30% 3% 0 55%;
  position: absolute;
  top: 0;
  left: 0;
}

#lp_clear_skin #sec_main .desc-box h1 {
  max-width: 324px;
  margin: 0 auto 10px;
}

#lp_clear_skin #sec_main .desc-box .text {
  margin: 0 0 20px;
  font-size: 0.7rem;
  text-align: center;
  line-height: 1.8;
}

#lp_clear_skin #sec_main .button.days10 a {
  width: 100%;
  height: 38px;
  margin: 0 auto;
  border: #000 1px solid;
  border-radius: 38px;
  font-size: 11px;
  text-align: center;
  line-height: 36px;
  text-decoration: none;
  display: block;
  position: relative;
  transition: 0.3s;
  background: transparent;
}

#lp_clear_skin #sec_main .button.days10 a::after {
  content: "";
  width: 8px;
  height: 8px;
  border-top: 1px solid #000;
  border-right: 1px solid #000;
  position: absolute;
  right: 25px;
  top: calc(50% - 4px);
  transform: rotate(45deg);
}

#lp_clear_skin #sec_main .button.days10 a:hover {
  border: #000 1px solid;
  background: #000;
  color: #fff;
}

#lp_clear_skin #sec_main .button.days10 a:hover::after {
  border-color: #fff;
}

#lp_clear_skin #sec_story {
  padding: 0 0 35vw 0;
  background: url("../../img/usr/lp/clear-skin/story_bg_sp.png") center bottom no-repeat;
  -webkit-background-size: 100% auto;
  background-size: 100% auto;
  position: relative;
  box-sizing: border-box;
}

#lp_clear_skin #sec_story .side {
  width: 16px;
  position: absolute;
  left: 10px;
  bottom: 45vw;
}

#lp_clear_skin #sec_story .side img {
  width: 16px;
}

#lp_clear_skin #sec_story h2 {
  margin: 0 0 20px 0;
  text-align: center;
}

#lp_clear_skin #sec_story .pop {
  margin: 0 0 20px 0;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
}

#lp_clear_skin #sec_story .text {
  margin: 0 0 20px 0;
  font-size: 12px;
  line-height: 1.8;
  text-align: center;
}

#lp_clear_skin #sec_story .kome-list {
  margin: 0 0 30px 0;
  display: flex;
  justify-content: center;
}

#lp_clear_skin #sec_story .kome-list li {
  margin: 0 10px 0 0;
  font-size: 10px;
}

#lp_clear_skin #sec_story .button.days10 a {
  width: 70%;
  height: 50px;
  margin: 0 auto;
  border: #000 1px solid;
  border-radius: 50px;
  font-size: 18px;
  text-align: center;
  line-height: 48px;
  text-decoration: none;
  display: block;
  position: relative;
  transition: 0.3s;
  background: #fff;
}

#lp_clear_skin #sec_story .button.days10 a::after {
  content: "";
  width: 8px;
  height: 8px;
  border-top: 1px solid #000;
  border-right: 1px solid #000;
  position: absolute;
  right: 25px;
  top: calc(50% - 4px);
  transform: rotate(45deg);
}

#lp_clear_skin #sec_story .product {
  width: 70%;
  margin: 25px auto 60px;
  text-align: center;
}

#lp_clear_skin #sec_body {
  width: 100%;
  padding: 0;
  background: url("../../img/usr/lp/clear-skin/body_bg_sp.jpg") center bottom no-repeat;
  -webkit-background-size: 100% 100%;
  background-size: 100% 100%;
}

#lp_clear_skin #sec_eye {
  width: 100%;
  padding: 22vw 0 0;
  background: url("../../img/usr/lp/clear-skin/eye_bg_sp.jpg") center bottom no-repeat;
  -webkit-background-size: 100% 100%;
  background-size: 100% 100%;
}

#lp_clear_skin #sec_face {
  width: 100%;
  padding: 22vw 0 0 0;
  background: url("../../img/usr/lp/clear-skin/face_bg_sp.jpg") center bottom no-repeat;
  -webkit-background-size: 100% 100%;
  background-size: 100% 100%;
}

#lp_clear_skin #sec_body h2 {
  width: 24%;
  position: absolute;
  bottom: -20vw;
  left: -2%;
  z-index: 2;
}

#lp_clear_skin #sec_eye h2 {
  width: 26%;
  position: absolute;
  bottom: -2vw;
  right: 0;
  z-index: 2;
}

#lp_clear_skin #sec_face h2 {
  width: 20%;
  position: absolute;
  bottom: -18vw;
  left: 0;
  z-index: 2;
}

#lp_clear_skin .item-frame .inner {
  display: flex;
  justify-content: center;
  flex-direction: column-reverse;
}

#lp_clear_skin .item-frame .image {
  padding: 0 20%;
  text-align: center;
}

#lp_clear_skin .item-frame .image img {
  vertical-align: top;
}

#lp_clear_skin .item-frame .item-desc {
  margin: 10px 0 0 0;
  font-size: 10px;
  line-height: 1.4;
  text-align: center;
}

#lp_clear_skin .item-frame .desc-box .pop {
  margin: 0 0 20px;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  line-height: 1.4;
  color: #fff;
}

#lp_clear_skin .item-frame .desc-box .text {
  margin: 0;
  font-size: 12px;
  text-align: center;
  line-height: 2;
  color: #fff;
}

#lp_clear_skin #sec_eye.item-frame .desc-box .text {
  margin-bottom: 20px;
}

#lp_clear_skin #sec_nayami {
  padding: 35vw 0 60px;
  background: url("../../img/usr/lp/clear-skin/nayami_bg_sp.jpg") center bottom no-repeat;
  -webkit-background-size: 100% 100%;
  background-size: 100% 100%;
}

#lp_clear_skin #sec_nayami .inner {
  position: relative;
  z-index: 2;
}

#lp_clear_skin #sec_nayami h2 {
  margin: 0 0 30px 0;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
}

#lp_clear_skin #sec_nayami .nayami-list {
  margin: 0 0 25px 0;
  display: flex;
  justify-content: center;
}

#lp_clear_skin #sec_nayami .nayami-list li {
  width: 30vw;
  height: 30vw;
  margin: 0 1vw;
  border-radius: 30vw;
  text-align: center;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.2rem;
  font-weight: bold;
  font-family: YuMincho, "Yu Mincho", sans-serif;
}

#lp_clear_skin #sec_nayami .line01 {
  margin: 0 0 25px 0;
  font-size: 12px;
  text-align: center;
  line-height: 1.8;
}

#lp_clear_skin #sec_nayami .line02 {
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  line-height: 2;
}

#lp_clear_skin #sec_offer {
  padding: 30px 20px 20px;
  background: #cac4c4;
  overflow: hidden;
}

#lp_clear_skin #sec_offer .inner {
  margin: 0 auto;
  background: #fff;
  position: relative;
  z-index: 2;
}

#lp_clear_skin #sec_offer .head {
  padding: 30px 15% 15px;
  text-align: center;
  position: relative;
}

#lp_clear_skin #sec_offer .head .pop {
  width: 100%;
  text-align: center;
  position: absolute;
  top: -12px;
  left: 0;
}

#lp_clear_skin #sec_offer .head .pop img {
  width: 142px;
}

#lp_clear_skin #sec_offer .main {
  margin: 0 -20px;
}

#lp_clear_skin #sec_offer .main img {
  width: 100%;
}

#lp_clear_skin #sec_offer .details {
  padding: 30px 25px;
}

#lp_clear_skin #sec_offer .ttl-point {
  margin: 0 0 20px 0;
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 0.2em;
  text-align: center;
  color: #e37a7a;
}

#lp_clear_skin #sec_offer .ttl-point strong {
  font-size: 24px;
  font-weight: bold;
}

#lp_clear_skin #sec_offer .point-list {
  margin: 0 0 20px 0;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

#lp_clear_skin #sec_offer .point-list li {
  width: 46%;
  padding: 5px 0;
  margin: 0 1% 2%;
  border: #000 1px solid;
  border-radius: 6px;
  font-size: 12px;
  font-weight: bold;
  text-align: center;
}

#lp_clear_skin #sec_offer .middle-text {
  margin: 0 0 30px 0;
  font-size: 14px;
  text-align: center;
  line-height: 2;
}

#lp_clear_skin #sec_offer .middle-text .days10 {
  padding: 5px 8px;
  margin: 0 10px;
  border: #e37a7a 1px solid;
  color: #e37a7a;
  display: inline-block;
  line-height: 1;
}

#lp_clear_skin #sec_offer .middle-text .line {
  border-bottom: #e37a7a 2px solid;
  display: inline-block;
  line-height: 1;
}

#lp_clear_skin #sec_offer .price-box-wrap {
  margin: 0 0 25px 0;
  border: #dedede 1px solid;
  padding: 20px;
  background: #f5f5f5;
}

#lp_clear_skin #sec_offer .price-box .price-line {
  margin: 0 0 10px 0;
  text-align: center;
}

#lp_clear_skin #sec_offer .price-box .regular-line {
  display: none;
}

#lp_clear_skin #sec_offer .trial-button {
  margin: 0;
}

#lp_clear_skin #sec_offer .trial-button a {
  width: 100%;
  height: 50px;
  margin: 0 auto;
  border-radius: 3px;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  line-height: 50px;
  letter-spacing: 0.1em;
  color: #fff;
  display: block;
  background: linear-gradient(90deg, rgba(213, 8, 8, 1) 0%, rgba(237, 9, 141, 1) 100%);
  transition: 0.3s;
}

#lp_clear_skin #sec_offer .trial-button a:hover {
  opacity: 0.7;
}

#lp_clear_skin #sec_offer .trial-button a::after {
  content: "";
  width: 0;
  height: 0;
  margin: 0 0 0 14px;
  border-top: 6px solid transparent;
  border-right: 6px solid transparent;
  border-left: 6px solid #fff;
  border-bottom: 6px solid transparent;
  display: inline-block;
}

#lp_clear_skin #sec_offer .notice-list li {
  padding-left: 1em;
  text-indent: -1em;
  font-size: 10px;
  color: #444;
}

/* lightbox.css override */
/*  Preload images */
body:after {
  content: url(../../img/sys/close.png) url(../../img/sys/loading.gif) url(../../img/sys/prev.png) url(../../img/sys/next.png);
  display: none;
}

body .lightboxOverlay {
  z-index: 99999;
}

body .lightbox {
  z-index: 100000;
}

/* ----独自スタイル---- */
:root {
  /* サンセリフ体 */
  --font-family-base: "Noto Sans JP", "Roboto", "ヒラギノ角ゴ ProN W6", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, Meiryo, "Font Awesome 5 Free", sans-serif;
  /* セリフ体 */
  --font-family-serif: "Noto Serif JP", "Roboto", serif;
  /* スラブセリフ体 */
  --font-family-corp: "all-round-gothic", sans-serif;
  --font-family-number: "Gill Sans Nova", sans-serif;
  /* ★カラー====================== */
  --color-text: #121212;
  --color-primary: #f3456e;
  --color-accent: #f17b55;
  --color-conversion: #f17b55;
  --color-red: #a71f24;
  --main--background-color: #ffffff !important;
  --sub---color: #eeeeee !important;
  /* --color-header-bg: #F7F1E7;*/
  --color-warm-ivory: #f6f1e7;
  --color-deep-burgundy: #481c1e;
  --color-sand: #645646;
  --color-navy-deep: #0c2544;
  --color-ocean-navy: #013451;
  --color-cream-beige: #eee2cc;
  --color-bronze-brown: #b88951;
  --color-olive-gray: #665948;
  --color-amber-gold: #ce931d;
  --color-light-pink: #fbeeee;
  --color-peach-pink: #f79384;
  --color-salmon: #f17b55;
  --color-warm-gray: #e2ddcf;
  --color-gray: #707070;
  --color-gray02: #bbbbbb;
  --color-gray03: #ccc;
  --color-dark-maroon: #631e20;
  --color-midnight-blue: #161f35;
  --color-soft-greige: #e1dadb;
  --color-header-bg: #ece7e7;
  --color-ranking-bg: #ECE9E0;
  --color-blog-bg: #F8F3EB;
  /*#EDE8E8*/
  --color-header-tag: #f6f0e4;
  --color-pager-current: #f6f0e4;
  --color-wine: #631e20;
  --form--border-color: #161f35;
  --color-mypage-bg: #fbf9f4;
  /* ★テキストサイズ====================== */
  --txt-52: 5.2rem;
  --txt-48: 4.8rem;
  --txt-40: 4rem;
  --txt-36: 3.6rem;
  --txt-34: 3.4rem;
  --txt-32: 3.2rem;
  --txt-28: 2.8rem;
  --txt-26: 2.6rem;
  --txt-24: 2.4rem;
  --txt-23: 2.3rem;
  --txt-22: 2.2rem;
  --txt-21: 2.1rem;
  --txt-20: 2rem;
  --txt-19: 1.9rem;
  --txt-18: 1.8rem;
  --txt-17: 1.7rem;
  --txt-16: 1.6rem;
  --txt-15: 1.5rem;
  --txt-14: 1.4rem;
  --txt-13: 1.3rem;
  --txt-12: 1.2rem;
  --txt-11: 1.1rem;
  --txt-10: 1rem;
  /* ★幅====================== */
  --container-width-s: 1121px;
  --container-width: 1386px;
  --responsive-sys-container-width: 1280px;
}

@media (max-width: 1200px) {
  :root {
    /* ★テキストサイズ====================== */
    --txt-52: min(4.17vw, 5.2rem);
    --txt-48: min(4vw, 4.8rem);
    --txt-40: min(3.33vw, 4rem);
    --txt-36: min(3vw, 3.6rem);
    --txt-34: min(2.83vw, 3.4rem);
    --txt-32: min(2.67vw, 3.2rem);
    --txt-28: min(2.33vw, 2.8rem);
    --txt-26: min(2.17vw, 2.6rem);
    --txt-24: min(2vw, 2.4rem);
    --txt-23: min(1.92vw, 2.3rem);
    --txt-22: min(1.83vw, 2.2rem);
    --txt-21: min(1.75vw, 2.1rem);
    --txt-20: min(1.67vw, 2rem);
    --txt-19: min(1.58vw, 1.9rem);
    --txt-18: min(1.5vw, 1.8rem);
    --txt-17: min(1.42vw, 1.7rem);
    --txt-16: min(1.33vw, 1.6rem);
    --txt-15: min(1.25vw, 1.5rem);
    --txt-14: min(1.17vw, 1.4rem);
    --txt-13: min(1.08vw, 1.3rem);
    --txt-12: min(1vw, 1.2rem);
    --txt-11: min(0.92vw, 1.1rem);
    --txt-10: min(0.83vw, 1rem);
  }
}

@media (max-width: 1024px) {
  :root {
    /* ★テキストサイズ====================== */
    --txt-52: min(10.83vw, 5.2rem);
    --txt-48: min(10vw, 4.8rem);
    --txt-40: min(8.33vw, 4rem);
    --txt-36: min(7.5vw, 3.6rem);
    --txt-34: min(7.08vw, 3.4rem);
    --txt-32: min(6.67vw, 3.2rem);
    --txt-28: min(5.83vw, 2.8rem);
    --txt-26: min(5.42vw, 2.6rem);
    --txt-24: min(5vw, 2.4rem);
    --txt-23: min(4.79vw, 2.3rem);
    --txt-22: min(4.58vw, 2.2rem);
    --txt-21: min(4.38vw, 2.1rem);
    --txt-20: min(4.17vw, 2rem);
    --txt-19: min(3.96vw, 1.9rem);
    --txt-18: min(3.75vw, 1.8rem);
    --txt-17: min(3.54vw, 1.7rem);
    --txt-16: min(3.33vw, 1.6rem);
    --txt-15: min(3.13vw, 1.5rem);
    --txt-14: min(2.92vw, 1.4rem);
    --txt-13: min(2.71vw, 1.3rem);
    --txt-12: min(2.5vw, 1.2rem);
    --txt-11: min(2.29vw, 1.1rem);
    --txt-10: min(2.08vw, 1rem);
    /* ★幅====================== */
    --container-width-s: 1121px;
    --container-width: 1386px;
    --responsive-sys-container-width: 1280px;
  }
}

@media (max-width: 768px) {
  :root {
    /* ★テキストサイズ====================== */
    --txt-52: min(6.77vw, 5.2rem);
    --txt-48: min(6.25vw, 4.8rem);
    --txt-40: min(5.21vw, 4rem);
    --txt-36: min(4.69vw, 3.6rem);
    --txt-32: min(4.17vw, 3.2rem);
    --txt-24: min(3.13vw, 2.4rem);
    --txt-22: min(2.86vw, 2.2rem);
    --txt-21: min(2.73vw, 2.1rem);
    --txt-20: min(2.6vw, 2rem);
    --txt-19: min(2.47vw, 1.9rem);
    --txt-18: min(2.34vw, 1.8rem);
    --txt-17: min(2.21vw, 1.7rem);
    --txt-16: min(2.08vw, 1.6rem);
    --txt-15: min(1.95vw, 1.5rem);
    --txt-14: min(1.82vw, 1.4rem);
    --txt-13: min(1.69vw, 1.3rem);
    --txt-12: min(1.56vw, 1.2rem);
    --txt-11: min(1.43vw, 1.1rem);
    --txt-10: min(1.3vw, 1rem);
  }
}

@media (max-width: 480px) {
  :root {
    /* ★テキストサイズ====================== */
    --txt-52: min(10.83vw, 5.2rem);
    --txt-48: min(10vw, 4.8rem);
    --txt-40: min(8.33vw, 4rem);
    --txt-36: min(7.5vw, 3.6rem);
    --txt-32: min(6.67vw, 3.2rem);
    --txt-24: min(5vw, 2.4rem);
    --txt-22: min(4.58vw, 2.2rem);
    --txt-21: min(4.38vw, 2.1rem);
    --txt-20: min(4.17vw, 2rem);
    --txt-19: min(3.96vw, 1.9rem);
    --txt-18: min(3.75vw, 1.8rem);
    --txt-17: min(3.54vw, 1.7rem);
    --txt-16: min(3.33vw, 1.6rem);
    --txt-15: min(3.13vw, 1.5rem);
    --txt-14: min(2.92vw, 1.4rem);
    --txt-13: min(2.71vw, 1.3rem);
    --txt-12: min(2.5vw, 1.2rem);
    --txt-11: min(2.29vw, 1.1rem);
    --txt-10: min(2.08vw, 1rem);
  }
}

/* 検索ウィンドウポップアップ時の背景 */
body.open-dropdown {
  position: relative;
  transition: 3s ease-in-out;
}

body::before {
  opacity: 0;
  content: "";
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  transition: 0.3s ease-in-out;
  width: 100%;
  z-index: 20;
  visibility: hidden;
  background: rgba(85, 44, 45, 0.908);
}

body.open-dropdown::before {
  opacity: 1;
  transition: 0.3s ease-in-out;
  visibility: visible;
  backdrop-filter: blur(10px);
}

* {
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
}

/* body {cursor: url('../../img/usr/common/mouse_nikukyu.svg') 35 32, auto;}*/
img {
  max-width: 100%;
  height: auto;
}

.img-w100per {
  width: 100%;
  height: auto;
}

.pc-only {
  display: block;
}

.pc-only-inline {
  display: inline;
}

.sp-only,
.tb-only,
.tb-sp-only,
.sp-only-inline {
  display: none;
}

a {
  text-decoration: none;

  &:hover,
  &:focus {
    text-decoration: none;
    /* color: var(--color-conversion); */
    color: var(--color-bronze-brown);
    transition: all 0.4s;
    outline: 0;
  }
}

/* 注意文言 */
.form-error {
  /* color: var(--color-accent); */
  color: var(--color-red);
  margin-top: 10px;
  font-weight: bold;
}

.help-block,
.count-msg,
.block-order-estimate--point-add-message,
.block-order-estimate--point-add-num,
.promotion-criteria-list-message>span {
  color: var(--color-accent);
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ボタン */
.btn {
  width: 100%;
  margin: auto;
  background: unset;
  border: none;

  /*&.btn-primary {font-size: var(--txt-22);font-family: var(--font-family-serif);font-weight: 600;line-height: calc(31/22);width: 100%;padding: min(3.2vw, 17px) 0 var(--txt-16);color: var(--color-text);border: 1px solid #121212;background: #fff;transition: all .4s;display: flex;justify-content: center;align-items: center;margin: auto;&:hover {opacity: .8;transition: all .4s;}*/
  &.btn-primary {
    font-size: var(--txt-22);
    font-family: var(--font-family-serif);
    font-weight: 600;
    line-height: calc(31 / 22);
    width: 100%;
    padding: min(3.2vw, 17px) 0 var(--txt-16);
    color: #fff;
    border: 1px solid var(--color-primary);
    background: var(--color-primary);
    transition: all 0.4s;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
    border-radius: 0;

    &:hover {
      opacity: 0.8;
      transition: all 0.4s;
      background: var(--color-light-pink);
      color: var(--color-primary);
    }
  }

  &.btn-block-goods-teikibin__button {
    font-size: var(--txt-22);
    font-family: var(--font-family-serif);
    font-weight: 600;
    line-height: calc(31 / 22);
    width: 100%;
    padding: min(3.2vw, 17px) 0 var(--txt-16);
    color: #fff;
    border: 1px solid var(--color-primary);
    background: var(white);
    transition: all 0.4s;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;

    &:hover {
      opacity: 0.8;
      transition: all 0.4s;
      background: var(--color-light-pink);
      color: var(--color-primary);
    }
  }

  &.btn-secondary {
    font-size: var(--txt-22);
    font-family: var(--font-family-serif);
    font-weight: 600;
    line-height: calc(31 / 22);
    width: 100%;
    padding: min(2.21vw, 17px) 0 var(--txt-16);
    color: #fff;
    /* border: 1px solid #121212;*/
    background: var(--color-text);
    transition: all 0.4s;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;

    &:hover {
      opacity: 0.8;
      transition: all 0.4s;
    }
  }

  &.btn-login {
    background: var(--color-accent);
  }

  &.btn-dio-login {
    background: var(--color-deep-burgundy);
  }

  &.btn-img {
    padding: 0;
  }
}

.block-top-topic--next-page a {
  font-size: var(--txt-22);
  font-family: var(--font-family-serif);
  font-weight: 600;
  line-height: calc(31 / 22);
  width: 100%;
  padding: min(3.2vw, 17px) 0 var(--txt-16);
  color: var(--color-text);
  border: 1px solid #121212;
  background: #fff;
  transition: all 0.4s;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 64px auto auto;
  padding: var(--txt-16);
  max-width: fit-content;

  /* margin-top: 40px;*/
  &:hover {
    color: var(--color-text);
    background: var(--color-light-pink);
    opacity: 1;
  }
}


.block-top-campaign a.btn {
  font-size: var(--txt-22);
  font-family: var(--font-family-serif);
  font-weight: 600;
  line-height: calc(31 / 22);
  width: 100%;
  padding: min(3.2vw, 17px) 0 var(--txt-16);
  color: var(--color-text);
  border: 1px solid #121212;
  background: #fff;
  transition: all 0.4s;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: auto;
  padding: var(--txt-16);
  max-width: 320px;

  /* margin-top: 40px;*/
  &:hover {
    color: var(--color-text);
    background: var(--color-light-pink);
    opacity: 1;
  }
}

.block-top-more {
  margin: auto;
}

.block-top-event__more a,
.block-top-recommend__cta a,
.block-top-new__cta a {
  &.btn-primary {
    font-size: var(--txt-22);
    font-family: var(--font-family-serif);
    font-weight: 600;
    line-height: calc(31 / 22);
    width: 100%;
    padding: min(3.2vw, 17px) 0 var(--txt-16);
    color: var(--color-text);
    border: 1px solid #121212;
    background: #fff;
    transition: all 0.4s;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
    font-size: var(--txt-16);
    padding: var(--txt-16);
    max-width: fit-content;

    /* margin-top: 40px;*/
    &:hover {
      color: var(--color-text);
      background: var(--color-light-pink);
      opacity: 1;
    }
  }

}

#tokuten .btn-primary {
  border: 1px solid #121212;
  color: var(--color-text);
  background-color: white;

  &:hover {
    opacity: 0.8;
    transition: all 0.4s;
    background: var(--color-light-pink);
    color: var(--color-text) !important;
  }
}

.container:not(:has(.block-header-logo)) {
  .action-buttons {
    margin-top: 40px;
  }

  .action-buttons+.action-buttons {
    margin-top: 0;
  }

  .action-buttons .action .btn {
    margin-top: 0;
  }

  .btn {
    &.btn-default {
      font-size: var(--txt-22);
      font-family: var(--font-family-serif);
      font-weight: 600;
      line-height: calc(31 / 22);
      width: 100%;
      padding: min(3.2vw, 17px) 0 var(--txt-16);
      color: var(--color-text);
      border: 1px solid #121212;
      background: #fff;
      transition: all 0.4s;
      display: flex;
      justify-content: center;
      align-items: center;
      margin: auto;
      font-size: var(--txt-16);
      padding: var(--txt-16);
      max-width: fit-content;

      /* margin-top: 40px;*/
      &:hover {
        background: var(--color-light-pink);
        opacity: 1;
      }
    }

    &.btn-default[value="戻る"] {
      font-size: var(--txt-22);
      font-family: var(--font-family-serif);
      font-weight: 600;
      line-height: calc(31 / 22);
      width: 100%;
      padding: min(3.2vw, 17px) 0 var(--txt-16);
      color: var(--color-text);
      border: 1px solid #121212;
      background: #fff;
      transition: all 0.4s;
      display: flex;
      justify-content: center;
      align-items: center;
      margin: auto;
      font-size: var(--txt-16);
      padding: var(--txt-16);
      min-width: var(--responsive-sys-button-width);
      max-width: 200px;

      /* margin-top: 40px;*/
      &:hover {
        background: var(--color-light-pink);
        color: #121212;
        opacity: 1;
      }
    }

    &.btn-danger {
      font-size: var(--txt-22);
      font-family: var(--font-family-serif);
      font-weight: 600;
      line-height: calc(31 / 24);
      width: 100%;
      /*padding: min(3.2vw, 17px) 0 var(--txt-16);*/
      color: var(--color-text);
      border: 1px solid #121212;
      background: #fff;
      transition: all 0.4s;
      display: flex;
      justify-content: center;
      align-items: center;
      margin: auto;
      font-size: var(--txt-16);
      padding: min(2.4vw, 14px) 0 var(--txt-14);
      /* min-width: var(--responsive-sys-button-width);*/
      margin-top: 16px;

      /*margin-top: 40px;*/
      &:hover {
        background: var(--color-light-pink);
        opacity: 1;
      }
    }

    &.block-arrival-notice--btn {
      font-size: var(--txt-22);
      font-family: var(--font-family-serif);
      font-weight: 600;
      line-height: calc(31 / 22);
      width: 100%;
      padding: min(3.2vw, 17px) 0 var(--txt-16);
      color: var(--color-text);
      border: 1px solid var(--color-text);
      background: var(white);
      transition: all 0.4s;
      display: flex;
      justify-content: center;
      align-items: center;
      margin: auto;
      max-width: none;

      &:hover {
        opacity: 0.8;
        transition: all 0.4s;
        background: var(--color-light-pink);
        color: var(--color-text);
      }
    }
  }
}

/* 表 */
.pane-contents {
  .table th {
    background: var(--tag-background-color);
    font-weight: normal;
  }

  .table,
  .table td,
  .table th {
    border: 1px solid #cccccc;
  }
}

.fieldset-vertical div.form-group {
  border-top: 1px solid #cccccc;
}

div.fieldset-vertical div.form-group:last-of-type {
  border-bottom: 1px solid #cccccc;
}

.fieldset-vertical div.form-label,
.fieldset-vertical div.constraint {
  background: var(--tag-background-color);
}

.fieldset-vertical div.constraint {
  background: var(--tag-background-color);
}

.required:after {
  background-color: var(--color-accent);
  border-radius: 0;
}

/* ポップアップ */
.modal-header {
  background-color: var(--color-primary);
}

.modal-body,
.modal-footer {
  background: var(--tag-background-color);
}

/* アニメーション */
.btn-fill-left {
  display: block;
  width: 100%;
  position: relative;
  overflow: hidden;
  cursor: pointer;

  span {
    position: relative;
    z-index: 3;
    transition: color 0.2s ease;
  }

  &:hover {

    /*span {color: #fff;}*/
    &::before {
      transform-origin: left top;
      transform: scaleX(1);
    }
  }

  &::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--color-light-pink);
    transform: scaleX(0);
    transform-origin: right top;
    transition: transform 0.3s ease-out;
  }
}

/* header---- */
.pane-header {
  height: fit-content;
  box-shadow: none;
  background: rgba(255, 255, 255, 0.9);

  .pane-header-inner {
    position: relative;
  }

  .block-header-logo {
    position: absolute;
    top: 0;
    left: min(2.08vw, 40px);
    width: clamp(160px, 16.51vw, 316px);
    aspect-ratio: 317/200;
    transition: all 0.3s 0s ease;
  }

  .block-header-info-frame {
    padding: calc((28px - var(--txt-16) - (19px - var(--txt-16))) / 2);
    background: var(--color-cream-beige);
    opacity: 1;
    max-height: 200px;
    transition: max-height 0.3s ease, opacity 0.3s ease, padding 0.3s ease;

    /* transition: transform .3s ease;*/
    &.is-hidden {
      max-height: 0;
      opacity: 0;
      padding: 0 !important;
      pointer-events: none;
      transform: translateY(-100%);
    }
  }

  .block-header-info {
    color: var(--color-deep-burgundy);
    font-size: var(--txt-14);
    line-height: calc(16 / 14);
    display: inline-block;
    vertical-align: text-top;
    width: 100%;

    &::before {
      content: "";
      display: inline-block;
      width: 1.1em;
      height: auto;
      aspect-ratio: 1/1;
      background: url(../../img/usr/common/icon_speaker.svg) no-repeat left top / cover;
      margin-right: 0.6rem;
      position: relative;
      top: 2px;
    }
  }

  .container {
    width: 100%;
    max-width: 1920px;
    height: 88px;
    /* position: relative;*/
  }

  .block-header-nav {
    width: 100%;
    height: 100%;
    padding: 0 min(2.19vw, 42px) 0 calc(min(2.08vw, 40px) + clamp(160px, 16.51vw, 316px));
    column-gap: min(4.27vw, 82px) !important;
  }

  /* search */
  .block-headernav--item-search-fb {
    /* display: flex!important;*/
    width: calc(100% - 183px);

    /* gap: min(2.08vw,40px);*/
    form {
      width: 100%;
      /*border: 1px solid var(--color-sand);border-radius: 8px;padding: var(--txt-12) min(0.89vw,17px) var(--txt-12) 0;*/
      border: 0;
      position: relative;

      input::placeholder,
      textarea::placeholder {
        color: var(--color-soft-greige);
        opacity: 1;
      }

      input {
        background-color: unset;
      }

      .block-global-search--submit {
        width: 20px;
        height: 22px;
        background: url(../../img/usr/common/icon_search.svg) no-repeat center center / 100%;
        position: absolute;
        right: 12px;
      }

      .block-global-search--keyword {
        /* padding: 0 10px 0 20px;*/
        width: 100%;
        border: 1px solid var(--color-sand);
        border-radius: 8px;
        /* padding: var(--txt-12) min(0.89vw,17px) var(--txt-12) 0;*/
        height: 48px;
        padding: 13px 20px;
        font-size: var(--txt-15);
        background-color: var(--main--background-color);
      }
    }

    .block-headernav--item-search-inner {
      display: flex !important;
      width: 100%;
      gap: min(2.08vw, 40px);
      margin-left: min(1.67vw, 32px);
    }
  }

  .block-global-search {
    width: min(22.5vw, 432px);
    /* margin-left: min(13.33vw,256px);*/
  }

  /* 検索ウィンドウポップアップ */
  .block-search-suggest-container {
    position: absolute;
    top: -11px;
    width: 106%;
    left: 50%;
    transform: translateX(-50%);
    z-index: -1;
    display: none;

    .block-search-suggest-body {
      position: relative;
    }

    /* 左側よく検索されるワード*/
    .block-search-suggest-frequent-words-body {
      background-color: var(--main--background-color);
      padding: 84px 32px 32px;
    }

    .block-search-suggest-frequent-words-header {
      font-size: var(--txt-12);
      color: rgba(112, 112, 112, 0.64);
      margin-bottom: 20px;
    }

    .block-search-suggest-frequent-words-list {
      display: flex;
      flex-direction: column;
      gap: 16px;
      padding-left: 26px;
    }

    .block-search-suggest-frequent-words-item {
      color: var(--color-text);
      font-size: var(--txt-16);
      font-weight: bold;
    }

    /* 右側サムネイル */
    .block-search-suggest-thumbnail {
      background-color: var(--main--background-color);
      width: 506px;
      padding: 32px;
      position: absolute;
      left: calc(100% + 12px);
      top: 100px;
    }

    .block-search-suggest-thumbnail-header {
      font-size: var(--txt-10);
      color: rgba(112, 112, 112, 0.64);
      font-weight: bold;
      margin-bottom: 8px;
    }

    .block-search-suggest-thumbnail-body {
      display: flex;
      flex-direction: column;
      gap: 16px;
    }

    .block-search-suggest-thumbnail-item {
      display: flex;
      align-items: center;
      gap: 16px;
    }

    .block-search-suggest-thumbnail-item--img {
      width: 90px;

      img {
        aspect-ratio: 90 / 109;
        object-fit: cover;
        border: 1px solid #cccccc;
      }
    }

    .block-search-suggest-thumbnail-item--txt {
      font-size: var(--txt-15);
      color: var(--color-text);
      font-weight: bold;
      width: calc(100% - 106px);
    }

    /* 読み物 */
    .block-search-suggest-thumbnail-read {
      margin-top: 16px;
    }

    .block-search-suggest-thumbnail-item--data {
      font-size: var(--txt-10);
      color: rgba(112, 112, 112, 0.64);
      margin-bottom: 8px;
    }
  }

  /* tag */
  .block-search-tag {
    width: calc(100% - min(40%, 480px));
    display: flex;
    align-items: center;
    justify-content: left;
    gap: 8px;
    flex-wrap: wrap;
  }

  .block-search-tag--item {
    a {
      font-size: var(--txt-12);
      line-height: calc(17 / 12);
      padding: 4px 9px 5px 11px;
      background: var(--color-header-tag);
      border-radius: 100px;
      color: var(--color-deep-burgundy);
    }
  }

  .block-headernav--item-list {
    margin: unset;

    &.left-list {
      /* max-width: calc(100% - 55px);*/
      width: 100%;
      justify-content: space-between;
    }

    &.right-list {
      width: 55px;
    }

    a {
      width: 100%;
      height: 100%;
    }
  }

  .block-headernav--item-left {
    &.cat-life-30 {
      aspect-ratio: 51/58;
      max-width: 51px;
      height: auto;
      /* margin-left: min(8.08vw, 40px);*/
      margin-left: min(11.08vw, 43px);
      display: flex;
      justify-content: center;
      align-items: center;
    }
  }

  .block-headernav--item-right {
    width: min(15.53vw, 183px) !important;
    display: flex;
    align-items: center;

    .block-headernav--item-list-inner {
      width: 100%;
      display: flex;
      flex: 1;
      justify-content: flex-end;
      /* align-items: center;*/
    }

    li {
      width: auto;
      height: 38px;

      /* min(2.08vw,40px) */
      a {
        display: block;
      }
    }

    .block-headernav--item-text {
      font-size: 0;
      /*10px*/
      display: inline-block;
      width: 50px;
      padding-top: 3.8rem;
      text-align: center;
      color: var(--color-deep-burgundy);
    }

    .block-headernav--item-bookmark {
      max-height: 36px;
      aspect-ratio: 35/31;
      margin-right: min(0.6vw, 30px);

      a {
        background: url(../../img/usr/common/icon_bookmark03.svg) no-repeat center center /auto 85%;
      }
    }

    .block-headernav--item-login {
      width: auto;
      max-height: 36px;
      margin-right: min(0.4vw, 24px);

      a {
        aspect-ratio: 1/1;
        background: url(../../img/usr/common/icon_login.svg) no-repeat center center / 60%;
      }
    }

    .block-headernav--item-cart {
      position: relative;

      a {
        aspect-ratio: 36/38;
        background: url(../../img/usr/common/icon_cart.svg) no-repeat center center / auto 94%;

        .block-headernav--cart-count {
          min-width: 24px;
          height: 24px;
          display: flex;
          justify-content: center;
          align-items: center;
          font-family: var(--font-family-corp);
          font-size: var(--txt-16);
          font-weight: 600;
          color: #fff;
          background-color: var(--color-primary);
          border-radius: 9999px;
          position: absolute;
          top: 0;
          left: calc(100% - 16px);
          padding: 0 0.5em;
          line-height: 1;
          /* transform: translate(-50%,-50%);*/
        }
      }
    }
  }

  #header_menu {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 55px;
    height: 38px;

    span {
      color: var(--color-deep-burgundy);
      font-family: var(--font-family-corp);
      /* font-size: var(--txt-16);*/
      line-height: 1;
      background: none;
      position: unset !important;
      width: 100%;
      height: auto;
      display: flex;
      justify-content: center;
      align-items: center;
      font-size: 0;
      aspect-ratio: 50 / 13;
      background: url(../../img/usr/common/txt_menu.svg) no-repeat center center / 100%;
    }

    &::before {
      width: 4px;
      height: auto;
      aspect-ratio: 1/1;
      background: var(--color-accent);
      top: 0;
      left: 50%;
      transform: translate(-50%, -50%);
      transition: transform 0.4s ease;
      border-radius: 50%;
    }

    &::after {
      width: 4px;
      height: auto;
      aspect-ratio: 1/1;
      background: var(--color-accent);
      top: 100%;
      left: 50%;
      transform: translate(-50%, -50%);
      transition: transform 0.4s ease;
      border-radius: 50%;
    }

    &.active {
      align-items: end;
      aspect-ratio: 52/48;
      width: fit-content;
      height: auto;

      &::before {
        top: 25%;
        transform: translate(-50%, -50%) rotate(45deg);
        width: var(--txt-24);
        height: 1px;
        border-radius: 0;
        background: var(--color-text);
      }

      &::after {
        top: 25%;
        transform: translate(-50%, -50%) rotate(-45deg);
        width: var(--txt-24);
        height: 1px;
        border-radius: 0;
        background: var(--color-text);
      }

      span {
        content: "CLOSE";
        display: block;
        aspect-ratio: 44 / 10;
        background: url(../../img/usr/common/txt_close.svg) no-repeat center center / 100%;
        width: 44px;
        height: auto;
      }
    }
  }

  .block-headernav--item-list {
    /*&.right-list {width: 55px;}*/
  }

  /* スクロール時 */
  &.is-scrolled {
    background: rgba(255, 255, 255, 0.9);
  }

  /* ログイン後 */
  &.logged-in {
    .block-headernav--item-right {
      .block-headernav--item-login {
        a {
          aspect-ratio: auto;
          background: url(../../img/usr/common/icon_mypage.svg) no-repeat center center / 60%;
        }
      }
    }

  }

  /* ログイン後 上に来ているとき */
  &.logged-in.is-top {
    .block-headernav--item-right {
      .block-headernav--item-login {
        a {
          aspect-ratio: auto;
          background: url(../../img/usr/common/icon_mypage_txt.svg) no-repeat center center / auto 100%;
        }
      }
    }

  }

  /* 上に来ているとき */
  &.is-top {
    .block-headernav--item-right {
      li {
        height: 47px;
      }

      .block-headernav--item-bookmark {
        max-height: max-content;
        aspect-ratio: auto;

        a {
          aspect-ratio: auto;
          background: url(../../img/usr/common/icon_bookmark_txt.svg) no-repeat center center / auto 100%;
        }
      }

      .block-headernav--item-login {
        max-height: max-content;

        a {
          aspect-ratio: auto;
          background: url(../../img/usr/common/icon_login_txt.svg) no-repeat center center / auto 100%;
        }
      }


      .block-headernav--item-cart {
        max-height: max-content;

        a {
          aspect-ratio: auto;
          background: url(../../img/usr/common/icon_cart_txt.svg) no-repeat center center / auto 100%;
        }
      }
    }
  }


}

/* メニュー展開時---- */
body {
  &.body-fixed {
    #menu_view {
      padding: 0 !important;
      height: 100vh;

      .menu_inner {
        padding-top: clamp(160px, 11.82vw, 227px);
        background: #f6f1e7;
      }

      .navi-menu-title {
        font-size: var(--txt-24);
        font-weight: bold;
        font-family: var(--font-family-serif);
        color: var(--accent--text-color);
      }

      .block-navi-menu-contents {
        width: clamp(980px, 95vw, 1154px);
        /* width: clamp(980px, 60.1vw, 1154px); */
        margin: auto;
        /* background: var(--header-background-color);*/
        display: flex;
        justify-content: space-between;
        gap: min(4.51%, 52px);

        +.block-navi-menu-contents {
          margin-top: min(4.17vw, 80px);
        }

        .block-navi-menu-contents-inner {
          flex: 1 0 84.92%;
          font-family: var(--font-family-base) !important;
        }

        .block-navi-menu {
          /* width: min(84.92%,980px);*/
          margin: auto;

          +.block-navi-menu {
            margin: min(2.08vw, 40px) auto 0;
            padding: min(2.08vw, 40px) 0 0;
            border-top: 1px solid #ccc;
          }
        }

        .block-header-menu--title {
          width: min(19.58%, 226px);
          font-size: var(--txt-24);
          font-weight: bold;
          font-family: var(--font-family-serif);
          color: var(--accent--text-color);
        }

        .header-categorytree-list {
          display: flex;
          flex-wrap: wrap;
          gap: var(--txt-24) min(4.17vw, 80px);
        }

        .header-categorytree-item {
          figure {
            display: flex;
            align-items: center;
            justify-content: flex-start;
            column-gap: var(--txt-16);
            font-size: var(--txt-16);
            font-family: var(--font-family-serif);
            line-height: calc(40 / 16);
            height: 100%;

            img {
              width: min(3.33vw, 64px);
              transition: transform 0.4s ease;

              /* &:hover {
                transform: translateY(-0.8rem);
              } */
            }

            &:hover img {
              transform: translateY(-0.8rem);
            }

            figcaption {
              height: fit-content;
              font-family: var(--font-family-base);
            }
          }
        }

        .header-genretree-list {
          max-width: var(--container-width-s);
          margin: auto;
          display: grid;
          grid-template-columns: repeat(3, 1fr);
          gap: 20px 100px;

          li {
            a {
              position: relative;
              display: flex;
              justify-content: space-between;
              align-items: center;
              font-size: var(--txt-16);
              /*font-family: var(--font-family-serif);*/
              line-height: calc(24 / 16);

              &::after {
                content: "";
                width: min(1.04vw, 20px);
                height: auto;
                aspect-ratio: 20/13;
                background: url(../../img/usr/common/icon_arrow.svg) no-repeat left top / 100%;
                display: inline-block;
                transition: transform 0.4s ease;
              }

              &:hover::after {
                transform: translateX(0.8rem);
              }
            }
          }
        }
      }

      /* 下部グレーエリア */
      .block-navi-menu-contents.-other {
        background-color: #e3e4e6;
        margin-inline: 0;
        padding-block: 50px;
        padding-inline: 20px;
        width: 100%;

        .header-genretree-list {
          display: flex;
          justify-content: space-between;
          gap: min(4.29vw, 80px);
          max-width: 1216px;

          & li {
            a {
              font-size: var(--txt-14);
              font-weight: bold;
              color: var(--color-gray);

              &::after {
                display: none;
              }

              &:hover {
                opacity: .6;
              }
            }
          }

          .header-genretree-item.-sns ul {
            display: flex;
            gap: 24px;

            img {
              max-width: 24px;
            }
          }
        }
      }

      .block-header-menu-list {
        width: 100%;
        padding: 0;

        &.-menu {
          .header-menu-link {
            font-family: var(--font-family-serif);
          }
        }

        .header-menu-link-list {
          width: 100%;
          height: auto;
          display: grid;
          grid-template-columns: 1fr 1fr;
          gap: 1px;
          background: #ccc;

          .-top {
            height: min(96px);
          }

          .header-menu-link {
            width: 100%;
            height: 100%;
            border: none;
            background: #fff;
            color: var(--accent--text-color);
            font-size: var(--txt-24);
            font-weight: medium;
            line-height: calc(64 / 24);
            display: flex;
            align-items: center;
            justify-content: center;
            transition: ease 0.4s;
            text-decoration: none;

            &:hover {
              transition: ease 0.4s;
              opacity: 0.6;
            }
          }
        }
      }
    }
  }
}

/* トグル */
.js-toggle-menu {
  +.js-toggle-menu {
    border-top: 1px solid #ccc;
  }

  .toggle-menu-btn {
    width: 100%;
    height: min(13.33vw, 64px);
    font-family: var(--font-family-serif);
    font-size: var(--txt-20);
    font-weight: bold;
    color: var(--accent--text-color);
    padding: var(--txt-16) 0 var(--txt-19) min(7.67vw, 56px);
    background-color: var(--main--background-color);
    text-align: left;
    border: none;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;

    &::after {
      content: "";
      aspect-ratio: 13/25;
      width: min(3.71vw, 14px);
      height: auto;
      background: url(../../img/usr/common/icon_toggle_arrow.svg) no-repeat center center / 100%;
      display: inline-block;
      position: absolute;
      top: 50%;
      left: calc(100% - 8.33vw);
      transform: translate(-50%, -50%);
      transition: all 0.4s;
    }

    &.is-active {
      &::after {
        content: "";
        aspect-ratio: 13/25;
        width: min(3.71vw, 14px);
        height: auto;
        background: url(../../img/usr/common/icon_toggle_arrow.svg) no-repeat center center / 100%;
        display: inline-block;
        position: absolute;
        top: 50%;
        left: calc(100% - 8.33vw);
        transform: translate(-50%, -50%) rotate(180deg);
        transition: all 0.4s;
      }
    }
  }

  .toggle-menu-content {
    width: 100%;
    border-top: 1px solid #ccc;

    /* border-bottom: 1px solid #ccc;*/
    li {
      width: 100%;
      /*height: min(13.33vw, 64px);*/
      height: min(16vw, 56px);
      background: #f6f1e7;
      padding: 0;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      font-size: var(--txt-16);
      font-weight: 400;
      line-height: calc(20 / 16);
      padding-left: min(9.77vw, 75px);

      +li {
        border-top: 1px solid #ccc;
        line-height: 1.8rem;
      }
    }
  }

  .toggle-menu-content {
    display: none;
  }

  &.is-active {
    .toggle-menu-btn {
      &::after {
        transform: translate(-50%, -50%) rotate(180deg);
        transition: all 0.4s;
      }
    }

    .toggle-menu-content {
      display: block;
    }
  }
}

/* 検索フォーム---- */
form[name="frmSearch"]:not(:where(.block-cart *)) {
  width: 100%;
  border: 1px solid var(--color-sand);
  border-radius: 8px;
  padding: var(--txt-12) min(0.89vw, 17px) var(--txt-12) 0;

  .block-global-search--submit {
    width: 20px;
    height: 22px;
    background: url(../../img/usr/common/icon_search_sp.svg) no-repeat center center / 100%;
  }

  .block-global-search--keyword {
    padding: 0 10px 0 20px;
  }
}

/* footer---- */

/* マウスストーカーのスタイル */
.mouse-stalker {
  position: fixed;
  width: 35px;
  height: 32px;
  background: url(../../img/usr/common/mouse_nikukyu.svg) no-repeat center center / contain;
  /* border: 2px solid black;
  border-radius: 50%; */
  pointer-events: none;
  z-index: 99999;
  transform: translate(-50%, -50%) scale(1);
  transition: transform 0.3s ease;
  /* スケールのアニメーション */
}

.pane-footer {
  width: 100%;
  padding: 0 !important;
  background: #fff;

  /* border-top: 1px solid var(--color-gray);*/
  .block-footernav-top {
    width: 100%;
    padding: 0;
    border-top: 1px solid var(--color-gray);
    border-bottom: 1px solid var(--color-gray);

    .block-footernav--item-list li a {
      font-size: var(--txt-18) !important;
    }
  }

  .block-footernav--item-list {
    width: 100%;
    max-width: 1538px;
    margin: auto;
    background: var(--color-gray);
    border-left: 1px solid var(--color-gray);
    border-right: 1px solid var(--color-gray);
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 1px;

    li {
      width: 100% !important;
      height: fit-content;
      padding: 0 !important;
      border-left: unset !important;

      a {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 100%;
        background: var(--color-light-pink);
        font-size: var(--txt-16) !important;
        font-weight: 500;
        font-family: var(--font-family-serif);
        line-height: calc(60 / 16);
        color: var(--color-text);
      }
    }
  }

  .block-footernav-menu {
    width: 100%;
    border-bottom: 1px solid var(--color-gray);

    .block-footernav--item-list {
      width: 100%;
      max-width: 1538px;
      margin: auto;
      display: grid;
      grid-template-columns: 1fr 1fr 1fr 1fr;
      background: var(--color-gray);
      border-left: 1px solid var(--color-gray);
      border-right: 1px solid var(--color-gray);
      gap: 1px;

      li {
        width: 100% !important;
        height: fit-content;
        padding: 0 !important;

        a {
          width: 100%;
          height: 100%;
          background: #fff;
          font-size: var(--txt-16);
          font-weight: 500;
          font-family: var(--font-family-serif);
          line-height: calc(60 / 16);
          color: var(--color-text);
          display: flex;
          align-items: center;
          justify-content: center;
        }
      }
    }
  }

  .block-footernav-info {
    width: 100%;
    padding: min(4.9vw, 94px) 0 min(3.33vw, 64px);

    .block-footernav-info-list {
      width: 100%;
      max-width: 1307px;
      margin: auto;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      /* column-gap: min(3.39vw,65px);*/
    }

    .block-footernav-info-item {
      &.-company {
        width: min(42.1%, 554px);

        .info-company-item {
          display: flex;
          flex-wrap: wrap;
          justify-content: space-between;
          align-items: center;
          row-gap: var(--txt-32);

          .footer-logo {
            width: min(36.1%, 200px);
            height: auto;
            aspect-ratio: 1/1;
          }

          .footer-tel {
            width: min(58.3%, 323px);

            .tel-number {
              a {
                font-size: var(--txt-48);
                font-weight: 600;
                font-family: var(--font-family-corp);
                line-height: calc(70 / 48);
                color: var(--accent--text-color);
              }

              a[href^="tel:"] {
                pointer-events: none;
                font-weight: 500;
              }
            }

            .tel-text {
              margin-top: 8px;
              font-size: var(--txt-19);
              font-weight: 500;
              line-height: calc(27 / 19);
            }
          }

          .info-company-other {
            width: 100%;

            ul {
              display: flex;
              justify-content: flex-start;
              align-items: center;

              .icon_mark {
                .-privacy {}
              }
            }
          }
        }
      }

      &.-calendar {
        width: min(52.96%, 697px);
        display: flex;
        /* flex-wrap: wrap;*/
        justify-content: space-between;
        align-items: center;
        column-gap: var(--txt-14);

        .pane-contents {
          min-height: unset;
          padding-bottom: 0;
        }

        .container {
          width: 100%;
          padding-bottom: 0;
        }

        .info-calendar-item {
          width: min(47.35%, 330px);
          height: auto;
          overflow: hidden;
          box-shadow: 0 0 8px rgba(242, 239, 233, 1);

          /* aspect-ratio: 1/1;*/
          table {
            width: 100%;
            height: auto;
            /* aspect-ratio: 267 / 166;*/
            text-align: center;
            margin: 0 auto;
            border-collapse: separate !important;
            border-spacing: min(1.15vw, 22px) min(0.21vw, 4px);

            td {
              width: min(1.67vw, 32px);
              height: auto;
              aspect-ratio: 32/42;

              span {
                width: 100%;
                height: 100%;
              }
            }
          }
        }

        .info-calendar-text {
          width: min(44.33%, 309px);

          .info-calendar-heading {
            font-size: var(--txt-24);
            font-family: var(--font-family-serif);
            font-weight: bold;
            line-height: calc(28 / 24);
            margin-bottom: min(0.78vw, 15px);
          }

          .c-text {
            font-size: var(--txt-16);
            line-height: calc(24 / 16);

            +.c-text {
              margin-top: calc(16px * (24 / 16));
            }
          }

          .calendar-mark01 {
            color: #eee2cc;
          }

          .calendar-mark02 {
            color: var(--color-salmon);
          }
        }
      }
    }

    .block-footernav--text-list {
      max-width: 1080px;
      margin: min(3.02vw, 58px) auto 0;
      display: flex;
      justify-content: flex-start;
      align-items: center;
      flex-wrap: wrap;
      gap: min(1.56vw, 30px) min(2.08vw, 40px);

      li {
        a {
          font-size: var(--txt-14);
          line-height: calc(24 / 14);
          color: var(--color-text);
        }
      }
    }
  }

  #footer_pagetop {
    width: 100%;
    display: block;
    position: unset;
    top: unset;
    left: unset;
    opacity: 1 !important;
    padding: 0;

    a {
      width: 100% !important;
      height: 52px;
      padding: var(--txt-12) 0 min(0.52vw, 10px);
      background: #e2ddcf;
      display: flex;
      justify-content: center;
      align-items: flex-end;

      &::after {
        margin-top: 0;
        margin-left: 0;
        top: calc(50% - min(0.83vw, 16px) / 2);
        left: calc(50% - min(0.83vw, 16px) / 2);
        border-color: var(--color-gray);
      }

      span {
        font-size: var(--txt-12);
        font-weight: 600;
        line-height: calc(17 / 12);
        color: var(--color-text) !important;
      }
    }
  }

  .block-footernav-adout {
    width: 100%;
    background: url(../../img/usr/common/footer_about_bg.png) no-repeat center center / cover;
    padding: min(2.34vw, 45px);

    .block-footernav-adout-list {
      width: min(65.21vw, 1252px);
      margin: auto;
      display: flex;
      justify-content: space-between;
      align-items: center;
    }

    .block-footernav-adout-item {
      &.-adout {
        width: min(31.88vw, 612px);
        padding: min(1.51vw, 29px) min(2.6vw, 50px) var(--txt-32);
        background: rgba(255, 255, 255, 0.8);

        .footernav-adout-item-heading {
          font-size: var(--txt-28);
          font-weight: 600;
          /*font-family: var(--font-family-corp) !important;*/
          line-height: calc(40 / 28);
          text-align: center;
        }

        .c-text {
          font-size: var(--txt-18);
          /* font-weight: bold; */
          /* font-family: var(--font-family-serif); */
          line-height: calc(28 / 18);
          margin: min(0.78vw, 15px) 0 min(1.15vw, 22px);
        }

        .footernav-adout-btns {
          width: 100%;
          display: flex;
          flex-wrap: wrap;
          justify-content: center;
          align-items: center;
          gap: min(0.63vw, 12px) min(1.67vw, 32px);

          .btn-layout {
            width: min(12.5vw, 240px);

            .btn-primary {
              font-size: min(1.04vw, 20px);
              font-family: var(--font-family-serif);
              font-weight: 600;
              line-height: calc(31 / 22);
              width: 100%;
              padding: min(3.2vw, 17px) 0 var(--txt-16);
              color: var(--color-text);
              border: 1px solid var(--color-text);
              background: white;
              transition: all 0.4s;
              display: flex;
              justify-content: center;
              align-items: center;
              margin: auto;

              &:hover {
                background: var(--color-light-pink);
              }
            }
          }
        }
      }

      &.-magazine {
        width: min(25vw, 480px);

        .footernav-adout-item-heading {
          font-size: var(--txt-32);
          font-weight: 500;
          font-family: "all-round-gothic";
          color: #fff;
          line-height: calc(46 / 32);
          text-align: center;
          margin-bottom: min(2.08vw, 40px);
          color: #fff;
        }

        .tk-all-round-gothic {
          font-family: "all-round-gothic", sans-serif;
          font-weight: 600;
          font-style: normal;
        }

        .footernav-adout-magazine-form {
          .block-footer-magazine {
            width: 100%;
            height: min(3.75vw, 72px);
            padding: var(--txt-18) min(0.52vw, 10px) var(--txt-19) min(1.3vw, 25px);
            font-size: var(--txt-20);
            line-height: calc(35 / 24);
            border: none;
            /*1px solid var(--color-gray02)*/
            border-radius: 0;

            &::placeholder {
              color: #d8d8d8;
            }
          }

          .block-footer-magazine--submit {
            width: 100%;
            height: 72px;
            background: var(--color-accent);
            font-size: var(--txt-24);
            font-weight: 500;
            line-height: calc(35 / 24);
            color: #fff;
            border-radius: 8px;
            margin-top: var(--txt-24);
          }
        }
      }
    }
  }

  .block-copyright {
    width: 100%;
    height: min(2.24vw, 43px);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: var(--txt-12);
    line-height: calc(60 / 12);
    margin: 0;
  }
}

.page-login .block-footernav-menu {
  border-top: 1px solid var(--color-gray);
}

/* カレンダー---- */
#js_calendar_replace {
  text-align: -webkit-center;

  div {
    padding-top: 0.2vw !important;
    padding-bottom: 0.5vw;
  }

  .pane-main {
    margin-top: 0;
  }
}
.info-calendar-item .pane-contents {
  margin-bottom: 0 !important;
}

.block-calendar {
  position: relative;
  top: unset;
  right: unset;
  width: 100%;
  height: auto;
  background: #fff;
  margin: auto;
  z-index: 5;
  text-align: center;
  /*padding: min(1.04vw, 20px) 0;*/
  padding: 1rem 2rem 1rem 1rem;
  color: #444;
}

.block-calendar-slide-area,
.block-calendar-month-area,
.block-calendar table {
  width: 90%;
}

.block-calendar-month-area,
.block-calendar-slide-area>table {
  margin-right: auto;
  margin-left: auto;
}

.block-calendar-slide-area-wrapper {
  display: flex;
  width: 100%;
  margin: auto;
  overflow-x: unset;
  /* max-height: 300px; */
  height: auto;
  justify-content: center;

  div:nth-child(2) {
    margin: auto 0.7vw;
  }
}

.block-calendar-slide-area {
  width: 100%;
  height: 100%;
  position: relative;
  left: 0.6vw;
  transition: 0.2s;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

.block-calendar-title {
  display: none;
  /*font-weight: bold;font-size: var(--txt-18);letter-spacing: 1px;*/
}

.block-calendar-month {
  letter-spacing: 1px;
  font-size: var(--txt-18);
}

.block-calendar-month b {
  display: inline-block;
  font-weight: normal;
  font-size: var(--txt-26);
  letter-spacing: 1px;
  padding-right: 3px;
}

.block-calendar-month-area {
  width: 100%;
  position: relative;
}

.block-calendar-prev,
.block-calendar-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  letter-spacing: 1px;
  font-size: var(--txt-14);
  cursor: pointer;
  transition: 0.3s;
}

.block-calendar-prev:hover,
.block-calendar-next:hover {
  opacity: 0.7;
}

.block-calendar-prev {
  display: none;
  left: 1rem;
  padding-left: 20px;
  background: url(../../img/usr/common/calendar_prev.svg) no-repeat left center / auto;
}

.block-calendar-next {
  right: 0;
  padding-right: 20px;
  background: url(../../img/usr/common/calendar_next.svg) no-repeat right center / auto;
}

.block-calendar table {
  width: 100%;
  text-align: center;
  margin: 0 auto;
}

.block-calendar table tr {
  width: auto;
  display: flex;
  justify-content: space-around;
}

.block-calendar table th {
  width: auto;
  text-align: center;
  padding: 2px 0;
  color: #ccc;
}

.block-calendar table th span {
  font-size: var(--txt-12);
}

.block-calendar table td {
  height: var(--txt-32);
  text-align: center;
  padding: 2px 0;
  vertical-align: middle;
}

.block-calendar table td span {
  display: inline-block;
  width: 1.5em;
  height: auto;
  aspect-ratio: 20/28;
  font-size: var(--txt-16);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.block-calendar table td span.closed {
  position: relative;
  color: #fff;
  background: var(--color-salmon);
  border-radius: 100px;
}

.block-calendar table td span.inquiry-closed {
  position: relative;
  background: #eee2cc;
  border-radius: 100px;
}

.block-calendar p {
  max-width: 308px;
  width: 100%;
  text-align: left;
  font-size: var(--txt-11);
  padding: 0 10px;
}

.block-calendar p span {
  color: var(--color-salmon);
}

/* コンテンツ共通 */
.page-top .pane-contents {
  margin-bottom: 128px;
}

/* タイトル */
/* .title,
  .block-accessory-list h2.block-accessory-list--name,
  div.block-recent-item--header,
  h2.block-recent-item--header {
    font-size: var(--txt-28);
    font-family: var(--font-family-serif);
    font-weight: 600;
    padding: 0 0 var(--txt-32);
    border: 0;
    text-align: center;
    margin: 0;
  } */
/* TOPタイトル */
.page-top .pane-contents h2 {
  font-size: var(--txt-28);
  font-family: var(--font-family-serif);
  font-weight: 600;
  margin: 0 0 var(--txt-32);
  border: 0;
  text-align: center;
  padding: 0;
  display: flex;
  justify-content: center;
  overflow: hidden;

  span {
    font-size: var(--txt-28);
    font-family: var(--font-family-serif);
    font-weight: 600;
    display: block;
    transform: translate(0, 105%);
    transition: transform cubic-bezier(0.215, 0.61, 0.355, 1) 0.5s;
  }
}

.page-top .pane-contents h2.-visible span {
  transform: translate(0, 0);
  transition-delay: calc(var(--delay) * 0.06s);
}




.container:not(:has(.block-header-logo)) {

  ul,
  li {
    list-style: none;
  }

  pre {
    display: inline;
  }

  /* 下線リンク */
  .link-under {
    text-decoration: underline;
  }

  /* ボタン */
  .btn-primary {
    font-size: var(--txt-24);
    padding: min(3.2vw, 14px) 0 var(--txt-16);
    max-width: 320px;
    margin-top: 40px;
  }

  .action .btn-primary {
    padding: min(3.2vw, 14px) 0 var(--txt-16);
  }

  .btn-primary:hover {
    background: var(--color-light-pink);
    opacity: 1;
  }


  /* NEWアイコン */
  figure:has(.badge) {
    position: relative;
  }

  .badge {
    position: absolute;
    top: -10px;
    right: -9px;
    display: grid;
    place-items: center;
    inline-size: 58px;
    block-size: 58px;
    border-radius: 50%;
    /* background: var(--color-accent);*/
    color: #fff;
    font-weight: 800;
    font-size: var(--txt-16);
    letter-spacing: 0.06em;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
    pointer-events: none;
    user-select: none;
  }

  /* 黒枠アイコン */
  .ico-frame {
    border: 1px solid var(--color-gray);
    padding: 3px 7px 1px;
    width: fit-content;
    font-size: var(--txt-16);
    background-color: white !important;
    color: var(--color-text) !important;
  }

  .block-goods-tag {
    display: flex;
    flex-wrap: wrap;
    gap: min(0.31vw, 6px);
    margin-bottom: min(0.31vw, 6px);
  }

  .product-name {
    font-size: var(--txt-18);
    /* font-family: var(--font-family-serif); */
    font-weight: normal;
    margin: 0 0 16px;
    padding: 0;
    border: 0;
  }

  .product-price {
    font-size: var(--txt-18);
  }

  /* チェックボックス */
  input[type="checkbox"] {
    width: 32px;
    height: 32px;
    background-image: url(../../img/usr/common/icon_check.svg);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    /* margin-right: 0;*/
    margin-right: 0.2em;
  }

  input[type="checkbox"]:checked {
    background-image: url(../../img/usr/common/icon_check_active.svg);
  }

  /* ラジオボタン */
  input[type="radio"] {
    background-image: url(../../img/usr/common/icon_radio.svg);
    width: 32px;
    height: 32px;
    -webkit-appearance: none;
    /* Chrome, Safari用 */
    -moz-appearance: none;
    /* Firefox用 */
    appearance: none;
    /* 標準プロパティ */
    /* margin-right: 0;*/
    margin-right: 0.4em;
  }

  input[type="radio"]:checked {
    background-image: url(../../img/usr/common/icon_radio_active.svg);
  }

  .block-order-method--payment-method-select li,
  .block-order-method--point-use-select li {
    margin: 12px 0 12px 0;
  }

  /*.default-price {display: none;}*/
}

.page-top .pane-contents h1.visually-hidden {
  display: none;
}

.pane-contents {

  ul,
  li {
    list-style: none;
  }

  pre {
    display: inline;
  }

  /* 下線リンク */
  .link-under {
    text-decoration: underline;
  }

  /* ボタン */
  .btn-primary {
    font-size: var(--txt-24);
    padding: min(3.2vw, 14px) 0 var(--txt-16);
    max-width: 320px;
    margin-top: 40px;
  }

  /* タイトル */
  .title,
  .block-accessory-list h2.block-accessory-list--name,
  div.block-recent-item--header {
    font-size: var(--txt-28);
    font-family: var(--font-family-serif);
    font-weight: 500;
    padding: 0 0 var(--txt-32);
    border: 0;
    text-align: center;
    margin: 0;
  }

  /* NEWアイコン */
  figure:has(.badge) {
    position: relative;
  }

  .badge {
    /*inline-size: 58px;block-size: 58px;*/
    pointer-events: none;
    user-select: none;
  }

  /* 黒枠アイコン */
  .ico-frame {
    border: 1px solid var(--color-gray);
    padding: 5px 9px 6px 8px;
    width: fit-content;
    font-size: var(--txt-12);

    +.product-name {
      margin-top: 8px;
    }
  }

  .block-goods-tag {
    display: flex;
    flex-wrap: wrap;
    gap: min(0.31vw, 6px);
    margin-bottom: min(0.31vw, 6px);
  }

  .product-name {
    font-size: var(--txt-18);
    font-family: var(--font-family-base);
    font-weight: 600;
    line-height: calc(24 / 18);
    margin: 0 0 min(0.83vw, 16px);
    padding: 0;
    border: 0;

    +.product-price {
      margin-top: 16px;
    }
  }

  .product-price {
    font-size: var(--txt-18);
  }

  /* チェックボックス */
  input[type="checkbox"] {
    width: 32px;
    height: 32px;
    background-image: url(../../img/usr/common/icon_check.svg);
    -webkit-appearance: none;
    /* Chrome, Safari用 */
    -moz-appearance: none;
    /* Firefox用 */
    appearance: none;
    /* 標準プロパティ */
    margin-right: 0;
  }

  input[type="checkbox"]:checked {
    background-image: url(../../img/usr/common/icon_check_active.svg);
  }

  .block-thumbnail-favorite {
    border: none;
    padding: 0;
    margin: 0;
    aspect-ratio: 28/24;
    width: 28px;
    height: 24px;
    background: none;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 2;
    cursor: pointer;

    .heart {
      width: 28px;
      height: 24px;
      display: block;
      background: url("../../img/usr/common/icon_bookmark01.svg") no-repeat center / contain;
    }

    &.is-active {
      .heart {
        background: url("../../img/usr/common/icon_bookmark02.svg") no-repeat center / contain;
      }
    }
  }

  /*.default-price {display: none;}*/
}

/* TOPリニューアルオープン動画 */
#top-special-pic {
  video {
    width: 100%;
  }
}

/* TOPスライダー */
#block_of_top_body {
  width: 100%;
  overflow: hidden;
  position: relative;
  background-color: var(--color-stone);
  padding: 24px 0 80px;

  & #top-slider-warp li img {
    aspect-ratio: 500 / 628;
  }

  & #top-slider-warp {
    overflow-y: visible;
    overflow-x: clip;

    &::before {
      content: "";
      aspect-ratio: 2561/299;
      width: min(133.39vw, 2561px);
      height: auto;
      display: block;
      background: url(../../img/usr/top/block_top_topic_bg.svg) center bottom / 100% no-repeat;
      position: absolute;
      bottom: min(9.64vw, 185px);
      left: 50%;
      transform: translateX(-50%);
      z-index: -1;
    }

    .swiper-pagination-bullets {
      bottom: -70px;
    }

    span.swiper-pagination-bullet {
      width: 16px;
      height: 16px;
      opacity: 1;
      margin: 0 6px;
      transition: width .4s ease;

      &::before {
        border-radius: 100vmax;
        background: #fff;
        border: 1px solid var(--color-accent);
      }
    }

    span.swiper-pagination-bullet-active {
      width: 42px;

      &::before {
        background-color: var(--color-accent);
        border-radius: 100vmax;
        border: 0;
      }
    }

    /* .swiper-pagination-bullets {
            left: 50%;
            bottom: -57px;
            gap: 18px;
            align-items: center;
            transform: translate(-50%, -50%);
        }

        span.swiper-pagination-bullet {
            width: 16px;
            height: 16px;
            aspect-ratio: 1/1;
            opacity: 1;
            margin: 0;
            background: #fff;
            border: 1px solid var(--color-accent);
            transition: width 0.4s ease;
            border-radius: 100vmax;

            &::before {
                border-radius: 100vmax;
                background-color: #fff;
                border: 1px solid var(--gray3--text-color);
            }
        }

        span.swiper-pagination-bullet-active {
            width: 42px;
            background-color: var(--color-accent);
            border-radius: 100vmax;

            &::before {
                background-color: var(--color-accent);
                border-radius: 100vmax;
                border: 0;
                width: 100%;
                height: 100%;
            }
        } */
  }

  .swiper-button-next,
  .swiper-button-prev {
    border: 1px solid var(--color-primary);
    background: var(--color-header-tag);
    aspect-ratio: 1/1;
    width: 52px;
    height: auto;
    border-radius: 50%;
    opacity: 0.8;

    &::after {
      color: var(--color-primary);
      font-size: var(--txt-15);
      font-weight: normal;
    }
  }

  .swiper-button-prev,
  .swiper-rtl .swiper-button-next {
    /* left: 0;*/
    left: min(2.08vw, 40px);
  }

  .swiper-button-next,
  .swiper-rtl .swiper-button-prev {
    /* right: 0;*/
    right: min(2.08vw, 40px);
  }

  .block-top-body--items {

    /*display: flex;justify-content: center;*/
    li {
      position: relative;
      width: min(26.04vw, 500px);
      height: auto;

      &::after {
        content: " ";
        width: 100%;
        height: 100%;
        background: #f6aa92;
        display: block;
        border-radius: 8px;
        position: absolute;
        top: 10px;
        left: 10px;
        z-index: -1;
      }
    }
  }

  .swiper-slide-lazy {
    width: min(500px, 80vw);
    flex-shrink: 0;
    transition: transform 0.4s ease;
  }

  /*.block-top-body--items {padding-left: min(124px,6vw);padding-right: min(124px,6vw);}*/
  /*.swiper-slide-active {transform: translateY(calc(-1 * min(20px,3vw)));}*/
  .swiper-slide-prev,
  .swiper-slide-next {
    transform: translateY(calc(1 * min(20px, 3vw)));
    transition: transform 0.4s ease;
  }

  /* スライダー起動していないとき */
  #top-slider-warp:not(.swiper) {
    #top-slider {
      display: flex;
      column-gap: 25px;
      padding-inline: 20px;
      margin-inline: 12px;
      justify-content: center;
      margin: 0 auto;

      li {
        max-width: 500px;
        flex-shrink: inherit;
      }
    }
  }
}

/* TOPカテゴリ */
/* ベース（このブロック内の共通フォント） */
.block-top-category {
  font-family: var(--font-family-base);
  color: var(--color-text);
  /* background-color: var(--main--background-color);*/
  padding-block: min(3.23vw, 62px) min(2.08vw, 40px);
}

/* 幅制御 */
.block-top-category__inner {
  max-width: 1100px;
  /*var(--container-width-s)*/
  /* 1121px */
  margin-inline: auto;
  padding-inline: 0;
  /*clamp(12px, 2vw, 24px)*/
  gap: min(1.04vw, 20px);
}

/* 見出し */
/*.block-top-category__title {text-align: center;font-weight: 700;font-family: var(--font-family-corp), var(--font-family-base);color: var(--color-primary);font-size: var(--txt-20);margin: 0 0 clamp(16px, 2.5vw, 28px);}*/
/* ===== リスト・グリッド ===== */
.block-top-category__list {
  /* トークン（必要ならここでサイズを調整） */
  --thumb-size-sp: 84px;
  /* SP 見た目サイズ */
  --thumb-size-pc: 120px;
  /* PC 見た目サイズ */
  --gap-sp: 16px;
  --gap-pc: 24px;
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--gap-sp);
}

@media (min-width: 769px) {
  .block-top-category__list {
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: var(--gap-pc);
  }
}

/* 各アイテム */
.block-top-category__item {
  text-align: center;
}

/* クリック領域（a）はグリッドで縦並び） */
.block-top-category__link {
  display: grid;
  justify-items: center;
  align-content: start;
  row-gap: 8px;
  text-decoration: none;
  color: inherit;
  transition: transform 0.15s ease, opacity 0.15s ease;
  will-change: transform;
}

.block-top-category__link:focus-visible {
  outline: 2px solid color-mix(in oklab, var(--color-primary) 65%, white);
  outline-offset: 3px;
  border-radius: 10px;
}

.block-top-category__link:hover {
  transform: translateY(-2px);
  opacity: 0.95;
}

/* ===== 画像（円形サムネイル） ===== */
.block-top-category__figure {
  margin: 0;
}

.block-top-category__img {
  display: block;
  inline-size: clamp(var(--thumb-size-sp), 10vw, var(--thumb-size-pc));
  /* height は HTML の width/height（160×160）によりアスペクト比維持。 */
  height: auto;
  /* border-radius: 50%;*/
  object-fit: cover;
  background: var(--tag-background-color);
  /* ローディング時の下地 */
  /* box-shadow:0 0 0 1px rgba(0, 0, 0, .06) inset,0 1px 2px rgba(0, 0, 0, .04);*/
}

/* ネイティブ Lazyload 中の演出（対応ブラウザのみ） */
.block-top-category__img[loading="lazy"] {
  filter: saturate(0.9) contrast(0.98);
}

/* ===== ラベル ===== */
.block-top-category__label {
  font-size: var(--txt-16);
  font-weight: 500;
  line-height: calc(24 / 16);
  color: var(--gray2--text-color);
  word-break: keep-all;
  letter-spacing: -0.064em;
}

/* 2行にしたい項目で <br> を入れた場合の中央寄せを安定化 */
.block-top-category__label br {
  content: "";
}

/* ===== 「ALL」バッジ（画像の代替） ===== */
.block-top-category__item--all .block-top-category__allBadge {
  display: grid;
  place-items: center;
  inline-size: clamp(var(--thumb-size-sp), 10vw, var(--thumb-size-pc));
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background: var(--color-grayish-ivory);
  /* うすい背景 */
  color: var(--accent--text-color);
  font-weight: 800;
  letter-spacing: 0.06em;
  font-size: var(--txt-14);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.06) inset, 0 1px 2px rgba(0, 0, 0, 0.04);
}

/* ===== 余白・セパレーター（任意） ===== */
.block-top-category--with-divider {
  border-block: 1px solid var(--sub---color);
}

/* ===== 768px 未満の細かな調整 ===== */
@media (max-width: 768.98px) {

  /*.block-top-category__title {font-size: var(--txt-18);}*/
  .block-top-category__label {
    font-size: var(--txt-11);
  }
}

/* ===== ハイコントラスト・強制ダーク（OS設定を尊重し軽微に調整） ===== */
@media (prefers-contrast: more) {
  .block-top-category__link:focus-visible {
    outline-color: var(--color-accent);
  }
}

/* TOPおすすめ */
.block-top-recommend {
  font-family: var(--font-family-base);
  color: var(--color-text);
  /* background-color: var(--main--background-color);*/
  padding-block: min(2.08vw, 40px);

  .block-top-recommend__inner {
    max-width: var(--container-width);
    margin-inline: auto;
    padding-inline: clamp(12px, 2vw, 24px);
  }

  .movie {
    position: relative;
    margin: 0 auto;
  }

  .movie video {
    width: 100%;
  }

  img {
    height: auto;
  }

  .block-top-recommend__heroRow .play-btn,
  .block-top-recommend__heroRow .stop-btn {
    width: 48px;
    position: absolute;
    top: 20px;
    right: 20px;
    cursor: pointer;
    background: 0;
  }

  /* 停止中 */
  .block-top-recommend__heroRow .play-btn {
    display: block;
  }

  .block-top-recommend__heroRow .stop-btn.stopActive {
    display: none;
  }

  /* 再生中 */
  .block-top-recommend__heroRow .play-btn.playActive {
    display: none;
  }

  .block-top-recommend__heroRow .stop-btn {
    display: block;
  }

  .block-top-recommend__hero--main .block-top-recommend__name {
    font-size: var(--txt-24);
  }

  /* ===== まとめてgrid ===== */
  .block-top-recommend__heroRow {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-template-rows: 1fr auto auto;
    row-gap: 35px;
    width: 100%;
    padding-right: 13px;
  }

  /* 子要素の共通スタイル（プレースホルダー） */
  .block-top-recommend__hero--main,
  .block-top-recommend__hero {
    width: 100%;
    height: 100%;
  }

  /* 左上ヒーロー動画大 */
  .block-top-recommend__hero--main {
    grid-column: 1 / span 6;
    grid-row: 1 / span 2;
    padding-right: 23px;
    padding-left: 13px;
    position: relative;

    iframe {
      width: 100%;
      height: auto;
      aspect-ratio: 1 / 1;
    }
  }

  .block-top-recommend__hero--link {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 1;
  }

  /* 右上カード中 */
  .block-top-recommend__hero:nth-of-type(1) {
    grid-column: 7 / span 3;
    grid-row: 1 / span 1;
    padding-right: 11px;
    padding-left: 13px;
  }

  .block-top-recommend__hero:nth-of-type(2) {
    grid-column: 10 / span 3;
    grid-row: 1 / span 1;
    padding-left: 26px;
  }

  /* 右上カード小 */
  .block-top-recommend__hero:nth-of-type(3) {
    grid-column: 7 / span 2;
    grid-row: 2 / span 1;
    padding-left: 13px;
  }

  .block-top-recommend__hero:nth-of-type(4) {
    grid-column: 9 / span 2;
    grid-row: 2 / span 1;
    padding-left: 13px;
  }

  .block-top-recommend__hero:nth-of-type(5) {
    grid-column: 11 / span 2;
    grid-row: 2 / span 1;
    padding-left: 13px;
  }

  /* 下段カード小 */
  .block-top-recommend__hero:nth-of-type(6) {
    grid-column: 1 / span 2;
    grid-row: 3 / span 1;
    padding-left: 13px;
  }

  .block-top-recommend__hero:nth-of-type(7) {
    grid-column: 3 / span 2;
    grid-row: 3 / span 1;
    padding-left: 13px;
  }

  .block-top-recommend__hero:nth-of-type(8) {
    grid-column: 5 / span 2;
    grid-row: 3 / span 1;
    padding-left: 13px;
  }

  .block-top-recommend__hero:nth-of-type(9) {
    grid-column: 7 / span 2;
    grid-row: 3 / span 1;
    padding-left: 13px;
  }

  .block-top-recommend__hero:nth-of-type(10) {
    grid-column: 9 / span 2;
    grid-row: 3 / span 1;
    padding-left: 13px;
  }

  .block-top-recommend__hero:nth-of-type(11) {
    grid-column: 11 / span 2;
    grid-row: 3 / span 1;
    padding-left: 13px;
  }

  & .block-top-recommend__heroRow.block-top-recommend__heroRow--split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    grid-auto-flow: row;
    column-gap: clamp(16px, 2.5vw, 36px);
    row-gap: 24px;
    padding-right: 13px;
    padding-left: 13px;
  }

  & .block-top-recommend__heroRow--split>.block-top-recommend__col {
    grid-column: auto;
    grid-row: auto;
    padding: 0;
    width: 100%;
  }

  & .block-top-recommend__heroRow.block-top-recommend__heroRow--bottom {
    display: block;
    grid-template-columns: none;
    grid-template-rows: none;
    margin-top: clamp(20px, 2.5vw, 35px);
    padding-right: 13px;
    padding-left: 13px;
  }

  & .block-top-recommend__heroRow--bottom>.forcms_block {
    width: auto;
    grid-column: auto;
    grid-row: auto;
  }

  & .block-top-recommend__col img,
  & .block-top-recommend__col picture,
  & .block-top-recommend__col video,
  & .block-top-recommend__col iframe,
  & .block-top-recommend__heroRow--bottom img,
  & .block-top-recommend__heroRow--bottom picture,
  & .block-top-recommend__heroRow--bottom video,
  & .block-top-recommend__heroRow--bottom iframe {
    max-width: 100%;
    height: auto;
    display: block;
  }

  @media (max-width: 768px) {
    & .block-top-recommend__heroRow.block-top-recommend__heroRow--split {
      grid-template-columns: 1fr;
      row-gap: 16px;
    }

    /
  }

  /* ===== 上段：ヒーロー（PCは2カラム） ===== */
  /*&.block-top-recommend__heroRow {display: grid;grid-template-columns: 1fr 1fr;align-items: start;}*/
  &.block-top-recommend__hero {
    display: block;
    text-decoration: none;
    color: inherit;

    &:focus-visible {
      outline: 2px solid color-mix(in oklab, var(--color-primary) 65%, white);
      outline-offset: 4px;
      border-radius: 8px;
    }
  }

  /*&.block-top-recommend__heroAside {display: grid;grid-template-columns: 1fr;grid-template-columns: repeat(6, 1fr);gap: 36px 16px;margin-left: 36px;&.block-top-recommend__hero {&:nth-child(1) {margin-right: 10px;}&:nth-child(2) {margin-left: 10px;}&:nth-child(-n+2) {grid-column: span 3;}&:nth-child(n+3) {grid-column: span 2;}}}*/
  &.block-top-recommend__figure {
    margin: 0;

    & picture,
    & img {
      display: block;
      width: 100%;
      height: auto;
      /* HTML width/height により比率維持（CLS対策） */
      /* background: var(--tag-background-color);*/
      object-fit: cover;
    }

    & picture {
      position: relative;
    }
  }

  & .block-top-recommend__caption {
    margin-top: 6px;
    font-size: var(--txt-12);
    color: var(--color-text);
    line-height: 1.5;
  }

  /* ===== 下段：商品グリッド（PC=4列） ===== */
  & .block-top-recommend__list {
    --gap: 26px;
    list-style: none;
    margin: clamp(16px, 2.5vw, 24px) 0 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: var(--gap);
  }

  & .block-top-recommend__item {
    background: #fff;
    border-radius: 6px;
    overflow: hidden;

    &>a {
      display: grid;
      grid-template-rows: auto 1fr;
      text-decoration: none;
      color: inherit;
      transition: transform 0.15s ease, opacity 0.15s ease;

      &:hover {
        transform: translateY(-2px);
        opacity: 0.97;
      }
    }
  }

  & .block-top-recommend__thumb {
    margin: 0;

    & picture,
    & img {
      display: block;
      width: 100%;
      height: auto;
      background: var(--tag-background-color);
      object-fit: cover;
    }
  }
}

/* TOPキャンペーンバナー */
.block-top-campaign {
  background: #fff;

  .block-bottom-bnr__list {
    max-width: 1130px;
  }

  .block-bottom-bnr__list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
    margin: 0 auto;
  }
}

/* TOP読み物 */
.block-top-reading {
  font-family: var(--font-family-base);
  color: var(--color-text);
  /* background: url(../../img/usr/top/read_bg.png) 0px bottom / 100% no-repeat;*/
  padding-block: 63px 80px;
  margin-bottom: 63px;
  position: relative;
  overflow: hidden;

  &::before {
    content: "";
    width: 86.04vw;
    height: auto;
    max-height: 980px;
    background: url(../../img/usr/top/read_bg01.svg) repeat-x top left/ 100%;
    aspect-ratio: 1652/697;
    display: block;
    position: absolute;
    left: calc(50% - 36.04vw);
    bottom: min(8.39vw, 161px);
    border-radius: 18.75vw 0 0 18.75vw;
    z-index: -1;
  }

  &::after {
    content: "";
    width: min(26.98vw, 518px);
    height: auto;
    aspect-ratio: 518/455;
    max-height: 980px;
    background: url(../../img/usr/top/read_bg02.svg) repeat-x top left/ 100%;
    aspect-ratio: 518/455;
    display: block;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(min(527px, 27.45vw));
    z-index: -1;
  }

  .block-top-reading-title {
    padding-bottom: min(1.81vw, 35px);
  }

  .block-top-reading__titleIcon {
    display: inline-block;
    margin-right: 12px;
    width: 42px;
    height: 40px;
    vertical-align: bottom;
    background: url(../../img/usr/common/icon_read.svg) no-repeat center center / 100%;
  }

  & .block-top-reading__inner {
    /* max-width: var(--container-width-s);*/
    margin-inline: auto;

    /* padding-inline: clamp(12px, 2vw, 24px);*/
    .swiper-button-next,
    .swiper-button-prev {
      /* border: 1px solid var(--color-primary);*/
      background: #f6aa92;
      aspect-ratio: 1/1;
      width: 52px;
      height: auto;
      border-radius: 50%;
      opacity: 0.8;
      top: 50%;

      &::after {
        color: #fff;
        font-size: var(--txt-15);
        font-weight: normal;
      }
    }

    .swiper-button-prev,
    .swiper-rtl .swiper-button-next {
      /* left: 0;*/
      left: min(3.33vw, 64px);
    }

    .swiper-button-next,
    .swiper-rtl .swiper-button-prev {
      /* right: 0;*/
      right: min(3.33vw, 64px);
    }
  }

  /*& .block-top-reading__title {text-align: center;color: var(--color-primary);font-weight: 700;font-size: var(--txt-20);margin: 0 0 clamp(16px, 2.5vw, 24px);display: grid;place-items: center;& .block-top-reading__titleIcon {font-size: 1em;margin-right: .4em;}}*/
  /* ===== 上：カード横並び（暫定グリッド） ===== */
  & .block-top-reading__swiper {
    /* Swiper 導入時は .swiper / .swiper-wrapper / .swiper-slide に置換 */
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: min(2.6vw, 50px);
    padding-bottom: 6px;
  }

  & .block-top-reading__card {
    background: #fff;
    overflow: hidden;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
    /* aspect-ratio: 300/467; */
    /* min-width: 300px;*/
    /* width: min(15.63vw, 300px); */
    flex-shrink: 0;
    border-radius: 6px;

    &>a {
      display: grid;
      grid-template-rows: auto 1fr;
      text-decoration: none;
      color: inherit;
      transition: transform 0.15s ease, opacity 0.15s ease;

      &:hover {
        transform: translateY(-2px);
        opacity: 0.97;
      }

      &:focus-visible {
        outline: 2px solid color-mix(in oklab, var(--color-primary) 65%, white);
        outline-offset: 3px;
        border-radius: 8px;
      }
    }
  }

  & .block-top-reading__figure {
    position: relative;
    margin: 0;
    /* aspect-ratio: 1 / 1; */
    display: flex;
    align-items: center;
    background-color: var(--color-light-pink);

    & .block-top-reading__img {
      display: block;
      width: 100%;
      height: auto;
      object-fit: cover;
      background: var(--color-grayish-ivory);
    }

    /* ラベル（左上） */
    & .block-top-reading__label {
      position: absolute;
      left: 0;
      top: min(2.07vw, 40px);
      display: inline-grid;
      place-items: center;
      /* padding: 4px 8px; */
      /* border-radius: 6px;*/
      background: var(--color-accent);
      color: #fff;
      font-size: var(--txt-18);
      line-height: calc(20 / 18);
      letter-spacing: 0.04em;
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
      /* width: min(2.07vw, 40px); */
      min-height: 138px;
      font-weight: 700;
      /* clip-path: polygon(20px 0%, 100% 0%, 100% calc(100% - 20px), calc(100% - 20px) 100%, 0% 100%, 0% 20px);*/
      border-start-start-radius: 8px;
      border-start-end-radius: 8px;
      /* corner-shape: bevel;*/
      writing-mode: vertical-rl;
      display: none !important;

      .genre_filter_category {
        padding: 8px 8px;
        font-size: 1.4rem;
      }

      .master_node > li > ul.item_node >li:nth-of-type(n+2) {
        display: none;
      }
      .master_node > li > ul.item_node >li:nth-of-type(1) > ul {
          display: none;
      }
      .master_node > li > ul.item_node >ul.child_genre_item {
        display: none;
      }
    }
  }

  & .block-top-reading__meta {
    padding: 16px 22px 7px;
  }

  & .block-top-reading__name {
    font-size: var(--txt-16);
    /* color: var(--color-primary);*/
    font-family: var(--font-family-base);
    line-height: calc(24 / 16);
    padding: 0;
    margin: 0 0 25px;
    font-weight: 600;
    border: 0;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }

  & .block-top-reading__info {
    font-size: var(--txt-16);
    line-height: calc(24 / 16);
    color: var(--color-gray02);
    display: flex;
    flex-wrap: wrap;

    .genre_filter_category {
      .item_node {
        .child_genre_item {
          display: none;
        }
      }
    }
  }

  & .block-top-reading__date {
    font-size: var(--txt-16);
    line-height: calc(24 / 16);
    color: var(--color-gray02);
  }

  /* ===== 下：バナー ===== */
  & .block-top-reading__banners {
    display: grid;
    gap: 16px;
    margin: 80px auto 0;
    max-width: 720px;
  }

  & .block-top-reading__bnr {
    margin: 0;

    & .block-top-reading__bnrImg {
      display: block;
      width: 100%;
      height: auto;
      object-fit: cover;
      /* バナーは cover / contain はデザインに合わせて変更可 */
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    }

    & .block-top-reading__bnrCaption {
      display: none;
      margin-top: 24px;
      font-size: var(--txt-16);
      color: var(--accent--text-color);
      text-align: center;
      font-weight: 500;
    }
  }
}

/* TOPニュース */
.block-top-topic {
  padding-block: 64px;

  .block-top-topic--body {
    padding: 0;
    background: initial;
    position: relative;
    width: 100%;
    overflow: hidden;

    &::before {
      content: "";
      aspect-ratio: 2561/299;
      width: min(133.39vw, 2561px);
      height: auto;
      display: block;
      background: url(../../img/usr/top/block_top_topic_bg.svg) center bottom / 100% no-repeat;
      position: absolute;
      bottom: min(1.3vw, 25px);
      left: 50%;
      transform: translateX(-50%);
      z-index: -1;
    }

    .block-top-topic--next-page a {
      width: auto;
      max-width: 320px;
    }
  }

  .block-top-topic--content {
    max-width: 798px;
    margin: 0 auto;
  }

  /*.block-top-topic--header {.title {}}*/
  .block-top-topic--body {
    .block-topic--items {
      /* width: max-content;*/
      max-width: 408px;
      margin: 0 auto;

      dl {
        /* display: flex;*/
      }

      &>li {
        padding: 0;
        border-bottom: 0;

        +li {
          padding-top: 28px;
        }
      }
    }
  }

  .block-top-topic--comment {
    font-size: var(--txt-16);
    font-weight: 500;
  }
}

ul.block-topic--items>li dd .block-top-topic--icon-image img {
  margin-right: 8px;
}

body ul.block-topic--items>li dt,
.page-brandtop ul.block-topic--items>li dt,
.page-category ul.block-topic--items>li dt {
  /* width: 107px; */
  font-size: var(--txt-14);
  margin: 0;
  color: var(--gray3--text-color);
  /* font-weight: 500; */
}

body ul.block-topic--items>li dt {
  font-size: var(--txt-16);
  line-height: calc(24 / 16);
  color: var(--color-gray02);
}

/* TOP中間横長バナー */
.block-top-middle-bnr {
  padding-block: 64px;

  a {
    display: block;
    margin: 0 auto;
    width: fit-content;
  }
}

/* TOPビデオ */
.block-top-video {
  .block-top-video-inner {
    /* width: min(58.44vw,1122px);*/
    max-width: 1122px;
    margin-inline: auto;
    display: grid;
    grid-template-columns: 1fr 412px;
    gap: 0;
    border-radius: 8px;
    /* overflow: hidden;*/
    position: relative;
    z-index: 0;
    background: var(--color-primary);

    &::after {
      content: "";
      width: min(29.64vw, 569px);
      height: auto;
      aspect-ratio: 1/1;
      position: absolute;
      bottom: -313px;
      top: min(10.36vw, 99px);
      left: min(-11.89vw, -113px);
      /* top: min(5.36vw, 103px);
      left: min(-15.89vw, -305px); */
      display: block;
      background: url(../../img/usr/top/dryfood_tsubu.png) no-repeat left center / 100%;
      z-index: -1;
    }
  }

  .block-top-video-videoarea {
    /* width: min(36.98vw,710px);*/
    width: 100%;
    height: auto;
    display: flex;

    aspect-ratio: 16 / 9;
    /* aspect-ratio: 710/399; */

    video {
      width: 100%;
    }
  }

  .block-top-video-textarea {
    /* aspect-ratio: 412/399;*/
    width: 100%;
    height: auto;
    background: var(--color-primary);
    padding: min(1.67vw, 32px) min(1.41vw, 27px);
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    row-gap: 12px;

    * {
      color: #fff;
      text-align: center;
    }

    .block-top-video-title {
      font-size: var(--txt-40);
      font-weight: bold;
      font-family: var(--font-family-base);
      letter-spacing: -0.03em;
      line-height: calc(48 / 40);
      padding: 0;
      border: none;
    }

    .block-top-video-subtitle {
      font-size: var(--txt-40);
      font-weight: 300;
      font-family: var(--font-family-serif);
      letter-spacing: -0.03em;
      line-height: calc(45 / 40);
    }

    .block-top-video-text {
      font-size: var(--txt-16);
      line-height: calc(24 / 16);
      letter-spacing: -0.03em;
    }

    .block-top-video {
      width: 240px;
      height: 55px;
      display: flex;
      align-items: center;
      justify-content: center;
    }
  }

  .btn.btn-arrow {
    background: var(--color-primary);
    border: 1px solid var(--main--background-color);
    color: var(--main--background-color);
    max-width: 240px;
    font-size: var(--txt-16);
    font-family: var(--font-family-base);

    & span {
      display: inline-block;
      margin-left: 5px;
      width: 22px;
      height: 14px;
      background: url(../../img/usr/common/icon_arrow_white.svg) no-repeat center center / 100%;
    }

    &.btn-primary:hover {
      background: var(--color-primary);
      color: var(--main--background-color);
      opacity: .95;
    }
  }
}

/* TOPランキング */
/* =========================================================
block-top-event
========================================================= */
.block-top-event:not(.block-top-newitem) {
  font-family: var(--font-family-base);
  color: var(--color-text);
  background-color: var(--color-ranking-bg);
  padding-block: 80px 0;
  margin-block: 64px;

  /* & .block-top-title {text-align: center;font-weight: 700;color: var(--color-primary);margin: 0 0 clamp(16px, 2.5vw, 24px);font-size: var(--txt-20);& > span {display: block;margin-top: 4px;font-size: var(--txt-12);color: var(--gray2--text-color);font-weight: 400;}}*/
  /* ===== ランキング ===== */
  & .block-top-ranking--items {
    /* PC：ランキング 1&#12316;5 の視線誘導グリッド */
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: 1fr auto;
    /* grid-template-columns: repeat(3, minmax(0, 1fr));*/
    gap: 53px 51px;
  }

  & .block-top-ranking--item {
    border-radius: 10px;
    overflow: visible;

    &>a {
      display: grid;
      grid-template-columns: 1fr 1fr;
      /* text-decoration: none;color: inherit;transition: transform .15s ease, opacity .15s ease;&:hover {transform: translateY(-2px);opacity: .97;}&:focus-visible {outline: 2px solid color-mix(in oklab, var(--color-primary) 65%, white);outline-offset: 4px;border-radius: 10px;}*/
    }

    /* 1段目の要素は6列中3列分にする */
    &:nth-child(-n + 2) {
      grid-column: span 3;
    }

    /* 2段目の要素は6列中2列分にする */
    &:nth-child(n + 3) {
      grid-column: span 2;
    }
  }

  & .block-top-ranking--goods-image {
    position: relative;
    /* aspect-ratio: 200 / 263; */

    & figure {
      margin: 0;
      aspect-ratio: 200 / 263;
      background: var(--main--background-color);
      display: grid;
      place-items: center;
    }

    & img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: contain;
    }

    /* ランクバッジ（左上） */
    & .block-top-ranking--rank {
      position: absolute;
      top: -18px;
      left: -18px;
      z-index: 1;
      display: flex;
      justify-content: center;
      align-items: center;
      width: 50px;
      height: 50px;
      color: var(--color-wine);
      font-family: var(--font-family-corp);
      font-size: var(--txt-24);

      &::after {
        content: "";
        position: absolute;
        left: 0px;
        top: 0px;
        width: 50px;
        height: 50px;
        background: url(../../img/usr/common/ranking_bg_rank.svg) no-repeat center center / 100%;
        display: grid;
        place-items: center;
        z-index: -1;
      }
    }

    & .block-top-ranking--rank-1 {
      color: var(--main--background-color);

      &::after {
        background: url(../../img/usr/common/ranking_bg_rank1.svg) no-repeat center center / 100%;
      }
    }

    /* 1位を強調 */
    /* & .block-top-ranking--rank-2 {background: #7a7a7a;}& .block-top-ranking--rank-3 {background: #a5753a;}*/
  }

  & .block-top-ranking--item {
    &:first-child {
      & .block-top-ranking--goods-image {
        & .block-top-ranking--rank {
          &::after {
            background: url(../../img/usr/common/rank_wheels1.gif) no-repeat center center / 100%;
          }
        }
      }
    }

    &:nth-child(2) {
      & .block-top-ranking--goods-image {
        & .block-top-ranking--rank {
          &::after {
            background: url(../../img/usr/common/rank_wheels2.gif) no-repeat center center / 100%;
          }
        }
      }
    }

    &:nth-child(3) {
      & .block-top-ranking--goods-image {
        & .block-top-ranking--rank {
          &::after {
            background: url(../../img/usr/common/rank_wheels3.gif) no-repeat center center / 100%;
          }
        }
      }
    }

    &:nth-child(4) {
      & .block-top-ranking--goods-image {
        & .block-top-ranking--rank {
          &::after {
            background: url(../../img/usr/common/rank_wheels4.gif) no-repeat center center / 100%;
          }
        }
      }
    }

    &:nth-child(5) {
      & .block-top-ranking--goods-image {
        & .block-top-ranking--rank {
          &::after {
            background: url(../../img/usr/common/rank_wheels5.gif) no-repeat center center / 100%;
          }
        }
      }
    }
  }

  & .block-top-ranking--description {
    padding: 10px 10px 12px;

    & .block-icon {
      margin-bottom: 6px;
    }

    & .block-top-ranking--goods-name {
      font-size: var(--txt-18);
      font-weight: 500;
      color: var(--color-text);
      line-height: 1.5;
      margin: 0 0 24px;
    }

    & .variation-name {
      font-size: var(--txt-11);
      color: var(--gray2--text-color);
    }

    & .block-top-ranking--price-infos {
      margin-top: 4px;

      & .block-top-ranking--price-items {
        display: grid;
        row-gap: 2px;

        & .block-top-ranking--price {
          font-size: var(--txt-20);
          color: var(--color-text);
        }

        & .block-top-ranking--default-price {
          font-size: var(--txt-11);
          color: var(--gray--text-color);
          text-decoration: line-through;
        }
      }
    }
  }

  /* PCのレイアウト（1位を広く） */
  /* & .block-top-ranking--goods-rank-1 {grid-column: 1 / 2;grid-row: 1 / 3;}& .block-top-ranking--goods-rank-2 {grid-column: 2 / 3;grid-row: 1 / 2;}& .block-top-ranking--goods-rank-3 {grid-column: 3 / 4;grid-row: 1 / 2;}& .block-top-ranking--goods-rank-4 {grid-column: 2 / 3;grid-row: 2 / 3;}& .block-top-ranking--goods-rank-5 {grid-column: 3 / 4;grid-row: 2 / 3;}*/
  /* もっとみる */
  & .block-top-event__more {
    margin-top: 50px;
    position: relative;
  }

  .block-top-event__button {
    margin-top: 0;
    position: absolute;
    z-index: 1;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
  }

  /* ランキング波アニメーション */
  .wave-top {
    background-color: inherit !important;
  }


  /* & .block-top-event__button {display: inline-grid;place-items: center;padding: 10px 20px;border: 1px solid var(--color-primary);color: var(--color-primary);background: transparent;border-radius: 999px;font-size: var(--txt-12);text-decoration: none;&:hover {background: var(--color-primary);color: #fff;}}*/
  /* ===== NEW ITEM ===== */
  & .block-thumbnail-t--items {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 16px;
  }

  & .block-thumbnail-t--item {
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
    list-style: none;

    &>a {
      display: grid;
      grid-template-rows: auto 1fr;
      text-decoration: none;
      color: inherit;
      transition: transform 0.15s ease, opacity 0.15s ease;

      &:hover {
        transform: translateY(-2px);
        opacity: 0.97;
      }
    }

    .block-thumbnail-t--price-infos {
      .block-thumbnail-t--scomment {
        font-size: var(--txt-12);
        color: var(--color-primary);
      }
    }
  }

  & .block-thumbnail-t--goods-image {
    & figure {
      margin: 0;
      aspect-ratio: 1 / 1;
      /*background: var(--color-grayish-ivory);*/
      background: var(--main--background-color);
      display: grid;
      place-items: center;
    }

    & img {
      width: 100%;
      height: 100%;
      object-fit: contain;
      display: block;
    }
  }

  & .block-thumbnail-t--goods-description {
    padding: 10px;

    & .block-thumbnail-t--goods-name {
      font-size: var(--txt-13);
      color: var(--color-primary);
      line-height: 1.5;
      margin: 0 0 4px;
      font-weight: 600;
    }

    & .variation-name {
      font-size: var(--txt-11);
      color: var(--gray2--text-color);
    }

    & .block-thumbnail-t--price-infos {
      margin-top: 4px;

      & .block-thumbnail-t--price-items {
        display: grid;
        row-gap: 2px;

        & .block-thumbnail-t--price {
          font-size: var(--txt-12);
          color: var(--color-text);
          font-weight: 600;
        }

        & .block-thumbnail-t--default-price {
          font-size: var(--txt-11);
          color: var(--gray--text-color);
          text-decoration: line-through;
        }
      }
    }
  }
}

/* ランキング波アニメーション */

/* TOP新商品 */
.page-top {
  .block-top-newitem {
    font-family: var(--font-family-base);
    color: var(--color-text);
    background: var(--main--background-color);
    padding-block: 64px;

    & div.block-top-event--goods {
      max-width: var(--container-width);
      margin-inline: auto;
    }

    .block-thumbnail-t {
      margin: 0;
      overflow: clip;
      overflow-y: visible;
    }

    .block-thumbnail-t--items {
      margin-bottom: 0;
    }

    .block-thumbnail-t--items.swiper-wrapper .block-thumbnail-t--item {
      padding: 0;
    }

    /* .block-thumbnail-t--goods-image {
      figure {
        background-color: var(--color-pager-current) !important;
      }
    } */

    /* .block-thumbnail-t--items.swiper-wrapper {
      column-gap: 26px;
		}
		*/
  }
}

/* .page-top {
  .block-top-newitem {
    font-family: var(--font-family-base);
    color: var(--color-text);
    background: var(--main--background-color);
    padding-block: 64px;

    & div.block-top-event--goods {
      max-width: var(--container-width);
      margin-inline: auto;
    }

    .block-thumbnail-t {
      margin: 0;
      overflow: clip;
      overflow-y: visible;
    }

    .block-thumbnail-t--items {
      margin-bottom: 0;
    }

    .block-thumbnail-t--items.swiper-wrapper .block-thumbnail-t--item {
      padding: 0;
    }

    .block-thumbnail-t--goods-image {
      figure {
        background-color: var(--color-pager-current) !important;
      }
    }

    &.block-top-event .block-top-event--goods .swiper-button-prev::after,
    &.block-top-event .block-top-event--goods .swiper-button-next::after {
      display: none;
    }
  }
} */

/* TOPレビュー */
.block-top-review {
  font-family: var(--font-family-base);
  color: var(--color-text);
  background: var(--main--background-color);
  padding-block: 64px;
  position: relative;

  &::before {
    content: "";
    aspect-ratio: 1920/158;
    width: 100%;
    height: auto;
    display: block;
    background: url(../../img/usr/top/top_review_bg.svg) center center / 100% no-repeat;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
  }

  /* リボン */
  .block-top-review__ribbon span {
    background: var(--color-conversion);
    color: #fff;
    padding: 1px 17px;
    font-weight: 500;
    font-size: var(--txt-24);
    font-family: var(--font-family-serif);
    line-height: 36px;
    pointer-events: none;
    box-decoration-break: clone;
    border-radius: 0 16px 0 0;
  }

  /* 四角い画像（332x318） */
  & .block-top-review__figure {
    position: relative;
    margin: 0;

    & .block-top-review__img {
      display: block;
      width: 100%;
      height: auto;
      /* 332x318（HTML属性）でCLS対策 */
      object-fit: cover;
      /* 写真はビジュアル重視 */
      background: var(--color-grayish-ivory);
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05) inset;
    }

    /* 右上チップ */
    & .block-top-review__chip {
      position: absolute;
      right: 8px;
      top: 8px;
      background: #ffffffd9;
      color: var(--color-primary);
      font-size: var(--txt-10);
      padding: 4px 6px;
      border-radius: 6px;
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
      text-align: center;
      line-height: 1.2;
      white-space: nowrap;
    }
  }

  /* カード本体 */
  & .block-top-review__card {
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-top: none;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    position: relative;
  }

  & .block-top-review__cardcontainer {
    /* margin-left: -13px;margin-top: -13px;*/
    position: relative;

    .block-top-review__ribbon {
      position: absolute;
      bottom: calc(100% - min(1.15vw, 22px));
      left: 0;
    }
  }

  & .block-top-review__cardinner {
    display: grid;
    grid-template-columns: 1fr min(4.79vw, 92px);
    column-gap: min(1.2vw, 23px);
    padding: min(2.19vw, 42px) min(0.52vw, 10px) min(0.83vw, 16px) min(0.94vw, 18px);

    .block-top-review__top {
      display: flex;
      flex-wrap: wrap;
      align-items: flex-start;
      position: relative;
    }
  }

  & .block-top-review__excerpt {
    margin: 0;
    font-size: var(--txt-16);
    line-height: calc(24 / 16);
    color: var(--color-text);
    text-align: justify;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
  }

  & .block-top-review__bottom {
    display: grid;
    grid-template-rows: 102px auto;
    column-gap: 10px;
    align-items: center;
  }

  /* 丸い画像（102x102） */
  & .block-top-review__avatarWrap {
    margin: 0;
    display: grid;
    place-items: center;
  }

  & .block-top-review__avatar {
    display: block;
    width: min(4.79vw, 92px);
    height: auto;
    aspect-ratio: 1/1;
    border-radius: 50%;
    object-fit: cover;
    /* 小さな丸は cover が映える */
    background: var(--color-gray);
  }

  & .block-top-review__meta {
    display: grid;
    row-gap: 4px;

    & .block-top-review__prodName {
      /* margin-top: min(0.36vw,7px);*/
      font-size: var(--txt-12);
      color: #333;
      line-height: calc(16 / 12);
    }

    & .block-top-review__rating {
      margin: 0;
      font-size: var(--txt-11);
      color: var(--gray2--text-color);
      position: absolute;
      display: block;
      bottom: 0;
      left: 0;

      & .block-top-review__star {
        color: #ce931d;
        margin-right: 2px;
        position: absolute;
        bottom: 0;
        left: 0;
      }
    }
  }

  .block-top-review__inner {
    .swiper-button-prev {
      position: absolute;
    }
  }

  .block-top-review__swiper {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: min(2.6vw, 50px);
    padding-bottom: 6px;
  }

  .block-top-review__item {
    width: min(15.63vw, 300px);
    flex-shrink: 0;
  }

  .swiper-button-next,
  .swiper-button-prev {
    /* border: 1px solid var(--color-primary);*/
    background: #f6aa92;
    aspect-ratio: 1/1;
    width: 52px;
    height: auto;
    border-radius: 50%;
    opacity: 0.8;

    &::after {
      color: #fff;
      font-size: var(--txt-15);
      font-weight: normal;
    }
  }

  .swiper-button-prev,
  .swiper-rtl .swiper-button-next {
    /* left: 0;*/
    left: min(3.33vw, 64px);
  }

  .swiper-button-next,
  .swiper-rtl .swiper-button-prev {
    /* right: 0;*/
    right: min(3.33vw, 64px);
  }
}

/* TOPtamaオリジナル */
/* .block-tama-original {background-color: var(--color-light-pink);padding-top: 64px;margin-block: 64px;.block-tama-original__title {color: var(--color-text);}.block-tama-original__slider {max-width: 1540px;margin: 0 auto;}.block-tama-original__list:not(.swiper-wrapper) {display: flex;justify-content: center;max-width: 1550px;margin: 0 auto;gap: 24px;list-style: none;.block-tama-original__item {width: 500px;}}img {height: auto;}.block-tama-original__txt {color:var(--color-text);margin-top: 16px;}.block-tama-original__more {background: linear-gradient(180deg, var(--color-light-pink) 0%, var(--color-light-pink) 50%, #fff 50%, #fff 100%);.btn-primary {margin-top: 32px;}}}*/
/* TOPPOCHIオリジナル */
.block-tama-original {
  background-color: var(--color-light-pink);
  padding-top: 64px;
  margin-block: 64px;

  a {
    transition: all 0.4s;

    &:hover {
      opacity: 0.6;
    }
  }

  .block-tama-original__title {
    color: var(--color-text);
  }

  .block-tama-original__slider {
    max-width: 1540px;
    margin: 0 auto;
  }

  .block-tama-original__list:not(.swiper-wrapper) {
    display: flex;
    /* display: grid;grid-template-columns: repeat(auto-fill, 33%);*/
    justify-content: center;
    max-width: 1550px;
    margin: 0 auto;
    gap: 24px;
    list-style: none;

    .block-tama-original__item {
      width: 500px;
    }
  }

  img {
    height: auto;
  }

  .block-tama-original__txt {
    color: var(--color-text);
    margin-top: 16px;
  }

  .block-tama-original__more {
    background: linear-gradient(180deg, var(--color-light-pink) 0%, var(--color-light-pink) 50%, #fff 50%, #fff 100%);

    .btn-primary {
      margin-top: 32px;
      color: var(--color-text);
      border-color: var(--color-text);
      background-color: white;
    }
  }
}

/* TOPセレクトブランド */
.block-top-brand {
  font-family: var(--font-family-base);
  color: var(--color-text);
  /* background: var(--main--background-color);*/
  padding-block: 64px;

  & .block-top-brand__inner {
    max-width: 1384px;
    /*var(--container-width-s)*/
    margin-inline: auto;
    padding-inline: clamp(12px, 2vw, 24px);
  }

  /* グリッド */
  & .block-top-brand__list {
    gap: min(1.25vw, 24px);
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  & .block-top-brand__item {
    list-style: none;
    background: #fff;
    border-radius: 6px 6px 8px 8px;

    /* overflow: hidden;*/
    /* box-shadow: 0 1px 2px rgba(0, 0, 0, .05);*/
    & .block-top-brand__link {
      display: grid;
      grid-template-rows: auto 1fr;
      text-decoration: none;
      color: inherit;
      transition: transform 0.15s ease, opacity 0.15s ease;

      &:hover {
        transform: translateY(-2px);
        opacity: 0.97;
      }

      &:focus-visible {
        outline: 2px solid color-mix(in oklab, var(--color-primary) 65%, white);
        outline-offset: 4px;
        border-radius: 10px;
      }
    }
  }

  /* 画像まわり */
  & .block-top-brand__figure {
    position: relative;
    margin: 0;
    background: var(--color-grayish-ivory);

    & .block-top-brand__img {
      display: block;
      width: 100%;
      height: auto;
      /* 328x168（HTML属性）で比率維持／CLS抑制 */
      object-fit: cover;
    }

    & .block-top-brand__logo {
      display: none;
      position: absolute;
      left: 16px;
      bottom: -28px;
      /* 本文側にはみ出す演出 */
      width: 112px;
      height: 112px;
      border-radius: 50%;
      object-fit: cover;
      /* ロゴが写真なら cover、図形なら contain 推奨 */
      background: #fff;
      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
    }
  }

  /* テキスト */
  & .block-top-brand__body {
    padding: min(0.83vw, 16px) 12px 12px;
    /* ロゴのはみ出し分を確保（112pxの約1/3&#12316;1/2） */
  }

  & .block-top-brand__cat {
    margin: 0;
    font-size: var(--txt-16);
    font-weight: 600;
    font-family: var(--font-family-serif);
    line-height: calc(23 / 16);
    color: #cccccc;
  }

  & .block-top-brand__name {
    margin: 0;
    font-size: var(--txt-16);
    /* font-family: var(--font-family-serif); */
    color: var(--color-text);
    font-weight: normal;
    line-height: calc(23 / 16);
    padding: 0;
    border-bottom: none;
  }

  & .block-top-brand__desc {
    margin: 0;
    font-size: var(--txt-16);
    /* font-family: var(--font-family-serif); */
    color: var(--color-text);
    line-height: calc(23 / 16);
    text-align: justify;
    word-break: break-all;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
  }

  & .block-top-brand__cta {
    & .btn-primary {
      margin-top: 32px;
      color: var(--color-text);
      background-color: white;
      border-color: var(--color-text);
    }
  }
}

/* TOP下部横長バナー */
.block-bottom-bnr {
  padding-block: 64px 0;
  transition: all 0.4s;

  a {
    transition: all 0.4s;

    &:hover {
      opacity: 0.6;
    }
  }

  .block-bottom-bnr__list,
  .block-bottom-bnr__main {
    max-width: 1130px;
  }

  .block-bottom-bnr__list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
    margin: 0 auto;
  }

  .block-bottom-bnr__main {
    margin: 80px auto 0;
    text-align: center;

    .block-bottom-bnr__app {
      margin: auto;
      aspect-ratio: 945/400;
      width: min(49.22vw, 945px);
      height: auto;
      background: url(../../img/usr/top/bottom_bnr_main.jpg) no-repeat center center / 100%;
      display: flex;
      justify-content: flex-end;
      padding: min(3.44vw, 66px) min(4.53vw, 87px) min(2.24vw, 43px) 0;

      .btn-layout {
        display: flex;
        justify-content: center;
        gap: min(0.94vw, 18px);
      }

      .subtitle {
        font-size: var(--txt-24);
        font-family: "Hiragino UD Sans Rd StdN";
        line-height: calc(32 / 24);
      }

      .title {
        font-size: var(--txt-34);
        font-family: "Hiragino UD Sans Rd StdN";
        font-weight: bold;
        line-height: calc(46 / 34);
        margin: min(0.78vw, 15px) auto min(2.08vw, 40px);
        padding: 0;
      }

      .text {
        font-size: var(--txt-23);
        font-family: "Hiragino UD Sans Rd StdN";
        line-height: calc(31 / 23);
        color: var(--color-primary);
        margin-top: min(1.15vw, 22px);
      }
    }
  }
}

/* =========================================================
TOPページコンテンツ内ここまで
========================================================= */
/* =========================================================
検索結果ページここから
========================================================= */
/* 検索全て */
.block-search {
  font-family: var(--font-family-base);
  color: var(--color-text);
  background: var(--main--background-color);
  padding-block: clamp(16px, 2vw, 28px);
  margin-top: 80px;

  & .block-search__inner {
    max-width: 1216px;
    margin-inline: auto;
    /* padding-inline: clamp(12px, 2vw, 24px);*/
  }

  & .block-search__title {
    font-size: var(--txt-24);
    font-weight: 600;
    font-family: var(--font-family-serif);
    color: var(--color-text);
    margin: 0 0 clamp(12px, 2vw, 16px);
  }

  /* ===== フォーム（ヘッダー） ===== */
  & .block-search__form {
    background: var(--color-header-tag);
    border-radius: 6px;
    padding: 40px;
    margin-bottom: 64px;
  }

  & .block-search__queryRow {
    margin: 0 auto 10px;
    max-width: 440px;
  }

  & .block-search__label {
    color: var(--gray2--text-color);
  }

  & .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
  }

  & .block-search__input {
    inline-size: 100%;
    border: 1px solid var(--sub---color);
    background: #fff;
    border-radius: 6px;
    padding: 10px 12px;
    font-size: var(--txt-15);

    & ::placeholder {
      color: var(--gray3--text-color);
    }
  }

  & .block-search__submit {
    border: 1px solid var(--color-gray);
    background: var(--main--background-color);
    color: var(--color-text);
    padding: 16px 16px;
    cursor: pointer;
    border-radius: 0;

    &:hover {
      opacity: 0.95;
      color: var(--color-text);
    }
  }

  & .block-search__submitRow {
    display: grid;
    place-items: center;
  }

  /* タブ */
  & .block-search__tabs {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: 1fr 1fr 1fr;
    margin: 0 auto 8px;
    max-width: 440px;
  }

  & .block-search__tab {
    border: 1px solid var(--color-gray03);
    color: var(--color-text);
    background: #fff;
    padding: 8px 12px;
    font-size: var(--txt-16);
    cursor: pointer;

    &.is-active,
    &:hover {
      background: var(--color-deep-burgundy);
      border-color: var(--color-deep-burgundy);
      color: #fff;
    }
  }

  & .block-search__tab:first-child {
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
    border-right: 0;
  }

  & .block-search__tab:last-child {
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
    border-left: 0;
  }

  /* ===== コントロール行 ===== */
  /* & .block-search__controls {display: grid;grid-template-columns: 1fr auto;gap: 12px;align-items: start;margin: clamp(12px, 2vw, 16px) 0;}*/
  & .block-search__resultMeta {
    & .block-search__count {
      margin: 0 0 52px;
      font-size: var(--txt-14);
      line-height: 1;

      strong {
        font-size: var(--txt-32);
        font-weight: normal;
      }
    }

    & .block-search__note {
      margin: 0;
      font-size: var(--txt-11);
      color: var(--gray2--text-color);
    }
  }

  & .block-search__actions {
    background: rgba(255, 255, 255, 0.8);
    position: sticky;
    bottom: 0;
    padding: 0 28px 32px;
  }

  & .block-search__actionsResult {
    display: flex;
    justify-content: space-between;
    align-items: self-end;
    font-size: var(--txt-16);
  }

  & .block-search__resultText span {
    font-size: var(--txt-32);
    line-height: 1;
  }

  & .block-search__filterBtn {
    border: 1px solid var(--color-accent);
    color: #fff;
    background: var(--color-accent);
    font-size: var(--txt-22);
    cursor: pointer;
    width: 100%;
    margin-top: 24px;

    &:hover {
      opacity: 0.95;
      color: var(--color-text);
      border-color: var(--color-text);
    }

    & .block-search__filterIcon {
      margin-right: 0.4em;
    }
  }

  & .block-search__resetBtn {
    font-size: var(--txt-16);
    padding-block: 9px;
    margin-top: 12px;
    background-color: white;
    color: var(--color-text);
    border-color: var(--color-text);

    &:hover {
      color: var(--color-text);
      border-color: var(--color-text);
    }
  }

  & .block-search__select {
    border: 1px solid var(--sub---color);
    background: #fff;
    border-radius: 6px;
    padding: 8px 12px;
    font-size: var(--txt-12);
  }

  & .block-search__resetBtn.btn.btn-primary {
    font-size: var(--txt-16) 1.6rem;
    padding-block: 9px;
    margin-top: 12px;
  }

  /* タブ部分JS表示非表示 */
  .panel {
    display: none;
    border: 0;
  }

  .panel.active {
    display: block;
  }

  /* ===== レイアウト切り替えボタン ===== */
  .block-search__displayMethod {
    display: flex;
    gap: 8px;
    padding-bottom: 24px;
  }

  .block-search__displayMethod button {
    border: 0;
    background: 0;
    padding: 0;
    cursor: pointer;
  }

  /* ===== 2カラムレイアウト ===== */
  & .block-search__layout {
    display: grid;
    grid-template-columns: 345px 1fr;
    gap: 50px;
  }

  /* ファセット（左） */
  & .block-search__sidebar {
    position: relative;
    background: #fff;
  }

  & .block-search__facet {
    margin-bottom: 16px;
  }

  & .block-search__facetTitle {
    font-size: var(--txt-16);
    color: var(--color-text);
    font-family: var(--font-family-serif);
    font-weight: 700;
    margin: 64px 0 32px;
    padding: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    border: 0;
  }

  /* .toggle-a {display: none;}*/
  .toggle-icon {
    position: relative;
    display: inline-block;
    width: 12px;
    height: 5px;
    margin-right: 30px;
  }

  .toggle-icon::before,
  .toggle-icon::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: calc(50% - 2px);
    width: 1px;
    height: 6px;
    border-radius: 9999px;
    background-color: #000000;
    transform-origin: 50% calc(100% - 0px);
  }

  .toggle-icon::before {
    transform: rotate(45deg);
  }

  .toggle-icon::after {
    transform: rotate(-45deg);
  }

  .toggle-icon.open::before,
  .toggle-icon.open::after {
    top: 0;
    left: calc(50% - 2px);
    transform-origin: 50% 0px;
  }

  & .block-search__facetList {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    row-gap: 12px;
  }

  .block-search__facetItem {
    display: grid;
    grid-template-columns: 32px auto;
    column-gap: 13px;
    align-items: center;
  }

  .block-search__facetItem--indent1 {
    padding-left: 2em;
  }

  .block-search__facetItem--indent2 {
    padding-left: 4em;
  }

  .block-search__facetItem--indent3 {
    padding-left: 6em;
  }

  /* & .block-search__facetList--scroll {max-block-size: 180px;overflow: auto;}*/
  & .block-search__price {
    display: grid;
    row-gap: 8px;

    & .block-search__priceRow {
      display: grid;
      grid-template-columns: 1fr;
      gap: 4px;
      font-size: var(--txt-11);
      color: var(--gray2--text-color);
    }

    & .block-search__priceInput {
      border: 1px solid var(--sub---color);
      border-radius: 6px;
      padding: 6px 10px;
    }

    & .block-search__priceApply {
      justify-self: start;
      border: 1px solid var(--color-primary);
      color: var(--color-primary);
      background: transparent;
      border-radius: 6px;
      padding: 6px 10px;
      font-size: var(--txt-11);
    }
  }

  /* 結果（右） */
  & .block-search__main {
    min-width: 0;
  }

  & .block-search__section {
    margin-bottom: clamp(16px, 2vw, 24px);
  }

  & .block-search__sectionHead {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: baseline;
    gap: 8px;
    margin-bottom: 8px;
  }

  & .block-search__sectionTitle {
    font-size: var(--txt-24);
    font-family: var(--font-family-serif);
    color: var(--color-text);
    font-weight: 600;
    margin: 0;
    border: 0;
    padding: 0;
  }

  & .block-search__sectionMore {
    font-size: var(--txt-16);
    color: var(--color-gray);
  }

  & .block-search__sectionMoreIcon {
    display: inline-block;
    margin-right: 0.4em;
    width: 22px;
    height: 14px;
    background: url(../../img/usr/common/icon_arrow_gray.svg) no-repeat center center / 100%;
  }

  /* ===== 読みもの===== */
  /* 見出しのアイコン（任意） */
  & .block-search__sectionIcon {
    display: inline-block;
    margin-right: 0.4em;
    width: 20px;
    height: 22px;
    background: url(../../img/usr/common/icon_search.svg) no-repeat center center / 100%;
  }

  /* リスト全体 */
  & .block-search__articlesList {
    list-style: none;
    margin: 40px 0 0;
    padding: 0;
    display: grid;
    row-gap: 26px;
  }

  /* 各行 */
  & .block-search__articlesItem {
    list-style: none;
    display: grid;

    a {
      transition: all 0.4s;

      &:hover {
        color: var(--color-bronze-brown);
      }
    }

  }

  /* タイトルリンク */
  & .block-search__articlesLink {
    text-decoration: none;
    color: inherit;
  }

  & .block-search__articlesTitle {
    font-size: var(--txt-16);
    color: var(--color-deep-burgundy);
    font-weight: 600;
    line-height: 1.5;
    text-underline-offset: 0.18em;
  }

  /* 日付＋カテゴリバッジ */
  & .block-search__articlesMeta {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-top: 10px;
  }

  & .block-search__articlesDate {
    font-size: var(--txt-14);
    color: var(--color-gray02);
  }

  /* カテゴリの小バッジ */
  & .block-search__badge {
    display: inline-block;
    width: fit-content;
    font-size: var(--txt-10);
    font-weight: bold;
    line-height: 1;
    padding: 3px 8px;
    border-radius: 999px;
    border: 1px solid var(--color-wine);
    background: #fff;
    color: var(--color-wine);
  }

  & .block-search__badge--category {
    border-color: var(--color-deep-burgundy);
  }

  .block-search__productsContent {
    margin-top: 52px;
  }

  .block-search__hitRange {
    margin-bottom: 24px;
  }

  /* ソート */
  .block-search__tabContener {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid var(--color-gray02);
    margin-bottom: 24px;
  }

  .block-search__tabControl {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    max-width: 640px;
    column-gap: 2rem;
  }

  .tab-n.active {
    /*border-bottom: 3px solid var(--color-primary);*/
    border-bottom: 3px solid var(--color-accent);
    color: var(--main--color);
    padding-bottom: 8px;
    margin-bottom: calc(-3px / 2);
  }

  .tab-n {
    border: none;
    background: transparent;
    font-size: var(--txt-16);
    cursor: pointer;
    padding-bottom: 10px;
    border-radius: 0;
    letter-spacing: -0.03em;
  }

  /* 商品グリッド */
  & .block-search__products {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
  }

  #block-search-products-title {
    margin-top: 80px;
  }

  /* 三列 */
  .block-search__section--products div.block-thumbnail-t.layout_l {
    .block-thumbnail-t--items {
      grid-template-columns: repeat(3, 1fr);
    }
  }

  /* 五列 */
  .block-search__section--products div.block-thumbnail-t.layout_s {
    .block-thumbnail-t--items {
      gap: 32px 19px;
    }
  }

  /* 絞り込み条件タグ */
  .block-search__filterTagControls {
    display: grid;
    grid-template-columns: 96px auto 96px;
    gap: 24px;
    font-size: var(--txt-16);
  }

  .block-search__filterTag-items {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 16px;
  }

  .block-search__filterTag-item {
    padding: 12px 16px;
    border: 1px solid #ccc;
    border-radius: 8px;
    position: relative;
    display: flex;
    align-items: center;
    column-gap: 8px;

    & .block-search__filterTag-reset {
      width: 8.5px;
      height: 8.5px;
      border: 0;
      background: url(../../img/usr/common/icon_close.svg) no-repeat center center / 100%;
      cursor: pointer;
    }
  }

  .block-search__resetTagBtn {
    padding: 12px 32px;
    border: 1px solid var(--color-gray);
    background-color: var(--main--background-color);
    height: fit-content;
    white-space: nowrap;
    cursor: pointer;
  }

  & .block-search__product {
    list-style: none;
    border: 1px solid var(--sub---color);
    border-radius: 10px;
    background: #fff;
    overflow: hidden;

    &>a {
      display: grid;
      grid-template-rows: auto 1fr;
      color: inherit;
      text-decoration: none;
    }
  }

  & .block-search__productThumb {
    position: relative;
    margin: 0;
    background: var(--color-grayish-ivory);

    & .block-search__productImg {
      display: block;
      width: 100%;
      height: auto;
      object-fit: contain;
    }

    & .block-search__badge {
      position: absolute;
      top: 8px;
      right: 8px;
      display: grid;
      place-items: center;
      inline-size: 36px;
      block-size: 36px;
      border-radius: 50%;
      background: var(--color-accent);
      color: #fff;
      font-weight: 800;
      font-size: var(--txt-10);
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
    }
  }

  & .block-search__productBody {
    padding: 10px;
    display: grid;
    row-gap: 4px;
  }

  & .block-search__productName {
    margin: 0;
    font-size: var(--txt-12);
    color: var(--color-primary);
    font-weight: 600;
    line-height: 1.5;
  }

  & .block-search__productPrice {
    margin: 0;
    font-size: var(--txt-12);
  }

  & .block-search__productRating {
    margin: 0;
    font-size: var(--txt-11);
    color: var(--gray2--text-color);
  }

  /* 読み物　検索結果 */
  .block-search_articlesbody {
    row-gap: 40px;

    .block-search__articlesItem {
      display: grid;
      grid-template-columns: clamp(240px, 19.53vw, 375px) 1fr;
      column-gap: 36px;
    }

    .block-search__articlesThumbnail {
      img {
        display: block;
        aspect-ratio: 375/120;
        width: 100%;
        height: auto;
      }
    }

    & .block-search__articlesTitle {
      font-size: var(--txt-20);
      color: var(--color-text);
      line-height: calc(29 / 20);
    }

    & .block-search__badge {
      font-size: var(--txt-11);
    }
  }

  /* ページネーション */
  /* & .block-pager {
    margin-top: 80px;
  } */
}

/* =========================================================
検索結果ページここまで
========================================================= */
/* =========================================================
商品詳細ページここから
========================================================= */
/* 上部 */
div.pane-contents {
  padding-bottom: 0;
}

.pane-contents .container {
  max-width: initial;
}

.page-goods .block-goods-detail {
  max-width: 1280px;
  grid-template-columns: 1fr 1fr;
  column-gap: 80px;
  margin: 0 auto;
  padding: 103px 0 0;
}

.pane-goods-left-side,
.pane-goods-right-side {
  grid-column: auto;
  grid-row: auto;
}

/* コメント */
/* div.block-goods-detail div.block-goods-comment1,div.block-goods-detail div.block-goods-comment2,div.block-goods-detail div.block-goods-comment3,div.block-goods-detail div.block-goods-comment4,div.block-goods-detail div.block-goods-comment5 {margin: 0;}*/
div.block-goods-detail div.block-goods-comment1 {
  order: 0;
  margin: 0;
  font-size: var(--txt-16);
  line-height: calc(32 / 16);

  a {
    text-decoration: underline;
    text-underline-offset: 4px;
  }
}

div.block-goods-detail div.block-goods-comment2 {
  order: 1;
  margin-block: 42px 0;
}

/* 上部スライダー */
.block-goods-detail .block-goods-detail--color-variation-goods-image .swiper-slider-main {
  position: relative;
  max-height: 750px;
  height: 100%;
  background-color: var(--main--background-color);
  display: flex;
  align-items: center;
  margin-bottom: 32px;
  aspect-ratio: 600 / 750;
}

.block-goods-detail .block-goods-detail--color-variation-goods-image .swiper-slider-main.swiper-autoheight .swiper-wrapper {
  align-items: center;
}

.block-goods-detail--color-variation-goods-thumbnail-form .swiper-slider-thumbnail {
  overflow: visible;
}

.block-goods-gallery ul {
  display: flex;
  flex-wrap: wrap;
}

.block-goods-gallery ul {
  /* display: grid;grid-template-columns: 1fr 1fr 1fr 1fr 1fr;gap: 13px 16px;*/
  width: 600px;
  row-gap: 0;
}

.block-goods-gallery ul li {
  margin: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  aspect-ratio: 107 / 131;
  padding: 7px !important;
}

.block-goods-gallery ul a {
  /* background-color: #F2F2F2;*/
  display: block;
}

.block-goods-gallery ul li+li a {
  margin-left: 0;
  height: 100%;
}

.block-goods-gallery ul li:nth-child(6) a {
  margin-left: 0;
}

div.block-goods-gallery ul li figure {
  width: 100%;
  height: 100%;
  aspect-ratio: 107 / 131;
  background-color: #f2f2f2;
}

div.block-goods-detail .block-goods-detail--color-variation-goods-image .swiper-slider-main img {
  max-height: 100%;
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: auto;
}

.swiper-slider-main .video {
  width: 100%;
  height: fit-content;
}

.block-goods-gallery .video {
  width: 100%;
  height: 100%;
}

.movie {
  position: relative;
  margin: 0 auto;
}

.movie video {
  width: 100%;
}

div.block-goods-detail .block-goods-detail--color-variation-goods-image .swiper-slider-main img.play-btn {
  display: block;
  width: 10%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  cursor: pointer;
}

div.block-goods-detail .block-goods-detail--color-variation-goods-image .swiper-slider-main img.play-btn.playActive {
  display: none;
}

/* お気に入りボタン */
.block-goods-favorite {
  position: absolute;
  z-index: 10;
  bottom: 0;
  right: 0;
  border: none;

  a {
    border: none !important;
  }
}

.block-goods-favorite .block-goods-favorite--btn.btn {
  border: 0 !important;
  margin: 0 !important;
  padding: 10px !important;
  background: none !important;
}

.block-goods-favorite .btn.block-goods-favorite--btn::before {
  width: 32px;
  height: 28px;
  margin: 0;
  background: url(../../img/usr/common/icon_bookmark01.svg) center center no-repeat;
  background-size: contain;
}

/* お気に入りボタン登録済み */
.block-goods-favorite .btn.block-goods-favorite-registed--btn {
  border: 0;
  margin: 0;
  padding: 10px;
  background: none;
}

.block-goods-favorite .btn.block-goods-favorite-registed--btn::before {
  content: "";
  width: 32px;
  height: 28px;
  margin: 0;
  background: url(../../img/usr/common/icon_bookmark02.svg) center center no-repeat;
  background-size: contain;
}

/* 最近見た商品や関連商品　位置調整 */
.block-thumbnail-t--item .block-thumbnail-t--goods-image {
  position: relative;
}

.block-thumbnail-t--item .block-goods-favorite {
  bottom: 0;
}

/* 新規会員登録バナー */
.block-goods-new-member-bnr {
  text-align: center;
  transition: all 0.4s;

  a {
    transition: all 0.4s;

    &:hover {
      opacity: 0.6;
    }
  }
}

#block_of_itemhistory .block-thumbnail-t--items,
#block_of_accessory .block-thumbnail-t--items {
  grid-template-columns: repeat(6, 1fr) !important;
}

/* 商品名 */
.block-goods-name {
  order: 0;
  margin: 0 0 32px;
}

.page-goods .block-goods-name h1.block-goods-name--text {
  margin: 0;
  font-size: var(--txt-32);
  font-weight: 600;
  line-height: 1.5;
}

/* 上部レビュー/商品コード */
.goods-detail-description-wrap {
  order: 1;
  display: flex;
  margin-top: 52px;
}

.block-goods-code {
  font-size: var(--txt-14);
}

/* 上部レビュー */
.revico-star-block {
  display: flex;
  gap: 4px;
}

.revico-star .starability-result,
.revico-multicomment-top .revico-starability-result {
  background-image: url(../../img/usr/common/star5.svg);
  background-repeat: no-repeat;
  background-size: auto;
  width: 98px;
  height: 19px;
  background-position: left 0 top 0;
}

/* コード */
.block-goods-code:has(#spec_goods) {
  justify-content: flex-end;
}

/* 上部タグ */
.goods-detail-tag {
  order: 3;
  margin-top: 24px;
  gap: 16px;

  .ico-frame {
    padding: 10px 19px 9px;
    font-size: var(--txt-14);
  }
}

.goods-detail-tag__items {
  display: flex;
  gap: 16px;
}

.goods-tag-caution {
  margin-top: 8px;
  font-size: var(--txt-12);
  color: var(--gray3--text-color);
}

/* コメント2 特徴 */
.block-goods-feature {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 16px;
  margin-top: 32px;

  p {
    font-size: var(--txt-16);
  }

  ul {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    gap: 20px 10px;

    figcaption {
      margin-top: 2px;
      font-size: var(--txt-12);
      text-align: center;
    }
  }
}

/* 価格 */
.block-goods-price {
  display: none;
}

/* addカートエリア */
.block-add-cart {
  order: 4;
  background: var(--color-stone);
  background: rgba(226, 221, 207, 0.24);
  padding: 40px;
  margin-top: 64px;
}

.block-cart--goods-list-image figure {
  background-color: var(--main--background-color);
}

/* バリエーション */
.block-variation--name.block-color--name {
  display: none;
}

.block-variation--selected-item {
  display: none;
}

.block-variation--item-term.block-color--item-term {
  display: none;
}

.block-variation--item-description.block-color--item-description {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: var(--txt-16);
}

div.block-goods-price--price {
  font-size: var(--txt-16);
}

div.block-goods-price--price span {
  font-size: var(--txt-24);
}

.block-goods-price--price::after,
.block-goods-price--net-price::after {
  display: none;
}

.block-variation--item-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-auto-rows: auto;
  align-items: start;
  gap: 40px;
}

.block-variation--item {
  border: 1px solid var(--color-wine);
  border-radius: 8px;
  color: var(--color-text);
  background-color: var(--main--background-color);
  padding: 17px 10px;
  cursor: pointer;
  box-shadow: var(--shadow-black);
  margin-right: 0;
}

.block-variation--item.active {
  background-color: var(--color-wine);
  color: var(--main--background-color);

  .default-price {
    color: var(--main--background-color);
  }
}

.block-variation--item.active .price {
  color: var(--main--background-color);
}

/* SALE時 */
.block-variation {
  .discount {
    padding-left: 8px;
  }

  .default-price {
    font-weight: normal;
    text-decoration: none;

    span {
      text-decoration: line-through;
    }
  }

  .second-row {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
  }
}

/* 在庫なし時 */
.block-variation--item .block-goods-stock.out-of-stock dt {
  border: 0;
  width: auto;
}

.goods-detail-description.block-goods-stock.out-of-stock {
  justify-content: center;
  width: fit-content;
  font-size: var(--txt-16);
}

.block-variation--item:has(.out-of-stock) {
  border: 1px solid #cccccc;
}

.block-variation--item.active:has(.out-of-stock) {
  background-color: var(--color-gray);
}

/* 入荷お知らせ */
.block-arrival-notice-list--form .block-arrival-notice-list--delete-item input.btn-danger {
  width: 120px !important;
  float: right;
}

.block-arrival-notice-list--image figure {
  background-color: var(--color-mypage-bg);
}

.block-arrival-notice .block-arrival-notice--btn {
  border: 1px solid var(--color-primary);
  border-radius: 0;
  color: var(--color-primary);
  background-color: #f2f2f2;
  font-family: var(--font-family-serif);
  font-size: var(--txt-22);
  font-weight: 600;
  margin: 40px 0 0 !important;
}

.block-no-stock .block-no-stock--message {
  border: 1px solid var(--color-gray);
  border-radius: 0;
  color: var(--color-gray);
  background-color: #f2f2f2;
  font-family: var(--font-family-serif);
  font-size: var(--txt-22);
  font-weight: 600;
  margin: 40px 0 0 !important;
}

/* スピンボタン */
.block-goods-qty-point {
  display: flex;
  align-items: center;
  gap: 40px;
  margin-top: 40px;
}

.block-goods-qty {
  display: flex;
  align-items: center;
  gap: 27px;
  white-space: nowrap;
}

.block--goods-qty-frame {
  display: flex;
  align-items: center;
  border: 1px solid var(--color-gray);
  background-color: var(--main--background-color);
  border-radius: 8px;
  box-shadow: var(--shadow-black);
}

.block--goods-qty-frame input.block--goods-qty-text {
  border: 0;
  width: 78px;
  text-align: center;
  margin: 0;
  background: #fff;
  outline: none;
  font-size: var(--txt-24);
  font-weight: 500;
}

.block--goods-qty-frame input.block--goods-qty-text::-webkit-inner-spin-button,
.block--goods-qty-frame input.block--goods-qty-text::-webkit-outer-spin-button {
  -webkit-appearance: none;
  -moz-appearance: textfield;
}

input.block--goods-qty-text:hover {
  border: 0;
}

.block--goods-qty-btn {
  position: relative;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
  border: 0;
}

/* .block--goods-qty-btn.minus:not(.is-active) {pointer-events: none;}*/
.block--goods-qty-btn.minus::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 20px;
  height: 1px;
  background: var(--form--border-color);
  border-radius: 10px;
}

.block--goods-qty-btn.minus.is-active::before {
  background: var(--form--border-color);
}

.block--goods-qty-btn.plus::before,
.block--goods-qty-btn.plus::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 20px;
  height: 1px;
  background: var(--form--border-color);
  border-radius: 10px;
}

.block--goods-qty-btn.plus::after {
  transform: rotate(90deg);
}

/* ポイント */
.goods_point_ {
  font-size: var(--txt-14);
  margin-top: -20px;
  white-space: nowrap;

  strong {
    font-weight: normal;
    padding-left: 0.25em;
  }

  b {
    font-size: var(--txt-20);
    color: var(--color-primary);
  }

  span {
    font-size: var(--txt-14);
    padding-left: 0.25em;
  }
}

/* カート画面ヘッダー非表示 */
.page-cart .block-header-nav,
.cart-sub .block-header-nav {
  display: none;
}

.page-cart .pane-header,
.cart-sub .pane-header {
  background: none;

  &.is-scrolled {
    background: none;
  }

}

.promotion-criteria-list-message>span {
  color: var(--color-accent);
  font-size: var(--txt-16);
}

/* カート フロー */
.block-order-estimate--goods-item-image figure {
  background-color: white;
}

/* カートに入れるボタン */
.page-goods .block-add-cart .block-add-cart--btn {
  font-size: var(--txt-22);
  color: var(--main--background-color);
  background-color: var(--color-primary);
  border-color: var(--color-primary);
  padding: 15px 16px 17px;
  max-width: none;

  &:hover {
    color: var(--color-primary);
  }
}

/* 注文に進むボタン */
.block-following-area .block-order--btn.btn {
  display: none;
  background-color: var(--color-wine);
  border: 1px solid var(--color-wine);

  &:hover a {
    color: var(--color-text);

  }

  a {
    color: var(--main--background-color);
  }

}

/* 関連商品 */
div.block-accessory-list {
  /* max-width: var(--container-width);*/
  padding: 0;
  background: inherit;
  margin: 136px auto 0;
}

.block-thumbnail-t--net-price {
  display: none;
}

.block-thumbnail-t--item .block-thumbnail-t--goods-description {
  padding: 0;
}

.block-thumbnail-t--item .block-thumbnail-t--goods-name {
  font-size: var(--txt-20);
  font-weight: 600;
  margin: 0 0 16px;
  padding: 0;
  border: 0;
}

.block-thumbnail-t--item div.price {
  font-size: var(--txt-18);
  font-weight: normal;
}

.block-thumbnail-t--goods-description .ico-frame {
  font-size: var(--txt-15);
}

.page-goods div.block-accessory-list .block-thumbnail-t .block-thumbnail-t--items {
  column-gap: 26px;
}

/* スライダー起動しているとき */
.page-goods .block-accessory-list .block-thumbnail-t.swiper .block-thumbnail-t--items {
  column-gap: 0;
}

/* (税込み)非表示 */
.price::after,
.default-price::after {
  display: none;
}

/* おすすめ商品 */
#block_of_itemhistory {
  max-width: var(--container-width);
  margin: 80px auto 0;
}

/* AiReco レコメンド */
.block-aireco-recommend {
  max-width: var(--container-width);
  margin: 80px auto 0;
}

.block-thumbnail-t .block-thumbnail-t--items.swiper-wrapper {
  display: flex;
  flex-wrap: nowrap;
}

.block-recent-item--keep-history {
  display: none;
}

.variation-name {
  display: none;
}

.swiper-button-prev2,
.swiper-button-next2 {
  display: block;
  z-index: 100;
  position: absolute;
  background: #000;
  width: 100px;
  height: 100px;
}

div.block-thumbnail-t .block-thumbnail-t--items:not(.swiper-wrapper) {
  column-gap: 40px;
  justify-content: normal;
}

div.block-thumbnail-t.swiper {
  overflow-y: visible;
  overflow-x: clip;
}

/* スライダー起動しているとき */
div.block-thumbnail-t.swiper .block-thumbnail-t--items {
  column-gap: 0;
}

/* 商品詳細　下部バナー */
.block-goods-bottom .block-bottom-bnr {
  padding-bottom: 120px;
}

/* ぱんくず */
.pane-contents div.block-topic-path {
  background-color: #f9f5ee;
  padding: 22px 0;
  margin: 128px 0 0;
  border-top: 0;

  .block-topic-path--list {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 90px;
  }

  .block-topic-path--list li {
    padding-right: 14px;
    display: inline;

    a {
      color: var(--color-dark-maroon);
      text-decoration: underline;
      text-underline-offset: 2px;
      font-size: var(--txt-14);
      font-weight: 600;
    }
  }

  .block-topic-path--list li:last-child {
    a {
      color: var(--color-gray);
      text-decoration: none;
    }
  }

  .block-topic-path--delimiter {
    color: #cccccc;
    font-weight: bold;
    padding-right: 14px;
  }
}

/* パンくずがないページ */
body:not(:has(.block-topic-path)) .wrapper>.pane-footer {
  margin-top: 128px;
}

/* =========================================================
商品詳細ページここまで
========================================================= */
/* =========================================================
カテゴリ一覧
========================================================= */
/* 上部フリーエリア */
.block-category-list--header-freespace {

  /* 動画エリア */
  .block-category__videoarea {
    height: 480px;
    width: 100%;
    object-fit: cover;

    .block-category__video {
      width: 100%;
      height: 100%;
      object-fit: cover;
      pointer-events: none;
    }
  }

  h2 {
    font-size: var(--txt-28);
    margin-block: 80px 40px;
    padding: 0;
    font-family: var(--font-family-serif);
    text-align: center;
    border-bottom: 0;
  }

  /* ナビ */
  .block-category__nav {
    font-weight: 500;
    /* margin-bottom: 64px;*/
    padding-inline: 20px;

    p {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      font-size: var(--txt-16);
      row-gap: 20px;
    }

    a {
      text-decoration: underline;
      text-underline-offset: 4px;
      color: inherit;

      &:hover {
        color: var(--color-bronze-brown);
      }
    }

    span {
      color: var(--color-gray);
      display: inline-block;
    }

    i {
      color: var(--color-gray02);
      padding-inline: 15px 20px;
      font-style: normal;
    }
  }

  /* 初回限定用エリア */
  .block-category__limited {
    padding-inline: 20px;

    a {
      display: block;
      background-color: var(--color-light-pink);
      border: 1px solid var(--color-primary);
      max-width: 1216px;
      margin: 52px auto 8px;
      text-align: center;
      font-weight: 500;
      font-family: var(--font-family-sans);
      padding: 0px 20px 14px;
      transition: all 0.4s;

      &:hover,
      &:focus {
        color: var(--color-text);
        opacity: 0.6;
      }
    }

    .block-category__limited-title {
      font-size: var(--txt-28);

      .block-category__limited-label {
        font-size: var(--txt-32);
      }

      strong {
        font-size: 44px;
        font-weight: 600;
      }

      .block-category__limited-unit {
        font-size: var(--txt-30);
      }
    }

    .block-category__limited-txt {
      color: var(--color-primary);
      font-size: var(--txt-24);
    }
  }

  /* 特徴 */
  .block-category__features {
    background-color: var(--color-grayish-ivory);
    /* overflow-x: scroll;*/
    position: relative;
    padding: 80px 20px 0;

    &::before {
      content: "";
      aspect-ratio: 1920 / 158;
      width: 100%;
      height: auto;
      display: block;
      background: url(../../img/usr/top/top_review_bg.svg) center center / 100% no-repeat;
      position: absolute;
      top: 50%;
      left: 0;
      transform: translateY(-50%);
      z-index: -1;
    }
  }

  .block-category__feature {
    width: 1260px;
    margin: 0 auto;
    display: flex;
    column-gap: 40px;
    align-items: stretch;
  }

  .block-category__feature-card {
    display: flex;
    flex-direction: column;
    min-width: 220px;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.16);
    background-color: var(--color-warm-ivory);
    border-radius: 6px;
    transition: all.4s;

    a {}

    &:hover {
      opacity: 0.6;
    }
  }

  h3 {
    font-size: var(--txt-12);
    font-weight: 500;
    padding: 0;
    border-bottom: 0;
    margin-bottom: 0;
  }

  .block-category__feature-card-image {
    text-align: center;
    position: relative;
    height: 231px;

    img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-top-left-radius: 6px;
      border-top-right-radius: 6px;
    }

    figcaption {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      background-color: rgba(255, 255, 255, 0.8);
      color: var(--color-deep-burgundy);
      font-size: var(--txt-18);
      text-align: left;
      padding: 6px 16px;
      letter-spacing: -0.06em;
    }
  }

  .block-category__feature-card-body {
    display: flex;
    flex-direction: column;
    flex: 1;
    background-color: var(--color-warm-ivory);
    /* ← 高さをカードいっぱいに伸ばす */
    display: grid;
    grid-template-columns: 1fr 55px;
    column-gap: 15px;
    padding: 10px;
  }
}

/* 共通 */
.block-top-event--goods {
  max-width: var(--responsive-sys-container-width);
  margin-inline: auto;
}

.block-thumbnail-t {

/* 商品カードの動的に出るアイコン非表示 */
.block-thumbnail-t--item {
  .goods-tag {
    display: none;
  }
}

/* スライダー起動してない状態 */
  .block-thumbnail-t--items:not(.swiper-wrapper) {
    justify-content: center;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    margin-bottom: min(4.17vw, 80px);
    gap: min(2.03vw, 39px) min(1.46vw, 28px);
    position: relative;
  }

  a {

    &:hover,
    &:focus {
      color: inherit;
    }
  }

  .block-thumbnail-t--goods-image {

    figure {
      aspect-ratio: 220 / 263;
      padding: 0;
      background: none;
      position: relative;
      width: auto;
      height: auto;

      picture {
        display: block;
        width: 100%;
        height: 100%;
        overflow: hidden;
      }
    }
  }

  .block-thumbnail-t--item:not(.swiper-slide) {
    /* width: clamp(200px,11.3vw,217px)!important;*/
    width: 100% !important;
    max-width: 217px;
    margin: 0 !important;

    a {}

    .block-thumbnail-t--goods-image {
      figure {
        aspect-ratio: 220 / 263;
        padding: 0;
        background: none;
        position: relative;
        width: auto;
        height: auto;

        picture {
          display: block;
          width: 100%;
          height: 100%;
          overflow: hidden;

          img {
            aspect-ratio: 200 / 263;
          }
        }

        .block-thumbnail-favorite {
          border: none;
          padding: 0;
          margin: 0;
          aspect-ratio: 28/24;
          width: 28px;
          height: 24px;
          background: none;
          position: absolute;
          bottom: 0;
          right: 0;

          .heart {
            width: 28px;
            height: 24px;
            display: block;
            background: url("../../img/usr/common/icon_bookmark01.svg") no-repeat center / contain;
          }

          &.is-active {
            .heart {
              background: url("../../img/usr/common/icon_bookmark02.svg") no-repeat center / contain;
            }
          }
        }
      }
    }

    .block-thumbnail-t--goods-description {
      padding: min(0.52vw, 10px) 0 0;

      .block-goods-tag {
        display: flex;
        flex-wrap: wrap;
        gap: min(0.31vw, 6px);
        margin-bottom: min(0.31vw, 6px);

        .goods-tag {
          border: 1px solid var(--color-gray);
          width: fit-content;
          padding: min(0.16vw, 4px) min(0.68vw, 8px) min(0.26vw, 4px) min(0.52vw, 8px);
          font-size: var(--txt-13);
          font-weight: 400;
          line-height: calc(19 / 13);
        }

        .goods-tag--limitedtime {}

        .goods-tag--sale {}

        .goods-tag--soldout {}
      }

      .block-thumbnail-t--goods-name {
        font-size: var(--txt-14);
        font-weight: 600;
        line-height: calc(24 / 16);
        color: var(--color-text);
        margin-bottom: 8px;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        overflow: hidden;
      }

      .variation-name {
        display: none;
      }

      .block-thumbnail-t--price-items {
        .block-thumbnail-t--price {
          font-size: var(--txt-16);
          font-weight: 400;
          line-height: calc(24 / 16);

          &::after {
            font-size: var(--txt-12);
          }
        }
      }
    }

    .revico-star-zone {
      margin-top: min(0.47vw, 9px);
    }

    .block-thumbnail-t--price-infos {
      .block-thumbnail-t--scomment {
        font-size: var(--txt-12);
        color: var(--color-primary);

        +.block-thumbnail-t--price-items {
          .block-thumbnail-t--price {
            color: var(--color-bronze-brown) !important;
          }
        }
      }
    }
  }
}

/* レーティング---- */
.revico-star-zone {
  .revico-star-block--title {
    font-size: var(--txt-12);
    font-weight: 500;
    line-height: calc(17 / 12);
  }

  .revico-star-block--total {
    font-size: var(--txt-12);
    font-weight: 500;
    line-height: calc(17 / 12);
    font-feature-settings: "palt" 1;
  }

  .revico-star-block {
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }

  .revico-star-block--rate {
    width: 96px;
    margin-right: min(0.21vw, 4px);
  }

  .starability-result {
    width: 96px;
    height: 16px;
    background-size: 196px auto;
    background-repeat: no-repeat;
  }

  [data-rating="5"] {
    background-image: url(../../img/usr/common/star_yellow.svg);
    background-position: 0% 50%;
  }

  [data-rating="4"] {
    background-image: url(../../img/usr/common/star_yellow.svg);
    background-position: 20% 50%;
  }

  [data-rating="3"] {
    background-image: url(../../img/usr/common/star_yellow.svg);
    background-position: 40% 50%;
  }

  [data-rating="2"] {
    background-image: url(../../img/usr/common/star_yellow.svg);
    background-position: 60% 50%;
  }

  [data-rating="1"] {
    background-image: url(../../img/usr/common/star_yellow.svg);
    background-position: 80% 50%;
  }

  [data-rating="0"] {
    background-image: url(../../img/usr/common/star_yellow.svg);
    background-position: 100% 50%;
  }

  [data-rating="4.5"] {
    background-image: url(../../img/usr/common/star_half_yellow.svg);
    background-position: 0% 50%;
  }

  [data-rating="3.5"] {
    background-image: url(../../img/usr/common/star_half_yellow.svg);
    background-position: 20% 50%;
  }

  [data-rating="2.5"] {
    background-image: url(../../img/usr/common/star_half_yellow.svg);
    background-position: 40% 50%;
  }

  [data-rating="1.5"] {
    background-image: url(../../img/usr/common/star_half_yellow.svg);
    background-position: 60% 50%;
  }

  [data-rating="0.5"] {
    background-image: url(../../img/usr/common/star_half_yellow.svg);
    background-position: 80% 50%;
  }
}

/* バッジ---- */
.block-icon {
  position: absolute;
  top: -16px;
  right: 10px;
  place-items: center;
  width: clamp(38px, 2.4vw, 58px);
  height: auto;
  aspect-ratio: 1/1;
  border-radius: 50%;
  display: block;
  margin: 0;

  .badge {
    background: unset !important;
    padding: 0;
    width: 100%;
    height: 100%;

    img {
      width: 100%;
      height: 100%;
    }
  }
}

/* ページャー---- */
.block-pager {
  max-width: 1216px;
  display: flex;
  align-items: center;
  justify-content: flex-end;

  .block-pager-list {
    margin: 0 auto calc(min(6.67vw, 128px) - 25px);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    column-gap: 5px;
  }

  .block-pager-list-item {
    position: relative;
    /* margin-right: min(1.41vw, 27px);*/
    z-index: 1;
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;

    a {
      display: block;

      span {
        font-family: Arial;
        font-size: var(--txt-16);
        font-weight: bold;
        line-height: calc(18 / 16);
      }

      &::after {
        content: "";
        width: min(8.33vw, 40px);
        height: auto;
        aspect-ratio: 1 / 1;
        border: 1px solid #dddddd;
        border-radius: 50%;
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: -1;
      }
    }

    &.block-pager-list-item--first {
      width: auto;
      height: var(--txt-13);
      aspect-ratio: 11/13;
      margin-right: min(1.04vw, 20px);
      background: url(../../img/usr/common/icon_pager_first.svg) no-repeat left center / contain;
      display: none;
    }

    &.block-pager-list-item--prev {
      width: auto;
      height: var(--txt-13);
      aspect-ratio: 6/13;
      margin-right: min(1.67vw, 12px);
      background: url(../../img/usr/common/icon_pager_prev.svg) no-repeat center center / contain;
      background-color: var(--color-pager-current);
      background-size: 6px;
      width: 52px;
      height: 32px;
      border-radius: 100vmax;

      a {
        width: 100%;
        height: 100%;
      }

      & a::after {
        display: none;
      }
    }

    &.block-pager-list-item--next {
      width: auto;
      height: var(--txt-13);
      aspect-ratio: 6/13;
      margin-left: min(1.67vw, 12px);
      background: url(../../img/usr/common/icon_pager_next.svg) no-repeat center center / contain;
      background-color: var(--color-pager-current);
      background-size: 6px;
      width: 52px;
      height: 32px;
      border-radius: 100vmax;

      a {
        width: 100%;
        height: 100%;
      }

      & a::after {
        display: none;
      }
    }

    &.block-pager-list-item--last {
      width: auto;
      height: var(--txt-13);
      aspect-ratio: 11/13;
      margin-right: 0;
      background: url(../../img/usr/common/icon_pager_last.svg) no-repeat left center / contain;
      display: none;
    }

    /* &:nth-last-child(3) {margin-right: min(1.67vw, 32px);}*/
    &.current {
      a {
        color: var(--color-wine);

        &::after {
          content: "";
          width: min(2.08vw, 40px);
          height: auto;
          aspect-ratio: 1/1;
          background: var(--color-pager-current);
          border-radius: 50%;
          display: block;
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
          z-index: -1;
          border: 0;
        }
      }
    }

    span {
      &.visually-hidden {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
      }
    }

    &.-ellipsis {
      & a::after {
        display: none;
      }
    }
  }

  &.block-goods-list-pager {
    /* 商品一覧のみのスタイル */
  }
}

/* フィルター---- */
.pane-main div.block-goods-list--params {
  /* width: calc(100% - var(--usr-scrollbar-width)) !important;*/
  /*calc(100% - var(--usr-scrollbar-width))*/
  /* justify-content: flex-end !important;*/
  /* margin: 24px calc(50% - ((100% - var(--usr-scrollbar-width)) / 2)) 64px !important;*/
  border: none !important;
  width: 100%;
  max-width: 1256px;
  padding-inline: 20px;
  margin: 80px auto 64px;

  .block-filter {
    width: 56px;
    margin: 0;
    display: none;

    /* カテゴリ一覧の場合は非表示 */
    .block-filter--filter-form {
      height: 100%;
    }

    .block-filter--header {
      width: 100%;
      height: 100% !important;
      padding: 0;
      display: flex;
      justify-content: flex-start;
      align-items: center;
      height: 100%;
      padding: 24px 0;
      background: #fff;

      &::before {
        width: 24px !important;
        height: 16px !important;
        background: url("../../img/usr/common/icon_filter.svg") no-repeat center center / contain;
        z-index: 1;
      }

      &.block-filter--open {
        background: #fff !important;
      }
    }

    .block-filter--header-label {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
    }
  }

  .block-goods-list--sort-order-items {
    width: 224px !important;
    background: #f5f5f5;
    border: none !important;

    .block-sort--header {
      width: 100% !important;

      h2 {
        width: 100% !important;
        font-size: var(--txt-16);
        text-align: center;
        /*text-align: left;padding-left: 52px !important;*/
        padding: 20px;

        &::after {
          content: "";
          aspect-ratio: 17/16;
          width: 17px;
          /*aspect-ratio: 21/11;width: 16px;*/
          height: auto;
          background: url(../../img/usr/common/icon_sort.svg) no-repeat center center / contain;
          display: inline-block;
          position: absolute;
          top: 50%;
          left: 40px;
          /*right: 25px;*/
          transform: translate(-50%, -50%);
          transition: all 0.4s;
          margin: 0;
        }
      }
    }
  }

  .block-sort--element {
    width: 320px;
    padding: 0 20px;
    background: #ffffff;
    border: 1px solid #bbbbbb;
    border-radius: 6px;
    top: calc(100% + 16px);
    filter: drop-shadow(0px 3px 6px rgba(0, 0, 0, 0.2));
  }

  .block-goods-list--sort-order-items .block-sort--element .block-sort--select {
    padding-left: 0;
  }

  .block-sort--element ul.block-sort--list a,
  .block-sort--element ul.block-sort--list span {
    padding: 20px 0;
    font-size: var(--txt-16);
    color: var(--color-text);
  }

  .block-sort--list-item+.block-sort--list-item {
    border-top: 1px solid #bbbbbb;
  }

  .block-sort--element ul.block-sort--list span::before {
    position: absolute;
    top: 50%;
    right: 0;
    left: auto;
    width: 16px;
    height: 11px;
    background: url("../../img/usr/common/icon_sort_check.svg") no-repeat center center / contain;
    transform: translateY(-50%);
  }
}

/* =========================================================
カテゴリ一覧ページここまで
========================================================= */
/* =========================================================
ブランド一覧ここから
========================================================= */
.page-brandlist {
  .pane-contents {
    margin-top: 80px;
  }

  h1 {
    font-size: var(--txt-28);
    font-family: var(--font-family-serif);
    font-weight: 600;
    padding: 0 0 var(--txt-32);
    border: 0;
    text-align: center;
    margin: 0;
  }

  .block-brand-list {
    max-width: 1424px;
    margin: 0 auto;
    padding-inline: 20px;
  }

  .block-brand-list--items {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 24px;
  }

  /* .block-brand-list--item:last-child .block-brand-list--item-name {
    margin-top: 32px;
  } */

  .block-brand-list--item-img .img-center {
    height: auto;
  }

  .block-brand-list--item-name {
    padding: 0;
  }

  .block-brand-list--name {
    margin: 0;
    padding: 0;
    font-size: var(--txt-16);
    font-weight: normal;
    line-height: 1.4;
    /* font-family: var(--font-family-serif); */
    border-bottom: 0;
    text-align: left;
    display: block;
  }

  .block-brand-list--item-comment {
    padding: 0;
    margin: 0;
    font-size: var(--txt-16);
    font-weight: normal;
    line-height: 1.6;
    /* font-family: var(--font-family-serif); */
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
  }

  .block-brand-list--caution {
    margin-top: 80px;
    font-size: var(--txt-12);
  }
}

/* =========================================================
ブランド一覧ここまで
========================================================= */
/* =========================================================
ブランド商品一覧（ブランドTOP）ここから
========================================================= */
.page-brandtop {
  .pane-main {
    display: flex;
    flex-direction: column;
  }

  /* みたままエリア */
  .block-no-code-cms {
    order: 0;
    margin-bottom: 80px;

    /* 動画MV */
    .block-brandtop__videoarea {
      height: 480px;
      width: 100%;
      object-fit: cover;

      .block-brandtop__video {
        width: 100%;
        height: 100%;
        object-fit: cover;
        pointer-events: none;
        object-position: 100% 75%;
      }
    }

    /* 画像MV */
    .block-no-code-cms--image.sp {
      display: none;
    }

    /* 旗 */
    .block-no-code-cms--image.flag {
      margin-top: -62px;

      >div {
        background-color: #fff;
        border-radius: 50%;
      }

      img {
        width: 80px;
        height: 80px;
        object-fit: cover;
        border-radius: 50%;
        margin: 20px;
      }
    }

    h1 {
      font-size: var(--txt-28);
      margin-block: 80px 70px;
      padding: 0;
      font-family: var(--font-family-serif);
      text-align: center;
      border-bottom: 0;

      span {
        font-size: var(--txt-20);
      }
    }

    h2 {
      font-size: var(--txt-24);
      margin-block: 0 24px;
      padding: 0;
      font-family: var(--font-family-serif);
      border-bottom: 0;
      font-weight: normal;
    }

    a {
      font-size: var(--txt-16);
      color: var(--color-accent);
      text-decoration: underline;
    }

    .block-no-code-cms--text {
      margin: 0;
      font-size: var(--txt-16);
      line-height: 1.8;
    }

    .block-no-code-cms--image {
      margin: 0;
    }

    ul {
      padding-bottom: 12px;

      li {
        padding-left: 33px;
        margin-bottom: 17px;
        position: relative;

        &:after {
          content: "";
          background: url(../../img/usr/common/icon_nikukyu.svg) no-repeat center center / 100%;
          display: inline-block;
          width: 27px;
          height: 25px;
          border: 0;
          transform: translateY(-50%);
          position: absolute;
          top: 50%;
          left: 0;
        }
      }
    }

    .block-no-code-cms--button {
      font-size: var(--txt-20);
      font-family: var(--font-family-serif);
      font-weight: 600;
      line-height: calc(31 / 22);
      width: 100%;
      padding: min(3.2vw, 17px) 0 var(--txt-16);
      color: var(--color-text);
      border: 1px solid #121212;
      background: #fff;
      transition: all 0.4s;
      display: flex;
      justify-content: center;
      align-items: center;
      margin: auto;
      max-width: 432px;
      margin-top: 64px;
      border-radius: 0;
      text-decoration: none;

      &:hover {
        background: var(--color-light-pink);
      }
    }

    .block-no-code-cms--two-column {
      max-width: 1256px;
      padding-inline: 20px;
      margin: 0 auto;
      column-gap: 53.7px;
      justify-content: space-between;

      dd {
        flex: initial;
        min-width: auto;
        margin: 0;
      }

      dd:last-child {
        max-width: 812px;
        width: 100%;
      }
    }

    .block-no-code-cms--two-column:first-of-type {
      .block-no-code-cms--image {
        width: 340px;
      }
    }

    .block-no-code-cms--two-column:last-of-type {
      column-gap: 23px;
      margin-top: 64px;
      font-size: var(--txt-16);

      .block-no-code-cms--two-column-left-ratio-0 {
        max-width: 448px;
      }
    }
  }

  #freearea1 .block-top-event--more a {
    color: var(--color-text);
    border: 1px solid #121212;
    background: #fff;
    transition: all 0.4s;

    &:hover {
      background: var(--color-light-pink);
    }
  }

  /* 商品 */
  #freearea1 {
    order: 1;
  }

  /* 下部商品エリア */
  .block-top-event:not(.block-top-newitem) {
    max-width: 1256px;
    background-color: inherit;
    padding-block: 0;
    margin-block: 0;
    margin: 0 auto;

    .block-thumbnail-t {
      margin: 0;
    }

    & .block-thumbnail-t--item {
      box-shadow: none;
      border-radius: 0;
    }
  }

  /* パンくず */
  .block-topic-path {
    order: 99;
  }

  /* .block-top-event__button {max-width: 320px;margin-top: 40px;}*/
}

/* =========================================================
ブランド商品一覧（ブランドTOP）ここまで
========================================================= */
/* =========================================================
新商品、おすすめ商品 ホバー　ここから
========================================================= */
.block-thumbnail-t--item {
  a {
    figure {
      position: relative;

      img {
        transition: -webkit-transform .3s .2s;
        aspect-ratio: 200 / 263 !important;
        width: 100%;
      }

      &::before {
        content: "";
        opacity: 0;
        width: 100%;
        height: 100%;
        background: url(../../img/usr/common/item_hover.png) no-repeat center center / 68px auto;
        background-color: var(--color-deep-burgundy);
        transition: opacity 0.4s ease;
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 1;
        /*
        top: 0;
        left: 0;
        */
      }
    }

    &:hover {
      figure {
        overflow: hidden;

        &::before {
          opacity: 0.78;
          transition: opacity .4s ease;
        }

        img {
          transform: scale(1.05);
          transition: -webkit-transform .3s .2s;
        }
      }
    }
  }
}

.block-top-recommend__heroRow {
  a {

    picture {
      position: relative;
      overflow: hidden;

      img {
        transition: -webkit-transform .3s .2s;
        /* aspect-ratio: 200 / 263 !important; */
      }

    }

    picture,
    .movie {
      position: relative;
      display: block;

      &::before {
        content: "";
        opacity: 0;
        width: 100%;
        height: 100%;
        background: url(../../img/usr/common/item_hover.png) no-repeat center center / 79px auto;
        background-color: var(--color-deep-burgundy);
        transition: opacity 0.4s ease;
        display: block;
        z-index: 1;
        position: absolute;
        top: 0;
        left: 0;
      }
    }

    &:hover {

      picture,
      .movie {
        &::before {
          opacity: 0.78;
          transition: opacity .4s ease;
        }
      }

      picture {
        overflow: hidden;

        img {
          transform: scale(1.05);
          transition: -webkit-transform .3s .2s;
        }
      }
    }
  }
}

/* =========================================================
新商品、おすすめ商品 ホバー　ここまで
========================================================= */
/*　コメント3　 定期便ボタン */
div.block-add-cart div.block-goods-comment3 {
  margin: 0;

  .block-goods-teikibin__button {
    margin: 16px 0 0;
    max-width: none;
    border-color: var(--color-text);
    color: var(--color-text);
    background-color: white;

    &:hover {
      background-color: var(--color-light-pink);
    }
  }
}

/*　コメント3　 通常商品へ戻るボタン */
.block-goods-tanpin {
  margin-top: 24px;
  font-size: var(--txt-16);

  & .block-goods-tanpin__MoreIcon {
    display: inline-block;
    margin-right: 0.4em;
    width: 22px;
    height: 14px;
    background: url(../../img/usr/common/icon_arrow_gray.svg) no-repeat center center / 100%;
  }
}

.block-goods-sns {
  display: none;
}

/* 下部コメント部分エリア */
.block-goods-bottom-comment {
  background-color: #f8f7f4;
  padding-block: 52px 80px;
  margin-top: 80px;

  >div {
    max-width: 960px;
    margin: 0 auto;
  }

  a {
    text-decoration: underline;
    text-underline-offset: 4px;
  }

  p {
    font-size: var(--txt-16);
    line-height: 1.7;
  }

  ol {
    border-left: 1px solid #cccccc;
    padding-left: 32px;
    font-size: var(--txt-16);
    line-height: 1.7;
  }

  h2 {
    font-size: var(--txt-24);
    font-family: var(--font-family-serif);
    font-weight: 600;
    padding: 0 0 var(--txt-32);
    border: 0;
    margin: 0;
  }

  h3 {
    font-size: var(--txt-24);
    font-family: var(--font-family-serif);
    font-weight: 600;
    padding: 0 0 var(--txt-24);
    border: 0;
    margin: 0;
  }

  /* visumo部分 */
  .block-goods-visumo-video {
    width: 100%;
  }

  /* 成分・原材料セクション */
  .block-goods-material {
    margin-top: 80px;
  }

  /* 表 */
  .c-table-wrap {
    overflow-x: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;

    &::-webkit-scrollbar {
      display: none;
    }
  }

  .c-table {
    width: 100%;
    border-top: 1px solid #dddddd;
    border-left: 1px solid #dddddd;
    font-size: var(--txt-16);
  }

  .c-table__head.-w16p,
  .c-table__body.-w16p {
    width: 16.66%;
  }

  .c-table__head.-w25p,
  .c-table__body.-w25p {
    width: 25%;
  }

  .c-table__head.-w33p,
  .c-table__body.-w33p {
    width: 33.333%;
  }

  .c-table__head.-w40p,
  .c-table__body.-w40p {
    width: 40%;
  }

  .c-table__head,
  .c-table__body {
    border-bottom: 1px solid #dddddd;
    border-right: 1px solid #dddddd;
  }

  .c-table__head {
    background: #f7f7f7;
    padding: 20px 24px;
    vertical-align: text-top;
    font-weight: normal;
    text-align: left;
    font-size: var(--txt-14);
  }

  .c-table__head,
  .c-table__body {
    border-bottom: 1px solid #dddddd;
    border-right: 1px solid #dddddd;
  }

  .c-table__body {
    padding: 20px 24px;
    background-color: var(--main--background-color);
    font-size: var(--txt-16);
  }

  /* 商品説明セクション */
  .block-goods-productDescription {
    margin-top: 80px;

    >p {
      margin-bottom: 32px;
    }
  }

  .block-goods-productDescription--card:not( :has(.block-goods-productDescription--cardwrap)) {
    background: #ffffff;
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 40px;
    border: 1px solid #cccccc;
    padding: 52px;
  }

  .block-goods-productDescription--card+.block-goods-productDescription--card {
    margin-top: 40px;
  }

  .block-goods-productDescription--card:has(.block-goods-productDescription--cardwrap) {
    background: #ffffff;
    border: 1px solid #cccccc;
    padding: 52px;
  }

  .block-goods-productDescription--cardwrap {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 40px;

    .block-goods-productDescription--pic {
      width: max-content;
    }
  }

  .block-goods-productDescription--notes {
    font-size: var(--txt-12);
    color: var(--color-gray);
    margin-top: 4px;
  }

  /* 商品説明　テキストベースの説明 */
  .block-goods-productDescription--text-based {
    h3 {
      border-bottom: 1px solid #cccccc;
      padding-bottom: 16px;
      margin-bottom: 32.5px;
    }

    section {
      margin-top: 80px;
    }

    .text-based-listitem {
      dt {
        font-size: var(--txt-24);
        font-family: var(--font-family-serif);
        font-weight: 500;
        padding: 40px 0 var(--txt-16);
      }

      dd {
        font-size: var(--txt-16);
      }
    }

    .text-based-notes {
      color: var(--color-gray);
      margin-top: 40px;
    }

    .product-icon-list {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
      gap: 24px 40px;

      .product-icon__caption {
        margin-top: 8px;
        font-size: var(--txt-16);
      }
    }
  }

  /* その他情報 */
  .block-goods-productInfo {
    margin-top: 32px;

    p+p {
      margin-top: 24px;
    }
  }
}

/* =========================================================
フリーページ　※コラム以外 ここから
========================================================= */
.page-contentspages {
  .block-freepage {
    max-width: 1040px;
    padding-inline: 20px;
    margin: 84px auto 0;

    figure {
      margin-block: 20px;
    }

    figcaption {
      font-size: var(--txt-16);
      text-align: left;
    }

    p {
      font-size: var(--txt-16);
      line-height: 1.9;
      letter-spacing: -0.03em;
    }

    a {
      text-decoration: underline;
      text-underline-offset: 4px;
      color: inherit;

      &:hover {
        color: var(--color-bronze-brown) !important;
      }
    }

    td,
    th {
      a {
        text-decoration: underline;
        text-underline-offset: 4px;
      }
    }

    p+p {
      margin-top: 32px;
    }

    small {
      font-size: var(--txt-12);
    }

    section {
      margin-top: 80px;
      margin-inline: auto;

      p {
        line-height: 1.5;
      }
    }

    h1 {
      font-size: var(--txt-28);
      margin-bottom: 40px;
      padding: 0;
      font-family: var(--font-family-serif);
      text-align: center;
    }

    h2 {
      font-size: var(--txt-24);
      margin-bottom: 28px;
      padding: 0;
      border-bottom: 0;
      color: var(--color-deep-burgundy);
      font-weight: 500;
      display: flex;
      align-items: center;

      &::before {
        content: "";
        display: inline-block;
        width: 26px;
        height: 24px;
        margin-right: 15px;
        background: url(../../img/usr/common/icon_cat.svg) center bottom / 100% no-repeat;
      }
    }

    h3 {
      font-size: var(--txt-16);
      font-weight: bold;
      color: var(--color-conversion);
      padding: 0;
      border: 0;
      margin-top: 32px;
      margin-bottom: 8px;
    }

    /* リスト */
    li {
      font-size: var(--txt-16);
    }

    ul+ul {
      margin-top: 24px;
    }

    /* 大きめのリスト */
    .list-l {
      li {
        font-size: var(--txt-20);
      }

      li+li {
        margin-top: 24px;
      }

      ul {
        margin-top: 20px;

        li {
          font-size: var(--txt-16);
          color: var(--color-gray);
          font-weight: 500;
          margin-top: 0;
          margin-left: 20px;
        }
      }
    }

    /* ol */
    ol {
      list-style: none;
    }

    /* 表 */
    .c-table-wrap {
      overflow-x: scroll;
      -ms-overflow-style: none;
      scrollbar-width: none;

      &::-webkit-scrollbar {
        display: none;
      }
    }

    .c-table {
      width: 100%;
      border-top: 1px solid #cccccc;
      border-left: 1px solid #cccccc;
      font-size: var(--txt-16);
      margin-top: 34px;
    }

    .c-table__head.-w16p,
    .c-table__body.-w16p {
      width: 16.66%;
    }

    .c-table__head.-w25p,
    .c-table__body.-w25p {
      width: 25%;
    }

    .c-table__head.-w33p,
    .c-table__body.-w33p {
      width: 33.333%;
    }

    .c-table__head.-w40p,
    .c-table__body.-w40p {
      width: 40%;
    }

    .c-table__head,
    .c-table__body {
      border-bottom: 1px solid #cccccc;
      border-right: 1px solid #cccccc;
    }

    .c-table__head {
      background: #faf6ef;
      padding: 12px 32px;
      vertical-align: middle;
      font-weight: normal;
      text-align: left;
    }

    .c-table__head,
    .c-table__body {
      border-bottom: 1px solid #cccccc;
      border-right: 1px solid #cccccc;
    }

    .c-table__body {
      padding: 30px 40px;
    }

    /* ボタン */
    .block-freepage__btn {
      margin-bottom: 40.5px;

      a {
        text-decoration: none;
        color: #FFF;
      }

      &:hover {
        color: var(--color-bronze-brown) !important;
      }
    }

    /* ナビ */
    .block-freepage__nav {
      font-weight: 500;

      p {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        line-height: 3;
      }

      span {
        color: var(--color-gray);
      }

      i {
        color: var(--color-gray02);
        padding-inline: 15px 20px;
        font-style: normal;
      }
    }

    /* 余白 */
    .u-mb-l {
      margin-bottom: 40px;
    }

    /* テキスト中央寄せ */
    .u-txt-center {
      text-align: center;
    }

    /* grid 2列 */
    .grid-col2 {
      display: grid;
      gap: 40px;
      grid-template-columns: auto 1fr;
      margin-bottom: 20px;
    }

    /* 商品のお届けページ */
    .delivery-table {
      margin-bottom: 20px;

      .c-table__head {
        padding: 12px 20px;
        text-align: center;
      }

      .c-table__body {
        padding: 30px 25px;
        vertical-align: middle;
      }
    }

    /* 特典ページ */
    .tokuten-merit {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      gap: 20px;
      margin: 0 auto 20px;

      li {
        border: 1px solid var(--color-gray02);
      }
    }

    h2 span {
      display: inline-block;
      position: relative;
      text-align: center;
      line-height: 2;
      text-align: center;
      padding: 0 17px 0 12px;
      font-size: var(--txt-16);
      background-color: var(--color-accent);
      color: var(--main--background-color);
      box-sizing: border-box;

      &::after {
        position: absolute;
        content: "";
        width: 0px;
        height: 0px;
        z-index: 1;
        top: 0;
        right: 0;
        border-width: 18px 9px 18px 0px;
        border-color: transparent #fff transparent transparent;
        border-style: solid;
      }
    }

    h2:has(span) {
      &::before {
        display: none;
      }
    }

    /* プライバシーページ */
    .privacy-flex {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-top: 32px;
    }

    /* FAQページ */
    .block-faq-nav {
      p {
        background-color: #faf6ef;
        color: #bbbbbb;
        padding: 22px 40px;
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;

        a {
          color: var(--color-conversion);
          text-decoration: none;
          font-weight: 600;
        }

        i {
          font-style: normal;
          padding: 0 0.5em;
        }
      }

      .navfaq {
        font-size: var(--txt-16);
        font-weight: bold;
        margin-bottom: 24px;
      }
    }

    .block-faq-nav+.block-faq-nav {
      margin-top: 42px;
    }

    .c-faq+.c-faq {
      border-top: 1px solid #dbc4a7;
      padding-top: 33px;
      margin-top: 33px;
    }

    .c-faq__ques {
      padding-left: 32px;
      text-indent: -22px;
      margin-bottom: 16px;
      font-size: var(--txt-16);
      font-weight: 500;
      color: var(--color-conversion);
    }

    .c-faq__ques::before {
      content: "Q.";
      display: inline-block;
      width: 18px;
      font-size: var(--txt-20);
      text-align: center;
      font-family: var(--font-family-corp);
    }

    .c-faq__ans {
      padding-left: 32px;
      text-indent: -22px;
      margin-left: 65px;
      font-size: var(--txt-16);
      font-weight: 500;
    }

    .c-faq__ans::before {
      content: "A.";
      display: inline-block;
      width: 18px;
      font-size: var(--txt-20);
      text-align: center;
      font-family: var(--font-family-corp);
    }

    /*/.block-freepage */
  }
}

/* =========================================================
フリーページ　※コラム以外 ここまで
========================================================= */
/* =========================================================
買い物かご　ここから
========================================================= */
.block-cart--contents .block-cart--goods-list .block-thumbnail-favorite {
  border: none;
  padding: 0;
  margin: 0;
  aspect-ratio: 28/24;
  width: 28px;
  height: 24px;
  background: none;
  position: absolute;
  bottom: 0;
  right: 0;

  .heart {
    width: 28px;
    height: 24px;
    display: block;
    background: url("../../img/usr/common/icon_bookmark01.svg") no-repeat center / contain;
  }

  &.is-active {
    .heart {
      background: url("../../img/usr/common/icon_bookmark02.svg") no-repeat center / contain;
    }
  }
}

.cart-sub {
  .pane-main {
    margin-top: 80px;

    h1 {
      font-size: var(--txt-28);
      margin-bottom: 40px;
      padding: 0;
      font-family: var(--font-family-serif);
      text-align: center;
    }

    h2,
    .block-cart--rule {
      font-family: var(--font-family-serif);
      font-size: var(--txt-24);
      font-weight: 600;
      border-bottom: 0;
      margin: 80px 0 32px;
      padding: 0;
    }

    .block-cart--rule {
      margin-top: 0;
    }

    .block-cart--subtotal-container .block-cart--subtotal-price,
    .block-cart--promotion-discount-price {
      /*color: var(--color-accent);*/
      color: var(--color-deep-burgundy);
    }

    .block-promotion-message--content {
      border: 1px solid var(--color-accent);
      margin: 10px 0;

      .promotion-benefit {
        color: var(--color-accent);
      }
    }

    .block-cart--procedure,
    .block-order-method--procedure,
    .block-order-estimate--procedure {
      margin: 0;
      padding: 0;
      border: 0;
    }

    .block-cart--procedure-container,
    .block-order-method--procedure-container-wrapper,
    .block-order-estimate--procedure-container {
      background: var(--color-pager-current);
    }

    .block-cart--order-button-description {
      margin-bottom: 10px;
    }

    .block-cart--procedure-container .action-buttons {
      margin-top: 0;
    }

    .block-cart--amazonpay-description {
      margin: 10px 0;
    }

    /*共通　商品名 */
    .block-cart--goods-list-item .block-cart--goods-list-item-name,
    .block-order-method--goods-name,
    .block-order-estimate--goods-name {
      font-size: var(--txt-16);
      font-weight: 500;
    }

    /*共通　価格 */
    .block-cart--goods-list-item-price,
    .block-order-estimate--goods-price-num {
      font-size: var(--txt-16);
      font-weight: 400;
      line-height: calc(24 / 16);
    }

    /* 下線リンクconversionカラー */
    .block-cart--continue-shopping-link,
    .block-order-complete--home a {
      /*color: var(--color-conversion);*/
      color: var(--color-bronze-brown);
      font-size: var(--txt-16);
      text-underline-offset: 4px;

      &:hover {
        opacity: 0.7;
        transition: opacity 0.4s ease;
      }
    }

    /* ボタン */
    .action .btn.btn-primary,
    .block-order-method--procedure-container .block-order-method--next-btn,
    .block-order-estimate--commit-btn {
      color: #fff;
      background: var(--color-primary);
      border-color: 1px solid var(--color-primary);
      letter-spacing: -0.03em;
      font-size: var(--txt-20);

      &:hover {
        background: var(--color-light-pink);
        opacity: 1;
        color: var(--color-primary);
      }
    }

    .btn.btn-danger {
      font-family: var(--font-family-serif);
      font-weight: 600;
      line-height: calc(31 / 22);
      width: 100%;
      padding: min(3.2vw, 17px) 0 var(--txt-16);
      color: var(--color-text);
      border: 1px solid #121212;
      background: #fff;
      transition: all 0.4s;
      display: flex;
      justify-content: center;
      align-items: center;
      margin: auto;
      font-size: var(--txt-14);
      padding: 5px;

      &:hover {
        background: var(--color-light-pink);
        opacity: 1;
      }
    }

    .btn.btn-default {
      margin-top: 40px;
      max-width: 320px;
    }

    .btn.btn-primary {
      margin-top: 0;
    }

    /* 最近見た商品 */
    .block-cart-recent-item--header span {
      margin: 20px 0;
      font-size: 26px;
      font-weight: normal;
      font-family: var(--font-family-serif);
    }

    /* お気に入りに登録中の商品 */
    .block-bookmarkslider {
      margin-top: 80px;

      h2 {
        margin: 20px 0;
        padding: 0;
        font-size: 26px;
        font-weight: normal;
        font-family: var(--font-family-serif);
        text-align: center;
      }

      .block-bookmarkslider--goods-image {
        width: 100%;
        display: block;
      }

      .block-bookmarkslider--goods-image figure {
        width: 100%;
        height: auto;
        aspect-ratio: 220 / 263;
      }

      .block-bookmarkslider--goods-description {
        padding: min(0.52vw, 10px) 0 0;
      }

      .block-bookmarkslider--goods-name {
        font-size: var(--txt-14);
        font-weight: 600;
        line-height: calc(24 / 16);
        color: var(--color-text);
        margin-bottom: 8px;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        overflow: hidden;
      }

      .block-bookmarkslider--price {
        font-size: var(--txt-16);
        font-weight: 400;
        line-height: calc(24 / 16);
        margin-bottom: 8px;
      }

      .block-bookmarkslider--item {
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        height: auto;
      }

      .block-bookmarkslider--item>a {
        flex-grow: 1;
        display: flex;
        flex-direction: column;
      }

      .block-bookmarkslider--goods-description {
        flex-grow: 1;
      }

      .block-bookmarkslider--cart-btn {
        margin-top: auto;
      }

      .swiper-bookmarklist-prev,
      .swiper-bookmarklist-next {
        display: none;
      }

      .btn-primary {
        font-size: var(--txt-16);
        padding: var(--txt-10) 0;
      }
    }

    /* cartページ */
    .block-thumbnail-t--goods-image figure.img-center img {
      width: 100%;
      height: auto;
      aspect-ratio: 220 / 263;
    }

    .block-cart--goods-list li {
      padding: 20px;
      border-bottom: 1px solid #ccc;
    }

    .block-cart--goods-list-item-container {
      padding: 10px 32px;
    }

    .block-cart--form-post {
      column-gap: 32px;
    }

    .block-cart--goods-list li {
      border-bottom: 1px solid #ccc;
    }

    .block-cart--continue-shopping {
      margin: 80px 0 0;
    }

    .block-order-method--dest-title-salesinclude {
      margin-top: 20px;
    }

    /* methodページ */
    .block-order-method--container {
      margin-top: 80px;
    }

    .block-order-method--orderer-title {
      margin-top: 0;
    }

    .block-order-method--orderer-detail {
      border: 0;
      padding: 0;
    }

    .block-order-estimate--commit .action-buttons {
      margin-top: 0;
    }

    .block-order-estimate--commit > span {
      display: none;
    }

    .block-order-method--goods-item-image figure {
      background: white;
    }

    .block-order-method--payment-content,
    .block-order-method--delivery-datetime-content,
    .block-order-method--goods-content,
    .block-order-method--dest-content,
    .block-order-method--host-content,
    .block-order-method--host-confirmation {
      margin: 0;
      padding: 0;
      border: 0;
    }

    .block-order-method--dest-item,
    .block-order-method--dest-add {
      border-bottom: 0;
      /*padding: 0;*/
    }

    .block-regular-cycle--cycle-type {
      display: flex;
    }

    .block-regular-cycle--cycle-timing-m>div {
      margin: 5px 0 5px 0;
    }

    /* h3レベル */
    .block-order-method--promotion-title,
    .block-order-method--point-use-title,
    .block-order-method--payment-method-title,
    .block-order-method--coupon-title,
    .block-order-method--delivery-service-title,
    .block-order-method--date-spec-title,
    .block-order-method--time-spec-title,
    .block-order-method--receiving-method-title,
    .block-order-method--delivery-note-title,
    .block-order-method--invoice-amount-recorded-title,
    .block-order-method--delivery-company-title,
    .block-order-method h3 {
      margin-block: 20px 10px;
    }

    .block-order-method--date-spec,
    .block-order-method--time-spec {
      display: block;
    }

    .block-order-method--delivery-service,
    .block-order-method--date-spec,
    .block-order-method--regular-content,
    .block-regular-cycle--deliv_date,
    .block-order-method--time-spec,
    .block-order-method--receiving-method,
    .block-order-method--delivery-note,
    .block-order-method--invoice-amount-recorded,
    .block-order-method--delivery-company {
      padding: 0;
      border-bottom: 0;
    }

    .block-order-method--goods {
      margin-top: 80px;
    }

    /* estimateページ */
    .block-order-estimate--container {
      margin-top: 80px;
    }

    .block-order-estimate--content {
      padding: 0;
      border: 0;
    }

    .block-order-estimate--dest-title,
    .block-order-estimate--orderer-title,
    .block-order-estimate--regular-cycle-title {
      margin-top: 0;
      line-height: 1;
    }

    .block-order-estimate--confirmation-title h3,
    .block-order-estimate--date-spec h3,
    .block-order-estimate--time-spec h3 {
      padding-top: 0;
    }

    .block-order-estimate--dest-btn-content {
      padding: 0 20px 10px 0;
    }

    .btn.block-order-estimate--change-btn {
      margin: 0;
      width: fit-content;
      padding: 5px 10px;
      font-size: var(--txt-14);
    }

    .block-order-estimate--discount-info .block-order-estimate--point .block-order-estimate--change-btn,
    .block-order-estimate--discount-info .block-order-estimate--promotion-code .block-order-estimate--change-btn,
    .block-order-estimate--discount-info .block-order-estimate--coupon .block-order-estimate--change-btn,
    .block-order-estimate--method-pay-content .block-order-estimate--change-btn,
    .block-order-estimate--change-btn {
      right: 20px;
      top: 0;
    }

    .block-order-estimate--regular-cycle-confirmation {
      margin-top: 80px;
    }

    .block-order-estimate--regular-cycle li {
      border-top: 1px solid #cccccc;
      border-left: 1px solid #cccccc;
      border-right: 1px solid #cccccc;
    }

    .block-order-estimate--regular-cycle>li>span:first-of-type {
      background-color: var(--tag-background-color);
      color: var(--color-text);
      font-weight: normal;
    }

    .block-order-estimate--goods-content,
    .block-order-estimate--comment-content {
      /*border: 1px solid #CCCCCC;*/
      border: none;
    }

    .block-order-estimate--goods-content .block-order-estimate--postage {
      border-bottom: 0;
    }

    .block-order-estimate--goods-list .block-order-estimate--goods-item {
      border-bottom: 1px solid #cccccc;
    }

    .btn.block-order-estimate--return-agree {
      letter-spacing: -0.03em;
      font-size: var(--txt-14);
      margin-block: 5px;
      padding: 5px;
    }

    .block-order-estimate--total-price {
      font-size: var(--txt-24);
    }

    div.form-group.block-order-estimate--mailnews {
      border-bottom: 0;
    }

    .block-order-estimate--mailnews-message {
      margin-bottom: 0.6em;
    }

    .block-order-estimate--dest .block-order-estimate--salesinclude-btn {
      position: initial;
    }

    .block-order-estimate--goods-content {
      .block-icon {
        position: initial;
        aspect-ratio: auto;
      }
    }

    /* order ご注文完了ページ */
    .block-order-complete {
      max-width: 1060px;
      padding-inline: 20px;
      margin: 0 auto;
    }

    .block-order-complete--message {
      text-align: left;
      font-size: var(--txt-16);
      margin: 0 0 40px;
      line-height: 1.8;
    }

    .block-order-complete--message p,
    .block-order-complete--orderid td a,
    .block-order-complete table.block-order-complete--orderid th {
      text-align: left !important;
      font-size: var(--txt-16);
      color: var(--color-text);
      font-weight: 500;
      text-underline-offset: 4px;
      display: block;
    }

    .block-order-complete--orderid td a:hover {
      color: var(--color-conversion);
    }

    .block-order-complete--home {
      margin: 80px auto 65px;
      text-align: center;
    }

    .block-order-complete__list {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 60px;
    }

    .block-order-complete__txt {
      margin-top: var(--txt-16);
    }

    .block-order-complete__videoarea {
      display: flex;
      justify-content: center;
      margin: 0 auto 40px;

      .block-order-complete__video {
        width: min(100%, 522px);
      }
    }
  }
}

/* クーポンモーダル */
.modal-dialog,
.modal-alert {
  position: fixed;
  height: 90svh;
  overflow: auto;
  /* top: 50%;
  transform: translateY(-50%); */
}

/* =========================================================
買い物かご　ここまで
========================================================= */
/* =========================================================
マイページ　ここから
========================================================= */
body.mypage-sub,
.block-login--member-body,
.block-login--first-time-body {
  background-color: #fbf9f4;
}

body.page-menu {

  /* グレー矢印 */
  .block-mypage--logout::after {
    background: url(../../img/usr/common/icon_arrow_gray.svg) no-repeat center center / 100%;
  }

  .block-mypage--logout,
  .block-mypage-head .text-link {
    padding-left: 27px;
    font-size: 14px;
    color: #121212;

    &:hover,
    &:focus {
      color: var(--color-bronze-brown);
    }
  }

  .block-mypage-head .text-link:after {
    background: url(../../img/usr/common/icon_arrow_gray.svg) no-repeat center center / 100%;
    display: inline-block;
    width: 20px;
    height: 13px;
    border: 0;
    transform: translateY(-50%);
  }

  /* 黒矢印 */
  .block-mypage-footermenu--nav-item::after {
    width: 20px;
    height: 13px;
    display: block;
    border-top: 0;
    border-right: 0;
    right: 0;
    transform: translateY(-50%);
    background: url(../../img/usr/common/icon_arrow.svg) no-repeat center center / 100%;
  }

  /* 上部エリア */
  /* .pane-contents .container {
    max-width: 1384px;
  } */

  .pane-main {
    padding-top: 0;
  }

  .block-mypage--customer-status {
    border: 0;
    margin: 0;
    padding: 0;
    background: unset;
  }

  .block-mypage--customer-status-wrap {
    padding: 0;
    background: unset;
  }

  .block-mypage--head h1 {
    font-family: var(--font-family-serif);
    font-size: var(--txt-28);
    padding: 0;
  }

  .block-mypage--coupon-status-image {
    position: relative;

    img {
      display: none;
    }
  }

  .block-mypage--coupon-status-image:after {
    content: "";
    width: 26px;
    height: 25px;
    display: block;
    background-image: url(../../img/usr/common/icon_coupon.svg);
    background-size: 26px;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    background-color: transparent;
  }

  /* バナー */
  .touroku_present_bnrarea {
    border-top: 1px solid #ccc;
    padding-top: 60px;
  }

  /* サイドナビ */
  .block-mypage-sidemenu {
    background: unset;

    &.is-open {
      border-right: 0;
    }
  }

  .block-mypage-sidemenu--nav {
    overflow: visible;
  }

  .block-mypage-sidemenu--nav-item::after {
    width: 20px;
    height: 13px;
    display: block;
    border-top: 0;
    border-right: 0;
    right: 0;
    transform: translateY(-50%);
    background: url(../../img/usr/common/icon_arrow.svg) no-repeat center center / 100%;
  }

  .block-mypage-sidemenu--nav-title::after {
    content: "";
    aspect-ratio: 13 / 25;
    width: min(2.71vw, 13px);
    height: auto;
    background: url(../../img/usr/common/icon_toggle_arrow.svg) no-repeat center center / 100%;
    display: inline-block;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%) rotate(360deg);
    transition: all 0.4s;
  }

  .block-mypage-sidemenu--nav-tree.is-active .block-mypage-sidemenu--nav-title::after {
    transform: translate(-50%, -50%) rotate(360deg);
  }

  .block-mypage-sidemenu--nav-title::before {
    display: none;
  }

  .block-mypage-sidemenu--nav-title {
    padding: 20px 0;
    font-family: var(--font-family-serif);
    font-weight: bold;
    border-bottom: 1px solid #cccccc;
    cursor: pointer;
  }

  .block-mypage-sidemenu--nav-tree+.block-mypage-sidemenu--nav-tree {
    margin-top: 12px;
  }

  .block-mypage-sidemenu--nav-link {
    padding: 0.5em 0;
    border-bottom: 1px solid #cccccc;
    font-family: var(--font-family-serif);
    font-weight: bold;
  }

  /* サイドメニュー内ボタンエリア */
  .block-mypage-sidemenu--btn-area {
    margin: 1vw 0 0;

    .block-mypage--update-address-book {
      max-width: 250px;
      margin: 0 auto;
      border-radius: 0;
      background: inherit;
    }
  }

  /* ランク */
  div.block-mypage--rank-wrap {
    flex-direction: column;
    align-items: baseline;
  }

  .block-mypage--rank-next:before {
    display: none;
  }

  .block-mypage--rank-next {
    width: 100%;
    margin-left: 0;
  }

  .block-mypage--rank-now .block-mypage--rank-status-message {
    color: var(--color-bronze-brown);

    small {
      color: var(--color-text);
    }
  }

  .rank-image+.block-mypage--rank-status-message {
    padding-left: 0;
  }

  .block-mypage--rank-status-rank .rank-image {
    display: none;
  }

  div.block-mypage--rank-status-meter {
    display: none;
  }

  .block-mypage--rank-up-detail {
    border-top: 0;
  }

  .block-mypage--rank-next .block-mypage--rank-up-detail:before {
    display: none;
  }

  .block-mypage--rank-status-meter-message {
    margin-left: 0;
    padding-left: 0;
    display: flex;
    align-items: baseline;
  }

  .block-mypage--point-detail {
    align-items: self-start;
    flex-direction: column;
  }

  .block-mypage--point-number {
    margin: 0;
  }

  .point-caution+.point-number {
    margin-left: 0;
    color: var(--color-bronze-brown);
  }

  .block-mypage--mypoint-duedate {
    margin-left: 0;
  }

  .block-mypage--point-mypoint {
    color: var(--color-wine);
  }

  .block-mypage--mypoint-point {
    margin: 0;
  }

  .block-mypage--point-mypoint>small {
    margin-left: 0;
    color: var(--color-bronze-brown);
  }

  .block-mypage--actionpoint {
    padding: 20px 0;
  }

  /* 次回の定期状況セクション下 */
  .block-mypage--title {
    font-family: var(--font-family-serif);
    font-weight: 600;
  }

  .block-regular-purcharse-list--list a {
    text-decoration: none;
  }

  .block-mypage--coupon .tab-button {
    display: none;
  }

  .block-coupon-list--coupon-name {
    padding-inline: 0;
  }

  .block-mypage--favorite {
    padding: 0;
  }

  .block-bookmarkslider--add-cart .block-bookmarkslider--cart-btn .block-add-cart-btn {
    color: #fff;
    background: var(--color-primary);
    border: 1px solid var(--color-primary);

    &:hover {
      background: var(--color-light-pink);
      opacity: 1;
      color: var(--color-primary);
    }
  }

  .block-mypage--restocking {
    padding: 0;
  }

  /* マイページ　サブタイトルアイコン削除 */
  .pane-main .block-mypage section h2,
  .pane-main .block-mypage .block-mypage--coupon h2 {
    padding-left: 0;

    &::after {
      display: none;
    }
  }

  /* /body.page-menu */
}

.status-progress--circle {
  background: var(--color-header-bg);
}

.status-order .status-progress--bar:first-child .status-progress--circle {
  background-color: var(--color-primary);
}

/* マイページ フッターカレンダー */
.page-menu .pane-footer .pane-contents .container {
  display: block;
  grid-template-columns: unset;
}

.page-menu .pane-footer .pane-main {
  width: 100%;
  padding-top: 0;
}

.page-menu .block-mypage--coupon-card {
  background-color: #fff;
}

.block-pickup-list-p--goods-image figure {
  background-color: white;
}

.pane-main .block-goods-list--params .block-goods-list--display-style-items {
  border-left: none;
}

/* =========================================================
マイページ　ここまで
========================================================= */
/* =========================================================
マイページ下層 ここから
========================================================= */
.mypage-sub {
  &.page-menu {
    background: var(--color-mypage-bg);

    /* .pane-contents .container {
      max-width: 1216px;
    } */
  }

  .pane-main>div:first-of-type {
    max-width: 1100px;
    margin: 0 auto;
  }

  .pane-main {
    margin-top: 80px;

    h1 {
      font-family: var(--font-family-serif);
      font-size: var(--txt-28);
      font-weight: bold;
    }

    h2,
    .legend {
      font-family: var(--font-family-serif);
      font-size: var(--txt-24);
      font-weight: 600;
      border-bottom: 0;
    }
  }

  /* 黒矢印 */
  .block-mypage-footermenu--nav-item::after {
    width: 20px;
    height: 13px;
    display: block;
    border-top: 0;
    border-right: 0;
    right: 0;
    transform: translateY(-50%);
    background: url(../../img/usr/common/icon_arrow.svg) no-repeat center center / 100%;
  }

  /* 下部リンク */
  .block-mypage-footermenu {
    border-top: 0;
  }

  div.block-mypage-footermenu--nav {
    border-top: 1px solid var(--color-gray03);
  }

  .block-mypage-footermenu--nav-list {
    gap: 0 138px;
  }

  .block-mypage-footermenu--nav-item {
    width: calc((100% - 138px) / 2);
  }

  .block-mypage-footermenu--nav-title {
    font-family: var(--font-family-serif);
    font-weight: 600;
    font-size: var(--txt-20);
    padding-left: 40px;
    padding-bottom: 0;
    margin-block: 64px 0;
    position: relative;
  }

  .block-mypage-footermenu--nav-sub-title {
    font-size: var(--txt-16);
  }

  .block-mypage-footermenu--nav-tree.is-active .block-mypage-footermenu--nav-title:after {
    transform: translateY(-50%);
  }

  .block-mypage-footermenu--nav-title:after {
    content: "";
    width: 33px;
    height: 33px;
    display: block;
    background-image: url(../../img/usr/common/icon_order.svg);
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    background-color: transparent;
  }

  .block-mypage-footermenu--nav-tree:nth-child(2) .block-mypage-footermenu--nav-title:after {
    background-image: url(../../img/usr/common/icon_coupon.svg);
  }

  .block-mypage-footermenu--nav-tree:nth-child(3) .block-mypage-footermenu--nav-title:after {
    background-image: url(../../img/usr/common/icon_product.svg);
  }

  .block-mypage-footermenu--nav-tree:nth-child(4) .block-mypage-footermenu--nav-title:after {
    background-image: url(../../img/usr/common/icon_account.svg);
  }

  .block-mypage-footermenu--nav-tree:nth-child(5) .block-mypage-footermenu--nav-title:after {
    background-image: url(../../img/usr/common/icon_inquiry.svg);
  }

  .block-mypage-footermenu--nav .block-mypage-sidemenu--nav-link {
    padding: 20px 0;
    margin-top: 12px;
  }

  .block-mypage-footermenu--nav .block-mypage-sidemenu--nav-link {
    border-bottom: 1px solid #cccccc;
    font-family: var(--font-family-serif);
    font-weight: bold;
    padding: 20px 0;
    margin-top: 12px;
  }

  /* フッターメニュー内ボタンエリア */
  .block-mypage-footermenu--btn-area,
  .block-mypage--coupon-btn {
    .base-btn {
      border-radius: 0;
    }
  }

  /* 定期契約情報 */
  .block-regular-purcharse-list--info li>a,
  .block-regular-purcharse-list--list a,
  .block-regular-purcharse-list--sales-link a,
  .block-regular-purcharse-list--skip-button input[type="button"] {
    text-decoration: underline;
    text-underline-offset: 4px;
    color: var(--color-conversion);
    cursor: pointer;
  }

  .block-regular-purcharse-list--skip-button input[type="button"] {
    border-bottom: 1px solid currentColor;
  }

  /* 購入履歴 */
  .block-purchase-history--customer-name {
    margin-bottom: 20px;
  }

  .block-purchase-history--search-frame {
    background: var(--tag-background-color);
  }

  .block-purchase-history--search-frame .action-buttons {
    justify-content: center;
    margin-top: 0;

    .action {
      .block-purchase-history--search-btn {
        padding: 1rem;
      }
    }
  }

  .block-purchase-history--list {
    margin-top: 20px;
  }

  .block-mypage-footermenu {
    max-width: 1100px;
    margin: 80px auto;
  }

  .block-purchase-history--order-detail-reorder {
    max-width: 320px;
    margin: 20px auto 10px;
  }

  .block-purchase-history-detail {

    .status-order,
    .status-cancel,
    .status-income,
    .status-reserve,
    .status-rship,
    .status-ship,
    .status-verify,
    .status-return,
    .status-status_,
    .status-status_1,
    .status-status_2,
    .status-status_3,
    .status-status_4,
    .status-status_9 {
      border: none;
    }
  }

  /* クーポン */
  .block-coupon-list {
    margin: 0px;
  }

  .block-coupon-list--header,
  .block-coupon-list--list {
    max-width: 1100px;
    margin: 0 auto;
  }

  .block-coupon-list--pager-top {
    padding-inline: 5vw;
  }

  .block-mypage-footermenu--btn-area,
  .block-mypage--coupon-btn {
    a {
      font-family: var(--font-family-serif);
      font-weight: 600;
      line-height: calc(31 / 22);
      width: 100%;
      background: white;
      color: var(--color-text);
      transition: all 0.4s;
      display: flex;
      justify-content: center;
      align-items: center;
      margin: auto;
      font-size: var(--txt-16);
      padding: var(--txt-16);
      max-width: fit-content;

      &:hover {
        background: var(--color-light-pink);
      }
    }
  }

  .pager-total {
    padding: 0;
    margin: 0;
  }

  /* お気に入り */
  .block-favorite--image figure {
    background-color: var(--color-mypage-bg);
  }

  .block-favorite--delete-fg-checkbox {
    font-size: var(--txt-14);
  }

  .block-favorite--delete-fg input:checked~.switch:before {
    background: var(--color-primary);
    border-color: var(--color-gray03);
  }

  .block-favorite--checkbox {
    width: auto;
    min-width: auto;
  }

  .block-favorite--delete-item .btn.btn-danger {
    margin-top: 0;
    width: 100px;
    padding: 10px;
  }

  .block-favorite--update {
    background: var(--color-primary);
    border: 1px solid var(--color-primary);
    cursor: pointer;
  }

  .block-favorite--cancel {
    color: var(--color-primary);
    border: 1px solid var(--color-primary);
    cursor: pointer;
  }

  /* メールマガジン受付メッセージ */
  .success {
    border: none;
    color: var(--color-text);
    background: var(--color-header-tag);
  }

  .block-mail-news .form-error {
    color: var(--color-red);
    margin-top: 10px;
    font-weight: bold;
  }

  /* マイページ配下ないのデフォルトボタン */
  .action-buttons .action .btn-default {
    font-family: var(--font-family-serif);
    font-weight: 600;
    line-height: calc(31 / 22);
    width: 100%;
    background: var(--color-light-pink);
    color: var(--color-text);
    transition: all 0.4s;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
    font-size: var(--txt-16);
    padding: var(--txt-16);
    max-width: fit-content;

    &:hover {
      color: var(--main--background-color);
      background: var(--color-deep-burgundy);
      border-color: var(--color-deep-burgundy);
      opacity: 1;
    }
  }

  /* マイページ配下ないのプライマリーボタン */
  .action-buttons .action .btn-primary,
  .action-buttons .action .btn-primary.block-login--login,
  .action-buttons .action .btn-primary.block-login--guest,
  .action-buttons .action .btn-primary.block-login--biometric-login {
    font-family: var(--font-family-serif);
    font-weight: 600;
    line-height: calc(31 / 22);
    width: 100%;
    background: white;
    /*background: var(--color-light-pink);*/
    border: 1px solid var(--color-text);
    color: var(--color-text);
    transition: all 0.4s;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
    font-size: var(--txt-16);
    padding: var(--txt-16);
    max-width: fit-content;

    &:hover {
      color: var(--color-text);
      background: var(--color-light-pink);
      opacity: 1;
    }
  }

  .block-favorite--add-to-cart .btn {
    border: 1px solid var(--color-text);
  }

  /* 指紋・顔認証などの設定の戻るボタンのみ */
  .action-buttons .action .block-member-biometric--register-back {
    border: 1px solid var(--color-text);
    background: #fff;

    &:hover {
      background: var(--color-bronze-brown);
      color: var(--color-text);
    }
  }
}

/* =========================================================
マイページ下層 ここまで
========================================================= */
/* =========================================================
ログアウトページ ここから
========================================================= */
.page-logout {
  .pane-main {
    max-width: 1100px;
    margin: 80px auto 0;

    h1 {
      font-family: var(--font-family-serif);
      font-size: var(--txt-24);
      font-weight: bold;
    }
  }
}

/* =========================================================
ログアウトページ ここまで
========================================================= */
/* =========================================================
ログインページ ここから
========================================================= */
.page-login {
  .pane-main {
    max-width: 1100px;
    margin: 80px auto 0;

    h1 {
      font-family: var(--font-family-serif);
      font-size: var(--txt-28);
      font-weight: bold;
    }

    h2 {
      font-family: var(--font-family-serif);
      font-size: var(--txt-24);
      font-weight: 600;
      border-bottom: 0;
    }

    .action .btn-primary {
      margin-top: 5px;
    }

    .block-login {
      margin: 0;
      text-align: center;
    }

    .block-login--body {
      display: block;
    }

    .block-login--input-items {
      text-align: left;
    }

    /* ログイン */
    .block-login--login-state-saving .form-control label {
      font-size: var(--txt-12);
    }

    .block-login--ask-password {
      text-decoration: none;
      margin-top: 0;
      text-align: center;
      font-size: var(--txt-12);
      margin-top: 1rem;

      a {
        text-decoration: underline;
        color: var(--color-text);
      }
    }

    /* アマゾン */
    .block-login--container {
      margin-top: 80px;
    }

    .block-login--amazon .block-cart--amazonpay-description {
      text-align: center;
      font-size: var(--txt-16);
    }

    #AmazonPayButton {
      max-width: 320px !important;
      margin: 0 auto;
    }

    /* 指紋・顔認証などの設定がお済みの方 */
    .block-login--biometric-member {
      margin-top: 80px;
    }

    /* 初めてご利用の方・会員以外の方 */
    .block-login--first-time {
      margin-block: 80px;
    }

    /* ログインないのプライマリーボタン */
    .action-buttons {
      margin-top: 20px;
    }

    /* .action-buttons .action .btn-primary {font-family: var(--font-family-serif);font-weight: 600;line-height: calc(31/22);width: 100%;color: #fff;background: #161F35;transition: all .4s;display: flex;justify-content: center;align-items: center;margin: auto;font-size: var(--txt-16);padding: var(--txt-16);width: 200px;&:hover {background: #F6F1E7;color: #161F35;opacity: 1;}}*/
    /* /.pane-main */
  }

  /* ログインページのみフッター新規会員登録・ログインボタン非表示 */
  .block-footernav-top {
    display: none;
  }
}

/* =========================================================
ログインページ ここまで
========================================================= */

/* =========================================================
会員登録ページ ここから
========================================================= */
.page-entry {
  .pane-main {
    max-width: 1100px;
    margin: 80px auto 80px;

    h1 {
      font-family: var(--font-family-serif);
      font-size: var(--txt-24);
      font-weight: bold;
    }

    h2,
    .legend {
      font-family: var(--font-family-serif);
      font-size: var(--txt-20);
      font-weight: 600;
      border-bottom: 0;
    }

    /*会員登録ないのプライマリーボタン */
    .action-buttons {
      margin-top: 40px;
    }

    /* .action-buttons .action .btn-primary {font-family: var(--font-family-serif);font-weight: 600;line-height: calc(31/22);width: 100%;color: #fff;background: #161F35;transition: all .4s;display: flex;justify-content: center;align-items: center;margin: auto;font-size: var(--txt-16);padding: var(--txt-16);width: 200px;&:hover {opacity: .8;transition: all .4s;}}*/
    /* /.pane-main */
  }
}

/* =========================================================
会員登録ページ ここまで
========================================================= */


/* =========================================================
トピック一覧（お知らせ一覧・詳細） ここから
========================================================= */
.page-topicdetaillist,
.page-topic {
  .pane-main>div:first-of-type {
    max-width: 1100px;
    margin: 0 auto;
  }

  .pane-main {
    margin-top: 80px;

    h1 {
      font-family: var(--font-family-serif);
      font-size: var(--txt-28);
      font-weight: bold;
      margin: 0 0 20px;
    }

    h2 {
      font-family: var(--font-family-serif);
      font-size: var(--txt-24);
      font-weight: 600;
      border-bottom: 0;
    }

    ul.block-topic--items {
      margin: 0;
    }

    ul.block-topic--items>li {
      padding: 0;
      border-bottom: 0;
    }

    ul.block-topic--items>li+li {
      padding-top: 28px;
    }

    ul.block-topic--items>li dd {
      font-size: var(--txt-16);
      font-weight: 500;
    }

    ul.block-topic--items>li dt {
      font-size: var(--txt-14);
      margin: 0;
      color: var(--color-gray02);
      font-weight: 500;
    }

    .block-topic-details--icon,
    .pager-total {
      display: none;
    }


  }
}

/* =========================================================
トピック一覧（お知らせ一覧） ここまで
========================================================= */

/* =========================================================
イベントページ ここから
========================================================= */
body.page-event {
  background-color: inherit;

  .pane-main {
    max-width: 1100px;
    margin: 80px auto 0;

    div.block-goods-list--params {
      & .block-goods-list--sort-order-items {
        & .block-sort--header {
          h2 {
            font-family: var(--font-family-base);
            font-weight: normal;
          }
        }
      }
    }
  }
}

/* =========================================================
イベントページ ここまで
========================================================= */

/* =========================================================
アラートページ ここから
========================================================= */
.page-alertgoods {
  .pane-main {
    max-width: 1100px;
    margin: 100px auto 0;
  }
}
/* =========================================================
アラートページ ここまで
========================================================= */