@charset "UTF-8";

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

  bioplefes '25 | Biople Website

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


/*------------------------------------
≡≡≡≡≡≡≡≡≡≡ ▼ S e t U p SP ▼ ≡≡≡≡≡≡≡≡≡≡
------------------------------------*/
:root {
  --color1: #fff;
  --color2: #312D2C;
  --color3: #FFECA8;
  --color4: #F5DD85;
  --font_ja: "biz-udpgothic", "Hiragino Sans", "ヒラギノ角ゴシック", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ ProN", "ヒラギノ角ゴ Pro", 'Noto Sans JP', "メイリオ", "Meiryo", sans-serif;
  --font_en: "futura-pt", "biz-udpgothic", "Hiragino Sans", "ヒラギノ角ゴシック", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ ProN", "ヒラギノ角ゴ Pro", 'Noto Sans JP', "メイリオ", "Meiryo", sans-serif;
  --font_hiragino: "Hiragino Sans", "ヒラギノ角ゴシック", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ ProN", "ヒラギノ角ゴ Pro", 'Noto Sans JP', "メイリオ", "Meiryo", sans-serif;
}

/* ========================================================
            * スライダー *
========================================================= */

.lp_contents .slick-track {
  display: flex;
}

.slide_wrap {
  position: relative;
  width: calc(355 * 60rem / 430);
  margin: 0 auto;
  text-align: left;
}

.slide_wrap ul.slick-slider li {
  width: calc(355 * 60rem / 430);
}

.slick-slide {
  margin-right: calc(60 * 60rem / 430);
}

.next_button,
.prev_button {
  width: calc(47 * 60rem / 430);
  height: calc(47 * 60rem / 430);
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  cursor: pointer;
}

.next_button::after,
.prev_button::after {
  content: "";
  background-size: 100% 100%;
  width: calc(47 * 60rem / 430);
  height: calc(47 * 60rem / 430);
  display: block;
}

.next_button {
  right: calc(-24 * 60rem / 430);
}

.prev_button {
  left: calc(-24 * 60rem / 430);
}

.btn {
  width: 100%;
  border-radius: calc(37 * 60rem / 430);
}

.btn a {
  font-size: calc(18 * 60rem / 430);
  font-weight: 600;
  letter-spacing: .05em;
  padding: calc(6 * 60rem / 430) 0;
}

/* ========================================================
            * PC 右ナビゲーション *
========================================================= */

.fixed_right .menu_list {
  width: auto;
  height: auto;
  position: static;
  display: flex;
  flex-direction: column;
  gap: 3.2rem;
  margin-left: 1.6rem;
}

.fixed_right .menu_list li {
  position: relative;
  width: calc(200 * 100vw / 1366);
  height: calc(39 * 100vw / 1366);

}

.fixed_right .menu_list li a {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: .6rem;
}


.fixed_right .menu_list li:nth-of-type(1) a {
  background: #EF2D63;
}

.fixed_right .menu_list li:nth-of-type(2) a {
  background: #63BB53;
}

.fixed_right .menu_list li:nth-of-type(3) a {
  background: #C569AB;
}

.fixed_right .menu_list li:nth-of-type(4) a {
  background: #9FDBC7;
}

.fixed_right .menu_list li:nth-of-type(5) a {
  background: #FA8AA7;
}

.fixed_right .menu_list li:nth-of-type(6) a {
  background: #7866E0;
}

.fixed_right .menu_list li .character,
.fixed_right .menu_list li .character_after {
  position: absolute;
  transition: all .5s;
  cursor: pointer;
}

.fixed_right .menu_list li:nth-of-type(1) .character {
  width: calc(70 * 100vw / 1366);
  height: calc(98 * 100vw / 1366);
  background: url(../../img/main/character01.png) no-repeat center;
  background-size: 100%;
  top: calc(-34 * 100vw / 1366);
  left: calc(-63 * 100vw / 1366);
}

.fixed_right .menu_list li:nth-of-type(2) .character {
  width: calc(60 * 100vw / 1366);
  height: calc(74 * 100vw / 1366);
  background: url(../../img/main/character02.png) no-repeat center;
  background-size: 100%;
  top: calc(-22 * 100vw / 1366);
  right: calc(-65 * 100vw / 1366);
  transform: rotate(9deg);
}

.fixed_right .menu_list li:nth-of-type(3) .character {
  width: calc(65 * 100vw / 1366);
  height: calc(71 * 100vw / 1366);
  background: url(../../img/main/character03.png) no-repeat center;
  background-size: 100%;
  top: calc(-20 * 100vw / 1366);
  left: calc(-64 * 100vw / 1366);
}

.fixed_right .menu_list li:nth-of-type(4) .character {
  width: calc(57 * 100vw / 1366);
  height: calc(67 * 100vw / 1366);
  background: url(../../img/main/character04.png) no-repeat center;
  background-size: 100%;
  top: calc(-18 * 100vw / 1366);
  right: calc(-71 * 100vw / 1366);
}

.fixed_right .menu_list li:nth-of-type(4) .character_after {
  width: calc(27 * 100vw / 1366);
  height: calc(18 * 100vw / 1366);
  background: url(../../img/main/character04_sub.png) no-repeat center;
  background-size: 100%;
  top: calc(31 * 100vw / 1366);
  right: calc(-35 * 100vw / 1366);
}

.fixed_right .menu_list li:nth-of-type(5) .character {
  width: calc(59 * 100vw / 1366);
  height: calc(70 * 100vw / 1366);
  background: url(../../img/main/character05.png) no-repeat center;
  background-size: 100%;
  top: calc(-22 * 100vw / 1366);
  left: calc(-67 * 100vw / 1366);
  z-index: 1;
}

.fixed_right .menu_list li:nth-of-type(5) .character_after {
  width: calc(43 * 100vw / 1366);
  height: calc(25 * 100vw / 1366);
  background: url(../../img/main/character05_sub.png) no-repeat center;
  background-size: 100%;
  top: calc(-5 * 100vw / 1366);
  left: calc(-30 * 100vw / 1366);
  transform: rotate(8deg);
  transform-origin: left center;
}

.fixed_right .menu_list li:nth-of-type(6) .character {
  width: calc(47 * 100vw / 1366);
  height: calc(63 * 100vw / 1366);
  background: url(../../img/main/character06.png) no-repeat center;
  background-size: 100%;
  top: calc(-12 * 100vw / 1366);
  right: calc(-63 * 100vw / 1366);
}

.fixed_right .menu_list li:nth-of-type(6) .character_after {
  width: calc(35 * 100vw / 1366);
  height: calc(30 * 100vw / 1366);
  background: url(../../img/main/character06_sub.png) no-repeat center;
  background-size: 100%;
  top: calc(-6 * 100vw / 1366);
  right: calc(-57 * 100vw / 1366);
  opacity: 0;
}

.fixed_right .menu_list li a:hover {
  opacity: .7;
}

.fixed_right .menu_list li:nth-of-type(1):hover .character {
  transform: translateY(-0.7rem);

}

.fixed_right .menu_list li:nth-of-type(1):hover .character {
  transform: translateY(-0.7rem);
}

.fixed_right .menu_list li:nth-of-type(2):hover .character {
  transform: rotate(-1.2deg)
}

.fixed_right .menu_list li:nth-of-type(3):hover .character {
  transform: scaleX(-1);
}

.fixed_right .menu_list li:nth-of-type(4):hover .character_after {
  transform: translateX(-2rem)
}

.fixed_right .menu_list li:nth-of-type(5):hover .character_after {
  transform: rotate(38deg);
}

.fixed_right .menu_list li:nth-of-type(6):hover .character_after {
  opacity: 1;
}

.fixed_right .menu_list li p {
  display: flex;
  align-items: center;
  justify-content: center;
}


.fixed_right .menu_list li p.txt_en {
  font-size: calc(21 * 100vw / 1366);
  font-weight: 500;
}

.fixed_right .menu_list li:nth-of-type(1) p {
  letter-spacing: -0.025em;
}

.fixed_right .menu_list li:nth-of-type(2) p {
  font-size: calc(22 * 100vw / 1366);
}

.fixed_right .menu_list li:nth-of-type(3) p {}

.fixed_right .menu_list li:nth-of-type(4) p {}

.fixed_right .menu_list li:nth-of-type(5) p {}

.fixed_right .menu_list li:nth-of-type(6) p {}

.fixed_right .menu_list li:nth-of-type(1) p span {
  margin-left: .3rem;
}

.fixed_right .menu_list li:nth-of-type(2) p span {
  margin-left: .7rem;
}

.fixed_right .menu_list li:nth-of-type(3) p span {}

.fixed_right .menu_list li:nth-of-type(4) p span {}

.fixed_right .menu_list li:nth-of-type(5) p span {}

.fixed_right .menu_list li:nth-of-type(6) p span {
  margin-right: .5rem;
}

.fixed_right .menu_list li p.txt_ja {
  font-size: calc(16 * 100vw / 1366);
  font-weight: 600;
  letter-spacing: .1em;
}

.fixed_right .menu_list li p span {
  font-size: calc(16 * 100vw / 1366);
  font-weight: 600;
  letter-spacing: 0;
  display: block;
}

.fixed_right {
  position: relative;
}

.fixed_right .top {
  position: absolute;
  bottom: 1.3rem;
  right: 3.4rem;
}

@media (max-width: 768px) {

  .fixed_right .menu_list li::before,
  .fixed_right .menu_list li .character,
  .fixed_right .menu_list li .character_after {
    display: none;
  }

  .fixed_right .menu_list {
    margin-left: 0;
    flex-direction: row;
    flex-wrap: wrap;
    gap: calc(11 * 60rem / 430) 0;
    justify-content: center;
    padding-bottom: calc(20 * 60rem / 430);
  }

  .fixed_right .menu_list li {}

  .fixed_right .menu_list li a {
    border-radius: calc(35 * 60rem / 430);
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.5);
  }

  .fixed_right .menu_list li:nth-of-type(1) {
    display: none;
  }

  .fixed_right .menu_list li:nth-of-type(2) a {
    background: #335CD0;
  }

  .fixed_right .menu_list li:nth-of-type(3) {
    margin-left: calc(3 * 60rem / 430);
  }

  .fixed_right .menu_list li:nth-of-type(3) a {
    background: #C569AB;
  }

  .fixed_right .menu_list li:nth-of-type(4) a {
    margin-left: calc(3 * 60rem / 430);
  }

  .fixed_right .menu_list li:nth-of-type(4) a {
    background: #63BB53;
  }

  .fixed_right .menu_list li:nth-of-type(5) a {
    background: #FA8AA7;
  }

  .fixed_right .menu_list li:nth-of-type(6) a {
    margin-left: calc(10 * 60rem / 430);
  }

  .fixed_right .menu_list li:nth-of-type(6) a {
    background: #7866E0;
  }

  .fixed_right .menu_list li:nth-of-type(2),
  .fixed_right .menu_list li:nth-of-type(3),
  .fixed_right .menu_list li:nth-of-type(4) {
    width: calc(135 * 60rem / 430);
    height: calc(60 * 60rem / 430);
  }

  .fixed_right .menu_list li:nth-of-type(5),
  .fixed_right .menu_list li:nth-of-type(6) {
    width: calc(175 * 60rem / 430);
    height: calc(41 * 60rem / 430);
  }

  .fixed_right .menu_list li p {
    display: block;
  }

  .fixed_right .menu_list li p.txt_en {
    font-size: calc(15 * 60rem / 430);
  }

  .fixed_right .menu_list li p.txt_ja {
    font-size: calc(12 * 60rem / 430);
  }

  .fixed_right .menu_list li p span {
    font-size: calc(12 * 60rem / 430);
    display: inline;
  }

  .fixed_right .menu_list li:nth-of-type(1) p {}

  .fixed_right .menu_list li:nth-of-type(2) p {
    font-size: calc(20 * 60rem / 430);

  }

  .fixed_right .menu_list li:nth-of-type(3) p {
    font-size: calc(16 * 60rem / 430);
  }

  .fixed_right .menu_list li:nth-of-type(4) p {
    font-size: calc(16 * 60rem / 430);
  }

  .fixed_right .menu_list li:nth-of-type(5) p {
    font-size: calc(21 * 60rem / 430);
  }

  .fixed_right .menu_list li:nth-of-type(6) p {
    font-size: calc(21 * 60rem / 430);
  }


  .fixed_right .menu_list li:nth-of-type(1) p span {}

  .fixed_right .menu_list li:nth-of-type(2) p span {
    font-size: calc(16 * 60rem / 430);
  }

  .fixed_right .menu_list li:nth-of-type(3) p span {}

  .fixed_right .menu_list li:nth-of-type(4) p span {}

  .fixed_right .menu_list li:nth-of-type(5) p span {}

  .fixed_right .menu_list li:nth-of-type(6) p span {
    font-size: calc(17 * 60rem / 430);
  }

  .fixed_right .menu_list li:nth-of-type(1) p span,
  .fixed_right .menu_list li:nth-of-type(2) p span,
  .fixed_right .menu_list li:nth-of-type(5) p span,
  .fixed_right .menu_list li:nth-of-type(6) p span {
    margin-right: 0;
    margin-left: 0;
  }

  .fixed_right .top {
    bottom: calc(140 * 60rem / 430);
    right: calc(7 * 60rem / 430);
  }



}


/* ========================================================
            * sec_info  *
========================================================= */

.sec_info {
  padding-top: calc(210 * 60rem / 430);
}

.sec_info::before {
  background: url(../../img/main/sec_info_bg.png) no-repeat center top;
  background-size: 100% auto;
}

.sec_info .txt {
  font-size: calc(32 * 60rem / 430);
  margin-top: calc(67 * 60rem / 430);
  line-height: 1.5;
  letter-spacing: .1em;
  font-weight: 600;
  color: #000;
}

.brand_list {
  width: 100%;
  height: calc(266 * 60rem / 430);
  background-image: url(../../img/main/brand_list.png);
  background-repeat: repeat-x;
  background-size: calc(5552 * 60rem / 430) 100%;
  animation: scrollBackground 70s linear infinite;
  margin-top: calc(47 * 60rem / 430);
}

.brand_list img {
  opacity: 0;
}

@keyframes scrollBackground {
  0% {
    background-position: 0 0;
  }

  100% {
    background-position: calc(-5552 * 60rem / 430) 0;
  }
}



/* ========================================================
            * sec_other  *
========================================================= */
.sec_other {
  margin-top: calc(40 * 60rem / 430);
  padding-top: calc(219 * 60rem / 430);
  min-height: calc(1162 * 60rem / 430);
}

.sec_other::before {
  width: calc(655 * 60rem / 430);
  height: calc(1162 * 60rem / 430);
  background: url(../../img/main/sec_other_bg.png?250825) no-repeat center top;
  background-size: 100% auto;
  transform: translateX(-50%);
}

.sec_other .musicalnote {
  width: calc(96 * 60rem / 430);
  height: calc(146 * 60rem / 430);
  background: url(../../img/main/musicalnote03.png) no-repeat center;
  background-size: contain;
  position: absolute;
  bottom: calc(-210 * 60rem / 430);
  right: calc(22 * 60rem / 430);
}


.hand02 {
  left: calc(-160 * 60rem / 430);
  bottom: calc(-484 * 60rem / 430);
}

.sec_other .ttl {
  font-size: calc(48 * 60rem / 430);
  font-weight: 700;
  font-family: var(--font_en);
  line-height: 1.5;
  color: var(--color1);
}

.sec_other .ttl span {
  font-size: calc(32 * 60rem / 430);
  font-weight: 600;
  display: block;
  letter-spacing: .1em;
}

.sec_other .slide_wrap {
  margin-top: calc(27 * 60rem / 430);
}

.sec_other .tab_wrap .tab_btn {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: calc(17 * 60rem / 430);
  margin: calc(22 * 60rem / 430) auto calc(35 * 60rem / 430);
}

.sec_other .tab_wrap .tab_btn .tab {
  font-size: calc(23 * 60rem / 430);
  color: #704235;
  background: var(--color1);
  width: calc(107 * 60rem / 430);
  height: calc(37 * 60rem / 430);
  border-radius: calc(5 * 60rem / 430);
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  font-weight: 600;
}

.sec_other .tab_wrap .tab_btn .tab span {
  font-size: calc(19 * 60rem / 430);
}

.sec_other .tab_wrap .tab_btn .tab.is-active {
  color: var(--color1);
  background: #335CD0;
}

.sec_other .tab_contents>li {
  display: none;
}

.sec_other .tab_contents>li.is-active {
  display: block;
}

.sec_other .slide_wrap .prev_button,
.sec_other .slide_wrap .next_button {}

.sec_other .slide_wrap .prev_button::after {
  background: url(../../img/main/prev_blue.svg) no-repeat center;
  background-size: 100%;
}

.sec_other .slide_wrap .next_button::after {
  background: url(../../img/main/next_blue.svg) no-repeat center;
  background-size: 100%;
}

.sec_other .slide_wrap li {
  position: relative;
  display: flex;
  flex-direction: column;
}


.sec_other .slide_wrap li .icon {
  position: absolute;
  width: calc(96 * 60rem / 430);
  height: calc(96 * 60rem / 430);
  bottom: calc(-63 * 60rem / 430);
  right: calc(-22 * 60rem / 430);
}

.sec_other .slide_wrap li .date {
  font-size: calc(23 * 60rem / 430);
  font-weight: 700;
  background: #335CD0;
  padding: calc(9 * 60rem / 430) 0;
  letter-spacing: .1em;
  border-radius: calc(10 * 60rem / 430);
  font-weight: 600;
  flex-shrink: 0;

}

.sec_other .slide_wrap li .date span {
  font-size: calc(19 * 60rem / 430);
  font-weight: 600;
  letter-spacing: .1em;
}

.sec_other .slide_wrap li .board {
  margin-top: calc(12 * 60rem / 430);
  background: var(--color1);
  padding: calc(28 * 60rem / 430) calc(31 * 60rem / 430) calc(22 * 60rem / 430);
  border-radius: calc(10 * 60rem / 430);
  flex: 1;
}

.sec_other .slide_wrap li .flex {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-direction: column-reverse;
  gap: calc(20 * 60rem / 430);

}

.sec_other .slide_wrap li .column01 {
  width: 100%;
}

.sec_other .slide_wrap li .column01 .time {
  font-family: var(--font_en);
  font-size: calc(24 * 60rem / 430);
  background: #EC2B64;
  width: fit-content;
  border-radius: calc(8 * 60rem / 430);
  padding: calc(4 * 60rem / 430) calc(15 * 60rem / 430) calc(4 * 62rem / 430) calc(11 * 60rem / 430);
  letter-spacing: .05em;
  font-weight: 500;
}

.sec_other .slide_wrap li .column01 .time span {
  font-size: calc(18 * 60rem / 430);
  margin-left: calc(2 * 60rem / 430);
  letter-spacing: .05em;
}

.sec_other .slide_wrap li .column01 .txt {
  font-size: calc(14 * 60rem / 430);
  font-weight: 600;
  text-align: left;
  margin-top: calc(8 * 60rem / 430);
  letter-spacing: 0;
  line-height: 1.6;
}

.sec_other .slide_wrap li .column02 {
  width: 100%;
  height: calc(188 * 60rem / 430);
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}

.sec_other .slide_wrap li .column02.width_auto img {
  width: auto;
  height: 100%;
}

.sec_other li .head {
  font-size: calc(18 * 60rem / 430);
  font-weight: 600;
  width: fit-content;
  padding: calc(7 * 60rem / 430) calc(44 * 60rem / 430);
  background: #335CD0;
  border-radius: calc(8 * 60rem / 430);
  margin-top: calc(11 * 60rem / 430);
  letter-spacing: .1em;
}

.sec_other li .category {
  font-size: calc(14 * 60rem / 430);
  font-weight: 600;
  color: #704235;
  text-align: left;
  margin-top: calc(14 * 60rem / 430);
}

.sec_other li .txt_lg {
  font-size: calc(20 * 60rem / 430);
  font-weight: 600;
  color: #704235;
  text-align: left;
  margin-top: calc(10 * 60rem / 430);
  line-height: 1.4;
}

.sec_other li .txt_sm {
  font-size: calc(14 * 60rem / 430);
  color: #704235;
  text-align: left;
  margin-top: calc(10 * 60rem / 430);
  line-height: 1.65;
}



/* ========================================================
            * sec_special_event  *
========================================================= */

.sec_special_event {
  margin-top: calc(322 * 60rem / 430);
  padding-top: calc(242 * 60rem / 430);
  min-height: calc(998 * 60rem / 430);
}

.sec_special_event::before {
  content: "";
  width: calc(899 * 60rem / 430);
  height: calc(986 * 60rem / 430);
  background: url(../../img/main/sec_special_event_bg.png?250825) no-repeat center top;
  background-size: 100% auto;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-60.5%);
  z-index: -1;
}

.sec_special_event .musicalnote {
  width: calc(125 * 60rem / 430);
  height: calc(149 * 60rem / 430);
  background: url(../../img/main/musicalnote04.png) no-repeat center;
  background-size: contain;
  position: absolute;
  bottom: calc(-140 * 60rem / 430);
  right: calc(22 * 60rem / 430);
}


.sec_special_event .ttl {
  font-size: calc(48 * 60rem / 430);
  font-weight: 700;
  font-family: var(--font_en);
  line-height: 1.5;
  margin-right: calc(13 * 60rem / 430);
}

.sec_special_event .ttl span {
  font-size: calc(32 * 60rem / 430);
  font-weight: 600;
  display: block;
  letter-spacing: .1em;
}

.sec_special_event .slide_wrap {
  margin-top: calc(38 * 60rem / 430);
}

.sec_special_event .slide_wrap .prev_button,
.sec_special_event .slide_wrap .next_button {
  top: 41%;
  transform: none;
}

.sec_special_event .slide_wrap .prev_button::after {
  background: url(../../img/main/prev_perple.svg) no-repeat center;
  background-size: 100%;
}

.sec_special_event .slide_wrap .next_button::after {
  background: url(../../img/main/next_perple.svg) no-repeat center;
  background-size: 100%;
}

.sec_special_event .slide_wrap li {
  position: relative;
  padding: calc(28 * 60rem / 430) calc(31 * 60rem / 430) calc(20 * 60rem / 430);
  border-radius: calc(10 * 60rem / 430);
  background: var(--color1);
}

.sec_special_event .slide_wrap li .icon {
  position: absolute;
  width: calc(96 * 60rem / 430);
  height: calc(96 * 60rem / 430);
  bottom: calc(-59 * 60rem / 430);
  right: calc(-23 * 60rem / 430);
}

.sec_special_event .slide_wrap li .img {
  width: 100%;
  height: calc(212 * 60rem / 430);
}

.sec_special_event .slide_wrap li .txt_lg {
  font-size: calc(18 * 60rem / 430);
  font-weight: 600;
  color: #704235;
  margin-top: calc(11 * 60rem / 430);
  padding-bottom: calc(7 * 60rem / 430);
  line-height: 1.3;
  text-align: left;
  border-bottom: calc(2 * 60rem / 430) solid #C569AB;
}

.sec_special_event .slide_wrap li .txt_sm {
  font-size: calc(14 * 60rem / 430);
  color: #704235;
  text-align: left;
  margin-top: calc(11 * 60rem / 430);
  line-height: 1.4;
}

/* ========================================================
            * sec_pickup_event  *
========================================================= */

.sec_pickup_event {
  margin-top: calc(40 * 60rem / 430);
  padding-top: calc(117 * 60rem / 430);
  min-height: calc(1017 * 60rem / 430);
}

.sec_pickup_event::before {
  content: "";
  width: calc(767 * 60rem / 430);
  height: calc(973 * 60rem / 430);
  background: url(../../img/main/sec_pickup_event_bg.png) no-repeat center top;
  background-size: 100% auto;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-61%);
  z-index: -1;
}

.sec_pickup_event::after {
  content: "";
  width: calc(430 * 60rem / 430);
  height: calc(972 * 60rem / 430);
  background: #000;
  position: absolute;
  top: calc(-209 * 60rem / 430);
  left: 0;
  z-index: -2;
}

.sec_pickup_event .ttl {
  font-size: calc(48 * 60rem / 430);
  font-weight: 700;
  font-family: var(--font_en);
  line-height: 1.5;
  margin-right: calc(13 * 60rem / 430);
}

.sec_pickup_event .ttl span {
  font-size: calc(32 * 60rem / 430);
  font-weight: 600;
  display: block;
  letter-spacing: .1em;
}


.sec_pickup_event .slide_wrap {
  margin-top: calc(36 * 60rem / 430);
}

.sec_pickup_event .slide_wrap .prev_button,
.sec_pickup_event .slide_wrap .next_button {
  top: 35%;
  transform: none;
}

.sec_pickup_event .slide_wrap .prev_button::after {
  background: url(../../img/main/prev_pink.svg) no-repeat center;
  background-size: 100%;
}

.sec_pickup_event .slide_wrap .next_button::after {
  background: url(../../img/main/next_pink.svg) no-repeat center;
  background-size: 100%;
}

.sec_pickup_event .slide_wrap li {
  background: var(--color1);
  padding: calc(26 * 60rem / 430) calc(32 * 60rem / 430) calc(26 * 60rem / 430);
  border-radius: calc(10 * 60rem / 430);
}

.sec_pickup_event .slide_wrap li .flex {
  display: flex;
  justify-content: space-between;
  padding-bottom: calc(14 * 60rem / 430);
}

.sec_pickup_event .slide_wrap li .column01 {
  width: calc(100% - calc(24 * 60rem / 430) - calc(96 * 60rem / 430));
}

.sec_pickup_event .slide_wrap li .column01 .head {
  font-size: calc(18 * 60rem / 430);
  font-weight: 600;
  background: #F87889;
  width: fit-content;
  padding: calc(7 * 60rem / 430) calc(32 * 60rem / 430);
  letter-spacing: .1em;
  border-radius: calc(8 * 60rem / 430);
}

.sec_pickup_event .slide_wrap li .column01 .txt {
  font-size: calc(14 * 60rem / 430);
  font-weight: 600;
  color: #704235;
  text-align: left;
  line-height: 1.6;
  margin-top: calc(12 * 60rem / 430);
}

.sec_pickup_event .slide_wrap li .column01 .date {
  font-size: calc(13 * 60rem / 430);
  line-height: 1.75;
  font-weight: 600;
  color: #704235;
  text-align: left;
  margin-top: calc(13 * 60rem / 430);
}

.slide_wrap li .note {
  font-size: calc(12 * 60rem / 430);
  color: #704235;
  text-align: left;
  margin-top: calc(13 * 60rem / 430);
  line-height: 1.5;
}

.sec_pickup_event .slide_wrap li .column02 {
  text-align: center;
}

.sec_pickup_event .slide_wrap li .column02 .img {
  width: calc(96 * 60rem / 430);
  height: calc(96 * 60rem / 430);
  border-radius: 50%;
  overflow: hidden;
  /* border: calc(1 * 60rem / 430) solid #707070; */
  margin-right: 0;
  margin-left: auto;
}

.sec_pickup_event .slide_wrap li .column02 .name {
  font-size: calc(14 * 60rem / 430);
  color: #704235;
  margin-top: calc(10 * 60rem / 430);
}

.sec_pickup_event .slide_wrap li .column02 .furigana {
  font-size: calc(12 * 60rem / 430);
  color: #704235;
  margin-top: calc(7 * 60rem / 430);
  display: block;
}

.sec_pickup_event .slide_wrap li .column03 {
  border-top: calc(2 * 60rem / 430) solid #F87889;
}

.sec_pickup_event .slide_wrap li .column03 .detail {
  margin-top: calc(12 * 60rem / 430);
  font-size: calc(14 * 60rem / 430);
  font-weight: 600;
  color: #704235;
  text-align: left;
  line-height: 1.5;
}

.btn_reservation {
  border: calc(1 * 60rem / 430) solid #F87889;
  margin-top: calc(11 * 60rem / 430);
}

.btn_reservation a {
  color: #F87889;
}

.sec_pickup_event .slide_wrap li .column03 .profile {
  background: rgb(250, 115, 133, .1);
  padding: calc(12 * 60rem / 430) calc(11 * 60rem / 430) calc(21 * 60rem / 430);
  margin-top: calc(16 * 60rem / 430);
}

.sec_pickup_event .slide_wrap li .column03 .name {
  font-size: calc(15 * 60rem / 430);
  font-weight: 600;
  color: #704235;
  letter-spacing: .05em;
  line-height: 1.5;
}

.sec_pickup_event .slide_wrap li .column03 .txt {
  font-size: calc(14 * 60rem / 430);
  color: #704235;
  text-align: left;
  line-height: 1.4;
  margin-top: calc(10 * 60rem / 430);
}


/* ========================================================
            * sec_pickup_item  *
========================================================= */

.sec_pickup_item {
  margin-top: calc(25 * 60rem / 430);
  padding-top: calc(112 * 60rem / 430);
  min-height: calc(1066 * 60rem / 430);
}

.sec_pickup_item::before {
  content: "";
  width: calc(853 * 60rem / 430);
  height: calc(1066 * 60rem / 430);
  background: url(../../img/main/sec_pickup_item_bg.png) no-repeat center top;
  background-size: 100% auto;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-54%);
  z-index: -1;
}


.sec_pickup_item .ttl {
  font-family: var(--font_en);
  font-size: calc(48 * 60rem / 430);
  font-weight: 700;
  color: #724235;
  line-height: 1.5;
  margin-right: calc(12 * 60rem / 430);
}

.sec_pickup_item .ttl span {
  font-family: var(--font_ja);
  font-size: calc(32 * 60rem / 430);
  display: block;
  letter-spacing: .1em;
  font-weight: 600;
}

.sec_pickup_item .prev_button::after {
  background: url(../../img/main/prev_green.svg) no-repeat center;
  background-size: 100%;
}

.sec_pickup_item .next_button::after {
  background: url(../../img/main/next_green.svg) no-repeat center;
  background-size: 100%;
}

.sec_pickup_item .slide_wrap {
  margin-top: calc(18 * 60rem / 430);
}

.sec_pickup_item .slide_wrap .next_button::after {
  background: url(../../img/main/next_green.svg) no-repeat center;
  background-size: 100%;
}

.sec_pickup_item .slide_wrap .prev_button::after {
  background: url(../../img/main/prev_green.svg) no-repeat center;
  background-size: 100%;
}

.sec_pickup_item .slide_wrap li {
  padding: calc(27 * 60rem / 430) calc(54 * 60rem / 430) calc(30 * 60rem / 430);
  background: var(--color1);
  border-radius: calc(10 * 60rem / 430);
}

.sec_pickup_item .slide_wrap .img {
  width: 100%;
  height: calc(249 * 60rem / 430);
  overflow: hidden;
}

.sec_pickup_item .slide_wrap .brand {
  font-size: calc(15 * 60rem / 430);
  font-weight: 600;
  text-align: left;
  color: #704235;
  margin-top: calc(18 * 60rem / 430);
}

.sec_pickup_item .slide_wrap .name {
  font-size: calc(14 * 60rem / 430);
  font-weight: 600;
  color: #704235;
  line-height: 1.4;
  text-align: left;
  margin-top: calc(10 * 60rem / 430);
}

.sec_pickup_item .slide_wrap .txt {
  font-size: calc(14 * 60rem / 430);
  color: #704235;
  line-height: 1.4;
  text-align: left;
  margin-top: calc(7 * 60rem / 430);
}

.sec_pickup_item .slide_wrap .price {
  font-size: calc(15 * 60rem / 430);
  font-weight: 600;
  color: #704235;
  text-align: left;
  margin-top: calc(13 * 60rem / 430);
}

.sec_pickup_item .slide_wrap .btn_detail {
  border: calc(1 * 60rem / 430) solid #63BB53;
  margin-top: calc(24 * 60rem / 430);
  width: 118%;
  transform: translateX(-7%);
}

.sec_pickup_item .slide_wrap .btn_detail a {
  color: #63BB53;
}





/* ========================================================
            * sec_lineup  *
========================================================= */

.sec_lineup {
  margin-top: calc(83 * 60rem / 430);
  padding-top: calc(159 * 60rem / 430);
  min-height: calc(1248 * 60rem / 430);
}

.sec_lineup::before {
  content: "";
  width: calc(887 * 60rem / 430);
  height: calc(1236 * 60rem / 430);
  background: url(../../img/main/sec_lineup_bg01.png) no-repeat center top;
  background-size: 100% auto;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-63%);
  z-index: -1;
}

.sec_lineup .ttl {
  font-size: calc(48 * 60rem / 430);
  font-weight: 700;
  font-family: var(--font_en);
}

.sec_lineup .tab_wrap {}

.sec_lineup .tab_btn {
  width: calc(356 * 60rem / 430);
  margin: calc(23 * 60rem / 430) auto 0;
  display: flex;
  flex-wrap: wrap;
  gap: calc(20 * 60rem / 430) calc(22 * 60rem / 430);
}

.sec_lineup .tab_btn li {
  width: calc(167 * 60rem / 430);
  height: calc(45 * 60rem / 430);
  padding: calc(13 * 60rem / 430) 0;
  background: var(--color1);
  border-radius: calc(10 * 60rem / 430);
  font-size: calc(21 * 60rem / 430);
  font-weight: 600;
  color: #724235;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}

.sec_lineup .tab_btn li span {
  font-size: calc(18 * 60rem / 430);
}

.sec_lineup .tab_btn li.is-active {
  color: var(--color1);
}

.sec_lineup .tab_btn li:nth-of-type(1).is-active {
  background: #1E54A2;
}

.sec_lineup .tab_btn li:nth-of-type(2).is-active {
  background: #20A06C;
}

.sec_lineup .tab_btn li:nth-of-type(3).is-active {
  background: #FFC85C;
}

.sec_lineup .tab_btn li:nth-of-type(4).is-active {
  background: #56418F;
}

.sec_lineup .tab_btn li:nth-of-type(5).is-active {
  background: #EB6A30;
}

.sec_lineup .tab_btn li:nth-of-type(6).is-active {
  background: #E473A5;
}



.sec_lineup .tab_contents {
  margin-top: calc(34 * 60rem / 430);
}

.sec_lineup .tab_contents>li {
  display: none;
}

.sec_lineup .tab_contents>li.is-active {
  display: block;
}

.sec_lineup .tab_contents .tab_head {
  font-size: calc(24 * 60rem / 430);
  font-weight: 600;
  padding: calc(8 * 60rem / 430) 0;
  border-radius: calc(10 * 60rem / 430);
}

.sec_lineup .tab_contents #menu1 .tab_head {
  background: #1D54A2;
}

.sec_lineup .tab_contents #menu2 .tab_head {
  background: #20A06C;
}

.sec_lineup .tab_contents #menu3 .tab_head {
  background: #FFC85C;
}

.sec_lineup .tab_contents #menu4 .tab_head {
  background: #56418F;
}

.sec_lineup .tab_contents #menu5 .tab_head {
  background: #EB6A30;
}

.sec_lineup .tab_contents #menu6 .tab_head {
  background: #E473A5;
}

.sec_lineup .slide_wrap {}

.sec_lineup .slide_wrap .prev_button,
.sec_lineup .slide_wrap .next_button {
  top: 50%;
  transform: none;
}

.sec_lineup #menu1.slide_wrap .prev_button::after {}

.sec_lineup #menu1.slide_wrap .next_button::after {}

.sec_lineup #menu2.slide_wrap .prev_button::after {
  background: url(../../img/main/prev_var01.svg) no-repeat center;
  background-size: 100%;
}

.sec_lineup #menu2.slide_wrap .next_button::after {
  background: url(../../img/main/next_var01.svg) no-repeat center;
  background-size: 100%;
}

.sec_lineup #menu3.slide_wrap .prev_button::after {
  background: url(../../img/main/prev_var02.svg) no-repeat center;
  background-size: 100%;
}

.sec_lineup #menu3.slide_wrap .next_button::after {
  background: url(../../img/main/next_var02.svg) no-repeat center;
  background-size: 100%;
}

.sec_lineup #menu4.slide_wrap .prev_button::after {
  background: url(../../img/main/prev_var03.svg) no-repeat center;
  background-size: 100%;
}

.sec_lineup #menu4.slide_wrap .next_button::after {
  background: url(../../img/main/next_var03.svg) no-repeat center;
  background-size: 100%;
}

.sec_lineup #menu5.slide_wrap .prev_button::after {
  background: url(../../img/main/prev_var04.svg) no-repeat center;
  background-size: 100%;
}

.sec_lineup #menu5.slide_wrap .next_button::after {
  background: url(../../img/main/next_var04.svg) no-repeat center;
  background-size: 100%;
}

.sec_lineup #menu6.slide_wrap .prev_button::after {
  background: url(../../img/main/prev_var05.svg) no-repeat center;
  background-size: 100%;
}

.sec_lineup #menu6.slide_wrap .next_button::after {
  background: url(../../img/main/next_var05.svg) no-repeat center;
  background-size: 100%;
}

.sec_lineup .slide_wrap ul {
  margin-top: calc(13 * 60rem / 430);
}


.sec_lineup .slide_wrap li {
  background: var(--color1);
  padding: calc(27 * 60rem / 430) calc(55 * 60rem / 430) calc(30 * 60rem / 430);
  border-radius: calc(10 * 60rem / 430);
}

.sec_lineup .slide_wrap .img {
  height: calc(249 * 60rem / 430);
  overflow: hidden;
  width: 100%;
  height: calc(249 * 60rem / 430);
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}

.sec_lineup .slide_wrap .brand {
  font-size: calc(15 * 60rem / 430);
  font-weight: 600;
  text-align: left;
  color: #704235;
  margin-top: calc(15 * 60rem / 430);
}

.sec_lineup .slide_wrap .name {
  font-size: calc(14 * 60rem / 430);
  font-weight: 600;
  color: #704235;
  line-height: 1.4;
  text-align: left;
  margin-top: calc(10 * 60rem / 430);
}

.sec_lineup .slide_wrap .txt {
  font-size: calc(14 * 60rem / 430);
  color: #704235;
  line-height: 1.4;
  text-align: left;
  margin-top: calc(7 * 60rem / 430);
}

.sec_lineup .slide_wrap .price {
  font-size: calc(15 * 60rem / 430);
  font-weight: 600;
  color: #704235;
  text-align: left;
  margin-top: calc(15 * 60rem / 430);
}

.sec_lineup .slide_wrap .btn_detail {
  border: calc(1 * 60rem / 430) solid #FA8AA7;
  margin-top: calc(22 * 60rem / 430);
  width: 119%;
  transform: translateX(-8%);
}

.sec_lineup .slide_wrap .btn_detail a {
  color: #FA8AA7;
}


/* ========================================================
            * sec_map  *
========================================================= */

.sec_map {
  margin-top: calc(57 * 60rem / 430);
  padding-top: calc(146 * 60rem / 430);
  min-height: calc(903 * 60rem / 430);
}

.sec_map::before {
  content: "";
  width: calc(806 * 60rem / 430);
  height: calc(903 * 60rem / 430);
  background: url(../../img/main/sec_map_bg.png) no-repeat center top;
  background-size: 100% auto;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: -1;
}

.sec_map::after {
  content: "";
  width: calc(430 * 60rem / 430);
  height: calc(972 * 60rem / 430);
  background: #000;
  position: absolute;
  top: calc(-235 * 60rem / 430);
  left: 0;
  z-index: -2;
}

.sec_map .ttl {
  font-size: calc(48 * 60rem / 430);
  font-family: var(--font_en);
  font-weight: 700;
  position: relative;
  margin-left: calc(150 * 60rem / 430);
  color: #7866E0;
  display: flex;
  align-items: center;
}

.sec_map .ttl span {
  font-size: calc(36 * 60rem / 430);
  font-family: var(--font_ja);
  letter-spacing: .1em;
  padding-right: calc(9 * 60rem / 430);
  display: inline-block;
  font-weight: 600;
}

.sec_map .ttl::before {
  content: "";
  width: calc(44 * 60rem / 430);
  height: calc(53 * 60rem / 430);
  background: url(../../img/main/icon_map_perple.svg) no-repeat center;
  background-size: 100%;
  position: absolute;
  top: calc(-3 * 60rem / 430);
  left: calc(-65 * 60rem / 430);
}

.sec_map .map {
  width: calc(350 * 60rem / 430);
  height: calc(350 * 60rem / 430);
  border-radius: calc(10 * 60rem / 430);
  margin: calc(30 * 60rem / 430) auto 0;
  display: flex;
  justify-content: center;
  align-items: center;
  background: var(--color1);
  overflow: hidden;
}


.sec_map .map .txt {
  font-size: calc(77 * 60rem / 430);
  font-family: var(--font-en);
  font-weight: 700;
  color: #7866E0;
  letter-spacing: .05em;
}





/* ========================================================
            * footer_information  *
========================================================= */

.footer_information {
  min-height: calc(1712 * 60rem / 430);
  background: #6BC4DE;
  margin-top: calc(-226 * 60rem / 430);
  padding-top: calc(314 * 60rem / 430);
  z-index: -2;
}

.footer_information::before {
  bottom: 0;
  top: auto;
  z-index: -2;
}

.footer_information .bord {
  background: var(--color1);
  width: calc(355 * 60rem / 430);
  margin: 0 auto;
  border-radius: calc(10 * 60rem / 430);
  padding: calc(25 * 60rem / 430) calc(20 * 60rem / 430) calc(29 * 60rem / 430);
}

.footer_information .ttl {
  font-size: calc(48 * 60rem / 430);
  font-family: var(--font-en);
  font-weight: 700;
  color: #335CD0;
}

.footer_information ul {}

.footer_information li {
  margin-top: calc(20 * 60rem / 430);
}

.footer_information li:not(:first-of-type) {
  margin-top: calc(26 * 60rem / 430);
}

.footer_information ul .ttl {
  font-size: calc(48 * 60rem / 430);
  font-weight: 700;
  font-family: var(--font_en);
}

.footer_information ul .head {
  font-size: calc(18 * 60rem / 430);
  font-weight: 600;
  padding: calc(7 * 60rem / 430) 0;
  width: 100%;
  border-radius: calc(10 * 60rem / 430);
  background: #335CD0;
  position: relative;
  width: calc(300 * 60rem / 430);
  margin: 0 auto;
}

.footer_information ul li:nth-of-type(1) .head::before {
  content: "";
  width: calc(19 * 60rem / 430);
  height: calc(23 * 60rem / 430);
  background: url(../../img/main/icon_map.svg) no-repeat center;
  background-size: 100%;
  position: absolute;
  top: 50%;
  left: calc(15 * 60rem / 430);
  transform: translateY(-50%);
}

.footer_information ul li:nth-of-type(2) .head::before {
  content: "";
  width: calc(17 * 60rem / 430);
  height: calc(24 * 60rem / 430);
  background: url(../../img/main/icon_train.svg) no-repeat center;
  background-size: 100%;
  position: absolute;
  top: 50%;
  left: calc(16 * 60rem / 430);
  transform: translateY(-50%);
}

.footer_information ul li:nth-of-type(3) .head::before {
  content: "";
  width: calc(26 * 60rem / 430);
  height: calc(20 * 60rem / 430);
  background: url(../../img/main/icon_car.svg) no-repeat center;
  background-size: 100%;
  position: absolute;
  top: 50%;
  left: calc(11 * 60rem / 430);
  transform: translateY(-50%);
}

.footer_information ul li:nth-of-type(4) .head::before {
  content: "";
  width: calc(20 * 60rem / 430);
  height: calc(21 * 60rem / 430);
  background: url(../../img/main/icon_calendar.svg) no-repeat center;
  background-size: 100%;
  position: absolute;
  top: 50%;
  left: calc(15 * 60rem / 430);
  transform: translateY(-50%);
}

.footer_information ul li:nth-of-type(5) .head::before {
  content: "";
  width: calc(20 * 60rem / 430);
  height: calc(21 * 60rem / 430);
  background: url(../../img/main/icon_clock.svg) no-repeat center;
  background-size: 100%;
  position: absolute;
  top: 50%;
  left: calc(14 * 60rem / 430);
  transform: translateY(-50%);
}


.footer_information ul .txt {
  font-size: calc(15 * 60rem / 430);
  color: #704235;
  margin-top: calc(14 * 60rem / 430);
  line-height: 1.55;
}


.contact_area {
  padding-top: calc(50 * 60rem / 430);
  padding-bottom: calc(138 * 60rem / 430);
}

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


.eye_pyonpyon {
  width: calc(318 * 60rem / 430);
  height: calc(175 * 60rem / 430);
  background: url(../../img/main/eye_pyonpyon.png) no-repeat center;
  background-size: contain;
  position: absolute;
  top: calc(30 * 60rem / 430);
  right: calc(-16 * 60rem / 430);
  animation: eye_bound 2.5s ease infinite;
}

.sec_pickup_event .musicalnote {
  width: calc(139 * 60rem / 430);
  height: calc(154 * 60rem / 430);
  background: url(../../img/main/musicalnote01.png) no-repeat center;
  background-size: contain;
  position: absolute;
  top: calc(-45 * 60rem / 430);
  left: calc(22 * 60rem / 430);
  animation: eye_bound 2.5s ease infinite;
}

.sec_lineup .musicalnote {
  width: calc(140 * 60rem / 430);
  height: calc(167 * 60rem / 430);
  background: url(../../img/main/musicalnote02.png) no-repeat center;
  background-size: contain;
  position: absolute;
  bottom: calc(2 * 60rem / 430);
  right: calc(49 * 60rem / 430);
  animation: eye_bound 2.5s ease infinite;
}

@keyframes eye_bound {

  0%,
  100%,
  50%,
  70%,
  90% {
    transform: none
  }

  60%,
  80% {
    transform: translateY(-6rem)
  }
}


.tail {
  width: calc(319 * 60rem / 430);
  height: calc(230 * 60rem / 430);
  background: url(../../img/main/tail.png) no-repeat center;
  background-size: 100%;
  position: absolute;
  bottom: calc(171 * 60rem / 430);
  right: calc(-31 * 60rem / 430);
  transform: rotate(-49deg);
  z-index: 1;
  transform-origin: 100%;
}

@keyframes shippo {
  0% {
    transform: rotate(0deg);
  }

  50% {
    transform: rotate(-30deg);
    /* パッと仰ぐ */
  }

  100% {
    transform: rotate(0deg);
    /* 戻る（余韻） */
  }
}


.plate {
  width: calc(308 * 60rem / 430);
  height: calc(153 * 60rem / 430);
  background: url(../../img/main/plate.png) no-repeat center;
  background-size: contain;
  position: absolute;
  top: calc(-34 * 60rem / 430);
  left: calc(-79 * 60rem / 430);
  animation: pakaJump 2s linear infinite;

}

@keyframes pakaJump {
  0% {
    transform: rotate(0deg) translateY(0);
  }

  50% {
    transform: rotate(-19deg) translateY(calc(-50 * 60rem / 430));
  }

  80% {
    transform: rotate(0deg) translateY(0);
  }

  100% {
    transform: rotate(0deg) translateY(0);
  }

  /* 最後の20%は停止 */
}


.crown {
  width: calc(283 * 60rem / 430);
  height: calc(196 * 60rem / 430);
  background: url(../../img/main/crown.png) no-repeat center;
  background-size: contain;
  position: absolute;
  top: calc(-79 * 60rem / 430);
  right: calc(32 * 60rem / 430);
  transform: rotate(34deg);
  animation: tilt 2s linear infinite;
  transform-origin: center;
}

@keyframes tilt {
  0% {
    transform: rotate(34deg);
  }

  25% {
    transform: rotate(44deg);
  }

  50% {
    transform: rotate(34deg);
  }

  75% {
    transform: rotate(24deg);
  }

  100% {
    transform: rotate(34deg);
  }
}

.eyelids {
  width: calc(201 * 60rem / 430);
  height: calc(91 * 60rem / 430);
  background: url(../../img/main/eyelids.png) no-repeat center;
  background-size: contain;
  position: absolute;
  bottom: calc(195 * 60rem / 430);
  left: calc(60 * 60rem / 430);
  transform: rotate(-18deg);
  animation: topandbottom 2s linear infinite;
  transform-origin: center center;
}

@keyframes topandbottom {
  0% {
    transform: rotate(-18deg) translateY(0) scale(1, 1);
  }

  20% {
    transform: rotate(-18deg) translateY(calc(50 * 60rem / 430)) scale(1.6, 3);
  }

  30% {
    transform: rotate(-18deg) translateY(calc(10 * 60rem / 430)) scale(1.6, 1.6);
  }

  40% {
    transform: rotate(-18deg) translateY(calc(50 * 60rem / 430)) scale(1.6, 3);
  }

  70% {
    transform: rotate(-18deg) translateY(0) scale(1, 1);
  }

  80% {
    transform: rotate(-18deg) translateY(0) scale(1, 1);
  }

  100% {
    transform: rotate(-18deg) translateY(0) scale(1, 1);
  }
}


.tongue {
  width: calc(338 * 60rem / 430);
  height: calc(55 * 60rem / 430);
  background: url(../../img/main/tongue.png) no-repeat center;
  background-size: contain;
  position: absolute;
  bottom: calc(43 * 60rem / 430);
  right: calc(-53 * 60rem / 430);
  transform: rotate(-21deg);
  transform-origin: right center;

}

@keyframes berobero {
  0% {
    transform: rotate(-21deg) scale(.5, 1);
  }

  20% {
    transform: rotate(-21deg) scale(1, 1);
  }

  40% {
    transform: rotate(-21deg) scale(.5, 1);
  }

  50% {
    transform: rotate(-21deg) scale(.7, 1);
  }

  60% {
    transform: rotate(-21deg) scale(.5, 1);
  }

  70% {
    transform: rotate(-21deg) scale(.7, 1);
  }

  100% {
    transform: rotate(-21deg) scale(.5, 1);
  }
}

.glasses {
  left: calc(0 * 60rem / 430);
}



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

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

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

body.no_scroll {
  overflow: hidden;
}

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

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

.lp_contents .modal_outside {
  position: fixed;
  z-index: 1000;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  transition: opacity .5s;
  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: #e6e6e6;
  opacity: .7;
  content: "";
}

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

.lp_contents .modal_wrap {
  width: calc(430 * (60rem / 430));
  height: auto;
  margin: 0 auto;
  -ms-overflow-style: none;
  scrollbar-width: none;
  will-change: transform;
}

.lp_contents .modal_outside.hide .modal_wrap {
  animation: slideOut 0.8s cubic-bezier(0.34, 0.07, 0.095, 0.995);
}

.lp_contents .modal_outside .modal_wrap {
  animation: slideIn 0.8s cubic-bezier(0.34, 0.07, 0.095, 0.995);
}

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

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

.lp_contents .modal_content {}



@media (min-width: 769px) {
  .lp_contents .modal_wrap {
    width: 80rem;
  }

  .lp_contents .modal_content {}

}