@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap");
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
  display: block;
}

html {
  font-family: sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
}

a {
  color: #2e2109;
  text-decoration: none;
}
a:hover {
  outline: 0;
  text-decoration: underline;
}
a:hover, a:focus, a:active {
  outline: 0;
}

abbr[title] {
  border-bottom: 1px dotted;
}

b,
strong,
.strong {
  font-weight: bold;
}

dfn,
em,
.em {
  font-style: italic;
}

hr {
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
}

p {
  -webkit-hyphens: auto;
  -epub-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}

pre {
  margin: 0;
  white-space: pre-wrap;
}

dl,
menu,
ol,
ul {
  margin: 1em 0;
}

dd {
  margin: 0;
}

ol,
ul {
  padding: 0;
  list-style-type: none;
}

img {
  border: 0;
}

svg:not(:root) {
  overflow: hidden;
}

figure {
  margin: 0;
}

button,
input,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
  margin: 0;
}

button,
input {
  line-height: normal;
}

button,
select {
  text-transform: none;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer;
}

input[type="submit"] {
  border: none;
}

button[disabled],
html input[disabled] {
  cursor: default;
}

input[type="checkbox"],
input[type="radio"] {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0;
}

input[type="search"] {
  -webkit-appearance: textfield;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

textarea {
  overflow: auto;
  vertical-align: top;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

html {
  position: relative;
  height: 100%;
  overflow: auto;
}

body {
  font-family: 'Zen Kaku Gothic New', "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, Meiryo, "メイリオ", sans-serif;
  font-size: 100%;
  font-weight: 500;
  line-height: 1.0;
  color: #2e2109;
  position: static;
  background-color: #ffffff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img {
  width: 100%;
  max-width: 100%;
  height: auto;
  vertical-align: bottom;
}

div, p, h1, h2, h3, h4, h5, h6, ul, ol, li, a, form, input, object, dt, dd, dl, iframe, label {
  margin: 0;
  padding: 0;
  font-size: inherit;
}

ol, ul, li, dl, dt, dd {
  list-style-image: none;
  list-style-position: outside;
  list-style-type: none;
}

figure {
  margin: 0;
}

* {
  box-sizing: border-box;
}

body {
  background: #fff;
  width: 100%;
  font-family: 'Noto Sans JP', sans-serif;
  color: #000;
  font-weight: 400;
  overflow-wrap: anywhere;
  word-break: normal;
  line-break: strict;
}

@media only screen and (max-width: 768px) {
  img {
    width: 100%;
  }
}

.pc_view {
  display: block;
}
@media only screen and (max-width: 768px) {
  .pc_view {
    display: none;
  }
}

.sp_view {
  display: none;
}
@media only screen and (max-width: 768px) {
  .sp_view {
    display: block;
  }
}

.wrapper {
  width: 100%;
  overflow: hidden;
}

.inner {
  display: block;
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
}

.frame {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  pointer-events: none;
}
.frame_top {
  display: flex;
  justify-content: space-between;
  gap: 0 190px;
  width: max(calc(100% - (160/1440*100%)), calc(100% - 160px));
  margin: min(calc(20/1440*100%), 20px) min(calc(80/1440*100%), 80px) 0;
  position: relative;
}
.frame_top:before, .frame_top:after {
  content: '';
  display: block;
  width: min(calc(60/1440*100vw), 60px);
  height: min(calc(60/1440*100vw), 60px);
  position: absolute;
  top: 0;
}
.frame_top:before {
  background: url(../images/frame/left_top.webp) no-repeat center center;
  background-size: 100% 100%;
  left: max(calc(-60/1440*100vw), -60px);
}
.frame_top:after {
  background: url(../images/frame/right_top.webp) no-repeat center center;
  background-size: 100% 100%;
  right: max(calc(-60/1440*100vw), -60px);
}
.frame_top .logo {
  display: block;
  width: 166px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  pointer-events: auto;
}
.frame_left, .frame_right {
  flex: 1;
  display: block;
  width: 100%;
  padding-top: min(calc(60/1440*100vw), 60px);
}
.frame_left {
  background: url(../images/frame/horizontal-left_top.webp) no-repeat center top;
  background-size: 100% min(calc(12/1440*100vw), 12px);
}
.frame_right {
  background: url(../images/frame/horizontal_right_top.webp) no-repeat center top;
  background-size: 100% min(calc(12/1440*100vw), 12px);
}
.frame_center {
  width: max(calc(100% - (40/1440*100%)), calc(100% - 40px));
  height: 100%;
  margin: 0 min(calc(20/1440*100%), 20px);
  position: relative;
}
.frame_center:before, .frame_center:after {
  content: '';
  display: block;
  width: min(calc(12/1440*100vw), 12px);
  height: 100%;
  position: absolute;
  top: 0;
}
.frame_center:before {
  background: url(../images/frame/vertical_left.webp) no-repeat center center;
  background-size: 100% 100%;
  left: 0;
}
.frame_center:after {
  background: url(../images/frame/vertical_right.webp) no-repeat center center;
  background-size: 100% 100%;
  right: 0;
}
.frame_bottom {
  display: block;
  background: url(../images/frame/horizontal_bottom.webp) no-repeat center bottom;
  background-size: 100% min(calc(12/1440*100vw), 12px);
  width: max(calc(100% - (160/1440*100%)), calc(100% - 160px));
  margin: 0 min(calc(80/1440*100%), 80px) min(calc(20/1440*100%), 20px);
  padding-bottom: min(calc(60/1440*100vw), 60px);
  position: relative;
}
.frame_bottom:before, .frame_bottom:after {
  content: '';
  display: block;
  width: min(calc(60/1440*100vw), 60px);
  height: min(calc(60/1440*100vw), 60px);
  position: absolute;
  bottom: 0;
}
.frame_bottom:before {
  background: url(../images/frame/left_bottom.webp) no-repeat center center;
  background-size: 100% 100%;
  left: max(calc(-60/1440*100vw), -60px);
}
.frame_bottom:after {
  background: url(../images/frame/right_bottom.webp) no-repeat center center;
  background-size: 100% 100%;
  right: max(calc(-60/1440*100vw), -60px);
}
@media only screen and (max-width: 768px) {
  .frame_top {
    gap: 0 min(calc(204/750*100vw), 204px);
    width: max(calc(100% - (152/750*100%)), calc(100% - 152px));
    margin: min(calc(16/750*100%), 16px) min(calc(76/750*100%), 76px) 0;
  }
  .frame_top:before, .frame_top:after {
    width: min(calc(60/750*100vw), 60px);
    height: min(calc(60/750*100vw), 60px);
  }
  .frame_top:before {
    left: max(calc(-60/750*100vw), -60px);
  }
  .frame_top:after {
    right: max(calc(-60/750*100vw), -60px);
  }
  .frame_top .logo {
    width: min(calc(180/750*100vw), 180px);
  }
  .frame_left, .frame_right {
    padding-top: min(calc(60/750*100vw), 60px);
  }
  .frame_left {
    background: url(../images/frame/horizontal-left_top.webp) no-repeat center top;
    background-size: 100% min(calc(12/750*100vw), 12px);
  }
  .frame_right {
    background: url(../images/frame/horizontal_right_top.webp) no-repeat center top;
    background-size: 100% min(calc(12/750*100vw), 12px);
  }
  .frame_center {
    width: max(calc(100% - (32/750*100%)), calc(100% - 32px));
    margin: 0 min(calc(16/750*100%), 16px);
  }
  .frame_center:before, .frame_center:after {
    width: min(calc(12/750*100vw), 12px);
  }
  .frame_bottom {
    background: url(../images/frame/horizontal_bottom.webp) no-repeat center bottom;
    background-size: 100% min(calc(12/750*100vw), 12px);
    width: max(calc(100% - (152/750*100%)), calc(100% - 152px));
    margin: 0 min(calc(76/750*100%), 76px) min(calc(16/750*100%), 16px);
    padding-bottom: min(calc(60/750*100vw), 60px);
  }
  .frame_bottom:before, .frame_bottom:after {
    width: min(calc(60/750*100vw), 60px);
    height: min(calc(60/750*100vw), 60px);
  }
  .frame_bottom:before {
    left: max(calc(-60/750*100vw), -60px);
  }
  .frame_bottom:after {
    right: max(calc(-60/750*100vw), -60px);
  }
}

.visual {
  padding-top: calc(760/1440*100%);
  position: relative;
  overflow: hidden;
}
.visual.adjust {
  padding-top: 100vh;
}
.visual_title {
  width: calc(809/1440*100%);
  position: absolute;
  top: calc(173/760*100%);
  left: 0;
  right: 0;
  margin: 0 auto;
  z-index: 4;
}
.visual_speech_bubble {
  display: block;
  width: calc(326/1440*100%);
  position: absolute;
  top: calc(521/760*100%);
  left: calc(790/1440*100%);
  transition: transform 0.3s 0.1s ease, opacity 0.3s 0.1s ease;
  transform: translateY(-20px);
  opacity: 0;
  z-index: 4;
}
.visual_speech_bubble.active {
  transform: translateY(0);
  opacity: 1;
}
.visual_bg {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  transition: all 0.3s ease;
}
.visual_bg_01 {
  background: #e83f3f;
}
.visual_bg_02 {
  background: #ffbb2a;
}
.visual_bg_03 {
  background: #7cbb64;
}
.visual_product {
  width: calc(703/1440*100%);
  padding-top: calc(149/1440*100%);
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  margin: 0 auto;
  z-index: 3;
}
.visual_product_anim {
  width: calc(178/703*100%);
  height: 100%;
  position: absolute;
  left: 0;
  bottom: 0;
}
.visual_product_anim li {
  width: calc(80/178*100%);
  position: absolute;
  bottom: calc(-29/149*100%);
  z-index: 10;
  transition: all 0.3s ease;
}
.visual_product_anim li:nth-of-type(2) {
  left: calc((0 / 178) * 100%);
}
.visual_product_anim li:nth-of-type(3) {
  left: calc((89 / 178) * 100%);
}
.visual_product_anim li.active {
  width: calc(303/178*100%);
  position: absolute;
  left: calc(-366/178*100%) !important;
  right: auto;
  bottom: 0;
  transform: rotate(-10deg);
  z-index: 1 !important;
}
.visual_product_fix {
  width: calc(525/703*100%);
  height: 100%;
  position: absolute;
  left: calc(178/703*100%);
  bottom: 0;
  z-index: 11;
}
.visual_product_fix li {
  width: calc(80/525*100%);
  position: absolute;
  bottom: calc(-29/149*100%);
  transition: all 0.3s ease;
}
.visual_product_fix li:nth-of-type(1) {
  left: calc((0 / 525) * 100%);
}
.visual_product_fix li:nth-of-type(2) {
  left: calc((89 / 525) * 100%);
}
.visual_product_fix li:nth-of-type(3) {
  left: calc((178 / 525) * 100%);
}
.visual_product_fix li:nth-of-type(4) {
  left: calc((267 / 525) * 100%);
}
.visual_product_fix li:nth-of-type(5) {
  left: calc((356 / 525) * 100%);
}
.visual_product_fix li:nth-of-type(6) {
  left: calc((445 / 525) * 100%);
}
.visual_img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  z-index: 2;
}
.visual_img li {
  width: calc(708/1440*100%);
  position: absolute;
  top: calc(50/760*100%);
  left: calc(1070/1440*100%);
  bottom: 0;
  margin: auto 0;
  transition: transform 0.3s ease, opacity 0.2s ease;
  transform: translateX(calc(300/1440*100%));
  opacity: 0;
}
.visual_img li.active {
  transform: translateX(0);
  opacity: 1;
}
@media only screen and (max-width: 768px) {
  .visual {
    padding-top: calc(1200/750*100%);
  }
  .visual_title {
    width: calc(642/750*100%);
    top: calc(140/1200*100%);
  }
  .visual_speech_bubble {
    width: calc(277/750*100%);
    top: calc(433/1200*100%);
    left: calc(410/750*100%);
  }
  .visual_product {
    width: calc(671/750*100%);
    max-width: 671px;
    padding-top: min(calc(122/750*100vw), 122px);
  }
  .visual_product_anim {
    width: calc(170/671*100%);
    max-width: 170px;
  }
  .visual_product_anim li {
    width: calc(76/170*100%);
    bottom: calc(-47/122*100%);
  }
  .visual_product_anim li:nth-of-type(2) {
    left: calc((0 / 170) * 100%);
  }
  .visual_product_anim li:nth-of-type(3) {
    left: calc((85 / 170) * 100%);
  }
  .visual_product_anim li.active {
    width: calc(364/170*100%);
    left: calc(-35/170*100%) !important;
    bottom: calc(-153/122*100%);
  }
  .visual_product_fix {
    width: calc(501/671*100%);
    max-width: 501px;
  }
  .visual_product_fix li {
    width: calc(76/501*100%);
    bottom: calc(-47/122*100%);
  }
  .visual_product_fix li:nth-of-type(1) {
    left: calc((0 / 501) * 100%);
  }
  .visual_product_fix li:nth-of-type(2) {
    left: calc((85 / 501) * 100%);
  }
  .visual_product_fix li:nth-of-type(3) {
    left: calc((170 / 501) * 100%);
  }
  .visual_product_fix li:nth-of-type(4) {
    left: calc((255 / 501) * 100%);
  }
  .visual_product_fix li:nth-of-type(5) {
    left: calc((340 / 501) * 100%);
  }
  .visual_product_fix li:nth-of-type(6) {
    left: calc((425 / 501) * 100%);
  }
  .visual_img li {
    width: calc(694/750*100%);
    top: auto;
    right: calc(-338/750*100%);
    left: auto;
    bottom: calc(-8/1200*100%);
  }
}

.anchor {
  background: #bc000d;
  padding: min(calc(20/1440*100vw), 20px) 0;
}
.anchor_list {
  display: flex;
  justify-content: space-between;
  width: calc(960/1440*100%);
  margin: 0 auto;
}
.anchor_list li {
  width: calc(140/960*100%);
  height: min(calc(120/1440*100vw), 120px);
}
.anchor_list li a {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #830009;
  width: 100%;
  height: 100%;
  padding: min(calc(60/1440*100vw), 60px) 0 min(calc(16/1440*100vw), 16px);
  border-radius: 5px;
  color: #fff;
  font-size: min(calc(14/1440*100vw), 14px);
  font-weight: 500;
  line-height: calc(16/14);
  text-align: center;
  position: relative;
  transition: background 0.3s ease, color 0.3s ease;
}
.anchor_list li a:before {
  content: '';
  display: block;
  width: calc(48/140*100%);
  height: calc(48/120*100%);
  position: absolute;
  top: calc(12/120*100%);
  left: 0;
  right: 0;
  margin: 0 auto;
  transition: background 0.3s ease;
}
.anchor_list li a[href*="introduction"]:before {
  background: url("../images/icon/introduction.png") no-repeat center center;
  background-size: contain;
}
.anchor_list li a[href*="weighing"]:before {
  background: url("../images/icon/weighing.png") no-repeat center center;
  background-size: contain;
}
.anchor_list li a[href*="cm"]:before {
  background: url("../images/icon/cm.png") no-repeat center center;
  background-size: contain;
}
.anchor_list li a[href*="products"]:before {
  background: url("../images/icon/products.png") no-repeat center center;
  background-size: contain;
}
.anchor_list li a[href*="recipe"]:before {
  background: url("../images/icon/recipe.png") no-repeat center center;
  background-size: contain;
}
.anchor_list li a[href*="about"]:before {
  background: url("../images/icon/about.png") no-repeat center center;
  background-size: contain;
}
.anchor_list li a:after {
  content: '';
  display: block;
  background: url("../images/icon/arrow.png") no-repeat center center;
  background-size: contain;
  width: calc(16/140*100%);
  height: calc(8/120*100%);
  position: absolute;
  left: 0;
  right: 0;
  bottom: calc(8/120*100%);
  margin: 0 auto;
  transition: background 0.3s ease;
}
.anchor_list li a:hover {
  background: #fff;
  color: #830009;
  text-decoration: none;
}
.anchor_list li a:hover[href*="introduction"]:before {
  background: url("../images/icon/introduction_red.png") no-repeat center center;
  background-size: contain;
}
.anchor_list li a:hover[href*="weighing"]:before {
  background: url("../images/icon/weighing_red.png") no-repeat center center;
  background-size: contain;
}
.anchor_list li a:hover[href*="cm"]:before {
  background: url("../images/icon/cm_red.png") no-repeat center center;
  background-size: contain;
}
.anchor_list li a:hover[href*="products"]:before {
  background: url("../images/icon/products_red.png") no-repeat center center;
  background-size: contain;
}
.anchor_list li a:hover[href*="recipe"]:before {
  background: url("../images/icon/recipe_red.png") no-repeat center center;
  background-size: contain;
}
.anchor_list li a:hover[href*="about"]:before {
  background: url("../images/icon/about_red.png") no-repeat center center;
  background-size: contain;
}
.anchor_list li a:hover:after {
  background: url("../images/icon/arrow_red.png") no-repeat center center;
  background-size: contain;
}
@media only screen and (max-width: 768px) {
  .anchor {
    padding: min(calc(40/750*100vw), 40px) 0;
  }
  .anchor_list {
    flex-wrap: wrap;
    width: min(calc(640/750*100vw), 640px);
    gap: min(calc(17/750*100vw), 17px);
  }
  .anchor_list li {
    width: min(calc(202/750*100vw), 202px);
    height: min(calc(140/750*100vw), 140px);
  }
  .anchor_list li a {
    gap: min(calc(5/750*100vw), 5px);
    padding: min(calc(61/750*100vw), 61px) 0 min(calc(20/750*100vw), 20px);
    font-size: min(calc(20/750*100vw), 20px);
    line-height: calc(24/20);
    border-radius: min(calc(5/750*100vw), 5px);
  }
  .anchor_list li a:before {
    width: calc(48/202*100%);
    height: calc(48/140*100%);
    top: calc(11/140*100%);
  }
  .anchor_list li a:after {
    width: calc(16/202*100%);
    height: calc(8/140*100%);
    bottom: calc(12/140*100%);
  }
  .anchor_list li a:hover {
    background: #830009;
    color: #fff;
  }
  .anchor_list li a:hover[href*="introduction"]:before {
    background: url("../images/icon/introduction.png") no-repeat center center;
    background-size: contain;
  }
  .anchor_list li a:hover[href*="weighing"]:before {
    background: url("../images/icon/weighing.png") no-repeat center center;
    background-size: contain;
  }
  .anchor_list li a:hover[href*="cm"]:before {
    background: url("../images/icon/cm.png") no-repeat center center;
    background-size: contain;
  }
  .anchor_list li a:hover[href*="products"]:before {
    background: url("../images/icon/products.png") no-repeat center center;
    background-size: contain;
  }
  .anchor_list li a:hover[href*="recipe"]:before {
    background: url("../images/icon/recipe.png") no-repeat center center;
    background-size: contain;
  }
  .anchor_list li a:hover[href*="about"]:before {
    background: url("../images/icon/about.png") no-repeat center center;
    background-size: contain;
  }
  .anchor_list li a:hover:after {
    background: url("../images/icon/arrow.png") no-repeat center center;
    background-size: contain;
  }
}

.introduction {
  background: #ece1a3;
  padding: min(calc(29/1440*100vw), 29px) 0 min(calc(100/1440*100vw), 100px);
  border-bottom: 1px solid #fff;
  position: relative;
  overflow: hidden;
}
.introduction_bg {
  background: url("../images/introduction_bg.gif") no-repeat center center;
  background-size: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  z-index: 0;
}
.introduction_title {
  width: calc(762/1440*100%);
  margin: 0 auto min(calc(105/1440*100vw), 105px);
  position: relative;
}
.introduction_list {
  display: flex;
  justify-content: center;
  max-width: 1440px;
  margin: 0 auto min(calc(96/1440*100vw), 96px);
}
.introduction_list li {
  width: calc(90/1440*100%);
  margin: 0 calc(11.5/1440*100%);
  transform: rotate(16deg);
}
.introduction p {
  font-size: min(calc(22/1440*100vw), 22px);
  font-weight: 500;
  line-height: calc(49/22);
  text-align: center;
  position: relative;
}
@media only screen and (max-width: 768px) {
  .introduction {
    padding: min(calc(58/750*100vw), 58px) 0 min(calc(60/750*100vw), 60px);
    border-bottom: none;
  }
  .introduction_title {
    width: calc(672/750*100%);
    margin: 0 auto min(calc(91/750*100vw), 91px);
  }
  .introduction_list {
    flex-wrap: wrap;
    width: calc(630/750*100%);
    margin: 0 auto min(calc(30/750*100vw), 30px);
  }
  .introduction_list li {
    width: calc(75/630*100%);
    margin: 0 calc(25.5/630*100%) min(calc(30/630*100vw), 30px);
  }
  .introduction_list li:nth-of-type(1) {
    margin-left: min(calc(70/630*100vw), 70px);
  }
  .introduction p {
    font-size: min(calc(32/750*100vw), 32px);
    line-height: calc(80/32);
  }
}

.weighing {
  background: linear-gradient(90deg, #8dcb85 0%, #8dcb85 50%, #74bb6b 50%, #74bb6b 100%);
  padding: min(calc(29/1440*100vw), 29px) 0 0;
  overflow: hidden;
  position: relative;
}
.weighing_title {
  width: calc(522/1440*100%);
  margin: 0 auto;
  position: relative;
  z-index: 5;
}
.weighing_item {
  padding-top: min(calc(597/1440*100vw), 597px);
  position: relative;
}
.weighing_item_tube {
  width: calc(308/1440*100%);
  position: absolute;
  left: 0;
  right: 0;
  bottom: calc(30/597*100%);
  margin: 0 auto;
  z-index: 1;
}
.weighing_item_spoon {
  width: calc(423/1440*100%);
  position: absolute;
  top: calc(76/597*100%);
  left: calc(73/1440*100%);
  z-index: 2;
}
.weighing_item_phone {
  width: calc(384/1440*100%);
  position: absolute;
  top: calc(76/597*100%);
  right: calc(118/1440*100%);
  z-index: 3;
}
.weighing_item_equal {
  width: calc(128/1440*100%);
  position: absolute;
  top: calc(269/597*100%);
  left: 0;
  right: 0;
  margin: 0 auto;
  z-index: 4;
}
@media only screen and (max-width: 768px) {
  .weighing {
    padding: min(calc(58/750*100vw), 58px) 0 0;
  }
  .weighing_title {
    width: calc(482/750*100%);
  }
  .weighing_item {
    padding-top: min(calc(526/750*100vw), 615px);
  }
  .weighing_item_tube {
    width: calc(202/750*100%);
    bottom: calc(22/526*100%);
  }
  .weighing_item_spoon {
    width: calc(261/750*100%);
    top: calc(112/526*100%);
    left: calc(40/750*100%);
  }
  .weighing_item_phone {
    width: calc(269/750*100%);
    top: calc(112/526*100%);
    right: calc(40/750*100%);
  }
  .weighing_item_equal {
    width: calc(77/750*100%);
    top: calc(332/526*100%);
  }
}

.cm {
  background: #ffbb2a;
  padding: min(calc(37/1440*100vw), 37px) 0 min(calc(121/1440*100vw), 121px);
  overflow: hidden;
  position: relative;
}
.cm_title {
  width: calc(602/1440*100%);
  margin: 0 auto min(calc(26/1440*100vw), 26px);
  position: relative;
  z-index: 4;
}
.cm_list {
  display: block;
  width: 100%;
  max-width: 1350px;
  margin: 0 auto;
  padding: 0 min(calc(80/1350*100vw), 80px);
}
.cm_list li {
  display: flex;
  flex-direction: column;
  margin-bottom: calc(100/1190*100%);
}
.cm_list li:nth-of-type(odd) {
  align-items: flex-start;
}
.cm_list li:nth-of-type(odd) .cm_list_item {
  align-items: flex-start;
}
.cm_list li:nth-of-type(even) {
  align-items: flex-end;
}
.cm_list li:nth-of-type(even) .cm_list_item {
  align-items: flex-end;
}
.cm_list li:last-of-type {
  margin-bottom: 0;
}
.cm_list li h3 {
  margin-bottom: calc(30/1190*100%);
  font-size: min(calc(42/1350*100vw), 42px);
  line-height: calc(42/26);
}
.cm_list_item {
  display: flex;
  flex-direction: column;
  width: 100%;
  position: relative;
}
.cm_list_movie {
  background: #fff;
  width: calc(819/1190*100%);
  padding-top: calc(452/1190*100%);
  border: 8px solid #fff;
  border-radius: 8px;
  position: relative;
  z-index: 10;
}
.cm_list_movie iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.cm_list_img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.cm_list_img li {
  position: absolute;
}
.cm_list-01 .cm_list_img li {
  width: calc(238/1190*100%);
  transform: rotate(9.42deg);
}
.cm_list-01 .cm_list_img li:nth-of-type(1) {
  top: calc(-20/468*100%);
  right: calc(170/1190*100%);
  z-index: 2;
}
.cm_list-01 .cm_list_img li:nth-of-type(2) {
  top: calc(-26/468*100%);
  right: calc(-25/1190*100%);
  z-index: 1;
}
.cm_list-02 .cm_list_img li {
  width: calc(268/1190*100%);
  transform: rotate(-9.42deg);
  top: calc(-110/468*100%);
  left: 0;
}
@media only screen and (max-width: 768px) {
  .cm {
    padding: min(calc(58/750*100vw), 58px) 0 min(calc(80/750*100vw), 80px);
  }
  .cm_title {
    width: calc(590/750*100%);
    margin: 0 auto min(calc(65/750*100vw), 65px);
  }
  .cm_list {
    margin: 0 auto;
    padding: 0 min(calc(40/750*100vw), 40px);
  }
  .cm_list li {
    display: block;
    margin-bottom: min(calc(65/750*100vw), 65px);
  }
  .cm_list li h3 {
    margin-bottom: min(calc(22/750*100vw), 22px);
    font-size: min(calc(32/750*100vw), 32px);
    line-height: calc(32/26);
    font-feature-settings: "palt";
  }
  .cm_list_item {
    display: block;
  }
  .cm_list_movie {
    width: 100%;
    padding-top: min(calc(369/750*100vw), 369px);
    border: min(calc(8/750*100vw), 8px) solid #fff;
    border-radius: min(calc(8/750*100vw), 8px);
  }
  .cm_list-01 .cm_list_img li {
    width: min(calc(67/750*100vw), 67px);
  }
  .cm_list-01 .cm_list_img li:nth-of-type(1) {
    top: calc(-104/750*100vw);
    right: min(calc(62/750*100vw), 62px);
  }
  .cm_list-01 .cm_list_img li:nth-of-type(2) {
    top: calc(-104/750*100vw);
    right: 0;
  }
  .cm_list-02 .cm_list_img li {
    width: min(calc(67/750*100vw), 67px);
    transform: rotate(9.42deg);
    top: calc(-104/750*100vw);
    left: auto;
    right: 0;
  }
}

.products {
  background: #e83f3f;
  padding: min(calc(29/1440*100vw), 29px) 0 min(calc(58/1440*100vw), 58px);
  overflow: hidden;
  position: relative;
}
.products_title {
  width: calc(522/1440*100%);
  margin: 0 auto min(calc(62/1440*100vw), 62px);
}
.products_list li {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  background: #ffffff;
  width: min(calc(630/1440*100vw), 630px);
  margin: 0 calc(20/1440*100%);
  padding: min(calc(48/1440*100vw), 48px) min(calc(56/1440*100vw), 56px) min(calc(39/1440*100vw), 39px) min(calc(50/1440*100vw), 50px);
  border-radius: 10px;
}
.products_list li .product {
  width: calc(140/524*100%);
}
.products_list li .detail {
  width: calc(350/524*100%);
  padding-bottom: calc(80/524*100%);
  position: relative;
}
.products_list li .detail h3 {
  margin-bottom: calc(15/524*100%);
  font-size: min(calc(24/1440*100vw), 24px);
  line-height: calc(32/24);
  white-space: nowrap;
}
.products_list li .detail p {
  font-size: min(calc(16/1440*100vw), 16px);
  font-weight: 500;
  line-height: calc(28/16);
}
.products_list li .detail a {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #bc000d;
  width: 100%;
  height: min(calc(60/1440*100vw), 60px);
  border-radius: 30px;
  color: #ffffff;
  font-size: min(calc(18/1440*100vw), 18px);
  font-weight: 600;
  line-height: 1.0;
  text-align: center;
  border: min(calc(4/1440*100vw), 4px) solid #bc000d;
  position: absolute;
  left: 0;
  bottom: 0;
  transition: background 0.3s ease, color 0.3s ease, border 0.3s ease;
}
.products_list li .detail a:hover {
  background: #ffffff;
  color: #bc000d;
  text-decoration: none;
  border: min(calc(4/1440*100vw), 4px) solid #bc000d;
}
@media only screen and (max-width: 768px) {
  .products {
    padding: min(calc(58/750*100vw), 58px) 0 min(calc(84/750*100vw), 84px);
  }
  .products_title {
    width: calc(480/750*100%);
    margin: 0 auto min(calc(91/750*100vw), 91px);
  }
  .products_list li {
    flex-direction: column;
    justify-content: flex-start;
    width: min(calc(590/750*100vw), 590px);
    margin: 0 calc(20/750*100%);
    padding: min(calc(44/750*100vw), 44px) min(calc(48/750*100vw), 48px) min(calc(48/750*100vw), 48px);
    border-radius: 5px;
  }
  .products_list li .product {
    width: calc(140/494*100%);
    margin: 0 auto calc(34/494*100%);
  }
  .products_list li .detail {
    flex: 1;
    width: 100%;
    padding-bottom: min(calc(100/750*100vw), 100px);
    position: relative;
  }
  .products_list li .detail h3 {
    margin-bottom: min(calc(20/750*100vw), 20px);
    font-size: min(calc(32/750*100vw), 32px);
    line-height: calc(44/32);
    text-align: center;
  }
  .products_list li .detail p {
    margin-bottom: min(calc(32/750*100vw), 32px);
    font-size: min(calc(28/750*100vw), 28px);
    line-height: calc(44/28);
  }
  .products_list li .detail a {
    height: min(calc(80/750*100vw), 80px);
    border-radius: 40px;
    font-size: min(calc(32/750*100vw), 32px);
    border: min(calc(6/750*100vw), 4px) solid #bc000d;
  }
  .products_list li .detail a:hover {
    background: #bc000d;
    color: #ffffff;
    border: min(calc(6/1440*100vw), 4px) solid #bc000d;
  }
}

.recipe {
  background: #f4eed6;
  padding: min(calc(29/1440*100vw), 29px) 0 min(calc(120/1440*100vw), 120px);
}
.recipe_title {
  width: calc(522/1440*100%);
  margin: 0 auto min(calc(40/1440*100vw), 40px);
}
.recipe_list_large {
  display: block;
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 min(calc(80/1120*100vw), 80px);
}
.recipe_list_large_item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: max(calc(-50/960*100vw), -50px);
}
.recipe_list_large_item:first-of-type {
  margin-top: 0;
}
.recipe_list_large_item:nth-of-type(odd) .recipe_list_large_img {
  order: 1;
}
.recipe_list_large_item:nth-of-type(odd) .recipe_list_large_img > img {
  right: 0;
}
.recipe_list_large_item:nth-of-type(odd) .recipe_list_large_notes {
  justify-content: flex-end;
  right: 0;
}
.recipe_list_large_item:nth-of-type(odd) .recipe_list_large_detail {
  order: 2;
}
.recipe_list_large_item:nth-of-type(even) .recipe_list_large_img {
  order: 2;
}
.recipe_list_large_item:nth-of-type(even) .recipe_list_large_img > img {
  left: 0;
}
.recipe_list_large_item:nth-of-type(even) .recipe_list_large_notes {
  justify-content: flex-start;
  left: 0;
}
.recipe_list_large_item:nth-of-type(even) .recipe_list_large_detail {
  order: 1;
}
.recipe_list_large_img {
  width: calc(480/960*100%);
  padding-top: calc(577/960*100%);
  position: relative;
}
.recipe_list_large_img > img {
  width: auto;
  max-width: inherit;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
}
.recipe_list_large_notes {
  display: flex;
  align-items: flex-end;
  width: 100%;
  position: absolute;
  bottom: 0;
}
.recipe_list_large_notes li {
  margin: calc(4/480*100%);
}
.recipe_list_large_notes li.technique {
  width: calc(89/480*100%);
}
.recipe_list_large_notes li.min {
  width: calc(63/480*100%);
}
.recipe_list_large_notes li.tube {
  width: calc(71/480*100%);
}
.recipe_list_large_detail {
  width: calc(400/960*100%);
}
.recipe_list_large_detail h3 {
  margin-bottom: calc(32/400*100%);
}
.recipe_list_large_detail h3 img {
  width: auto;
  height: min(calc(44/1120*100vw), 44px);
}
.recipe_list_large_detail p {
  margin-bottom: calc(34/400*100%);
  font-size: min(calc(18/1120*100vw), 18px);
  font-weight: 500;
  line-height: calc(32/18);
}
.recipe_list_large_detail a {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #bc000d;
  width: calc(290/400*100%);
  height: min(calc(60/1120*100vw), 60px);
  border: min(calc(4/1440*100vw), 4px) solid #bc000d;
  border-radius: 30px;
  color: #ffffff;
  font-size: min(calc(18/1120*100vw), 18px);
  font-weight: 600;
  line-height: 1.0;
  text-align: center;
  transition: background 0.3s ease, color 0.3s ease, border 0.3s ease;
}
.recipe_list_large_detail a:hover {
  background: #ffffff;
  color: #bc000d;
  text-decoration: none;
  border: min(calc(4/1440*100vw), 4px) solid #bc000d;
}
.recipe_list_small {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  max-width: 1154px;
  margin: min(calc(90/1154*100vw), 80px) auto 0;
  padding: 0 min(calc(80/1154*100vw), 80px);
}
.recipe_list_small_item {
  width: calc(290/994*100%);
  margin-right: calc(62/994*100%);
  margin-bottom: calc(133/994*100%);
  padding-bottom: calc(80/994*100%);
  position: relative;
}
.recipe_list_small_item:nth-of-type(3n) {
  margin-right: 0;
}
.recipe_list_small_img {
  background: url("../images/recipe_bg.jpg") no-repeat center center;
  background-size: cover;
  margin-bottom: calc(30/290*100%);
  padding-top: calc(290/290*100%);
  position: relative;
}
.recipe_list_small_img > div {
  display: flex;
  justify-content: center;
  align-items: center;
  width: calc(314/290*100%);
  height: 100%;
  position: absolute;
  top: 0;
  left: calc(-12/290*100%);
}
.recipe_list_small_notes_top, .recipe_list_small_notes_bottom {
  display: flex;
  align-items: flex-end;
  width: 100%;
  position: absolute;
}
.recipe_list_small_notes_top li, .recipe_list_small_notes_bottom li {
  margin: calc(2/290*100%);
}
.recipe_list_small_notes_top li.technique, .recipe_list_small_notes_bottom li.technique {
  width: calc(89/290*100%);
}
.recipe_list_small_notes_top li.min, .recipe_list_small_notes_bottom li.min {
  width: calc(63/290*100%);
}
.recipe_list_small_notes_top li.tube, .recipe_list_small_notes_bottom li.tube {
  width: calc(35/290*100%);
}
.recipe_list_small_notes_top {
  justify-content: flex-end;
  top: calc(-18/290*100%);
  right: calc(-15/290*100%);
}
.recipe_list_small_notes_bottom {
  justify-content: flex-start;
  left: calc(-17/290*100%);
  bottom: calc(-12/290*100%);
}
.recipe_list_small_detail {
  width: 100%;
}
.recipe_list_small_detail h3 {
  margin-bottom: calc(20/290*100%);
  text-align: center;
}
.recipe_list_small_detail h3 img {
  width: auto;
  height: min(calc(25/1154*100vw), 25px);
}
.recipe_list_small_detail p {
  font-size: min(calc(18/1154*100vw), 18px);
  font-weight: 500;
  line-height: calc(32/18);
  text-align: center;
}
.recipe_list_small_detail a {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #bc000d;
  width: 100%;
  height: min(calc(60/1154*100vw), 60px);
  border: min(calc(4/1440*100vw), 4px) solid #bc000d;
  border-radius: 30px;
  color: #ffffff;
  font-size: min(calc(18/1154*100vw), 18px);
  font-weight: 600;
  line-height: calc(22/18);
  text-align: center;
  position: absolute;
  left: 0;
  bottom: 0;
  transition: background 0.3s ease, color 0.3s ease, border 0.3s ease;
}
.recipe_list_small_detail a:hover {
  background: #ffffff;
  color: #bc000d;
  text-decoration: none;
  border: min(calc(4/1440*100vw), 4px) solid #bc000d;
}
.recipe_banner {
  display: block;
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
  margin-top: max(calc(-50/1120*100vw), -50px);
}
.recipe_banner p {
  margin-bottom: calc(44/1120*100%);
  font-size: min(calc(22/1120*100vw), 22px);
  font-weight: 500;
  line-height: calc(50/22);
  text-align: center;
}
.recipe_banner a {
  display: block;
  width: calc(960/1120*100%);
  margin: 0 auto;
  transition: opacity 0.3s ease;
}
.recipe_banner a:hover {
  opacity: 0.7;
}
@media only screen and (max-width: 768px) {
  .recipe_banner a:hover {
    opacity: 1.0;
  }
}
@media only screen and (max-width: 768px) {
  .recipe {
    padding: min(calc(58/750*100vw), 58px) 0 min(calc(80/750*100vw), 80px);
  }
  .recipe_title {
    width: calc(480/750*100%);
    margin: 0 auto min(calc(120/750*100vw), 120px);
  }
  .recipe_list_large {
    padding: 0 min(calc(80/750*100vw), 80px);
  }
  .recipe_list_large_item {
    display: block;
    margin-top: 0;
    margin-bottom: min(calc(90/750*100vw), 90px);
  }
  .recipe_list_large_item:nth-of-type(odd) .recipe_list_large_img > img {
    right: calc(-25/590*100%);
  }
  .recipe_list_large_item:nth-of-type(even) .recipe_list_large_img > img {
    left: calc(-25/590*100%);
  }
  .recipe_list_large_img {
    width: 100%;
    margin-bottom: calc(80/590*100%);
    padding-top: 100%;
  }
  .recipe_list_large_notes {
    bottom: calc(-30/590*100%);
  }
  .recipe_list_large_notes li {
    margin: calc(5/590*100%);
  }
  .recipe_list_large_notes li.technique {
    width: calc(107/590*100%);
  }
  .recipe_list_large_notes li.min {
    width: calc(76/590*100%);
  }
  .recipe_list_large_notes li.tube {
    width: calc(88/590*100%);
  }
  .recipe_list_large_detail {
    width: 100%;
  }
  .recipe_list_large_detail h3 {
    margin-bottom: calc(50/590*100%);
    text-align: center;
  }
  .recipe_list_large_detail h3 img {
    height: min(calc(50/750*100vw), 50px);
  }
  .recipe_list_large_detail p {
    margin-bottom: calc(50/590*100%);
    font-size: min(calc(28/750*100vw), 28px);
    font-weight: 500;
    line-height: calc(45/28);
  }
  .recipe_list_large_detail a {
    width: 100%;
    height: min(calc(80/750*100vw), 80px);
    border: min(calc(6/750*100vw), 4px) solid #bc000d;
    border-radius: 40px;
    font-size: min(calc(32/750*100vw), 32px);
  }
  .recipe_list_large_detail a:hover {
    background: #bc000d;
    color: #ffffff;
    border: min(calc(6/750*100vw), 4px) solid #bc000d;
  }
  .recipe_list_small {
    display: block;
    width: 100%;
    margin: min(calc(160/750*100vw), 160px) auto 0;
    padding: 0 min(calc(80/750*100vw), 80px);
  }
  .recipe_list_small_item {
    width: 100%;
    margin: 0;
    margin-bottom: min(calc(160/750*100vw), 160px);
    padding-bottom: calc(150/590*100%);
  }
  .recipe_list_small_img {
    margin-bottom: calc(66/590*100%);
    padding-top: calc(590/590*100%);
  }
  .recipe_list_small_img > div {
    width: calc(664/590*100%);
    left: calc(-37/590*100%);
  }
  .recipe_list_small_notes_top li, .recipe_list_small_notes_bottom li {
    margin: calc(5/590*100%);
  }
  .recipe_list_small_notes_top li.technique, .recipe_list_small_notes_bottom li.technique {
    width: calc(107/590*100%);
  }
  .recipe_list_small_notes_top li.min, .recipe_list_small_notes_bottom li.min {
    width: calc(76/590*100%);
  }
  .recipe_list_small_notes_top li.tube, .recipe_list_small_notes_bottom li.tube {
    width: calc(72/590*100%);
  }
  .recipe_list_small_notes_top {
    top: calc(-42/590*100%);
    right: calc(-40/590*100%);
  }
  .recipe_list_small_notes_bottom {
    left: calc(-34/590*100%);
    bottom: calc(-24/590*100%);
  }
  .recipe_list_small_detail {
    width: 100%;
  }
  .recipe_list_small_detail h3 {
    margin-bottom: calc(30/590*100%);
    text-align: center;
  }
  .recipe_list_small_detail h3 img {
    height: min(calc(50/750*100vw), 50px);
  }
  .recipe_list_small_detail p {
    font-size: min(calc(28/750*100vw), 28px);
    font-weight: 500;
    line-height: calc(45/28);
    text-align: left;
  }
  .recipe_list_small_detail a {
    width: 100%;
    height: min(calc(80/750*100vw), 80px);
    border: min(calc(6/750*100vw), 4px) solid #bc000d;
    border-radius: 40px;
    font-size: min(calc(32/750*100vw), 32px);
    line-height: calc(34/32);
  }
  .recipe_list_small_detail a:hover {
    background: #bc000d;
    color: #ffffff;
    border: min(calc(6/750*100vw), 4px) solid #bc000d;
  }
  .recipe_banner p {
    margin-bottom: calc(50/750*100%);
    font-size: min(calc(32/750*100vw), 32px);
    line-height: calc(80/32);
  }
  .recipe_banner a {
    width: calc(670/750*100%);
  }
}

.about {
  background: #a60000;
  padding: min(calc(66/960*100vw), 66px) 0;
}
.about .inner {
  max-width: 1120px;
}
.about_box {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto;
  padding: 0 calc(80/1120*100%);
}
.about_logo {
  width: calc(329/960*100%);
}
.about_detail {
  width: calc(585/960*100%);
}
.about_detail h3 {
  max-width: calc(437/585*100%);
  margin-bottom: calc(33/960*100%);
}
.about_detail p {
  color: #ffffff;
  font-size: min(calc(18/960*100vw), 18px);
  font-weight: 500;
  line-height: calc(34/18);
}
.about_detail a {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #ffffff;
  width: calc(350/585*100%);
  height: min(calc(60/1120*100vw), 60px);
  margin-top: calc(35/585*100%);
  border: min(calc(4/1440*100vw), 4px) solid #ffffff;
  border-radius: 30px;
  color: #bc000d;
  font-size: min(calc(18/1120*100vw), 18px);
  font-weight: 700;
  line-height: 1.0;
  text-align: center;
  transition: background 0.3s ease, color 0.3s ease, border 0.3s ease;
}
.about_detail a:hover {
  background: #ffbb2a;
  color: #000000;
  text-decoration: none;
  border: min(calc(4/1440*100vw), 4px) solid #ffbb2a;
}
@media only screen and (max-width: 768px) {
  .about {
    padding: min(calc(80/750*100vw), 80px) 0;
  }
  .about_box {
    flex-direction: column;
    padding: 0 calc(80/750*100%);
  }
  .about_logo {
    width: calc(468/590*100%);
    margin-bottom: calc(64/590*100%);
  }
  .about_detail {
    width: 100%;
  }
  .about_detail h3 {
    max-width: calc(567/590*100%);
    margin: 0 auto calc(64/590*100%);
  }
  .about_detail p {
    font-size: min(calc(28/750*100vw), 28px);
    line-height: calc(44/28);
  }
  .about_detail a {
    width: 100%;
    height: min(calc(80/750*100vw), 80px);
    margin-top: calc(50/567*100%);
    border: min(calc(6/750*100vw), 4px) solid #ffffff;
    border-radius: 40px;
    font-size: min(calc(32/750*100vw), 32px);
  }
  .about_detail a:hover {
    background: #ffffff;
    color: #bc000d;
    border: min(calc(6/750*100vw), 4px) solid #ffffff;
  }
}

.footer {
  background: #ffffff;
  padding: 54px 0;
  text-align: center;
}
.footer_sns {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0 20px;
  margin: 30px auto 40px;
}
.footer_sns li {
  width: 25px;
}
.footer_sns a {
  display: block;
  transition: opacity 0.3s ease;
}
.footer_sns a:hover {
  opacity: 0.7;
}
@media only screen and (max-width: 768px) {
  .footer_sns a:hover {
    opacity: 1.0;
  }
}
.footer_copyright {
  margin-bottom: 16px;
  font-family: 'Noto Sans JP', sans-serif;
  color: #000000;
  font-size: 16px;
}
.footer_logo {
  width: 157px;
  margin: 0 auto;
}
@media only screen and (max-width: 768px) {
  .footer_inner {
    padding: 12.82051% 5.12821%;
  }
  .footer_sns {
    gap: 0 5.69801%;
    margin: 13.57143% auto 5%;
  }
  .footer_sns li {
    width: 7.12251%;
  }
  .footer_copyright {
    margin-bottom: 4.2735%;
    font-size: 3.07692vw;
  }
  .footer_logo {
    width: 44.72934%;
  }
}

.swiper {
  padding-bottom: min(calc(66/1440*100vw), 66px);
}
.swiper .swiper-pagination {
  top: auto;
  bottom: 0;
}
.swiper .swiper-pagination .swiper-pagination-bullet {
  background: #ffffff;
  width: min(calc(24/1440*100vw), 24px);
  height: min(calc(24/1440*100vw), 24px);
  margin: 0 min(calc(8/1440*100vw), 8px);
  vertical-align: middle;
  border: min(calc(4/1440*100vw), 4px) solid #e83f3f;
  opacity: 1;
  transition: background 0.3s ease, border 0.3s ease;
}
.swiper .swiper-pagination .swiper-pagination-bullet-active {
  background: none;
  border: min(calc(4/1440*100vw), 4px) solid #ffffff;
}
@media only screen and (max-width: 768px) {
  .swiper {
    padding-bottom: min(calc(110/750*100vw), 110px);
  }
  .swiper .swiper-pagination .swiper-pagination-bullet {
    width: min(calc(32/750*100vw), 24px);
    height: min(calc(32/750*100vw), 24px);
    margin: 0 min(calc(14/750*100vw), 14px);
    border: min(calc(6/750*100vw), 6px) solid #e83f3f;
  }
  .swiper .swiper-pagination .swiper-pagination-bullet-active {
    border: min(calc(6/750*100vw), 6px) solid #ffffff;
  }
}

.fade-in {
  transition: opacity 0.3s ease;
  opacity: 0;
}
.fade-in.anim {
  opacity: 1;
}

.slide-up {
  transition: transform 0.3s ease, opacity 0.3s ease;
  transform: translateY(30px);
  opacity: 0;
}
.slide-up.anim {
  transform: translateY(0);
  opacity: 1;
}

.visual {
  transition: opacity 0.3s ease;
  opacity: 0;
}
@keyframes bounce-visual {
  0% {
    transform: scale(2);
  }
  50% {
    transform: scale(0.95);
  }
  75% {
    transform: scale(1.15);
  }
  100% {
    transform: scale(1);
  }
}
.visual .visual_title {
  transition: opacity 0.3s 0.3s ease;
  opacity: 0;
}
.visual.anim {
  opacity: 1;
}
.visual.anim .visual_title {
  opacity: 1;
  animation: bounce-visual 0.4s 0.3s ease-out;
}

.anchor {
  transition: opacity 0.3s ease;
  opacity: 0;
}
.anchor.anim {
  opacity: 1;
}

.introduction {
  transition: opacity 0.3s ease;
  opacity: 0;
}
.introduction .introduction_list {
  transition: opacity 0.3s 0.3s ease, transform 0.3s 0.3s ease;
  opacity: 0;
  transform: scale(0.4);
}
@keyframes bounce-introduction {
  0% {
    transform: rotate(16deg) scale(0.2);
  }
  50% {
    transform: rotate(16deg) scale(1);
  }
  75% {
    transform: rotate(16deg) scale(0.95);
  }
  100% {
    transform: rotate(16deg) scale(1);
  }
}
.introduction .introduction_list li {
  transition: opacity 0.3s ease;
  opacity: 0;
}
.introduction .introduction_list li:nth-of-type(1) {
  transition-delay: 0s;
}
.introduction .introduction_list li:nth-of-type(2) {
  transition-delay: 0.05s;
}
.introduction .introduction_list li:nth-of-type(3) {
  transition-delay: 0.1s;
}
.introduction .introduction_list li:nth-of-type(4) {
  transition-delay: 0.15s;
}
.introduction .introduction_list li:nth-of-type(5) {
  transition-delay: 0.2s;
}
.introduction .introduction_list li:nth-of-type(6) {
  transition-delay: 0.25s;
}
.introduction .introduction_list li:nth-of-type(7) {
  transition-delay: 0.3s;
}
.introduction .introduction_list li:nth-of-type(8) {
  transition-delay: 0.35s;
}
.introduction .introduction_list li:nth-of-type(9) {
  transition-delay: 0.4s;
}
.introduction .introduction_list li:nth-of-type(10) {
  transition-delay: 0.45s;
}
.introduction.anim {
  opacity: 1;
}
.introduction.anim .introduction_list {
  opacity: 1;
  transform: scale(1);
}
.introduction.anim .introduction_list li {
  opacity: 1;
  animation: bounce-introduction 0.4s ease-out;
}
.introduction.anim .introduction_list li:nth-of-type(1) {
  animation-delay: 0s;
}
.introduction.anim .introduction_list li:nth-of-type(2) {
  animation-delay: 0.05s;
}
.introduction.anim .introduction_list li:nth-of-type(3) {
  animation-delay: 0.1s;
}
.introduction.anim .introduction_list li:nth-of-type(4) {
  animation-delay: 0.15s;
}
.introduction.anim .introduction_list li:nth-of-type(5) {
  animation-delay: 0.2s;
}
.introduction.anim .introduction_list li:nth-of-type(6) {
  animation-delay: 0.25s;
}
.introduction.anim .introduction_list li:nth-of-type(7) {
  animation-delay: 0.3s;
}
.introduction.anim .introduction_list li:nth-of-type(8) {
  animation-delay: 0.35s;
}
.introduction.anim .introduction_list li:nth-of-type(9) {
  animation-delay: 0.4s;
}
.introduction.anim .introduction_list li:nth-of-type(10) {
  animation-delay: 0.45s;
}

@keyframes bounce-weighing {
  0% {
    transform: scale(2);
  }
  50% {
    transform: scale(0.95);
  }
  75% {
    transform: scale(1.15);
  }
  100% {
    transform: scale(1);
  }
}
.weighing_item .weighing_item_tube {
  transition: transform 0.6s 0.3s ease;
  transform: translateY(calc(314/597*100%));
}
.weighing_item .weighing_item_spoon {
  transition: opacity 0.3s 1.0s ease, transform 0.3s 1.0s ease-out;
  transform: translateY(200px);
  opacity: 0;
}
.weighing_item .weighing_item_phone {
  transition: opacity 0.3s 1.1s ease, transform 0.3s 1.1s ease-out;
  transform: translateY(200px);
  opacity: 0;
}
.weighing_item .weighing_item_equal {
  transition: opacity 0.3s 1.4s ease;
  opacity: 0;
}
.weighing_item.anim .weighing_item_tube {
  transform: translateY(0);
}
.weighing_item.anim .weighing_item_spoon {
  transform: translateY(0);
  opacity: 1;
}
.weighing_item.anim .weighing_item_phone {
  transform: translateY(0);
  opacity: 1;
}
.weighing_item.anim .weighing_item_equal {
  opacity: 1;
  animation: bounce-weighing 0.3s 1.4s ease-out;
}

.cm_list .cm_list-01 h3 {
  transition: opacity 0.3s ease, transform 0.3s ease;
  opacity: 0;
  transform: translateX(60px);
}
.cm_list .cm_list-01 .cm_list_movie {
  transition: opacity 0.3s ease, transform 0.3s ease;
  opacity: 0;
  transform: translateX(60px);
}
.cm_list .cm_list-01 .cm_list_img li:nth-of-type(1), .cm_list .cm_list-01 .cm_list_img li:nth-of-type(2) {
  opacity: 0;
  transform: rotate(0) translateX(-60px);
}
.cm_list .cm_list-01 .cm_list_img li:nth-of-type(1) {
  transition: opacity 0.3s 0s ease, transform 0.3s 0s ease;
}
.cm_list .cm_list-01 .cm_list_img li:nth-of-type(2) {
  transition: opacity 0.3s 0.1s ease, transform 0.3s 0.1s ease;
}
.cm_list .cm_list-01.anim h3,
.cm_list .cm_list-01.anim .cm_list_movie {
  opacity: 1;
  transform: translateX(0);
}
.cm_list .cm_list-01.anim .cm_list_img li:nth-of-type(1), .cm_list .cm_list-01.anim .cm_list_img li:nth-of-type(2) {
  opacity: 1;
  transform: rotate(9.42deg) translateX(0);
}
.cm_list .cm_list-02 h3 {
  transition: opacity 0.3s ease, transform 0.3s ease;
  opacity: 0;
  transform: translateX(-60px);
}
.cm_list .cm_list-02 .cm_list_movie {
  transition: opacity 0.3s ease, transform 0.3s ease;
  opacity: 0;
  transform: translateX(-60px);
}
.cm_list .cm_list-02 .cm_list_img li {
  transition: opacity 0.3s ease, transform 0.3s ease;
  opacity: 0;
  transform: rotate(0) translateX(60px);
}
.cm_list .cm_list-02.anim h3,
.cm_list .cm_list-02.anim .cm_list_movie {
  opacity: 1;
  transform: translateX(0);
}
.cm_list .cm_list-02.anim .cm_list_img li {
  opacity: 1;
  transform: rotate(-9.42deg) translateX(0);
}
@media only screen and (max-width: 768px) {
  .cm_list .cm_list-01 h3 {
    transform: translateY(30px);
  }
  .cm_list .cm_list-01 .cm_list_movie {
    transform: translateY(30px);
  }
  .cm_list .cm_list-01 .cm_list_img li:nth-of-type(1), .cm_list .cm_list-01 .cm_list_img li:nth-of-type(2) {
    transform: rotate(9.42deg) translateY(-30px);
  }
  .cm_list .cm_list-01.anim h3,
  .cm_list .cm_list-01.anim .cm_list_movie {
    transform: translateY(0);
  }
  .cm_list .cm_list-01.anim .cm_list_img li:nth-of-type(1), .cm_list .cm_list-01.anim .cm_list_img li:nth-of-type(2) {
    transform: rotate(9.42deg) translateY(0);
  }
  .cm_list .cm_list-02 h3 {
    transform: translateY(30px);
  }
  .cm_list .cm_list-02 .cm_list_movie {
    transform: translateY(30px);
  }
  .cm_list .cm_list-02 .cm_list_img li {
    transform: rotate(9.42deg) translateY(-30px);
  }
  .cm_list .cm_list-02.anim h3,
  .cm_list .cm_list-02.anim .cm_list_movie {
    transform: translateY(0);
  }
  .cm_list .cm_list-02.anim .cm_list_img li {
    transform: rotate(9.42deg) translateY(0);
  }
}

.products_list li {
  transition: opacity 0.3s ease;
  opacity: 0;
}
.products_list li:nth-of-type(1) {
  transition-delay: 0s;
}
.products_list li:nth-of-type(2) {
  transition-delay: 0.1s;
}
.products_list li:nth-of-type(3) {
  transition-delay: 0.2s;
}
.products_list li:nth-of-type(4) {
  transition-delay: 0.3s;
}
.products_list li:nth-of-type(5) {
  transition-delay: 0.4s;
}
.products_list li:nth-of-type(6) {
  transition-delay: 0.5s;
}
.products_list li:nth-of-type(7) {
  transition-delay: 0.6s;
}
.products_list li:nth-of-type(8) {
  transition-delay: 0.7s;
}
.products_list li:nth-of-type(9) {
  transition-delay: 0.8s;
}
.products_list li:nth-of-type(10) {
  transition-delay: 0.9s;
}
.products_list.anim li {
  opacity: 1;
}

.recipe_list_large_item {
  transition: opacity 0.3s ease;
  opacity: 0;
}
.recipe_list_large_item > div:first-of-type {
  transition: transform 0.3s ease, opacity 0.3s ease;
  transform: translateX(60px);
  opacity: 0;
}
.recipe_list_large_item > div:last-of-type {
  transition: transform 0.3s ease, opacity 0.3s ease;
  transform: translateX(-60px);
  opacity: 0;
}
.recipe_list_large_item.anim {
  opacity: 1;
}
.recipe_list_large_item.anim > div:first-of-type {
  transition: transform 0.3s ease, opacity 0.3s ease;
  transform: translateX(0);
  opacity: 1;
}
.recipe_list_large_item.anim > div:last-of-type {
  transition: transform 0.3s ease, opacity 0.3s ease;
  transform: translateX(0);
  opacity: 1;
}
@media only screen and (max-width: 768px) {
  .recipe_list_large_item:nth-of-type(even) > div:first-of-type {
    transition: transform 0.3s ease, opacity 0.3s ease;
    transform: translateX(-60px);
    opacity: 0;
  }
  .recipe_list_large_item:nth-of-type(even) > div:last-of-type {
    transition: transform 0.3s ease, opacity 0.3s ease;
    transform: translateX(60px);
    opacity: 0;
  }
  .recipe_list_large_item:nth-of-type(even).anim {
    opacity: 1;
  }
  .recipe_list_large_item:nth-of-type(even).anim > div:first-of-type {
    transition: transform 0.3s ease, opacity 0.3s ease;
    transform: translateX(0);
    opacity: 1;
  }
  .recipe_list_large_item:nth-of-type(even).anim > div:last-of-type {
    transition: transform 0.3s ease, opacity 0.3s ease;
    transform: translateX(0);
    opacity: 1;
  }
}

.recipe_list_small_item {
  transition: transform 0.3s ease, opacity 0.3s ease;
  transform: translateY(30px);
  opacity: 0;
}
.recipe_list_small_item.anim {
  transform: translateY(0);
  opacity: 1;
}