﻿@charset "UTF-8";
/*//////////////////////////////////////////////////

Title : LP CSS

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

/* ========================================================
                   * Custom Properties *
========================================================= */

:root {
  --main-color: #00ff00;
  --main-dark-color: #06c355;
  --txt-en1: 'futura-pt', "Noto Sans JP", sans-serif;
  --txt-en2: 'futura-pt', "Noto Sans JP", sans-serif;
}

/* ========================================================
                      * Layout style *
========================================================= */

#Wrap,
.contents {
  width: 100%;
  max-width: 100%;
}

.share-txt span {
}

#share {
  z-index: 100 !important;
}

/* ===================
  LP Contents
=================== */

.lp_contents {
  position: relative;
  margin: 0 auto;
  padding: 0;
  letter-spacing: 0;
  color: #000;
  font-size: 1.4rem;
  font-family: 'futura-pt', 'Noto Sans JP', sans-serif;
}

.txt_en {
  font-family:'futura-pt', 'Noto Sans JP', sans-serif;
}

#FooterWrap {
  position: relative;
  z-index: inherit;
}

.lp_contents *,
.lp_contents *:before,
.lp_contents *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

.lp_contents ul,
.lp_contents li {
  list-style: none;
}

.lp_contents a:hover {
}

.lp_contents img {
  max-width: 100%;
}

.lp_contents sup {
  color: #888;
}

.lp_contents a,
.lp_contents a:before,
.lp_contents a:after,
.lp_contents a img {
  transition: opacity .3s ease-in-out,
    color .3s ease-in-out,
    background-color .3s ease-in-out,
    background-image .3s ease-in-out,
    border-color .3s ease-in-out,
    text-shadow .3s ease-in-out,
    text-weight .3s ease-in-out;
}

.lp_contents h1 {
  padding: 0;
}

p {
  text-align: left;
}

/* -- List -- */

.list ul {
  letter-spacing: -0.4em;
}

.list ul li {
  display: inline-block;
  letter-spacing: 0.08em;
  vertical-align: top;
}

/* ===================
  　Page Menu
=================== */

.lp_menu {
  opacity: 0;
  transition: opacity .3s ease-in-out;
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 33;
  font-size: 1.4rem;
}

.lp_menu.fixed {
  opacity: 1;
}

/* ===================
  　　 General
=================== */

.lp_contents .txt_center {
  text-align: center;
}

.lp_contents .txt_bold {
  font-weight: bold;
}

.lp_contents .txt_en {
  font-family: 'Cinzel', serif;
}


@keyframes fadeIn {
  0% {
    display: none;
    opacity: 0;
  }
  100% {
    display: block;
    opacity: 1;
  }
}

/* ===================
  　　　Animation
=================== */

/* -- keyframes -- */

@keyframes opa0 {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@keyframes opa1 {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes opa2 {
  0% {
    opacity: 0;
    filter: blur(10px);
  }

  100% {
    opacity: 1;
    filter: blur(0);
  }
}

@keyframes tra1 {
  100% {
    transform: translateX(0);
  }
}

@keyframes tra2 {
  100% {
    transform: translateY(0);
  }
}

@keyframes tra3 {
  0% {
    transform: translateY(50px);
  }

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

@keyframes tra3_2 {
  0% {
    transform: translateY(30px);
  }

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

@keyframes tra4 {
  0% {
    transform: translateX(6%);
  }

  100% {
    transform: translateX(0);
  }
}


@keyframes tra5 {
  0% {
    transform: translateX(-30%);
  }

  100% {
    transform: translateX(0);
  }
}


@keyframes tra6 {
  0% {
    transform: translateX(-50%);
  }

  100% {
    transform: translateX(0);
  }
}

.ef {
  opacity: 0;
}

.ef.effect {
  animation: opa1 1s ease-in-out 0s 1 forwards;
}

.ef2 {
  opacity: 0;
}

.ef2.effect {
  animation: opa2 1.5s ease-in-out 0s 1 forwards;
}

.ef-top {
  opacity: 0;
  transform: translateY(50px);
}


.ef-top.effect {
  animation: opa1 1.1s ease-in-out 0s 1 forwards, tra3 1s ease-in-out 0s 1 forwards;
}

.ef-top2 {
  opacity: 0;
  transform: translateY(40px);
}

.ef-top2.effect {
  animation: opa1 1.1s ease-in-out 0s 1 forwards, tra3_2 1s ease-in-out 0s 1 forwards;
}

.ef-right {
  opacity: 0;
  transform: translateX(6%);
}

.ef-right.effect {
  animation: opa1 1.2s ease-in-out 0s 1 forwards, tra4 1.2s ease-in-out 0s 1 forwards;
}

.ef-left {
  opacity: 0;
}

.ef-left.effect {
  animation: opa1 1.5s ease-in-out 0s 1 forwards, tra5 1.5s ease-in-out 0s 1 forwards;
}

.ef-lg.effect {
  animation: opa1 1.5s ease-in-out 0s 1 forwards, tra6 1.5s ease-in-out 0s 1 forwards;
}

@keyframes yurayura {
  0% , 100%{
      transform: rotate(-5deg);
  }
  50%{
      transform: rotate(5deg);
  }
}

@keyframes yurayura2 {
  0% , 100%{
      transform: rotate(336deg);
  }
  50%{
      transform: rotate(340deg);
  }
}

@keyframes yurayura3 {
  0% , 100%{
      transform: rotate(2deg);
  }
  50%{
      transform: rotate(-2deg);
  }
}

@keyframes yurayura4 {
  0% , 100%{
      transform: rotate(3deg);
  }
  50%{
      transform: rotate(-3deg);
  }
}
@keyframes pyon {
  0% {
    transform: translate(0, 0) rotate(0deg);
  }
  10% {
    transform: translate(0, -10%) rotate(5deg);
  }
  25% {
    transform: translate(0, 0) rotate(0deg);
  }
  50% {
    transform: translate(0, -25%) rotate(5deg);
  }
  100% {
    transform: translate(0, 0) rotate(0deg);
  }
}

/* ===================
  　Section Common
=================== */

.section .inner {
  width: 120rem;
  max-width: 100%;
  margin: auto;
}

.float_left {
  float: left;
}

.float_right {
  float: right;
}

.sec_inner {
  width: 102rem;
  max-width: 100%;
  margin: 0 auto;
  text-align: left;
}

.ttl_main {
  margin: 0 0 2.5rem;
  font-size: 3rem;
  font-weight: normal;
  letter-spacing: 0.05rem;
  line-height: 1.25;
  text-align: center;
  font-weight: bold;
}

.clearfix::after {
  content: "";
  display: block;
  clear: both;
}

/* ===================
     Text Setting
=================== */

.txt_cont {
  text-align: center;
  line-height: 1.7;
}

/* ===================
  Button Setting
=================== */

.btn_wrap {
  text-align: center;
}

/* ===================
  　　　INTRO
=================== */

.intro_section {
  font-size: 2rem;
}

.intro_section_inner {
  padding-top: 8rem;
  padding-bottom: 4.5rem;
  background: var(--main-color);
}

.mv_img {
  display: block;
  width: 110rem;
  max-width: 100%;
  margin: auto auto 5.2rem;
}

/* ---- COUNT DOWN ---- */
.intro_section .countdown_area {
  width: 44.8rem;
  max-width: 100%;
  margin: auto auto 10.6rem;
  font-family: var(--txt-en1);
}

.intro_section .countdown_area .countdown_ttl {
  position: relative;
  margin: auto auto 4.7rem;
  font-size: 2.1rem;
  font-weight: 500;
  text-align: center;
  letter-spacing: 0.05em;
}

.intro_section .countdown_area .countdown_ttl::before {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 1px;
  background: #000;
  content: "";
}

.intro_section .countdown_area .countdown_ttl span {
  position: relative;
  z-index: 1;
  display: inline-block;
  padding: 0 1rem;
  background: var(--main-color);
}

.intro_section .countdown_set {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #000;
}

.intro_section .countdown_set #days,
.intro_section .countdown_set #hours,
.intro_section .countdown_set #minutes,
.intro_section .countdown_set #seconds {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 8rem;
  height: 10rem;
  background: #fff;
  text-align: center;
  color: #000;
  font-size: 4.7rem;
}
.intro_section .countdown_set #days::after,
.intro_section .countdown_set #hours::after,
.intro_section .countdown_set #minutes::after,
.intro_section .countdown_set #seconds::after {
  position: absolute;
  right: 0;
  left: 0;
  bottom: -3.5rem;
  text-align: center;
  font-size: 1.6rem;
  font-weight: 600;
  letter-spacing: 0.01em;
}

.intro_section .countdown_set .txt_time {
  padding: 0 1rem 1rem;
  font-size: 4.7rem;
}

.intro_section .countdown_set #days {
  margin-right: 3.5rem;
}

.intro_section .countdown_set #days::after {
  content: "DAYS";
}

.intro_section .countdown_set #hours::after {
  content: "HOURS";
}

.intro_section .countdown_set #minutes::after {
  content: "MINUTES";
}

.intro_section .countdown_set #seconds::after {
  content: "SECONDS";
}
/* ---- COUNT DOWN FINISH ---- */

.countdown_finish {
  margin: 0 -12rem;
}

.countdown_finish p {
  text-align: center;
}

.finish_txt_intro {
  margin-bottom: 3rem;
  font-size: 1.9rem;
  background: #fff;
  color: var(--main-color);
  font-weight: bold;
}

.finish_txt_fukidashi {
  margin-bottom: 1rem;
  font-size: 1.8rem;
}

.finish_txt_main {
  margin-bottom: 3rem;
  font-size: 3.3rem;
  font-weight: bold;
}

.finish_txt_sub {
  font-size: 1.7rem;
  line-height: 2;
}

/* ---- スライドの動き等速 ---- */

.pickup_brand {
  margin-bottom: 8rem;
  background: #f7f5f4;
}

.pickup_brand .brand_ttl {
  margin-bottom: 3.5rem;
  text-align: center;
  letter-spacing: 0.1em;
}

.brand_slider {
  line-height: 1;
}

/* スライドの動き等速 */
.brand_slider .swiper-wrapper {
  transition-timing-function: linear;
}

.brand_slider .swiper-slide {
  width: auto;
  padding: 2.4rem 2.5rem;
  line-height: 1;
}

.brand_slider img {
  width: auto;
  max-width: 15rem;
  height: 2.7rem;
  vertical-align: middle;
}

.brand_slider .logo_tr {
  height: 3.4rem;
}

.brand_slider .logo_mitea {
  height: 3.4rem;
}

/* ---- LINE BUTTON ---- */

.intro_event {
  width: 44rem;
  margin: auto;
}

/* ---- INTRO TEXT ---- */

.intro_txt {
  position: relative;
  width: 110rem;
  margin: auto auto 7.1rem;
  font-size: 2rem;
  text-align: center;
  line-height: 2.4;
  letter-spacing: 0.02em;
}

.intro_txt::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 10.8rem;
  height: 11.8rem;
  background: url(../img/202411/icn_ck1.svg) no-repeat;
  background-size: 100%;
  content: "";
}

.intro_txt.intro_txt_finish {
  padding-bottom: 7.1rem;
}

/* ---- INTRO SHOP ---- */

.intro_shop {
  position: relative;
  width: 110rem;
  margin: auto auto 8rem;
  text-align: center;
}

.intro_shop::after {
  position: absolute;
  top: -10rem;
  right: 0;
  width: 10rem;
  height: 14.2rem;
  background: url(../img/202411/icn_ck2.svg) no-repeat;
  background-size: 100%;
  content: "";
}

.intro_shop dt {
  position: relative;
  z-index: 1;
  width: 21rem;
  padding: 0.7rem;
  margin: auto;
  background: var(--main-color);
  border-radius: 0.8rem;
  font-size: 2.2rem;
  text-align: center;
  letter-spacing: 0.2em;
}

.intro_shop dd {
  display: block;
  margin-top: -2rem;
  padding: 5.2rem 1rem 4rem;
  border-radius: 0.8rem;
  font-size: 1.8rem;
  background-color: #f7f5f4;
}

.intro_shop ul {
  display: flex;
  justify-content: center;
  gap: 3.2rem;
}

/* ---- MENU LIST ---- */

.lp_menu_list {
  background: var(--main-color);
}

.lp_menu_top {
  margin-bottom: 8rem;
}

.lp_menu_list ul {
  display: flex;
  justify-content: space-between;
  width: 120rem;
  max-width: 100%;
  margin: auto;
}

.lp_menu_top ul {
  justify-content: space-between;
}

.lp_menu_list li  {
  width: 33.333%;
}

.lp_menu_list li a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 0.6rem;
  padding: 2rem 0;
  color: #000;
  font-size: 1.8rem;
  text-align: center;
}

.lp_menu_top li a {
  gap: 0;
  padding: 2rem 0 4.5rem;
}

.lp_menu_list li a::before ,
.lp_menu_list li:last-child::before {
  position: absolute;
  top: 1rem;
  left: 0rem;
  bottom: 1rem;
  width: 1px;
  background: #000;
  content: "";
}

.lp_menu_list li:last-child {
  position: relative;
}

.lp_menu_list li:last-child::before {
  left: auto;
  right: 0;
}


.lp_menu_top li a::after {
  position: absolute;
  left: 50%;
  bottom: 1.5rem;
  width: 1.4rem;
  height: 1.4rem;
  border-bottom: 2px solid #000;
  border-right: 2px solid #000;
  transform: rotate(45deg) translateX(-50%);
  content: "";
}

.lp_menu_list .txt_bold {
  margin-bottom: .3rem;
  font-size: 2.4rem;
  font-weight: 500;
}

.lp_menu_list .txt_bold span {
  font-size: 3rem;
}

.lp_nav_area {
  padding-top: 0;
}

/* ===================
  　　TOP RANK
=================== */
.toprank_section {
  padding-top: 18rem;
  background: url(../img/main/bg_top_nav_pc.png) repeat-x top center;
  background-size: 180rem;
}

.toprank_section .inner {
  padding: 2rem 5rem 3rem;
}

.toprank_section .ttl_main {
  font-size: 2.8rem;
  text-align: center;
  color: var(--main-dark-color);
}

.toprank_section .item_list__item {
  position: relative;
  overflow: visible;
}

.toprank_section .item_list__item .item_list__item_inner {
  overflow: hidden;
  border-radius: 1rem;
}

.toprank_section .icn_rank {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: -1.2rem;
  left: -1rem;
  z-index: 22;
  width: 3.2rem;
  height: 3.2rem;
  border-radius: 100%;
  background: var(--main-color);
  font-size: 1.6rem;
  color: #fff;
  text-align: center;
}

.toprank_section .slick-list.draggable {
  overflow: visible;
}

/* ===================
  　　　EVENT
=================== */

.event_section {
  margin-bottom: 7.5rem;
}

.event_section .inner {
  padding: 3rem 5rem 5rem;
  background: #f7f5f4;
  font-size: 1.8rem;
}

.event_section .txt_content {
  font-size: 1.8rem;
  line-height: 1.6;
  letter-spacing: 0.05em;
  text-align: center;
}

.event_section .inner .txt_bold {
  padding: 0 .2rem;
}

.event_section .ttl_section {
  position: relative;
  margin-top: 3.5rem;
  font-size: 1.8rem;
  font-weight: normal;
  color: var(--main-dark-color);
}

/* -- ttl main -- */
.event_section .ttl_main {
  position: relative;
  padding-bottom: 2.5rem;
  border-bottom: 1px solid #595757;
}

.event_section .ttl_main .txt_main {
  display: block;
  color: var(--main-dark-color);
  font-size: 3.2rem;
  text-align: center;
  font-weight: 500;
  font-family: var(--txt-en1);
  line-height: 0.9;
}

.event_section .ttl_main .txt_main span {
  padding-right: 0.6rem;
  font-size: 2.5rem;
  font-weight: 500;
}

.event_section .ttl_main .txt_sub {
  display: block;
  padding-top: .8rem;
  font-size: 3rem;
  font-weight: 500;
}

.event_section .ttl_main .txt_sub .txt_bold {
}

.event_section .ttl_main .txt_sub sup {
  color: inherit;
  font-size: 1.8rem;
}

/* -- ttl finish -- */

.event_section .ttl_main_finish {
  display: flex;
  justify-content: center;
  line-height: 1.5;
  color: var(--main-dark-color);
}

.event_section .ttl_main_finish .txt_sub {
  font-size: 2.5rem;
  font-weight: bold;
}

.event_section .ttl_main_finish .txt_sm {
  font-size: 1.8rem;
  font-weight: 500;
}

/* -- ttl open -- */
.ttl_open {
  margin-top: 3rem;
  margin-bottom: 2.5rem;
  padding: .8rem .7rem .6rem;
  font-size: 1.8rem;
  font-weight: 400;
  background: #000;
  text-align: center;
  color: #fff;
  letter-spacing: 0.08em;
}

.ttl_open .txt_data {
  font-size: 2.2rem;
}

.img_commingsoon {
  width: 17rem;
}

.txt_brand_area {
  margin-bottom: 1.5rem;
  text-align: center;
  font-size: 1.6rem;
  line-height: 2;
}

.txt_brand_area .txt_sm {
  font-size: 1.4rem;
}

.cont_brandlist {
  padding-top: 1rem;
  padding-bottom: 1rem;
  background-color: #fff;
}

/* -- Accodion -- */

.event_section .acc_cont {
  display: none;
}

.event_section .acc_btn {
  position: relative;
  margin-top: 3rem;
  margin-bottom: 0;
  cursor: pointer;
  font-size: 2rem;
  text-align: center;
  padding: 0 0 4rem !important;
  pointer-events: none;
}

.event_section .acc_on + .acc_btn {
  width: 100%;
  pointer-events: all;
  margin-top: 0;
  padding-bottom: 2rem !important;
}
/*アコーディオングラデーション*/
.event_section .acc_btn::before {
  display: none;
  position: absolute;
  top: -16rem;
  left: 0;
  right: 0;
  height: 20rem;
  background:linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgb(255 255 255) 67%);
  content: "";
}

.event_section .acc_on + .acc_btn::before {
  display: block;
}

.event_section .acc_btn .icn_btn {
  position: relative;
  display: inline-block;
  padding-right: 3.2rem;
  letter-spacing: 0.04em;
  font-size: 2rem;
  line-height: 1;
  margin-right: 1rem;
}

.event_section .acc_btn .icn_btn::after {
  position: absolute;
  top: 16%;
  right: 0;
  z-index: 5;
  width: 1.5rem;
  height: 1.5rem;
  border-bottom: 2px solid #000;
  border-right: 2px solid #000;
  transform: rotate(45deg) translateY(-50%);
  content: "";
}

.event_section .acc_btn.active {
  margin-top: 4rem;
  padding-bottom: 3rem !important;
}

.event_section .acc_btn.active::before {
  display: none;
}

.event_section .acc_btn.active .icn_btn {
  padding-left: 0;
}

.event_section .acc_btn.active .icn_btn::after {
  transform: none;
  top: -2rem;
  left: 0;
  width: 9rem;
  height: 3rem;
  border: none;
  transform: none;
  background: url(../img/202411/acc_btn_close.svg) no-repeat 0 0;
  background-size: 100%;
  content: "";
}

.event_section .acc_btn.active .icn_btn span {
  display: none;
}

/* ===================
  　　　EVENT01
=================== */

.event01_section {
}

.event01_section .ttl_main::before {
  position: absolute;
  left: 0;
  bottom: -2rem;
  width: 9.9rem;
  height: 13.2rem;
  background: url(../img/202411/icn_ck3.svg) no-repeat;
  background-size: 100%;
  content: "";
}

.event01_section .txt_content {

}

/* ---- Tab Area ---- */

.tab_btn_area {
  margin-top: 3rem;
}

.tab_btn_area ul {
  display: flex;
}

.tab_btn_area .tab_btn {
  width: 50%;
  padding: 1rem;
  border-radius: 2rem 2rem 0 0;
  background: #e2e2e2;
  text-align: center;
  cursor: pointer;
  font-size: 2.2rem;
  line-height: 1.2;
}

.tab_btn_area .tab_btn.btn_off {
  pointer-events: none;
}

.tab_btn_area .tab_btn.selected {
  background-color: #fff;
}

.tab_btn_area .tab_btn span {
  display: block;
}

.tab_btn_area .tab_btn:hover {
  opacity: .65;
}

.tab_panel {
  display: none;
  background: #fff;
  padding: 3rem 2.4rem 4rem;
}

.tab_panel:first-child {
  display: block;
  animation: menu_fadein .25s ease 0s 1 forwards;
}

.tab_panel.is-active {
  animation: menu_fadein .25s ease 0s 1 forwards;
}

.txt_link_arw {
  margin: 2rem 0 0;
  padding: 0 2.6rem;
}

.txt_link_arw a {
  display: inline-block;
  position: relative;
  padding-right: 5rem;
  font-size: 2.2rem;
  color: var(--main-dark-color);
}

.txt_link_arw a::after {
  position: absolute;
  top: 50%;
  right: 0;
  z-index: 5;
  transform: translateY(-50%);
  width: 1.5rem;
  height: 1.5rem;
  margin-top: -0.1rem;
  border-bottom: 2px solid var(--main-dark-color);
  border-right: 2px solid var(--main-dark-color);
  transform: rotate(-45deg) translateY(-50%);
  content: "";
}

/* ---- SLIDEBAR ---- */

.js_item_slidebar02,
.js_item_slidebar02 * {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.js_item_slidebar02::-webkit-scrollbar,
.js_item_slidebar02 *::-webkit-scrollbar {
  display: none;
}

.js_item_slidebar02 .simplebar-content .item_list {
  display: inline-block;
  white-space: nowrap;
  padding-right: calc(10 * (100vw / 428));
}

.js_item_slidebar02 .simplebar-content .item_list .item_list__inner {
  display: flex;
  flex-wrap: nowrap;
}

.js_item_slidebar02 .simplebar-scrollbar::before {
  background: #6e6e6e;
  border-radius: 0;
  height: 2px !important;
}

.js_item_slidebar02 .simplebar-scrollbar.simplebar-visible::before {
  opacity: 1;
}

.js_item_slidebar02 .simplebar-track.simplebar-horizontal {
  background: #f5f5f5;
  height: 2px !important;
  margin: 0 calc(60 * (100vw / 428));
  padding: 0;
}

.js_item_slidebar02 .simplebar-track.simplebar-horizontal .simplebar-scrollbar {
  top: 0;
  height: 2px;
}

.js_item_slidebar02 .simplebar-track.simplebar-horizontal .simplebar-scrollbar:before {
  right: calc(-22 * (100vw / 428));
}

.js_item_slidebar02 .simplebar-track.simplebar-vertical {
  display: none;
}

/* ---- //SLIDEBAR ---- */


.event_cont {
  font-size: 1.7rem;
}

.event_cont p {
  text-align: center;
}

.event_cont ul li {
  display: flex;
  justify-content: center;
  align-items: center;
}

.event_cont ul li .event_img {
  text-align: left;
}
/*
.event_cont ul li:nth-child(2n) {
  flex-direction: row-reverse;
}*/

.event_cont ul li:nth-child(2n) .event_img {
  text-align: right;
}

.event_cont ul li p {
  width: 26rem;
}

.btn_link {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 45rem;
  height: 7.5rem;
  margin: auto auto 4.2rem;
  background: var(--main-color);
  border-radius: 1rem;
  font-size: 2rem;
  color: #000;
  letter-spacing: 0.08em;
}

.btn_link a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.btn_link::before {
  position: absolute;
  top: 50%;
  right: 2.5rem;
  width: 1.5rem;
  height: 1.5rem;
  border-bottom: 2px solid #000;
  border-right: 2px solid #000;
  transform: rotate(317deg) translateY(-50%);
  content: "";
}

.btn_link_check {
  width: 12.7rem;
  height: 4.5rem;
  margin: 0;
  border-radius: 20rem;
  background: #000;
  font-size: 1.8rem;
  color: #fff;
}

.btn_link_check::before {
  display: none;
}

/* ---- Point Up ---- */
.point_up {
  margin-bottom: 4.4rem;
  padding: 4rem 2rem 2rem;
  background: #fff;
}

.point_up,
.point_up p {
  text-align: center;
}

.point_up p {
  margin-bottom: 3rem;
  color: var(--main-dark-color);
}

.point_up picture {
  display: block;
  width: 37.6rem;
  margin: auto;
}

/* ===================
  　　　EVENT02
=================== */

.event02_section {
}

.event02_section .ttl_main::before {
  position: absolute;
  right: 0;
  bottom: -2rem;
  width: 9.9rem;
  height: 13.2rem;
  background: url(../img/202411/icn_ck4.svg) no-repeat;
  background-size: 100%;
  content: "";
}

.event03_section .ttl_section {
  margin-top: 8.5rem;
}
.event03_section .ttl_open + .ttl_section {
  margin-top: 3.5rem;
}

.event_section .event_list {
  position: relative;
  z-index: 10;
  margin-top: 1.5rem;
  margin-right: -5rem;
  padding-left: 0.5rem;
}

.event_section .event_list .item_list__item {
  width: 23rem;
  margin-right: 1rem;
  margin-left: 1rem;
}

.event_section .event_list .icn_rank {
  display: none;
}

.event_section .js_item_slider .slick-dots li button:not(.slick-active button) {
  background-color: #fff;
}

.event_section .item_list_common .item_list__item {
  margin-bottom: 3rem;
}

.js_item_slidebar02 .simplebar-track.simplebar-horizontal {
  background-color: #fff;
}

.event_list .item_list__brand {
  margin: 1rem 0;
  text-align: center;
  line-height: 1;
}

.event_list .item_list__brand.brand_etvos img {
  width: 9.5rem;
}

.event_list .item_list__brand.brand_ao {
}

.event_list .item_list__brand.brand_ao img {
  width: 14rem;
}

.event_list .item_list__brand.brand_toone img {
  width: 13rem;
}

.event_list .item_list__brand.brand_refa img {
  width: 8.3rem;
}

.event_list .item_list__brand.brand_mirai img {
  width: 11.3rem;
}

.event_list .item_list__brand.brand_lovec img {
  width: 14rem;
}

.event_list .item_list__brand.brand_sb img {
  width: 9rem;
}

.event_list .item_list__brand.brand_nahrin img {
  width: 10rem;
}

.event_list .item_list__brand.brand_femmue img {
  width: 9rem;
}

.event_list .item_list__brand.logo_lacasta img {
  width: 10rem;
}

/* ===================
  　　　EVENT03
=================== */

.event03_section {
}

.event03_section .ttl_main::before {
  position: absolute;
  left: 0;
  bottom: -1rem;
  width: 8.6rem;
  height: 9.9rem;
  background: url(../img/202411/icn_ck5.svg) no-repeat;
  background-size: 100%;
  content: "";
}

.event03_section .txt_content {
  line-height: 1.8;
  letter-spacing: 0.05em;
}

.event03_section .txt_content .txt_bold {
  font-size: 2.6rem;
  color: var(--main-dark-color);
}

.event03_section .txt_content .txt_sm {
  font-size: 1.6rem;
}

.brand_area {
  position: relative;
  z-index: 0;
  margin: 4rem auto 4.3rem;
  padding: 3.6rem 5rem;
  background: #fff;
}

.brand_area.effect::before {
  position: absolute;
  top: 10rem;
  left: -5rem;
  z-index: 1;
  width: 29rem;
  height: 30rem;
  background: url(../img/main/img_yurian_04.png) no-repeat;
  background-size: 100%;
  animation: yurayura 1.5s cubic-bezier(0.07, 0.33, 0.91, 1.56) infinite;
  content: "";
}

.brand_area dt {
  display: block;
  margin-bottom: 5rem;
  color: #000;
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
  line-height: 1;
}

.brand_area ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 2.3rem 6.5rem;
  padding: 0 11rem;
}

.logo_cosmekitchen {
  width: 15.7rem;
}

.logo_line {
  width: 12.5rem;
}

.logo_biople {
  width: 10rem;
}

.logo_makeupkitchen {
  width: 20rem;
}

.logo_celvoke {
  width: 11.2rem;
}

.logo_pique {
  width: 8rem;
}

.logo_snidel {
  width: 10rem;
}

.logo_lily {
  width: 14.8rem;
}

.logo_fray {
  width: 14.9rem;
}

.logo_soel {
  width: 10rem;
}

.brand_area .txt_sub {
  padding: 2.5rem 8rem 0;
  text-align: right;
  letter-spacing: 0.07em;
}


/* ---- Brand List ---- */

.brand_list {
  padding-top: 1rem;
  padding-bottom: 2.5rem;
}

.brand_list ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
  padding: 0 6rem;
}

.brand_list ul li {
  height: 9.3rem;
}

.brand_list ul li img {
  width: auto;
  max-height: 100%;
}

.logo_sb {
  width: 8.8rem;
}

.logo_celvoke {
  width: 11.2rem;
}

.logo_toone {
  width: 15rem;
}

.logo_femmue {
  width: 11.7rem;
}

.cont_brandlist .brand_list {
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0;
}

/* ---- カミングスーン表示 ---- */
.commingsoon {
  position: relative;
  z-index: 10;
  min-height: 15rem;
}

.commingsoon::before {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  z-index: 22;
  opacity: .4;
  background: var(--main-color);
  text-align: center;
  font-size: 2.7rem;
  letter-spacing: 0.04em;
  content: "";
}

.commingsoon::after {
  opacity: .7;
  z-index: 23;
  position: absolute;
  top: 50%;
  left: 50%;
  color: #000;
  content: "Coming Soon";
  font-size: 3.7rem;
  font-weight: 500;
  transform: translate(-50%,-50%) rotate(-13deg);
  letter-spacing: 0.04em;
}

.commingsoon .event_list {
  margin-top: 0;
  margin-bottom: 0;
}

.commingsoon .slick-arrow {
  display: none !important;
}

.event03_section .btn_pointup {
  margin-top: 6rem;
  margin-bottom: 5rem;
}

.event03_section .btn_pointup .btn_link {
  margin: auto;
}

/* ===================
  　　　CONTENTS
=================== */

.contents_section {
  margin-bottom: 0;
  padding-top: 8rem;
}

.contents_section .inner {
  padding: 4.5rem 5rem 6.5rem;
  background: #f7f5f4;
}

/* ===================
  　　　CALENDAR
=================== */

.calendar_section {
  margin-bottom: 8rem;
}

.calendar_section .inner {
  padding: 5.4rem 5rem 3rem;
  background: #f7f5f4;
}

/* -- ttl main -- */
.calendar_section .calendar_head {
  position: relative;
  margin-bottom: 2rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid #595757;
}

.calendar_section .calendar_head::before {
  position: absolute;
  right: 0;
  bottom: -2rem;
  width: 8.9rem;
  height: 11.9rem;
  background: url(../img/202411/icn_ck6.svg) no-repeat;
  background-size: 100%;
  content: "";
}

.calendar_section .ttl_main {
  display: block;
  color: var(--main-dark-color);
  font-size: 4.5rem;
  text-align: center;
  font-weight: 500;
  font-family: var(--txt-en1);
  line-height: 0.9;
}

.bnr_line {
  background: #000;
  margin-bottom: 8rem;
}

.bnr_line a {
  display: flex;
  align-content: center;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 6rem;
  padding: 2rem;
  font-size: 2.8rem;
  letter-spacing: 0.1em;
  color: #fff;
}

.bnr_line img {
  width: 8.3rem;
}

.ttl_main_02 {
  margin-bottom: 3rem;
  font-size: 3.9rem;
  font-weight: 500;
  color: var(--main-dark-color);
  text-align: center;
  letter-spacing: 0.01em;
}

.calendar_head {
}

.calendar_head .ttl_main_02 {
  position: relative;
  z-index: 0;
  font-size: 3.8rem;
  margin-bottom: 4rem;
}

.calendar_head p {
  font-size: 1.8rem;
  text-align: center;
  line-height: 2;
  letter-spacing: 0.03em;
}

.calendar_head .txt_bold {
  font-weight: 500;
  color: var(--main-dark-color);
}

.img_calendar {
  margin: auto auto 1rem;
  padding: 2.8rem 0 0;
}

.btn_viewmore {
  width: 14.5rem;
  margin-top: 1.5rem;
  margin-left: 10.9rem;
  line-height: 1.4;
}

.btn_viewmore img {
  cursor: pointer;
}


/* ---- Line Coupon ---- */
.line_coupon {
  margin-bottom: 8rem;
  padding-top: 8rem;
}

.line_coupon .ttl_main_02 {
  color: #000;
  font-weight: 500;
  letter-spacing: 0;
  margin: 0 0 4.2rem;
  font-size: 3.6rem;
}

.line_coupon .ttl_main_02 .txt_line {
  font-family:  'Noto Sans JP', sans-serif;
  font-weight: 500;
}

.line_coupon .ttl_main_02 .txt_bold {
  color: #06c455;
  font-weight: 500;
}

.line_coupon .txt_sub {
  margin-bottom: 4.3rem;
  line-height: 2.2;
  font-size: 1.8rem;
  text-align: center;
}

.line_coupon .line_btn {
  width: 45rem;
  margin: auto auto 5.3rem;
}


/* ---- カレンダー ---- */

.calendar_cont {
  margin-bottom: 6rem;
  padding-bottom: 10rem;
  border-bottom: 1px solid #9b9b9b;
}

.calendar_cont.calendar_cont_finish::before {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(255, 255, 255, 0.7);
  content: "本イベントは終了いたしました";
  font-size: 2.2rem;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1;
  letter-spacing: 0.05em;
}

/* PC用*/
@media (min-width: 769px) {

  .calendar_cont.calendar_cont_finish {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom-width: 0;
  }
}

.calendar_list {
  width: 110rem;
  margin: auto auto 3rem;
  padding: 0 1.5rem;
  background: #f2f8e9;
}

.calendar_list > ul > li > dl {
  display: flex;
  padding: 3rem 2rem;
  border-bottom: 1px solid #9b9b9b;
}

.calendar_list > ul > li:last-child > dl{
  border-bottom: none;
}

.calendar_list > ul > li > dl > dt {
  width: 5rem;
  margin-right: 5.4rem;
}

.calendar_list > ul > li > dl > dd {
  display: flex;
  align-items: flex-start;
  align-content: flex-start;
  flex-wrap: wrap;
  width: calc(100% - 5rem);
  gap: 6rem;
}

.calendar_list .icn {
  display: inline-block;
  vertical-align: middle;
  width: 5.4rem;
  margin-right: 2.2rem;
  text-align: center;
}

.calendar_list .icn.icn_live img {
  width: 4.5rem;
}

.calendar_list .icn.icn_off {
  padding-top: .7rem;
  vertical-align: -1rem;
}

.calendar_list .icn.icn_present {
}

.calendar_list .icn.icn_event img {
  width: 3.9rem;
}

.calendar_list .column_area .icn_inst {
  position: relative;
  display: block;
  width: fit-content;
  margin-top: 2rem;
  margin-left: auto;
  padding-right: 2rem;
  text-align: right;
  font-weight: bold;
  letter-spacing: 0.09em;
  border-bottom: 1px solid #000;
  line-height: 1.2;
}

.calendar_list .column_area .icn_inst::before {
  position: absolute;
  top: -0.2rem;
  right: 0;
  width: 2rem;
  height: 2rem;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: 62%;
  mask-image: url(../img/main/icn_target.svg);
  content: "";
}

.calendar_list .column_area .icn_inst.inst_pink {
  margin-top: .6rem;
  color: #d77f9a;
  border-bottom-color: #d77f9a;
}

.calendar_list .column_area .icn_inst.inst_pink::before {
  background-color: #d77f9a;
}

.calendar_list .column_area .icn_inst.inst_purple {
  color: #b895bf;
  border-bottom-color: #b895bf;
}

.calendar_list .column_area .icn_inst.inst_purple::before {
  background-color: #b895bf;
}

.calendar_list > ul > li > dl > dd > p {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.calendar_list > ul > li > dl > dd .column_area {
  display: flex;
  align-content: space-between;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: space-between;
  max-width: 46%;
  height: 100%;
}

.calendar_list .tag {
  padding: 1.1rem 2.4rem 0.8rem;
  border-radius: 20rem;
  color: #fff;
  font-size: 1.5rem;
  letter-spacing: 0.08em;
  line-height: 1;
}

.calendar_list .tag sup {
  color: #fff;
}

.calendar_list .tag.tag_pink {
  background-color: #d77f9a;
}

.calendar_list .tag.tag_green {
  background-color: #50a978;
}

.calendar_list .tag.tag_red {
  background-color: #d78c80;
}

.calendar_list .tag.tag_brown {
  background-color: #c4984b;
}

.calendar_list .tag.tag_purple {
  background-color: #b895bf;
}

/* Time Table */
.calendar_list .time_table {
  margin-bottom: -1rem;
  padding: 1rem 0 0 8rem;
  font-size: 1.4rem;
  letter-spacing: 0.07em;
}

.calendar_list .time_table div {
  display: flex;
  margin-bottom: 1.3rem;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
}

.calendar_list .time_table div:last-child {
  margin-bottom: 0;
}

.calendar_list .time_table dt {
  position: relative;
  z-index: 0;
  width: 4.5rem;
  padding: 0 0.2rem;
  text-align: center;
}

.calendar_list .time_table dt::before {
  position: absolute;
  right: 0;
  left: 0;
  bottom: 0.2rem;
  border-bottom: 0.5rem solid #b895bf;
  z-index: -1;
  content: "";
}

.calendar_list .time_table.time_pink dt::before {
  border-bottom-color: #d77f9a;
}

.calendar_list .time_table dd {
  width: calc(100% - 5rem);
  white-space: nowrap;
}

.calendar_list .time_table .txt_sm {
  padding-left: 0.2rem;
  padding-right: 0.2rem;
  font-size: 0.85em;
  letter-spacing: 0;
}

.calendar_list .time_table .txt_red {
  display: inline-block;
  margin-left: .5rem;
  padding: 0.3rem .7rem 0.1rem;
  background: #ca6060;
  color: #fff;
  font-size: 0.9em;
  line-height: 1.3;
}

.calendar_list_txt {
  width: 110rem;
  max-width: 100%;
  margin: auto;
}

.calendar_list .calendar_0701 > dl > dt img,
.calendar_list .calendar_0702 > dl > dt img{
  width: 80%;
}

/* ---- キャンペーンエリア ---- */

.campaign_area {
  margin-bottom: 5rem;
  padding-bottom: 25rem;
}

.campaign_area .ttl_main_02 {
  padding-bottom: 0;
}

.campaign_area .campaign_cont {
  width: 110rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: auto auto 5rem;
}

.campaign_area .campaign_cont picture {
  width: 53.7rem;
}

.campaign_area .campaign_cont p {
  width: 51rem;
  font-size: 1.8rem;
  line-height: 2;
}

.campaign_area .campaign_cont .line_btn {
  width: 40rem;
  margin: 4rem 0 0;
}


/* ===================
  　　ページトップ
=================== */

#page-top a {
  display: flex;
  justify-content:center;
  align-items:center;
  width: 12.5rem;
  height: 12.5rem;
  color: #fff;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
  font-size: 0.6rem;
  transition: all 0.3s;
}

#page-top .line_tomodachi {
  width: 16.2rem;
  margin-top: -2rem;
  margin-bottom: 5rem;
  margin-left: -7rem;
}

/*リンクを右下に固定*/
#page-top {
  position: fixed;
  right: 2rem;
  bottom: 11rem;
  z-index: 32;
    /*はじめは非表示*/
  opacity: 0;
  transform: translateY(10rem);
}

#page-top.page_top_finish {
  bottom: 6rem;
}

/*　上に上がる動き　*/
#page-top.UpMove{
  animation: UpAnime 0.3s forwards;
}
@keyframes UpAnime{
  from {
    opacity: 0;
  transform: translateY(10rem);
  }
  to {
    opacity: 1;
  transform: translateY(0);
  }
}

/*　下に下がる動き　*/
#page-top.DownMove{
  animation: DownAnime 0.3s forwards;
}
@keyframes DownAnime{
  from {
    opacity: 1;
    transform: translateY(0);
  }
  to {
    opacity: 1;
    transform: translateY(10rem);
  }
}



/* ===================
  　　KIT PICKUP
=================== */

.event_kit_wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 2rem 0 0;
}

.event_kit_wrap .acc_cont {
  display: none;
}

.event_kit_wrap .event_kit_inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
}

#panel2 .event_kit_wrap .event_kit_inner {
  padding: 0 2rem;
  justify-content: flex-start;
  gap: 3rem;
}

.event_kit_wrap .event_kit_img {
  position: relative;
  overflow: hidden;
  border-radius: 1.5rem;
  background: #fff;
  box-shadow: 1px 2px 6px rgb(0, 0, 0, 0.2);
  line-height: 0;
}

/*
.event_kit_wrap .event_kit_img::before {
  position: absolute;
  top: 1rem;
  left: 1rem;
  width: 6.5rem;
  height: 6.5rem;
  background: url(../img/main/icn_pickup.png) no-repeat 0 0;
  background-size: 100%;
  content: "";
}
*/

.event_kit_wrap .event_kit01 {
  display: flex;
  gap: 5.6rem;
  margin-bottom: 8rem;
}

.event_kit_wrap .event_kit02,
.event_kit_wrap .event_kit03 {
  width: 50rem;
}

.event_kit_wrap .event_kit04 {
  width: 23rem;
}

.event_kit_wrap .ttl_kit_event {
  padding: 2.5rem 0.6rem;
  font-size: 1.7rem;
  font-weight: normal;
  line-height: 1.6;
  text-align: left;
}

.event_kit_wrap .ttl_kit_event .logo_area {
  display: inline-block;
  margin-bottom: 2rem;
  padding-top: 1rem;
  line-height: 0;
}

.event_kit_wrap .event_kit01 .event_kit_txt {
  padding-top: 1rem;
}

.event_kit_wrap .event_kit01 .btn_link_check {
  margin-left: 0;
}

.event_kit_wrap .event_kit_bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 0.6rem 4rem;
}

.event_kit_wrap .txt_kit_cont {
  font-size: 2rem;
  line-height: 1.4;
  letter-spacing: 0.03em;
  text-align: left;
}

.event_section .btn_event {
  width: 45rem;
  margin: auto auto 1rem;
}

.event_kit_wrap .event_kit_img .tag_limited {
  display: inline-block;
  position: absolute;
  top: 1rem;
  left: 1rem;
  border-radius: 0.5rem;
  letter-spacing: 0.08em;
  padding: 0.5rem 1.4rem;
  font-size: 1.68rem;
  line-height: 1;
}

.event_kit_wrap .event_kit_img .tag_limited.pink {
  color: #e26a6a;
  background-color: #ffd4da;
}

.event_kit_wrap .event_kit_img .tag_limited.yellow {
  color: #bc932f;
  background-color: #ffedc0;
}


.event_brand {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin: 2.2rem 0 0;
  text-align: center;
}

.event_brand img {
  margin: auto;
}

.event_brand.event_brand_celvoke img {
  width: 11.2rem;
}

.event_brand.event_brand_snidel img {
  width: 9.6rem;
}

.event_brand.event_brand_toone img {
  width: 13.6rem;
}

.event_brand + .ttl_kit_event {
  min-height: 7rem;
  padding-top: 1.5rem;
  padding-bottom: 0.3rem;
}

#panel2 .event_kit_wrap .event_kit_bottom {
  justify-content: space-between;
  align-items: flex-start;
  flex-direction: column;
  padding-top: 0;
}

#panel2 .event_kit_wrap .event_kit_bottom .btn_link_check {
  margin-top: 2rem;
  margin-left: auto;
}

/* ===================
  　　KIT LIST
=================== */

.event_kit_list {
  margin: 0 -8rem;
  padding-top: 8.6rem;
}

.event_kit_list ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 2rem;
}

.event_kit_list li {
  width: 26rem;
  flex-direction: column;
}

.event_kit_list .ttl_kit_event {
  padding-bottom: 2rem;
  color: var(--main-dark-color);
  font-size: 1.8rem;
  font-weight: bold;
  line-height: 1.6;
  text-align: center;
}

.event_kit_list .txt_kit_cont {
  padding-top: 1rem;
  font-size: 1.8rem;
  line-height: 1.5;
}

.event_kit_list .btn_link_check {
  width: 24rem;
  height: 4.8rem;
}

.event01_section .event_kit_list + .btn_link {
  margin-top: 6.5rem;
  margin-bottom: 0;
}

/* ===================
  　　CONTENTS
=================== */

.contents_list {

}

.contents_list ul {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: space-between;
  gap: 5rem;
  flex-wrap: wrap;
  margin-bottom: 4rem;
}

.contents_list ul li {
  width: calc(50% - 2.5rem);
}

.contents_list .img_area {
  overflow: hidden;
  position: relative;
  display: block;
  line-height: 0;
  background: #fff;
  box-shadow: 0 0 6px rgb(0, 0, 0, 0.2);
  border-radius: 1rem;
}

.contents_list .img_area.comingsoon::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../img/main/img_contents_06_pc.png?240626) no-repeat;
  background-size: cover;
  background-color: rgba(242, 248, 233, 0.65);
  content: "";
}

.contents_list .youtube_area {
  overflow: hidden;
}

.contents_list .youtube_area iframe {
  width: 100%;
  height: 19.8rem;
}

.contents_list .txt_area {
  padding-top: 2rem;
  padding-bottom: 2rem;
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 1.6;
  text-align: center;
}

.contents_list .colum_full {
  width: 100%;
  padding-top: 0;
  text-align: center;
}

.contents_list .colum_full p {
  width: fit-content;
  text-align: left;
  margin: auto;
  padding: 0;
}

.contents_section .txt_center {
  padding-top: 4rem;
}

.contents_section .txt_center img {
  width: 20rem;
  margin: auto;
}

/* ===================
  　　　ABOUT
=================== */

.about_area {
  position: relative;
  overflow: hidden;
  margin-bottom: 6rem;
  padding: 4.5rem 5rem;
  background: #f7f5f4;
  font-size: 1.8rem;
}

.about_area::before {
  position: absolute;
  left: 5rem;
  bottom: 4.8rem;
  width: 13.3rem;
  height: 12rem;
  background: url(../img/202411/icn_ck7.svg) no-repeat;
  background-size: 100%;
  content: "";
}

.about_area .ttl_main_02 {
  margin-bottom: 4rem;
  font-size: 4rem;
  letter-spacing: 0.08em;
}

.about_area .about_img {
  float: left;
  width: 62rem;
}

.about_area .about_cont {
  float: right;
  width: 41.5rem;
  text-align: center;
  letter-spacing: 0.04em;
}

.about_area .about_cont p {
  font-size: 1.8rem;
  text-align: left;
  line-height: 2;
  letter-spacing: 0em;
}

.about_area .about_cont .cont_btn {
  padding-top: 2.8rem;
  text-align: right;
  font-weight: bold;
  line-height: 2.2;
}

.about_area .about_cont .cont_btn a {
  color: #595757;
  text-decoration: underline;
}

.about_section .logo_area {
  width: 32.3rem;
  margin: auto auto 8rem;
}


/* ===================
  　　　MODAL
=================== */

/* モーダル全体 */
.modal {
  display: none;
  position: fixed;
  z-index: 1000;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.5); /* 半透明の背景 */
  opacity: 0;  /* 初期状態は透明 */
  transition: opacity 0.3s ease;  /* フェードイン・アウトの効果 */
}

/* モーダルのコンテンツ */
.modal-content {
  position: relative;
  background-color: white;
  margin: 10% auto 15% ;
  padding: 4rem;
  width: 80%;
  max-width: 110rem;
  font-family: 'futura-pt', 'Noto Sans JP', sans-serif;
}

/* バツ印のスタイル（CSSで線を表現） */
.close-btn {
  position: absolute;
  top: 1rem;
  right: 1rem;
  width: 2rem;
  height: 2rem;
  cursor: pointer;
}

.close-btn::before,
.close-btn::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 2px;  /* 線の太さ */
  background-color: #595757;
  transform-origin: center;
}

.close-btn::before {
  transform: rotate(45deg);  /* 1本目の斜め線 */
}

.close-btn::after {
  transform: rotate(-45deg); /* 2本目の斜め線 */
}

.close-btn:hover::before,
.close-btn:hover::after {
  background-color: black;  /* ホバー時の色変更 */
}

.modal-content h3 {
  margin-bottom: 2rem;
  color: var(--main-color);
  font-size: 2.2rem;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.03em;
}

.modal-content img {
  max-width: 100%;
}

.modal-content .app_list {
  position: absolute;
  right: 10rem;
  bottom: 7.5rem;
  display: flex;
  gap: 5.8rem;
}

.modal-content .app_list li:nth-child(1) {
  width: 14rem;
}

.modal-content .app_list li:nth-child(2) {
  width: 18rem;
}


/*=======================================
                    PC
========================================*/


@media screen and (min-width: 768px)  {
  .sp_only {
    display: none;
  }

  #Wrap,
  .wrapBottom,
  .wrapTop,
  #Contents {
    width: 100%;
  }

  .lp_contents {
    overflow: hidden;
  }

  #Wrap {
  }


  /* ===================
    　　　EVENT01
  =================== */

  .event01_section .ttl_open {
    position: relative;
    z-index: 0;
  }

  .event01_section.effect .ttl_open::before {
    position: absolute;
    top: -15rem;
    right: 3rem;
    z-index: -1;
    width: 25rem;
    height: 25rem;
    background: url(../img/main/img_yurian_01.png) no-repeat;
    background-size: 100%;
    animation: yurayura4 1.5s cubic-bezier(0.07, 0.33, 0.91, 1.56) infinite;
    content: "";
  }

  /* -- ttl open -- */
  .ttl_open__pointup {
    position: relative;
    z-index: 0;
  }

  .ttl_open__pointup::before {
    position: absolute;
    top: -5rem;
    right: 5rem;
    z-index: 1;
    width: 15rem;
    height: 17rem;
    background: url(../img/main/img_yurian_03.png) no-repeat;
    background-size: 100%;
    animation: yurayura 1.5s cubic-bezier(0.07, 0.33, 0.91, 1.56) infinite;
    content: "";
  }

  /* ===================
    　　　CONTENTS
  =================== */

  .contents_section .inner {
  }

  /* ---- キャンペーンエリア ---- */

  .campaign_area {
    position: relative;
  }

  .campaign_area::before {
    position: absolute;
    left: -100vw;
    bottom: 0;
    width: 200vw;
    height: 20rem;
    background: url(../img/main/bg_top_nav_pc.png) repeat-x bottom;
    background-size: 180rem;
    content: "";
  }



}


/*=======================================
                    SP
========================================*/

/* only SP */
@media only screen and (max-width: 767px) {
  .pc_only {
    display: none;
  }

  /* ===================
    LP Contents
  =================== */

  .lp_contents {
    overflow: hidden;
    padding-top: 0;
    font-size: calc(28 * (100vw / 760));
    letter-spacing: 0.02em;
  }

  /* ===================
    　Section Common
  =================== */

  .section .inner {
    width: 100%;
  }

  .contents {
    padding-top: 0;
  }

  .contents_inner .section {
    padding-right: 0;
    padding-left: 0;
  }

  .sec_inner {
    width: 100%;
  }

  /* ===================
         ANIME
  =================== */

  @keyframes tra3 {
    0% {
      transform: translateY(20px);
    }

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

  .ef-top {
    opacity: 0;
    transform: translateY(20px);
  }

  /* ===================
    　　　INTRO
  =================== */

  .intro_section {
    padding-top: 0;
    font-size: calc(40 * (100vw / 760));
  }

  .intro_section_inner {
    padding: 0;
  }

  .mv_img {
    width: 100%;
    margin: auto auto calc(-20 * (100vw / 760));
  }

  /* ---- COUNT DOWN ---- */
  .intro_section .countdown_area {
    width: calc(710 * (100vw / 760));
    margin-bottom: calc(130 * (100vw / 760));
  }

  .intro_section .countdown_area .countdown_ttl {
    margin-bottom: calc(50 * (100vw / 760));
    font-size: calc(40 * (100vw / 760));
  }

  .intro_section .countdown_area .countdown_ttl span {
    padding: 0 calc(20 * (100vw / 760));
  }

  .intro_section .countdown_set {
    margin: 0 calc(40 * (100vw / 760));
  }

  .intro_section .countdown_set #days,
  .intro_section .countdown_set #hours,
  .intro_section .countdown_set #minutes,
  .intro_section .countdown_set #seconds {
    width: calc(124 * (100vw / 760));
    height: calc(162 * (100vw / 760));
    font-size: calc(74 * (100vw / 760));
  }
  .intro_section .countdown_set #days::after,
  .intro_section .countdown_set #hours::after,
  .intro_section .countdown_set #minutes::after,
  .intro_section .countdown_set #seconds::after {
    bottom: calc(-45 * (100vw / 760));
    font-size: calc(25 * (100vw / 760));
    line-height: 1;
  }

  .intro_section .countdown_set .txt_time {
    padding: 0 calc(10 * (100vw / 760));
    font-size: calc(74 * (100vw / 760));
  }

  .intro_section .countdown_set #days {
    margin-right: calc(40 * (100vw / 760));
  }

  /* ---- COUNT DOWN FINISH ---- */

  .countdown_finish {
    margin: 0 auto;
  }

  .countdown_finish p {}

  .finish_txt_intro {
    margin-bottom: calc(40 * (100vw / 760));
    font-size: calc(28 * (100vw / 760));
  }

  .finish_txt_fukidashi {
    margin-bottom: calc(10 * (100vw / 760));
    font-size: calc(26 * (100vw / 760));
  }

  .finish_txt_main {
    margin-bottom: calc(20 * (100vw / 760));
    font-size: calc(44 * (100vw / 760));
  }

  .finish_txt_sub {
    font-size: calc(24 * (100vw / 760));
    line-height: 2;
  }

  /* ---- スライドの動き等速 ---- */

  .pickup_brand {
    margin-bottom: calc(100 * (100vw / 760));
    padding: calc(20 * (100vw / 760)) 0;
  }

  .pickup_brand .brand_ttl {
    margin-bottom: calc(24 * (100vw / 760));
    letter-spacing: 0.02em;
  }

  .brand_slider {
  }

  .brand_slider .swiper-slide {
    padding: calc(15 * (100vw / 760)) calc(25 * (100vw / 760));
  }

  .brand_slider img {
    max-width: calc(140 * (100vw / 760));
    height: calc(44 * (100vw / 760));
  }

  .brand_slider .logo_tr {
    height: calc(34 * (100vw / 760));
  }

  .brand_slider .logo_mitea {
    height: calc(34 * (100vw / 760));
  }

  /* ---- LINE BUTTON ---- */

  .intro_event {
    width: calc(650 * (100vw / 760));
    margin: auto;
    padding: 0 0 calc(80 * (100vw / 760));
  }

  .intro_txt {
    margin-bottom: calc(82 * (100vw / 760));
    font-size: calc(28 * (100vw / 760));
    line-height: 2.2;
  }

  .intro_txt::before {
    top: calc(-65 * (100vw / 760));
    left: calc(-10 * (100vw / 760));
    width: calc(136 * (100vw / 760));
    height: calc(148 * (100vw / 760));
  }

  .intro_txt.intro_txt_finish {
    padding-bottom: calc(90 * (100vw / 760));
  }

  /* ---- INTRO SHOP ---- */

  .intro_shop {
    width: calc(600 * (100vw / 760));
    margin-bottom: calc(60 * (100vw / 760));
  }

  .intro_shop::after {
    top: calc(-60 * (100vw / 760));
    right: calc(-60 * (100vw / 760));
    width:  calc(125 * (100vw / 760));
    height:  calc(177 * (100vw / 760));
  }

  .intro_shop dt {
    width: calc(310 * (100vw / 760));
    padding: calc(10 * (100vw / 760));
    border-radius: calc(10 * (100vw / 760));
    font-size: calc(28 * (100vw / 760));
  }

  .intro_shop dd {
    margin-top: calc(-20 * (100vw / 760));
    padding: calc(50 * (100vw / 760)) calc(10 * (100vw / 760)) calc(40 * (100vw / 760));
    border-radius: calc(0 * (100vw / 760));
    font-size: calc(28 * (100vw / 760));
  }

  .intro_shop ul {
    flex-direction: column;
    gap: calc(15 * (100vw / 760));
  }

  /* ---- MENU LIST ---- */

  .lp_menu_list {
  }

  .lp_menu_list ul {
    justify-content: space-between;
  }

  .lp_menu_list li a {
    gap: calc(5 * (100vw / 760));
    padding: calc(35 * (100vw / 760)) 0 calc(35 * (100vw / 760));

    font-size: calc(34 * (100vw / 760));
    line-height: 1.6;
  }

  .lp_menu_list li:nth-child(2) a {
    font-size: calc(34 * (100vw / 760));
  }

  .lp_menu_list li:nth-child(3) a {
    font-size: calc(34 * (100vw / 760));
  }

  .lp_menu_list li:last-child {
    width: 100%;
  }

  .lp_menu_list li:last-child::before {
    display: none;
  }

  .lp_menu_list li a::before {
    top: 50%;
    left: 0;
    bottom: calc(24*(100vw / 760));
    height: calc(140*(100vw / 760));
    transform: translateY(-50%);
  }

  .lp_menu_list .txt_bold {
    margin-bottom: calc(6 * (100vw / 760));
    font-size: calc(26 * (100vw / 760));
    line-height: 1;
  }

  .lp_menu_list .txt_bold span {
    font-size: calc(33 * (100vw / 760));
  }

  .lp_nav_area {
    padding-top: 0;
  }

  .lp_menu_top {
    margin-bottom: calc(110 * (100vw / 760));
    background: none;
  }

  .lp_menu_top ul {
    display: flex;
    flex-wrap: wrap;
    padding: 0 calc(10 * (100vw / 760));
  }

  .lp_menu_top li {
    width: 50%;
    padding: calc(8 * (100vw / 760));
  }

  .lp_menu_top li a {
    gap: 0;
    padding: calc(34 * (100vw / 760)) 0 calc(60 * (100vw / 760));
    border-radius: calc(20 * (100vw / 760));
    font-size: calc(34 * (100vw / 760));
    background: var(--main-color);
    line-height: 1.4;
  }

  .lp_menu_top li a::after {
    bottom: calc(20 * (100vw / 760));
    width: calc(28 * (100vw / 760));
    height: calc(28 * (100vw / 760));
  }

  .lp_menu_top li a::before {
    display: none;
    background-color: #939393;
  }

  .lp_menu_top li {
    position: relative;
  }

  .lp_menu_list li:last-child a::before {
    bottom: calc(20 * (100vw / 760));
  }

  /* -- Fixed -- */

  .lp_menu_inner {
    overflow: hidden;
    overflow-x: scroll;
  }

  .lp_menu ul {
    display: flex;
    align-items: center;
    width: 100%;
  }

  .lp_menu li {
    width: auto;
    min-width: calc(304*(100vw / 760));
  }

  .lp_menu li a::before {
    background-color: #595757;
  }

  .lp_menu li a {
    padding: calc(20*(100vw / 760)) calc(38*(100vw / 760));
    font-size: calc(34*(100vw / 760));
    line-height: 1.3;
  }

  .lp_menu li:nth-child(3) {
    min-width: calc(400*(100vw / 760));
  }

  .lp_menu li:last-child .txt_bold {

    margin-bottom: calc(20 * (100vw / 760));
  }


  /* ===================
    　　TOP RANK
  =================== */
  .toprank_section {
    padding-top: calc(110*(100vw / 428));
    background: url(../img/main/bg_top_nav.png) no-repeat top center;
    background-size: 100%;
  }

  .toprank_section .ttl_main {
    font-size: calc(22*(100vw / 428));
  }

  .toprank_section .inner {
    padding: calc(20*(100vw / 428)) calc(20*(100vw / 428)) calc(20*(100vw / 428));
  }

  .toprank_section .item_list__item {
  }

  .toprank_section .item_list__item .item_list__item_inner {
    border-radius: calc(10 * (100vw / 428));
  }

  .toprank_section .icn_rank {
    top: calc(-15 * (100vw / 428));
    left: calc(-10 * (100vw / 428));
    width: calc(32 * (100vw / 428));
    height: calc(32 * (100vw / 428));
    font-size: calc(14 * (100vw / 428));
  }

  /* ===================
    　　　EVENT
  =================== */

  .event_section {
    margin-bottom: calc(50 * (100vw / 760));
  }

  .event_section .inner {
    width: auto;
    margin: 0;
    padding: calc(40 * (100vw / 760)) calc(25 * (100vw / 760)) calc(65 * (100vw / 760));
    font-size: calc(28 * (100vw / 760));
  }

  .event_section .txt_content {
    overflow: hidden;
    clear: both;
    margin: 0 0 calc(50 * (100vw / 760));
    padding: 0 calc(30 * (100vw / 760));
    font-size: calc(28 * (100vw / 760));
    line-height: 1.6;
    letter-spacing: 0.01em;
    text-align: left;
  }

  .event_section .inner .txt_bold {
    padding: 0;
    font-size: calc(35 * (100vw / 760));
  }


  /* ---- Tab Area ---- */

  .tab_btn_area {
    margin-top: calc(35 * (100vw / 760));
  }

  .tab_btn_area ul {
  }

  .tab_btn_area .tab_btn {
    padding: calc(15 * (100vw / 760));
    border-radius: calc(35 * (100vw / 760)) calc(35 * (100vw / 760)) 0 0;
    font-size: calc(32 * (100vw / 760));
    line-height: 1.2;
  }

  .tab_btn_area .tab_btn.selected {
  }

  .tab_btn_area .tab_btn span {
  }

  .tab_btn_area .tab_btn:hover {
  }

  .tab_panel {
    padding: calc(35 * (100vw / 760)) calc(35 * (100vw / 760)) calc(35 * (100vw / 760));
  }

  .txt_link_arw {
    margin: calc(10 * (100vw / 760)) 0 calc(30 * (100vw / 760));
    padding: 0 calc(10 * (100vw / 760));
  }

  .txt_link_arw a {
    width: 100%;
    padding-right: calc(50 * (100vw / 760));
    font-size: calc(35 * (100vw / 760));
  }

  .txt_link_arw a::after {
    width: calc(20 * (100vw / 760));
    height: calc(20 * (100vw / 760));
    margin-top: calc(-4 * (100vw / 760));
  }

  /* -- ttl main -- */
  .event_section .ttl_main {
    margin-bottom: calc(50 * (100vw / 760));
    padding-bottom: calc(40 * (100vw / 760));
  }

  .event_section.event03_section .ttl_main {
    margin-bottom: calc(20 * (100vw / 760));
  }

  .event_section .ttl_main .txt_main {
    padding-left: calc(21 * (100vw / 760));
    padding-right: calc(62 * (100vw / 760));
    font-size: calc(55 * (100vw / 760));
  }

  .event_section .ttl_main .txt_main span {
    font-size: calc(35 * (100vw / 760));
  }

  .event_section .ttl_main .txt_sub {
    padding-top: calc(15 * (100vw / 760));
    font-size: calc(35 * (100vw / 760));
    text-align: center;
    line-height: 1.4;
  }

  .event_section .ttl_main .txt_sub sup {
    font-size: calc(24 * (100vw / 760));
  }

  .event_section .ttl_main .txt_sub .txt_bold {
    padding: 0;
    font-size: calc(35 * (100vw / 760));
    line-height: 1.45;
  }
  /* -- ttl finish -- */

  .event_section .ttl_main_finish {
    display: flex;
    justify-content: center;
  }

  .event_section .ttl_main_finish .txt_sub {
    padding-bottom: calc(15 * (100vw / 760));
    font-size: calc(31 * (100vw / 760));
    text-align: center;
    display: block;
    line-height: 1.7 !important;
  }

  .event_section .ttl_main_finish .txt_sm {
    font-size: calc(28 * (100vw / 760));
  }
  /* -- ttl open -- */
  .ttl_open {
    margin: calc(50 * (100vw / 760)) 0 calc(30 * (100vw / 760));
    padding: calc(10 * (100vw / 760));
    font-size: calc(32 * (100vw / 760));
    line-height: 1.4;
  }

  .ttl_open .txt_data {
    font-size: calc(32 * (100vw / 760));
  }

  .img_commingsoon {
    width: calc(282 * (100vw / 760));
  }

  .txt_brand_area {
    position: relative;
    z-index: 0;
    margin-bottom: calc(35 * (100vw / 760));
    font-size: calc(29 * (100vw / 760));
  }

  .txt_brand_area .txt_sm {
    position: relative;
    z-index: 5;
    display: block;
    font-size: calc(23 * (100vw / 760));
    line-height: 1.4;
    text-align: center;
  }

  .effect .txt_brand_area::before {
    position: absolute;
    top: calc(-405*(100vw / 760));
    right: calc(-185*(100vw / 760));
    z-index: 1;
    width: calc(484*(100vw / 760));
    height: calc(652*(100vw / 760));
    background: url(../img/main/img_yurian_05.png) no-repeat;
    background-size: 100%;
    animation: yurayura4 1.5s cubic-bezier(0.07, 0.33, 0.91, 1.56) infinite;
    content: "";
  }

  .cont_brandlist {
    position: relative;
    z-index: 2;
  }


  /* -- Accodion -- */

  .event_section .acc_cont {

  }

  .event_section .acc_btn {
    /*margin-top: calc(-47 * (100vw / 760));*/
    margin-top: calc(-10 * (100vw / 760));
    margin-bottom: 0;
    padding-bottom: calc(50 * (100vw / 760)) !important;
    font-size: calc(35 * (100vw / 760)) !important;
    color: var(--main-dark-color);
  }

  .event_section .acc_on + .acc_btn {
    padding-bottom: calc(70 * (100vw / 760)) !important;
  }

  .event_section .acc_btn::before {
    top: calc(-196*(100vw / 760));
    height: calc(240*(100vw / 760));
  }

  .event_section .acc_btn .icn_btn {
    padding-right: calc(40 * (100vw / 760));
    font-size: calc(35 * (100vw / 760));
  }

  .event_section .acc_btn .icn_btn::after {
    top: 27%;
    width: calc(22 * (100vw / 760));
    height: calc(22 * (100vw / 760));
  }

  .event_section .acc_btn.active {
    margin-top: calc(40 * (100vw / 760));
    padding-bottom: calc(60 * (100vw / 760)) !important;
  }

  .event_section .acc_btn.active .icn_btn::after {
    top: calc(-20 * (100vw / 760));
    left: calc(-30 * (100vw / 760));
    width: calc(142 * (100vw / 760));
    height: calc(58 * (100vw / 760));
  }

  /* ===================
    　　　EVENT01
  =================== */

  .event01_section {
    margin-bottom: calc(100 * (100vw / 760));
  }

  .event01_section .ttl_main::before {
    top: calc(-100 * (100vw / 760));
    width: calc(124 * (100vw / 760));
    height: calc(165 * (100vw / 760));
  }

  .event01_section .inner {
    padding-bottom: calc(100 * (100vw / 760));
  }

  .event_cont {
    font-size: calc(28 * (100vw / 760));
  }

  .event_cont p {
  }

  .event_cont ul {
    padding: 0 ;
  }

  .event_cont ul li {
    margin-bottom: calc(67 * (100vw / 760));
  }

  .event_cont ul li:last-child {
    margin-bottom: 0;
  }

  .event_cont ul li .event_img {
  }

  .event_cont ul li:nth-child(2n) {
  }

  .event_cont ul li:nth-child(2n) .event_img {
    text-align: right;
  }

  .event_cont ul li p {
    width: calc(281 * (100vw / 760));
    text-align: left;
    line-height: 1.8;
  }

  .btn_link {
    width: calc(590 * (100vw / 760));
    height: calc(130 * (100vw / 760));
    margin-bottom: calc(70 * (100vw / 760));
    border-radius: calc(15 * (100vw / 760));
    font-size: calc(35 * (100vw / 760));
    padding-right: calc(15 * (100vw / 760));
    font-weight: 500;
    letter-spacing: 0.02em;
  }

  .btn_link::before {
    right: calc(25 * (100vw / 760));
    width: calc(25 * (100vw / 760));
    height: calc(25 * (100vw / 760));
  }

  .btn_link_check {
    width: calc(500 * (100vw / 760));
    height: calc(90 * (100vw / 760));
    margin: calc(57 * (100vw / 760)) auto 0;
    font-size: calc(35 * (100vw / 760));
  }

  /* ---- Point Up ---- */
  .point_up {
    margin-bottom: calc(93 * (100vw / 760));
    padding: calc(50 * (100vw / 760)) 0 calc(20 * (100vw / 760));
  }

  .point_up,
  .point_up p {
  }

  .point_up p {
    margin-bottom: calc(32 * (100vw / 760));
  }

  .point_up picture {
    width: calc(600 * (100vw / 760));
  }


  /* ===================
    　　　EVENT02
  =================== */

  .event02_section {
    position: relative;
    z-index: 0;
    margin-bottom: calc(100 * (100vw / 760));
  }

  .event02_section .ttl_main::before {
    bottom: calc(138 * (100vw / 760));
    width: calc(127 * (100vw / 760));
    height: calc(167 * (100vw / 760));
  }

  .event02_section .inner {
    padding-bottom: calc(50 * (100vw / 760));
  }

  .event02_section .ttl_main .txt_sub .txt_bold {
    font-size: calc(47 * (100vw / 760));
    font-weight: bold;
    letter-spacing: 0.06em;
    padding-right: calc(6 * (100vw / 760));
  }

  .event_section .ttl_section {
    margin-top: calc(70 * (100vw / 760));
    margin-bottom: calc(35 * (100vw / 760));
    padding: 0 calc(30 * (100vw / 760));
    font-size: calc(35 * (100vw / 760));
  }

  .event03_section .ttl_open + .ttl_section {
    margin-top: calc(90 * (100vw / 760));
  }

  .event03_section .ttl_open + .ttl_section {
    margin-top: calc(-20 * (100vw / 760));
  }

  .event_section .event_list {
    margin-top: calc(10 * (100vw / 760));
    margin-bottom: 0;
    margin-right: calc(-25 * (100vw / 760));
    margin-left: calc(-25 * (100vw / 760));
    padding: 0 0 calc(10 * (100vw / 760));
  }

  .event_section .event_list .item_list__item {
    width: calc(300 * (100vw / 760));
    margin-right: calc(10 * (100vw / 760));
    margin-left: calc(10 * (100vw / 760));
  }

  .event_section .event_list .item_list__item:first-child {
    margin-left: calc(35 * (100vw / 760));
  }

  .event_section .item_list_common .item_list__item {
    margin-bottom: calc(32 * (100vw / 760));
    padding-bottom:  calc(10 * (100vw / 760));
  }

  /* ===================
    　　　EVENT03
  =================== */

  .event03_section {
    position: relative;
    z-index: 2;
    margin-bottom: calc(100 * (100vw / 760));
  }

  .event03_section .ttl_main::before {
    top: calc(-97 * (100vw / 760));
    left: calc(60 * (100vw / 760));
    bottom: auto;
    width: calc(120 * (100vw / 760));
    height: calc(139 * (100vw / 760));
  }

  .event03_section .txt_content .txt_sm {
    display: block;
    margin: auto;
    padding: calc(20 * (100vw / 760)) 0 calc(30 * (100vw / 760));
    font-size: calc(23 * (100vw / 760));
    line-height: 1.7;
    text-align: left;
  }

  .event03_section .txt_content .txt_sm + br {
    display: none;
  }

  .event03_section .ttl_main .txt_sub {
    /*margin-top: calc(-17 * (100vw / 760));*/
    line-height: 1.2;
  }

  .event03_section .ttl_main .txt_sub .txt_bold {
    font-size: calc(38 * (100vw / 760));
    font-weight: bold;
    letter-spacing: 0.02em;
    padding-right: calc(6 * (100vw / 760));
  }

  .event03_section .ttl_main .txt_sub .txt_bold span {
    font-size: calc(44 * (100vw / 760));
  }

  .brand_area {
    margin: calc(60 * (100vw / 760)) auto calc(45 * (100vw / 760));
    padding: calc(46 * (100vw / 760)) calc(30 * (100vw / 760)) calc(40 * (100vw / 760));
  }

  .brand_area.effect::before {
    top: calc(-191*(100vw / 760));
    left: calc(-74*(100vw / 760));
    width: calc(391*(100vw / 760));
    height: calc(391*(100vw / 760));
    animation: yurayura3 1.5s cubic-bezier(0.07, 0.33, 0.91, 1.56) infinite;
  }

  .event03_section .txt_content {
    text-align: left;
    line-height: 1.7;
    letter-spacing: 0.02em;
  }

  .brand_area dt {
    margin-bottom: calc(80 * (100vw / 760));
    font-size: calc(35 * (100vw / 760));
    color: var(--main-dark-color);
  }

  .brand_area ul {
    justify-content: space-between;
    gap: calc(47 * (100vw / 760)) calc(20 * (100vw / 760));
    padding: calc(0 * (100vw / 760)) calc(20 * (100vw / 760)) calc(40 * (100vw / 760));
  }

  .logo_cosmekitchen {
    width: calc(150 * (100vw / 760));
  }

  .logo_line {
    width: calc(240 * (100vw / 760));
  }

  .logo_biople {
    width: calc(150 * (100vw / 760));
  }

  .logo_makeupkitchen {
    width: calc(130 * (100vw / 760));
  }

  .logo_celvoke {
  }

  .logo_pique {
    width: calc(140 * (100vw / 760));
  }

  .logo_snidel {
    width: calc(170 * (100vw / 760));
  }

  .logo_lily {
    width: calc(210 * (100vw / 760));
    vertical-align: calc(6 * (100vw / 760));
  }

  .logo_fray {
  }

  .logo_soel {
    width: calc(150 * (100vw / 760));
  }

  .brand_area .txt_sub {
    padding: calc(-4 * (100vw / 760)) 0 0;
    font-size: calc(30 * (100vw / 760));
    line-height: 1;
  }

  /* ---- Brand List ---- */

  .brand_list {
    padding-top: calc(10 * (100vw / 760));
    padding-bottom: calc(42 * (100vw / 760));
  }

  .brand_list ul {
    justify-content: flex-start;
    gap: calc(0 * (100vw / 760)) calc(0 * (100vw / 760));
    padding: 0;
  }

  .brand_list ul li {
    width: 33.333%;
    line-height: 1;
    height: calc(110 * (100vw / 760));
    text-align: center;
  }

  .brand_list ul li img {
    width: 100%;
    max-height: inherit;
    vertical-align: middle;
  }

  .logo_sb {
    width: calc(99 * (100vw / 760));
  }

  .logo_celvoke {
    width: calc(122 * (100vw / 760));
  }

  .logo_toone {
    width: calc(169 * (100vw / 760));
  }

  .logo_femmue {
    width: calc(132 * (100vw / 760));
  }

  /* ---- カミングスーン表示 ---- */
  .commingsoon {
    min-height: calc(250 * (100vw / 760));
  }

  .commingsoon::before {
    top: 0;
    right: calc(0 * (100vw / 760));
    left: calc(0 * (100vw / 760));
  }

  .commingsoon::after {
    font-size: calc(50 * (100vw / 760));

  }

  .commingsoon .event_list {
    margin-top: 0;
  }

  .event03_section .commingsoon:last-child::before {
  }

  .event03_section .commingsoon .acc_btn {
    padding-bottom: calc(50 * (100vw / 760)) !important;
  }

  .event_section .js_item_slidebar .simplebar-track.simplebar-horizontal {
    background-color: #fff;
  }

  .event03_section .btn_pointup {
    margin-top: calc(100 * (100vw / 760));
    margin-bottom: calc(30 * (100vw / 760));
  }

  .event03_section .btn_pointup .btn_link {
    margin: auto;
  }

  .event_list .item_list__brand {
    height: calc(40*(100vw / 760));
    margin:  calc(10 * (100vw / 760)) 0;
  }

  .event_list .item_list__brand.brand_etvos img {
    width: calc(143 * (100vw / 760));
  }

  .event_list .item_list__brand.brand_ao {
  }

  .event_list .item_list__brand.brand_ao img {
    width: calc(176 * (100vw / 760));
  }

  .event_list .item_list__brand.brand_toone img {
    width: calc(160 * (100vw / 760));
  }

  .event_list .item_list__brand.brand_refa img {
    width: calc(118 * (100vw / 760));
  }

  .event_list .item_list__brand.brand_mirai img {
    width: calc(154 * (100vw / 760));
  }

  .event_list .item_list__brand.brand_lovec img {
    width: calc(200 * (100vw / 760));
  }

  .event_list .item_list__brand.brand_sb img {
    width: calc(150 * (100vw / 760));
  }

  .event_list .item_list__brand.brand_nahrin img {
    width: calc(140 * (100vw / 760));
  }

  .event_list .item_list__brand.brand_femmue img {
    width: calc(140 * (100vw / 760));
  }

  .event_list .item_list__brand.logo_lacasta img {
    width: calc(140 * (100vw / 760));
  }

  /* ===================
    　　　CALENDAR
  =================== */

  .calendar_section {
    margin-bottom: calc(0 * (100vw / 760));
  }

  .calendar_section .inner {
    position: relative;
    padding: calc(86 * (100vw / 760)) calc(25 * (100vw / 760));
  }

  .calendar_section .calendar_head {
    margin-bottom: calc(65 * (100vw / 760));
    padding-bottom: calc(20 * (100vw / 760));
    border-bottom-color: #afafaf;
  }

  .calendar_section .calendar_head::before {
    display: none;
  }

  .calendar_section .inner::before {
    position: absolute;
    right: calc(25 * (100vw / 760));
    bottom: calc(25 * (100vw / 760));
    width: calc(112 * (100vw / 760));
    height: calc(149 * (100vw / 760));
    background: url(../img/202411/icn_ck6.svg) no-repeat;
    background-size: 100%;
    content: "";
  }

  .bnr_line {
    margin-bottom: calc(102 * (100vw / 760));
  }

  .bnr_line a {
    gap: calc(31 * (100vw / 760));
    padding: calc(35 * (100vw / 760)) calc(14 * (100vw / 760));
    font-size: calc(30 * (100vw / 760));
    line-height: 1;
  }

  .bnr_line img {
    width: calc(119 * (100vw / 760));
  }

  .ttl_main_02 {
    margin-bottom: calc(40 * (100vw / 760));
    font-size: calc(58 * (100vw / 760));
    line-height: 1.4;
    letter-spacing: 0.04em;
  }

  .calendar_head {
    margin: auto calc(50 * (100vw / 760)) calc(80 * (100vw / 760));
    padding-bottom: 0;
  }

  .calendar_head .ttl_main {
    position: relative;
    z-index: 0;
    margin-bottom: calc(45 * (100vw / 760));
    font-size: calc(58 * (100vw / 760));
  }

  .calendar_head p {
    font-size: calc(28 * (100vw / 760));
    line-height: 1.8;
  }

  .calendar_head .txt_bold {
  }

  .img_calendar {
    width: auto !important;
    margin: auto 0 calc(20 * (100vw / 760)) ;
  }

  .btn_viewmore {
    position: absolute;
    top: calc(858 * (100vw / 760));
    right: calc(25 * (100vw / 760));
    width: calc(202 * (100vw / 760));
    margin: 0;
    line-height: 1.4;
  }

  /* ===================
    　　　ABOUT
  =================== */

  .about_area {
    margin-bottom: calc(56 * (100vw / 760));
    padding: calc(70 * (100vw / 760)) 0 calc(60 * (100vw / 760));
    font-size: calc(28 * (100vw / 760));
  }

  .about_area::before {
    left: calc(10 * (100vw / 760));
    bottom: calc(20 * (100vw / 760));
    width: calc(166 * (100vw / 760));
    height: calc(150 * (100vw / 760));
  }

  .about_area .ttl_main_02 {
    margin-bottom: calc(75 * (100vw / 760));
    font-size: calc(57 * (100vw / 760));
  }

  .about_area .about_img {
    float: none;
    width: 100%;
    margin-bottom: calc(68 * (100vw / 760));
  }

  .about_area .about_cont {
    float: none;
    width: auto;
    padding: 0 calc(30 * (100vw / 760));
  }

  .about_area .about_cont p {
    font-size: calc(28 * (100vw / 760));
    line-height: 2.3;
    text-align: center;
  }

  .about_area .about_cont .cont_btn {
    padding-top: calc(50 * (100vw / 760));
  }

  .about_area .about_cont .cont_btn a {
  }

  /* ---- Line Coupon ---- */
  .line_coupon {
    margin-bottom: calc(100 * (100vw / 760));
    padding-top: calc(100*(100vw / 760));
  }

  .line_coupon .ttl_main_02 {
    margin-bottom: calc(37 * (100vw / 760));
    font-size: calc(45 * (100vw / 760));
  }

  .line_coupon .txt_sub {
    margin-bottom: calc(53 * (100vw / 760));
    font-size: calc(28 * (100vw / 760));
    line-height: 2;
  }

  .line_coupon .line_btn {
    width: calc(650 * (100vw / 760));
    margin: auto auto calc(98 * (100vw / 760));
  }


  /* ---- カレンダー ---- */

  .calendar_cont {
    margin: 0 calc(20 * (100vw / 760)) calc(0 * (100vw / 760));
    padding: 0 calc(20 * (100vw / 760));
    padding-bottom: calc(40 * (100vw / 760));
    background: #f2f8e9;
    border-bottom: none;
    font-size: calc(21 * (100vw / 760));
  }

  .calendar_cont.calendar_cont_finish::before {
    font-size: calc(34 * (100vw / 760));
    letter-spacing: 0.02em;
  }

  .calendar_list {
    width: auto;
    margin: auto auto calc(20 * (100vw / 760));
    padding: 0;
    background: #f2f8e9;
    border-bottom: 1px solid #9b9b9b;
  }

  .calendar_list > ul > li > dl {
    display: flex;
    padding: calc(30 * (100vw / 760)) 0 calc(30 * (100vw / 760)) calc(20 * (100vw / 760));
  }

  .calendar_list > ul > li:last-child > dl{
    border-bottom: none;
  }

  .calendar_list > ul > li > dl > dt {
    width: calc(77 * (100vw / 760));
    margin-right: calc(45 * (100vw / 760));
  }

  .calendar_list > ul > li > dl > dd {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: calc(100% - 40 * (100vw / 760));
    gap: calc(20 * (100vw / 760));
  }

  .calendar_list .icn {
    width: calc(84 * (100vw / 760));
    margin-right: calc(20 * (100vw / 760));
  }

  .calendar_list .icn.icn_live img {
    width: calc(69 * (100vw / 760));
  }

  .calendar_list .icn.icn_off {
    padding-top: calc(10 * (100vw / 760));
    vertical-align: top;
  }

  .calendar_list .icn.icn_present {
  }

  .calendar_list .icn.icn_event img {
    width: calc(60 * (100vw / 760));
  }

  .calendar_list .column_area .icn_inst {
    margin-top: calc(2 * (100vw / 760));
    padding-right: calc(25 * (100vw / 760));
    font-size: calc(23 * (100vw / 760));
  }

  .calendar_list .column_area .icn_inst::before {
    top: calc(2 * (100vw / 760));
    width: calc(20 * (100vw / 760));
    height: calc(20 * (100vw / 760));
    -webkit-mask-size: 100%;
  }

  .calendar_list .column_area .icn_inst.inst_pink {
    margin-top: calc(15 * (100vw / 760));
    margin-bottom:  calc(15 * (100vw / 760));
  }

  .calendar_list > ul > li > dl > dd > p {
  }

  .calendar_list > ul > li > dl > dd .column_area {
    width: 100%;
    max-width: 100%;
    height: auto;
    gap: calc(20 * (100vw / 760));
  }

  .calendar_list > ul > li > dl > dd .column_area p {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
  }

  .calendar_list .tag {
    display: flex;
    align-items: center;
    width: fit-content;
    padding: calc(12 * (100vw / 760)) calc(33 * (100vw / 760));
    font-size: calc(23 * (100vw / 760));
    line-height: 1.3;
    letter-spacing: 0.02em;
  }

  /* Time Table */
  .calendar_list .time_table {
    margin-bottom: calc(10 * (100vw / 760));
    padding: 0 0 0 calc(105 * (100vw / 760));
    font-size: calc(21 * (100vw / 760));
    letter-spacing: 0.02em;
  }

  .calendar_list .time_table div {
    margin-bottom: calc(13 * (100vw / 760));
  }

  .calendar_list .time_table div:last-child {
    margin-bottom: 0;
  }

  .calendar_list .time_table dt {
    width: calc(70 * (100vw / 760));
    padding: 0 calc(3 * (100vw / 760));
    font-size: calc(22 * (100vw / 760));
    letter-spacing: 0.07em;
  }

  .calendar_list .time_table dt::before {
    bottom: calc(5 * (100vw / 760));
    border-bottom-width: calc(8 * (100vw / 760));
  }

  .calendar_list .time_table dd {
    width: calc(100% - 80 * (100vw / 760));
    white-space: nowrap;
  }

  .calendar_list .time_table .txt_red {
    margin-left: calc(5 * (100vw / 760));
    padding: calc(2 * (100vw / 760)) calc(10 * (100vw / 760));
    font-size: calc(18 * (100vw / 760));
    vertical-align: 2px;
  }

  /* ---- キャンペーンエリア ---- */

  .calendar_section .campaign_area {
    padding-top: calc(114 * (100vw / 760));
    padding-bottom: calc(250 * (100vw / 760));
    margin-bottom: 0;
    background: url(../img/main/bg_top_nav.png) no-repeat bottom;
    background-size: 100%;
  }

  .calendar_section .campaign_area .ttl_main_02 {
    margin-bottom: calc(40 * (100vw / 760));
    padding-top: 0;
    padding-bottom: 0;
    font-size: calc(40 * (100vw / 760));
  }

  .calendar_section .ttl_main_02 span {
    font-size: calc(40 * (100vw / 760));
    line-height: 1.5;
  }

  .calendar_section .campaign_area .campaign_cont {
    gap: calc(60 * (100vw / 760));
    width: auto;
    flex-direction: column-reverse;
    margin: auto auto calc(60 * (100vw / 760));
  }

  .calendar_section .campaign_area .campaign_cont picture {
    width: calc(650 * (100vw / 760));
  }

  .calendar_section .campaign_area .campaign_cont p {
    width: auto;
    font-size: calc(28 * (100vw / 760));
    line-height: 2;
    text-align: center;
  }

  .calendar_section .campaign_area .line_btn {
    width: calc(590 * (100vw / 760));
    margin: auto;
  }

  .about_section .logo_area {
    width: calc(302 * (100vw / 760));
    margin: auto auto calc(100 * (100vw / 760));
  }

  /* ===================
    　　ページトップ
  =================== */

  #page-top a {
    width: calc(210 * (100vw / 760));
    height: calc(200 * (100vw / 760));
    padding: 0;
  }

  /*リンクを右下に固定*/
  #page-top {
    position: fixed;
    right: calc(25 * (100vw / 760));
    bottom: calc(196 * (100vw / 760));
    transform: translateY(100rem);
  }

  #page-top.page_top_finish {
    bottom: calc(20 * (100vw / 760));
  }

  /* ===================
    　　KIT PICKUP
  =================== */

  .event_kit_wrap {
    display: block;
    gap: 0;
    padding: 0;
  }

  .event_kit_wrap .acc_cont {
    display: none;
  }

  #panel2 .event_kit_wrap .event_kit_inner {
    padding: 0;
    gap: calc(36 * (100vw / 760));
  }

  .event_kit_wrap .event_kit_img {
  }
/*
  .event_kit_wrap .event_kit_img::before {
    top: calc(10 * (100vw / 760));
    left: calc(10 * (100vw / 760));
    width: calc(110 * (100vw / 760));
    height: calc(110 * (100vw / 760));
  }
*/
  .event_kit_wrap .event_kit_list .event_kit_img::before {
    top: calc(5 * (100vw / 760));
    left: calc(5 * (100vw / 760));
    width: calc(80 * (100vw / 760));
    height: calc(80 * (100vw / 760));
  }

  .event_kit_wrap .event_kit {
    display: block;
    gap: 0;
    margin-bottom: calc(90 * (100vw / 760));
    /*padding-bottom: calc(64 * (100vw / 760));
    border-bottom: 1px solid var(--main-color);*/
  }

  .event_kit_wrap .event_kit:last-child {
    margin-bottom: 0;
    padding-bottom: calc(40 * (100vw / 760));
    border-bottom: none;
  }

  .event_kit_wrap .event_kit02,
  .event_kit_wrap .event_kit03,
  .event_kit_wrap .event_kit04 {
    position: relative;
    z-index: 0;
    width: auto;
  }

  .event_kit_wrap .event_kit04 {
    width: calc(300 * (100vw / 760));
    margin-bottom:  calc(50 * (100vw / 760));
  }

  .event_kit_wrap .ttl_kit_event {
    padding: calc(40 * (100vw / 760)) 0 calc(5 * (100vw / 760));
    font-size: calc(28 * (100vw / 760));
    text-align: left;
    letter-spacing: 0;
    line-height: 1.4;
  }

  .event_kit_wrap .ttl_kit_event .logo_area {
    margin-bottom: calc(30 * (100vw / 760));
    padding-top: calc(20 * (100vw / 760));
  }

  .event_kit_wrap .event_kit_bottom {
    padding: 0;
  }

  .event_kit_wrap .btn_link_check {
    margin: 0 0 0 auto;
    padding: 0;
  }

  .event_kit_wrap .txt_kit_cont {
    padding-top: 0;
    font-size: calc(30 * (100vw / 760));
    line-height: 1.7;
  }

  .event_section .btn_event {
    width: calc(650 * (100vw / 760));
    margin-bottom: calc(30 * (100vw / 760));
  }

  .event_kit_wrap .event_kit_img .tag_limited {
    top: calc(10 * (100vw / 760));
    left: calc(10 * (100vw / 760));
    border-radius: calc(6 * (100vw / 760));
    letter-spacing: 0.08em;
    padding: calc(8 * (100vw / 760)) calc(20 * (100vw / 760)) calc(5 * (100vw / 760));
    font-size: calc(22 * (100vw / 760));
  }

  .event_brand {
    margin: calc(30 * (100vw / 760)) 0 0;
  }

  .event_brand.event_brand_celvoke img {
    width: calc(112 * (100vw / 760));
  }

  .event_brand.event_brand_snidel img {
    width: calc(102 * (100vw / 760));
  }

  .event_brand.event_brand_toone img {
    width: calc(197 * (100vw / 760));
  }

  .event_brand + .ttl_kit_event {
    min-height: auto;
    padding-top: calc(20 * (100vw / 760));
    padding-bottom: calc(5 * (100vw / 760));
    line-height: 1.6;
  }

  #panel2 .event_kit_wrap .event_kit_bottom .btn_link_check {
    margin: calc(20 * (100vw / 760)) auto auto;
  }

  /* ===================
    　　KIT LIST
  =================== */

  .event_kit_list {
    margin: auto;
    padding-top: calc(60 * (100vw / 760));
  }

  .event_kit_list ul {
    padding: 0;
    gap: calc(40 * (100vw / 760)) calc(15 * (100vw / 760));
  }

  .event_kit_list li {
    justify-content: flex-start !important;
    width: calc(50% - 15 * (100vw / 760));
  }

  .event_kit_list .ttl_kit_event {
    padding-bottom: calc(25 * (100vw / 760));
    font-size: calc(25 * (100vw / 760));
  }

  .event_kit_list .txt_kit_cont {
    width: 100%;
    padding-top: calc(38 * (100vw / 760));
    font-size: calc(25 * (100vw / 760));
  }

   .btn_link_check {
    width: calc(199 * (100vw / 760));
    height: calc(70 * (100vw / 760));
    margin-top: calc(0 * (100vw / 760));
    font-size: calc(25 * (100vw / 760));
    border-radius: 20rem;
  }

  .event01_section .event_kit_list + .btn_link {
    margin-top: calc(20 * (100vw / 760));
    margin-bottom: 0;
  }

  /* ===================
    　　　CONTENTS
  =================== */

  .contents_section {
    position: relative;
    z-index: 0;
    margin-bottom: calc(0*(100vw / 760));
    padding-top: calc(100*(100vw / 760));
  }

  .contents_section.effect::before {
    position: absolute;
    top: calc(-275*(100vw / 760));
    left: calc(-193*(100vw / 760));
    z-index: -1;
    width: calc(747*(100vw / 760));
    height: calc(772*(100vw / 760));
    background: url(../img/main/img_yurian_06.png) no-repeat;
    background-size: 100%;
    transform: none;
    animation: yurayura3 1.5s cubic-bezier(0.07, 0.33, 0.91, 1.56) infinite;
    content: "";
  }

  .contents_section .inner {
    position: relative;
    z-index: 2;
    padding: calc(80*(100vw / 760)) calc(25*(100vw / 760)) calc(80*(100vw / 760));
  }

  .contents_list {
    margin: 0 auto;
  }

  .contents_list ul {
    margin-bottom: calc(80*(100vw / 760));
    gap: calc(50*(100vw / 760));
    flex-direction: column;
  }

  .contents_list ul li {
    width: 100%;
  }

  .contents_list li a {
    display: flex;
    gap: calc(33*(100vw / 760));
    align-items: center;
    position: relative;
    z-index: 4;
    width: auto !important;
  }

  .contents_list .img_area {
    width: calc(260*(100vw / 760));
    height: calc(260*(100vw / 760));
    border-radius: calc(10*(100vw / 760));
  }

  .contents_list .img_area img {
    height: 100%;
  }

  .contents_list li:first-child,
  .contents_list .colum_full,
  .contents_list li:last-child {
    width: 100% !important;
  }

  .contents_list .colum_full {
    padding: 0 calc(20*(100vw / 760)) calc(60*(100vw / 760));
  }

  .contents_list .colum_full p {
    text-align: left;
  }

  .contents_section .txt_center {
    padding-top: calc(90*(100vw / 760));
  }

  .contents_section .txt_center img {
    width: calc(337*(100vw / 760));
    margin: auto;
  }

  .contents_list .txt_area {
    width: calc(404*(100vw / 760));
    padding: 0;
    margin-bottom: calc(-10*(100vw / 760));
    font-size: calc(28*(100vw / 760));
    line-height: 1.75;
    text-align: left;
  }

  .contents_list .img_area.comingsoon.comingsoon_half::before {
    background-image: url(../img/main/img_contents_06_sp.png?240627);
  }

  .contents_list .youtube_area {
    overflow: hidden;
  }

  .contents_list .youtube_area iframe {
    width: 100%;
    height: 50vw;
  }
  .contents_list .youtube_area.comingsoon iframe {
    height: 37vw;
  }

  /* ===================
    　　　MODAL
  =================== */

  /* モーダル全体 */
  .modal {
  }

  /* モーダルのコンテンツ */
  .modal-content {
    overflow-y: scroll;
    max-height: calc(100dvh - 200*(100vw / 760));
    height: calc(100dvh - 200*(100vw / 760));
    margin: calc(40*(100vw / 760)) auto 0;
    padding: calc(34*(100vw / 760)) calc(34*(100vw / 760)) calc(34*(100vw / 760));
    box-shadow: 0 3px 6px rgb(0, 0, 0, 0.2);
    border-radius: calc(10*(100vw / 428));
  }

  /* バツ印のスタイル（CSSで線を表現） */
  .close-btn {
    position: fixed;
    top: auto;
    left: 50%;
    right: auto;
    z-index: 10;
    transform: translate(-50%);
    bottom: calc(50*(100vw / 760));
    width: 80%;
    height: calc(103*(100vw / 760));
    padding: calc(0*(100vw / 760)) calc(34*(100vw / 760)) calc(0*(100vw / 760));
    background: url(../img/202411/btn_close.svg) no-repeat center #fff;
    background-size: calc(143*(100vw / 760));
    border-radius: 0 0 calc(10*(100vw / 428)) calc(10*(100vw / 428));
  }

  .close-btn::before,
  .close-btn::after {
    display: none;
  }

  .modal-content h3 {
    margin-bottom: calc(25*(100vw / 760));
    padding-top:calc(15*(100vw / 760)) ;
    font-size: calc(35*(100vw / 760));
  }

  .modal-content .app_list {
    justify-content: center;
    position: relative;
    gap: calc(34*(100vw / 760));
    right: auto;
    bottom: auto;
    margin: calc(34*(100vw / 760)) 0 calc(70*(100vw / 760));
  }

  .modal-content .app_list li:nth-child(1) {
    width: calc(223*(100vw / 760));
  }

  .modal-content .app_list li:nth-child(2) {
    width: calc(275*(100vw / 760));
  }

}


/* SOLDOUT 表記 */
.soldout-mask {
	position: relative;
}
.soldout-mask::after {
	content: '';
    position: absolute;
    height: 106%;
    width: 106%;
    background: rgb(223 231 213 / 80%);
    top: -3%;
    left: -3%;
    border-radius: 1rem;
}

.soldout-txt {
    position: absolute;
    z-index: 10;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: 2.5rem;
}

.btn_link a {
    position: relative;
    z-index: 10;
}
@media screen and (max-width: 767px)  {
.soldout-mask::after {
    width: 104%;
    border-radius: calc(10 * (100vw / 390));
    left: -2%;
}

.soldout-txt {
	text-align: center !important;
	font-size: calc(20 * (100vw / 390));
	}
}


/* kit商品調整 */
@media screen and (max-width: 767px)  {
.event_kit_list .ttl_kit_event {
    font-size: calc(24 * (100vw / 760));
}
}
