﻿@charset "UTF-8";

.global-contents {
  overflow: clip;
}
.global-container > *,
.global-contents > * {
  min-width: 0;
}

.c-feature__full-screen {
  margin: 0 calc(50% - 50vw);
  width: 100vw;
}

/*-- instructions --*/
.c-feature__instructions {
  font-weight: bold;
  font-size: 1.6rem;
  letter-spacing: 0.1em;
  margin-block: 2.5rem 1.8rem;
}
.c-feature__instructions.c-feature__instructions--title {
  font-size: 1.8rem;
  color: var(--color-white);
  background: var(--color-text-default);
  margin-block: 6rem 3rem;
  height: 4.8rem;
  display: grid;
  align-items: center;
  padding-inline: 2rem;
}
@media (max-width: 767px) {
  .c-feature__instructions.c-feature__instructions--title {
    font-size: 1.8rem;
    color: var(--color-white);
    background: var(--color-text-default);
    margin-block: 6rem 3rem;
    height: 4rem;
    display: grid;
    align-items: center;
    padding-inline: 2rem;
  }
}

/*-- common --*/
.c-feature__column {
  display: grid;
  gap: 2rem;
}
.c-feature__column--2 {
  grid-template-columns: repeat(2, 1fr);
}
.c-feature__column--3 {
  grid-template-columns: repeat(3, 1fr);
}
.c-feature__column--4 {
  grid-template-columns: repeat(4, 1fr);
}
.c-feature__column--5 {
  grid-template-columns: repeat(5, 1fr);
}
.c-feature__column--6 {
  grid-template-columns: repeat(5, 1fr);
}
.c-feature__column--flex {
  display: flex !important;
  gap: 4rem;
}
@media (max-width: 767px) {
  .c-feature__column--2,
  .c-feature__column--3,
  .c-feature__column--4,
  .c-feature__column--5,
  .c-feature__column--6 {
    grid-template-columns: repeat(2, 1fr);
  }
  .c-feature__column--sp-cancel {
    display: grid !important;
    grid-template-columns: repeat(1, 1fr) !important;
    gap: 2rem;
  }
}
.c-feature__w--100 {
  width: 10rem;
}
.c-feature__w--150 {
  width: 15rem;
}
.c-feature__w--200 {
  width: 20rem;
}
.c-feature__w--250 {
  width: 25rem;
}
.c-feature__w--300 {
  width: 30rem;
}
.c-feature__align--bottom {
  margin-block: auto 0;
}
.c-feature__align--center {
  margin-block: auto;
}
.c-feature__align--middle {
  margin: auto;
}
.c-feature__align--inline {
  margin-inline: auto;
}
.c-feature__align--right {
  margin-inline: auto 0;
}
.c-feature__hide {
  display: none;
}
.c-feature__text-decoration--none {
  text-decoration: none;
}
.c-feature__text-decoration--underline {
  text-decoration: underline;
}

/*-- decoration --*/
.c-feature__back--gray {
  background: #F5F5F5;
}
.c-feature__back--pink {
  background: #FAF0F2;
}
.c-feature__border--black {
  border: 1px solid #595757;
}
.c-feature__border--pink {
  border: 1px solid #ecb0ba;
}
.c-feature__border--none {
  border: none !important;
}
.c-feature__border--round {
  border-radius: 5px !important;
}

/*-- (A)見出し --*/
.c-feature__h1 {
  font-weight: bold;
  font-size: 2.4rem;
  letter-spacing: 0.1em;
  line-height: 0.8;
  padding-bottom: 2rem;
  border-bottom: solid 2px var(--color-secondary);
}
.c-feature__h2 {
  font-weight: bold;
  font-size: 1.8rem;
  letter-spacing: 0.08em;
  line-height: 1;
}
.c-feature__h2--darkpink {
  background: #FAF0F2;
  padding: 1.2rem 2rem;
}
.c-feature__h2--thinpink {
  background: #EEDCE0;
  padding: 1.2rem 2rem;
}
.c-feature__h2--gray {
  background: #EBEBEB;
  padding: 1.2rem 2rem;
}
.c-feature__h3 {
  font-weight: bold;
  font-size: 1.8rem;
  line-height: 1;
  letter-spacing: 0.08em;
}
.c-feature__h3--mark {
  border-left: solid 4px #ECB0BA;
  padding: 0.6rem 1.5rem;
}
.c-feature__h4 {
  font-weight: bold;
  font-size: 1.6rem;
  letter-spacing: 0.08em;
  line-height: 1;
  padding-bottom: 1rem;
  border-bottom: 2px solid #ebebeb;
  width: 100%;
}
.c-feature__h5 {
  font-weight: bold;
  font-size: 1.4rem;
  line-height: 1;
  letter-spacing: 0.08em;
}
@media (max-width: 767px) {
  .c-feature__h1 {
    font-size: 1.8rem;
    letter-spacing: 0.08em;
    padding-bottom: 1.5rem;
  }
  .c-feature__h2 {
    font-size: 1.6rem;
  }
  .c-feature__h2--darkpink {
    padding: 1.2rem 1rem;
  }
  .c-feature__h2--thinpink {
    padding: 1.2rem 1rem;
  }
  .c-feature__h2--gray {
    padding: 1.2rem 1rem;
  }
  .c-feature__h3 {
    font-size: 1.6rem;
  }
  .c-feature__h4 {
    font-size: 1.5rem;
    letter-spacing: 0.1em;
  }
}

/*-- (B)囲み --*/
.c-feature__box {
  padding: 1.6rem 3rem;
}
.c-feature__box .c-feature__h5 {
  margin-bottom: 2rem;
}
@media (max-width: 767px) {
  .c-feature__box {
    padding: 1.6rem 1.2rem;
  }
}

/*-- (C)アンカーリンク、MENUリンク --*/
.feature-detail .c-feature__a {
  font-weight: bold;
  font-size: 16px;
  letter-spacing: 0.08em;
  color: var(--color-text-default);
  border-bottom: 2px solid #ebebeb;
  padding-bottom: 1rem;
  position: relative;
  text-decoration: none;
}

.feature-detail .c-feature__a:hover {
  border-bottom: 2px solid #ecb0ba;
}
.c-feature__a--arrow::after {
  content: url("data:image/svg+xml;base64,PHN2ZyBpZD0i44Kw44Or44O844OXXzIxNDA5IiBkYXRhLW5hbWU9IuOCsOODq+ODvOODlyAyMTQwOSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTQiIGhlaWdodD0iMTQiIHZpZXdCb3g9IjAgMCAxNCAxNCI+IDxyZWN0IGlkPSLplbfmlrnlvaJfNDIiIGRhdGEtbmFtZT0i6ZW35pa55b2iIDQyIiB3aWR0aD0iMTQiIGhlaWdodD0iMTQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgMTQpIHJvdGF0ZSgtOTApIiBmaWxsPSJub25lIi8+IDxwYXRoIGlkPSLjg5HjgrlfNiIgZGF0YS1uYW1lPSLjg5HjgrkgNiIgZD0iTTQuNiwwLDAsNC4wMzgsNC42LDguMDc2IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzLjIxMiA5LjI1KSByb3RhdGUoLTkwKSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZWNiMGJhIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS13aWR0aD0iMS41Ii8+PC9zdmc+");
  position: absolute;
  right: 0;
}
.c-feature__a--menu {
  padding-left: 4rem;
}
.c-feature__a--menu::after {
  content: url("data:image/svg+xml;base64,PHN2ZyBpZD0i44Kw44Or44O844OXXzIxNDA5IiBkYXRhLW5hbWU9IuOCsOODq+ODvOODlyAyMTQwOSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTQiIGhlaWdodD0iMTQiIHZpZXdCb3g9IjAgMCAxNCAxNCI+IDxyZWN0IGlkPSLplbfmlrnlvaJfNDIiIGRhdGEtbmFtZT0i6ZW35pa55b2iIDQyIiB3aWR0aD0iMTQiIGhlaWdodD0iMTQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgMTQpIHJvdGF0ZSgtOTApIiBmaWxsPSJub25lIi8+IDxwYXRoIGlkPSLjg5HjgrlfNiIgZGF0YS1uYW1lPSLjg5HjgrkgNiIgZD0iTTQuNiwwLDAsNC4wMzgsNC42LDguMDc2IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg5LjU1IDEwLjk4OCkgcm90YXRlKDE4MCkiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2VjYjBiYSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2Utd2lkdGg9IjEuNSIvPjwvc3ZnPg==");
  position: absolute;
  left: 0;
}

/*-- (D)箇条書き --*/
.c-feature__ul,
.c-feature__ol {
  display: grid;
  gap: 1.2rem;
  list-style-position: inside;
  flex-wrap: wrap;
}
.c-feature__ul a,
.c-feature__ol a {
  color: var(--color-text-default);
  text-decoration:underline
}
.c-feature__ol li {
  padding-left: 2.8rem;
  text-indent: -2.8rem;
}
.c-feature__ul li:not(.c-feature__li--box) {
  list-style-type: disc;
  padding-left: 1.6rem;
  text-indent: -1.6rem;
}
.c-feature__ul--notes li {
  list-style-type: "※" !important;
}
.c-feature__ul:not(.c-feature__ul--notes) li::marker {
  font-size: 1.5rem;
  font-weight: 500;
  color: #ECB0BA;
}
.c-feature__ol li::marker {
  font-family: var(--font-en);
  font-size: 1.5rem;
  font-weight: 500;
  color: #ECB0BA;
}
.c-feature__li--box {
  text-align: center;
  padding-block: 1.8rem;
}
.c-feature__column--flex .c-feature__li--box {
  padding-block: 1.2rem;
}
.c-feature__topics {
  padding: 3rem 4rem;
  border-radius: 1rem;
}
.c-feature__topics-title {
  font-family: var(--font-en);
  font-weight: 500;
  font-size: 1.5rem;
  letter-spacing: 0.08em;
  color: #999;
  margin-bottom: 2rem;
}
.c-feature__topics .c-feature__ul,
.c-feature__topics .c-feature__ol {
  gap: 0;
}
.c-feature__topics li {
  padding-block: 1.5rem;
  list-style-type: decimal-leading-zero;
}
.c-feature__topics li:not(:first-child) {
  border-top: 2px solid #ebebeb;
}
.c-feature__topics li:first-child {
  padding-top: 0rem;
}
.c-feature__topics li:last-child {
  padding-bottom: 0rem;
}
.c-feature__topics-item {
  font-weight: bold;
  font-size: 1.5rem;
  letter-spacing: 0.1em;
}
.c-feature__shop {
  display: grid;
  grid-template-columns: min-content auto;
  gap: 1.5rem 3rem;
}
.c-feature__shop .c-feature__ul {
  row-gap: 0;
}
.c-feature__shop .c-feature__shop-title {
  height: min-content;
  padding: 1.2rem 0;
}
@media (max-width: 767px) {
  .c-feature__li--box {
    padding-block: 1.6rem;
    padding-inline: 1.5rem;
  }
  .c-feature__column--flex .c-feature__li--box {
    padding-inline: 0rem;
  }
  .c-feature__topics {
    padding: 2rem 1.5rem;
  }
}

/*-- (E)画像 --*/
.c-feature__text-container {
  margin-top: 0.8rem
}
.c-feature__product-name {
  font-size: 1.3rem;
  margin-top: 0.8rem
}
.c-feature__product-price {
  font-family: var(--font-en);
  font-weight: 500;
  font-size: 1.5rem;
  margin-top: 0.8rem
}
.c-feature__copyright {
  font-size: 1.2rem;
  text-align: right;
  margin-top: 0.8rem
}
.c-feature__w--max800 {
  width: 100%;
  max-width: 80rem;
  margin-inline: auto;
}
@media (max-width: 767px) {
  .c-feature__w--max800 {
    max-width: 80%;
  }
}

/*-- (F)ボタン --*/
.feature-detail .c-button {
  width: 22rem;
  min-width: fit-content;
  text-decoration: unset;
  font-size: unset;
}
.feature-detail .c-button__primary {
  color: var(--color-white);
}
.feature-detail .c-button__secondar {
  color: var(--color-text-default);
}
.feature-detail .c-button__buy {
  background-color: #E696A3;
  border: solid 1px #E696A3;
}
.feature-detail .c-button__disabled {
  background-color: #EBEBEB;
  border: solid 1px #EBEBEB;
  color: var(--color-text-default);
}

/*-- (G)表・サイズチャート --*/
.c-feature__table {
  width: 100%;
  border-collapse: collapse;
  border-radius: 0.6rem;
  overflow: hidden;
}
.c-feature__table th {
  font-weight: bold;
  font-size: 1.4rem;
  letter-spacing: 0.08em;
}
.c-feature__table td {
}
.c-feature__table th,
.c-feature__table td {
  border: 1px solid #ebebeb;
  padding: 1.5rem 2rem;
}
.c-feature__table--row th {
  text-align: left;
  vertical-align: top;
  width: 30.0%;
}
.c-feature__table--row td {
  text-align: left;
  width: 70.0%;
}
.c-feature__table--column th {
  text-align: center;
}
.c-feature__table--column td {
  text-align: center;
}
@media (max-width: 767px) {
  .c-feature__table--row tr {
  }
  .c-feature__table--row th,
  .c-feature__table--row td {
    padding: 1.2rem 1rem;
  }
  .c-feature__table__wrapper:has(.c-feature__table--column) {
    width: 100%;
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
  }
  .c-feature__table--column {
  }
  .c-feature__table--column th,
  .c-feature__table--column td {
    white-space: nowrap;
  }
  .c-feature__table--row th {
    width: 34.8%;
  }
  .c-feature__table--row td {
    width: 65.2%;
  }

}

/*-- (H)テキスト・区切り線 --*/
.c-feature__text-align--left {
  text-align: left;
}
.c-feature__text-align--center {
  text-align: center;
}
.c-feature__text-align--right {
  text-align: right;
}
.c-feature__text--bold {
  font-weight: bold;
}
.c-feature__text--red {
  color: #D92727;
}
.c-feature__hr {
  height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border: 2px solid #ebebeb;
}

.c-feature__tate-line {
  width: 1px;
  height: 100px;
  display: block;
  background-color: var(--color-text-default);
  margin: 40px auto;
}

/*-- (I)テキストサイズ調整 --*/
.c-feature__font--120per {
  font-size: 120%;
}
.c-feature__font--90per {
  font-size: 90%;
}
.c-feature__font--85per {
  font-size: 85%;
}
.c-feature__font--80per {
  font-size: 80%;
}

/*-- (J)余白調整 --*/

/*-- (K)動画埋め込み --*/
.c-feature__movie {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
    height: 0;
}
.c-feature__movie iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.feature-detail video {
    max-width: 100%;
}

/*-- (L)アコーディオン --*/
.c-feature__qa-box {
  border-radius: 1rem;
  border: 2px solid #ebebeb;
  padding: 1.5rem 2rem;
}
.c-feature__qa:not(:first-child) {
  margin-top: 1.5rem;
}
.c-feature__qa_question ,
.c-feature__qa_answer {
  position: relative;
}
.c-feature__qa_question {
  font-weight: bold;
  font-size: 1.5rem;
  letter-spacing: 0.08em;
  padding-left: 3.5rem;
}
.c-feature__qa_question:not(:has(.c-feature__qa_question-mark)) {
  padding-left: 0;
  padding-right: 1.2rem;
}
.c-feature__qa_answer {
  font-size: 1.4rem;
  letter-spacing: 0.08em;
  padding-left: 3.5rem;
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 2px solid #ebebeb;
  word-break: break-all;
}
.c-feature__qa_answer:not(:has(.c-feature__qa_answer-mark)) {
  padding-left: 0;
}
.c-feature__qa_question-mark,
.c-feature__qa_answer-mark {
  font-weight: 500;
  font-size: 2rem;
  letter-spacing: 0.08em;
  position: absolute;
  left: 0;
}
.c-feature__qa_question-mark {
  color: #ecb0ba;
  top: -0.4rem;
}
.c-feature__qa_answer-mark {
  color: #b95870;
  top: 1rem;
}
.c-feature__qa_question::before,
.c-feature__qa_question::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 1.8rem;
  transform: translateY(-50%);
  margin: auto;
  width: 1.2rem;
  height: 0.2rem;
  background-color: var(--color-gray-500);
  transition: all 0.7s;
}
.c-feature__qa_question:not(:has(.c-feature__qa_question-mark))::before,
.c-feature__qa_question:not(:has(.c-feature__qa_question-mark))::after {
  right: 0;
}
.c-feature__qa_question::after {
  transform: translateY(-50%) rotate(90deg);
}
.c-feature__qa_question.open::after {
  transform: translateY(-50%) rotate(180deg);
  opacity: 0;
}
.c-feature__qa[data-state-accordion=opened] .c-feature__qa_question::after {
  transform: translateY(-50%) rotate(180deg);
  opacity: 0;
}

/*-- (M)署名 --*/
.c-feature__signature-category {
  padding-bottom: 1rem;
  border-bottom: 1px solid #EBEBEB;
  margin-bottom: 2rem;
}
.c-feature__signature-name {
  font-weight: bold;
  font-size: 1.5rem;
  letter-spacing: 0.1em;
  margin-bottom: 2rem;
  white-space: nowrap;
}
@media (max-width: 767px) {
  .c-feature__signature .c-feature__column--sp-cancel {
    gap: 1rem;
  }
  .c-feature__signature .c-feature__column--sp-cancel .c-feature__signature-name {
    margin-bottom: 0rem;
  }
}
/*-- (N)ホバー --*/

/*-- (L)アコーディオン --*/

/*-- (O)商品訴求エリア（動的） --*/

.product-list-title {
  font-weight: bold;
  font-size: 2rem;
  letter-spacing: 0.1em;
  line-height: 1.35;
}
.feature-item-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2rem;
  margin-top: 2rem;
}
.feature-item .feature-item-img {
  position: relative;
  display: block;
}
.feature-item .feature-item-sold-out {
  position: absolute;
  top: 0;
  left: 0;
  display: grid;
  place-content: center;
  width: 100%;
  height: 100%;
  font-family: var(--font-en);
  font-size: 1.8rem;
  font-weight: var(--fw-medium);
  letter-spacing: 0.08em;
  line-height: 1.2188;
  z-index: 2;
  background-color: rgb(89 87 87 / 0.4);
  color: var(--color-white);
}
.feature-item .feature-item-name {
  font-size: 1.3rem;
  letter-spacing: 0.08em;
  line-height: 1.5;
  margin-top: 1rem;
}
.feature-item .product__price--item .product__price--numeric {
  display: block;
  font-family: var(--font-en);
  font-weight: 500;
  font-size: 1.5rem;
  letter-spacing: 0.08em;
  margin-top: 0.8rem;
}
.feature-item .product__price--discount .product__price--numeric {
  color: var(--color-project-red);
}
.feature-item .error {
  color: var(--color-emphasis) !important;
  display: block;
  font-size: 1.2rem;
  font-weight: var(--fw-regular);
  letter-spacing: 0.05em;
  line-height: 1.5;
  margin-top: 0.5rem;
}
.feature-item .product__price--item {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.8rem;
}
.feature-item .product__price--discountrate {
  display: inline-flex;
  padding: 0.4rem 0.8rem;
  background-color: rgba(217, 39, 39, 0.1);
  border-radius: 0.9rem;
  color: var(--color-project-red);
  font-family: var(--font-en);
  font-size: 1.1rem;
  font-weight: var(--fw-medium);
  letter-spacing: var(--ls-regular);
  line-height: 1;
  margin-top: 0.8rem;
}
.feature-item .product__price--item .product__price--discount .product__price--numeric,
.feature-item .product__price--item .product__price--fixed-firsttime {
  margin-top: 0.2rem;
  color: var(--color-project-red);
}
.feature-item .feature-item-product-id,
.feature-item .addCart,
.feature-item div:has(> [id$="ddlVariationList"]),
.feature-item .feature-vari-cart-add,
.feature-item .feature-vari-cart-add-fixed-purchase,
.feature-item .feature-vari-cart-add-gift,
.feature-item .arrivalMailButton,
.feature-item .feature-vari-arrival-mail,
.feature-item .favoriteRegistration,
.feature-item .feature-item-add-favorite {
  display: none;
}
#feature-group-items:has(.hidden) #pagination,
#feature-group-items #pagination + .u-mt-30:has(a) {
  display: none;
}
@media (max-width: 767px) {
  .feature-item-list {
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem 0.9rem;
  }
  .feature-item .feature-item-sold-out {
    font-size: 1.6rem;
  }
}
