@charset "UTF-8";
body > main {
  background: #f7f7f7;
}
body > main.index {
  background: #fff;
}
body > main a {
  display: inline-block;
  color: #000;
  transition: opacity 0.3s;
}
body > main a:hover {
  opacity: 0.7;
}
body > main .pagetitle {
  padding: calc(64 / 750 * 100vw) calc(10 / 750 * 100vw) calc(35 / 750 * 100vw);
  text-align: center;
  color: #727171;
}
body > main .pagetitle > p {
  font-family: "Cormorant Garamond", serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 600;
  font-size: calc(24 / 750 * 100vw);
  line-height: 1;
  letter-spacing: calc(25em / 1000);
}
body > main .pagetitle > h2 {
  margin: calc(6 / 750 * 100vw) 0 0;
  font-family: "Cormorant Garamond", serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 400;
  font-size: calc(60 / 750 * 100vw);
  line-height: calc(70 / 750 * 100vw);
  letter-spacing: calc(25em / 1000);
}
body > main .pagetitle > h2 span {
  vertical-align: 0.23em;
  line-height: 0;
}
body > main .pagetitle > h2 span.plus {
  vertical-align: 0.15em;
}
body > main .pagetitle > h2 span.roman {
  vertical-align: -0.05em;
  font-size: 90%;
  padding-left: 0.05em;
}
body > main > section {
  width: 100%;
  margin: calc(40 / 750 * 100vw) 0 0;
  background: #fff;
}

#items {
  width: 100%;
  margin: 0;
  text-align: center;
}
#items > h3 {
  margin: calc(53 / 750 * 100vw) 0;
  font-family: "Cormorant Garamond", serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 400;
  font-size: calc(60 / 750 * 100vw);
  line-height: 1;
  letter-spacing: calc(25em / 1000);
  color: #727171;
}
#items > ul {
  display: flex;
  flex-wrap: wrap;
  gap: calc(30 / 750 * 100vw) calc(6 / 750 * 100vw);
  width: calc(700 / 750 * 100vw);
  margin: 0 auto;
}
#items > ul > li {
  display: grid;
  width: calc(347 / 750 * 100vw);
}
#items > ul > li > a {
  padding: 0 0 calc(23 / 750 * 100vw);
  background: #f7f7f7;
}
#items > ul > li > a > figure {
  aspect-ratio: 450/470;
  overflow: hidden;
}
#items > ul > li > a > figure > img {
  transform-origin: center;
  transition: transform 0.8s;
}
#items > ul > li > a:hover {
  opacity: 1;
}
#items > ul > li > a:hover > figure > img {
  transform: scale(1.07);
}
#items > ul > li > a > hgroup {
  margin: calc(27 / 750 * 100vw) auto 0;
}
#items > ul > li > a > hgroup > h4 {
  font-weight: 400;
  font-size: calc(24 / 750 * 100vw);
  line-height: calc(26 / 750 * 100vw);
  letter-spacing: calc(100em / 1000);
}
#items > ul > li > a > hgroup > p {
  margin: calc(18 / 750 * 100vw) auto 0;
  font-size: calc(20 / 750 * 100vw);
  line-height: calc(26 / 750 * 100vw);
  letter-spacing: calc(100em / 1000);
  text-align: center;
}
#items > ul > li > a > p {
  margin: calc(26 / 750 * 100vw) auto 0;
  font-weight: 300;
  font-size: calc(20 / 750 * 100vw);
  line-height: calc(36 / 750 * 100vw);
  letter-spacing: calc(50em / 1000);
  text-align: center;
}
#items.lower {
  margin: calc(80 / 750 * 100vw) 0 0;
  padding: calc(76 / 750 * 100vw) 0 0;
}
#items.lower > h3 {
  margin: 0 0 calc(53 / 750 * 100vw);
  font-size: calc(40 / 750 * 100vw);
}
#items.lower > h3 > span {
  display: block;
  margin: calc(14 / 750 * 100vw) 0 0;
  font-size: calc(24 / 750 * 100vw);
  line-height: calc(36 / 750 * 100vw);
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
}

#details {
  display: grid;
  grid-template: auto auto/auto;
  margin: 0 auto;
  padding: calc(39 / 750 * 100vw) calc(65 / 750 * 100vw) calc(80 / 750 * 100vw);
}
#details .splide {
  grid-row: 1/2;
  grid-column: 1/2;
  width: calc(530 / 750 * 100vw);
  height: calc(563 / 750 * 100vw);
  margin: 0 auto;
}
#details .splide:not(.is-overflow) .splide__arrows, #details .splide:not(.is-overflow) .splide__pagination {
  display: none;
}
#details .splide .splide__slide.newprod {
  position: relative;
}
#details .splide .splide__slide.newprod::after {
  content: "新製品";
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: calc(17 / 750 * 100vw);
  left: 0;
  width: calc(120 / 750 * 100vw);
  height: calc(38 / 750 * 100vw);
  padding-bottom: calc(3 / 750 * 100vw);
  font-size: calc(28 / 750 * 100vw);
  line-height: 1;
  color: #fff;
  background: #d7000f;
}
#details .splide .splide__arrows {
  display: flex;
  justify-content: space-between;
  width: calc(100% + 90 / 750 * 100vw);
  position: absolute;
  inset: 33.9333333333vw calc(-45 / 750 * 100vw) auto;
  z-index: 1;
  pointer-events: none;
}
#details .splide .splide__arrows .splide__arrow {
  appearance: none;
  width: calc(21 / 750 * 100vw);
  height: calc(21 / 750 * 100vw);
  line-height: 0;
  border: none;
  background: transparent;
  pointer-events: auto;
}
#details .splide .splide__arrows .splide__arrow.splide__arrow--next > svg {
  transform: scale(-1, 1);
}
#details .splide .splide__pagination {
  list-style: none;
  display: flex;
  justify-content: center;
  gap: 0 calc(30 / 750 * 100vw);
  width: fit-content;
  margin: calc(21 / 750 * 100vw) auto 0;
}
#details .splide .splide__pagination > li {
  line-height: 0;
}
#details .splide .splide__pagination > li .splide__pagination__page {
  appearance: none;
  width: calc(12 / 750 * 100vw);
  height: calc(12 / 750 * 100vw);
  line-height: 0;
  border: none;
  background: #b3b3b3;
  border-radius: 50%;
  transition: background-color 0.3s;
}
#details .splide .splide__pagination > li .splide__pagination__page.is-active {
  background: #464646;
}
#details .spec {
  grid-row: 2/3;
  grid-column: 1/2;
  width: 100%;
}
#details .spec > hgroup {
  width: fit-content;
  margin: calc(47 / 750 * 100vw) auto 0;
}
#details .spec > hgroup > h3 {
  width: fit-content;
  margin: 0 auto;
  font-weight: 400;
  font-size: calc(32 / 750 * 100vw);
  line-height: 1;
}
#details .spec > hgroup > h3 > small {
  font-size: 80%;
}
#details .spec > hgroup > p {
  width: fit-content;
  margin: calc(19 / 750 * 100vw) auto 0;
  font-weight: 400;
  font-size: calc(28 / 750 * 100vw);
  line-height: 1;
}
#details .spec > p {
  font-size: calc(24 / 750 * 100vw);
  line-height: calc(46 / 750 * 100vw);
  letter-spacing: calc(150em / 1000);
}
#details .spec > p.price {
  width: fit-content;
  margin: calc(20 / 750 * 100vw) auto 0;
  font-size: calc(24 / 750 * 100vw);
  line-height: calc(40 / 750 * 100vw);
  letter-spacing: calc(50em / 1000);
  text-align: center;
}
#details .spec > p.salon {
  width: fit-content;
  margin: calc(52 / 750 * 100vw) auto 0;
}
#details .spec > p.salon > a {
  display: block;
  width: fit-content;
  margin: 0 auto;
  padding: 0 calc(4 / 750 * 100vw) calc(14 / 750 * 100vw);
  font-weight: 400;
  font-size: calc(26 / 750 * 100vw);
  line-height: 1;
  letter-spacing: calc(150em / 1000);
  border-bottom: calc(2 / 750 * 100vw) solid #000;
}
#details .spec > h4 {
  margin: calc(46 / 750 * 100vw) 0 calc(4 / 750 * 100vw);
  font-weight: 500;
  font-size: calc(28 / 750 * 100vw);
  line-height: calc(45 / 750 * 100vw);
  letter-spacing: calc(150em / 1000);
}
#details .spec > h4.set3 {
  text-align: center;
}
#details .spec > dl.note {
  display: grid;
  grid-template: auto/auto 1fr;
  column-gap: 0.5em;
  margin: calc(4 / 750 * 100vw) 0 0;
  font-size: calc(20 / 750 * 100vw);
  line-height: calc(40 / 750 * 100vw);
  letter-spacing: calc(120em / 1000);
}
#details .spec > dl.ingredient > dt {
  margin: calc(26 / 750 * 100vw) auto 0;
  font-size: calc(24 / 750 * 100vw);
  line-height: calc(46 / 750 * 100vw);
  letter-spacing: calc(50em / 1000);
}
#details .spec > dl.ingredient > dd {
  font-size: calc(24 / 750 * 100vw);
  line-height: calc(46 / 750 * 100vw);
  letter-spacing: calc(75em / 1000);
}
#details .spec > dl.quality {
  margin: calc(40 / 750 * 100vw) 0 0;
  font-size: calc(24 / 750 * 100vw);
  line-height: 1.75;
  letter-spacing: calc(120em / 1000);
}
#details .spec > dl.quality > dt.md {
  color: #25933b;
}
#details .spec > dl.quality > dt.bodyrepair {
  color: #ec6859;
}
#details .spec > dl.quality > dd {
  margin: calc(30 / 750 * 100vw) 0;
}
#details .spec > ul.material {
  display: flex;
  flex-wrap: wrap;
  gap: calc(16 / 750 * 100vw);
  margin: calc(25 / 750 * 100vw) 0 0;
}
#details .spec > ul.material > li {
  position: relative;
  padding: 0 calc(35 / 750 * 100vw) 0 0;
  font-size: calc(24 / 750 * 100vw);
  line-height: calc(32 / 750 * 100vw);
  letter-spacing: calc(150em / 1000);
}
#details .spec > ul.material > li::after {
  content: "";
  display: block;
  width: calc(32 / 750 * 100vw);
  height: calc(32 / 750 * 100vw);
  position: absolute;
  inset: calc(3 / 750 * 100vw) 0 auto auto;
}
#details .spec > ul.material > li.icon_arsoawater::after {
  background: url(../image/product/skincare/icon_arsoawater.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_moorwater::after {
  background: url(../image/product/skincare/icon_moorwater.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_lotusgerm::after {
  background: url(../image/product/skincare/icon_lotusgerm.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_macadamiate::after {
  background: url(../image/product/skincare/icon_macadamiate.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_yukinoshita::after {
  background: url(../image/product/skincare/icon_yukinoshita.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_bluerose::after {
  background: url(../image/product/skincare/icon_bluerose.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_niacinamide::after {
  background: url(../image/product/skincare/icon_niacinamide.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_polyquaternium51::after {
  background: url(../image/product/skincare/icon_polyquaternium51.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_hakkakureishi::after {
  background: url(../image/product/skincare/icon_hakkakureishi.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_tamakocho::after {
  background: url(../image/product/skincare/icon_tamakocho.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_juniperextract::after {
  background: url(../image/product/skincare/icon_juniperextract.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_vitaminCE::after {
  background: url(../image/product/skincare/icon_vitaminCE.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_moshiriclay::after {
  background: url(../image/product/skincare/icon_moshiriclay.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_suizenjinori::after {
  background: url(../image/product/skincare/icon_suizenjinori.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_himehuuro::after {
  background: url(../image/product/skincare/icon_himehuuro.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_licoriceroot::after, #details .spec > ul.material > li.icon_licorice::after, #details .spec > ul.material > li.icon_glycyrrhizate2k::after {
  background: url(../image/product/skincare/icon_licorice.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_hanamitsu::after {
  background: url(../image/product/skincare/icon_hanamitsu.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_setsurenka::after {
  background: url(../image/product/skincare/icon_setsurenka.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_bamboo::after {
  background: url(../image/product/skincare/icon_bamboo.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_squalane::after {
  background: url(../image/product/skincare/icon_squalane.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_jojobaoil::after {
  background: url(../image/product/skincare/icon_jojobaoil.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_vitaminC::after {
  background: url(../image/product/skincare/icon_vitaminC.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_hyaluronate::after {
  background: url(../image/product/skincare/icon_hyaluronate.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_ceramidenp::after {
  background: url(../image/product/skincare/icon_ceramidenp.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_lauroyl::after {
  background: url(../image/product/skincare/icon_lauroyl.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_soybean::after {
  background: url(../image/product/skincare/icon_soybean.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_natto::after {
  background: url(../image/product/skincare/icon_natto.svg) center/contain no-repeat;
}
#details .spec > ul.material > li.icon_bakuchiol::after {
  background: url(../image/product/skincare/icon_bakuchiol.svg) center/contain no-repeat;
}
#details .spec > ul.type {
  display: flex;
  justify-content: center;
  gap: 0 min(calc(10 / 1440 * 100vw), 10px);
  margin: calc(40 / 750 * 100vw) 0 0;
}
#details .spec > ul.type > li {
  display: grid;
  place-content: center;
  width: calc(200 / 750 * 100vw);
  height: calc(45 / 750 * 100vw);
  font-size: calc(24 / 750 * 100vw);
  line-height: 1;
  letter-spacing: calc(150em / 1000);
  color: #c7000b;
  border: 1px solid #c7000b;
  border-radius: 15px;
}
#details .spec .note + .type, #details .spec p + .type {
  justify-content: flex-start;
  margin: calc(30 / 750 * 100vw) 0;
}
#details .spec > hr {
  display: block;
  height: 0;
  margin: calc(40 / 750 * 100vw) auto 0;
  border: none;
  border-top: calc(1 / 750 * 100vw) solid #e5e5e5;
}

#step {
  padding: calc(76 / 750 * 100vw) 0 calc(80 / 750 * 100vw);
  text-align: center;
}
#step > hgroup > h3 {
  font-family: "Cormorant Garamond", serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 600;
  font-size: calc(24 / 750 * 100vw);
  line-height: 1;
  letter-spacing: calc(150em / 1000);
}
#step > hgroup > p {
  margin: calc(19 / 750 * 100vw) auto 0;
  font-size: calc(32 / 750 * 100vw);
  line-height: 1;
  letter-spacing: calc(150em / 1000);
}
#step > ol {
  display: flex;
  flex-wrap: wrap;
  gap: calc(84 / 750 * 100vw);
  width: calc(570 / 750 * 100vw);
  position: relative;
  margin: calc(59 / 750 * 100vw) auto 0;
}
#step > ol::before {
  content: "";
  display: block;
  width: max(2 / 750 * 100vw, 1px);
  height: calc(100% - 26.6666666667vw);
  position: absolute;
  inset: calc(100 / 750 * 100vw) auto auto calc(125 / 750 * 100vw);
  background: #b4b4b4;
}
#step > ol > li {
  display: flex;
  align-items: center;
  width: 100%;
  position: relative;
  padding: 0 calc(15 / 750 * 100vw) 0 calc(270 / 750 * 100vw);
}
#step > ol > li > hgroup {
  display: grid;
  grid-template: auto auto/auto;
  gap: calc(12 / 750 * 100vw);
  justify-content: center;
  width: calc(110 / 750 * 100vw);
  height: calc(110 / 750 * 100vw);
  position: absolute;
  inset: calc(50% - 7.3333333333vw) auto auto calc(69 / 750 * 100vw);
  background: #fff;
  border: calc(1 / 750 * 100vw) solid #9d9d9d;
  border-radius: calc(8 / 750 * 100vw);
}
#step > ol > li > hgroup > p {
  grid-row: 1/2;
  grid-column: 1/2;
  align-self: end;
  width: calc(110 / 750 * 100vw);
  font-size: calc(20 / 750 * 100vw);
  line-height: 1;
}
#step > ol > li > hgroup > h4 {
  grid-row: 2/3;
  grid-column: 1/2;
  align-self: start;
  width: calc(110 / 750 * 100vw);
  font-weight: 400;
  font-size: calc(28 / 750 * 100vw);
  line-height: 1;
  letter-spacing: calc(100em / 1000);
}
#step > ol > li > hgroup.long > p {
  letter-spacing: calc(50em / 1000);
}
#step > ol > li > img {
  display: block;
  position: relative;
  width: calc(310 / 750 * 100vw);
  height: auto;
}
#step > ol > li.active {
  padding: calc(32 / 750 * 100vw) calc(15 / 750 * 100vw) calc(32 / 750 * 100vw) calc(270 / 750 * 100vw);
}
#step > ol > li.active > hgroup {
  justify-content: start;
  width: calc(550 / 750 * 100vw);
  height: 100%;
  inset: 0 auto auto calc(10 / 750 * 100vw);
  padding: 0 0 0 calc(57 / 750 * 100vw);
  border-radius: calc(13 / 750 * 100vw);
}
#step.arsoa1 > hgroup > h3 {
  color: #ab951d;
}
#step.arsoa1 > ol > li.active > hgroup {
  border-color: #ab951d;
}
#step.arsoa2 > hgroup > h3 {
  color: #006fa8;
}
#step.arsoa2 > ol > li.active > hgroup {
  border-color: #006fa8;
}
#step.cell > hgroup > h3 {
  color: #bf5376;
}
#step.cell > ol > li.active > hgroup {
  border-color: #bf5376;
}
#step.sonades > hgroup > h3 {
  color: #6f3683;
}
#step.sonades > ol > li.active > hgroup {
  border-color: #6f3683;
}
#step.md > hgroup > h3 {
  color: #25933b;
}
#step.md > ol > li.active > hgroup {
  border-color: #25933b;
}
#step.md > ol > li > hgroup > h4 {
  margin-top: calc(-12 / 750 * 100vw);
}

#howto {
  padding: calc(60 / 750 * 100vw) calc(65 / 750 * 100vw);
}
#howto > div {
  border-bottom: calc(4 / 750 * 100vw) dotted;
}
#howto > div > h3 {
  position: relative;
}
#howto > div > h3 > img {
  width: calc(128 / 750 * 100vw);
}
#howto > div > h3::before {
  content: "";
  display: block;
  width: calc(472 / 750 * 100vw);
  height: calc(4 / 750 * 100vw);
  position: absolute;
  top: 50%;
  right: 0;
  border-bottom: calc(4 / 750 * 100vw) dotted;
}
#howto > div > ul {
  display: grid;
  gap: calc(40 / 750 * 100vw) 0;
  padding: calc(30 / 750 * 100vw) 0;
  text-align: center;
}
#howto > div > ul > li > img {
  width: calc(235 / 750 * 100vw);
}
#howto > div > ul > li > p {
  display: inline-block;
  margin: calc(20 / 750 * 100vw) 0 0;
  font-size: calc(24 / 750 * 100vw);
  line-height: 2;
}
#howto > div.claypack {
  border-bottom-color: #45917c;
}
#howto > div.claypack > h3::before {
  border-bottom-color: #45917c;
}
#howto > div.essentialserum {
  border-bottom-color: #d94288;
}
#howto > div.essentialserum > h3::before {
  border-bottom-color: #d94288;
}
#howto > div.bodyrepair {
  border-bottom-color: #ec6859;
}
#howto > div.bodyrepair > h3::before {
  border-bottom-color: #ec6859;
}
#howto > div.bodyrepair > div {
  padding: calc(10 / 750 * 100vw) 0 calc(30 / 750 * 100vw);
  text-align: center;
}
#howto > div.bodyrepair > div > img {
  width: calc(200 / 750 * 100vw);
}
#howto > div.bodyrepair > div > p {
  margin: calc(20 / 750 * 100vw) 0 0;
  font-size: calc(24 / 750 * 100vw);
  line-height: 2;
}

#topics {
  padding: calc(66 / 750 * 100vw) calc(65 / 750 * 100vw) calc(80 / 750 * 100vw);
  text-align: center;
}
#topics > h3 {
  font-weight: 400;
  font-size: calc(28 / 750 * 100vw);
  line-height: calc(54 / 750 * 100vw);
  letter-spacing: calc(150em / 1000);
  text-align: center;
}
#topics > p {
  margin: calc(23 / 750 * 100vw) auto 0;
  font-weight: 400;
  font-size: calc(24 / 750 * 100vw);
  line-height: calc(46 / 750 * 100vw);
  letter-spacing: calc(150em / 1000);
  text-align: center;
}
#topics > p.note {
  margin: calc(8 / 750 * 100vw) auto 0;
  font-size: calc(20 / 750 * 100vw);
  line-height: calc(36 / 750 * 100vw);
  letter-spacing: calc(120em / 1000);
}
#topics > hr {
  display: block;
  height: 0;
  margin: calc(62 / 750 * 100vw) auto calc(48 / 750 * 100vw);
  border: none;
  border-top: calc(1 / 750 * 100vw) solid #dcdcdc;
}
#topics .intro {
  display: grid;
  grid-template: auto auto/auto auto;
  gap: calc(16 / 750 * 100vw);
  margin: calc(38 / 750 * 100vw) auto calc(15 / 750 * 100vw);
}
#topics .intro > li {
  display: grid;
  place-content: center;
  width: calc(300 / 750 * 100vw);
  height: calc(120 / 750 * 100vw);
  padding: 0 0 0.1em;
  font-size: calc(24 / 750 * 100vw);
  line-height: calc(34 / 750 * 100vw);
  letter-spacing: calc(150em / 1000);
  text-align: center;
}
#topics .intro > li:nth-of-type(1) {
  grid-row: 1/2;
  grid-column: 1/3;
  justify-self: center;
}
#topics .intro > li:nth-of-type(2) {
  grid-row: 2/3;
  grid-column: 1/2;
  justify-self: end;
}
#topics .intro > li:nth-of-type(3) {
  grid-row: 2/3;
  grid-column: 2/3;
  justify-self: start;
}
#topics .materials {
  display: grid;
  gap: calc(30 / 750 * 100vw) 0;
  justify-content: center;
  margin: calc(36 / 750 * 100vw) 0 0;
}
#topics .materials > li {
  display: grid;
  grid-template-columns: calc(280 / 750 * 100vw) auto;
  gap: 0 calc(30 / 750 * 100vw);
}
#topics .materials > li > figure > figcaption {
  margin: calc(3 / 750 * 100vw) 0 0;
  font-size: calc(20 / 750 * 100vw);
  line-height: calc(32 / 750 * 100vw);
  letter-spacing: calc(150em / 1000);
  text-align: center;
}
#topics .materials > li > p {
  font-size: calc(18 / 750 * 100vw);
  line-height: 2;
  text-align: left;
}
#topics .materials > li > p > span {
  display: block;
  font-size: calc(26 / 750 * 100vw);
  letter-spacing: calc(100em / 1000);
}
#topics .materials > li > p > a {
  margin: calc(24 / 750 * 100vw) 0 0;
  font-size: calc(20 / 750 * 100vw);
  line-height: 1;
}
#topics .materials > li.copy2 p {
  font-size: calc(18 / 750 * 100vw);
  line-height: 1.6;
}
#topics .materials > li.copy2 p > span {
  margin: calc(10 / 750 * 100vw) 0 0;
  line-height: 1.2;
}
#topics .ingredients {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: calc(60 / 750 * 100vw) calc(20 / 750 * 100vw);
  margin: calc(36 / 750 * 100vw) auto calc(20 / 750 * 100vw);
}
#topics .ingredients > li {
  display: grid;
}
#topics .ingredients > li > figure > figcaption {
  margin: calc(20 / 750 * 100vw) 0 calc(12 / 750 * 100vw);
  font-size: calc(24 / 750 * 100vw);
  line-height: calc(38 / 750 * 100vw);
  letter-spacing: calc(150em / 1000);
  text-align: center;
}
#topics .ingredients > li > figure > figcaption.long {
  letter-spacing: calc(120em / 1000);
  line-height: 1.2;
}
#topics .ingredients > li > p {
  align-self: end;
  display: grid;
  place-content: center;
  width: 100%;
  height: calc(36 / 750 * 100vw);
  margin: 0;
  padding: 0 0 0.1em;
  font-weight: 400;
  font-size: calc(18 / 750 * 100vw);
  line-height: 1;
  letter-spacing: calc(150em / 1000);
  border: calc(1 / 750 * 100vw) solid #000;
  border-radius: calc(18 / 750 * 100vw);
}
#topics .ingredients + .note {
  text-align: left;
}
#topics .parts01 {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: calc(40 / 750 * 100vw) calc(60 / 750 * 100vw);
  margin: calc(53 / 750 * 100vw) auto 0;
}
#topics .parts01 > li {
  display: grid;
  place-content: center;
  width: calc(280 / 750 * 100vw);
}
#topics .parts01 > li:nth-of-type(3) {
  width: calc(340 / 750 * 100vw);
}
#topics .parts01 > li > figure {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: calc(16 / 750 * 100vw);
}
#topics .parts01 > li > figure > figcaption {
  display: grid;
  place-content: center;
  width: calc(280 / 750 * 100vw);
  height: calc(40 / 750 * 100vw);
  padding: 0 0 0.1em;
  font-size: calc(20 / 750 * 100vw);
  line-height: 1;
  letter-spacing: calc(150em / 1000);
  border-radius: calc(20 / 750 * 100vw);
}
#topics .parts02 {
  display: grid;
  grid-template: auto auto/auto auto;
  gap: 0 calc(30 / 750 * 100vw);
  margin: calc(31 / 750 * 100vw) auto 0;
}
#topics .parts02 > li {
  display: grid;
  place-content: center;
  width: calc(230 / 750 * 100vw);
  height: calc(230 / 750 * 100vw);
  padding: 0 0 0.1em;
  font-size: calc(24 / 750 * 100vw);
  line-height: calc(36 / 750 * 100vw);
  letter-spacing: calc(150em / 1000);
  text-align: center;
  border-radius: calc(115 / 750 * 100vw);
}
#topics .parts02 > li:nth-of-type(1) {
  grid-row: 1/2;
  grid-column: 1/2;
  justify-self: end;
}
#topics .parts02 > li:nth-of-type(2) {
  grid-row: 1/2;
  grid-column: 2/3;
  justify-self: start;
}
#topics .parts02 > li:nth-of-type(3) {
  grid-row: 2/3;
  grid-column: 1/3;
  justify-self: center;
  margin: calc(-26 / 750 * 100vw) 0 0;
}
#topics .parts03 {
  display: grid;
  grid-template: auto auto/auto;
  gap: calc(30 / 750 * 100vw);
  margin: calc(31 / 750 * 100vw) auto 0;
}
#topics .parts03 > img {
  grid-row: 1/2;
  grid-column: 1/2;
  justify-self: center;
  display: block;
}
#topics .parts03 > p {
  font-size: calc(24 / 750 * 100vw);
  line-height: calc(46 / 750 * 100vw);
  letter-spacing: calc(150em / 1000);
}
#topics.skincare_arsoa1_topic > ul.intro > li {
  background: #fcf8f3;
}
#topics.skincare_arsoa1_topic > ul.ingredients > li > p {
  color: #ab951d;
  border-color: #ab951d;
}
#topics.skincare_arsoa1_topic > ul.parts01 > li > figure > figcaption,
#topics.skincare_arsoa1_topic > ul.parts02 > li {
  background: #d2d8eb;
}
#topics.skincare_arsoa1_topic .column01 {
  width: fit-content;
  margin: calc(39 / 750 * 100vw) auto 0;
}
#topics.skincare_arsoa2_topic > ul.intro > li {
  background: #eff4fd;
}
#topics.skincare_arsoa2_topic > ul.ingredients > li > p {
  color: #006fa8;
  border-color: #006fa8;
}
#topics.skincare_arsoa2_topic > ul.parts01 > li > figure > figcaption,
#topics.skincare_arsoa2_topic > ul.parts02 > li {
  background: #d2d8eb;
}
#topics.skincare_cell_topic > ul.ingredients > li > p {
  color: #bf5376;
  border-color: #bf5376;
}
#topics.skincare_cell_topic > ul.parts01 > li > figure > figcaption,
#topics.skincare_cell_topic > ul.parts02 > li {
  background: #f2e4ea;
}
#topics.skincare_cell_topic .column01 > li {
  display: grid;
  grid-template: auto auto/auto;
  gap: calc(30 / 750 * 100vw);
  align-items: center;
  margin: calc(80 / 750 * 100vw) 0 0;
  line-height: 2;
}
#topics.skincare_cell_topic .column01 > li:nth-child(1) img {
  width: calc(375 / 750 * 100vw);
  margin: 0 auto;
}
#topics.skincare_cell_topic .column01 > li.hotspring img {
  width: calc(323 / 750 * 100vw);
  margin: 0 auto;
}
#topics.skincare_cell_topic .column01 > li.w100 img {
  width: auto;
}
#topics.skincare_cell_topic .column01 > li > div > h4 {
  font-size: calc(28 / 750 * 100vw);
  font-weight: 400;
  letter-spacing: calc(120em / 1000);
}
#topics.skincare_cell_topic .column01 > li > div > h4 > small {
  font-size: calc(24 / 750 * 100vw);
  letter-spacing: calc(100em / 1000);
}
#topics.skincare_cell_topic .column01 > li > div > p {
  margin: calc(30 / 750 * 100vw) calc(-10 / 750 * 100vw) 0;
  font-size: calc(24 / 750 * 100vw);
}
#topics.skincare_cell_topic .column01 > li > div > p > a {
  margin: calc(24 / 750 * 100vw) auto 0;
  font-size: calc(20 / 750 * 100vw);
  line-height: 1;
}
#topics.skincare_sonadese_topic > ul.ingredients > li > p {
  color: #6f3683;
  border-color: #6f3683;
}
#topics.skincare_sonadese_topic > ul.parts01 > li > figure > figcaption,
#topics.skincare_sonadese_topic > ul.parts02 > li {
  background: #d5cce3;
}
#topics.skincare_sonadese_topic .column01 > li {
  display: grid;
  grid-template: auto auto/auto;
  gap: calc(30 / 750 * 100vw);
  align-items: center;
  margin: calc(80 / 750 * 100vw) 0 0;
  line-height: 2;
}
#topics.skincare_sonadese_topic .column01 > li > img {
  width: calc(375 / 750 * 100vw);
  margin: 0 auto;
}
#topics.skincare_sonadese_topic .column01 > li > div > h4 {
  font-size: calc(28 / 750 * 100vw);
  font-weight: 400;
  letter-spacing: calc(120em / 1000);
}
#topics.skincare_sonadese_topic .column01 > li > div > h4 > small {
  font-size: calc(24 / 750 * 100vw);
  letter-spacing: calc(100em / 1000);
}
#topics.skincare_sonadese_topic .column01 > li > div > p {
  margin: calc(30 / 750 * 100vw) calc(-10 / 750 * 100vw) 0;
  font-size: calc(24 / 750 * 100vw);
}
#topics.skincare_sonadese_topic .column01 > li > div > p > a {
  margin: calc(24 / 750 * 100vw) auto 0;
  font-size: calc(20 / 750 * 100vw);
  line-height: 1;
}
#topics.skincare_sonadese_topic .column02 {
  line-height: 2;
}
#topics.skincare_sonadese_topic .column02 > h4 {
  font-size: calc(28 / 750 * 100vw);
  font-weight: 400;
  letter-spacing: calc(150em / 1000);
}
#topics.skincare_sonadese_topic .column02 > div {
  display: grid;
  grid-template: auto auto/auto;
  gap: calc(60 / 750 * 100vw) 0;
  margin: calc(30 / 750 * 100vw) 0 0;
}
#topics.skincare_sonadese_topic .column02 > div > p {
  font-size: calc(24 / 750 * 100vw);
}
#topics.skincare_sonadese_topic .column02 + .note {
  margin: calc(20 / 750 * 100vw) calc(-20 / 750 * 100vw) 0;
}
#topics.skincare_pluscare_topic > ul.intro > li {
  background: #c9c7e4;
}
#topics.skincare_pluscare_topic > ul.ingredients > li > p {
  color: #d94288;
  border-color: #d94288;
}
#topics.skincare_pluscare_topic .column01 {
  width: fit-content;
  margin: calc(39 / 750 * 100vw) auto 0;
}
#topics.skincare_md_topic > ul.ingredients > li > p {
  color: #25933b;
  border-color: #25933b;
}
#topics.skincare_md_topic > h4 {
  margin: calc(40 / 750 * 100vw) 0 0;
  font-weight: 400;
  font-size: calc(28 / 750 * 100vw);
  line-height: 1;
  letter-spacing: calc(150em / 1000);
  color: #25933b;
  text-align: center;
}
#topics.skincare_md_topic .sensitive {
  position: relative;
  margin: calc(20 / 750 * 100vw) 0 calc(80 / 750 * 100vw);
  padding: calc(26 / 750 * 100vw) calc(26 / 750 * 100vw) calc(29 / 750 * 100vw);
  background: #e2eec8;
  border: calc(1 / 750 * 100vw) solid #25933b;
  border-radius: calc(15 / 750 * 100vw);
}
#topics.skincare_md_topic .sensitive > ul {
  display: grid;
  grid-template: repeat(3, calc(114 / 750 * 100vw))/auto;
  gap: calc(15 / 750 * 100vw) 0;
}
#topics.skincare_md_topic .sensitive > ul > li {
  display: grid;
  grid-template: auto/6em auto;
  align-items: center;
  font-size: calc(30 / 750 * 100vw);
  line-height: 1.6;
  background: #fff9e8;
  border-radius: calc(15 / 750 * 100vw);
}
#topics.skincare_md_topic .sensitive > ul > li > p {
  font-size: calc(20 / 750 * 100vw);
  line-height: 1.6;
  letter-spacing: calc(50em / 1000);
  text-align: left;
}
#topics.skincare_md_topic .sensitive > p {
  position: absolute;
  bottom: -0.5em;
  left: 50%;
  transform: translateX(-50%);
  width: 12em;
  font-size: calc(28 / 750 * 100vw);
  line-height: 1;
  letter-spacing: calc(150em / 1000);
  color: #25933b;
}
#topics.skincare_md_topic .sensitive > p::before {
  content: "";
  width: 100%;
  height: 1px;
  position: absolute;
  top: 50%;
  left: 0;
  z-index: -1;
  background: #fff;
}
#topics.skincare_md_topic > h5 {
  margin: calc(70 / 750 * 100vw) 0 0;
  padding: calc(16 / 750 * 100vw) 0;
  font-size: calc(28 / 750 * 100vw);
  line-height: 1;
  font-weight: 400;
  letter-spacing: calc(150em / 1000);
  color: #25933b;
  background: #fff9e8;
}
#topics.skincare_md_topic .point > p {
  margin: calc(40 / 750 * 100vw) 0;
  font-size: calc(28 / 750 * 100vw);
  line-height: 1.8;
  color: #25933b;
}
#topics.skincare_md_topic .point > ul {
  display: flex;
  flex-direction: column;
  gap: calc(30 / 750 * 100vw) 0;
  justify-content: center;
}
#topics.skincare_md_topic .point > ul > li {
  position: relative;
}
#topics.skincare_md_topic .point > ul > li > figure {
  width: calc(200 / 750 * 100vw);
  margin: 0 0 0 calc(266 / 750 * 100vw);
}
#topics.skincare_md_topic .point > ul > li > figure > .num {
  position: absolute;
  top: calc(50% - 100 / 750 * 100vw);
  left: calc(154 / 750 * 100vw);
  width: calc(100 / 750 * 100vw);
}
#topics.skincare_md_topic .point > ul > li > p {
  margin: calc(10 / 750 * 100vw) 0 0;
  font-size: calc(24 / 750 * 100vw);
  line-height: 2;
  letter-spacing: calc(150em / 1000);
}
#topics.skincare_md_topic .column01 {
  width: fit-content;
  margin: calc(39 / 750 * 100vw) auto 0;
}
#topics.skincare_bodyrepair_topic > ul.intro > li {
  background: #fffeee;
}
#topics.skincare_aqs_topic .aqsstory {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
#topics.skincare_aqs_topic .aqsstory > div {
  position: relative;
}
#topics.skincare_aqs_topic .aqsstory > div > p {
  margin: calc(23 / 750 * 100vw) auto 0;
  font-weight: 400;
  font-size: calc(24 / 750 * 100vw);
  line-height: calc(46 / 750 * 100vw);
  letter-spacing: calc(150em / 1000);
  text-align: center;
}
#topics.skincare_aqs_topic .aqsstory > div > p.note {
  margin: calc(4 / 750 * 100vw) 0 0;
  font-size: calc(20 / 750 * 100vw);
  line-height: calc(36 / 750 * 100vw);
  letter-spacing: calc(120em / 1000);
}
#topics.skincare_aqs_topic .aqsimg {
  margin: calc(40 / 750 * 100vw) auto 0;
}
#topics.skincare_aqs_topic .column01 {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  margin: calc(40 / 750 * 100vw) auto 0;
  text-align: center;
}
#topics.skincare_aqs_topic .column01 > p {
  font-size: calc(24 / 750 * 100vw);
  line-height: calc(46 / 750 * 100vw);
  letter-spacing: calc(150em / 1000);
}
#topics.skincare_aqs_topic .column01 > img {
  width: calc(460 / 750 * 100vw);
  margin: calc(40 / 750 * 100vw) auto 0;
}
#topics.skincare_aqs_topic .column02 {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: calc(20 / 750 * 100vw) 0;
  margin: calc(40 / 750 * 100vw) auto 0;
  padding: calc(20 / 750 * 100vw);
  text-align: left;
  border: 1px solid #57A1DC;
  border-radius: calc(8 / 750 * 100vw);
}
#topics.skincare_aqs_topic .column02 > dl {
  line-height: 1.8;
}
#topics.skincare_aqs_topic .column02 > dl > dt {
  font-size: calc(24 / 750 * 100vw);
}
#topics.skincare_aqs_topic .column02 > dl > dd {
  font-size: calc(20 / 750 * 100vw);
}
#topics.skincare_aqs_topic .column02 > img {
  width: calc(480 / 750 * 100vw);
}
#topics.skincare_claypack_topic > ul.intro > li {
  background: #edfcf3;
}
#topics.skincare_claypack_topic > p {
  margin: calc(50 / 750 * 100vw) 0;
}
#topics.skincare_claypack_topic .skintype {
  margin: calc(40 / 750 * 100vw) auto 0;
}
#topics.skincare_set3_topic .column {
  display: grid;
}
#topics.skincare_set3_topic .column > figure {
  position: relative;
  padding: calc(120 / 750 * 100vw) calc(110 / 750 * 100vw) calc(66 / 750 * 100vw);
}
#topics.skincare_set3_topic .column > figure > figcaption {
  position: absolute;
  top: 0;
  left: calc(137 / 750 * 100vw);
  display: grid;
  place-content: center;
  width: calc(160 / 750 * 100vw);
  height: calc(160 / 750 * 100vw);
  font-size: calc(48 / 750 * 100vw);
  line-height: 1;
  letter-spacing: calc(150em / 1000);
  color: #c7000b;
  border: 1px solid #c7000b;
  border-radius: 50%;
}
#topics.skincare_set3_topic .column > figure > img {
  position: relative;
  z-index: 1;
}
#topics.skincare_set3_topic .column > div > p {
  margin: 0 calc(-10 / 750 * 100vw);
  font-size: calc(24 / 750 * 100vw);
  line-height: 2;
  letter-spacing: calc(150em / 1000);
}
#topics.skincare_set3_topic .column > div > a {
  margin: calc(52 / 750 * 100vw) auto 0;
  font-size: calc(26 / 750 * 100vw);
  line-height: 1;
  letter-spacing: calc(150em / 1000);
}

#aqs_howto {
  padding: calc(60 / 750 * 100vw) calc(64 / 750 * 100vw);
  text-align: center;
}

main.material {
  background: #fff;
}
main.material > .pagetitle p {
  letter-spacing: calc(25em / 1000);
}

#material {
  margin: 0 0 calc(60 / 750 * 100vw);
  background: #f7f7f7;
}
#material > div {
  padding: calc(48 / 750 * 100vw) 0;
  text-align: center;
}
#material > div > h3 {
  font-family: "Noto Serif JP", serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-size: calc(24 / 750 * 100vw);
  line-height: 1;
  font-weight: 500;
  letter-spacing: calc(40em / 1000);
}
#material > div > h3 > span {
  display: block;
  margin: calc(20 / 750 * 100vw) 0 0;
  font-size: calc(32 / 750 * 100vw);
  letter-spacing: calc(25em / 1000);
}
#material > div > p {
  margin: calc(35 / 750 * 100vw) 0 0;
  font-size: calc(24 / 750 * 100vw);
  line-height: calc(46 / 750 * 100vw);
  letter-spacing: calc(100em / 1000);
}
#material > div > p > small {
  display: block;
  font-size: 87.5%;
}
@media print, screen and (min-width:769px){
  body > main .pagetitle {
    padding: min(calc(68 / 1440 * 100vw), 68px) 0 min(calc(53 / 1440 * 100vw), 53px);
  }
  body > main .pagetitle > p {
    font-size: min(calc(16 / 1440 * 100vw), 16px);
    letter-spacing: calc(150em / 1000);
  }
  body > main .pagetitle > h2 {
    margin: min(calc(17 / 1440 * 100vw), 17px) 0 0;
    font-size: min(calc(40 / 1440 * 100vw), 40px);
    line-height: 1;
  }
  body > main > section {
    width: min(calc(1400 / 1440 * 100vw), 1400px);
    margin: min(calc(50 / 1440 * 100vw), 50px) auto 0;
  }
  #items > h3 {
    margin: min(calc(60 / 1440 * 100vw), 60px) 0 min(calc(56 / 1440 * 100vw), 56px);
    font-size: min(calc(40 / 1440 * 100vw), 40px);
  }
  #items > ul {
    gap: min(calc(50 / 1920 * 100vw), 50px) min(calc(7 / 1920 * 100vw), 7px);
    width: min(calc(1821 / 1920 * 100vw), 1821px);
  }
  #items > ul.short {
    justify-content: center;
  }
  #items > ul > li {
    width: min(calc(450 / 1920 * 100vw), 450px);
  }
  #items > ul > li > a {
    padding: 0 0 min(calc(35 / 1920 * 100vw), 35px);
  }
  #items > ul > li > a > hgroup {
    margin: min(calc(30 / 1920 * 100vw), 30px) auto 0;
  }
  #items > ul > li > a > hgroup > h4 {
    font-size: min(calc(20 / 1920 * 100vw), 20px);
    line-height: min(calc(32 / 1920 * 100vw), 32px);
  }
  #items > ul > li > a > hgroup > p {
    margin: 0 auto;
    font-size: min(calc(16 / 1920 * 100vw), 16px);
    line-height: min(calc(28 / 1920 * 100vw), 28px);
  }
  #items > ul > li > a > p {
    margin: min(calc(15 / 1920 * 100vw), 15px) auto 0;
    font-size: min(calc(16 / 1920 * 100vw), 16px);
    line-height: min(calc(28 / 1920 * 100vw), 28px);
  }
  #items.lower {
    margin: min(calc(80 / 1440 * 100vw), 80px) 0 0;
    padding: min(calc(113 / 1440 * 100vw), 113px) 0 0;
  }
  #items.lower > h3 {
    margin: 0 0 min(calc(54 / 1440 * 100vw), 54px);
    font-size: min(calc(40 / 1440 * 100vw), 40px);
  }
  #items.lower > h3 > span {
    margin: min(calc(2 / 1920 * 100vw), 2px) 0 0;
    font-size: min(calc(18 / 1920 * 100vw), 18px);
    line-height: min(calc(28 / 1920 * 100vw), 28px);
  }
  #details {
    grid-template: auto/auto auto;
    justify-content: center;
    gap: min(calc(70 / 1440 * 100vw), 70px);
    width: min(calc(1400 / 1440 * 100vw), 1400px);
    padding: min(calc(68 / 1440 * 100vw), 68px) 0;
  }
  #details .splide {
    grid-row: 1/2;
    grid-column: 1/2;
    width: min(calc(530 / 1440 * 100vw), 530px);
    height: min(calc(560 / 1440 * 100vw), 560px);
    margin: min(calc(2 / 1440 * 100vw), 2px) auto 0;
  }
  #details .splide .splide__slide {
    cursor: grab;
  }
  #details .splide .splide__slide.newprod::after {
    top: min(calc(17 / 1440 * 100vw), 17px);
    width: min(calc(120 / 1440 * 100vw), 120px);
    height: min(calc(38 / 1440 * 100vw), 38px);
    padding-bottom: min(calc(3 / 1440 * 100vw), 3px);
    font-size: min(calc(24 / 1440 * 100vw), 24px);
  }
  #details .splide .splide__arrows {
    width: 100%;
    inset: auto auto 0 0;
  }
  #details .splide .splide__arrows .splide__arrow {
    width: min(calc(10 / 1440 * 100vw), 10px);
    height: min(calc(10 / 1440 * 100vw), 10px);
    cursor: pointer;
  }
  #details .splide .splide__pagination {
    gap: 0 min(calc(15 / 1440 * 100vw), 15px);
    margin: min(calc(22 / 1440 * 100vw), 22px) auto 0;
  }
  #details .splide .splide__pagination > li .splide__pagination__page {
    width: min(calc(6 / 1440 * 100vw), 6px);
    height: min(calc(6 / 1440 * 100vw), 6px);
    cursor: pointer;
  }
  #details .spec {
    grid-row: 1/2;
    grid-column: 2/3;
    width: min(calc(574 / 1440 * 100vw), 574px);
    padding-right: min(calc(44 / 1440 * 100vw), 44px);
  }
  #details .spec > hgroup {
    margin: min(calc(40 / 1440 * 100vw), 40px) 0 0;
  }
  #details .spec > hgroup:first-of-type {
    margin-top: 0;
  }
  #details .spec > hgroup > h3 {
    margin: 0;
    font-size: min(calc(24 / 1440 * 100vw), 24px);
    letter-spacing: calc(100em / 1000);
    white-space: nowrap;
  }
  #details .spec > hgroup > p {
    margin: min(calc(10 / 1440 * 100vw), 10px) 0 0;
    font-size: min(calc(16 / 1440 * 100vw), 16px);
  }
  #details .spec > p {
    font-size: min(calc(16 / 1440 * 100vw), 16px);
    line-height: min(calc(28 / 1440 * 100vw), 28px);
  }
  #details .spec > p.price {
    width: 100%;
    margin: min(calc(16 / 1440 * 100vw), 16px) 0 0;
    font-size: min(calc(16 / 1440 * 100vw), 16px);
    line-height: min(calc(28 / 1440 * 100vw), 28px);
    letter-spacing: calc(50em / 1000);
    text-align: left;
  }
  #details .spec > p.salon {
    margin: min(calc(36 / 1440 * 100vw), 36px) 0 0;
  }
  #details .spec > p.salon > a {
    margin: 0;
    padding: 0 min(calc(1 / 1440 * 100vw), 1px) min(calc(10 / 1440 * 100vw), 10px);
    font-size: min(calc(16 / 1440 * 100vw), 16px);
    border-bottom-width: min(calc(1 / 1440 * 100vw), 1px);
    transition: 0.3s;
  }
  #details .spec > p.salon > a:hover {
    opacity: 1;
    border-bottom-color: #fff;
  }
  #details .spec > h4 {
    margin: min(calc(43 / 1440 * 100vw), 43px) 0 min(calc(12 / 1440 * 100vw), 12px);
    font-size: min(calc(16 / 1440 * 100vw), 16px);
    line-height: min(calc(28 / 1440 * 100vw), 28px);
  }
  #details .spec > h4.set3 {
    text-align: left;
  }
  #details .spec > dl.note {
    margin: min(calc(8 / 1440 * 100vw), 8px) 0 0;
    font-size: min(calc(14 / 1440 * 100vw), 14px);
    line-height: min(calc(28 / 1440 * 100vw), 28px);
  }
  #details .spec > dl.ingredient > dt {
    margin: min(calc(25 / 1440 * 100vw), 25px) 0 0;
    font-size: min(calc(12 / 1440 * 100vw), 12px);
    line-height: min(calc(22 / 1440 * 100vw), 22px);
  }
  #details .spec > dl.ingredient > dd {
    font-size: min(calc(12 / 1440 * 100vw), 12px);
    line-height: min(calc(22 / 1440 * 100vw), 22px);
  }
  #details .spec > dl.quality {
    margin: min(calc(30 / 1440 * 100vw), 30px) 0 0;
    font-size: min(calc(16 / 1440 * 100vw), 16px);
  }
  #details .spec > dl.quality > dd {
    margin: min(calc(22 / 1440 * 100vw), 22px) 0;
  }
  #details .spec > ul.material {
    gap: min(calc(12 / 1440 * 100vw), 12px) min(calc(18 / 1440 * 100vw), 18px);
    margin: min(calc(26 / 1440 * 100vw), 26px) 0 0;
  }
  #details .spec > ul.material > li {
    padding: 0 min(calc(30 / 1440 * 100vw), 30px) 0 0;
    font-size: min(calc(16 / 1440 * 100vw), 16px);
    line-height: min(calc(24 / 1440 * 100vw), 24px);
  }
  #details .spec > ul.material > li::after {
    width: min(calc(24 / 1440 * 100vw), 24px);
    height: min(calc(24 / 1440 * 100vw), 24px);
    inset: 0 0 auto auto;
  }
  #details .spec > ul.type {
    justify-content: flex-start;
    gap: 0 min(calc(10 / 1440 * 100vw), 10px);
    margin: min(calc(40 / 1440 * 100vw), 40px) 0 0;
  }
  #details .spec > ul.type > li {
    width: min(calc(160 / 1440 * 100vw), 160px);
    height: min(calc(30 / 1440 * 100vw), 30px);
    font-size: min(calc(16 / 1440 * 100vw), 16px);
    border-radius: min(calc(15 / 1440 * 100vw), 15px);
  }
  #details .spec .note + .type, #details .spec p + .type {
    margin: min(calc(30 / 1440 * 100vw), 30px) 0;
  }
  #details .spec > hr {
    width: min(calc(500 / 1440 * 100vw), 500px);
    margin: min(calc(30 / 1440 * 100vw), 30px) 0 0;
    border-top-width: min(calc(1 / 1440 * 100vw), 1px);
  }
  #step {
    width: min(calc(1400 / 1440 * 100vw), 1400px);
    padding: min(calc(57 / 1440 * 100vw), 57px) 0 min(calc(87 / 1440 * 100vw), 87px);
  }
  #step > hgroup > h3 {
    font-size: min(calc(20 / 1440 * 100vw), 20px);
  }
  #step > hgroup > p {
    margin: min(calc(15 / 1440 * 100vw), 15px) auto 0;
    font-size: min(calc(24 / 1440 * 100vw), 24px);
  }
  #step > ol {
    gap: 0;
    width: min(calc(1068 / 1440 * 100vw), 1068px);
    margin: min(calc(39 / 1440 * 100vw), 39px) auto 0;
  }
  #step > ol::before {
    width: min(calc(810 / 1440 * 100vw), 810px);
    height: max(min(calc(2 / 1440 * 100vw), 2px), 1px);
    inset: min(calc(45 / 1440 * 100vw), 45px) auto auto min(calc(135 / 1440 * 100vw), 135px);
  }
  #step > ol > li {
    width: min(calc(267 / 1440 * 100vw), 267px);
    padding: min(calc(132 / 1440 * 100vw), 132px) 0 0 min(calc(20 / 1440 * 100vw), 20px);
  }
  #step > ol > li > hgroup {
    gap: min(calc(10 / 1440 * 100vw), 10px);
    width: min(calc(83 / 1440 * 100vw), 83px);
    height: min(calc(83 / 1440 * 100vw), 83px);
    inset: min(calc(5 / 1440 * 100vw), 5px) auto auto min(calc(93.5 / 1440 * 100vw), 93.5px);
    border: min(calc(1 / 1440 * 100vw), 1px) solid #9d9d9d;
    border-radius: min(calc(8 / 1440 * 100vw), 8px);
  }
  #step > ol > li > hgroup > p {
    width: min(calc(100 / 1440 * 100vw), 100px);
    font-size: min(calc(16 / 1440 * 100vw), 16px);
  }
  #step > ol > li > hgroup > h4 {
    width: min(calc(100 / 1440 * 100vw), 100px);
    font-size: min(calc(26 / 1440 * 100vw), 26px);
  }
  #step > ol > li > hgroup.long {
    width: min(calc(122 / 1440 * 100vw), 122px);
    height: min(calc(83 / 1440 * 100vw), 83px);
    inset: min(calc(5 / 1440 * 100vw), 5px) auto auto min(calc(74 / 1440 * 100vw), 74px);
  }
  #step > ol > li > hgroup.long > p {
    letter-spacing: calc(100em / 1000);
  }
  #step > ol > li > img {
    width: min(calc(230 / 1440 * 100vw), 230px);
  }
  #step > ol > li.active {
    padding: min(calc(100 / 1440 * 100vw), 100px) 0 0 min(calc(20 / 1440 * 100vw), 20px);
  }
  #step > ol > li.active img {
    transform: scale(1.1);
  }
  #step > ol > li.active > hgroup {
    justify-content: center;
    align-content: start;
    width: min(calc(200 / 1440 * 100vw), 200px);
    height: min(calc(395 / 1440 * 100vw), 395px);
    inset: 0 auto auto min(calc(35 / 1440 * 100vw), 35px);
    padding: min(calc(19 / 1440 * 100vw), 19px) 0 0;
    border-radius: min(calc(13 / 1440 * 100vw), 13px);
  }
  #step.md > ol {
    width: min(calc(821 / 1440 * 100vw), 821px);
  }
  #step.md > ol::before {
    width: min(calc(563 / 1440 * 100vw), 563px);
  }
  #step.md > ol > li > hgroup > h4 {
    margin-top: min(calc(-12 / 1440 * 100vw), -12px);
  }
  #howto {
    padding: min(calc(60 / 1440 * 100vw), 60px) 0;
  }
  #howto > div {
    width: min(calc(880 / 1440 * 100vw), 880px);
    margin: 0 auto;
    border-bottom-width: min(calc(3 / 1440 * 100vw), 3px);
  }
  #howto > div > h3 > img {
    width: min(calc(128 / 1440 * 100vw), 128px);
  }
  #howto > div > h3::before {
    width: min(calc(732 / 1440 * 100vw), 732px);
    height: min(calc(3 / 1440 * 100vw), 3px);
    border-bottom-width: min(calc(3 / 1440 * 100vw), 3px);
  }
  #howto > div > ul {
    grid-template: auto/repeat(3, 1fr);
    gap: 0 min(calc(40 / 1440 * 100vw), 40px);
    padding: min(calc(30 / 1440 * 100vw), 30px) 0;
  }
  #howto > div > ul > li > img {
    width: min(calc(196 / 1440 * 100vw), 196px);
  }
  #howto > div > ul > li > p {
    margin: min(calc(10 / 1440 * 100vw), 10px) 0 0;
    font-size: min(calc(16 / 1440 * 100vw), 16px);
    text-align: left;
  }
  #howto > div.essentialserum > ul {
    grid-template: auto/repeat(2, 1fr);
  }
  #howto > div.bodyrepair > div {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0 min(calc(40 / 1440 * 100vw), 40px);
    padding: min(calc(10 / 1440 * 100vw), 10px) 0 min(calc(30 / 1440 * 100vw), 30px);
    text-align: left;
  }
  #howto > div.bodyrepair > div > img {
    width: min(calc(160 / 1440 * 100vw), 160px);
  }
  #howto > div.bodyrepair > div > p {
    margin: 0;
    font-size: min(calc(16 / 1440 * 100vw), 16px);
  }
  #topics {
    padding: min(calc(70 / 1440 * 100vw), 70px) 0 min(calc(80 / 1440 * 100vw), 80px);
  }
  #topics > h3 {
    font-size: min(calc(24 / 1440 * 100vw), 24px);
    line-height: min(calc(38 / 1440 * 100vw), 38px);
  }
  #topics > p {
    margin: min(calc(36 / 1440 * 100vw), 36px) auto 0;
    font-size: min(calc(16 / 1440 * 100vw), 16px);
    line-height: min(calc(30 / 1440 * 100vw), 30px);
  }
  #topics > p.note {
    margin: min(calc(10 / 1440 * 100vw), 10px) auto 0;
    font-size: min(calc(14 / 1440 * 100vw), 14px);
    line-height: min(calc(25 / 1440 * 100vw), 25px);
    letter-spacing: calc(150em / 1000);
  }
  #topics > hr {
    width: min(calc(1000 / 1440 * 100vw), 1000px);
    margin: min(calc(60 / 1440 * 100vw), 60px) auto min(calc(50 / 1440 * 100vw), 50px);
    border-top-width: min(calc(1 / 1440 * 100vw), 1px);
  }
  #topics .intro {
    display: flex;
    justify-content: center;
    gap: min(calc(10 / 1440 * 100vw), 10px);
    margin: min(calc(45 / 1440 * 100vw), 45px) auto min(calc(20 / 1440 * 100vw), 20px);
  }
  #topics .intro > li {
    width: min(calc(260 / 1440 * 100vw), 260px);
    height: min(calc(72 / 1440 * 100vw), 72px);
    font-size: min(calc(16 / 1440 * 100vw), 16px);
    line-height: min(calc(26 / 1440 * 100vw), 26px);
  }
  #topics .materials {
    grid-template-columns: auto auto;
    gap: min(calc(30 / 1440 * 100vw), 30px) min(calc(40 / 1440 * 100vw), 40px);
    margin: min(calc(42 / 1440 * 100vw), 42px) 0 0;
  }
  #topics .materials > li {
    grid-template-columns: min(calc(200 / 1440 * 100vw), 200px) auto;
    gap: 0 min(calc(30 / 1440 * 100vw), 30px);
  }
  #topics .materials > li > figure > figcaption {
    margin: min(calc(3 / 1440 * 100vw), 3px) 0 0;
    font-size: min(calc(14 / 1440 * 100vw), 14px);
    line-height: min(calc(22 / 1440 * 100vw), 22px);
  }
  #topics .materials > li > p {
    font-size: min(calc(18 / 1440 * 100vw), 18px);
  }
  #topics .materials > li > p > span {
    font-size: min(calc(20 / 1440 * 100vw), 20px);
  }
  #topics .materials > li > p > a {
    margin: min(calc(22 / 1440 * 100vw), 22px) 0 0;
    font-size: min(calc(14 / 1440 * 100vw), 14px);
  }
  #topics .materials > li.long {
    grid-area: 2/1/3/3;
  }
  #topics .materials > li.copy2 p {
    font-size: min(calc(16 / 1440 * 100vw), 16px);
  }
  #topics .materials > li.copy2 p > span {
    margin: min(calc(10 / 1440 * 100vw), 10px) 0 0;
  }
  #topics .ingredients {
    grid-template-columns: repeat(4, 1fr);
    gap: min(calc(40 / 1440 * 100vw), 40px) min(calc(13 / 1440 * 100vw), 13px);
    width: min(calc(840 / 1440 * 100vw), 840px);
    margin: min(calc(42 / 1440 * 100vw), 42px) auto min(calc(10 / 1440 * 100vw), 10px);
  }
  #topics .ingredients > li > figure > figcaption {
    margin: min(calc(10 / 1440 * 100vw), 10px) 0 min(calc(12 / 1440 * 100vw), 12px);
    font-size: min(calc(15 / 1440 * 100vw), 15px);
    line-height: min(calc(26 / 1440 * 100vw), 26px);
  }
  #topics .ingredients > li > p {
    height: min(calc(25 / 1440 * 100vw), 25px);
    font-size: min(calc(14 / 1440 * 100vw), 14px);
    border-width: min(calc(1 / 1440 * 100vw), 1px);
    border-radius: min(calc(17.5 / 1440 * 100vw), 17.5px);
  }
  #topics .ingredients + .note {
    width: min(calc(840 / 1440 * 100vw), 840px);
  }
  #topics .parts01 {
    gap: min(calc(0 / 1440 * 100vw), 0px);
    width: min(calc(980 / 1440 * 100vw), 980px);
    margin: min(calc(35 / 1440 * 100vw), 35px) auto 0;
    padding-right: min(calc(16 / 1440 * 100vw), 16px);
  }
  #topics .parts01 > li {
    width: min(calc(314 / 1440 * 100vw), 314px);
  }
  #topics .parts01 > li > figure > img {
    width: min(calc(257 / 1440 * 100vw), 257px);
  }
  #topics .parts01 > li:nth-of-type(3) {
    width: min(calc(314 / 1440 * 100vw), 314px);
  }
  #topics .parts01 > li:nth-of-type(3) > figure > img {
    width: min(calc(314 / 1440 * 100vw), 314px);
  }
  #topics .parts01 > li > figure {
    gap: min(calc(14 / 1440 * 100vw), 14px);
  }
  #topics .parts01 > li > figure > figcaption {
    width: min(calc(257 / 1440 * 100vw), 257px);
    height: min(calc(36 / 1440 * 100vw), 36px);
    font-size: min(calc(18 / 1440 * 100vw), 18px);
    border-radius: min(calc(18 / 1440 * 100vw), 18px);
  }
  #topics .parts02 {
    grid-template: auto/auto auto auto;
    gap: min(calc(80 / 1440 * 100vw), 80px);
    width: min(calc(730 / 1440 * 100vw), 730px);
    margin: min(calc(33 / 1440 * 100vw), 33px) auto 0;
  }
  #topics .parts02 > li {
    width: min(calc(190 / 1440 * 100vw), 190px);
    height: min(calc(190 / 1440 * 100vw), 190px);
    font-size: min(calc(18 / 1440 * 100vw), 18px);
    line-height: min(calc(26 / 1440 * 100vw), 26px);
    border-radius: min(calc(95 / 1440 * 100vw), 95px);
  }
  #topics .parts02 > li:nth-of-type(2) {
    justify-self: center;
  }
  #topics .parts02 > li:nth-of-type(3) {
    grid-row: 1/2;
    grid-column: 3/4;
    justify-self: start;
    margin: 0;
  }
  #topics .parts03 {
    grid-template: auto/auto auto;
    justify-content: end;
    gap: min(calc(40 / 1440 * 100vw), 40px);
    width: min(calc(1000 / 1440 * 100vw), 1000px);
    margin: min(calc(35 / 1440 * 100vw), 35px) auto 0;
  }
  #topics .parts03 > img {
    justify-self: end;
    width: min(calc(510 / 1440 * 100vw), 510px);
  }
  #topics .parts03 > p {
    width: min(calc(400 / 1440 * 100vw), 400px);
    font-size: min(calc(14 / 1440 * 100vw), 14px);
    line-height: min(calc(26 / 1440 * 100vw), 26px);
    text-align: left;
  }
  #topics.skincare_arsoa1_topic .column01 {
    margin: min(calc(36 / 1440 * 100vw), 36px) auto 0;
  }
  #topics.skincare_cell_topic .column01 {
    width: min(calc(900 / 1440 * 100vw), 900px);
    margin: 0 auto;
  }
  #topics.skincare_cell_topic .column01 > li {
    grid-template: auto/auto auto;
    gap: 0 min(calc(60 / 1440 * 100vw), 60px);
    margin: min(calc(60 / 1440 * 100vw), 60px) 0 0;
    text-align: left;
  }
  #topics.skincare_cell_topic .column01 > li:last-child {
    grid-template: auto/auto;
  }
  #topics.skincare_cell_topic .column01 > li:nth-child(1) img {
    width: fit-content;
  }
  #topics.skincare_cell_topic .column01 > li.hotspring img {
    order: 1;
    width: min(calc(232 / 1440 * 100vw), 232px);
  }
  #topics.skincare_cell_topic .column01 > li > div > h4 {
    font-size: min(calc(22 / 1440 * 100vw), 22px);
  }
  #topics.skincare_cell_topic .column01 > li > div > h4 > small {
    font-size: min(calc(18 / 1440 * 100vw), 18px);
  }
  #topics.skincare_cell_topic .column01 > li > div > p {
    margin: min(calc(20 / 1440 * 100vw), 20px) 0 0;
    font-size: min(calc(18 / 1440 * 100vw), 18px);
  }
  #topics.skincare_cell_topic .column01 > li > div > p > a {
    margin: min(calc(20 / 1440 * 100vw), 20px) 0 0;
    font-size: min(calc(16 / 1440 * 100vw), 16px);
  }
  #topics.skincare_sonadese_topic .column01 {
    width: min(calc(900 / 1440 * 100vw), 900px);
    margin: 0 auto;
  }
  #topics.skincare_sonadese_topic .column01 > li {
    grid-template: auto/auto auto;
    gap: 0 min(calc(60 / 1440 * 100vw), 60px);
    margin: min(calc(60 / 1440 * 100vw), 60px) 0 0;
    text-align: left;
  }
  #topics.skincare_sonadese_topic .column01 > li > img {
    width: fit-content;
  }
  #topics.skincare_sonadese_topic .column01 > li:nth-child(2) img {
    order: 1;
  }
  #topics.skincare_sonadese_topic .column01 > li > div > h4 {
    font-size: min(calc(22 / 1440 * 100vw), 22px);
  }
  #topics.skincare_sonadese_topic .column01 > li > div > h4 > small {
    font-size: min(calc(18 / 1440 * 100vw), 18px);
  }
  #topics.skincare_sonadese_topic .column01 > li > div > p {
    margin: min(calc(20 / 1440 * 100vw), 20px) 0 0;
    font-size: min(calc(18 / 1440 * 100vw), 18px);
  }
  #topics.skincare_sonadese_topic .column01 > li > div > p > a {
    margin: min(calc(20 / 1440 * 100vw), 20px) 0 0;
    font-size: min(calc(16 / 1440 * 100vw), 16px);
  }
  #topics.skincare_sonadese_topic .column02 {
    width: min(calc(900 / 1440 * 100vw), 900px);
    margin: 0 auto;
    text-align: left;
  }
  #topics.skincare_sonadese_topic .column02 > h4 {
    font-size: min(calc(22 / 1440 * 100vw), 22px);
  }
  #topics.skincare_sonadese_topic .column02 > div {
    grid-template: auto/auto min(calc(394 / 1440 * 100vw), 394px);
    gap: 0 min(calc(60 / 1440 * 100vw), 60px);
    margin: min(calc(20 / 1440 * 100vw), 20px) 0 0;
  }
  #topics.skincare_sonadese_topic .column02 > div:nth-child(3) {
    grid-template: auto/auto;
  }
  #topics.skincare_sonadese_topic .column02 > div > p {
    font-size: min(calc(18 / 1440 * 100vw), 18px);
  }
  #topics.skincare_sonadese_topic .column02 + .note {
    width: min(calc(900 / 1440 * 100vw), 900px);
    margin: min(calc(10 / 1440 * 100vw), 10px) auto 0;
    text-align: left;
  }
  #topics.skincare_pluscare_topic .column01 {
    margin: min(calc(36 / 1440 * 100vw), 36px) auto 0;
  }
  #topics.skincare_md_topic > h4 {
    margin: min(calc(40 / 1440 * 100vw), 40px) 0 0;
    font-size: min(calc(26 / 1440 * 100vw), 26px);
  }
  #topics.skincare_md_topic .sensitive {
    width: min(calc(690 / 1440 * 100vw), 690px);
    margin: min(calc(20 / 1440 * 100vw), 20px) auto min(calc(80 / 1440 * 100vw), 80px);
    padding: min(calc(20 / 1440 * 100vw), 20px) min(calc(28 / 1440 * 100vw), 28px) min(calc(26 / 1440 * 100vw), 26px);
    border-width: min(calc(1 / 1440 * 100vw), 1px);
    border-radius: min(calc(15 / 1440 * 100vw), 15px);
  }
  #topics.skincare_md_topic .sensitive > ul {
    grid-template: auto/repeat(3, 1fr);
    gap: 0 min(calc(12 / 1440 * 100vw), 12px);
  }
  #topics.skincare_md_topic .sensitive > ul > li {
    grid-template: auto auto/auto;
    gap: min(calc(4 / 1440 * 100vw), 4px) 0;
    padding: min(calc(12 / 1440 * 100vw), 12px) 0 min(calc(20 / 1440 * 100vw), 20px);
    font-size: min(calc(30 / 1440 * 100vw), 30px);
    border-radius: min(calc(15 / 1440 * 100vw), 15px);
  }
  #topics.skincare_md_topic .sensitive > ul > li > p {
    font-size: min(calc(14 / 1440 * 100vw), 14px);
    text-align: center;
  }
  #topics.skincare_md_topic .sensitive > p {
    font-size: min(calc(24 / 1440 * 100vw), 24px);
  }
  #topics.skincare_md_topic > h5 {
    width: min(calc(900 / 1440 * 100vw), 900px);
    margin: min(calc(70 / 1440 * 100vw), 70px) auto min(calc(-10 / 1440 * 100vw), -10px);
    padding: min(calc(13 / 1440 * 100vw), 13px) 0;
    font-size: min(calc(24 / 1440 * 100vw), 24px);
  }
  #topics.skincare_md_topic .point > p {
    margin: min(calc(30 / 1440 * 100vw), 30px) 0;
    font-size: min(calc(18 / 1440 * 100vw), 18px);
  }
  #topics.skincare_md_topic .point > ul {
    flex-direction: row;
    gap: 0 min(calc(40 / 1440 * 100vw), 40px);
  }
  #topics.skincare_md_topic .point > ul > li {
    width: min(calc(190 / 1440 * 100vw), 190px);
  }
  #topics.skincare_md_topic .point > ul > li > figure {
    width: auto;
    margin: 0 min(calc(12 / 1440 * 100vw), 12px);
  }
  #topics.skincare_md_topic .point > ul > li > figure > .num {
    top: 0;
    left: min(calc(-3 / 1440 * 100vw), -3px);
    width: min(calc(50 / 1440 * 100vw), 50px);
  }
  #topics.skincare_md_topic .point > ul > li > p {
    margin: min(calc(10 / 1440 * 100vw), 10px) 0 0;
    font-size: min(calc(16 / 1440 * 100vw), 16px);
    text-align: left;
  }
  #topics.skincare_md_topic .column01 {
    margin: min(calc(36 / 1440 * 100vw), 36px) auto 0;
  }
  #topics.skincare_aqs_topic .aqsstory {
    flex-direction: row-reverse;
  }
  #topics.skincare_aqs_topic .aqsstory > div {
    margin: min(calc(40 / 1440 * 100vw), 40px) 0 0 min(calc(-40 / 1440 * 100vw), -40px);
  }
  #topics.skincare_aqs_topic .aqsstory > div > p {
    margin: 0;
    font-size: min(calc(18 / 1440 * 100vw), 18px);
    line-height: min(calc(32 / 1440 * 100vw), 32px);
    text-align: left;
  }
  #topics.skincare_aqs_topic .aqsstory > div > p.note {
    margin: min(calc(4 / 1440 * 100vw), 4px) 0 0;
    font-size: min(calc(14 / 1440 * 100vw), 14px);
    line-height: min(calc(25 / 1440 * 100vw), 25px);
    letter-spacing: calc(150em / 1000);
  }
  #topics.skincare_aqs_topic .aqsimg {
    margin: min(calc(40 / 1440 * 100vw), 40px) auto 0;
  }
  #topics.skincare_aqs_topic .column01 {
    flex-direction: row;
    margin: min(calc(30 / 1440 * 100vw), 30px) auto 0;
    text-align: left;
  }
  #topics.skincare_aqs_topic .column01 > p {
    margin: 0;
    font-size: min(calc(18 / 1440 * 100vw), 18px);
    line-height: min(calc(32 / 1440 * 100vw), 32px);
  }
  #topics.skincare_aqs_topic .column01 > img {
    width: auto;
    margin: 0;
  }
  #topics.skincare_aqs_topic .column02 {
    flex-direction: row;
    gap: 0 min(calc(40 / 1440 * 100vw), 40px);
    width: min(calc(886 / 1440 * 100vw), 886px);
    margin: min(calc(30 / 1440 * 100vw), 30px) auto 0;
    padding: min(calc(30 / 1440 * 100vw), 30px);
    border-radius: min(calc(8 / 1440 * 100vw), 8px);
  }
  #topics.skincare_aqs_topic .column02 > dl > dt {
    font-size: min(calc(18 / 1440 * 100vw), 18px);
  }
  #topics.skincare_aqs_topic .column02 > dl > dd {
    font-size: min(calc(16 / 1440 * 100vw), 16px);
  }
  #topics.skincare_aqs_topic .column02 > img {
    width: auto;
  }
  #topics.skincare_claypack_topic > p {
    margin: min(calc(50 / 1440 * 100vw), 50px) 0;
  }
  #topics.skincare_claypack_topic .skintype {
    margin: min(calc(30 / 1440 * 100vw), 30px) 0 0;
  }
  #topics.skincare_set3_topic .column {
    grid-template: auto/min(calc(300 / 1440 * 100vw), 300px) min(calc(490 / 1440 * 100vw), 490px);
    gap: 0 min(calc(60 / 1440 * 100vw), 60px);
    justify-content: center;
    align-items: center;
  }
  #topics.skincare_set3_topic .column > figure {
    padding: min(calc(90 / 1440 * 100vw), 90px) 0 0;
  }
  #topics.skincare_set3_topic .column > figure > figcaption {
    top: 0;
    left: min(calc(20 / 1440 * 100vw), 20px);
    width: min(calc(120 / 1440 * 100vw), 120px);
    height: min(calc(120 / 1440 * 100vw), 120px);
    font-size: min(calc(36 / 1440 * 100vw), 36px);
  }
  #topics.skincare_set3_topic .column > div {
    text-align: left;
  }
  #topics.skincare_set3_topic .column > div > p {
    margin: min(calc(45 / 1440 * 100vw), 45px) 0 0;
    font-size: min(calc(18 / 1440 * 100vw), 18px);
  }
  #topics.skincare_set3_topic .column > div > a {
    margin: min(calc(36 / 1440 * 100vw), 36px) 0 0;
    font-size: min(calc(18 / 1440 * 100vw), 18px);
  }
  #aqs_howto {
    padding: min(calc(60 / 1440 * 100vw), 60px) 0;
  }
  #material {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    margin: 0 auto min(calc(120 / 1440 * 100vw), 120px);
  }
  #material > div {
    padding: min(calc(68 / 1440 * 100vw), 68px) 0 0 min(calc(70 / 1440 * 100vw), 70px);
    text-align: left;
  }
  #material > div > h3 {
    font-size: min(calc(20 / 1440 * 100vw), 20px);
  }
  #material > div > h3 > span {
    margin: min(calc(20 / 1440 * 100vw), 20px) 0 0;
    font-size: min(calc(26 / 1440 * 100vw), 26px);
  }
  #material > div > p {
    margin: min(calc(30 / 1440 * 100vw), 30px) 0 0;
    font-size: min(calc(16 / 1440 * 100vw), 16px);
    line-height: min(calc(34 / 1440 * 100vw), 34px);
  }
}