@charset "UTF-8";
/*----------------------------------------

	CONDOM DETAIL CSS

-----------------------------------------*/
/*----------------------------------------
	- 商品紹介
-----------------------------------------*/
@media screen and (min-width: 769px) {
  .goods {
    margin-block-start: 150px;
  }
}
@media screen and (max-width: 768px) {
  .goods {
    margin-block-start: 20vw;
  }
}
.goods .c-box {
  display: grid;
}
@media screen and (min-width: 769px) {
  .goods .c-box {
    grid-template-columns: 38.182% 1fr;
    -moz-column-gap: 9.091%;
         column-gap: 9.091%;
  }
}
@media screen and (max-width: 768px) {
  .goods .c-box {
    width: 100%;
  }
}
.goods .c-box > figure {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  aspect-ratio: 1;
}
@media screen and (min-width: 769px) {
  .goods .c-box > figure {
    grid-column: 1/2;
    grid-row: span 4;
    width: 100%;
    margin-inline: auto 0;
    margin-block-end: 15px;
  }
}
@media screen and (max-width: 768px) {
  .goods .c-box > figure {
    width: 85vw;
    margin-inline: auto;
  }
}
.goods .c-box > figure::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  background-color: var(--color-white);
  border-radius: 50%;
  width: 100%;
  height: 100%;
  z-index: -1;
}
@media screen and (min-width: 769px) {
  .goods .c-box > figure img {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .goods .c-box > figure img {
    width: 85vw;
  }
}
.goods .c-box .font24_20 {
  line-height: 1.5;
  font-weight: var(--font-medium);
}
@media screen and (min-width: 769px) {
  .goods .c-box .font24_20 {
    grid-column: 2/3;
    margin-block-start: 23px;
  }
}
@media screen and (max-width: 768px) {
  .goods .c-box .font24_20 {
    margin-block-start: 9vw;
  }
}
.goods .c-box .font20_16 {
  font-weight: var(--font-regular);
}
@media screen and (min-width: 769px) {
  .goods .c-box .font20_16 {
    grid-column: 2/3;
    margin-block-start: 20px;
    line-height: 2.5;
  }
}
@media screen and (max-width: 768px) {
  .goods .c-box .font20_16 {
    margin-block-start: 4vw;
    line-height: 2;
  }
}
.goods .c-box .tag-products {
  display: flex;
  flex-wrap: wrap;
  height: -moz-fit-content;
  height: fit-content;
}
@media screen and (min-width: 769px) {
  .goods .c-box .tag-products {
    grid-column: 2/3;
    gap: 8px 8px;
    margin-block: 30px 0;
  }
}
@media screen and (max-width: 768px) {
  .goods .c-box .tag-products {
    margin-block-start: 6vw;
    gap: 2.5vw 3vw;
  }
}
.goods .c-box .shop-list {
  display: grid;
  height: -moz-fit-content;
  height: fit-content;
  width: 100%;
  border-block-start: 1px solid var(--color-americansilver);
}
@media screen and (min-width: 769px) {
  .goods .c-box .shop-list {
    grid-column: 2/3;
    grid-template-columns: 110px 1fr;
    -moz-column-gap: 18px;
         column-gap: 18px;
    margin-block: 80px 0;
    padding-block-start: 40px;
  }
}
@media screen and (max-width: 1100px) and (min-width: 769px) {
  .goods .c-box .shop-list {
    grid-template-columns: 1fr;
    gap: 5px;
  }
}
@media screen and (max-width: 768px) {
  .goods .c-box .shop-list {
    gap: 3vw;
    margin-block-start: 10.5vw;
    padding-block-start: 9vw;
  }
}
.goods .c-box .shop-list .font14_14 {
  font-weight: var(--font-medium);
}
@media screen and (min-width: 769px) {
  .goods .c-box .shop-list .font14_14 {
    line-height: 2.8;
  }
}
@media screen and (max-width: 768px) {
  .goods .c-box .shop-list .font14_14 {
    line-height: 1.5;
  }
}
.goods .c-box .shop-list .tag-chips01 {
  display: flex;
  flex-wrap: wrap;
}
@media screen and (min-width: 769px) {
  .goods .c-box .shop-list .tag-chips01 {
    gap: 15px 15px;
  }
}
@media screen and (max-width: 768px) {
  .goods .c-box .shop-list .tag-chips01 {
    gap: 2.5vw;
  }
}
.goods .c-box .link-list {
  display: grid;
}
@media screen and (min-width: 769px) {
  .goods .c-box .link-list {
    grid-column: 1/-1;
    max-width: 860px;
    width: 100%;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    margin-block-start: 80px;
    margin-inline: auto;
  }
}
@media screen and (max-width: 768px) {
  .goods .c-box .link-list {
    grid-template-columns: 1fr;
    gap: 3vw;
    margin-block-start: 15vw;
  }
}
.goods .c-box .link-list a {
  display: grid;
  background-color: var(--color-soapstone);
  transition: background-color 0.2s;
}
@media screen and (min-width: 769px) {
  .goods .c-box .link-list a {
    grid-template-columns: 35% 1fr;
    gap: 10px;
    padding: 34px 26px 28px;
    border-radius: 6px;
  }
}
@media screen and (max-width: 768px) {
  .goods .c-box .link-list a {
    grid-template-columns: 27.5vw 1fr;
    gap: 5vw;
    padding: 6vw 7vw 6vw 7.5vw;
    border-radius: 1.5vw;
  }
}
@media (hover: hover) {
  .goods .c-box .link-list a:hover {
    background-color: var(--color-palepink);
  }
}
.goods .c-box .link-list p {
  display: grid;
  align-items: center;
  grid-template-columns: 1fr auto;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto 0;
}
@media screen and (min-width: 769px) {
  .goods .c-box .link-list p {
    gap: 20px;
  }
}
@media screen and (max-width: 768px) {
  .goods .c-box .link-list p {
    gap: 2vw;
  }
}
.goods .c-box .link-list .font16_14 {
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
}

/*----------------------------------------
	- 商品紹介 > LINEUP
-----------------------------------------*/
.lineup {
  background: linear-gradient(175deg, #FFF2F4 0%, #F6F0FF 100%);
}
@media screen and (min-width: 769px) {
  .lineup {
    margin-block-start: 152px;
    padding-block: 120px;
    overflow: hidden;
  }
}
@media screen and (max-width: 768px) {
  .lineup {
    margin-block-start: 25vw;
    padding-block: 14.75vw;
  }
}
@media screen and (min-width: 769px) {
  .lineup .c-box {
    width: min(1200px, 90%);
  }
}
@media screen and (max-width: 768px) {
  .lineup .c-box {
    padding-inline: 7.5vw;
  }
}
.lineup .c-box .item-list {
  display: grid;
}
@media screen and (min-width: 769px) {
  .lineup .c-box .item-list {
    grid-template-columns: repeat(2, 1fr);
    gap: 80px 4.833%;
    margin-block-start: 80px;
  }
}
@media screen and (max-width: 768px) {
  .lineup .c-box .item-list {
    grid-template-columns: 1fr;
    margin-block-start: 12vw;
    gap: 15vw;
  }
}
.lineup .c-box .item-list > li {
  display: grid;
  grid-template-rows: auto auto 1fr;
}
@media screen and (min-width: 769px) {
  .lineup .c-box .item-list > li {
    grid-template-columns: 35% 1fr;
    -moz-column-gap: 5%;
         column-gap: 5%;
  }
}
@media screen and (max-width: 1100px) and (min-width: 769px) {
  .lineup .c-box .item-list > li {
    grid-template-columns: 1fr;
  }
}
.lineup .c-box .item-list > li > .font20_18 {
  font-weight: var(--font-medium);
}
@media screen and (min-width: 769px) {
  .lineup .c-box .item-list > li > .font20_18 {
    grid-column: 1/-1;
    grid-row: 1/2;
    letter-spacing: 0.03em;
    margin-block-end: 30px;
  }
}
@media screen and (max-width: 768px) {
  .lineup .c-box .item-list > li > .font20_18 {
    line-height: 2;
    margin-block-end: 4vw;
  }
}
.lineup .c-box .item-list > li > figure {
  position: relative;
  height: -moz-fit-content;
  height: fit-content;
  aspect-ratio: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1;
}
@media screen and (max-width: 1100px) and (min-width: 769px) {
  .lineup .c-box .item-list > li > figure {
    width: 200px;
    margin-inline: auto;
    margin-block-end: 30px;
  }
}
@media screen and (max-width: 768px) {
  .lineup .c-box .item-list > li > figure {
    height: auto;
    width: 50vw;
    margin-inline: auto;
  }
}
.lineup .c-box .item-list > li > figure::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background-color: var(--color-white);
  border-radius: 50%;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.lineup .c-box .item-list > li > figure img {
  width: 100%;
}
@media screen and (min-width: 769px) {
  .lineup .c-box .item-list > li .detail-list {
    margin-block-start: 19px;
  }
}
@media screen and (max-width: 768px) {
  .lineup .c-box .item-list > li .detail-list {
    margin-block-start: 5.75vw;
  }
}
.lineup .c-box .item-list > li .detail-list > li {
  display: grid;
  border-block-end: 1px solid var(--color-americansilver);
  grid-template-columns: 0.65fr 1fr;
}
@media screen and (min-width: 769px) {
  .lineup .c-box .item-list > li .detail-list > li {
    -moz-column-gap: 10px;
         column-gap: 10px;
    padding-block: 14px;
  }
}
@media screen and (max-width: 768px) {
  .lineup .c-box .item-list > li .detail-list > li {
    -moz-column-gap: 2.5vw;
         column-gap: 2.5vw;
    padding-block: 1.25vw 1vw;
  }
}
.lineup .c-box .item-list > li .detail-list > li:nth-of-type(1) {
  border-block-start: 1px solid var(--color-americansilver);
}
@media screen and (min-width: 769px) {
  .lineup .c-box .item-list > li .detail-list > li:last-of-type {
    padding-block-end: 16px;
  }
}
@media screen and (max-width: 768px) {
  .lineup .c-box .item-list > li .detail-list > li:last-of-type {
    padding-block-end: 2vw;
  }
}
.lineup .c-box .item-list > li .detail-list > li :not(:nth-child(1)) {
  grid-column: 2/3;
}
.lineup .c-box .item-list > li .detail-list > li > span:nth-of-type(1) {
  font-weight: var(--font-medium);
}
@media screen and (min-width: 769px) {
  .lineup .c-box .item-list > li .detail-list > li span {
    line-height: 1.5;
  }
}
@media screen and (max-width: 768px) {
  .lineup .c-box .item-list > li .detail-list > li span {
    line-height: 2;
  }
}
@media screen and (min-width: 769px) {
  .lineup .c-box .item-list > li .detail-list > li > span:nth-of-type(2) p + p {
    margin-block-start: 15px;
  }
}
@media screen and (max-width: 768px) {
  .lineup .c-box .item-list > li .detail-list > li > span:nth-of-type(2) p + p {
    margin-block-start: 2.5vw;
  }
}
@media screen and (min-width: 769px) {
  .lineup .c-box .item-list > li .detail-list > li > span:nth-of-type(2) img {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .lineup .c-box .item-list > li .detail-list > li > span:nth-of-type(2) img {
    width: 77%;
  }
}
.lineup .c-box .item-list > li .tag-box {
  grid-column: 1/-1;
  display: grid;
}
@media screen and (min-width: 769px) {
  .lineup .c-box .item-list > li .tag-box {
    grid-template-columns: 31.5% 1fr;
    gap: 15px 5%;
    margin-block-start: 40px;
  }
}
@media screen and (max-width: 1100px) and (min-width: 769px) {
  .lineup .c-box .item-list > li .tag-box {
    grid-template-columns: 1fr;
  }
}
@media screen and (max-width: 768px) {
  .lineup .c-box .item-list > li .tag-box {
    grid-template-columns: 1fr;
    margin-block-start: 5vw;
  }
}
.lineup .c-box .item-list > li .tag-box .font16_14 {
  font-weight: var(--font-medium);
  height: -moz-fit-content;
  height: fit-content;
}
@media screen and (min-width: 769px) {
  .lineup .c-box .item-list > li .tag-box .font16_14 {
    line-height: 2;
  }
}
@media screen and (max-width: 768px) {
  .lineup .c-box .item-list > li .tag-box .font16_14 {
    line-height: 1.5;
  }
}
.lineup .c-box .item-list > li .tag-box .tag-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  height: -moz-fit-content;
  height: fit-content;
}
@media screen and (min-width: 769px) {
  .lineup .c-box .item-list > li .tag-box .tag-list {
    gap: 8px;
  }
}
@media screen and (max-width: 768px) {
  .lineup .c-box .item-list > li .tag-box .tag-list {
    gap: 2vw;
    margin-block-start: 3.5vw;
  }
}
.lineup .c-box .item-list > li .tag-box .c-btn-txt--purchase {
  width: 100%;
  justify-content: space-between;
}
@media screen and (min-width: 769px) {
  .lineup .c-box .item-list > li .tag-box .c-btn-txt--purchase {
    gap: 5px;
    padding-block: 12px 13px;
  }
}
@media screen and (max-width: 768px) {
  .lineup .c-box .item-list > li .tag-box .c-btn-txt--purchase {
    padding-block: 3.25vw;
  }
}
@media screen and (min-width: 769px) {
  .lineup_detail {
    margin-block-start: 120px;
  }
}
@media screen and (max-width: 768px) {
  .lineup_detail {
    margin-block-start: 20.75vw;
  }
}
@media screen and (max-width: 768px) {
  .lineup_detail > .c-box {
    padding-inline: 0;
  }
}
.lineup_detail .accordion-btn {
  font-weight: var(--font-medium);
  border-block-end: 1px solid var(--color-americansilver);
}
@media screen and (min-width: 769px) {
  .lineup_detail .accordion-btn {
    padding-block: 36px 30px;
    padding-inline: 0 7px;
  }
}
@media screen and (max-width: 768px) {
  .lineup_detail .accordion-btn {
    padding-block: 6.7vw 3.5vw;
    width: calc(100% - 12vw);
    margin-inline: auto;
  }
}
@media screen and (min-width: 769px) {
  .lineup_detail .accordion-box > div {
    padding-block: 70px 100px;
  }
}
@media screen and (max-width: 768px) {
  .lineup_detail .accordion-box > div {
    overflow: visible;
    padding-block: 9vw 15vw;
    width: calc(100% - 12vw);
    margin-inline: auto;
  }
}
@media screen and (min-width: 769px) {
  .lineup_detail .exp {
    margin-block-start: 80px;
  }
}
@media screen and (max-width: 768px) {
  .lineup_detail .exp {
    margin-block-start: 10vw;
    padding-inline: 6vw;
  }
}
.lineup_detail .exp .font22_18 {
  font-weight: var(--font-medium);
}
@media screen and (min-width: 769px) {
  .lineup_detail .exp .font22_18 {
    letter-spacing: 0.03em;
    line-height: 1.5;
  }
}
@media screen and (max-width: 768px) {
  .lineup_detail .exp .font22_18 {
    letter-spacing: 0;
    line-height: 2;
  }
}
.lineup_detail .exp .font15_13 {
  line-height: 2;
}
@media screen and (min-width: 769px) {
  .lineup_detail .exp .font15_13 {
    margin-block-start: 24px;
  }
}
@media screen and (max-width: 768px) {
  .lineup_detail .exp .font15_13 {
    margin-block-start: 4vw;
  }
}

/*----------------------------------------
	- 商品紹介 > 関連商品
-----------------------------------------*/
.related {
  background-color: var(--color-ghostwhite);
}
@media screen and (min-width: 769px) {
  .related {
    margin-block-start: 160px;
    padding-block: 80px 40px;
  }
}
@media screen and (max-width: 768px) {
  .related {
    margin-block-start: 20vw;
    padding-block: 16.5vw 14.5vw;
  }
}
@media screen and (min-width: 769px) {
  .related .c-box {
    width: min(1100px, 90%);
  }
}
.related .category-list {
  display: grid;
}
@media screen and (min-width: 769px) {
  .related .category-list {
    grid-template-columns: repeat(2, 1fr);
    gap: 0 20%;
    margin-block-start: 8px;
  }
}
@media screen and (max-width: 768px) {
  .related .category-list {
    margin-block-start: 13.5vw;
  }
}
@media screen and (min-width: 769px) {
  .related .category-list > li {
    padding-block: 50px 44px;
  }
}
@media screen and (max-width: 768px) {
  .related .category-list > li:not(:nth-of-type(1)) {
    margin-block-start: 8.75vw;
    padding-block-start: 9vw;
    border-block-start: 1px solid var(--color-americansilver);
  }
}
.related .category-list > li:nth-of-type(odd):not(:last-child):not(:nth-last-child(2)) {
  position: relative;
}
@media screen and (min-width: 769px) {
  .related .category-list > li:nth-of-type(odd):not(:last-child):not(:nth-last-child(2))::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 250%;
    border-block-end: 1px solid var(--color-americansilver);
  }
}
.related .item-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}
@media screen and (min-width: 769px) {
  .related .item-list {
    gap: 36px 9.091%;
    margin-block: 24px 0;
  }
}
@media screen and (max-width: 768px) {
  .related .item-list {
    gap: 6vw 4.5vw;
    margin-block: 5vw 0;
  }
}
.related .item-list a {
  display: grid;
}
@media screen and (max-width: 768px) {
  .related .item-list a {
    gap: 1.25vw;
  }
}
.related .item-list figure {
  position: relative;
  z-index: 1;
  width: 100%;
  aspect-ratio: 1;
  display: flex;
  justify-content: center;
  align-items: center;
}
.related .item-list figure::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  aspect-ratio: 1;
  background-color: var(--color-white);
  border-radius: 50%;
  z-index: -1;
  transition: background-color 0.2s;
}
@media (hover: hover) {
  .related .item-list a:hover figure::before {
    background-color: var(--color-palepink);
  }
}
.related .item-list .c-icon-base {
  position: absolute;
}
@media screen and (min-width: 769px) {
  .related .item-list .c-icon-base {
    bottom: 0;
    right: 20px;
  }
}
@media screen and (max-width: 768px) {
  .related .item-list .c-icon-base {
    bottom: 0.5vw;
    right: 7.5vw;
  }
}

/*----------------------------------------
	- お問い合わせ
-----------------------------------------*/
@media screen and (min-width: 769px) {
  .inquiry {
    margin-block-start: 140px;
  }
}
@media screen and (max-width: 768px) {
  .inquiry {
    margin-block-start: 19.5vw;
  }
}
.inquiry .font18_15 {
  font-weight: var(--font-medium);
  line-height: 2;
  text-align: center;
  width: 100%;
  border-block-start: 1px solid var(--color-americansilver);
}
@media screen and (min-width: 769px) {
  .inquiry .font18_15 {
    padding-block-start: 40px;
  }
}
@media screen and (max-width: 768px) {
  .inquiry .font18_15 {
    padding-block-start: 5vw;
  }
}
.inquiry .btn-list {
  display: flex;
}
@media screen and (min-width: 769px) {
  .inquiry .btn-list {
    justify-content: center;
    flex-wrap: wrap;
    width: -moz-fit-content;
    width: fit-content;
    margin-inline: auto;
    gap: 20px 60px;
    margin-block-start: 60px;
  }
}
@media screen and (max-width: 768px) {
  .inquiry .btn-list {
    flex-direction: column;
    align-items: center;
    gap: 6vw;
    margin-block-start: 7.5vw;
  }
}
@media screen and (min-width: 769px) {
  .inquiry .c-btn-txt--pink-solid {
    min-width: 360px;
  }
}
@media screen and (max-width: 768px) {
  .inquiry .c-btn-txt--pink-solid {
    min-width: 60vw;
  }
}