@charset "UTF-8";
/* media query
------------------------------------------ */
/* display
------------------------------------------ */
.is-show-pc {
  display: block;
}
@media (max-width: 767px) {
  .is-show-pc {
    display: none;
  }
}

.is-show-sp {
  display: none;
}
@media (max-width: 767px) {
  .is-show-sp {
    display: block;
  }
}

/* function
------------------------------------------ */
.main-area {
  overflow: clip;
}

/* media query
------------------------------------------ */
/* display
------------------------------------------ */
.is-show-pc {
  display: block;
}
@media (max-width: 767px) {
  .is-show-pc {
    display: none;
  }
}

.is-show-sp {
  display: none;
}
@media (max-width: 767px) {
  .is-show-sp {
    display: block;
  }
}

#em251017protein {
  /* mixin
  ------------------------------------------ */
  /* reset
  ------------------------------------------ */
  /* animation
  ------------------------------------------ */
  /* 共通
  ------------------------------------------ */
  /* LP style
  ------------------------------------------ */
  font-size: calc(16.1 * 100vw / 1400);
  line-height: 1.97204969;
  letter-spacing: 0.025em;
  color: #3f3a3a;
  background-color: #e3e1d8;
}
#em251017protein img {
  width: 100%;
  height: auto;
}
#em251017protein * {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
#em251017protein .js-fade-in {
  opacity: 0;
  -webkit-transition: opacity 1.2s, -webkit-transform 1.2s;
  transition: opacity 1.2s, -webkit-transform 1.2s;
  transition: opacity 1.2s, transform 1.2s;
  transition: opacity 1.2s, transform 1.2s, -webkit-transform 1.2s;
  -webkit-transform: translateY(50px);
          transform: translateY(50px);
}
#em251017protein .js-fade-in.is-active {
  opacity: 1;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}
#em251017protein .change-img {
  z-index: -1;
}
#em251017protein .change-img.-active {
  z-index: 1;
  opacity: 1;
  --s: 1;
}
#em251017protein .change-img.-hide {
  opacity: 1;
  -webkit-transition: none;
  transition: none;
  z-index: 2;
  --s: 1;
  --x: -152.17391304347828%;
  --y: 165.71428571428572%;
  -webkit-animation: cp 1s ease-out forwards;
          animation: cp 1s ease-out forwards;
}
#em251017protein .change-img img {
  -o-object-fit: cover;
     object-fit: cover;
  -webkit-transition: -webkit-transform 1s ease-out;
  transition: -webkit-transform 1s ease-out;
  transition: transform 1s ease-out;
  transition: transform 1s ease-out, -webkit-transform 1s ease-out;
  -webkit-transform: scale(var(--s, 1));
          transform: scale(var(--s, 1));
}
#em251017protein .change-img.-no-transition img {
  -webkit-transition: none;
  transition: none;
}
@-webkit-keyframes cp {
  0% {
    clip-path: polygon(var(--x) 0, 100% var(--y), 100% 0);
  }
  to {
    clip-path: polygon(100% 0, 100% 0, 100% 0);
  }
}
@keyframes cp {
  0% {
    clip-path: polygon(var(--x) 0, 100% var(--y), 100% 0);
  }
  to {
    clip-path: polygon(100% 0, 100% 0, 100% 0);
  }
}
#em251017protein .section {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media (max-width: 767px) {
  #em251017protein .section {
    display: block;
  }
}
#em251017protein .section-cont {
  width: 50%;
}
@media (max-width: 767px) {
  #em251017protein .section-cont {
    width: 100%;
  }
}
#em251017protein .section-ttl {
  font-size: calc(22.68 * 100vw / 1400);
  font-weight: bold;
  color: #fff;
  line-height: 1.69973545;
  letter-spacing: 0.025em;
  text-align: center;
}
@media (max-width: 767px) {
  #em251017protein .section-ttl {
    font-size: calc(28.35 * 100vw / 750);
    line-height: 1.69982363;
    text-align: left;
  }
}
#em251017protein .section-txt {
  font-size: calc(14.74 * 100vw / 1400);
  line-height: 1.86702849;
  letter-spacing: 0.05em;
  color: #fff;
  text-align: center;
}
@media (max-width: 767px) {
  #em251017protein .section-txt {
    font-size: calc(18.43 * 100vw / 750);
    line-height: 1.86652198;
    text-align: left;
  }
}
#em251017protein .section-photo {
  width: 50%;
  overflow: hidden;
  height: calc(900 * 100vw / 1400);
}
#em251017protein .section-photo img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: calc(900 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .section-photo img {
    -o-object-fit: fill;
       object-fit: fill;
    height: auto;
  }
}
@media (max-width: 767px) {
  #em251017protein .section-photo {
    width: 100%;
    height: calc(1050 * 100vw / 750);
  }
}
#em251017protein .section-photo-01 {
  position: absolute;
  z-index: 3;
  width: calc(300 * 100vw / 1400);
  top: calc(-207 * 100vw / 1400);
  left: calc(470 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .section-photo-01 {
    top: calc(862 * 100vw / 750);
    left: auto;
    right: calc(50 * 100vw / 750);
    width: calc(360 * 100vw / 750);
  }
}
#em251017protein .section-photo-02 {
  position: absolute;
  z-index: 2;
  width: calc(300 * 100vw / 1400);
  top: calc(782 * 100vw / 1400);
  left: calc(354 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .section-photo-02 {
    top: calc(1434 * 100vw / 750);
    left: calc(0 * 100vw / 750);
    width: calc(360 * 100vw / 750);
  }
}
#em251017protein .section-photo-03 {
  position: absolute;
  z-index: 1;
  width: calc(240 * 100vw / 1400);
  top: calc(620 * 100vw / 1400);
  left: calc(607 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .section-photo-03 {
    top: calc(1730 * 100vw / 750);
    left: calc(314 * 100vw / 750);
    width: calc(240 * 100vw / 750);
  }
}
#em251017protein .section-photo-04 {
  position: absolute;
  z-index: 1;
  width: calc(296 * 100vw / 1400);
  top: calc(1551 * 100vw / 1400);
  left: calc(441 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .section-photo-04 {
    top: calc(1420 * 100vw / 750);
    left: calc(44 * 100vw / 750);
    width: calc(296 * 100vw / 750);
  }
}
#em251017protein .section-photo-05 {
  position: absolute;
  z-index: 1;
  width: calc(296 * 100vw / 1400);
  top: calc(665 * 100vw / 1400);
  right: calc(35 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .section-photo-05 {
    top: calc(830 * 100vw / 750);
    right: auto;
    left: calc(60 * 100vw / 750);
    width: calc(296 * 100vw / 750);
  }
}
@media (max-width: 767px) {
  #em251017protein {
    font-size: calc(20.13 * 100vw / 750);
    line-height: 1.96870343;
  }
}
#em251017protein .mv-photo {
  display: block;
  width: 100%;
  height: 100vh;
  background-color: #fff;
}
@media (max-width: 767px) {
  #em251017protein .mv-photo {
    height: calc(1050 * 100vw / 750);
  }
}
#em251017protein .mv-photo-01 {
  position: sticky;
  top: 0;
  background: url("../img/mv_pc_01.jpg");
  background-size: cover;
  background-position: top center;
  background-repeat: no-repeat;
}
@media (max-width: 767px) {
  #em251017protein .mv-photo-01 {
    background: url("../img/mv_sp_01.jpg");
    background-size: cover;
    background-repeat: no-repeat;
  }
}
#em251017protein .mv-photo-02 {
  position: relative;
  background: url("../img/mv_pc_02.jpg");
  background-size: cover;
  background-position: top center;
  background-repeat: no-repeat;
}
#em251017protein .mv-photo-02 a {
  display: block;
  width: 100%;
  height: 100%;
}
@media (max-width: 767px) {
  #em251017protein .mv-photo-02 {
    background: url("../img/mv_sp_02.jpg");
    background-size: cover;
    background-repeat: no-repeat;
  }
}
#em251017protein .mv-photo-03 {
  display: none;
}
@media (max-width: 767px) {
  #em251017protein .mv-photo-03 {
    position: sticky;
    top: 0;
    display: block;
    background: url("../img/mv_sp_03.jpg");
    background-size: cover;
    background-repeat: no-repeat;
  }
}
#em251017protein .mv-photo-04 {
  display: none;
}
@media (max-width: 767px) {
  #em251017protein .mv-photo-04 {
    position: relative;
    display: block;
    background: url("../img/mv_sp_04.jpg");
    background-size: cover;
    background-repeat: no-repeat;
  }
}
#em251017protein .hero {
  padding: calc(139 * 100vw / 1400) 0 calc(189 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .hero {
    padding: calc(76 * 100vw / 750) 0 calc(130 * 100vw / 750);
  }
}
#em251017protein .hero-ttl {
  position: relative;
  left: calc(-3 * 100vw / 1400);
  width: calc(439 * 100vw / 1400);
  margin: 0 auto;
}
@media (max-width: 767px) {
  #em251017protein .hero-ttl {
    left: 0;
    width: calc(549 * 100vw / 750);
  }
}
#em251017protein .hero-txt {
  width: calc(513 * 100vw / 1400);
  margin: calc(47 * 100vw / 1400) auto 0;
}
@media (max-width: 767px) {
  #em251017protein .hero-txt {
    width: calc(641 * 100vw / 750);
    margin: calc(58 * 100vw / 750) auto 0;
  }
}
#em251017protein .hero-product {
  position: relative;
  left: calc(-71 * 100vw / 1400);
  width: calc(1012 * 100vw / 1400);
  margin: calc(267 * 100vw / 1400) auto 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media (max-width: 767px) {
  #em251017protein .hero-product {
    left: 0;
    width: 100%;
    margin-top: calc(176 * 100vw / 750);
    display: block;
  }
}
#em251017protein .hero-product-photo {
  position: relative;
  width: calc(500 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .hero-product-photo {
    position: relative;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: calc(752 * 100vw / 750);
    margin: 0 auto;
  }
}
#em251017protein .hero-product-cont {
  position: relative;
  left: calc(3 * 100vw / 1400);
  margin-top: calc(135 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .hero-product-cont {
    margin-top: 0;
    left: 0;
  }
}
#em251017protein .hero-product-credit {
  margin: calc(61 * 100vw / 1400) auto 0;
  text-align: center;
  width: calc(309 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .hero-product-credit {
    margin-top: 0;
    position: absolute;
    top: calc(46 * 100vw / 750);
    left: calc(46 * 100vw / 750);
    width: calc(378 * 100vw / 750);
  }
}
#em251017protein .hero-product-link {
  position: relative;
  display: block;
  width: calc(144 * 100vw / 1400);
  height: calc(72 * 100vw / 1400);
  margin: 0 auto;
  background: url("../img/button_buy_off.svg");
  background-size: contain;
  background-repeat: no-repeat;
}
#em251017protein .hero-product-link::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url("../img/button_buy_on.svg");
  background-size: contain;
  background-repeat: no-repeat;
  opacity: 0;
  -webkit-transition: opacity 0.3s cubic-bezier(0.65, 0, 0.35, 1);
  transition: opacity 0.3s cubic-bezier(0.65, 0, 0.35, 1);
}
#em251017protein .hero-product-link:hover {
  opacity: 1;
}
#em251017protein .hero-product-link:hover::before, #em251017protein .hero-product-link:active::before {
  opacity: 1;
}
@media (max-width: 767px) {
  #em251017protein .hero-product-link {
    width: calc(179 * 100vw / 750);
    height: calc(89 * 100vw / 750);
    margin: calc(151 * 100vw / 750) auto 0;
  }
}
#em251017protein .hero-product-txt {
  font-size: calc(15.66 * 100vw / 1400);
  line-height: 1.86717752;
  text-align: center;
}
@media (max-width: 767px) {
  #em251017protein .hero-product-txt {
    display: none;
  }
}
#em251017protein .hero-product-detail {
  width: calc(311 * 100vw / 1400);
  margin: calc(124 * 100vw / 1400) auto 0;
}
@media (max-width: 767px) {
  #em251017protein .hero-product-detail {
    width: calc(452 * 100vw / 750);
    margin: calc(88 * 100vw / 750) auto 0;
  }
}
#em251017protein .section01 {
  background-color: #56391b;
}
@media (max-width: 767px) {
  #em251017protein .section01 {
    display: block;
    padding: 0 0 calc(80 * 100vw / 750);
  }
}
#em251017protein .section01-photo {
  position: relative;
}
@media (max-width: 767px) {
  #em251017protein .section01-photo {
    position: relative;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: calc(752 * 100vw / 750);
    margin: 0 auto;
  }
}
#em251017protein .section01-photo-01 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#em251017protein .section01-photo-02 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
@media (max-width: 767px) {
  #em251017protein .section01-cont {
    padding: calc(163 * 100vw / 750) 0 calc(106 * 100vw / 750);
  }
}
#em251017protein .section01-txt {
  width: calc(429 * 100vw / 1400);
  margin: 0 auto;
}
@media (max-width: 767px) {
  #em251017protein .section01-txt {
    width: calc(449 * 100vw / 750);
  }
}
#em251017protein .section02 {
  background-color: #56391b;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
@media (max-width: 767px) {
  #em251017protein .section02-photo {
    position: relative;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: calc(752 * 100vw / 750);
    margin: 0 auto;
  }
}
@media (max-width: 767px) {
  #em251017protein .section02-cont {
    padding: calc(306 * 100vw / 750) 0 calc(108 * 100vw / 750) calc(52 * 100vw / 750);
  }
}
#em251017protein .section02-txt {
  width: calc(488 * 100vw / 1400);
  margin: 0 auto;
}
@media (max-width: 767px) {
  #em251017protein .section02-txt {
    width: calc(609 * 100vw / 750);
    margin: calc(20 * 100vw / 750) 0 0 0;
  }
}
#em251017protein .section03 {
  background-color: #56391b;
}
@media (max-width: 767px) {
  #em251017protein .section03 {
    background-color: #e3e1d8;
  }
}
@media (max-width: 767px) {
  #em251017protein .section03-photo {
    position: relative;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: calc(752 * 100vw / 750);
    margin: 0 auto;
  }
}
@media (max-width: 767px) {
  #em251017protein .section03-cont {
    padding: calc(72 * 100vw / 750) 0 calc(616 * 100vw / 750) calc(51 * 100vw / 750);
  }
}
#em251017protein .section03-txt {
  width: calc(502 * 100vw / 1400);
  margin: 0 auto;
}
@media (max-width: 767px) {
  #em251017protein .section03-txt {
    width: calc(628 * 100vw / 750);
    margin: 0;
  }
}
#em251017protein .section04 {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  background-color: #e3e1d8;
}
@media (max-width: 767px) {
  #em251017protein .section04 {
    background-color: #414822;
  }
}
@media (max-width: 767px) {
  #em251017protein .section04-photo {
    position: relative;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: calc(752 * 100vw / 750);
    margin: 0 auto;
  }
}
@media (max-width: 767px) {
  #em251017protein .section04-cont {
    padding: calc(54 * 100vw / 750) 0 calc(290 * 100vw / 750) calc(52 * 100vw / 750);
  }
}
#em251017protein .section04-txt {
  width: calc(530 * 100vw / 1400);
  margin: 0 auto;
}
@media (max-width: 767px) {
  #em251017protein .section04-txt {
    margin: 0;
    width: calc(663 * 100vw / 750);
  }
}
#em251017protein .section05 {
  background-color: #414822;
}
@media (max-width: 767px) {
  #em251017protein .section05-photo {
    position: relative;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: calc(752 * 100vw / 750);
    margin: 0 auto;
  }
}
@media (max-width: 767px) {
  #em251017protein .section05-cont {
    padding: calc(88 * 100vw / 750) 0 calc(282 * 100vw / 750) calc(52 * 100vw / 750);
  }
}
#em251017protein .section05-txt {
  width: calc(457 * 100vw / 1400);
  margin: 0 auto;
}
@media (max-width: 767px) {
  #em251017protein .section05-txt {
    margin: 0;
    width: calc(572 * 100vw / 750);
  }
}
#em251017protein .section06 {
  background-color: #e3e1d8;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
@media (max-width: 767px) {
  #em251017protein .section06-photo {
    position: relative;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: calc(752 * 100vw / 750);
    margin: 0 auto;
  }
}
@media (max-width: 767px) {
  #em251017protein .section06-cont {
    padding: calc(196 * 100vw / 750) 0 calc(128 * 100vw / 750) calc(61 * 100vw / 750);
  }
}
#em251017protein .section06-ttl {
  color: #3f3a3a;
}
#em251017protein .section06-txt {
  width: calc(514 * 100vw / 1400);
  margin: 0 auto;
}
@media (max-width: 767px) {
  #em251017protein .section06-txt {
    width: calc(648 * 100vw / 750);
    margin: 0;
  }
}
#em251017protein .section07 {
  background-color: #e3e1d8;
}
#em251017protein .section07-photo {
  position: relative;
  height: calc(900 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .section07-photo {
    position: relative;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: calc(752 * 100vw / 750);
    height: calc(1050 * 100vw / 750);
    margin: 0 auto;
  }
}
#em251017protein .section07-photo-01 {
  position: relative;
}
#em251017protein .section07-photo-02 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#em251017protein .section07-photo-03 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
@media (max-width: 767px) {
  #em251017protein .section07-cont {
    padding: calc(72 * 100vw / 750) 0 calc(108 * 100vw / 750);
  }
}
#em251017protein .section07-txt {
  width: calc(317 * 100vw / 1400);
  margin: 0 auto;
}
@media (max-width: 767px) {
  #em251017protein .section07-txt {
    width: calc(396 * 100vw / 750);
    margin: 1.3333333333vw auto 0;
  }
}
#em251017protein .section07-detail {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: calc(468 * 100vw / 1400);
  margin: calc(100 * 100vw / 1400) auto 0;
}
@media (max-width: 767px) {
  #em251017protein .section07-detail {
    width: calc(585 * 100vw / 750);
    margin: calc(114 * 100vw / 750) auto 0;
  }
}
#em251017protein .section07-detail-item {
  width: calc(129 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .section07-detail-item {
    width: calc(162 * 100vw / 750);
  }
}
#em251017protein .section08 {
  background-color: #56391b;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
@media (max-width: 767px) {
  #em251017protein .section08-photo {
    position: relative;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: calc(752 * 100vw / 750);
    margin: 0 auto;
  }
}
@media (max-width: 767px) {
  #em251017protein .section08-cont {
    padding: calc(132 * 100vw / 750) 0 calc(198 * 100vw / 750);
  }
}
#em251017protein .section08-txt {
  width: calc(480 * 100vw / 1400);
  margin: 0 auto;
}
@media (max-width: 767px) {
  #em251017protein .section08-txt {
    width: calc(601 * 100vw / 750);
  }
}
#em251017protein .flavor {
  position: relative;
  left: calc(-9 * 100vw / 1400);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: calc(1146 * 100vw / 1400);
  margin: calc(117 * 100vw / 1400) auto 0;
}
@media (max-width: 767px) {
  #em251017protein .flavor {
    left: 0;
    display: block;
    width: 100%;
    margin: 0 auto;
  }
}
#em251017protein .flavor-matcha {
  position: relative;
  width: calc(500 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .flavor-matcha {
    background-color: #e3e1d8;
    width: 100%;
    padding-bottom: calc(70 * 100vw / 750);
  }
}
#em251017protein .flavor-matcha-cont {
  position: absolute;
  top: calc(26 * 100vw / 1400);
  left: calc(24 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .flavor-matcha-cont {
    top: calc(47 * 100vw / 750);
    left: calc(33 * 100vw / 750);
  }
}
#em251017protein .flavor-matcha-ttl {
  width: calc(462 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .flavor-matcha-ttl {
    width: calc(684 * 100vw / 750);
    margin: 0 auto;
  }
}
#em251017protein .flavor-matcha-txt {
  margin-top: calc(10 * 100vw / 1400);
  width: calc(361 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .flavor-matcha-txt {
    margin-top: calc(36 * 100vw / 750);
    width: calc(668 * 100vw / 750);
  }
}
@media (max-width: 767px) {
  #em251017protein .flavor-matcha-photo {
    position: relative;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: calc(752 * 100vw / 750);
    margin: 0 auto;
  }
}
#em251017protein .flavor-matcha-detail {
  width: calc(337 * 100vw / 1400);
  position: absolute;
  bottom: calc(167 * 100vw / 1400);
  left: calc(84 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .flavor-matcha-detail {
    width: calc(650 * 100vw / 750);
    margin: calc(-132 * 100vw / 750) auto 0;
    position: relative;
    left: calc(3 * 100vw / 750);
    bottom: auto;
  }
}
#em251017protein .flavor-mocha {
  position: relative;
  width: calc(500 * 100vw / 1400);
  margin-top: calc(364 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .flavor-mocha {
    width: 100%;
    background-color: #e3e1d8;
    padding-bottom: calc(174 * 100vw / 750);
    margin-top: 0;
  }
}
#em251017protein .flavor-mocha-cont {
  position: absolute;
  top: calc(26 * 100vw / 1400);
  left: calc(24 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .flavor-mocha-cont {
    top: calc(45 * 100vw / 750);
    left: calc(51 * 100vw / 750);
  }
}
#em251017protein .flavor-mocha-ttl {
  width: calc(462 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .flavor-mocha-ttl {
    width: calc(656 * 100vw / 750);
    margin: 0 auto;
  }
}
#em251017protein .flavor-mocha-txt {
  margin-top: calc(22 * 100vw / 1400);
  width: calc(451 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .flavor-mocha-txt {
    margin-top: calc(40 * 100vw / 750);
    width: calc(644 * 100vw / 750);
  }
}
@media (max-width: 767px) {
  #em251017protein .flavor-mocha-photo {
    position: relative;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: calc(752 * 100vw / 750);
    margin: 0 auto;
  }
}
#em251017protein .flavor-mocha-detail {
  width: calc(334 * 100vw / 1400);
  position: absolute;
  bottom: calc(-186 * 100vw / 1400);
  right: calc(-26 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .flavor-mocha-detail {
    width: calc(650 * 100vw / 750);
    margin: calc(-113 * 100vw / 750) auto 0;
    position: relative;
    bottom: auto;
    right: auto;
    left: calc(7 * 100vw / 750);
  }
}
#em251017protein .store {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  position: relative;
  width: calc(1305 * 100vw / 1400);
  margin: calc(263 * 100vw / 1400) auto 0;
  left: calc(49 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .store {
    display: block;
    margin: 0;
    padding-bottom: calc(508 * 100vw / 750);
    width: 100%;
    left: 0;
  }
}
#em251017protein .store-photo {
  width: calc(500 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .store-photo {
    position: relative;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: calc(752 * 100vw / 750);
    margin: 0 auto;
  }
}
#em251017protein .store-detail {
  background-color: #414822;
  margin-top: calc(171 * 100vw / 1400);
  width: calc(686 * 100vw / 1400);
  padding: calc(45 * 100vw / 1400) 0 calc(54 * 100vw / 1400) calc(49 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .store-detail {
    position: absolute;
    margin-top: calc(-128 * 100vw / 750);
    right: calc(-8 * 100vw / 750);
    width: calc(703 * 100vw / 750);
    padding: calc(52 * 100vw / 750) 0 calc(64 * 100vw / 750) calc(56 * 100vw / 750);
  }
}
#em251017protein .store-txt {
  width: calc(279 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .store-txt {
    width: calc(349 * 100vw / 750);
  }
}
#em251017protein .store-notice {
  display: block;
  margin-top: calc(15 * 100vw / 1400);
  font-size: calc(12.47 * 100vw / 1400);
  letter-spacing: 0.025em;
  color: #fff;
}
@media (max-width: 767px) {
  #em251017protein .store-notice {
    margin-top: calc(19 * 100vw / 750);
    font-size: calc(18.43 * 100vw / 750);
  }
}
#em251017protein .lp-footer-link {
  position: relative;
  display: block;
  width: calc(161 * 100vw / 1400);
  height: calc(80 * 100vw / 1400);
  margin: calc(104 * 100vw / 1400) auto 0;
  background: url("../img/button_buy_off.svg");
  background-size: contain;
  background-repeat: no-repeat;
}
#em251017protein .lp-footer-link::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url("../img/button_buy_on.svg");
  background-size: contain;
  background-repeat: no-repeat;
  opacity: 0;
  -webkit-transition: opacity 0.3s cubic-bezier(0.65, 0, 0.35, 1);
  transition: opacity 0.3s cubic-bezier(0.65, 0, 0.35, 1);
}
#em251017protein .lp-footer-link:hover {
  opacity: 1;
}
#em251017protein .lp-footer-link:hover::before, #em251017protein .lp-footer-link:active::before {
  opacity: 1;
}
@media (max-width: 767px) {
  #em251017protein .lp-footer-link {
    width: calc(179 * 100vw / 750);
    height: calc(89 * 100vw / 750);
    margin: 0 auto;
  }
}
#em251017protein .lp-footer-txt {
  margin: calc(32 * 100vw / 1400) auto 0;
  width: calc(303 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .lp-footer-txt {
    margin: calc(62 * 100vw / 750) auto 0;
    width: calc(378 * 100vw / 750);
  }
}
#em251017protein .lp-footer-product {
  position: relative;
  z-index: 1;
  background-color: #56391b;
  width: calc(576 * 100vw / 1400);
  margin: calc(97 * 100vw / 1400) auto 0;
}
#em251017protein .lp-footer-product a {
  display: block;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media (max-width: 767px) {
  #em251017protein .lp-footer-product {
    width: calc(671 * 100vw / 750);
    margin: calc(128 * 100vw / 750) auto 0;
  }
}
#em251017protein .lp-footer-product-photo {
  width: calc(200 * 100vw / 1400);
  background-color: #fff;
}
@media (max-width: 767px) {
  #em251017protein .lp-footer-product-photo {
    width: calc(218 * 100vw / 750);
  }
}
#em251017protein .lp-footer-product-txt {
  position: absolute;
  top: calc(66 * 100vw / 1400);
  right: calc(63 * 100vw / 1400);
  width: calc(254 * 100vw / 1400);
}
@media (max-width: 767px) {
  #em251017protein .lp-footer-product-txt {
    top: calc(74 * 100vw / 750);
    right: calc(84 * 100vw / 750);
    width: calc(301 * 100vw / 750);
  }
}
#em251017protein .lp-footer-photo {
  position: relative;
  width: 100%;
  margin: calc(-61 * 100vw / 1400) auto 0;
}
@media (max-width: 767px) {
  #em251017protein .lp-footer-photo {
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: calc(752 * 100vw / 750);
    margin: calc(-29 * 100vw / 750) auto 0;
  }
}