@media screen and (min-width: 768px) {
  .sp-none {
    display: inline-block; } }
@media screen and (max-width: 767px) {
  .sp-none {
    display: none; } }

@media screen and (min-width: 768px) {
  .pc-none {
    display: none; } }
@media screen and (max-width: 767px) {
  .pc-none {
    display: block; } }

.l-main {
  background-color: #f8f5f5; }
  @media screen and (min-width: 768px) {
    .l-main {
      padding: 50px 0 100px; } }
  @media screen and (max-width: 767px) {
    .l-main {
      padding: 9.066666vw 0; } }

.l-main p {
  line-height: 1.57143;
  letter-spacing: .04em; }
  @media screen and (min-width: 768px) {
    .l-main p {
      font-size: 13px; } }
  @media screen and (max-width: 767px) {
    .l-main p {
      font-size: 3.2vw; } }

.info-inner {
  background-color: #fff;
  position: relative; }
  @media screen and (min-width: 768px) {
    .info-inner {
      width: 900px;
      margin: 0 auto;
      padding: 30px 95px 70px;
      box-sizing: border-box; } }
  @media screen and (max-width: 767px) {
    .info-inner {
      width: 89.33333vw;
      margin: 0 auto;
      padding: 15.2vw 4vw 10.66667vw;
      box-sizing: border-box; } }

.info-inner h1 {
  text-align: center; }
  @media screen and (min-width: 768px) {
    .info-inner h1 {
      font-size: 18px;
      margin: 80px 0 60px;
      line-height: 1.6; } }
  @media screen and (max-width: 767px) {
    .info-inner h1 {
      margin-bottom: 8vw;
      line-height: 1.5;
      font-size: 4.2666667vw; } }

.info-date {
  position: absolute; }
  @media screen and (min-width: 768px) {
    .info-date {
      top: 40px;
      right: 65px; } }
  @media screen and (max-width: 767px) {
    .info-date {
      top: 4vw;
      right: 4vw; } }

.info-top-text span {
  display: block; }
  @media screen and (min-width: 768px) {
    .info-top-text span {
      margin-bottom: 15px; } }
  @media screen and (max-width: 767px) {
    .info-top-text span {
      margin-bottom: 4.26666vw;
      letter-spacing: -0.02em; } }

/*products*/
.product-container {
  max-width: 730px;
  margin: 60px auto 0;
  display: flex;
  flex-direction: column;
  gap: 60px; }
  @media screen and (max-width: 767px) {
    .product-container {
      gap: 50px;
      margin-top: 35px; } }

.product-card {
  text-align: center; }

.product-title {
  font-size: 15px;
  margin-bottom: 20px;
  letter-spacing: 0.04em; }
  .product-title span {
    font-size: 13px; }
    @media screen and (max-width: 767px) {
      .product-title span {
        font-size: 3.4666666667vw; } }
  @media screen and (max-width: 767px) {
    .product-title {
      margin-bottom: 2.6666666667vw;
      font-size: 4vw;
      line-height: 1.57143; } }
  .product-title-change {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 40px;
    margin-bottom: 20px; }
    @media screen and (max-width: 767px) {
      .product-title-change {
        line-height: 1.57143;
        gap: 3px; } }
  .product-title-before, .product-title-after {
    font-size: 15px; }
    @media screen and (max-width: 767px) {
      .product-title-before, .product-title-after {
        font-size: 4vw; } }
    .product-title-before span, .product-title-after span {
      font-size: 13px; }
      @media screen and (max-width: 767px) {
        .product-title-before span, .product-title-after span {
          font-size: 3.4666666667vw; } }

.product-capacity {
  font-size: 13px;
  margin-bottom: 20px; }
  .product-capacity-change {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 40px;
    margin-bottom: 20px; }
    @media screen and (max-width: 767px) {
      .product-capacity-change {
        gap: 20px; } }
  @media screen and (max-width: 767px) {
    .product-capacity {
      font-size: 3.4666666667vw;
      line-height: 1.57143; } }

.price-change {
  padding: 10px 10px;
  border: 1px solid #d3d3d3;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 40px;
  font-size: 13px;
  margin-bottom: 30px;
  background-color: #fff;
  box-sizing: border-box; }
  @media screen and (min-width: 768px) {
    .price-change {
      width: 500px; } }
  @media screen and (max-width: 767px) {
    .price-change {
      width: 81.3333333333vw;
      gap: 20px; } }

.price-before span,
.price-after span {
  font-size: 11px; }
  @media screen and (max-width: 767px) {
    .price-before span,
    .price-after span {
      display: contents;
      font-size: 2.9333333333vw; } }

.price-arrow,
.product-title-arrow,
.product-capacity-arrow {
  font-size: 0.5rem;
  color: #878782; }

.image-comparison {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 30px; }
  @media screen and (max-width: 767px) {
    .image-comparison {
      gap: 10px; } }
  .image-comparison img {
    max-height: 200px;
    width: auto;
    object-fit: contain; }
    @media screen and (max-width: 767px) {
      .image-comparison img {
        max-width: 29.3333333333vw; } }

.change-arrow {
  width: 40px;
  height: 40px;
  background: url(/contents/shared/images/icon_triangle.svg) no-repeat 50% 50%;
  background-size: 100% 100%;
  content: ""; }
  @media screen and (max-width: 767px) {
    .change-arrow {
      width: 6.9333333333vw;
      height: 6.9333333333vw; } }