@charset "UTF-8";
@font-face {
  font-family: "sm";
  src: url("./ShipporiMinchoB1-Regular.woff2") format("woff");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "sm";
  src: url("./ShipporiMinchoB1-Medium.woff2") format("woff");
  font-weight: 500;
  font-display: swap;
}
._ib {
  display: inline-block;
}

html,
body {
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
       text-size-adjust: 100%;
}

.inner {
  box-sizing: border-box;
  position: relative;
  padding: 0 min(20.5333333333px, 3.7333333333vw);
  width: auto;
}

/* --------------------------------
main
-------------------------------- */
main {
  background: #333;
}

article {
  overflow: hidden;
}

article * {
  font-family: "ヒラギノ角ゴシック", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic ProN", "Hiragino Sans", メイリオ, 游ゴシック体, "Yu Gothic", YuGothic, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-feature-settings: "palt";
  font-weight: 400;
  color: #333;
}
article * .btn_l {
  padding: min(29.3333333333px, 5.3333333333vw);
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #364429;
  height: min(176px, 32vw);
}
article * .btn_l .txt img {
  height: min(90.2px, 16.4vw);
  width: auto;
}
article * .btn_l .txt img.hello {
  height: min(79.2px, 14.4vw);
}
article * .btn_l::after {
  content: "";
  display: block;
  width: min(33.7333333333px, 6.1333333333vw);
  width: 46px;
  height: 100%;
  background: url(../img/arrow.png) center center/contain no-repeat;
}
article * h2,
article * h3,
article * h4,
article * h5 {
  font-family: "sm", "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
}
article * sup {
  font-family: inherit;
  color: inherit;
  font-size: 50%;
  display: inline-block;
  padding-left: 0.1em;
}
article * strong {
  font-weight: 600;
}
article * .note {
  font-size: min(14.6666666667px, 2.6666666667vw);
  line-height: 1.8;
}
article * figure img,
article * h2 img {
  width: 100%;
}

/* --------------------------------
cover
-------------------------------- */
#cover {
  background: #ededed;
  padding-bottom: min(36.6666666667px, 6.6666666667vw);
}
#cover p.note {
  font-size: min(14.6666666667px, 2.6666666667vw);
  line-height: 1.5;
  margin-bottom: min(36.6666666667px, 6.6666666667vw);
}

/* --------------------------------
intro
-------------------------------- */
#intro {
  background: #ededed;
  text-align: center;
  padding-bottom: min(58.6666666667px, 10.6666666667vw);
}
#intro .flag {
  text-align: left;
  margin-left: min(44px, 8vw);
  margin-bottom: max(-22px, -4vw);
  position: relative;
}
#intro .flag img {
  width: min(132px, 24vw);
}
#intro h2 {
  margin-top: min(51.3333333333px, 9.3333333333vw);
  margin-bottom: min(36.6666666667px, 6.6666666667vw);
  text-align: center;
  font-family: "sm", "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
  font-size: min(44px, 8vw);
  font-weight: 400;
  color: #3a3a3a;
  letter-spacing: 0.05em;
  line-height: 1.3333333333;
}
#intro p {
  color: #3a3a3a;
  text-align: center;
  font-family: "sm", "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
  line-height: 1.7;
}
#intro .l1 {
  font-size: min(26.4px, 4.8vw);
}
#intro .l2 {
  font-size: min(35.2px, 6.4vw);
}
#intro .l3 {
  margin-top: 0.2em;
  font-size: min(42.5333333333px, 7.7333333333vw);
  border: 1px solid #3a3a3a;
  display: inline-block;
  line-height: 1.2;
  font-weight: 500;
  padding: 0.3em 0.5em;
  letter-spacing: 0.1em;
}

/* --------------------------------
hello
-------------------------------- */
#hello .clair {
  background: #e2ded1 url(../img/hello_clair_bg.jpg) left top/100% auto no-repeat;
}
#hello .fonce {
  background: #cbd9cf url(../img/hello_fonce_bg.jpg) left top/100% auto no-repeat;
}
#hello .soap {
  padding: min(58.6666666667px, 10.6666666667vw) 0 min(66px, 12vw);
}
#hello .soap hgroup {
  text-align: center;
}
#hello .soap hgroup h3 {
  font-size: min(26.4px, 4.8vw);
}
#hello .soap hgroup h2 {
  font-size: min(35.2px, 6.4vw);
  line-height: 1.25;
  margin-top: 0.3em;
}
#hello .soap hgroup h2 sup {
  width: 0;
  white-space: nowrap;
}
#hello .soap hgroup p {
  display: inline-block;
  background: #333;
  color: #fff;
  font-family: "sm", "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
  font-size: min(26.4px, 4.8vw);
  line-height: min(40.3333333333px, 7.3333333333vw);
  padding: 0 0.7em min(1.4666666667px, 0.2666666667vw);
  margin-top: 0.5em;
}
#hello .soap .eco {
  margin-top: min(44px, 8vw);
}
#hello .soap .eco img {
  width: min(409.2px, 74.4vw);
}
#hello .soap .body h3 {
  font-size: min(29.3333333333px, 5.3333333333vw);
  margin-top: min(14.6666666667px, 2.6666666667vw);
  line-height: 1.5;
}
#hello .soap .body p {
  width: min(377.6666666667px, 68.6666666667vw);
  margin-top: 1em;
  font-size: min(22px, 4vw);
  line-height: 1.8333333333;
}
#hello .feature {
  margin-top: min(44px, 8vw);
  text-align: center;
}
#hello .feature h3 {
  font-size: min(29.3333333333px, 5.3333333333vw);
}
#hello .feature ul {
  display: flex;
  margin-top: min(29.3333333333px, 5.3333333333vw);
}
#hello .feature ul li {
  width: 33.3333%;
}
#hello .feature ul li .num {
  width: min(23.4666666667px, 4.2666666667vw);
  height: min(45.4666666667px, 8.2666666667vw);
  border-radius: min(7.3333333333px, 1.3333333333vw);
  background: #fff;
  font-size: min(17.6px, 3.2vw);
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin-bottom: min(8.8px, 1.6vw);
}
#hello .feature ul li .num.green {
  background: #434d46;
  color: #fff;
}
#hello .feature ul li .main {
  font-size: min(17.6px, 3.2vw);
  line-height: 1.4615384615;
  border-right: 1px solid rgba(0, 0, 0, 0.5);
}
#hello .feature ul li:first-child .main {
  border-left: 1px solid rgba(0, 0, 0, 0.5);
}
#hello .note {
  margin-top: min(58.6666666667px, 10.6666666667vw);
}

/* --------------------------------
newsoap
-------------------------------- */
#newsoap .inner {
  padding-top: min(44px, 8vw);
  padding-bottom: min(44px, 8vw);
}

/* --------------------------------
power
-------------------------------- */
#power {
  background: #e6ebec;
  padding: min(58.6666666667px, 10.6666666667vw) 0;
}
#power hgroup h2 {
  font-size: min(44px, 8vw);
  line-height: 1.4333333333;
}
#power hgroup p {
  font-size: min(26.4px, 4.8vw);
  line-height: 1.5;
  margin-top: 1em;
  font-family: "sm", "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
  font-weight: 200;
}
#power hgroup p .lts {
  display: inline-block;
  letter-spacing: 0.15em;
  font-family: inherit;
}
#power hgroup p .zen {
  display: inline-block;
  transform: scaleX(1.3);
  transform-origin: left center;
  font-family: inherit;
  margin-right: 0.1em;
}
#power ul li {
  position: relative;
}
#power ul li figure {
  position: absolute;
  z-index: 1;
}
#power ul li h3 {
  position: relative;
  z-index: 2;
  margin-bottom: min(36.6666666667px, 6.6666666667vw);
}
#power ul li p {
  position: relative;
  z-index: 2;
  writing-mode: vertical-rl;
  font-size: min(17.6px, 3.2vw);
  line-height: 1.75;
}
#power ul li p sup {
  display: inline-block;
  transform: rotate(-90deg) translateX(1em);
}
#power ul .green {
  margin-top: min(58.6666666667px, 10.6666666667vw);
}
#power ul .green figure {
  width: min(451px, 82vw);
  top: max(-51.3333333333px, -9.3333333333vw);
  right: max(-20.5333333333px, -3.7333333333vw);
}
#power ul .green h3 {
  width: min(237.6px, 43.2vw);
}
#power ul .white {
  display: flex;
  flex-direction: row-reverse;
  justify-content: flex-start;
  align-items: flex-start;
}
#power ul .white figure {
  width: min(342.4666666667px, 62.2666666667vw);
  top: min(0px, 0vw);
  left: max(-20.5333333333px, -3.7333333333vw);
}
#power ul .white h3 {
  width: min(76.2666666667px, 13.8666666667vw);
  margin: 0;
}
#power ul .white p {
  margin: 0;
  margin-right: max(-14.6666666667px, -2.6666666667vw);
  margin-top: min(198px, 36vw);
}
#power ul .yellow {
  margin-top: min(22px, 4vw);
  padding-top: min(187px, 34vw);
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
}
#power ul .yellow figure {
  width: min(430.4666666667px, 78.2666666667vw);
  top: min(0px, 0vw);
  left: min(20.5333333333px, 3.7333333333vw);
}
#power ul .yellow h3 {
  width: min(79.9333333333px, 14.5333333333vw);
  margin-top: min(80.6666666667px, 14.6666666667vw);
  margin-right: min(14.6666666667px, 2.6666666667vw);
}
#power ul .yellow p {
  margin: 0;
  margin-right: min(20.5333333333px, 3.7333333333vw);
}
#power ul .purple {
  margin-top: max(-88px, -16vw);
}
#power ul .purple figure {
  width: min(371.0666666667px, 67.4666666667vw);
  right: max(-20.5333333333px, -3.7333333333vw);
  bottom: 0;
}
#power ul .purple h3 {
  width: min(265.4666666667px, 48.2666666667vw);
}
#power ul .purple p {
  padding-left: min(14.6666666667px, 2.6666666667vw);
}
#power .note {
  margin-top: min(58.6666666667px, 10.6666666667vw);
}

/* --------------------------------
organic
-------------------------------- */
#organic .clair {
  background: #e2ded1;
}
#organic .fonce {
  background: #cbd9cf;
}
#organic .inner {
  padding-top: min(58.6666666667px, 10.6666666667vw);
  padding-bottom: min(58.6666666667px, 10.6666666667vw);
}
#organic .inner hgroup {
  text-align: center;
  margin-bottom: min(44px, 8vw);
}
#organic .inner hgroup h3 {
  font-size: min(23.4666666667px, 4.2666666667vw);
}
#organic .inner hgroup h2 {
  font-size: min(32.2666666667px, 5.8666666667vw);
  margin-top: min(5.8666666667px, 1.0666666667vw);
}
#organic .inner hgroup p {
  margin-top: min(7.3333333333px, 1.3333333333vw);
  background: #333;
  font-size: min(29.3333333333px, 5.3333333333vw);
  color: #fff;
  font-family: "sm", "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
  line-height: min(46.9333333333px, 8.5333333333vw);
  padding-bottom: 0.05em;
}
#organic .inner .ingredient {
  margin-top: min(51.3333333333px, 9.3333333333vw);
}
#organic .inner .ingredient h3 {
  text-align: center;
  font-size: min(35.2px, 6.4vw);
  line-height: 1.5;
  position: relative;
  z-index: 2;
}
#organic .inner .ingredient ul {
  padding: 0 min(23.4666666667px, 4.2666666667vw);
}
#organic .inner .ingredient ul li {
  padding-top: min(80.6666666667px, 14.6666666667vw);
  position: relative;
}
#organic .inner .ingredient ul li figure {
  position: absolute;
  z-index: 1;
}
#organic .inner .ingredient ul li h4 {
  font-weight: 500;
  font-family: "ヒラギノ角ゴシック", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic ProN", "Hiragino Sans", メイリオ, 游ゴシック体, "Yu Gothic", YuGothic, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  position: relative;
  z-index: 2;
  border: 1px solid #333;
  line-height: 1;
  display: inline-block;
  padding: 0.2em 0.4em 0.2em;
  font-size: min(22px, 4vw);
}
#organic .inner .ingredient ul li .effect {
  position: relative;
  z-index: 2;
  font-size: min(14.6666666667px, 2.6666666667vw);
}
#organic .inner .ingredient ul li .body {
  position: relative;
  z-index: 2;
  font-size: min(17.6px, 3.2vw);
  line-height: 1.75;
  width: min(278.6666666667px, 50.6666666667vw);
  margin-top: 0.2em;
}
#organic .clair ul li:nth-of-type(1) {
  padding-top: min(44px, 8vw);
}
#organic .clair ul li:nth-of-type(1) figure {
  width: min(238.3333333333px, 43.3333333333vw);
  top: max(-22px, -4vw);
  right: max(-44px, -8vw);
}
#organic .clair ul li:nth-of-type(2) {
  padding-left: min(183.3333333333px, 33.3333333333vw);
}
#organic .clair ul li:nth-of-type(2) figure {
  width: min(225.1333333333px, 40.9333333333vw);
  top: min(14.6666666667px, 2.6666666667vw);
  left: max(-44px, -8vw);
  background: #e2ded1;
}
#organic .clair ul li:nth-of-type(2) figure img {
  mix-blend-mode: multiply;
}
#organic .clair ul li:nth-of-type(3) figure {
  width: min(237.6px, 43.2vw);
  top: max(-29.3333333333px, -5.3333333333vw);
  right: max(-44px, -8vw);
}
#organic .clair ul li:nth-of-type(4) {
  padding-left: min(183.3333333333px, 33.3333333333vw);
}
#organic .clair ul li:nth-of-type(4) figure {
  width: min(226.6px, 41.2vw);
  top: min(29.3333333333px, 5.3333333333vw);
  left: max(-44px, -8vw);
  background: #e2ded1;
}
#organic .clair ul li:nth-of-type(4) figure img {
  mix-blend-mode: multiply;
}
#organic .fonce ul li:nth-of-type(1) {
  padding-top: min(44px, 8vw);
}
#organic .fonce ul li:nth-of-type(1) figure {
  width: min(188.4666666667px, 34.2666666667vw);
  top: min(7.3333333333px, 1.3333333333vw);
  right: max(-44px, -8vw);
}
#organic .fonce ul li:nth-of-type(1) .body {
  width: min(315.3333333333px, 57.3333333333vw);
}
#organic .fonce ul li:nth-of-type(2) {
  padding-left: min(146.6666666667px, 26.6666666667vw);
}
#organic .fonce ul li:nth-of-type(2) figure {
  width: min(262.5333333333px, 47.7333333333vw);
  top: min(0px, 0vw);
  left: max(-44px, -8vw);
  background: #cbd9cf;
}
#organic .fonce ul li:nth-of-type(2) figure img {
  mix-blend-mode: multiply;
}
#organic .fonce ul li:nth-of-type(2) p.body {
  width: min(322.6666666667px, 58.6666666667vw);
}
#organic .fonce ul li:nth-of-type(3) {
  padding-top: min(95.3333333333px, 17.3333333333vw);
}
#organic .fonce ul li:nth-of-type(3) figure {
  width: min(232.4666666667px, 42.2666666667vw);
  top: min(7.3333333333px, 1.3333333333vw);
  right: max(-44px, -8vw);
}
#organic .fonce ul li:nth-of-type(3) p.body {
  width: min(315.3333333333px, 57.3333333333vw);
}
#organic .fonce ul li:nth-of-type(4) {
  padding-left: min(146.6666666667px, 26.6666666667vw);
}
#organic .fonce ul li:nth-of-type(4) figure {
  width: min(199.4666666667px, 36.2666666667vw);
  top: min(14.6666666667px, 2.6666666667vw);
  left: max(-44px, -8vw);
}
#organic .fonce ul li:nth-of-type(4) .body {
  width: min(315.3333333333px, 57.3333333333vw);
}
#organic .note {
  margin-top: min(117.3333333333px, 21.3333333333vw);
}
#organic .btnarea {
  padding-top: min(36.6666666667px, 6.6666666667vw);
  padding-bottom: min(36.6666666667px, 6.6666666667vw);
}

/* --------------------------------
talk
-------------------------------- */
#talk {
  background: #ededed;
  padding: min(58.6666666667px, 10.6666666667vw) 0 0;
}
#talk hgroup.top h3 {
  font-family: "sm", "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
  color: #fff;
  font-size: min(29.3333333333px, 5.3333333333vw);
  text-align: center;
  text-align: center;
  background: #333;
  line-height: 1.5;
  padding-bottom: 0.05em;
}
#talk hgroup.top h2 {
  text-align: center;
  margin-top: min(36.6666666667px, 6.6666666667vw);
}
#talk hgroup.top h2 img {
  width: 100%;
}
#talk hgroup.top .body {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: min(44px, 8vw);
}
#talk hgroup.top .body p {
  font-size: min(23.4666666667px, 4.2666666667vw);
  line-height: 2.2;
  letter-spacing: 0.05em;
  writing-mode: vertical-rl;
  font-family: "sm", "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
  font-feature-settings: normal;
}
#talk hgroup.top .body p .num {
  margin-top: -0.1em;
  margin-bottom: 0.1em;
  font-family: "sm", "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
  transform: rotate(-90deg);
  display: inline-block;
  font-family: "sm", "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
}
#talk hgroup.top .body p .curning {
  display: inline-block;
  margin-top: -0.2em;
  margin-bottom: -0.6em;
  font-family: "sm", "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
}
#talk hgroup.top .body p .ten {
  display: inline-block;
  margin-bottom: -0.4em;
}
#talk figure.photo {
  margin-top: min(51.3333333333px, 9.3333333333vw);
  margin-left: max(-20.5333333333px, -3.7333333333vw);
  margin-right: max(-20.5333333333px, -3.7333333333vw);
}
#talk figure.ingredient {
  position: relative;
  z-index: 1;
  margin-top: max(-121px, -22vw);
}
#talk .flag {
  text-align: center;
  margin-top: max(-22px, -4vw);
}
#talk .flag img {
  width: min(161.3333333333px, 29.3333333333vw);
}
#talk h3.top {
  font-size: min(32.2666666667px, 5.8666666667vw);
  line-height: 1.4545454545;
  text-align: center;
  margin-top: min(14.6666666667px, 2.6666666667vw);
  letter-spacing: 0.1em;
}
#talk .voice {
  position: relative;
  z-index: 2;
  margin-top: min(22px, 4vw);
}
#talk .voice .face {
  width: min(92.4px, 16.8vw);
}
#talk .voice .face.n {
  float: left;
  margin-right: min(14.6666666667px, 2.6666666667vw);
}
#talk .voice .face.b {
  float: right;
  margin-left: min(14.6666666667px, 2.6666666667vw);
}
#talk .voice p {
  font-size: min(22px, 4vw);
  line-height: 1.8;
  padding-top: min(18.3333333333px, 3.3333333333vw);
}
#talk hgroup:not(.top) {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: min(44px, 8vw);
  margin-top: min(58.6666666667px, 10.6666666667vw);
}
#talk hgroup:not(.top) .rect {
  width: min(135.6666666667px, 24.6666666667vw);
  height: auto;
  aspect-ratio: 1/1;
  background: #dad4c5;
  border: 1px solid #333;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: min(80.6666666667px, 14.6666666667vw);
  padding-bottom: 0.15em;
  line-height: 1;
  font-family: "sm", "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
}
#talk hgroup:not(.top) .rect.green {
  background: #cbd9cf;
}
#talk hgroup:not(.top) .rect.pink {
  background: #e7d7dd;
}
#talk hgroup:not(.top) h3 {
  font-size: min(32.2666666667px, 5.8666666667vw);
  line-height: 1.4545454545;
  letter-spacing: 0.1em;
}
#talk .graph {
  margin-top: min(44px, 8vw);
  text-align: center;
}
#talk .graph img {
  width: min(469.3333333333px, 85.3333333333vw);
}
#talk .eco {
  margin-top: min(36.6666666667px, 6.6666666667vw);
  border: 1px solid #333;
  background: #fff;
  padding: min(29.3333333333px, 5.3333333333vw) min(22px, 4vw) min(29.3333333333px, 5.3333333333vw);
}
#talk .eco h3 {
  font-size: min(24.9333333333px, 4.5333333333vw);
  margin-bottom: min(14.6666666667px, 2.6666666667vw);
  text-align: center;
}
#talk .eco .body {
  display: flex;
  gap: min(22px, 4vw);
  justify-content: center;
  align-items: center;
}
#talk .eco .body .logo {
  width: min(132px, 24vw);
  flex-shrink: 0;
  flex-grow: 0;
}
#talk .eco .body p {
  font-size: min(16.1333333333px, 2.9333333333vw);
  line-height: 1.8181818182;
}
#talk .note {
  margin-top: min(58.6666666667px, 10.6666666667vw);
  padding-bottom: min(58.6666666667px, 10.6666666667vw);
}
#talk .btnarea {
  background: #fff;
  padding-top: min(58.6666666667px, 10.6666666667vw);
  padding-bottom: min(58.6666666667px, 10.6666666667vw);
}

/* --------------------------------
monitor
-------------------------------- */
#monitor {
  padding-bottom: min(58.6666666667px, 10.6666666667vw);
  background: #ededed;
}
#monitor hgroup {
  display: flex;
  position: relative;
}
#monitor hgroup .txt {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  padding: min(22px, 4vw);
}
#monitor hgroup .txt p {
  color: #fff;
  font-size: min(24.9333333333px, 4.5333333333vw);
  line-height: 1.5882352941;
  margin-bottom: 0.5em;
}
#monitor hgroup .txt h2 {
  color: #fff;
  font-size: min(44px, 8vw);
  line-height: 1.3;
}
#monitor .inner {
  padding-top: 1px;
}
#monitor .block {
  margin-top: min(73.3333333333px, 13.3333333333vw);
}
#monitor .block h3 {
  text-align: center;
  position: relative;
  line-height: 1;
  font-size: min(26.4px, 4.8vw);
}
#monitor .block h3 span {
  font-family: "sm", "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
  letter-spacing: 0.1em;
}
#monitor .block h3::after, #monitor .block h3::before {
  content: "";
  display: block;
  width: min(168.6666666667px, 30.6666666667vw);
  height: 1px;
  background: #333;
  top: 0.5em;
  left: 0;
  position: absolute;
}
#monitor .block h3::after {
  left: unset;
  right: 0;
}
#monitor .block p {
  margin-top: min(36.6666666667px, 6.6666666667vw);
  text-align: center;
  font-family: "sm", "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
  font-size: min(22px, 4vw);
  line-height: 1.8;
  font-weight: 300;
}
#monitor .block p span {
  font-family: "sm", "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
  display: inline-block;
  line-height: 1.5;
}
#monitor .block p .s {
  font-size: min(26.4px, 4.8vw);
}
#monitor .block p .sm {
  font-size: min(29.3333333333px, 5.3333333333vw);
}
#monitor .block p .m {
  font-size: min(32.2666666667px, 5.8666666667vw);
}
#monitor .block p .l {
  font-size: min(44px, 8vw);
}
#monitor .block p .ll {
  font-size: min(52.8px, 9.6vw);
  line-height: 1;
}
#monitor .block p .initial {
  font-size: min(20.5333333333px, 3.7333333333vw);
  margin-left: 0.5em;
}
#monitor .pack {
  margin-top: min(73.3333333333px, 13.3333333333vw);
  text-align: center;
}
#monitor .pack img {
  width: min(344.6666666667px, 62.6666666667vw);
}

/* --------------------------------
video
-------------------------------- */
#video {
  padding: min(73.3333333333px, 13.3333333333vw) 0;
}

/* --------------------------------
#offer
-------------------------------- */
#offer > h2 {
  background: #e2ded1;
  text-align: center;
  padding: min(44px, 8vw) 0;
  font-size: min(39.6px, 7.2vw);
  line-height: 1.4444444444;
}
#offer .offer_id {
  padding-bottom: min(58.6666666667px, 10.6666666667vw);
}
#offer .offer_id h2 {
  padding: min(29.3333333333px, 5.3333333333vw) 0;
}
#offer .note {
  margin-top: 2em;
}
#offer .btn {
  margin: 0;
  color: #fff;
  height: min(66px, 12vw);
}
#offer .btn span {
  color: #fff;
  font-size: min(26.4px, 4.8vw);
  letter-spacing: 0.1em;
}
#offer .btn::before {
  transform: scale(1.8);
  transform-origin: center bottom;
}
#offer .btn:hover span {
  color: #3a4e3a;
}
#offer #single {
  background: #e2ded1;
}
#offer #set {
  padding-top: min(73.3333333333px, 13.3333333333vw);
  background: #cbd9cf;
}

/* --------------------------------
ingredient
-------------------------------- */
#ingredient {
  padding: min(73.3333333333px, 13.3333333333vw) 0;
}
#ingredient h2 {
  font-family: "ヒラギノ角ゴシック", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic ProN", "Hiragino Sans", メイリオ, 游ゴシック体, "Yu Gothic", YuGothic, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: min(20.5333333333px, 3.7333333333vw);
  font-weight: 600;
}
#ingredient h3 {
  margin-top: min(18.3333333333px, 3.3333333333vw);
  font-family: "ヒラギノ角ゴシック", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic ProN", "Hiragino Sans", メイリオ, 游ゴシック体, "Yu Gothic", YuGothic, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: min(20.5333333333px, 3.7333333333vw);
  font-weight: 600;
}
#ingredient p {
  font-size: min(14.6666666667px, 2.6666666667vw);
  line-height: 1.8;
}
#ingredient p sup {
  font-size: 100%;
  display: inline-block;
  transform: translateY(0.4em);
}

/* --------------------------------

-------------------------------- */
/* --------------------------------

-------------------------------- */
/*# sourceMappingURL=style.css.map */