@charset "UTF-8";

/* ------------------------------------------------------------
カテゴリページ
------------------------------------------------------------ */
.rv1m {
  overflow: hidden;
  --font_min: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", "YuMincho", serif;
}
.contents_wrap li{
  list-style: none;
}

.fv{
  position: relative;
}
.fv_logo{
  width: 62.1%;
  position: absolute;
  top: 2.2%;
  left: 0;
  right: 0;
  margin:auto;
}
.fv_catch{
  width: 99.1%;
  position: absolute;
  top: 59.27%;
  left: 0;
  right: 0;
  margin:auto;
}
.fv_lens{
  width: 88%;
  top: 79.5%;
  position: absolute;
  left: 0;
  right: 0;
  margin:auto;
}

.newColor{
  background: #E9CCD1;
  background: linear-gradient(180deg,rgba(233, 204, 209, 1) 75%, rgba(255, 255, 255, 1) 100%);
  position: relative;
  padding-bottom: 277%;
}
.newColor_title{
  position: absolute;
  top: 0.487%;
  left: 0;
  right: 0;
  margin:auto;
  width: 91%;
}
.newColor_image{
  position: absolute;
  top: 14%;
  left: 41.9%;
  width: 34.6%;
  z-index: 1;
}
.newColor_image + .newColor_image{
  position: absolute;
  top: 18.6%;
  left: 22.7%;
  width: 33.2%;
  z-index: 2;
}
.newColor_subTitle {
  position: absolute;
  top: 29.4%;
  left: 2.7%;
  width: 95.2%;
}
.newColor_nib{
  position: absolute;
  top: 36.5%;
  left: 6%;
  width: 92.1%;
}
.newColor_list{
  position: absolute;
  top: 53%;
}
.newColor_list_item{
  width: 95.2%;
  margin-bottom: 11%;
}
.newColor_list_item:nth-child(2){
  width: 91.3%;
  margin: 0 0 8% 3.6%;
}
.newColor_list_item:last-child{
  width: 95.6%;
  margin-bottom: 0;
}

.awards{
  width: 90.1%;
  margin: 18% auto;
}

.lineUP_title{
  width: 40.8%;
  margin: 0 auto 6%;
}
.lineUP_color_list{
  display: flex;
  flex-wrap: wrap;
  margin: 0 0 4.5% 5%;
  padding-top: 5%;
}

.lineUP_color_list_item:nth-child(1){
  flex-basis: 46.5%;
  margin-right: 3%;
  margin-bottom: 2.5%;
}
.lineUP_color_list_item:nth-child(2){
  flex-basis: 47.5%;
  margin-bottom: 2.5%;
}
.lineUP_color_list_item{
  flex-basis: calc(97% / 3);
  margin-bottom: 2%;
  position: relative;
}
/* .lineUP_color_list_item a {
  position: relative;
} */
.lineUP_color_list_item:nth-child(1) .lineUP_color_name,
.lineUP_color_list_item:nth-child(2) .lineUP_color_name{
  font-size: 1.7rem;
}
.rv1mLp .lineUP_color_list_item:nth-child(1) .lineUP_color_name,
.rv1mLp .lineUP_color_list_item:nth-child(2) .lineUP_color_name{
  font-size: calc(1.7rem * 0.6);
}

.lineUP_color_name {
  position: absolute;
  bottom: 1rem;
  left: 0;
  font-weight: bold;
  font-size: 1.6rem;
  color: #3c3c3c;
}
.rv1mLp .lineUP_color_name {
  bottom: calc(1rem * 0.6);
  font-size: calc(1.6rem * 0.6);
}
.color_list_item_name.name_mm {
  top: 4%;
}
.color_list_item_name.name_vb {
  top: 4%;
}

.lineUP_color_chart{
  margin-bottom: 3%;
}
.lineUP_color_btn{
  width: 90.2%;
  margin:0 auto 12%;
}
.lineUP_circle_list{
  display: flex;
  flex-wrap: wrap;
  margin: 0 0 4.7% 5%;
  padding-top: 5.8%;
}
.lineUP_circle_list_item:nth-child(1) {
  align-items: center;
  display: flex;
  flex-basis: 46.5%;
  justify-content: center;
  margin-right: 4%;
  margin-bottom: 2%;
}
.lineUP_circle_list_item:nth-child(2) {
  flex-basis: 47.0%;
  margin-bottom: 2%;
}
.lineUP_circle_list_item:nth-child(3),
.lineUP_circle_list_item:nth-child(4){
  margin-right: 1%;
}
.lineUP_circle_list_item {
  flex-basis: calc(96% / 3);
  margin-bottom: 2%;
  position: relative;
}
/* .lineUP_circle_list_item a {
  position: relative;
  display: block;
} */
.lineUP_circle_list_item:nth-child(1) .lineUP_circle_name,
.lineUP_circle_list_item:nth-child(2) .lineUP_circle_name {
  font-size: 1.7rem;
}
.rv1mLp .lineUP_circle_list_item:nth-child(1) .lineUP_circle_name,
.rv1mLp .lineUP_circle_list_item:nth-child(2) .lineUP_circle_name {
  font-size: calc(1.7rem * 0.6);
}
.circle_list_item_name.name_nib {
  top: 4%;
}
.circle_list_item_name.name_sb {
  top: 8%;
}
.lineUP_circle_name {
  position: absolute;
  bottom: 1rem;
  left: 0;
  font-weight: bold;
  font-size: 1.6rem;
  color: #3c3c3c;
}
.rv1mLp .lineUP_circle_name {
  bottom: calc(1rem * 0.6);
  font-size: calc(1.6rem * 0.6);
}
.new_icon a {
  position: relative;
  display: block;
}
.new_icon a::before {
  content: "";
  position: absolute;
  display: block;
  aspect-ratio: 1;
  width: 22%;
  background-image: url(/images/pc/type/se_revia1m_26se/new_icon.webp);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  top: -4.4%;
  left: -4.4%;
}
.lineUP_circle_chart{
  margin: 0 auto 3.1%;
}
.lineUP_circle_btn{
  width: 90.2%;
  margin:0 auto 8.8%;
}

.color_title{
  width: 81.8%;
  margin: 0 auto 4.8%;
}

.color_price_subTitle{
  width: 28.9%;
  margin: 0 auto 4%;
}
.color_price{
  position: relative;

}
.color_price_2set_btn{
  position: absolute;
  top: 42.5%;
  left: 0;
  right: 0;
  margin: auto;
  width: 90%;
}
.color_price_subsc_btn{
  position: absolute;
  top: 71%;
  left: 0;
  right: 0;
  margin: auto;
  width: 90%;
}

.circle_price_subTitle{
  width: 28.9%;
  margin: 0 auto 4%;
}
.circle_price{
  position: relative;
}
.circle_price_2set_btn{
  position: absolute;
  top: 42%;
  left: 0;
  right: 0;
  margin: auto;
  width: 90%;
}
.circle_price_subsc_btn{
  position: absolute;
  top: 70%;
  left: 0;
  right: 0;
  margin: auto;
  width: 90%;
}

.color_list,
.circle_list {
  display: flex;
  flex-direction: column;
}
.color_list {
  margin-bottom: 4%;
}
.color_list_item,
.circle_list_item {
  padding: 6% 0;
  position: relative;
}
.color_list_item:not(:last-child):before,
.circle_list_item:not(:last-child):before {
  position: absolute;
  content: "";
  width: 88%;
  height: 2px;
  right: 0;
  left: 0;
  margin-left: auto;
  margin-right: auto;
  bottom: 0;
  background-color: #3c3c3c;
}

.color_list_item a,
.circle_list_item a {
  position: relative;
  color: #3c3c3c;
  display: block;
}
.color_list_item a img,
.circle_list_item a img {
  position: relative;
}
.color_list_item_name,
.circle_list_item_name {
  position: absolute;
  top: 2%;
  left: 5.8%;
  font-size: 2.8rem;
  font-family: var(--font_min);
  font-weight: bold;
}
.rv1mLp .color_list_item_name,
.rv1mLp .circle_list_item_name {
  font-size: calc(2.8rem * 0.6);
  top: 8%;
}
.color_list_item_disc,
.circle_list_item_disc {
  position: absolute;
  bottom: 45%;
  left: 6%;
  font-size: 2.8rem;
  line-height: 4.8rem;
}
.rv1mLp .color_list_item_disc,
.rv1mLp .circle_list_item_disc {
  bottom: 44%;
  text-align: left;
  font-size: calc(2.8rem * 0.6);
  line-height: calc(4.8rem * 0.6);
}
.label_color_no1::after {
  content: "";
  display: inline-block;
  width: auto;
  height: 1.2em;
  aspect-ratio: 210 / 44;
  background-image: url(/images/pc/type/se_revia1m_26se/label_color_no1.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: bottom;
  margin-left: 1rem;
}
.label_color_no2::after {
  content: "";
  display: inline-block;
  width: auto;
  height: 1.2em;
  aspect-ratio: 210 / 44;
  background-image: url(/images/pc/type/se_revia1m_26se/label_color_no2.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: bottom;
  margin-left: 1rem;
}
.label_color_no3::after {
  content: "";
  display: inline-block;
  width: auto;
  height: 1.2em;
  aspect-ratio: 210 / 44;
  background-image: url(/images/pc/type/se_revia1m_26se/label_color_no3.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: bottom;
  margin-left: 1rem;
}
.label_circle_no1::after {
  content: "";
  display: inline-block;
  width: auto;
  height: 1.2em;
  aspect-ratio: 210 / 44;
  background-image: url(/images/pc/type/se_revia1m_26se/label_circle_no1.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: bottom;
  margin-left: 1rem;
}
.label_circle_no2::after {
  content: "";
  display: inline-block;
  width: auto;
  height: 1.2em;
  aspect-ratio: 210 / 44;
  background-image: url(/images/pc/type/se_revia1m_26se/label_circle_no2.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: bottom;
  margin-left: 1rem;
}
.label_circle_no3::after {
  content: "";
  display: inline-block;
  width: auto;
  height: 1.2em;
  aspect-ratio: 210 / 44;
  background-image: url(/images/pc/type/se_revia1m_26se/label_circle_no3.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: bottom;
  margin-left: 1rem;
}

.circle_title{
  width: 71%;
  margin: 0 auto 4%;
}
.circle_sb_image{
  margin-top: 6%;
}

.lensSpec {
  background-color: #c1c1c3;
  padding-bottom: 18%;
}

.lensSpec_wrap {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 1rem;
  margin: 0 4.9%;

  > .lensSpec_item {
    background-color: #ffffff;
    min-width: 0;
    padding: 2.8rem 0 2rem;
    &:nth-child(1) {
      grid-column: 1 / -1;
    }
    &:nth-child(n + 2):nth-child(-n + 5) {
      grid-column: span 3;
    }
    &:nth-child(n + 6) {
      grid-column: span 3;
    }
  }
  }
  .lensSpec_inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 8%;
  }
  .lensSpec_subtitle {
    text-align: center;
    font-size: 3.3rem;
    line-height: 4rem;
    font-family: var(--font_min);
  }
  .rv1mLp .lensSpec_subtitle {
    font-size: calc(3.3rem * 0.6);
    line-height: calc(4rem * 0.6);
  }
  .lensSpec_disc {
    text-align: center;
    font-size: 1.8rem;
    line-height: 3rem;
    margin-bottom: 1.8rem;
  }
  .rv1mLp .lensSpec_disc {
    font-size: calc(1.8rem * 0.6);
    line-height: calc(3rem * 0.6);
    margin-bottom: calc(1.8rem * 0.6);
  }
  .lensSpec_item:nth-child(1) .lensSpec_disc {
    margin-bottom: 0;
  }
  .lensSpec_item:nth-child(2) .lensSpec_disc {
    margin: 20px 6% 18px;
  }
  .rv1mLp .lensSpec_item:nth-child(2) .lensSpec_disc {
    margin: 10px 6% 10px;
  }
  .lensSpec_item:nth-child(3) .lensSpec_disc {
    margin: 20px 6% 10px;
  }
  .rv1mLp .lensSpec_item:nth-child(3) .lensSpec_disc {
    margin: 10px 6% 10px;
  }
  .lensSpec_item:nth-child(4) .lensSpec_disc {
    margin: 27px 6% 24px;
  }
  .rv1mLp .lensSpec_item:nth-child(4) .lensSpec_disc {
    margin: 10px 6% 10px;
  }
  .lensSpec_item:nth-child(5) .lensSpec_disc {
    margin: 15px 6% 24px;
  }
  .rv1mLp .lensSpec_item:nth-child(5) .lensSpec_disc {
    margin: 10px 6% 10px;
  }
  .lensSpec_item:nth-child(6) .lensSpec_disc {
    margin: 15px 6% 46px;
  }
  .rv1mLp .lensSpec_item:nth-child(6) .lensSpec_disc {
    margin: 10px 6% 20px;
  }
  .lensSpec_item:nth-child(7) .lensSpec_disc {
    margin: 15px 6% 24px;
  }
  .rv1mLp .lensSpec_item:nth-child(7) .lensSpec_disc {
    margin: 10px 6% 10px;
  }
  .lensSpec_item:nth-child(1) .lensSpec_image {
    width: 40.283%;
  }
  .lensSpec_item:nth-child(2) .lensSpec_image {
    width: 32%;
    margin: auto;
  }
  .lensSpec_item:nth-child(3) .lensSpec_image {
    width: 69%;
    margin: auto;
  }
  .lensSpec_item:nth-child(4) .lensSpec_image {
    width: 73%;
    margin: 0 auto;
  }
  .lensSpec_item:nth-child(5) .lensSpec_image {
    margin: 0 auto;
    width: 29%;
  }
  .lensSpec_item:nth-child(6) .lensSpec_image {
    margin: 0 auto;
    width: 52%;
  }
  .lensSpec_item:nth-child(7) .lensSpec_image {
    margin: 0 auto;
    width: 32%;
  }
  .lensSpec_item:nth-child(8) .lensSpec_image {
    margin: 0 auto;
    width: 53%;
  }/* 
  .lensSpec_item:nth-child(1) .lensSpec_image img {
    aspect-ratio: 293 / 149;
  }
  .lensSpec_item:nth-child(2) .lensSpec_image img {
    aspect-ratio: 324 / 122;
  }
  .lensSpec_item:nth-child(3) .lensSpec_image img {
    aspect-ratio: 101 / 122;
  } 
  .lensSpec_item:nth-child(4) .lensSpec_image img {
    aspect-ratio: 123 / 125;
  }
  .lensSpec_item:nth-child(5) .lensSpec_image img {
    aspect-ratio: 312 / 128;
  }
  .lensSpec_item:nth-child(6) .lensSpec_image img {
    aspect-ratio: 253 / 141;
  }
  .lensSpec_item:nth-child(7) .lensSpec_image img {
    aspect-ratio: 210 / 114;
  }
  .lensSpec_item:nth-child(8) .lensSpec_image img {
    aspect-ratio: 152 / 142;
  }*/

.profile {
  margin: 18% 0;
}

.profile_subTitle {
  width: 84.3%;
  margin: 0 auto 6%;
}
.profile_image {
  width: 76%;
  margin: 0 auto;
}

.profile_box {
  background-color: #fff;
  margin: 0 12%;
  padding-top: 5.7%;
  padding-bottom: 5.8%;
}
.profile_name {
  text-align: center;
  margin-bottom: 4rem;
}
.profile_en {
  font-size: 6.8rem;
  line-height: 4.7rem;
}
.rv1mLp .profile_en {
  font-size: calc(6.8rem * 0.6);
  line-height: calc(4.7rem * 0.6);
}
.profile_kana {
  font-size: 2.3rem;
  font-family: var(--font_min);
  line-height: 4.7rem;
}
.rv1mLp .profile_kana {
  font-size: calc(2.3rem * 0.6);
  line-height: calc(4.7rem * 0.6);
}
.profile_group {
  font-size: 4rem;
}
.rv1mLp .profile_group {
  font-size: calc(4rem * 0.6);
}
.profile_text {
  margin: 0 6%;
  font-size: 2.28rem;
  line-height: 4rem;
  text-align: justify;
}
.rv1mLp .profile_text {
  font-size: calc(2.28rem * 0.6);
  line-height: calc(4rem * 0.6);
}

.logo {
  width: 36%;
  margin: 0 auto;
}

.teikiLink{
  margin-top: 24.2%;
}
.teikiLink_wrap{
  background-color: #e6e6e8;
  display: flex;
  justify-content: space-between;
  padding: 47px 60px 120px;
}
.teikiLink_btn{
  flex-basis: 47.7%;
}

/*定期便*/
.productContent{
  margin:10% 0 16%;
}
.productContent_title{
  width: 29%;
  margin: 0 auto 5.5%;
}
.productFaq{
  background-color: #c1c1c3;
}
.productFaq_summary{
  background-color: #3c3c3c;
}
.productFaq_title,
.productFaq_subTitle{
  color: #fff;
}
.productFaq_answer{
  background-image: url(https://fatp275ehc.user-space.cdn.idcfcloud.net/images/pc/type/se_revia1d_26/icon_a_red.svg) ;
  background-position: left 5% top 26px;
  background-repeat: no-repeat;
  background-size: 16px;
  background-color: #fff;
}
.productFaq_text{
  font-weight: 500;
}
.productContent_circle .productFaq{
  background-color: #eaa0b9;
}
.productContent_circle .productFaq_summary{
  background-color: #f5d2d8;
  background-image: url(/images/pc/product/arrow_product_faq.svg), url(/images/pc/product/icon_q_gray.svg);
  color: #3c3c3c;
}
.productContent_circle .productFaq_details[open] .productFaq_summary {
  background-image: url(/images/pc/product/arrow_product_faq_close.svg), url(/images/pc/product/icon_q_gray.svg);
}

/* シンプルフェードアップ */
.fadeUp {
  opacity: 0;
  transform: translateY(20px); /* 少し下に配置 */
  transition: opacity 0.4s ease-out, transform 0.4s ease-out;
}
.fadeUp.active {
  opacity: 1;
  transform: translateY(0);
}
/* 遅延時間を transition-delay で指定する */
.fadeUp.delay1 { transition-delay: 0s; }
.fadeUp.delay2 { transition-delay: 0.1s; }
.fadeUp.delay3 { transition-delay: 0.2s; }
.fadeUp.delay4 { transition-delay: 0.3s; }
.fadeUp.delay5 { transition-delay: 0.4s; }
.fadeUp.delay6 { transition-delay: 0.5s; }
.fadeUp.delay7 { transition-delay: 0.6s; }
.fadeUp.delay8 { transition-delay: 0.7s; }
.fadeUp.delay9 { transition-delay: 0.8s; }

/* シンプルフェードイン */
.fadeIn {
  opacity: 0;
  transition: opacity 0.4s ease-out;
}
.fadeIn.active {
  opacity: 1;
}
/* 遅延時間を transition-delay で指定する */
.fadeIn.delay1 { transition-delay: 0.2s; }
.fadeIn.delay2 { transition-delay: 0.5s; }
.fadeIn.delay3 { transition-delay: 0.8s; }
.fadeIn.delay4 { transition-delay: 1.1s; }

/* 右から左 */
.fadeRight {
  opacity: 0;
  transform: translateX(30px);
  transition: opacity 0.4s ease-out, transform 0.4s ease-out;
}
.fadeRight.active {
  opacity: 1;
  transform: translateX(0);
}

/* 左から右  */
.fadeLeft {
  opacity: 0;
  transform: translateX(-30px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.fadeLeft.active {
  opacity: 1;
  transform: translateX(0);
}
/* .rv1mLp .newColor{
  padding-bottom: 185%;
} */
.rv1mLp .lineUP{
  margin-top: 16%;
}
 
/* ReVIA Products */
.other_products{
  margin-top: 40px;
}
.other_products_title{
  background-color: #333;
  color: #fff;
  font-size: 2rem;
  font-weight: bold;
  padding: 10px 15px;
  text-align: left;
}
.other_products_image{
  margin-bottom: 30px;
}
.other_products_subTitle{
  font-size: 1.4rem;
  color: #3c3c3c;
  margin: 6px 0 0;
}
.other_products_lineup{
  margin-top: 20px;
}