@media print, screen and (min-width: 768px) {
  .amenitySect {
    margin: 0 auto;
    padding-top: 100px;
    width: 990px;
  }
}

@media screen and (max-width: 768px) {
  .amenitySect {
    padding-top: 80px;
  }
}

@media print, screen and (min-width: 768px) {
  .amenitySect__head + .amenitySect__cont {
    margin-top: 100px;
  }
}

@media screen and (max-width: 768px) {
  .amenitySect__head + .amenitySect__cont {
    margin-top: 40px;
  }
}

.amenitySect__cont {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

@media print, screen and (min-width: 768px) {
  .amenitySect__cont {
    gap: 48px;
  }
}

@media screen and (max-width: 768px) {
  .amenitySect__cont {
    gap: 40px;
  }
}

@media print, screen and (min-width: 768px) {
  .amenitySect__cont + .amenitySect__bottom {
    margin-top: 48px;
  }
}

@media screen and (max-width: 768px) {
  .amenitySect__cont + .amenitySect__bottom {
    margin-top: 40px;
  }
}

@media print, screen and (min-width: 768px) {
  .amenitySect__cont .qualityCard:nth-child(1) {
    display: grid;
    gap: 40px;
    grid-template-columns: 1fr .52364273204fr;
  }
}

@media print, screen and (min-width: 768px) {
  .amenitySect__cont .qualityCard:nth-child(1) .qualityCard__cont {
    grid-row: auto / span 2;
  }
}

@media screen and (max-width: 768px) {
  .amenitySect__cont .qualityCard:nth-child(1) .qualityCard__cont {
    margin: 0 auto 16px;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
    width: 210px;
  }
}

.amenitySect__cont .qualityCard:nth-child(1) .qualityCard__option {
  margin: 0 auto;
}

@media print, screen and (min-width: 768px) {
  .amenitySect__cont .qualityCard:nth-child(1) .qualityCard__option {
    width: 465px;
  }
}

@media screen and (max-width: 768px) {
  .amenitySect__cont .qualityCard:nth-child(1) .qualityCard__option {
    width: 210px;
  }
}

@media print, screen and (min-width: 768px) {
  .amenitySect__cont .qualityCard:nth-child(2) {
    display: grid;
    gap: 40px;
    grid-template-columns: .359375fr 1fr;
  }
}

@media print, screen and (min-width: 768px) {
  .amenitySect__cont .qualityCard:nth-child(2) .qualityCard__head {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    position: relative;
  }
  .amenitySect__cont .qualityCard:nth-child(2) .qualityCard__head:after {
    border: 1px solid #cccccc;
    content: '';
    inset: 0;
    pointer-events: none;
    position: absolute;
  }
  .amenitySect__cont .qualityCard:nth-child(2) .qualityCard__head .photo {
    position: static;
  }
  .amenitySect__cont .qualityCard:nth-child(2) .qualityCard__head .photo__capOut {
    bottom: 5px;
    right: 5px;
    top: auto;
  }
}

@media screen and (max-width: 768px) {
  .amenitySect__cont .qualityCard:nth-child(2) .qualityCard__head {
    margin-bottom: 16px;
  }
}

@media print, screen and (min-width: 768px) {
  .amenitySect__cont .qualityCard:nth-child(2) .qualityCard__cont {
    grid-column: 1 / 2;
    grid-row: 1 / 2;
  }
}

.amenitySect__bottom .usableList__inner {
  display: grid;
}

@media print, screen and (min-width: 768px) {
  .amenitySect__bottom .usableList__inner {
    gap: 60px;
    grid-template-columns: repeat(3, 1fr);
  }
}

@media screen and (max-width: 768px) {
  .amenitySect__bottom .usableList__inner {
    gap: 40px 20px;
    grid-template-columns: repeat(2, 1fr);
  }
}

@media print, screen and (min-width: 768px) {
  .balconySect {
    padding-top: 100px;
  }
}

@media screen and (max-width: 768px) {
  .balconySect {
    padding-top: 80px;
  }
}

@media print, screen and (min-width: 768px) {
  .balconySect__head + .balconySect__cont {
    margin-top: 100px;
  }
}

@media screen and (max-width: 768px) {
  .balconySect__head + .balconySect__cont {
    margin-top: 40px;
  }
}

.balconySect__cont .usableList__inner {
  display: grid;
}

@media print, screen and (min-width: 768px) {
  .balconySect__cont .usableList__inner {
    gap: 60px;
    grid-template-columns: repeat(3, 1fr);
    margin: 0 auto;
    width: 990px;
  }
}

@media screen and (max-width: 768px) {
  .balconySect__cont .usableList__inner {
    gap: 40px 20px;
    grid-template-columns: repeat(2, 1fr);
  }
}

@media print, screen and (min-width: 768px) {
  .bathSect {
    padding-top: 100px;
  }
}

@media screen and (max-width: 768px) {
  .bathSect {
    padding-top: 80px;
  }
}

@media print, screen and (min-width: 768px) {
  .bathSect__head + .bathSect__cont {
    margin-top: 100px;
  }
}

@media screen and (max-width: 768px) {
  .bathSect__head + .bathSect__cont {
    margin-top: 40px;
  }
}

.bathSect__cont .usableList__inner {
  display: grid;
}

@media print, screen and (min-width: 768px) {
  .bathSect__cont .usableList__inner {
    gap: 60px;
    grid-template-columns: repeat(3, 1fr);
    margin: 0 auto;
    width: 990px;
  }
}

@media screen and (max-width: 768px) {
  .bathSect__cont .usableList__inner {
    gap: 40px 20px;
    grid-template-columns: repeat(2, 1fr);
  }
}

@media print, screen and (min-width: 768px) {
  .commonSpaceSect {
    padding-top: 60px;
  }
}

@media screen and (max-width: 768px) {
  .commonSpaceSect {
    padding-top: 40px;
  }
}

@media print, screen and (min-width: 768px) {
  .commonSpaceSect__head + .commonSpaceSect__cont {
    margin-top: 100px;
  }
}

@media screen and (max-width: 768px) {
  .commonSpaceSect__head + .commonSpaceSect__cont {
    margin-top: 40px;
  }
}

@media print, screen and (min-width: 768px) {
  .commonSpaceSect__cont .usableList__inner {
    gap: 60px;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}

@media screen and (max-width: 768px) {
  .commonSpaceSect__cont .usableList__inner {
    gap: 40px 20px;
  }
}

@media print, screen and (min-width: 768px) {
  .commonSpaceSect__cont .usableList__item {
    width: 290px;
  }
}

@media screen and (max-width: 768px) {
  .commonSpaceSect__cont .usableList__item {
    width: 160px;
  }
}

@media print, screen and (min-width: 768px) {
  .commonSpaceSect__cont .usableList__item:nth-child(3) {
    width: 640px;
  }
}

@media screen and (max-width: 768px) {
  .commonSpaceSect__cont .usableList__item:nth-child(3) {
    width: 218px;
  }
}

@media screen and (max-width: 768px) {
  .commonSpaceSect__cont .usableList__item:nth-child(4) {
    width: 102px;
  }
}

@media print, screen and (min-width: 768px) {
  .dressingSect {
    padding-top: 100px;
  }
}

@media screen and (max-width: 768px) {
  .dressingSect {
    padding-top: 80px;
  }
}

@media print, screen and (min-width: 768px) {
  .dressingSect__head + .dressingSect__cont {
    margin-top: 100px;
  }
}

@media screen and (max-width: 768px) {
  .dressingSect__head + .dressingSect__cont {
    margin-top: 40px;
  }
}

.dressingSect__cont .usableList__inner {
  display: grid;
}

@media print, screen and (min-width: 768px) {
  .dressingSect__cont .usableList__inner {
    gap: 60px;
    grid-template-columns: repeat(3, 1fr);
    margin: 0 auto;
    width: 990px;
  }
}

@media screen and (max-width: 768px) {
  .dressingSect__cont .usableList__inner {
    gap: 40px 20px;
    grid-template-columns: repeat(2, 1fr);
  }
}

@media print, screen and (min-width: 768px) {
  .emergencySect {
    padding-top: 100px;
  }
}

@media screen and (max-width: 768px) {
  .emergencySect {
    padding-top: 80px;
  }
}

@media print, screen and (min-width: 768px) {
  .emergencySect__head + .emergencySect__cont {
    margin-top: 100px;
  }
}

@media screen and (max-width: 768px) {
  .emergencySect__head + .emergencySect__cont {
    margin-top: 40px;
  }
}

@media print, screen and (min-width: 768px) {
  .emergencySect__cont + .emergencySect__bottom {
    margin-top: 48px;
  }
}

@media screen and (max-width: 768px) {
  .emergencySect__cont + .emergencySect__bottom {
    margin-top: 40px;
  }
}

.emergencySect__cont .usableList__inner {
  display: grid;
}

@media print, screen and (min-width: 768px) {
  .emergencySect__cont .usableList__inner {
    gap: 48px;
    grid-template-columns: repeat(2, 1fr);
    margin: 0 auto;
    width: 646px;
  }
}

@media screen and (max-width: 768px) {
  .emergencySect__cont .usableList__inner {
    gap: 40px 20px;
    grid-template-columns: repeat(2, 1fr);
  }
}

.emergencySect__cont .usableList__item:nth-child(3) {
  grid-column: auto / span 2;
}

@media print, screen and (min-width: 768px) {
  .emergencySect__bottom {
    margin: 0 auto;
    width: 990px;
  }
}

.emergencySect__bottom .qualityCard {
  display: grid;
}

@media print, screen and (min-width: 768px) {
  .emergencySect__bottom .qualityCard {
    gap: 40px 48px;
    grid-template-columns: repeat(3, 1fr);
  }
}

@media screen and (max-width: 768px) {
  .emergencySect__bottom .qualityCard {
    gap: 20px;
    grid-template-columns: repeat(2, 1fr);
  }
}

@media screen and (max-width: 768px) {
  .emergencySect__bottom .qualityCard__ttl {
    text-align: center;
  }
}

@media print, screen and (min-width: 768px) {
  .emergencySect__bottom .qualityCard__head {
    grid-column: 1 / 4;
    grid-row: 1 / 2;
  }
}

.emergencySect__bottom .qualityCard__head .qualityCard__ttl {
  text-align: left;
}

.emergencySect__bottom .qualityCard__head .qualityCard__ttl + .txt {
  border-top: 1px solid #999999;
}

@media print, screen and (min-width: 768px) {
  .emergencySect__bottom .qualityCard__head .qualityCard__ttl + .txt {
    margin-top: 16px;
    padding-top: 16px;
  }
}

@media screen and (max-width: 768px) {
  .emergencySect__bottom .qualityCard__head .qualityCard__ttl + .txt {
    margin-top: 16px;
    padding-top: 16px;
  }
}

@media screen and (max-width: 768px) {
  .emergencySect__bottom .qualityCard__cont {
    display: grid;
    gap: 20px;
    grid-column: auto / span 2;
    grid-template-columns: repeat(2, 1fr);
  }
}

@media screen and (max-width: 768px) {
  .emergencySect__bottom .qualityCard__cont .qualityCard__ttl {
    grid-column: auto / span 2;
  }
}

@media screen and (max-width: 768px) {
  .emergencySect__bottom .qualityCard__cont .qualityCard__ttl + .txt {
    margin-top: 0;
  }
}

.emergencySect__bottom .qualityCard__cont .photo {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
}

@media print, screen and (min-width: 768px) {
  .emergencySect__bottom .qualityCard__cont .photo {
    margin-top: 24px;
  }
}

@media screen and (max-width: 768px) {
  .emergencySect__bottom .qualityCard__cont .photo {
    grid-column: 1 / 2;
    grid-row: 2 / 3;
  }
}

@media screen and (max-width: 768px) {
  .emergencySect__bottom .qualityCard__option {
    grid-column: auto / span 2;
  }
}

@media print, screen and (min-width: 768px) {
  .emergencySect__bottom .qualityCard__option .txt + * {
    margin-top: 24px;
  }
}

@media screen and (max-width: 768px) {
  .emergencySect__bottom .qualityCard__option .txt + * {
    margin-top: 24px;
  }
}

.emergencySect__bottom .qualityCard__option .photo:after {
  border: 1px solid #cccccc;
  content: '';
  inset: 0;
  position: absolute;
  pointer-events: none;
}

@media print, screen and (min-width: 768px) {
  .emergencySect__bottom .qualityCard__option .photo + .caption {
    margin-top: 10px;
  }
}

@media screen and (max-width: 768px) {
  .emergencySect__bottom .qualityCard__option .photo + .caption {
    margin-top: 24px;
  }
}

@media print, screen and (min-width: 768px) {
  .kitchenSect {
    padding-top: 60px;
  }
}

@media screen and (max-width: 768px) {
  .kitchenSect {
    padding-top: 40px;
  }
}

@media print, screen and (min-width: 768px) {
  .kitchenSect__head + .kitchenSect__cont {
    margin-top: 100px;
  }
}

@media screen and (max-width: 768px) {
  .kitchenSect__head + .kitchenSect__cont {
    margin-top: 40px;
  }
}

@media print, screen and (min-width: 768px) {
  .kitchenSect__cont + .kitchenSect__bottom {
    margin-top: 48px;
  }
}

@media screen and (max-width: 768px) {
  .kitchenSect__cont + .kitchenSect__bottom {
    margin-top: 40px;
  }
}

.kitchenSect__cont .usableList__inner {
  display: grid;
}

@media print, screen and (min-width: 768px) {
  .kitchenSect__cont .usableList__inner {
    gap: 60px;
    grid-template-columns: repeat(3, 1fr);
    margin: 0 auto;
    width: 990px;
  }
}

@media screen and (max-width: 768px) {
  .kitchenSect__cont .usableList__inner {
    gap: 40px 20px;
    grid-template-columns: repeat(2, 1fr);
  }
}

@media print, screen and (min-width: 768px) {
  .kitchenSect__bottom {
    display: grid;
    gap: 60px;
    grid-template-columns: repeat(2, 1fr);
    margin: 0 auto;
    width: 990px;
  }
}

@media screen and (max-width: 768px) {
  .kitchenSect__bottom .qualityCard__ttl {
    text-align: center;
  }
}

.kitchenSect__bottom .qualityCard__ttl .label {
  background-color: #887855;
  color: #ffffff;
  display: block;
  line-height: 1;
  margin-bottom: 24px;
  text-align: center;
}

@media print, screen and (min-width: 768px) {
  .kitchenSect__bottom .qualityCard__ttl .label {
    font-size: 12px;
    padding: 8px 16px;
  }
}

@media screen and (max-width: 768px) {
  .kitchenSect__bottom .qualityCard__ttl .label {
    font-size: 12px;
    padding: 8px 16px;
  }
}

.kitchenSect__bottom .qualityCard__cont {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}

@media print, screen and (min-width: 768px) {
  .kitchenSect__bottom .qualityCard__cont {
    gap: 24px;
  }
}

@media screen and (max-width: 768px) {
  .kitchenSect__bottom .qualityCard__cont {
    gap: 20px;
  }
}

.kitchenSect__bottom .qualityCard__visual {
  position: relative;
}

.kitchenSect__bottom .qualityCard__visual .ttl {
  background-color: #231815;
  color: #ffffff;
  letter-spacing: .1em;
  text-align: center;
  width: 100%;
}

@media print, screen and (min-width: 768px) {
  .kitchenSect__bottom .qualityCard__visual .ttl {
    bottom: 0;
    font-size: 12px;
    left: 0;
    line-height: 1;
    padding: 8px 0;
    position: absolute;
  }
}

@media screen and (max-width: 768px) {
  .kitchenSect__bottom .qualityCard__visual .ttl {
    line-height: 1.6;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    font-size: 12px;
    height: calc(100% - 93px);
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding: 8px;
  }
  .kitchenSect__bottom .qualityCard__visual .ttl:before {
    content: '';
    margin-top: calc((1 - 1.6) * .5em);
  }
  .kitchenSect__bottom .qualityCard__visual .ttl:after {
    margin-bottom: calc((1 - 1.6) * .5em);
  }
  .kitchenSect__bottom .qualityCard__visual .ttl:before, .kitchenSect__bottom .qualityCard__visual .ttl:after {
    content: '';
    display: block;
    height: 0;
    width: 0;
  }
}

.kitchenSect__bottom .qualityCard__visual .ttl .small {
  font-size: 10px;
}

@media print, screen and (min-width: 768px) {
  .lavatorySect {
    margin: 0 auto;
    padding-top: 100px;
    width: 990px;
  }
}

@media screen and (max-width: 768px) {
  .lavatorySect {
    padding-top: 80px;
  }
}

@media print, screen and (min-width: 768px) {
  .lavatorySect__head + .lavatorySect__cont {
    margin-top: 100px;
  }
}

@media screen and (max-width: 768px) {
  .lavatorySect__head + .lavatorySect__cont {
    margin-top: 40px;
  }
}

.lavatorySect__cont {
  display: grid;
}

@media print, screen and (min-width: 768px) {
  .lavatorySect__cont {
    gap: 48px 60px;
    grid-template-columns: repeat(3, 1fr);
  }
}

@media screen and (max-width: 768px) {
  .lavatorySect__cont {
    gap: 20px;
    grid-template-columns: repeat(2, 1fr);
  }
}

@media print, screen and (min-width: 768px) {
  .lavatorySect__cont .qualityCard:nth-child(1) {
    display: grid;
    gap: 60px;
    grid-column: auto / span 3;
    grid-template-columns: .453125fr 1fr;
  }
}

@media screen and (max-width: 768px) {
  .lavatorySect__cont .qualityCard:nth-child(1) {
    grid-column: auto / span 2;
  }
}

@media screen and (max-width: 768px) {
  .lavatorySect__cont .qualityCard:nth-child(1) .qualityCard__head {
    margin: 0 auto;
    width: 210px;
  }
}

@media print, screen and (min-width: 768px) {
  .lavatorySect__cont .qualityCard__ttl {
    text-align: left;
  }
}

.lavatorySect__cont .qualityCard__label {
  display: grid;
}

@media print, screen and (min-width: 768px) {
  .lavatorySect__cont .qualityCard__label {
    gap: 24px;
    grid-template-columns: repeat(3, 1fr);
    margin-top: 24px;
  }
}

@media screen and (max-width: 768px) {
  .lavatorySect__cont .qualityCard__label {
    gap: 6px;
    grid-template-columns: repeat(2, 1fr);
    margin-top: 24px;
  }
}

.lavatorySect__cont .qualityCard__label .item {
  background-color: #ffffff;
  color: #231815;
  letter-spacing: .1em;
  line-height: 1;
  text-align: center;
}

@media print, screen and (min-width: 768px) {
  .lavatorySect__cont .qualityCard__label .item {
    font-size: 14px;
    padding: 16px 8px;
  }
}

@media screen and (max-width: 768px) {
  .lavatorySect__cont .qualityCard__label .item {
    font-size: 10px;
    padding: 8px 0;
  }
}

.lavatorySect__cont .qualityCard__visual {
  height: 100%;
}

.lavatorySect__cont .qualityCard__visual .ttl {
  line-height: 1.6;
  background: -webkit-gradient(linear, left top, right top, from(#686767), to(rgba(104, 103, 103, 0.2)));
  background: linear-gradient(90deg, #686767 0%, rgba(104, 103, 103, 0.2) 100%);
  color: #ffffff;
  display: block;
  letter-spacing: .1em;
}

.lavatorySect__cont .qualityCard__visual .ttl:before {
  content: '';
  margin-top: calc((1 - 1.6) * .5em);
}

.lavatorySect__cont .qualityCard__visual .ttl:after {
  margin-bottom: calc((1 - 1.6) * .5em);
}

.lavatorySect__cont .qualityCard__visual .ttl:before, .lavatorySect__cont .qualityCard__visual .ttl:after {
  content: '';
  display: block;
  height: 0;
  width: 0;
}

@media print, screen and (min-width: 768px) {
  .lavatorySect__cont .qualityCard__visual .ttl {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 16px;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding: 16px 8px;
  }
}

@media screen and (max-width: 768px) {
  .lavatorySect__cont .qualityCard__visual .ttl {
    font-size: 13px;
    height: calc(100% - 128px);
    padding: 8px;
  }
}

@media print, screen and (min-width: 768px) {
  .originalSect {
    padding-top: 100px;
  }
}

@media screen and (max-width: 768px) {
  .originalSect {
    padding-top: 80px;
  }
}

.originalSect__head {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

@media print, screen and (min-width: 768px) {
  .originalSect__head {
    gap: 60px;
  }
}

@media screen and (max-width: 768px) {
  .originalSect__head {
    gap: 40px;
  }
}

@media print, screen and (min-width: 768px) {
  .originalSect__head + .originalSect__cont {
    margin-top: 100px;
  }
}

@media screen and (max-width: 768px) {
  .originalSect__head + .originalSect__cont {
    margin-top: 40px;
  }
}

@media print, screen and (min-width: 768px) {
  .originalSect__cont .usableList__inner {
    gap: 60px;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}

@media screen and (max-width: 768px) {
  .originalSect__cont .usableList__inner {
    display: grid;
    gap: 40px 20px;
    grid-template-columns: repeat(2, 1fr);
  }
}

@media print, screen and (min-width: 768px) {
  .originalSect__cont .qualityCard {
    width: 290px;
  }
}

.originalSect__cont .qualityCard .txt .label {
  background-color: #ffffff;
  color: #231815;
  display: block;
  letter-spacing: .1em;
  line-height: 1;
  text-align: center;
}

@media print, screen and (min-width: 768px) {
  .originalSect__cont .qualityCard .txt .label {
    font-size: 12px;
    margin-top: 24px;
    padding: 8px;
  }
}

@media screen and (max-width: 768px) {
  .originalSect__cont .qualityCard .txt .label {
    font-size: 12px;
    margin-top: 24px;
    padding: 8px;
  }
}

.qualityHero {
  width: calc(100vw - var(--scrollbar));
  position: relative;
}

@media print, screen and (min-width: 768px) {
  .qualityHero {
    margin-left: calc((100% - 100vw + var(--scrollbar)) / 2);
  }
}

@media only screen and (min-width: 768px) and (max-width: 1200px) {
  .qualityHero {
    margin-left: -20px;
    width: calc(100% + 40px);
  }
}

@media screen and (max-width: 768px) {
  .qualityHero {
    margin-left: -32px;
  }
}

.qualityHero__ttl {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #ffffff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  inset: 0;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: absolute;
  text-align: center;
  z-index: 1;
}

@media print, screen and (min-width: 768px) {
  .qualityHero__ttl {
    gap: 24px;
  }
}

@media screen and (max-width: 768px) {
  .qualityHero__ttl {
    gap: 24px;
  }
}

.qualityHero__ttl .en {
  font-family: "EB Garamond", serif;
  letter-spacing: .05em;
  line-height: .7;
}

@media print, screen and (min-width: 768px) {
  .qualityHero__ttl .en {
    font-size: 24px;
  }
}

@media screen and (max-width: 768px) {
  .qualityHero__ttl .en {
    font-size: 24px;
  }
}

.qualityHero__ttl .ja {
  line-height: 2;
  letter-spacing: .01em;
}

.qualityHero__ttl .ja:before {
  content: '';
  margin-top: calc((1 - 2) * .5em);
}

.qualityHero__ttl .ja:after {
  margin-bottom: calc((1 - 2) * .5em);
}

.qualityHero__ttl .ja:before, .qualityHero__ttl .ja:after {
  content: '';
  display: block;
  height: 0;
  width: 0;
}

@media print, screen and (min-width: 768px) {
  .qualityHero__ttl .ja {
    font-size: 16px;
  }
}

@media screen and (max-width: 768px) {
  .qualityHero__ttl .ja {
    font-size: 14px;
  }
}

@media print, screen and (min-width: 768px) {
  .qualitySect__head + .qualitySect__cont {
    margin-top: 100px;
  }
}

@media screen and (max-width: 768px) {
  .qualitySect__head + .qualitySect__cont {
    margin-top: 80px;
  }
}

@media screen and (max-width: 768px) {
  .qualitySect__body {
    margin: 0 -7px;
  }
}

@media print, screen and (min-width: 768px) {
  .savingSect {
    padding-top: 100px;
    margin: 0 auto;
    width: 990px;
  }
}

@media screen and (max-width: 768px) {
  .savingSect {
    padding-top: 80px;
  }
}

.savingSect__head {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

@media print, screen and (min-width: 768px) {
  .savingSect__head {
    gap: 60px;
  }
}

@media screen and (max-width: 768px) {
  .savingSect__head {
    gap: 40px;
  }
}

@media print, screen and (min-width: 768px) {
  .savingSect__head + .savingSect__cont {
    margin-top: 100px;
  }
}

@media screen and (max-width: 768px) {
  .savingSect__head + .savingSect__cont {
    margin-top: 40px;
  }
}

@media print, screen and (min-width: 768px) {
  .savingSect__cont {
    display: grid;
    gap: 60px;
    grid-template-columns: repeat(2, 1fr);
  }
}

@media screen and (max-width: 768px) {
  .savingSect__cont {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 40px;
  }
}

@media print, screen and (min-width: 768px) {
  .savingSect__cont + .savingSect__bottom {
    margin-top: 48px;
  }
}

@media screen and (max-width: 768px) {
  .savingSect__cont + .savingSect__bottom {
    margin-top: 40px;
  }
}

.savingSect__cont .qualityCard:nth-child(1) .qualityCard__visual {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

@media print, screen and (min-width: 768px) {
  .savingSect__cont .qualityCard:nth-child(1) .qualityCard__visual {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 24px;
  }
}

@media screen and (max-width: 768px) {
  .savingSect__cont .qualityCard:nth-child(1) .qualityCard__visual {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 24px;
  }
}

@media print, screen and (min-width: 768px) {
  .savingSect__cont .qualityCard:nth-child(1) .qualityCard__visual .photo:nth-child(1) {
    width: 80px;
  }
}

@media screen and (max-width: 768px) {
  .savingSect__cont .qualityCard:nth-child(1) .qualityCard__visual .photo:nth-child(1) {
    width: 130px;
  }
}

@media print, screen and (min-width: 768px) {
  .savingSect__cont .qualityCard:nth-child(1) .qualityCard__visual .photo:nth-child(2) {
    width: 281px;
  }
}

.savingSect__cont .qualityCard:nth-child(2) {
  position: relative;
}

.savingSect__cont .qualityCard:nth-child(2) .qualityCard__head .photo {
  position: static;
}

@media print, screen and (min-width: 768px) {
  .savingSect__cont .qualityCard__ttl {
    text-align: left;
  }
}

@media print, screen and (min-width: 768px) {
  .savingSect__bottom .usableList + .caption {
    margin-top: 100px;
  }
}

@media screen and (max-width: 768px) {
  .savingSect__bottom .usableList + .caption {
    margin-top: 40px;
  }
}

.savingSect__bottom .usableList__inner {
  display: grid;
}

@media print, screen and (min-width: 768px) {
  .savingSect__bottom .usableList__inner {
    gap: 60px;
    grid-template-columns: repeat(3, 1fr);
  }
}

@media screen and (max-width: 768px) {
  .savingSect__bottom .usableList__inner {
    gap: 40px 20px;
    grid-template-columns: repeat(2, 1fr);
  }
}

@media print, screen and (min-width: 768px) {
  .securitySect {
    margin: 0 auto;
    padding-top: 60px;
    width: 990px;
  }
}

@media screen and (max-width: 768px) {
  .securitySect {
    padding-top: 40px;
  }
}

@media print, screen and (min-width: 768px) {
  .securitySect__head + .securitySect__cont {
    margin-top: 100px;
  }
}

@media screen and (max-width: 768px) {
  .securitySect__head + .securitySect__cont {
    margin-top: 40px;
  }
}

.securitySect__cont {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

@media print, screen and (min-width: 768px) {
  .securitySect__cont {
    gap: 48px;
  }
}

@media screen and (max-width: 768px) {
  .securitySect__cont {
    gap: 40px;
  }
}

.securitySect__cont .qualityCard:nth-child(1) {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}

@media print, screen and (min-width: 768px) {
  .securitySect__cont .qualityCard:nth-child(1) {
    gap: 48px 60px;
    margin: 0 auto;
    width: 640px;
  }
}

@media screen and (max-width: 768px) {
  .securitySect__cont .qualityCard:nth-child(1) {
    gap: 24px 20px;
  }
}

@media print, screen and (min-width: 768px) {
  .securitySect__cont .qualityCard:nth-child(1) .qualityCard__head {
    grid-row: auto / span 2;
  }
}

@media print, screen and (min-width: 768px) {
  .securitySect__cont .qualityCard:nth-child(1) .qualityCard__cont {
    grid-column: auto / span 2;
    grid-row: 1 / 2;
  }
}

@media print, screen and (min-width: 768px) {
  .securitySect__cont .qualityCard:nth-child(1) .qualityCard__cont .qualityCard__ttl + .txt {
    border-top: 1px solid #999999;
    margin-top: 16px;
    padding-top: 16px;
  }
}

.securitySect__cont .qualityCard:nth-child(1) .qualityCard__ttl {
  text-align: left;
}

@media screen and (max-width: 768px) {
  .securitySect__cont .qualityCard:nth-child(1) .qualityCard__option {
    grid-column: auto / span 2;
  }
}

@media print, screen and (min-width: 768px) {
  .securitySect__cont .qualityCard:nth-child(1) .qualityCard__option .qualityCard__visual + * {
    margin-top: 24px;
  }
}

@media screen and (max-width: 768px) {
  .securitySect__cont .qualityCard:nth-child(1) .qualityCard__option .qualityCard__visual + * {
    margin-top: 24px;
  }
}

.securitySect__cont .qualityCard:nth-child(1) .qualityCard__option .qualityCard__visual .photo__capIn {
  bottom: 0;
}

.securitySect__cont .qualityCard:nth-child(1) .qualityCard__visual {
  grid-column: auto / span 2;
}

@media print, screen and (min-width: 768px) {
  .securitySect__cont .qualityCard:nth-child(2) {
    display: grid;
    gap: 24px;
    grid-template-columns: .375fr 1fr;
  }
}

@media print, screen and (min-width: 768px) {
  .securitySect__cont .qualityCard:nth-child(2) .qualityCard__head {
    grid-column: auto / span 2;
  }
}

@media print, screen and (min-width: 768px) {
  .securitySect__cont .qualityCard:nth-child(2) .qualityCard__cont {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 0 24px;
  }
}

@media screen and (max-width: 768px) {
  .securitySect__cont .qualityCard:nth-child(2) .qualityCard__cont {
    display: grid;
    gap: 0 24px;
    grid-template-columns: 1.76fr 1fr;
  }
}

@media screen and (max-width: 768px) {
  .securitySect__cont .qualityCard:nth-child(2) .qualityCard__cont .qualityCard__ttl {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

@media print, screen and (min-width: 768px) {
  .securitySect__cont .qualityCard:nth-child(2) .qualityCard__cont .photo {
    width: 96px;
  }
}

.securitySect__cont .qualityCard:nth-child(2) .qualityCard__cont .photo__capIn {
  bottom: 0;
}

@media screen and (max-width: 768px) {
  .securitySect__cont .qualityCard:nth-child(2) .qualityCard__cont .txt {
    grid-column: auto / span 2;
    grid-row: 2 / 3;
  }
}

.securitySect__cont .qualityCard:nth-child(2) .qualityCard__visual {
  position: relative;
}

.securitySect__cont .qualityCard:nth-child(2) .qualityCard__visual:after {
  border: 1px solid #cccccc;
  content: '';
  inset: 0;
  position: absolute;
  pointer-events: none;
}

@media print, screen and (min-width: 768px) {
  .securitySect__cont .qualityCard:nth-child(2) .qualityCard__option {
    grid-column: auto / span 2;
  }
}

.securitySect__bottom {
  display: grid;
}

@media print, screen and (min-width: 768px) {
  .securitySect__bottom {
    gap: 60px;
    grid-template-columns: repeat(3, 1fr);
    margin-top: 48px;
  }
}

@media screen and (max-width: 768px) {
  .securitySect__bottom {
    gap: 40px 20px;
    grid-template-columns: repeat(2, 1fr);
    margin-top: 40px;
  }
}

@media print, screen and (min-width: 768px) {
  .storageSect {
    padding-top: 100px;
  }
}

@media screen and (max-width: 768px) {
  .storageSect {
    padding-top: 80px;
  }
}

@media print, screen and (min-width: 768px) {
  .storageSect__head + .storageSect__cont {
    margin-top: 100px;
  }
}

@media screen and (max-width: 768px) {
  .storageSect__head + .storageSect__cont {
    margin-top: 40px;
  }
}

.storageSect__cont {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

@media print, screen and (min-width: 768px) {
  .storageSect__cont {
    gap: 48px;
  }
}

@media screen and (max-width: 768px) {
  .storageSect__cont {
    gap: 40px;
  }
}

.storageSect__cont .qualityCard {
  display: grid;
}

@media print, screen and (min-width: 768px) {
  .storageSect__cont .qualityCard {
    gap: 16px 40px;
    grid-template-columns: .8245614035fr 1fr;
    padding-bottom: 0;
    width: 640px;
  }
}

@media screen and (max-width: 768px) {
  .storageSect__cont .qualityCard {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media print, screen and (min-width: 768px) {
  .storageSect__cont .qualityCard:nth-child(1) .qualityCard__cont {
    grid-column: 1 / 2;
    grid-row: 1 / 4;
    margin: -40px 0 0 -40px;
  }
}

@media screen and (max-width: 768px) {
  .storageSect__cont .qualityCard:nth-child(1) .qualityCard__cont {
    margin-left: -20px;
  }
}

.storageSect__cont .qualityCard:nth-child(1) .qualityCard__visual {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}

@media print, screen and (min-width: 768px) {
  .storageSect__cont .qualityCard:nth-child(1) .qualityCard__visual {
    gap: 24px;
  }
}

@media screen and (max-width: 768px) {
  .storageSect__cont .qualityCard:nth-child(1) .qualityCard__visual {
    gap: 20px;
  }
}

.storageSect__cont .qualityCard:nth-child(1) .qualityCard__visual .photo__capIn {
  bottom: -3px;
}

@media print, screen and (min-width: 768px) {
  .storageSect__cont .qualityCard:nth-child(1) .qualityCard__visual .photo__capIn {
    left: 0;
    right: auto;
  }
}

@media print, screen and (min-width: 768px) {
  .storageSect__cont .qualityCard:nth-child(2) {
    grid-template-columns: 1fr .8245614035fr;
  }
}

@media print, screen and (min-width: 768px) {
  .storageSect__cont .qualityCard:nth-child(2) .qualityCard__cont {
    grid-column: 2 / 3;
    grid-row: 1 / 4;
    margin: -40px -40px 0 0;
  }
}

@media screen and (max-width: 768px) {
  .storageSect__cont .qualityCard:nth-child(2) .qualityCard__cont {
    grid-column: 2 / 3;
    grid-row: 2 / 3;
    margin: 0 -20px -24px 0;
  }
}

@media screen and (max-width: 768px) {
  .storageSect__cont .qualityCard:nth-child(2) .qualityCard__visual {
    gap: 20px;
  }
}

@media print, screen and (min-width: 768px) {
  .storageSect__cont .qualityCard:nth-child(2) .qualityCard__visual .photo__capOut {
    padding-right: 10px;
  }
}

@media screen and (max-width: 768px) {
  .storageSect__cont .qualityCard__head {
    grid-column: auto / span 2;
  }
}

@media screen and (max-width: 768px) {
  .storageSect__cont .qualityCard__visual + .caption {
    margin-top: auto;
  }
}

.storageSect__cont .qualityCard__option {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

@media print, screen and (min-width: 768px) {
  .storageSect__cont .qualityCard__option {
    gap: 24px;
  }
}

@media screen and (max-width: 768px) {
  .storageSect__cont .qualityCard__option {
    gap: 24px;
  }
}

@media print, screen and (min-width: 768px) {
  .storageSect__cont .qualityCard__list .item + .item {
    margin-top: 16px;
  }
}

@media screen and (max-width: 768px) {
  .storageSect__cont .qualityCard__list .item + .item {
    margin-top: 24px;
  }
}

@media screen and (max-width: 768px) {
  .storageSect__cont .qualityCard__list + .qualityCard__option {
    grid-column: auto / span 2;
  }
}

.storageSect__cont .qualityCard__list .ttl {
  line-height: 2;
  display: block;
  letter-spacing: .1em;
}

.storageSect__cont .qualityCard__list .ttl:before {
  content: '';
  margin-top: calc((1 - 2) * .5em);
}

.storageSect__cont .qualityCard__list .ttl:after {
  margin-bottom: calc((1 - 2) * .5em);
}

.storageSect__cont .qualityCard__list .ttl:before, .storageSect__cont .qualityCard__list .ttl:after {
  content: '';
  display: block;
  height: 0;
  width: 0;
}

@media print, screen and (min-width: 768px) {
  .storageSect__cont .qualityCard__list .ttl {
    font-size: 14px;
  }
}

@media screen and (max-width: 768px) {
  .storageSect__cont .qualityCard__list .ttl {
    font-size: 14px;
  }
}

.storageSect__cont .qualityCard__list .cont {
  line-height: 2;
  display: block;
  letter-spacing: .1em;
}

.storageSect__cont .qualityCard__list .cont:before {
  content: '';
  margin-top: calc((1 - 2) * .5em);
}

.storageSect__cont .qualityCard__list .cont:after {
  margin-bottom: calc((1 - 2) * .5em);
}

.storageSect__cont .qualityCard__list .cont:before, .storageSect__cont .qualityCard__list .cont:after {
  content: '';
  display: block;
  height: 0;
  width: 0;
}

@media print, screen and (min-width: 768px) {
  .storageSect__cont .qualityCard__list .cont {
    font-size: 12px;
    margin-top: 16px;
  }
}

@media screen and (max-width: 768px) {
  .storageSect__cont .qualityCard__list .cont {
    font-size: 12px;
    margin-top: 24px;
  }
}

@media print, screen and (min-width: 768px) {
  .structureSect {
    margin: 0 auto;
    width: 990px;
  }
}

@media print, screen and (min-width: 768px) {
  .structureSect__head + .structureSect__cont {
    margin-top: 100px;
  }
}

@media screen and (max-width: 768px) {
  .structureSect__head + .structureSect__cont {
    margin-top: 40px;
  }
}

@media print, screen and (min-width: 768px) {
  .structureSect__cont .usableList__inner {
    gap: 48px;
  }
}

@media screen and (max-width: 768px) {
  .structureSect__cont .usableList__inner {
    display: grid;
    gap: 40px 20px;
    grid-template-columns: repeat(2, 1fr);
  }
}

@media print, screen and (min-width: 768px) {
  .structureSect__cont .usableList__item {
    width: 290px;
  }
}

@media print, screen and (min-width: 768px) {
  .structureSect__cont .usableList__item:nth-child(1), .structureSect__cont .usableList__item:nth-child(2), .structureSect__cont .usableList__item:nth-child(5), .structureSect__cont .usableList__item:nth-child(6) {
    width: 464px;
  }
}

@media screen and (max-width: 768px) {
  .structureSect__cont .usableList__item:nth-child(1), .structureSect__cont .usableList__item:nth-child(2), .structureSect__cont .usableList__item:nth-child(5), .structureSect__cont .usableList__item:nth-child(6) {
    grid-column: auto / span 2;
  }
}

@media screen and (max-width: 768px) {
  .structureSect__cont .usableList__item:nth-child(3) {
    grid-column: auto / span 2;
  }
}

@media screen and (max-width: 768px) {
  .structureSect__cont .usableList__item:nth-child(3) .qualityCard {
    display: grid;
    gap: 24px;
    grid-template-columns: repeat(2, 1fr);
  }
}

@media print, screen and (min-width: 768px) {
  .structureSect__cont .usableList__item:nth-child(4) {
    width: 651px;
  }
}

@media screen and (max-width: 768px) {
  .structureSect__cont .usableList__item:nth-child(4) {
    grid-column: auto / span 2;
  }
}

@media print, screen and (min-width: 768px) {
  .sustainableFeature .qualitySect__intro .usableList {
    margin-top: 100px;
  }
}

@media screen and (max-width: 768px) {
  .sustainableFeature .qualitySect__intro .usableList {
    margin-top: 40px;
  }
}

.sustainableFeature .qualitySect__intro .usableList__inner {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

@media print, screen and (min-width: 768px) {
  .sustainableFeature .qualitySect__intro .usableList__inner {
    gap: 48px;
  }
}

@media screen and (max-width: 768px) {
  .sustainableFeature .qualitySect__intro .usableList__inner {
    gap: 40px;
  }
}

@media print, screen and (min-width: 768px) {
  .sustainableFeature .qualitySect__intro .usableList__item:nth-child(1) {
    width: 617px;
  }
}

@media print, screen and (min-width: 768px) {
  .sustainableFeature .qualitySect__intro .usableList__item:nth-child(2) {
    width: 327px;
  }
}

@media screen and (max-width: 768px) {
  .sustainableFeature .qualitySect__intro .usableList__item:nth-child(2) {
    width: 268px;
  }
}

.contentBG:after {
  background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0.2)));
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
  content: '';
  inset: 0;
  position: absolute;
  z-index: 1;
}

.quality-select {
  color: #ffffff;
}

@media print, screen and (min-width: 768px) {
  .quality-select {
    padding: 100px 0;
  }
}

@media screen and (max-width: 768px) {
  .quality-select {
    padding: 48px 0 100px;
  }
}
