﻿@charset "UTF-8";


/* =============================================================

  ZETAVOCIE iframe内 list.css

============================================================= */

/* #ZVList
======================================================= */

#ZVSummary table {
  border-collapse: collapse;
  border-spacing: 0;
  margin-left: -0.5rem;
}

#ZVSummary .zv-star-comment,
#ZVList table.zv-counts-table .zv-star-comment {
  font-size: 1.3rem !important;
}

#ZVSummary .zv-star-svg,
#ZVList .zv-star-svg,
#ZVSummary .zv-star-svg-sub,
#ZVList .zv-star-svg-sub {
  width: 1.8rem;
  height: 1.8rem;
  fill: var(--color-review-rating);
  margin-right: -3px !important;
}

#ZVSummary .zv-star-svg-main, #ZVList .zv-star-svg-main {
  fill: var(--color-review-rating);
}

#ZVSummary .zv-star-svg-grey, #ZVList .zv-star-svg-grey {
  fill: var(--color-review-grey);
}

/* ---- 商品詳細 ---- */
#ZVList .zv-select {
  letter-spacing: -0.05em;
}

#zv-review-filter {
  width: 100vw;
}

/* -- 全体評価 -- */
#ZVList p.zv-heading {
  display: none;
}

.zv-row {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 0.5rem;
}

/* チャート */
#ZVList .zv-summary-cell .zv-counts-table tr th .zv-star-svg,
#ZVList .zv-summary-cell .zv-counts-table tr th .zv-star-svg-sub {
  width: 1.8rem;
  height: 1.8rem;
  margin-right: -1.5px !important;
}

#ZVSummary .zv-hist,
#ZVList .zv-hist {
  width: 15rem;
  height: 1.2rem;
  background: #ecf0f1;
  border-radius: .2rem;
  box-shadow: none;
}

#ZVSummary .zv-hist-bar, #ZVList .zv-hist-bar {
  height: 1.2rem;
  line-height: 1.2rem;
  border-radius: .2rem;
  background-color: var(--color-review-bar);
}

#ZVList table.zv-counts-table td.zv-hist-count {
  width: auto;
  padding-left: 0.5rem;
  font-size: 1.15rem;
  color: #666;
  letter-spacing: 0.04em;
}

#ZVList table.zv-counts-table td.zv-hist-count::before {
  content: "（";
  margin-left: -1rem;
}

#ZVList table.zv-counts-table td.zv-hist-count::after {
  content: "）";
}

#ZVList table.zv-counts-table td.zv-hist-per {
  display: none;
}

#ZVList table.zv-counts-table > tbody > tr > th {
  padding-right: 1rem;
}

/* 総合評価 */
.zv-summary-cell:first-child .zv-counts-table tbody,
.zv-summary-cell:first-child .zv-counts-table tr,
.zv-summary-cell:first-child .zv-counts-table td,
.zv-summary-cell:first-child .zv-counts-table th {
  display: block;
}

#ZVList .zv-summary-cell {
  max-width: 100%;
  width: fit-content;
}

#ZVSummary .zv-hist, #ZVList .zv-hist {
  box-shadow: none;
}

#ZVList .zv-summary-cell:first-child .zv-counts-table tr {
  display: grid;
  grid-template-rows: repeat(2, 1fr);
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  align-items: center;
}

#ZVList .zv-summary-cell:first-child .zv-counts-table tr th {
  grid-area: 1 / 1 / 2 / 2;
  min-width: auto;
  letter-spacing: 0.02em;
}

#ZVList .zv-summary-cell:first-child .zv-counts-table tr th .zv-star-svg,
#ZVList .zv-summary-cell:first-child .zv-counts-table tr th .zv-star-svg-sub {
  width: 2.8rem;
  height: 2.8rem;
  margin-right: -1px !important;
}

#ZVList .zv-summary-cell:first-child .zv-counts-table tr .zv-star-average {
  grid-area: 1 / 2 / 2 / 3;
  width: 4rem;
  padding: 0 2rem 0 0.7rem;
  text-align: left;
  font-size: 3.8rem;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.02em;
}

#ZVList .zv-summary-cell:first-child .zv-counts-table tr .zv-star-comment {
  grid-area: 2 / 1 / 3 / 3;
  text-align: center;
}

/* -- ソート -- */

#ZVList .zv-review-sort,
#ZVList .zv-select-wrap,
#ZVList .zv-select,
#ZVList #zv-review-filter-text {
  font-size: 1rem;
  font-family: var(--font-base);
}

#ZVList .zv-select {
  padding: 0.8rem 2.2rem 0.8rem 0.8rem;
}


#ZVList .zv-select-wrap {
  margin-right: 0.5rem;
}

/* PC用*/
@media (min-width: 950px) {

  #ZVList .zv-review-sort,
  #ZVList .zv-select-wrap,
  #ZVList .zv-select,
  #ZVList #zv-review-filter-text {
    font-size: 1.2rem;
  }

  #ZVList .zv-select {
    padding: 0.8rem 2.5rem 0.8rem 1rem;
  }

  #ZVList .zv-select-wrap {
    margin-right: 0.7rem;
  }

}

/* PC用*/
@media (min-width: 1000px) {

  #ZVList .zv-review-sort,
  #ZVList .zv-select-wrap,
  #ZVList .zv-select,
  #ZVList #zv-review-filter-text {
    font-size: 1.25rem;
  }

  #ZVList .zv-select {
    padding: 0.8rem 3rem 0.8rem 1.4rem;
  }

  #ZVList .zv-select-wrap {
    margin-right: 1rem;
  }

}
#ZVList #zv-review-filter-text {
  white-space: nowrap;
}

#ZVList .zv-review-sort,
#zv-review-filter {
  margin-left: 0;
  margin-right: 0;
}

#ZVList .zv-select {
  color: var(--color-review-basic);
}

#ZVList .zv-select-wrap {
  box-shadow: none;
  border-color: #dcdcdc;
  border-radius: 20rem;
}

#ZVList .zv-select-wrap:last-child {
  margin-right: 0;
}

#ZVList .zv-select-wrap::before {
  top: 50%;
  right: 1.2rem;
  width: 0.8rem;
  height: 0.8rem;
  transform: translateY(-50%);
  border: none;
  background:
    url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2215.958%22%20height%3D%2210.638%22%20viewBox%3D%220%200%2015.958%2010.638%22%3E%3Cpath%20d%3D%22M5.32%2C7.979%2C0%2C2.661%2C2.659%2C0l7.979%2C7.979L2.659%2C15.958%2C0%2C13.3Z%22%20transform%3D%22translate(15.958)%20rotate(90)%22%20fill%3D%22%23212121%22%2F%3E%3C%2Fsvg%3E')
    center / 100%
    no-repeat;
}

#zv-review-filter-link + hr {
  display: none !important;
}

/* -- フィルターリンク -- */

#zv-review-filter-link {
  margin-top: 2.2rem;
}

#zv-review-filter-link .zv-link {
  overflow: hidden;
  position: relative;
  display: block;
  width: 6.25rem;
  height: 1.6rem;
  border: 1px solid #cdcdcd;
  padding: 0.4rem 1.5rem;
  background: #eeeeee;
  border-radius: 20rem;
  font-size: 1rem;
  color: #1b1b1b;
  letter-spacing: 0.03em;
  text-indent: -20rem;
  line-height: 20;
}

#zv-review-filter-link .zv-link::before,
#zv-review-filter-link .zv-link::after {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

#zv-review-filter-link .zv-link::before {
  left: 1.5rem;
  content: "絞り込む";
  line-height: 1;
  text-indent: 0;
}

#zv-review-filter-link .zv-link::after {
  right: 1.5rem;
  width: 1.3rem;
  height: 1.3rem;
  margin-top: -0.02rem;
  mask-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%2221%22%20height%3D%2221%22%20viewBox%3D%220%200%2021%2021%22%3E%0A%20%20%3Cdefs%3E%0A%20%20%20%20%3CclipPath%20id%3D%22clip-path%22%3E%0A%20%20%20%20%20%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_6239%22%20data-name%3D%22%E3%83%91%E3%82%B9%206239%22%20d%3D%22M0%2C0H21V21H0Z%22%20transform%3D%22translate(237.664%20521)%22%20fill%3D%22none%22%2F%3E%0A%20%20%20%20%3C%2FclipPath%3E%0A%20%20%3C%2Fdefs%3E%0A%20%20%3Cg%20id%3D%22%E3%83%9E%E3%82%B9%E3%82%AF%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97_42%22%20data-name%3D%22%E3%83%9E%E3%82%B9%E3%82%AF%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97%2042%22%20transform%3D%22translate(-237.664%20-521)%22%20clip-path%3D%22url(%23clip-path)%22%3E%0A%20%20%20%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_6238%22%20data-name%3D%22%E3%83%91%E3%82%B9%206238%22%20d%3D%22M5.754%2C16.4a2.7%2C2.7%2C0%2C0%2C1%2C5.093%2C0H20v1.8H10.846a2.7%2C2.7%2C0%2C0%2C1-5.093%2C0H2V16.4Zm5.4-6.3a2.7%2C2.7%2C0%2C0%2C1%2C5.093%2C0H20v1.8H16.246a2.7%2C2.7%2C0%2C0%2C1-5.093%2C0H2V10.1Zm-5.4-6.3a2.7%2C2.7%2C0%2C0%2C1%2C5.093%2C0H20V5.6H10.846a2.7%2C2.7%2C0%2C0%2C1-5.093%2C0H2V3.8ZM8.3%2C5.6a.9.9%2C0%2C1%2C0-.9-.9A.9.9%2C0%2C0%2C0%2C8.3%2C5.6Zm5.4%2C6.3a.9.9%2C0%2C1%2C0-.9-.9A.9.9%2C0%2C0%2C0%2C13.7%2C11.9ZM8.3%2C18.2a.9.9%2C0%2C1%2C0-.9-.9A.9.9%2C0%2C0%2C0%2C8.3%2C18.2Z%22%20transform%3D%22translate(237.117%20520.1)%22%20fill%3D%22%23053931%22%2F%3E%0A%20%20%3C%2Fg%3E%0A%3C%2Fsvg%3E%0A');
  mask-size: auto 100%;
  mask-repeat: no-repeat;
  background-color: #6e6e6e;
  content: "";
}

#zv-modal-wrapper {
  background: transparent;
}

#zv-lightbox-header {
  height: auto;
  background: transparent;
  box-shadow: none;
  border: none;
}

#zv-close-button {
  top: 1rem;
  right: 1.3rem;
  width: 2rem;
  height: 2rem;
}

#zv-lightbox-header .zv-close-icon:before,
#zv-lightbox-header .zv-close-icon:after {
  width: 1.5rem;
}

#zv-modal {
  left: 0;
  width: 100%;
  max-width: 100%;
}

#zv-lightbox {
  top: 2rem;
  left: 50%;
  transform: translateX(-50%);
  width: 93%;
  max-width: 60rem;
  height: 42rem;
  border-color: #e2e2e2;
  border-radius: 1rem;
}

#zv-lightbox .zv-select-wrap {
  margin: 1.5rem 2rem;
}

#zv-lightbox #zv-review-filter-text,
#zv-lightbox .zv-select {
  font-size: 1.2rem;
}

#zv-lightbox .zv-select {
  padding-left: 1.3rem;
}

#ZVList #zv-apply.zv-btn {
  transition: opacity 0.4s ease-in-out;
  font-size: 1.2rem;
  width: 12rem;
  padding: 0.6rem 1rem;
  border-radius: 0;
  border: none;
  background: #313131;
  border-radius: 20rem;
  margin-top: 3rem;
  color: #fff;
}

#ZVList #zv-apply.zv-btn:hover {
  opacity: 0.7;
}


/* -- カスタマーレビュー -- */

#zv-top-reviews-wrap {
  padding-bottom: 0.5rem;
}

#zv-top-reviews::before {
  display: block;
  text-align: right;
  font-size: 0.9em;
  letter-spacing: 0.01em;
  content: "※モニターの感想も含まれます。";
}

#zv-top-reviews > .zv-top-customer-review {
  display: flex;
  flex-wrap: wrap;
  margin: 2rem 0.5rem;
  padding: 2rem;
  background-color: #fff;
  border-radius: 10px;
  box-shadow: 1px 3px 6px rgba(0, 0, 0, .16);
}

#zv-top-reviews > .zv-top-customer-review,
#zv-top-reviews > .zv-top-customer-review *,
#ZVList .zv-answer > p,
#ZVList .zv-answer > label,
#ZVList .zv-basic-info > .zv-posted-at {
  font-size: 1.3rem;
  letter-spacing: 0.02em;
  line-height: 1.7;
}

#ZVList .zv-without-item-info {
  order: 2;
  width: calc(100% - 13rem);
  margin-bottom: 2rem;
  padding-top: 0.15rem;
  color: #ababab;
}

#zv-top-reviews > .zv-top-customer-review .zv-nickname,
#ZVList .zv-basic-info > .zv-posted-at {
  font-size: 1.2rem;
}

#ZVList .zv-top-customer-review .zv-rating {
  order: 1;
  width: 13rem;
}

#ZVList .zv-top-customer-review .zv-rating svg {
  width: 2rem;
  height: 2rem;
  margin-right: 2px !important;
}

#ZVList .zv-top-customer-review .zv-reviewcomment {
  margin-bottom: 2rem;
}

#ZVList .zv-title {
  order: 3;
  margin-bottom: 1rem;
  font-size: 1.4rem;
}

#ZVList .zv-answer {
  order: 4;
  width: 100%;
}

#ZVList .zv-answer label {
  color: var(--color-review-basic);
}

#ZVList .zv-helpful-form {
  order: 999;
  width: 100%;
  margin-top: 2rem;
  text-align: right;
}
#ZVList .zv-helpful-form > p {
  padding: 1.5rem 0;
}

/* 選択項目 */
#ZVList .zv-answer-content {
  display: inline-block;
  margin: 0.1em 0.3rem 0.1rem 0;
  padding: 0.2rem 1rem;
  background: #f5f5f5;
  color: #333;
  border-radius: 20rem;
  font-size: 1.1rem;
  vertical-align: 1px;
}

#ZVList .zv-answer-separator {
  display: none;
}

/* 参考になった、ならなかった */
#ZVList .zv-helpful-form > div.zv-helpful.zv-helpful-no,
#ZVList .zv-helpful-form .zv-separator,
#ZVList .zv-helpful-form .zv-popupModal1 {
  display: none;
}

#ZVList .zv-helpful-form > div.zv-helpful.zv-helpful-yes {
  position: relative;
  padding-left: 2rem;
  padding-right: 3.8rem;
  transition: background-color 0.4s;
  border-color: #d3d3d3;
  border-radius: 20rem;
  text-indent: 200rem;
  width: 19rem;
  overflow: hidden;
  line-height: 20;
  height: 2rem;
  font-size: 1.24rem;
}

#ZVList .zv-helpful-form > div.zv-helpful.zv-helpful-yes::before {
  position: absolute;
  top: 50%;
  left: 2rem;
  transform: translateY(-50%);
  content: "このレビューに「いいね！」する";
  text-indent: 0;
  line-height: 1;
}

#ZVList .zv-helpful-form > div.zv-helpful.zv-helpful-yes::after {
  position: absolute;
  top: 50%;
  right: 1.8rem;
  transform: translateY(-50%);
  width: 1.5rem;
  height: 1.5rem;
  margin-top: -0.04rem;
  mask-image: url('data:image/svg+xml;charset=utf8,%0A%3Csvg%20version%3D%221.1%22%20id%3D%22_x32_%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%22512px%22%20height%3D%22512px%22%20viewBox%3D%220%200%20512%20512%22%20style%3D%22width%3A%20256px%3B%20height%3A%20256px%3B%20opacity%3A%201%3B%22%20xml%3Aspace%3D%22preserve%22%3E%0A%0A%3Cg%3E%0A%09%3Cpath%20class%3D%22st0%22%20d%3D%22M474.719%2C176.063H339.781c-7.766%2C0-15.063-3.797-19.531-10.172c-4.453-6.375-5.531-14.516-2.875-21.828%0A%09%09l27.219-74.844c2.656-7.313%2C1.563-15.469-2.875-21.828c-4.469-6.375-11.781-10.172-19.547-10.172h-3.578%0A%09%09c-23.813%2C0-46.078%2C11.844-59.375%2C31.594L133.234%2C239.172v174.609l112.547%2C43.125c6.844%2C2.094%2C15.25%2C4.188%2C21.906%2C5.25%0A%09%09l100.078%2C12.625c30.797%2C0%2C58.141-19.719%2C67.875-48.938l51.016-153.016c0%2C0%2C25.344-17.531%2C25.344-42.078v-23.125%0A%09%09C512%2C189.375%2C493.656%2C176.063%2C474.719%2C176.063z%22%20style%3D%22fill%3A%20rgb(75%2C%2075%2C%2075)%3B%22%3E%3C%2Fpath%3E%0A%09%3Cpath%20class%3D%22st0%22%20d%3D%22M84.844%2C214.625H11.938C5.344%2C214.625%2C0%2C219.969%2C0%2C226.563v228.594c0%2C6.563%2C5.344%2C11.906%2C11.938%2C11.906h72.906%0A%09%09c6.578%2C0%2C11.922-5.344%2C11.922-11.906V226.563C96.766%2C219.969%2C91.422%2C214.625%2C84.844%2C214.625z%22%20style%3D%22fill%3A%20rgb(75%2C%2075%2C%2075)%3B%22%3E%3C%2Fpath%3E%0A%3C%2Fg%3E%0A%3C%2Fsvg%3E%0A');
  mask-position: center center;
  mask-size: auto 100%;
  mask-repeat: no-repeat;
  background-color: #848484;
  content: "";
}

/* ヒット */
#zv-n-reviews,
#ZVList .zv-no-found {
  margin-left: 0;
  letter-spacing: 0.02em;
  line-height: 1.7;
  color: var(--color-review-basic);
  opacity: 0.8;
}

#ZVList .zv-no-found {
  min-height: 18rem;
  text-align: center;
}

#zv-filter-clear {
  color: inherit;
}

#ZVList hr {
  display: none;
}

/* font color */
#ZVList .zv-title,
#ZVList .zv-answer > p,
#zv-review-filter-link .zv-link,
#ZVList .zv-helpful-form > p,
#ZVList .zv-summary-cell:first-child .zv-counts-table tr .zv-star-comment,
#ZVList .zv-helpful-form > div.zv-helpful.zv-helpful-yes,
#ZVList .zv-review-sort,
#ZVList #zv-review-filter-text,
#ZVList .zv-summary-cell:first-child .zv-counts-table tr .zv-star-average {
  color: var(--color-review-basic);
}

/* -- ページネーション -- */

#ZVList .zv-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.8rem;
  margin: auto;
  padding: 1.5rem 0 0;
}

#ZVList .zv-page-btn,
#ZVList .zv-page-btn:hover,
#ZVList .zv-number[disabled] {
  display: flex;
  vertical-align: middle;
  justify-content: center;
  align-items: center;
  transition: background-color .4s ease-in-out,border-color .4s ease-in-out;
  width: 2.2rem;
  height: 2.2rem;
  border: 1px solid #cecece;
  background: transparent;
  padding: 0;
  color: inherit;
  font-size: 1.15rem;
  border-radius: 50%;
  text-align: center;
}
#ZVList .zv-number[disabled] {
  background-color: #8b8b8b;
  border-color: #8b8b8b;
  color: #fff;
  font-weight: normal;
}

#ZVList .zv-pagination .zv-previous.zv-page-btn,
#ZVList .zv-pagination .zv-next.zv-page-btn {
  position: relative;
  display: block;
  width: 1.8rem;
  height: 1.5rem;
  background: none;
  border: none;
  border-radius: 0;
  overflow: hidden;
  text-indent: -20rem;
}

#ZVList .zv-pagination .zv-previous.zv-page-btn[disabled],
#ZVList .zv-pagination .zv-next.zv-page-btn[disabled] {
  opacity: .4;
}

#ZVList .zv-pagination .zv-previous.zv-page-btn::before,
#ZVList .zv-pagination .zv-next.zv-page-btn::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 32%;
  content: "";
}

#ZVList .zv-pagination .zv-page-btn::before {
  background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2210%22%20height%3D%2215.001%22%20viewBox%3D%220%200%2010%2015.001%22%3E%3Cpath%20d%3D%22M14.344%2C15.257l-5-5%2C2.5-2.5%2C7.5%2C7.5-7.5%2C7.5-2.5-2.5Z%22%20transform%3D%22translate(-9.343%20-7.757)%22%20fill%3D%22%777777%22%2F%3E%3C%2Fsvg%3E');
}

#ZVList .zv-pagination .zv-previous.zv-page-btn::before {
  transform: rotate(.5turn);
}

/* ---- モーダル ---- */

#zv-lightbox-body {
  overflow: hidden;
}

/* --- 画像・動画 ---- */

#ZVList .zv-answer .zv-photo {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  margin: 1rem 0;
}

/* modal  */
#zv-lightbox #zv-lightbox-img + #zv-lightbox-info {
  display: none !important;
}

#zv-lightbox.zv-lightbox-image {
  width: 86rem;
  max-width: 86rem;
  height: auto;
  margin-left: auto;
}

#zv-lightbox.zv-lightbox-image #zv-lightbox-body {
  height: auto;
}

#zv-lightbox-img {
  float: none;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 96%;
  height: auto;
  margin: 3.2rem auto 2rem;
}

#zv-lightbox-img #zv-lightbox-main {
  position: inherit;
  top: auto;
  bottom: auto;
  left: auto;
  right: auto;
  max-height: 40rem;
  object-fit: cover;
}

#ZVList img.zv-img {
  max-width: 100%;
  height: 17rem;
  object-fit: cover;
}


/* --- 公式レビュアー ---- */

#ZVList .zv-official {
  margin: 0 0 0 0.2rem;
  padding: 0.2rem 0.7rem;
  border: 1px solid #ddd;
  border-radius: 2rem;
  font-size: 1rem;
  font-weight: normal;
  vertical-align: middle;
}


/* SP用*/
@media (max-width: 600px) {

  #ZVSummary .zv-star-comment, #ZVList table.zv-counts-table .zv-star-comment {
    font-size: calc(24 * (100vw / 586)) !important;
  }

  #ZVList .zv-top-customer-review .zv-rating,
  #ZVList .zv-without-item-info {
    width: 100%;
  }

  #ZVList .zv-without-item-info {
    padding-top: calc(10 * (100vw / 586));
  }

  /* ---- 商品詳細 ---- */
  #ZVList .zv-select {
    letter-spacing: 0em;
  }

  #zv-review-filter {
  }

  /* -- 全体評価 -- */
  #ZVList p.zv-heading {
  }

  .zv-row {
    flex-direction: column;
  }

  #ZVList .zv-summary-cell {
    margin-top: 0.5rem;
  }

  /* チャート */
  #ZVList .zv-summary-cell .zv-counts-table tr th .zv-star-svg,
  #ZVList .zv-summary-cell .zv-counts-table tr th .zv-star-svg-sub {
    width: calc(25 * (100vw / 586));
    height: calc(25 * (100vw / 586));
    margin-right: calc(-2*(100vw / 586)) !important;
  }

  #ZVSummary .zv-hist,
  #ZVList .zv-hist {
    width: calc(260 * (100vw / 586));
    height: calc(22 * (100vw / 586));
    border-radius: calc(2 * (100vw / 586));
  }

  #ZVSummary .zv-hist-bar, #ZVList .zv-hist-bar {
    height: calc(22 * (100vw / 586));
    line-height: calc(22 * (100vw / 586));
  }

  #ZVList table.zv-counts-table td.zv-hist-count {
    font-size: calc(19 * (100vw / 586));
  }

  #ZVList table.zv-counts-table td.zv-hist-count::before {
    margin-left: calc(-20 * (100vw / 586));
  }

  #ZVList table.zv-counts-table > tbody > tr > th {
    padding-right: calc(16 * (100vw / 586));
  }

  /* 総合評価 */

  #ZVList table.zv-counts-table {
    margin-top: 0;
  }

  #ZVList .zv-summary-cell:first-child .zv-counts-table tr th .zv-star-svg,
  #ZVList .zv-summary-cell:first-child .zv-counts-table tr th .zv-star-svg-sub {
    width: calc(42 * (100vw / 586));
    height: calc(42 * (100vw / 586));
    margin-right: calc(-1.5 * (100vw / 586)) !important;
  }

  #ZVList .zv-summary-cell:first-child .zv-counts-table tr .zv-star-average {
    width: calc(50 * (100vw / 586));
    padding: 0;
    font-size: calc(46 * (100vw / 586));
  }

  #ZVList .zv-summary-cell:first-child .zv-counts-table tr .zv-star-comment {
  line-height: 1;
  }

  /* -- ソート -- */

  #ZVList .zv-review-sort,
  #ZVList .zv-select-wrap,
  #ZVList .zv-select,
  #ZVList #zv-review-filter-text {
    font-size: calc(19 * (100vw / 586));
  }

  #ZVList .zv-select {
    padding: calc(11 * (100vw / 586)) calc(40 * (100vw / 586)) calc(10 * (100vw / 586)) calc(15 * (100vw / 586));
    line-height: 1.3;
  }

  #ZVList .zv-select-wrap {
  }

  #ZVList .zv-select-wrap:last-child {
    margin-right: 0;
  }

  #ZVList .zv-select-wrap::before {
    right: calc(13 * (100vw / 586));
    border-left-width: calc(6 * (100vw / 586));
    border-right-width: calc(6 * (100vw / 586));
    border-top-width: calc(8 * (100vw / 586));
  }

  /* -- フィルターリンク -- */

  #zv-review-filter-link {
    margin-top: calc(36 * (100vw / 586));
  }

  /* SP用*/
  @media (max-width: 600px) {

    #zv-review-filter-link {
      margin-top: calc(34 * (100vw / 586));
    }

  }

  #zv-review-filter-link .zv-link {
    width: calc(120 * (100vw / 586));
    height: calc(33 * (100vw / 586));
    padding: calc(5 * (100vw / 586)) calc(20 * (100vw / 586));
    font-size: calc(20 * (100vw / 586));
  }

  #zv-review-filter-link .zv-link::before {
    left: calc(22 * (100vw / 586));
  }

  #zv-review-filter-link .zv-link::after {
    right: calc(22 * (100vw / 586));
    width: calc(22 * (100vw / 586));
    height: calc(22 * (100vw / 586));
    margin-top: 0;
  }


  #zv-lightbox {
    top: calc(150 * (100vw / 586));
    height: calc(680 * (100vw / 586));
    border-radius: calc(10 * (100vw / 586));
  }

  #zv-lightbox .zv-review-sort,
  #zv-lightbox .zv-select-wrap,
  #zv-lightbox .zv-select,
  #zv-lightbox #zv-review-filter-text {
    font-size: calc(21 * (100vw / 586));
  }

  #zv-lightbox .zv-select {
    padding-left: calc(23 * (100vw / 586));
  }

  #ZVList #zv-apply.zv-btn {
    width: calc(240 * (100vw / 586));
    margin-top: calc(35 * (100vw / 586));
    padding: calc(10 * (100vw / 586)) calc(24 * (100vw / 586));
    font-size: calc(22 * (100vw / 586));
  }

  #zv-lightbox .zv-select-wrap::before {
    right: calc(16*(100vw / 586));
  }

  /* -- カスタマーレビュー -- */

  #zv-top-reviews-wrap {
    padding-bottom: calc(10 * (100vw / 586));
  }

  #zv-top-reviews > .zv-top-customer-review {
    margin: calc(30 * (100vw / 586)) calc(5 * (100vw / 586));
    padding: calc(30 * (100vw / 586));
    border-radius: 10px;
  }

  #zv-top-reviews > .zv-top-customer-review,
  #zv-top-reviews > .zv-top-customer-review *,
  #ZVList .zv-answer > p,
  #ZVList .zv-answer > label,
  #ZVList .zv-basic-info > .zv-posted-at {
    font-size: calc(22 * (100vw / 586));
    line-height: 1.6;
  }

  #ZVList .zv-without-item-info {
    width: 100%;
    margin-bottom: calc(20 * (100vw / 586));
    padding-top: calc(10 * (100vw / 586));
  }

  #zv-top-reviews > .zv-top-customer-review .zv-nickname,
  #ZVList .zv-basic-info > .zv-posted-at {
    font-size: calc(20 * (100vw / 586));
  }

  #ZVList .zv-top-customer-review .zv-rating {
    width: 100%;
  }

  #ZVList .zv-top-customer-review .zv-rating svg {
    width: calc(34 * (100vw / 586));
    height: calc(34 * (100vw / 586));
    margin-right: calc(3 * (100vw / 586)) !important;
  }

  #ZVList .zv-top-customer-review .zv-reviewcomment {
    margin-bottom: calc(20 * (100vw / 586));
  }

  #ZVList .zv-title {
    margin-bottom: calc(15 * (100vw / 586));
    font-size: calc(22 * (100vw / 586));
  }

  #ZVList .zv-answer {
    width: 100%;
  }

  #ZVList .zv-answer label {
  }

  #ZVList .zv-efficacy {
    margin-bottom: calc(20 * (100vw / 586));
  }

  #ZVList .zv-efficacy label {
    display: block;
    margin-bottom: calc(5 * (100vw / 586));
  }

  #ZVList .zv-helpful-form {
    margin-top: calc(20 * (100vw / 586));
  }

  #ZVList .zv-helpful-form > p {
    padding: calc(20 * (100vw / 586)) 0;
    font-size: calc(20 * (100vw / 586));
  }

  /* 選択項目 */
  #ZVList .zv-answer-content {
    margin: calc(4 * (100vw / 586)) calc(6 * (100vw / 586)) calc(4 * (100vw / 586)) 0;
    padding: calc(4 * (100vw / 586)) calc(15 * (100vw / 586));
    border-radius: calc(20 * (100vw / 586));
    font-size: calc(17 * (100vw / 586));
    vertical-align: calc(3*(100vw / 586));
  }

  /* 参考になった、ならなかった */
  #ZVList .zv-helpful-form > div.zv-helpful.zv-helpful-yes {
    width: calc(300 * (100vw / 586));
    height: calc(34 * (100vw / 586));
    margin-right: 0;
    padding-left: calc(24 * (100vw / 586));
    padding-right: calc(52 * (100vw / 586));
    font-size: calc(19 * (100vw / 586));
  }

  #ZVList .zv-helpful-form > div.zv-helpful.zv-helpful-yes::before {
    position: absolute;
    top: 50%;
    left: calc(28 * (100vw / 586));
    transform: translateY(-50%);
    content: "このレビューに「いいね！」する";
    text-indent: 0;
    line-height: 1.6;
  }

  #ZVList .zv-helpful-form > div.zv-helpful.zv-helpful-yes::after {
    right: calc(20 * (100vw / 586));
    width: calc(25 * (100vw / 586));
    height: calc(25 * (100vw / 586));
    margin-top: calc(-1 * (100vw / 586));
  }

  /* ヒット */
  #zv-n-reviews,
  #ZVList .zv-no-found {
    font-size: calc(22 * (100vw / 586));
  }

  #ZVList .zv-no-found {
    min-height: calc(400 * (100vw / 586));
  }

  /* -- ページネーション -- */

  #ZVList .zv-pagination {
    gap: calc(18 * (100vw / 586));
    padding: calc(20 * (100vw / 586)) 0 calc(5 * (100vw / 586));
  }

  #ZVList .zv-page-btn,
  #ZVList .zv-page-btn:hover,
  #ZVList .zv-number[disabled] {
    width: calc(35 * (100vw / 586));
    height: calc(35 * (100vw / 586));
    font-size: calc(20 * (100vw / 586));
  }

  #ZVList .zv-pagination .zv-previous.zv-page-btn,
  #ZVList .zv-pagination .zv-next.zv-page-btn {
    width: calc(28 * (100vw / 586));
    height: calc(25 * (100vw / 586));
    text-indent:  calc(-200 * (100vw / 586));
  }

  #zv-close-button {
    top: calc(22*(100vw / 586));
    right: calc(34*(100vw / 586));
    width: calc(25*(100vw / 586));
    height: calc(25*(100vw / 586));
  }

  #zv-lightbox-header .zv-close-icon:before,
  #zv-lightbox-header .zv-close-icon:after {
    width: calc(32*(100vw / 586));
  }

  #zv-modal {
  }

  /* ---- モーダル ---- */
  #zv-lightbox {
  }

  /* --- 画像・動画 ---- */

  #zv-lightbox.zv-lightbox-image {
    width: calc(548 * (100vw / 586));
    max-width: calc(548 * (100vw / 586));
    height: auto;
    margin-left: auto;
  }

  #ZVList .zv-answer .zv-photo {
    gap: calc(20*(100vw / 586));
    margin: calc(20*(100vw / 586)) 0;
  }

  #zv-lightbox-img {
    width: 88%;
    margin: calc(70*(100vw / 586)) auto calc(45*(100vw / 586));
  }

  #zv-lightbox-img #zv-lightbox-main {
    max-height: calc(530*(100vw / 586));
  }

  #ZVList img.zv-img {
    height: calc(186*(100vw / 586));
  }

  /* --- 公式レビュアー ---- */

  #ZVList .zv-official {
    margin: 0 0 0 calc(3*(100vw / 586));
    padding: calc(3*(100vw / 586)) calc(10*(100vw / 586));
    font-size: calc(10*(100vw / 586));
  }


}


/* ---- もっと見るボタン ---- */
#zv-top-reviews > .zv-top-customer-review.none {
  display: none ; /* showクラスが付いたレビューだけ表示 */
}

.product-review__viewmore {
  opacity: 0;
  animation: fadein 0s ease 0.8s 1 forwards;
  position: relative;
  width: 100%;
  z-index: 2;
  margin: auto;
  padding: 1rem 0 0.5rem;
  background: #fff;
}

@keyframes fadein {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.product-review__viewmore span {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 30rem;
  height: 5rem;
  margin: auto;
  font-size: 1.6rem;
  font-weight: 600;
  font-family: var(--font-base);
  line-height: 1.4;
  color: #053931;
  border: 1px solid #053931;
  border-radius: 100vh;
  background:
    url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2215.001%22%20height%3D%2210%22%20viewBox%3D%220%200%2015.001%2010%22%3E%3Cpath%20d%3D%22M14.344%2C15.257l-5-5%2C2.5-2.5%2C7.5%2C7.5-7.5%2C7.5-2.5-2.5Z%22%20transform%3D%22translate(22.758%20-9.343)%20rotate(90)%22%20fill%3D%22%23053931%22%2F%3E%3C%2Fsvg%3E')
    center right calc(20 *(100vw / 428)) / calc(10 *(100vw / 428)) calc(15 *(100vw / 428))
    no-repeat
    #fff;
  background-position: center right 2rem;
  background-size: 1rem 1.5rem;
  cursor: pointer;
}


@media (max-width: 900px) {

  .product-review__viewmore span {
    width: 25rem;
    height: 4rem;
    font-size: 1.4rem;
  }
}

/* SP用*/
@media (max-width: 600px) {

  .product-review__viewmore span {
    width: calc(263 *(100vw / 428));
    height: calc(50 *(100vw / 428));
    font-size: calc(16 *(100vw / 428));
    background:
      url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2215.001%22%20height%3D%2210%22%20viewBox%3D%220%200%2015.001%2010%22%3E%3Cpath%20d%3D%22M14.344%2C15.257l-5-5%2C2.5-2.5%2C7.5%2C7.5-7.5%2C7.5-2.5-2.5Z%22%20transform%3D%22translate(22.758%20-9.343)%20rotate(90)%22%20fill%3D%22%23053931%22%2F%3E%3C%2Fsvg%3E')
      center right calc(20 *(100vw / 428)) / calc(10 *(100vw / 428)) calc(15 *(100vw / 428))
      no-repeat
      #fff;
  }

}
