@charset "UTF-8";

/*//////////////////////////////////////////////////

Chocomoo × ecostore｜エコストア日本上陸10周年記念 第二弾

//////////////////////////////////////////////////*/

/* ========================================================
                      * 共通  *
========================================================= */

.lp_contents .movie_wrap {
  overflow: hidden;
  position: relative;
}

.lp_contents iframe {
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  width: 100%;
  height: 100%;
  pointer-events: none;
  border: none;
  background: transparent;

  visibility: hidden;
  opacity: 0;
}

.lp_contents iframe.is-ready {
  visibility: visible;
  opacity: 1;
}

/* ========================================================
                    * fixed_nav   *
========================================================= */
.lp_contents .fixed_area {
  overflow: hidden;
}

.fixed_area .intro_deco_area {
  margin-top: 83.3rem;
}

.fixed_area .fixed_right .deco_25 {
  width: 7.8rem;
  margin-top: 18.6rem;
  margin-inline: auto 4.2rem;
  position: relative;

  animation:
    stepmotion 6s steps(6, jump-none) infinite;
  /* roteto 2s steps(2, jump-none) infinite; */
}

.fixed_area .fixed_right .deco_25 img {
  animation:
    /* stepmotion 6s steps(6, jump-none) infinite, */
    roteto 2s linear infinite;
}

.fixed_area .fixed_left .deco_26 {
  width: 17.2rem;
  height: 20.2rem;
  margin-top: 17rem;
  margin-inline: auto 2.4rem;
  position: relative;

  animation:
    stepmotion2 5s steps(5, jump-none) infinite,
    backgroundChenge 3s steps(3, jump-none) infinite;
}

.fixed_area .fixed_left .deco_26 img {
  opacity: 0;
}


@keyframes stepmotion {
  from {
    left: 0;
  }

  to {
    left: -70rem;
  }
}

@keyframes stepmotion2 {
  from {
    left: 0;
  }

  to {
    left: -88rem;
  }
}

@keyframes roteto {

  0%,
  50% {
    transform: rotate(0deg);
  }

  50.001%,
  100% {
    transform: rotate(30deg);
  }
}

@keyframes backgroundChenge {

  0%,
  33.333% {
    background: url(../../img/loop_character_005.png) no-repeat center / 100%;
  }

  33.334%,
  66.666% {
    background: url(../../img/loop_character_003.png) no-repeat center / 100%;
  }

  66.667%,
  100% {
    background: url(../../img/loop_character_001.png) no-repeat center / 100%;
  }
}


.fixed_area .random_parts {
  width: 4rem;
  transform: rotate(0deg);
  margin-top: 30rem;
  margin-left: 14rem;
}

.fixed_area .random_parts_7 {
  width: 2.8rem;
}

.fixed_area .random_parts:nth-of-type(odd) {
  margin-left: 18rem;
}

.fixed_area .fixed_right .random_parts:nth-of-type(odd) {
  margin-left: -26rem;
}

.fixed_area .random_parts:nth-of-type(even) {
  margin-left: 35rem;
}

.fixed_area .random_parts .js-floatUp_03,
.fixed_area .random_parts img {
  transition-delay: unset !important
}

.js-floatUp_03 {
  animation: floatUp 1.2s cubic-bezier(0.42, 0, 0.58, 1) infinite alternate;
}

/* ========================================================
                      * sec_mv  *
========================================================= */
.sec_mv {}

.sec_mv .mv_ttl {
  width: calc(402 * (var(--rate)));
  position: absolute;
  top: calc(33 * (var(--rate)));
  left: calc(35 * (var(--rate)));
}

.sec_mv figure:nth-of-type(1),
.sec_mv figure:nth-of-type(2),
.sec_mv figure:nth-of-type(3),
.sec_mv figure:nth-of-type(4),
.sec_mv figure:nth-of-type(5),
.sec_mv figure:nth-of-type(6) {
  top: auto;
  bottom: auto;
  right: auto;
  left: auto;
}

.sec_mv figure:nth-of-type(1) {
  width: calc(182 * (var(--rate)));
  top: calc(77 * (var(--rate)));
  right: calc(17 * (var(--rate)));
}

.sec_mv figure:nth-of-type(2) {
  width: calc(69 * (var(--rate)));
  top: calc(31 * (var(--rate)));
  right: calc(176 * (var(--rate)));
}

.sec_mv figure:nth-of-type(3) {
  width: calc(56 * (var(--rate)));
  top: calc(305 * (var(--rate)));
  left: calc(25 * (var(--rate)));
}

.sec_mv figure:nth-of-type(4) {
  width: calc(42 * (var(--rate)));
  top: calc(655 * (var(--rate)));
  left: calc(72 * (var(--rate)));
}

.sec_mv figure:nth-of-type(5) {
  width: calc(31 * (var(--rate)));
  top: calc(428 * (var(--rate)));
  left: calc(56 * (var(--rate)));
}

.sec_mv figure:nth-of-type(6) {
  width: calc(31 * (var(--rate)));
  top: calc(162 * (var(--rate)));
  right: calc(223 * (var(--rate)));
}

.sec_mv {
  background: url(../../img/second/mv_bg.jpg) no-repeat center top / contain;
}

/* ========================================================
                * sec_collabo_02 *
========================================================= */

.sec_collabo_02 {
  padding-top: calc(233 * (var(--rate)));
  padding-bottom: calc(56 * (var(--rate)));
}

.sec_collabo_02 .ttl {}

.sec_collabo_02 .collabo_item_block {
  margin-top: calc(51 * (var(--rate)));
}

.sec_collabo_02 .collabo_item_block_2 {
  margin-top: calc(132 * (var(--rate)));
}

.sec_collabo_02 .collabo_img_all {
  width: 100%;
  aspect-ratio: 750 / 750;
}

.sec_collabo_02 .collabo_item_block_1 .collabo_img_all {
  background: url(../../img/second/oralset_top_square.gif) no-repeat center / 100%;
}

.sec_collabo_02 .collabo_item_block_2 .collabo_img_all {
  background: url(../../img/second/paperbag_top_square.gif) no-repeat center / 100%;
}

.sec_collabo_02 .collabo_gallery_list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  margin-top: calc(81 * (var(--rate)));
  padding-inline: calc(6 * (var(--rate)));
  gap: calc(30 * (var(--rate))) calc(6 * (var(--rate)));
}

.sec_collabo_02 .collabo_item_block_2 .collabo_gallery_list {
  gap: calc(43 * (var(--rate))) calc(6 * (var(--rate)));
}

.sec_collabo_02 .collabo_gallery_list li {}

.sec_collabo_02 .collabo_gallery_list li.p9 {
  margin-top: calc(-211 * (var(--rate)));
}

.sec_collabo_02 .collabo_item_block_2 .collabo_gallery_list li.p4 {
  margin-top: calc(1 * (var(--rate)));
  margin-left: calc(1 * (var(--rate)));
}

.sec_collabo_02 .collabo_gallery_list li.large {
  grid-row: span 2;
  margin-top: calc(-9 * (var(--rate)));
}

.sec_collabo_02 .collabo_item_block_2 .collabo_gallery_list li.large {
  margin-top: calc(-2 * (var(--rate)));
  margin-inline: calc(10 * (var(--rate)));
}

.sec_collabo_02 .collabo_gallery_list li figure {
  width: calc(344 * (var(--rate)));
}

.sec_collabo_02 .collabo_item_block_2 .collabo_gallery_list li figure {
  width: calc(344 * (var(--rate)));
}

.sec_collabo_02 .collabo_gallery_list li.large figure {
  width: 100%;
  aspect-ratio: 344 / 513;
  overflow: hidden;
  position: relative;
}

.sec_collabo_02 .collabo_gallery_list li.small figure {
  width: calc(344 * (var(--rate)));
  height: calc(351 * (var(--rate)));
  margin: 0 auto;
}

.sec_collabo_02 .collabo_item_block_2 .collabo_gallery_list li.small figure {
  width: calc(344 * (var(--rate)));
  height: calc(338 * (var(--rate)));
}

.sec_collabo_02 .collabo_gallery_list li iframe {
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  width: 100%;
  height: 100%;
  pointer-events: none;
  border: none;
}

.sec_collabo_02 .collabo_item_block_1 .collabo_gallery_list li:nth-of-type(2) figure {
  background: url(../../img/second/oralset_green.gif) no-repeat center / 100%;
}

.sec_collabo_02 .collabo_item_block_1 .collabo_gallery_list li:nth-of-type(3) figure {
  background: url(../../img/second/oralset_pink.gif) no-repeat center / 100%;
}

.sec_collabo_02 .collabo_item_block_1 .collabo_gallery_list li:nth-of-type(6) figure {
  background: url(../../img/second/oralset_black.gif) no-repeat center / 100%;
}

.sec_collabo_02 .collabo_item_block_1 .collabo_gallery_list li:nth-of-type(8) figure {
  background: url(../../img/second/oralset_red.gif) no-repeat center / 100%;
}

.sec_collabo_02 .collabo_item_block_2 .collabo_gallery_list li:nth-of-type(1) figure {
  background: url(../../img/second/paperbag-brown.gif) no-repeat center / 100%;
}

.sec_collabo_02 .collabo_item_block_2 .collabo_gallery_list li:nth-of-type(4) figure {
  background: url(../../img/second/paperbag-olive.gif) no-repeat center / 100%;
}

.sec_collabo_02 .collabo_point_wrap {
  margin-top: calc(63 * (var(--rate)));
}

.sec_collabo_02 .collabo_item_block_2 .collabo_point_wrap {
  margin-top: calc(71 * (var(--rate)));
}

.sec_collabo_02 .refill_tag {
  margin-inline: calc(56 * (var(--rate)));
}

.sec_collabo_02 .refill_tag span {}

.sec_collabo_02 .collabo_point_list {
  margin-top: calc(24 * (var(--rate)));
  padding-inline: calc(56 * (var(--rate)));
  display: grid;
  gap: calc(26 * (var(--rate)));
}

.sec_collabo_02 .collabo_point_list li {
  display: flex;
  align-items: flex-start;
  gap: calc(14 * (var(--rate)));
  overflow: clip;
}

.sec_collabo_02 .collabo_point_list li span {
  font-size: calc(31 * (var(--rate)));
  text-align: justify;
  line-height: 1.5;
  letter-spacing: .09em;
  white-space: nowrap;
}

.sec_collabo_02 .collabo_point_list li:nth-of-type(1) span {
  padding-top: calc(7 * (var(--rate)));
}

.sec_collabo_02 .collabo_point_list li:nth-of-type(2) span {
  transition-delay: .6s;
}

.sec_collabo_02 .collabo_point_list li:nth-of-type(3) span {
  transition-delay: .9s;
}

.sec_collabo_02 .collabo_point_list li::before {
  content: "";
  background: url(../../img/second/icon_check.svg) no-repeat center / 100%;
  width: calc(31 * (var(--rate)));
  height: calc(23 * (var(--rate)));
  margin-top: calc(13 * (var(--rate)));
}

.sec_collabo_02 .collabo_point_img_list {
  margin-top: calc(53 * (var(--rate)));
}

.sec_collabo_02 .collabo_item_block_2 .collabo_point_img_list {
  margin-top: calc(59 * (var(--rate)));
}

.sec_collabo_02 .collabo_point_img_list li {
  position: relative;
}

.sec_collabo_02 .collabo_point_img_list figure {}

.sec_collabo_02 .collabo_point_img_list li:nth-of-type(even) figure {
  margin-inline: 0 auto;
}

.sec_collabo_02 .collabo_point_img_list li:nth-of-type(odd) figure {
  margin-inline: auto 0;
}

.sec_collabo_02 .collabo_point_img_list li:nth-of-type(1) figure {
  transition-delay: 1.5s;
}

.sec_collabo_02 .collabo_point_img_list li:nth-of-type(2) figure {
  transition-delay: .6s;
  transition-delay: 2s;
}

.sec_collabo_02 .collabo_point_img_list li:nth-of-type(3) figure {
  transition-delay: .9s;
  transition-delay: 2.5s;
}

.sec_collabo_02 .collabo_item_block_1 .collabo_point_img_list li:nth-of-type(1) figure {
  width: calc(473 * (var(--rate)));
  margin-right: calc(-15 * (var(--rate)));
}

.sec_collabo_02 .collabo_item_block_1 .collabo_point_img_list li:nth-of-type(2) figure {
  width: calc(476 * (var(--rate)));
  margin-top: calc(-134 * (var(--rate)));
  margin-left: calc(-69 * (var(--rate)));
}

.sec_collabo_02 .collabo_item_block_1 .collabo_point_img_list li:nth-of-type(3) figure {
  width: calc(403 * (var(--rate)));
  margin-top: calc(-145 * (var(--rate)));
  margin-right: calc(-13 * (var(--rate)));
}

.sec_collabo_02 .collabo_item_block_2 .collabo_point_img_list li:nth-of-type(1) figure {
  width: calc(473 * (var(--rate)));
  margin-right: calc(-13 * (var(--rate)));
}

.sec_collabo_02 .collabo_item_block_2 .collabo_point_img_list li:nth-of-type(2) figure {
  width: calc(433 * (var(--rate)));
  margin-top: calc(-114 * (var(--rate)));
  margin-left: calc(-40 * (var(--rate)));
  position: relative;
  z-index: 1;
}

.sec_collabo_02 .collabo_item_block_2 .collabo_point_img_list li:nth-of-type(3) figure {
  width: calc(520 * (var(--rate)));
  margin-top: calc(-86 * (var(--rate)));
  margin-right: calc(-13 * (var(--rate)));
}

.sec_collabo_02 .collabo_point_img_list .fukidashi {
  position: absolute;
  top: 0;
  left: 0;
  background: none;
}

.sec_collabo_02 .refill_fukidashi .fukidashi_txt {
  margin: 0;
}

.sec_collabo_02 .collabo_item_block_1 .collabo_point_img_list li:nth-of-type(1) .fukidashi {
  width: calc(357 * (var(--rate)));
  top: calc(34 * (var(--rate)));
  left: calc(51 * (var(--rate)));
  transition-delay: .3s;
  transition-delay: 1.7s;
}

.sec_collabo_02 .collabo_item_block_1 .collabo_point_img_list li:nth-of-type(3) .fukidashi {
  width: calc(454 * (var(--rate)));
  top: calc(325 * (var(--rate)));
  left: calc(37 * (var(--rate)));
  transition-delay: 3s;
}

.sec_collabo_02 .collabo_item_block_2 .collabo_point_img_list li:nth-of-type(2) .fukidashi {
  width: calc(306 * (var(--rate)));
  top: calc(124 * (var(--rate)));
  left: calc(343 * (var(--rate)));
  z-index: 2;
  transition-delay: .8s;
  transition-delay: 2s;
}

.sec_collabo_02 .collabo_item_info {
  margin-top: calc(244 * (var(--rate)));
}

.sec_collabo_02 .collabo_item_block_2 .collabo_item_info {
  margin-top: calc(60 * (var(--rate)));
}

.sec_collabo_02 .collabo_item_block_2 .collabo_item_info_2 {
  margin-top: calc(102 * (var(--rate)));
}

.sec_collabo_02 .collabo_item_icon {
  width: calc(137 * (var(--rate)));
  height: calc(137 * (var(--rate)));
  margin: 0 auto calc(34 * (var(--rate)));
}

.sec_collabo_02 .collabo_item_info_1 .collabo_item_icon {
  background: url(../../img/second/collabo_item_icon_1.svg) no-repeat center / 100%;
}

.sec_collabo_02 .collabo_item_info_2 .collabo_item_icon {
  background: url(../../img/second/collabo_item_icon_2.svg) no-repeat center / 100%;
}

.sec_collabo_02 .collabo_item_name {
  font-size: calc(25 * (var(--rate)));
  margin-right: calc(25 * (var(--rate)));
  letter-spacing: .1em;
}

.sec_collabo_02 .collabo_item_block_2 .collabo_item_name {
  margin-right: 0;
}

.sec_collabo_02 .collabo_item_price {
  font-size: calc(25 * (var(--rate)));
  margin-top: calc(22 * (var(--rate)));
  letter-spacing: .06em;
}

.sec_collabo_02 .collabo_item_price .tax {
  font-size: calc(17 * (var(--rate)));
  letter-spacing: .06em;
}

.sec_collabo_02 .btn_all {
  width: calc(657 * (var(--rate)));
  margin: calc(28 * (var(--rate))) auto 0;
  border-radius: calc(40 * (var(--rate)));
}

.sec_collabo_02 .btn_all a {
  font-size: calc(28 * (var(--rate)));
  letter-spacing: .3em;
  padding: calc(27 * (var(--rate))) calc(32 * (var(--rate))) calc(24 * (var(--rate))) 0;
}

.sec_collabo_02 .btn_all.to_all a {}

.sec_collabo_02 .btn_all.to_buy a {
  padding: calc(27 * (var(--rate))) calc(24 * (var(--rate))) calc(24 * (var(--rate))) 0
}

.sec_collabo_02 .btn_all.to_shop a {
  padding: calc(27 * (var(--rate))) calc(24 * (var(--rate))) calc(24 * (var(--rate))) 0
}

.sec_collabo_02 .btn_all a::before {
  width: calc(16 * (var(--rate)));
  height: calc(25 * (var(--rate)));
  right: calc(196 * (var(--rate)));
}

.sec_collabo_02 .btn_all.to_buy a::before {
  right: calc(213 * (var(--rate)));
}

.sec_collabo_02 .btn_all.to_shop a::before {
  right: calc(140 * (var(--rate)));
}

/* ========================================================
                      * modal  *
========================================================= */

body.no_scroll {
  overflow: hidden;
}

.lp_contents .modal_toggle {
  cursor: pointer;
  position: relative;
  /* transition: opacity .3s ease-in-out; */
}

.lp_contents .modal_toggle::after {
  content: "";
  background: url(../../img/second/arrow.svg) no-repeat center / 100%;
  width: calc(28 * (var(--rate)));
  height: calc(9 * (var(--rate)));
  position: absolute;
  top: calc(321 * (var(--rate)));
  right: calc(30 * (var(--rate)));
}

.lp_contents .collabo_item_block_2 .modal_toggle::after {
  top: calc(300 * (var(--rate)));
}

.lp_contents .modal_toggle.large::after {
  top: calc(498 * (var(--rate)));
  right: calc(27 * (var(--rate)));
}

.lp_contents .modal_toggle:hover {
  /* opacity: 0.8; */
}

html.no_scroll {
  overflow: hidden;
}

.lp_contents .modal_button {
  position: relative;
  cursor: pointer;
  z-index: 10;
}

.lp_contents .modal_button.btn_modalClose {
  width: calc(46 * (var(--rate)));
  height: calc(46 * (var(--rate)));
  background: url(../../img/second/btn_close.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  border: none;
  float: right;
  /* position: sticky; */
  position: absolute;
  top: calc(34 * (var(--rate)));
  right: calc(33 * (var(--rate)));
  z-index: 9999;
}

.lp_contents .modal_outside.hide {
  opacity: 0;
  scale: 0.95;
  pointer-events: none;
  overflow-y: auto;
}

.lp_contents .modal_outside {
  position: fixed;
  z-index: 1000;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;

  /* align-items: flex-start; */
  /* margin-top: calc(30 * (var(--rate))); */


  width: 100%;
  height: 100%;
  opacity: 1;
  scale: 1;
  /* transition: opacity .5s; */
  transition: opacity .3s, scale .3s;
  overflow-y: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.lp_contents .modal_outside::-webkit-scrollbar {
  display: none;
}

.lp_contents .modal_outside::before {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--color-lp_txt_font);
  opacity: .3;
  content: "";
}

.lp_contents .modal_overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.lp_contents .modal_wrap {
  width: calc(750 * ((var(--rate))));
  margin: 0 auto;
  max-height: calc(100dvh - (30 * var(--rate)));
  /* overflow-y: scroll; */
  -ms-overflow-style: none;
  scrollbar-width: none;
  will-change: transform;
  overflow: hidden;
  overflow-y: auto;
}

.lp_contents .modal_inner {
  position: relative;
  background: var(--color-lp_white);
}

.lp_contents .modal_outside.hide .modal_content {
  opacity: 0;
}

.lp_contents .modal_content {
  opacity: 1;
  padding: calc(105 * ((var(--rate)))) 0 calc(80 * ((var(--rate))));
  overflow: visible;
  position: relative;
  transition: opacity .3s .5s;
}

.lp_contents .modal_content .modal_item_img {
  width: calc(537 * ((var(--rate))));
  margin: 0 auto;
  border: 1px solid #000;
  aspect-ratio: 537 / 537;
}

.lp_contents #modalItem1 .modal_content .modal_item_img {
  background: url(../../img/second/popup_oral_black.gif) no-repeat center / 100%;
}

.lp_contents #modalItem2 .modal_content .modal_item_img {
  background: url(../../img/second/popup_oral_green.gif) no-repeat center / 100%;
}

.lp_contents #modalItem3 .modal_content .modal_item_img {
  background: url(../../img/second/popup_oral_pink.gif) no-repeat center / 100%;
}

.lp_contents #modalItem4 .modal_content .modal_item_img {
  background: url(../../img/second/popup_oral_blue.gif) no-repeat center / 100%;
}

.lp_contents #modalItem5 .modal_content .modal_item_img {
  background: url(../../img/second/popup_oral_purple.gif) no-repeat center / 100%;
}

.lp_contents #modalItem6 .modal_content .modal_item_img {
  background: url(../../img/second/popup_oral_white.gif) no-repeat center / 100%;
}

.lp_contents #modalItem7 .modal_content .modal_item_img {
  background: url(../../img/second/popup_oral_orange.gif) no-repeat center / 100%;
}

.lp_contents #modalItem8 .modal_content .modal_item_img {
  background: url(../../img/second/popup_oral_red.gif) no-repeat center / 100%;
}

.lp_contents #modalItem9 .modal_content .modal_item_img {
  background: url(../../img/second/popup_oral_yellowgreen.gif) no-repeat center / 100%;
}

.lp_contents #modalItem10 .modal_content .modal_item_img {
  background: url(../../img/second/popup_oral_yellow.gif) no-repeat center / 100%;
}

.lp_contents #modalItem11 .modal_content .modal_item_img {
  background: url(../../img/second/paperbag_brown_square.gif) no-repeat center / 100%;
}

.lp_contents #modalItem12 .modal_content .modal_item_img {
  background: url(../../img/second/paperbag_olive_square.gif) no-repeat center / 100%;
}

.lp_contents .modal_content .modal_item_name {
  font-size: calc(46 * ((var(--rate))));
  letter-spacing: .07em;
  margin-top: calc(50 * ((var(--rate))));
}

.lp_contents .modal_content .modal_item_name span {
  display: block;
  font-size: calc(25 * ((var(--rate))));
  letter-spacing: .1em;
  margin-top: calc(22 * ((var(--rate))));
}

.lp_contents .modal_content .modal_txt {
  font-size: calc(25 * ((var(--rate))));
  line-height: calc(48/25);
  letter-spacing: .1em;
  margin-top: calc(26 * ((var(--rate))));
}

.lp_contents .modal_content .modal_item_price {
  font-size: calc(25 * ((var(--rate))));
  letter-spacing: .06em;
  margin-top: calc(36 * ((var(--rate))));
}

.lp_contents .modal_content .modal_item_price span {
  font-size: calc(17 * ((var(--rate))));
  letter-spacing: .06em;
}

.lp_contents .modal_content .modal_item_btn {
  background: #ff6c45;
  width: calc(358 * ((var(--rate))));
  border-radius: calc(33 * ((var(--rate))));
  margin: calc(36 * ((var(--rate)))) auto 0;
}

.lp_contents .modal_content .modal_item_btn a {
  font-size: calc(38 * ((var(--rate))));
  letter-spacing: .17em;
  color: var(--color-lp_white);
  padding: calc(22 * ((var(--rate)))) 0 calc(11 * ((var(--rate))));
}

/* ========================================================
                    * アニメーション  *
========================================================= */

.lp_contents .js-fadeup {
  opacity: 0;

  translate: 0 140%;
  transition: opacity .5s ease-in-out, translate .8s ease-in-out;
}

.lp_contents .is-show .js-fadeup {
  opacity: 1;
  translate: 0 0;
}

.lp_contents .js-fade {
  opacity: 0;
  transition: opacity 2s .3s cubic-bezier(.4, .4, 0, 1);
}

.lp_contents .js-fade.is-show {
  opacity: 1;
  transition: opacity 2s .3s cubic-bezier(.4, .4, 0, 1);
}

.lp_contents .js-slidein_right {
  opacity: 0;
  transform: translateX(15%);
  transition: opacity .8s ease, transform .8s ease;
}

.lp_contents .js-slidein_left {
  opacity: 0;
  transform: translateX(-15%);
  transition: opacity .8s ease, transform .8s ease;
}

.lp_contents .is-show .js-slidein {
  opacity: 1;
  transform: translateX(0);
}

.js-bound_fukidashi {
  opacity: 0;
  scale: .6;
  transform-origin: center;
  transition: opacity .45s ease, scale .45s cubic-bezier(0.49, 0.25, 0.3, 1.31);
}

.is-show .js-bound_fukidashi {
  opacity: 1;
  scale: 1;
}

.js-step.is-show img {
  animation: 2s steps(1) .5s infinite normal both running step;
}


/* アニメーション無効 */
.js-floatUp_02 img {
  animation: unset;
}

.lp_contents .js-fadeup {
  opacity: 1;
  translate: 0 0;
}

.lp_contents .js-slidein {
  opacity: 1;
  transform: translateX(0);
}

.js-bound_fukidashi {
  opacity: 1;
  scale: 1;
}

.lp_contents .collabo_item_icon.js-fade {
  opacity: 1;
}