@charset "UTF-8";



/*all----------------------------*/

html {

  font-size: 62.5%;

  -ms-overflow-style: none;

  scrollbar-width: none;

}



html::-webkit-scrollbar {

  display:none;

}



body {

  -webkit-tap-highlight-color: transparent;

}



#Wrap {

  width: auto;

}



#HeaderWrap {

  display: none;

}



#FooterWrap {

  position: relative;

}



:root {

  --font_regular: "Poppins", "Noto Sans JP", sans-serif;

  --font_eng: "Oswald", sans-serif;

  --color_regular: #383330;

  --color_line: #03C154;

  --color_01: #C1986B;

  --color_02: #A77A47;

  --color_03: #FFF6ED;

  --color_04: #654723;

  --color_05: #980807;

  --color_06: #fff;

  --color_cat_all: #980807;

  --color_cat_present: #966988;

  --color_cat_coupon: #536F45;

  --color_cat_secret: #A38E66;

  --color_cat_instalive: #497EA5;

  --color_cat_youtube: #24616C;

  --color_cat_sns: #B97220;

  --color_cat_makeup: #D06E9B;

}



.LP_page * {

  -webkit-box-sizing: border-box;

  box-sizing: border-box;

  line-height: 1;

  letter-spacing: .05em;

}



.LP_page {

  width: 100%;

  font-family: var(--font_regular);

  color: var(--color_regular);

  overflow-x: clip;

  opacity: 0;

  transition: opacity 1s;

}



.LP_page input {

  display: none;

}



.LP_page_inner {

  background: #fff;

}



.LP_page.active {

  opacity: 1;

}



.LP_page a {

  display: block;

}



.LP_page a:hover {

  opacity: 1 !important;

}



.LP_page img {

  width: 100%;

  height: auto;

  vertical-align: bottom;

}



.LP_page sup {

  font-size: calc(8 * (60rem / 390));

}



/*----------------------------all*/



/*heading-----------------------*/

.heading_area {

  position: relative;

  padding-bottom: calc(50 * (60rem / 390));

  background: var(--color_01);

  overflow: clip;

}



.heading_area .for_curtain {

  position: absolute;

  z-index: 3;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  clip-path: inset(0);

  pointer-events: none;

}



.heading_area .for_curtain > div {

  display: block;

  position: fixed;

  top: 0;

  width: calc(390 * (60rem / 390));

  height: 100lvh;

}



.heading_area .for_curtain > div::before,

.heading_area .for_curtain > div::after {

  position: absolute;

  top: 0;

  width: 60%;

  height: calc(100lvh + calc(60 * (60rem / 390)));

  margin-top: calc(-60 * (60rem / 390));

  background-color: var(--color_05);

  background-image: linear-gradient(90deg,#B51F1E 30%, transparent 50%, #B51F1E 80%, transparent 100%);

  background-size: calc(60 * (60rem / 390));

  content: "";

}



.heading_area .for_curtain > div::before {

  left: 0;

}



.heading_area .for_curtain > div::after {

  right: 0;

  scale: -1 1;

}



.LP_page.active .heading_area .for_curtain > div::before {

  animation: moveLeft 3s .5s forwards;

}



@keyframes moveLeft {

 100% {

  translate: -200% 0;

  rotate: 20deg;

  border-radius: 0 0 300% 0;

 }

}



.LP_page.active .heading_area .for_curtain > div::after {

  animation: moveRight 3s .5s forwards;

}





@keyframes moveRight {

 100% {

  translate: 200% 0;

  rotate: -20deg;

  border-radius: 0 0 200% 0;

 }

}



.heading_area .mv_wrap {

  position: relative;

  margin-bottom: calc(35 * (60rem / 390));

}



.heading_area .mv {

  transform: scale(0.8, 1.4) translate(0%, -100%); 

}



.LP_page.active .heading_area .mv {

  animation: poyon 1.5s 1.2s linear forwards;

}



@keyframes poyon {

  0%   { transform: scale(0.9, 1.1) translate(0%, -100%); }

  10%  { transform: scale(0.9, 1.1) translate(0%, -10%); }

  20%  { transform: scale(1.1, 0.8) translate(0%, 10%); }

  30%  { transform: scale(0.95, 1.1) translate(0%, -3%); }

  40%  { transform: scale(0.98, 1.05) translate(0%, -10%); }

  50%  { transform: scale(0.98, 1.05) translate(0%, -3%); }

  60%  { transform: scale(1.02, 0.98) translate(0%, 1%); }

  70%  { transform: scale(1.0, 1.0) translate(0%, 0%); }

  100% { transform: scale(1.0, 1.0) translate(0%, 0%); }

}



.timer_outside {

  position: relative;

  margin-bottom: calc(30 * (60rem / 390));

  opacity: 0;

  translate: 0 calc(12 * (60rem / 390));

  transition: translate .6s, opacity .6s;

}



.timer_outside.active {

  translate: 0 0;

  opacity: 1;

}



.timer_outside .each_icon {

  position: absolute;

  z-index: 2;

  top: 0;

  width: calc(80 * (60rem / 390));

  margin-top: calc(40 * (60rem / 390));

  border-radius: 50%;

  background: url(../../img/202511/maindeco/cloth1.jpg) center center / cover no-repeat;

  overflow: clip;

  scale: 0;

  transition: scale .4s;

}



.timer_outside .each_icon:nth-of-type(1) {

  left: 0;

  margin-left: calc(20 * (60rem / 390));

  transition-delay: 1s;

}



.timer_outside .each_icon:nth-of-type(2) {

  right: 0;

  margin-right: calc(20 * (60rem / 390));

  transition-delay: 1.2s;

}



.timer_outside.active .each_icon {

  scale: 1;

  animation: rotateZ2 15s 5s infinite;

}



.timer_outside.active .each_icon:nth-of-type(2) {

  animation-delay: 9s;

}



.timer_outside h3 {

  margin-bottom: calc(8 * (60rem / 390));

  font-size: calc(30 * (60rem / 390));

  font-weight: 600;

  text-align: center;

  color: var(--color_06);

}



.timer_outside h3 span:not(.txt_S) {

  display: inline-block;

  animation: txtBound 5s ease-in-out infinite;

}



.timer_outside h3 span:nth-of-type(2) {

  animation-delay: .15s;

}



.timer_outside h3 span:nth-of-type(3) {

  animation-delay: .3s;

}



.timer_outside h3 span:nth-of-type(4) {

  animation-delay: .45s;

}



.timer_outside h3 span:nth-of-type(5) {

  animation-delay: .6s;

}



.timer_outside h3 span:nth-of-type(6) {

  animation-delay: .75s;

}



.timer_outside h3 span:nth-of-type(7) {

  animation-delay: .9s;

}



.timer_outside h3 span:nth-of-type(8) {

  animation-delay: 1.05s;

}



.timer_outside h3 span:nth-of-type(9) {

  animation-delay: 1.2s;

}



.timer_outside h3 span:nth-of-type(10) {

  animation-delay: 1.35s;

}



@keyframes txtBound {

  0%, 12%, 25%, 100% {

    translate: unset;

  }

  20% {

    translate: 0 calc(-6 * (60rem / 390));

  }

}



.timer_outside h3 .txt_S {

  display: block;

  margin-top: calc(8 * (60rem / 390));

  font-size: calc(13 * (60rem / 390));

  color: var(--color_06);

}



.timer_wrap {

  position: relative;

  z-index: 1;

  width: calc(325 * (60rem / 390));

  height: calc(150 * (60rem / 390));

  margin: 0 auto;

}



.timer_wrap::before {

  position: absolute;

  z-index: -1;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  border-radius: 50%;

  background: var(--color_03);

  content: "";

}



.timer_wrap .upperColumn {

  display: grid;

  place-items: center;

  height: 50%;

}



.timer_wrap .upperColumn.only_second {

  height: 100%;

  padding-bottom: calc(6 * (60rem / 390));

}



.timer_wrap .upperColumn p {

  position: relative;

  width: fit-content;

  margin: 0 auto;

}



.timer_wrap .upperColumn .timer_num {

  display: block;

  width: calc(65 * (60rem / 390));

  font-family: var(--font_eng);

  font-size: calc(54 * (60rem / 390));

  font-weight: 700;

  text-align: center;

}



.timer_wrap .upperColumn.only_second .timer_num {

  width: calc(80 * (60rem / 390));

  font-size: calc(70 * (60rem / 390));

}



.timer_wrap .upperColumn .txt_unit {

  position: absolute;

  bottom: 0;

  left: 100%;

  margin-left: calc(2 * (60rem / 390));

  font-size: calc(20 * (60rem / 390));

  font-weight: 500;

  white-space: nowrap;

}



.timer_wrap .lowerColumn {

  position: relative;

  display: flex;

  justify-content: center;

  gap: calc(6 * (60rem / 390));

  height: 50%;

  font-family: var(--font_eng);

}



.timer_wrap .lowerColumn::before {

  position: absolute;

  top: 0;

  left: 50%;

  translate: -50% 0;

  width: calc(100% - calc(55 * (60rem / 390)));

  height: calc(1.5 * (60rem / 390));

  background: var(--color_regular);

  opacity: .7;

  content: "";

}



.timer_wrap .lowerColumn p {

  position: relative;

  width: calc(62 * (60rem / 390));

  height: fit-content;

  padding-top: calc(10 * (60rem / 390));

  font-size: calc(11 * (60rem / 390));

  font-weight: 300;

  text-align: center;

}



.timer_wrap .lowerColumn .timer_num {

  display: block;

  margin-bottom: calc(5 * (60rem / 390));

  font-size: calc(30 * (60rem / 390));

  font-weight: 700;

}



.timer_wrap .lowerColumn p:nth-of-type(n+2)::before {

  position: absolute;

  top: 0;

  right: 100%;

  margin: calc(15 * (60rem / 390)) calc(2 * (60rem / 390)) 0 0;

  font-family: var(--font_regular);

  font-size: calc(20 * (60rem / 390));

  font-weight: 500;

  color: var(--color_regular);

  content: ":";

}



.heading_area .logo_cosmekichen {

  position: relative;

  width: calc(132 * (60rem / 390));

  margin: 0 auto calc(25 * (60rem / 390));

}



.heading_area .logo_cosmekichen::before {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  mask-image: url(../../img/202511/logo_cosmekichen2.svg);

  mask-position: center center;

  mask-size: cover;

  mask-repeat: no-repeat;

  -webkit-mask-image: url(../../img/202511/logo_cosmekichen2.svg);

  -webkit-mask-position: center center;

  -webkit-mask-size: cover;

  -webkit-mask-repeat: no-repeat;

  background: var(--color_regular);

  content: "";

}



.heading_area .logo_cosmekichen img {

  opacity: 0;

}



.accessBtn_wrap > p {

  position: relative;

  width: fit-content;

  margin: 0 auto calc(10 * (60rem / 390));

  padding: 0 calc(8 * (60rem / 390));

  font-size: calc(14 * (60rem / 390));

  font-weight: 700;

  letter-spacing: .1em;

  font-feature-settings: "palt";

  text-align: center;

}



.accessBtn_wrap > p::before,

.accessBtn_wrap > p::after {

  position: absolute;

  bottom: 0;

  width: calc(1.5 * (60rem / 390));

  height: calc(14 * (60rem / 390));

  margin-bottom: calc(1 * (60rem / 390));

  border-radius: calc(10 * (60rem / 390));

  transform-origin: bottom center;

  background: var(--color_regular);

  content: "";

}



.accessBtn_wrap > p::before {

  left: 0;

  rotate: -30deg;

}



.accessBtn_wrap > p::after {

  right: 0;

  rotate: 30deg;

}



.accessBtn {

  position: relative;

  width: fit-content;

  margin: 0 auto;

}



.accessBtn::before {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  margin-top: calc(5 * (60rem / 390));

  border-radius: calc(100 * (60rem / 390));

  border: solid var(--color_regular) calc(1 * (60rem / 390));

  background: #fff;

  box-sizing: border-box;

  content: "";

}



.accessBtn a {

  position: relative;

  z-index: 1;

  display: grid;

  place-items: center;

  width: calc(300 * (60rem / 390));

  height: calc(56 * (60rem / 390));

  border-radius: calc(100 * (60rem / 390));

  border: solid var(--color_regular) calc(1 * (60rem / 390));

  background: var(--color_regular);

  font-size: calc(18 * (60rem / 390));

  font-weight: 500;

  color: #fff;

  transition: translate .3s;

}



.accessBtn a:hover {

  translate: 0 calc(5 * (60rem / 390));

}



.accessBtn a::after {

  position: absolute;

  z-index: 1;

  top: 50%;

  right: 0;

  translate: 0 -50%;

  width: calc(12 * (60rem / 390));

  height: calc(8 * (60rem / 390));

  margin-right: calc(10 * (60rem / 390));

  background: url(../../img/202511/shape_arrow2.svg) center center / cover no-repeat;

  rotate: -90deg;

  content: "";

}



.heading_area .accessBtn_wrap > p {

  font-weight: 500;

}



.link_LINEaccount.accessBtn a {

  width: calc(260 * (60rem / 390));

  height: calc(50 * (60rem / 390));

  background: var(--color_line);

}



.link_LINEaccount.accessBtn a p span {

  display: inline-block;

  width: calc(40 * (60rem / 390));

  margin-right: calc(10 * (60rem / 390));

  vertical-align: -.6em;

}



.heading_area .link_LINEcoupon {

  position: fixed;

  bottom: 0;

  right: 0;

  z-index: 3;

  width: calc(116 * (60rem / 390));

  margin: 0 calc(8 * (60rem / 390)) calc(20 * (60rem / 390)) 0;

  transition: translate .3s, transform .3s;

  transform: translateX(calc(100% + calc(8 * (60rem / 390))));

  cursor: pointer;

}



.heading_area .link_LINEcoupon.active {

  transform: unset;

}



.heading_area .link_LINEcoupon.move {

  translate: 0 calc(-70 * (60rem / 390))

}



body.no_scroll {

  height: 100vh;

  overflow: hidden;

}



#HeaderWrap.hidden {

  opacity: 0;

  pointer-events: none;

}



.modal_outside.hidden {

  opacity: 0;

  pointer-events: none;

  overflow-y: auto;

}



.modal_outside {

  position: fixed;

  z-index: 1000;

  top: 0;

  left: 50%;

  translate: -50% 0;

  display: flex;

  align-items: center;

  width: 100%;

  height: 100%;

  transition: opacity .5s;

  overflow-y: scroll;

  -ms-overflow-style: none;

  scrollbar-width: none;

}



.modal_outside::-webkit-scrollbar {

  display:none;

}



.modal_outside::before {

  position: absolute;

  z-index: -1;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background: rgba(0, 0, 0, .6);

  backdrop-filter: blur(2px);

  -webkit-backdrop-filter: blur(2px);

  content: "";

}



.modal_overlay {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

}



.modal_wrap {

  width: calc(360 * (60rem / 390));

  margin: 0 auto;

  max-height: 100%;

  padding-bottom: calc(45 * (60rem / 390));

  overflow-y: scroll;

  -ms-overflow-style: none;

  scrollbar-width: none;

}



.modal_wrap::-webkit-scrollbar {

  display:none;

}



.modal_inner {

  position: relative;

}



.btn_modalClose {

  position: absolute;

  top: 100%;

  left: 50%;

  translate: -50% 0;

  z-index: 2;

  width: calc(95 * (60rem / 390));

  height: calc(30 * (60rem / 390));

  margin-top: calc(15 * (60rem / 390));

  border-radius: calc(100 * (60rem / 390));

  border: solid var(--color_regular) calc(1.5 * (60rem / 390));

  background: #fff;

  color: inherit;

  cursor: pointer;

}



.btn_modalClose span {

  position: relative;

  padding-right: calc(20 * (60rem / 390));

  font-size: calc(15 * (60rem / 390));

  font-weight: 500;

}



.btn_modalClose span::before,

.btn_modalClose span::after {

  position: absolute;

  top: 50%;

  right: 0;

  translate: 0 -50%;

  width: calc(16 * (60rem / 390));

  height: calc(1.5 * (60rem / 390));

  background: var(--color_regular);

  rotate: 45deg;

  content: "";

}



.btn_modalClose span::after {

  rotate: -45deg;

}



.btn_modalClose::before {

  rotate: 90deg;

}



.modal_content {

  background: #fff;

}

/*-----------------------heading*/



/*main lead---------------------*/



.main_lead_wrap {

  position: relative;

  z-index: 1;

  background: var(--color_02);

  perspective: calc(10000 * (60rem / 390));

}



.main_lead_wrap::before {

  position: absolute;

  z-index: -1;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background: url(../../img/202511/maindeco/bg_ribbon1.png) center center / 100% auto repeat-y;

  opacity: .08;

  content: "";

}



.brandLineup {

  position: relative;

  z-index: 1;

  height: calc(45 * (60rem / 390));

}



.brandLineup::before {

  position: absolute;

  z-index: -1;

  width: 100%;

  height: 100%;

  background: var(--color_05);

  content: "";

}



.brandLineup::after {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  mask-image: url(../../img/202511/brandLineup.svg);

  mask-position: center left;

  mask-size: auto 100%;

  mask-repeat: repeat-x;

  -webkit-mask-image: url(../../img/202511/brandLineup.svg);

  -webkit-mask-position: center left;

  -webkit-mask-size: auto 100%;

  -webkit-mask-repeat: repeat-x;

  background: #fff;

  content: "";

}



.brandLineup.top::after {

  animation: loop1 10s linear infinite;

}



.brandLineup.bottom::after {

  animation: loop1 10s linear infinite reverse;

}



@keyframes loop1 {

  0% {

    mask-position: 0 0;

    -webkit-mask-position: 0 0;

  }

  100% {

    mask-position: calc(-410 * (60rem / 390)) 0;

    -webkit-mask-position:calc(-410 * (60rem / 390)) 0;

  }

}



.brandLineup img {

  opacity: 0;

  height: 100%;

}



.brandLineup.top {

  margin-bottom: calc(35 * (60rem / 390));

}



.brandLineup.bottom {

  margin-top: calc(40 * (60rem / 390));

}



.txt_speech {

  position: relative;

  width: calc(300 * (60rem / 390));

  margin: 0 auto calc(25 * (60rem / 390));

  padding: calc(15 * (60rem / 390)) 0;

  border-radius: calc(25 * (60rem / 390));

  background: var(--color_03);

  font-size: calc(14 * (60rem / 390));

  font-weight: 700;

  line-height: 1.5;

  text-align: center;

  opacity: 0;

  translate: 0 calc(12 * (60rem / 390));

  transition: opacity .6s, translate .6s;

}



.txt_speech.active {

  opacity: 1;

  translate: unset;

}



.txt_speech::before {

  position: absolute;

  top: 100%;

  left: 50%;

  translate: -50% 0;

  width: calc(14 * (60rem / 390));

  height: calc(14 * (60rem / 390));

  margin-top: calc(-1 * (60rem / 390));

  mask-image: url(../../img/202511/shape_speach.svg);

  mask-position: center center;

  mask-size: cover;

  mask-repeat: no-repeat;

  -webkit-mask-image: url(../../img/202511/shape_speach.svg);

  -webkit-mask-position: center center;

  -webkit-mask-size: cover;

  -webkit-mask-repeat: no-repeat;

  background: var(--color_03);

  content: "";

}



.txt_speech a {

  display: inline;

  line-height: 1.5;

  color: #980807;

  text-decoration: underline;

}



.main_lead_wrap .ttl_theorganicdays {

  position: relative;

  width: calc(220 * (60rem / 390));

  margin: 0 auto;

}



.main_lead_wrap .ttl_theorganicdays.active {

  animation: rotateZ1 1s .5s forwards;

}



@keyframes rotateZ1 {

  0% {

    transform: rotateY(0);

  }



  100% {

    transform: rotateY(360deg);

  }

}



.main_lead_wrap .ttl_theorganicdays::before {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  mask-image: url(../../img/202511/ttl_theorganicdays.svg);

  mask-position: center center;

  mask-size: cover;

  mask-repeat: no-repeat;

  -webkit-mask-image: url(../../img/202511/ttl_theorganicdays.svg);

  -webkit-mask-position: center center;

  -webkit-mask-size: cover;

  -webkit-mask-repeat: no-repeat;

  background: var(--color_03);

  content: "";

}



.main_lead_wrap .ttl_theorganicdays img {

  opacity: 0;

}



.main_lead {

  margin-top: calc(15 * (60rem / 390));

  font-size: calc(14 * (60rem / 390));

  font-weight: 700;

  line-height: 2;

  text-align: center;

  color: var(--color_06);

}



.main_lead_wrap .shop_outside {

  margin-top: calc(30 * (60rem / 390));

}



.main_lead_wrap .shop_outside > p {

  font-size: calc(16 * (60rem / 390));

  font-weight: 700;

  line-height: 1.5;

  text-align: center;

  color: var(--color_06);

}



.main_lead_wrap .shop_outside > p a {

  display: inline;

  line-height: 1.5;

  text-decoration: underline;

  text-decoration-skip-ink: none;

}



.main_lead_wrap .shop_wrap {

  position: relative;

  z-index: 1;

  display: flex;

  justify-content: center;

  align-items: flex-end;

  gap: calc(15 * (60rem / 390));

  width: calc(300 * (60rem / 390));

  margin: 0 auto;

  padding-bottom: calc(10 * (60rem / 390));

}



.main_lead_wrap .shop_wrap::before {

  position: absolute;

  z-index: -1;

  bottom: 0;

  left: 0;

  width: 100%;

  height: calc(100% - calc(15 * (60rem / 390)));

  border-radius: calc(10 * (60rem / 390));

  background: var(--color_03);

  content: "";

}



.main_lead_wrap .shop_wrap p:not(.icon_shop) {

  padding-bottom: calc(3 * (60rem / 390));

  font-size: calc(14 * (60rem / 390));

  line-height: 1.5;

  font-weight: 700;

}



.main_lead_wrap .shop_wrap .icon_shop {

  width: calc(74 * (60rem / 390));

  border-radius: 50%;

  background: var(--color_regular);

  animation: bound 2s ease infinite;

}



@keyframes bound {

  0%, 100%, 50%, 70%, 90% {

    transform: none;

  }



  60%, 80% {

    transform: translateY(calc(-8 * (48rem / 750)));

  }

}



/*---------------------main lead*/



/*main nav-----------------------*/

.nav_area {

  padding: calc(60 * (60rem / 390)) 0 calc(70 * (60rem / 390));

  background: var(--color_03);

  overflow: clip;

}



.nav_list > li {

  position: relative;

  width: fit-content;

}



.main_nav .nav_list > li::before {

  position: absolute;

  z-index: 2;

  bottom: 0;

  width: calc(110 * (60rem / 390));

  height: calc(110 * (60rem / 390));

  content: "";

}



.main_nav .nav_list > li:nth-of-type(odd)::before {

  right: 0;

  margin: 0 calc(-10 * (60rem / 390)) calc(-20 * (60rem / 390)) 0;

}



.main_nav .nav_list > li:nth-of-type(even)::before {

  left: 0;

  margin: 0 0 calc(-20 * (60rem / 390)) calc(-10 * (60rem / 390));

}



.main_nav .nav_list > li:nth-of-type(1)::before {

  background: url(../../img/202511/maindeco/inada1.png) center center / cover no-repeat;

  animation: jump1 1.2s ease infinite, jump2 1.2s linear infinite alternate;

}



.main_nav .nav_list > li:nth-of-type(2)::before {

  margin-left: calc(5 * (60rem / 390));

  background: url(../../img/202511/maindeco/kawai4.png) center center / cover no-repeat;

  animation: rotate1 3s ease infinite;

}



.main_nav .nav_list > li:nth-of-type(3)::before {

  margin-right: calc(-15 * (60rem / 390));

  background: url(../../img/202511/maindeco/inada5.png) center center / cover no-repeat;

  animation: bound 2s ease infinite;

}





@keyframes rotate1 {

  0%, 100% {

    transform: none;

  }



  40% {

    rotate: -10deg;

  }

}



@keyframes jump1 {

  0%, 100%, 30%, 70% {

    scale: unset;

  }



  50% {

    scale: 1.025;

  }

}



@keyframes jump2 {

  0%, 30% {

    transform: translateX(calc(3 * (60rem / 390)));

  }

  100%, 70% {

    transform: translateX(calc(-3 * (60rem / 390)));

  }

}





.nav_list > li:nth-of-type(n+2) {

  margin-top: calc(40 * (60rem / 390));

}



.main_nav .nav_list > li:nth-of-type(even) {

  margin-right: 0;

  margin-left: auto;

}



.nav_list > li .nav_lead {

  position: relative;

  z-index: 2;

  margin-bottom: calc(10 * (60rem / 390));

  font-size: calc(14 * (60rem / 390));

  font-weight: 700;

  letter-spacing: .1em;

  font-feature-settings: "palt";

  color: var(--color_04);

}



.main_nav .nav_list > li .nav_lead::before {

  position: absolute;

  top: 50%;

  translate: 0 -50%;

  width: calc(56 * (60rem / 390));

  height: calc(56 * (60rem / 390));

  background: url(../../img/202511/maindeco/deco_ribbon_red.png) center center / cover no-repeat;

  content: "";

}



.main_nav .nav_list > li:nth-of-type(odd) .nav_lead {

  padding-left: calc(50 * (60rem / 390));

}



.main_nav .nav_list > li:nth-of-type(odd) .nav_lead::before {

  left: 0;

}



.main_nav .nav_list > li:nth-of-type(even) .nav_lead {

  padding-right: calc(50 * (60rem / 390));

  text-align: right;

}



.main_nav .nav_list > li:nth-of-type(even) .nav_lead::before {

  right: 0;

}



.nav_list > li > a {

  position: relative;

  z-index: 1;

  display: grid;

  place-items: center;

  width: calc(375 * (60rem / 390));

  height: calc(84 * (60rem / 390));

  text-align: center;

  color: #fff;

}



.main_nav .nav_list > li:nth-of-type(odd) a {

  padding-right: calc(70 * (60rem / 390));

}



.main_nav .nav_list > li:nth-of-type(even) a {

  padding-left: calc(70 * (60rem / 390));

}



.nav_list > li > a::before {

  position: absolute;

  z-index: -1;

  bottom: 0;

  width: 100%;

  height: 100%;

  mask-image: url(../../img/202511/shape_ribbon.svg);

  mask-position: center center;

  mask-size: cover;

  mask-repeat: no-repeat;

  -webkit-mask-image: url(../../img/202511/shape_ribbon.svg);

  -webkit-mask-position: center center;

  -webkit-mask-size: cover;

  -webkit-mask-repeat: no-repeat;

  background: var(--color_01);

  content: "";

  transition: translate 1.2s;

}



.main_nav .nav_list > li:nth-of-type(odd) a::before {

  left: 0;

  translate: -100% 0;

}



.main_nav .nav_list > li:nth-of-type(even) a::before {

  right: 0;

  scale: -1 1;

  translate: 100% 0;

}



.nav_area.active .nav_list > li > a::before {

  translate: 0 0;

}



.main_nav .nav_list > li:nth-of-type(2) a::before {

  transition-delay: .3s;

}



.main_nav .nav_list > li:nth-of-type(3) a::before {

  transition-delay: .6s;

}





.nav_list > li > a p {

  font-size: calc(24 * (60rem / 390));

  font-weight: 700;

}



.nav_list > li > a p .txt_S {

  display: block;

  margin-top: calc(8 * (60rem / 390));

  font-size: calc(13 * (60rem / 390));

}

/*-----------------------main nav*/



/*SpecialCampaign----------------*/

.mainContent_area {

  position: relative;

  padding-bottom: calc(160 * (60rem / 390));

  background: var(--color_01);

}



.mainContent_area::before {

  position: absolute;

  bottom: 0;

  left: 0;

  width: 100%;

  height: calc(90 * (60rem / 390));

  margin-bottom: calc(40 * (60rem / 390));

  background: url(../../img/202511/maindeco/deco_line.png) center left / auto 100% repeat-x;

  content: "";

  animation: loop5 40s linear infinite;

}



@keyframes loop5 {

  0% {

    background-position: 0 0;

  }



  100% {

    background-position: calc(-1150 * (60rem / 390)) 0;

  }

}



.mainContent_area .each_sec {

  position: relative;

  z-index: 1;

  clear: both;

}



.mainContent_area .each_sec::before {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: calc(24 * (60rem / 390));

  background: url(../../img/202511/maindeco/cloth2.jpg) center center / cover no-repeat;

  content: "";

}



.mainContent_area .each_sec::after {

  position: absolute;

  z-index: 1;

  top: 0;

  left: 50%;

  translate: -50% 0;

  width: calc(170 * (60rem / 390));

  height: calc(170 * (60rem / 390));

  margin-top: calc(-25 * (60rem / 390));

  background: url(../../img/202511/maindeco/deco_ribbon_red.png) center center / cover no-repeat;

  content: "";

}



.mainContent_area .sec_inner {

  position: relative;

  z-index: 1;

  padding-top: calc(150 * (60rem / 390));

}



#SpecialCampaign {

  background: var(--color_01);

}



#SpecialCampaign .for_bg {

  position: absolute;

  z-index: -1;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  clip-path: inset(0);

}



#SpecialCampaign .for_bg .CampaignMotif {

  display: block;

  position: fixed;

  top: 0;

  width: calc(390 * (60rem / 390));

  height: 100lvh;

}



#SpecialCampaign .for_bg .CampaignMotif::before,

#SpecialCampaign .for_bg .CampaignMotif::after {

  position: absolute;

  top: 0;

  content: "";

  translate: 0 -50lvh;

  background: url(../../img/202511/maindeco/deco_ribbon_gold1.png?251119) center center / cover no-repeat;

}



@keyframes fall {

  0% {

    translate: 0 -50lvh;

  }



  100% {

   translate: 0 150lvh;

  }

}





@keyframes rotate2 {

  0% {

   rotate: 0deg;

  }



  100% {

    rotate: 360deg;

  }

}





#SpecialCampaign .for_bg .CampaignMotif:nth-of-type(1)::before {

  left: 0;

  width: calc(50 * (60rem / 390));

  height: calc(50 * (60rem / 390));

  animation: rotate2 16s linear infinite, fall 20s linear infinite;

}



#SpecialCampaign .for_bg .CampaignMotif:nth-of-type(1)::after {

  right: 5%;

  width: calc(40 * (60rem / 390));

  height: calc(40 * (60rem / 390));

  animation: rotate2 22s linear infinite, fall 10s 3s linear infinite;

}



#SpecialCampaign .for_bg .CampaignMotif:nth-of-type(2)::before {

  left: 5%;

  width: calc(70 * (60rem / 390));

  height: calc(70 * (60rem / 390));

  animation: rotate2 20s linear infinite, fall 15s 10s linear infinite;

}



#SpecialCampaign .for_bg .CampaignMotif:nth-of-type(2)::after {

  right: 10%;

  width: calc(30 * (60rem / 390));

  height: calc(30 * (60rem / 390));

  animation: rotate2 12s linear infinite, fall 20s 1s linear infinite;

}



#SpecialCampaign .for_bg .CampaignMotif:nth-of-type(3)::before {

  left: 30%;

  width: calc(40 * (60rem / 390));

  height: calc(40 * (60rem / 390));

  animation: rotate2 32s linear infinite, fall 10s 9s linear infinite;

}



#SpecialCampaign .for_bg .CampaignMotif:nth-of-type(3)::after {

  right: 40%;

  width: calc(60 * (60rem / 390));

  height: calc(60 * (60rem / 390));

  animation: rotate2 26s linear infinite, fall 15s 7s linear infinite;

}



#SpecialCampaign .for_bg .CampaignMotif:nth-of-type(4)::before {

  left: 25%;

  width: calc(50 * (60rem / 390));

  height: calc(50 * (60rem / 390));

  animation: rotate2 28s linear infinite, fall 10s 6s linear infinite;

}



#SpecialCampaign .for_bg .CampaignMotif:nth-of-type(4)::after {

  right: 10%;

  width: calc(70 * (60rem / 390));

  height: calc(70 * (60rem / 390));

  animation: rotate2 22s linear infinite, fall 20s 8s linear infinite;

}



#SpecialCampaign .for_bg .CampaignMotif:nth-of-type(5)::before {

  left: 15%;

  width: calc(40 * (60rem / 390));

  height: calc(40 * (60rem / 390));

  animation: rotate2 18s linear infinite, fall 15s 3s linear infinite;

}



#SpecialCampaign .for_bg .CampaignMotif:nth-of-type(5)::after {

  right: 5%;

  width: calc(60 * (60rem / 390));

  height: calc(60 * (60rem / 390));

  animation: rotate2 25s linear infinite, fall 10s 5s linear infinite;

}



#SpecialCampaign .for_bg .CampaignMotif:nth-of-type(6)::before {

  left: 20%;

  width: calc(30 * (60rem / 390));

  height: calc(30 * (60rem / 390));

  animation: rotate2 35s linear infinite, fall 20s 4s linear infinite;

}



#SpecialCampaign .for_bg .CampaignMotif:nth-of-type(6)::after {

  right: 0;

  width: calc(50 * (60rem / 390));

  height: calc(50 * (60rem / 390));

  animation: rotate2 24s linear infinite, fall 15s 2s linear infinite;

}



.mainContent_area .sec_ttl .txt_the {

  position: relative;

  display: block;

  width: calc(64 * (60rem / 390));

  margin: 0 auto calc(15 * (60rem / 390));

  border-radius: calc(5 * (60rem / 390));

  background: #fff;

  overflow: clip;

}



.mainContent_area .sec_ttl .txt_the img {

  opacity: 0;

}



.mainContent_area .sec_ttl .txt_the::before {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  mask-image: url(../../img/202511/shape_the.svg);

  mask-position: center center;

  mask-size: cover;

  mask-repeat: no-repeat;

  -webkit-mask-image: url(../../img/202511/shape_the.svg);

  -webkit-mask-position: center center;

  -webkit-mask-size: cover;

  -webkit-mask-repeat: no-repeat;

  background: var(--color_05);

  content: "";

}



.mainContent_area .sec_ttl_wrap.active .txt_the {

  animation: rotateZ2 15s infinite;

}



@keyframes rotateZ2 {

  0%, 5%, 60%, 100% {

    transform: rotateY(0);

  }



  10%, 55% {

    transform: rotateY(360deg)

  }

}



.mainContent_area .sec_ttl_wrap {

  position: relative;

}



.mainContent_area .sec_ttl_wrap::before,

.mainContent_area .sec_ttl_wrap::after,

.mainContent_area .sec_ttl_wrap > div::before,

.mainContent_area .sec_ttl_wrap > div::after,

.mainContent_area .sec_ttl_wrap .sec_ttl::before,

.mainContent_area .sec_ttl_wrap .sec_ttl::after {

  position: absolute;

  bottom: 100%;

  width: calc(180 * (60rem / 390));

  height: calc(180 * (60rem / 390));

  content: "";

  scale: 0;

  transition: scale .5s;

}





.mainContent_area .sec_ttl_wrap.active::before,

.mainContent_area .sec_ttl_wrap.active::after,

.mainContent_area .sec_ttl_wrap.active > div::before,

.mainContent_area .sec_ttl_wrap.active > div::after,

.mainContent_area .sec_ttl_wrap.active .sec_ttl::before,

.mainContent_area .sec_ttl_wrap.active .sec_ttl::after {

  scale: 1;

}



.mainContent_area .sec_ttl_wrap::before,

.mainContent_area .sec_ttl_wrap > div::before,

.mainContent_area .sec_ttl_wrap .sec_ttl::before {

  left: 0;

  margin-left: calc(-20 * (60rem / 390));

  margin-bottom: calc(-15 * (60rem / 390));

  rotate: -6deg;

}



.mainContent_area .sec_ttl_wrap::after,

.mainContent_area .sec_ttl_wrap > div::after,

.mainContent_area .sec_ttl_wrap .sec_ttl::after {

  right: 0;

  margin-right: calc(-20 * (60rem / 390));

  margin-bottom: calc(-30 * (60rem / 390));

  rotate: 6deg;

}



.mainContent_area .sec_ttl_wrap::before {

  background: url(../../img/202511/maindeco/inada2.png) center center / cover no-repeat;

}



.mainContent_area .sec_ttl_wrap.active::before {

  animation: stopmotion1 5s steps(1) infinite;

}



.mainContent_area .sec_ttl_wrap > div::before {

  background: url(../../img/202511/maindeco/inada3.png) center center / cover no-repeat;

  opacity: 0;

}



.mainContent_area .sec_ttl_wrap.active > div::before {

  animation: stopmotion2 5s steps(1) infinite;

}



.mainContent_area .sec_ttl_wrap .sec_ttl::before {

  background: url(../../img/202511/maindeco/inada4.png) center center / cover no-repeat;

  opacity: 0;

}



.mainContent_area .sec_ttl_wrap.active .sec_ttl::before {

  animation: stopmotion3 5s steps(1) infinite;

}



.mainContent_area .sec_ttl_wrap::after {

  background: url(../../img/202511/maindeco/kawai1.png) center center / cover no-repeat;

}



.mainContent_area .sec_ttl_wrap.active::after {

  animation: stopmotion1 5s steps(1) infinite;

}



.mainContent_area .sec_ttl_wrap > div::after {

  background: url(../../img/202511/maindeco/kawai2.png) center center / cover no-repeat;

  opacity: 0;

}



.mainContent_area .sec_ttl_wrap.active > div::after {

  animation: stopmotion2 5s steps(1) infinite;

}



.mainContent_area .sec_ttl_wrap .sec_ttl::after {

  background: url(../../img/202511/maindeco/kawai3.png) center center / cover no-repeat;

  opacity: 0;

}



.mainContent_area .sec_ttl_wrap.active .sec_ttl::after {

  animation: stopmotion3 5s steps(1) infinite;

}



@keyframes stopmotion1 {

  0% {

    opacity: 1;

  }



  33%, 100% {

    opacity: 0;

  }

}



@keyframes stopmotion2 {

  0%, 33%, 66%, 100% {

    opacity: 0;

  }



  33% {

    opacity: 1;

  }

}



@keyframes stopmotion3 {

  0%, 66%, 100% {

    opacity: 0;

  }



  66% {

    opacity: 1;

  }

}



.mainContent_area .sec_ttl {

  font-size: calc(30 * (60rem / 390));

  text-align: center;

  perspective: calc(10000 * (60rem / 390));

  color: var(--color_06);

}



.mainContent_area .sec_ttl .txt_S {

  display: block;

  margin-top: calc(10 * (60rem / 390));

  font-size: calc(13 * (60rem / 390));

}



.index_outside {

  position: relative;

  width: calc(350 * (60rem / 390));

  margin: calc(30 * (60rem / 390)) auto calc(70 * (60rem / 390));

  padding-bottom: calc(3 * (60rem / 390));

  border-top: solid var(--color_04) calc(2 * (60rem / 390));

  border-radius: calc(4 * (60rem / 390));

  overflow: hidden;

}



.index_outside::before {

  position: absolute;

  top: 0;

  left: 50%;

  translate: -50% 0;

  width: 100%;

  height: calc(20 * (60rem / 390));

  border-radius: calc(2 * (60rem / 390)) calc(2 * (60rem / 390)) calc(3 * (60rem / 390)) calc(3 * (60rem / 390));

  background: var(--color_04);

  content: "";

}



.index_outside::after {

  position: absolute;

  top: 0;

  left: 50%;

  translate: -50% 0;

  width: calc(348 * (60rem / 390));

  height: calc(5 * (60rem / 390));

  margin-top: calc(14 * (60rem / 390));

  border-radius: 0 0 calc(3 * (60rem / 390)) calc(3 * (60rem / 390));

  background: #fff;

  content: "";

}



.index_wrap {

  position: relative;

  z-index: 1;

  width: calc(340 * (60rem / 390));

  height: calc(176 * (60rem / 390));

  margin: 0 auto;

  padding: calc(15 * (60rem / 390)) calc(18 * (60rem / 390));

  translate: 0 -100%;

  transition: translate 1s;

}



.index_outside.active .index_wrap {

  translate: unset;

}



.index_wrap::before {

  position: absolute;

  z-index: -1;

  top: 50%;

  left: 50%;

  translate: -50% -50%;

  width: 100%;

  height: 100%;

  mask-image: url(../../img/202511/shape_index.svg);

  mask-position: center center;

  mask-size: cover;

  mask-repeat: no-repeat;

  -webkit-mask-image: url(../../img/202511/shape_index.svg);

  -webkit-mask-position: center center;

  -webkit-mask-size: cover;

  -webkit-mask-repeat: no-repeat;

  background: var(--color_03);

  content: "";

}



.index_wrap::after {

  position: absolute;

  z-index: -1;

  top: 50%;

  left: 50%;

  translate: -50% -50%;

  width: calc(341 * (60rem / 390));

  height: calc(177 * (60rem / 390));

  mask-image: url(../../img/202511/shape_indexFrame.svg);

  mask-position: center center;

  mask-size: cover;

  mask-repeat: no-repeat;

  -webkit-mask-image: url(../../img/202511/shape_indexFrame.svg);

  -webkit-mask-position: center center;

  -webkit-mask-size: cover;

  -webkit-mask-repeat: no-repeat;

  background: var(--color_04);

  content: "";

}



.index_wrap dt {

  margin-bottom: calc(5 * (60rem / 390));

  padding-bottom: calc(6 * (60rem / 390));

  border-bottom: solid var(--color_04) calc(1 * (60rem / 390));

  font-family: var(--font_eng);

  font-size: calc(18 * (60rem / 390));

  font-weight: 700;

  color: var(--color_04);

}



.index_list li a {

  position: relative;

  display: flex;

  align-items: center;

  height: calc(40 * (60rem / 390));

  font-size: calc(15 * (60rem / 390));

  font-weight: 700;

}



.index_list li:nth-of-type(n+2) a::before {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: calc(1 * (60rem / 390));

  background: var(--color_04);

  opacity: .3;

  content: "";

}



.index_list li a p {

  position: relative;

  width: 100%;

  color: var(--color_04);

}



.index_list li a p sup {

  font-size: calc(10 * (60rem / 390));

  font-weight: 400;

  letter-spacing: 0;

}



.index_list li a p::before {

  position: absolute;

  top: 50%;

  right: 0;

  translate: 0 -50%;

  width: calc(16 * (60rem / 390));

  height: calc(16 * (60rem / 390));

  border-radius: 50%;

  background: var(--color_04);

  content: "";

}



.index_list li a p::after {

  position: absolute;

  top: 50%;

  right: 0;

  translate: 0 -50%;

  mask-image: url(../../img/202511/shape_arrow2.svg);

  mask-position: center center;

  mask-size: cover;

  mask-repeat: no-repeat;

  -webkit-mask-image: url(../../img/202511/shape_arrow2.svg);

  -webkit-mask-position: center center;

  -webkit-mask-size: cover;

  -webkit-mask-repeat: no-repeat;

  width: calc(10 * (60rem / 390));

  height: calc(7 * (60rem / 390));

  margin-right: calc(3 * (60rem / 390));

  background: #fff;

  content: "";

}



.index_list li a .index_num {

  margin-right: calc(10 * (60rem / 390));

  font-family: var(--font_eng);

  font-size: calc(18 * (60rem / 390));

  letter-spacing: 0;

  color: var(--color_05);

  vertical-align: -.1em;

}



.each_campaign {

  padding-bottom: calc(100 * (60rem / 390));

  border-top: solid var(--color_05) calc(2 * (60rem / 390));

}



.campaign_num {

  display: grid;

  place-items: center;

  width: calc(70 * (60rem / 390));

  height: calc(40 * (60rem / 390));

  margin: 0 0 calc(15 * (60rem / 390)) calc(15 * (60rem / 390));

  border-radius: 0 0 calc(5 * (60rem / 390)) calc(5 * (60rem / 390));

  background: var(--color_05);

  font-family: var(--font_eng);

  font-size: calc(25 * (60rem / 390));

  font-weight: 500;

  letter-spacing: 0;

  color: #fff;

}



.campaign_ttl {

  position: relative;

  z-index: 1;

  display: grid;

  place-items: center;

  width: calc(340 * (60rem / 390));

  height: calc(106 * (60rem / 390));

  margin: 0 auto calc(20 * (60rem / 390));

  color: var(--color_04);

}



.campaign_ttl::before {

  position: absolute;

  z-index: -1;

  top: 50%;

  left: 50%;

  translate: -50% -50%;

  width: 100%;

  height: 100%;

  mask-image: url(../../img/202511/shape_paper.svg);

  mask-position: center center;

  mask-size: cover;

  mask-repeat: no-repeat;

  -webkit-mask-image: url(../../img/202511/shape_paper.svg);

  -webkit-mask-position: center center;

  -webkit-mask-size: cover;

  -webkit-mask-repeat: no-repeat;

  background: var(--color_03);

  content: "";

}



.campaign_ttl::after {

  position: absolute;

  z-index: -1;

  top: 50%;

  left: 50%;

  translate: -50% -50%;

  width: calc(341 * (60rem / 390));

  height: calc(107 * (60rem / 390));

  mask-image: url(../../img/202511/shape_paperFrame.svg);

  mask-position: center center;

  mask-size: cover;

  mask-repeat: no-repeat;

  -webkit-mask-image: url(../../img/202511/shape_paperFrame.svg);

  -webkit-mask-position: center center;

  -webkit-mask-size: cover;

  -webkit-mask-repeat: no-repeat;

  background: var(--color_04);

  content: "";

}



.campaign_ttl span {

  font-size: calc(26 * (60rem / 390));

  font-weight: 700;

  line-height: 1.4;

  text-align: center;

}



.campaign_lead {

  font-size: calc(15 * (60rem / 390));

  font-weight: 700;

  line-height: 1.75;

  text-align: center;

  color: var(--color_06);

}



.kit_list_wrap {

  margin-top: calc(30 * (60rem / 390));

}



.kit_list {

  margin-bottom: calc(30 * (60rem / 390)) !important;

}



.kit_list .slick-track {

  display: flex;

}



.kit_list .slick-arrow {

  z-index: 2;

  top: 0;

  width: calc(30 * (60rem / 390));

  height: calc(30 * (60rem / 390));

  margin-top: calc(180 * (60rem / 390));

  border-radius: 50%;

  background: #fff;

  border: solid var(--color_regular) calc(1 * (60rem / 390));

}



.kit_list .slick-next {

  right: 0;

  margin-right: calc(8 * (60rem / 390));

}



.kit_list .slick-prev {

  left: 0;

  margin-left: calc(8 * (60rem / 390));

}



.kit_list .slick-arrow::before {

  position: absolute;

  top: 50%;

  left: 50%;

  translate: -50% -50%;

  width: 100%;

  height: 100%;

  background: url(../../img/202511/shape_arrow1.svg) center center / cover no-repeat;

  transform: unset;

  opacity: 1;

  content: "";

}



.kit_list .slick-next::before {

  scale: -1 1;

}



.kit_list .slick-dots {

  bottom: auto;

  top: 0;

  left: 0;

  display: flex;

  gap: calc(5 * (60rem / 390));

  width: fit-content;

  margin: calc(322 * (60rem / 390)) 0 0 calc(33 * (60rem / 390));

}



.kit_list .slick-dots li {

  display: block;

  width: calc(10 * (60rem / 390));

  height: calc(10 * (60rem / 390));

  margin: 0;

  border: solid var(--color_regular) calc(1 * (60rem / 390));

  background: #fff;

}



.kit_list .slick-dots li.slick-active {

  border-color: var(--color_05);

  background: var(--color_05);

}



.kit_list .slick-dots li button {

  width: 100%;

  height: 100%;

  padding: 0;

}



.kit_list .slick-dots li button:before {

  display: none;

}



.each_kit {

  position: relative;

  width: calc(340 * (60rem / 390));

  height: auto;

  margin: 0 calc(5 * (60rem / 390));

  border: solid var(--color_regular) calc(1 * (60rem / 390));

  border-radius: calc(20 * (60rem / 390));

  overflow: clip;

}



.each_kit .icon_wrap {

  position: absolute;

  display: flex;

  gap: calc(6 * (60rem / 390));

  top: 0;

  left: 0;

  margin: calc(12 * (60rem / 390)) 0 0 calc(12 * (60rem / 390));

}



.each_kit .icon_wrap {

  position: absolute;

  display: flex;

  gap: calc(6 * (60rem / 390));

  top: 0;

  left: 0;

  margin: calc(12 * (60rem / 390)) 0 0 calc(12 * (60rem / 390));

}



.each_kit .icon_wrap .each_icon {

  position: relative;

  border-radius: 50%;

  background: #fff;

  overflow: clip;

}



.each_kit .icon_wrap .each_icon span {

  position: relative;

  display: block;

  width: calc(60 * (60rem / 390));

  border-radius: 50%;

  border: solid #fff calc(1 * (60rem / 390));

  background: var(--color_regular);

}



.each_kit .icon_wrap .each_icon.notAvailable span {

  opacity: .2;

}



.each_kit .icon_wrap .each_icon span::before {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  mask-position: center center;

  mask-size: cover;

  mask-repeat: no-repeat;

  -webkit-mask-position: center center;

  -webkit-mask-size: cover;

  -webkit-mask-repeat: no-repeat;

  background: #fff;

  content: "";

}



.each_kit .icon_wrap .each_icon.icon_webstore span::before {

  mask-image: url(../../img/202511/icon_webstore.svg);

  -webkit-mask-image: url(../../img/202511/icon_webstore.svg);

}



.each_kit .icon_wrap .each_icon.icon_shop span::before {

  mask-image: url(../../img/202511/icon_shop.svg);

  -webkit-mask-image: url(../../img/202511/icon_shop.svg);

}



.each_kit .kit_img {

  height: calc(338 * (60rem / 390));

  overflow: hidden;

  background: #fff;

}



.each_kit .txt_wrap {

  height: 100%;

  border-top: solid var(--color_regular) calc(1 * (60rem / 390));

  padding: calc(15 * (60rem / 390)) calc(15 * (60rem / 390)) calc(25 * (60rem / 390));

  background: #fff;

}



.each_kit .kit_name {

  margin-bottom: calc(10 * (60rem / 390));

  font-weight: 700;

  font-size: calc(15 * (60rem / 390));

  line-height: 1.5;

}



.each_kit .kit_name .kit_brand {

  display: block;

  margin-bottom: calc(6 * (60rem / 390));

  font-weight: 600;

  font-size: calc(13 * (60rem / 390));

}



.each_kit .kit_price {

  font-size: calc(15 * (60rem / 390));

  font-weight: 600;

}



.each_kit .kit_price .txt_S {

  margin-left: calc(3 * (60rem / 390));

  font-size: calc(10 * (60rem / 390));

  font-weight: 500;

}



.each_kit .kit_caption {

  margin-top: calc(15 * (60rem / 390));

  padding-top: calc(12 * (60rem / 390));

  border-top: dashed var(--color_regular) calc(1 * (60rem / 390));

  font-size: calc(13 * (60rem / 390));

  line-height: 1.5;

}



.each_kit .kit_caption .notes {

  display: block;

  margin-top: calc(8 * (60rem / 390));

  font-size: calc(10 * (60rem / 390));

  line-height: 1.3;

}



.product_list {

  margin: calc(30 * (60rem / 390)) 0;

}



.product_list .each_product {

  position: relative;

  z-index: 1;

  width: calc(180 * (60rem / 390));

  height: calc(230 * (60rem / 390));

  margin: 0 calc(15 * (60rem / 390));

  padding: calc(55 * (60rem / 390)) 0 calc(10 * (60rem / 390));

}



.product_list .each_product::before,

.product_list .each_product::after,

.product_list .each_product > div::before {

  position: absolute;

  z-index: -1;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  mask-position: center center;

  mask-size: cover;

  mask-repeat: no-repeat;

  -webkit-mask-position: center center;

  -webkit-mask-size: cover;

  -webkit-mask-repeat: no-repeat;

  content: "";

}



.product_list .each_product::before {

  mask-image: url(../../img/202511/shape_bag.svg);

  -webkit-mask-image: url(../../img/202511/shape_bag.svg);

  background: #fff;

}



.product_list .each_product::after {

  mask-image: url(../../img/202511/shape_bagFrame.svg);

  -webkit-mask-image: url(../../img/202511/shape_bagFrame.svg);

  background: var(--color_04);

}



.product_list .each_product > div::before {

  mask-image: url(../../img/202511/shape_bagHandle.svg);

  -webkit-mask-image: url(../../img/202511/shape_bagHandle.svg);

  background: var(--color_regular);

}



.product_discount {

  position: absolute;

  z-index: 2;

  top: 0;

  left: 0;

  width: calc(77 * (60rem / 390));

  height: calc(77 * (60rem / 390));

  margin: calc(25 * (60rem / 390)) 0 0 calc(-18 * (60rem / 390));

}



.product_discount::before,

.product_discount::after {

  position: absolute;

  z-index: -1;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  mask-position: center center;

  mask-size: cover;

  mask-repeat: no-repeat;

  -webkit-mask-position: center center;

  -webkit-mask-size: cover;

  -webkit-mask-repeat: no-repeat;

  content: "";

}



.product_discount::before {

  mask-image: url(../../img/202511/shape_zigzag.svg);

  -webkit-mask-image: url(../../img/202511/shape_zigzag.svg);

  background: #EADA79;

}



.product_discount::after {

  mask-image: url(../../img/202511/shape_zigzagFrame.svg);

  -webkit-mask-image: url(../../img/202511/shape_zigzagFrame.svg);

  background: var(--color_04);

}



.product_img {

  position: relative;

  z-index: 1;

  width: calc(120 * (60rem / 390));

  margin: 0 auto;

}



.product_price {

  font-size: calc(24 * (60rem / 390));

  font-weight: 600;

  letter-spacing: 0;

  text-align: center;

  color: var(--color_05);

}



.product_price .txt_S {

  position: relative;

  margin-right: calc(16 * (60rem / 390));

  font-size: calc(15 * (60rem / 390));

  letter-spacing: 0;

  color: var(--color_04);

}



.product_price .txt_S::before {

  position: absolute;

  top: 50%;

  left: 50%;

  translate: -50% -50%;

  width: calc(100% + calc(4 * (60rem / 390)));

  height: calc(1 * (60rem / 390));

  background: var(--color_05);

  content: "";

}



.product_price .txt_S::after {

  position: absolute;

  top: 50%;

  left: 100%;

  translate: 0 -50%;

  margin-left: calc(6 * (60rem / 390));

  border-left: solid var(--color_05) calc(5 * (60rem / 390));

  border-top: solid transparent calc(5 * (60rem / 390));

  border-bottom: solid transparent calc(5 * (60rem / 390));

  content: "";

}



.product_price .txt_M {

  font-size: calc(17 * (60rem / 390));

  letter-spacing: 0;

}



.mashBrand_list_wrap {

  margin-top: calc(40 * (60rem / 390));

}



.mashBrand_list_wrap dt {

  position: relative;

  height: calc(40 * (60rem / 390));

  background: var(--color_04);

}



.mashBrand_list_wrap dt::before {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background: url(../../img/202511/txt_mashGroup.svg) center left / auto 100% repeat-x;

  content: "";

  animation: loop2 10s linear infinite;

}



@keyframes loop2 {

  0% {

    background-position: 0 0;

  }

  100% {

      background-position: calc(-295 * (60rem / 390)) 0;

  }

}



.mashBrand_list_wrap dt img {

  opacity: 0;

  height: 100%;

}



.mashBrand_list {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: calc(3 * (60rem / 390));

}



.mashBrand_list li {

  background: #fff;

}



.mashBrand_list_wrap dd > p {

  margin-top: calc(12 * (60rem / 390));

  font-size: calc(13 * (60rem / 390));

  font-weight: 700;

  text-align: center;

  color: var(--color_06);

}



.link_mashPoint {

  margin-top: calc(25 * (60rem / 390));

}



.brand_list_outside {

  position: relative;

  margin-top: calc(60 * (60rem / 390));

  padding-bottom: calc(80 * (60rem / 390));

}



.brand_list_outside > p {

  position: relative;

  height: calc(40 * (60rem / 390));

}



.brand_list_outside > p img {

  opacity: 0;

}



.brand_list_outside > p::before,

.brand_list_outside > p::after,

.brand_list_outside::before,

.brand_list_outside::after {

  position: absolute;

  bottom: 0;

  left: 0;

  width: 100%;

  height: calc(40 * (60rem / 390));

  content: "";

}



.brand_list_outside > p::before,

.brand_list_outside::before {

  background: var(--color_06);

  opacity: .8;

}



.brand_list_outside > p::after,

.brand_list_outside::after {

  background: url(../../img/202511/txt_pointup2.svg) center left / auto 100% repeat-x;

}



.brand_list_outside > p::after {

  animation: loop4 15s linear infinite;

}



.brand_list_outside::after {

  animation: loop4 15s linear infinite reverse;

}



@keyframes loop4 {

  0% {

    background-position: 0 0;

  }

  100% {

    background-position: calc(-470 * (60rem / 390)) 0;

  }

}



.brand_list_wrap {

  margin-top: calc(45 * (60rem / 390));

}



.brand_list_wrap dt {

  width: fit-content;

  margin: 0 auto calc(25 * (60rem / 390));

  padding: calc(8 * (60rem / 390)) calc(20 * (60rem / 390));

  border-radius: calc(3 * (60rem / 390));

  background: var(--color_04);

  font-size: calc(20 * (60rem / 390));

  font-weight: 700;

  text-align: center;

  color: var(--color_06);

}



.brand_list_wrap dd > p {

  position: relative;

  width: fit-content;

  margin: 0 auto calc(20 * (60rem / 390));

  padding: 0 calc(10 * (60rem / 390));

  font-size: calc(16 * (60rem / 390));

  font-weight: 600;

}



.brand_list_wrap dd > p::before,

.brand_list_wrap dd > p::after {

  position: absolute;

  bottom: 0;

  width: calc(1.5 * (60rem / 390));

  height: calc(14 * (60rem / 390));

  margin-bottom: calc(2 * (60rem / 390));

  border-radius: calc(10 * (60rem / 390));

  transform-origin: bottom center;

  background: var(--color_regular);

  content: "";

}



.brand_list_wrap dd > p::before {

  left: 0;

  rotate: -30deg;

}



.brand_list_wrap dd > p::after {

  right: 0;

  rotate: 30deg;

}



.accordion_wrap {

  display: grid;

  grid-template-rows: 0fr;

  transition: grid-template-rows 1s;

}



.open .accordion_wrap {

  grid-template-rows: 1fr;

}



.accordion_inner {

  overflow: hidden;

}



.brand_list_wrap .accordion_inner {

  position: relative;

  min-height: calc(290 * (60rem / 390));

  overflow: hidden;

  mask-image: linear-gradient(#000 50%, transparent);

  -webkit-mask-image: linear-gradient(#000 50%, transparent);

}



.brand_list_wrap .open .accordion_inner {

  mask-image: unset;

  -webkit-mask-image: unset;

}



.accordion_btn {

  position: relative;

  width: fit-content;

  padding-right: calc(20 * (60rem / 390));

  text-decoration: underline;

  text-decoration-skip-ink: none;

  cursor: pointer;

}



.brand_list_wrap .accordion_btn {

  margin: calc(10 * (60rem / 390)) auto 0;

  font-size: calc(15 * (60rem / 390));

  font-weight: 600;

  color: var(--color_06);

}



.accordion_btn::before,

.accordion_btn::after {

  position: absolute;

  top: 50%;

  right: 0;

  translate: 0 -50%;

  width: calc(12 * (60rem / 390));

  height: calc(2 * (60rem / 390));

  background: var(--color_06);

  content: "";

}



.accordion_btn::after {

  rotate: 90deg;

  transition: rotate .3s;

}



.open .accordion_btn::after {

  rotate: 0deg;

}



.accordion_btn .to_open,

.open .accordion_btn .to_close {

  display: block;

}



.open .accordion_btn .to_open,

.accordion_btn .to_close {

  display: none;

}



.brand_list_wrap dd .brand_list {

  display: grid;

  grid-template-columns: repeat(4, 1fr);

  gap: calc(2 * (60rem / 390));

  padding: 0 calc(15 * (60rem / 390));

}



.brand_list_wrap dd .brand_list li a {

  display: flex;

  justify-content: center;

  height: calc(50 * (60rem / 390));

  background: var(--color_06);

}



.brand_list_wrap dd .brand_list li a img {

  width: auto;

  height: 100%;

}



.notes_list {

  margin-top: calc(40 * (60rem / 390));

  padding: 0 calc(15 * (60rem / 390));

}



.notes_list li {

  font-size: calc(10 * (60rem / 390));

  font-weight: 400;

  line-height: 1.5;

  text-indent: -2em;

  padding-left: 2em;

  color: var(--color_06);

}



.notes_list li:nth-of-type(n+2) {

  margin-top: calc(8 * (60rem / 390));

}



/*----------------SpecialCampaign*/





/*FeaturedContents----------------*/

#FeaturedContents {

  background: var(--color_01);

}



#FeaturedContents .sec_inner {

  padding-bottom: calc(20 * (60rem / 390));

}



#FeaturedContents .sec_inner::after {

  position: absolute;

  z-index: -1;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  margin-top: calc(24 * (60rem / 390));

  background: url(../../img/202511/maindeco/bg_ribbon1.png) center center / 100% auto repeat-y;

  opacity: .08;

  content: "";

}



.content_list {

  margin-top: calc(30 * (60rem / 390));

}



.content_list li {

  opacity: 0;

  translate: 0 calc(10 * (60rem / 390));

  transition: opacity .8s, translate .8s;

}



.content_list li.active {

  opacity: 1;

  translate: unset;

}



.content_list li:nth-of-type(n+2) {

  margin-top: calc(50 * (60rem / 390));

}



.content_img {

  border: solid var(--color_regular) calc(1 * (60rem / 390));

}



.content_ttl_wrap {

  position: relative;

  background: var(--color_03);

}



.content_ttl {

  position: relative;

  display: grid !important;

  place-items: center;

  height: calc(25 * (60rem / 390));

  padding: 0 calc(40 * (60rem / 390));

  font-size: calc(15 * (60rem / 390));

  font-weight: 700;

  color: var(--color_05);

}



.content_ttl::before {

  position: absolute;

  top: 50%;

  right: 0;

  translate: 0 -50%;

  width: calc(30 * (60rem / 390));

  height: calc(30 * (60rem / 390));

  margin-right: calc(-15 * (60rem / 390));

  background: url(../../img/202511/maindeco/deco_ribbon_gold1.png?251119) center center / cover no-repeat;

  content: "";

}



.content_lead {

  margin-top: calc(10 * (60rem / 390));

  padding: 0 calc(15 * (60rem / 390));

  font-size: calc(14 * (60rem / 390));

  line-height: 1.75;

  letter-spacing: .1em;

  font-feature-settings: "palt";

}



#FeaturedContents .comingsoon_sign {

  position: relative;

  width: calc(190 * (60rem / 390));

  margin: calc(30 * (60rem / 390)) auto 0;

}



#FeaturedContents .comingsoon_sign::before {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background: url(../../img/202511/maindeco/txt_comingsoon.svg) center center / cover no-repeat;

  content: "";

  animation: rotate3 25s linear infinite;

}



#FeaturedContents .comingsoon_sign::after {

  position: absolute;

  top: 50%;

  left: 50%;

  translate: -50% -50%;

  width: calc(140 * (60rem / 390));

  height: calc(140 * (60rem / 390));

  background: url(../../img/202511/maindeco/inada6.png) center center / cover no-repeat;

  content: "";

  content: "";

  animation: rotate3 30s linear infinite reverse;

}



@keyframes rotate3 {

  0% {

    rotate: 0deg;

  }



  100% {

    rotate: 360deg;

  }

}



#FeaturedContents .comingsoon_sign img {

  opacity: 0;

}



#FeaturedContents .txt_comingsoon {

  margin-top: calc(20 * (60rem / 390));

  font-size: calc(15 * (60rem / 390));

  font-weight: 700;

  line-height: 1.5;

  text-align: center;

  color: var(--color_03);

}

/*----------------FeaturedContents*/





/*EventCalender-------------------*/

#EventCalender {

  background: var(--color_02);

}



#EventCalender .sec_inner {

  padding-bottom: calc(50 * (60rem / 390));

}



#EventCalender .sec_inner::before {

  position: absolute;

  z-index: -1;

  bottom: 0;

  left: 0;

  width: 100%;

  height: calc(60 * (60rem / 390));

  background: var(--color_03);

  content: "";

}



#EventCalender .sec_ttl {

  margin-bottom: calc(40 * (60rem / 390));

  font-size: calc(28 * (60rem / 390));

}



.category_list_wrap {

  margin-bottom: calc(25 * (60rem / 390));

  padding: 0 calc(15 * (60rem / 390));

}



.category_list_wrap > p {

  padding: calc(7 * (60rem / 390)) 0;

  background: var(--color_regular);

  font-size: calc(13 * (60rem / 390));

  font-weight: 700;

  text-align: center;

  color: var(--color_06);

}



.category_list {

  display: grid;

  grid-template-columns: repeat(2, 1fr);

  /*grid-template-rows: repeat(4, 1fr);*/

  background: var(--color_06);

}



/*

.category_list li:nth-of-type(1) { grid-area: 1 / 1 / 2 / 3; }

.category_list li:nth-of-type(2) { grid-area: 2 / 1 / 3 / 2; }

.category_list li:nth-of-type(3) { grid-area: 2 / 2 / 3 / 3; }

.category_list li:nth-of-type(4) { grid-area: 3 / 1 / 4 / 2; }

.category_list li:nth-of-type(5) { grid-area: 3 / 2 / 4 / 3; }

.category_list li:nth-of-type(6) { grid-area: 4 / 1 / 5 / 2; }

.category_list li:nth-of-type(7) { grid-area: 4 / 2 / 5 / 3; }

*/



.category_list li:nth-of-type(even) {

  border-left: dashed var(--color_regular) calc(1 * (60rem / 390));

}



.category_list li:nth-of-type(n+3) {

  border-top: dashed var(--color_regular) calc(1 * (60rem / 390));

}



.category_list li label {

  position: relative;

  display: flex;

  align-items: center;

  height: calc(40 * (60rem / 390));

  padding-left: calc(25 * (60rem / 390));

  font-size: calc(12 * (60rem / 390));

  font-weight: 700;

  cursor: pointer;

}



/*

.category_list li:nth-of-type(1) label {

  justify-content: center;

  padding-left: 0;

}

*/



.category_list li.category_all label {

  color: var(--color_cat_all);

}



.category_list li.category_present label {

  color: var(--color_cat_present);

}



.category_list li.category_coupon label {

  color: var(--color_cat_coupon);

}



.category_list li.category_secret label {

  color: var(--color_cat_secret);

}



.category_list li.category_instalive label {

  color: var(--color_cat_instalive);

}



.category_list li.category_youtube label {

  color: var(--color_cat_youtube);

}



.category_list li.category_sns label {

  color: var(--color_cat_sns);

}



.category_list li.category_makeup label {

  color: var(--color_cat_makeup);

}



.category_list li.category_all input:checked + label {

  pointer-events: none;

}



.category_list li label p {

  position: relative;

  padding-left: calc(34 * (60rem / 390));

  line-height: 1.2;

  opacity: .2;

  transition: opacity .3s;

}



.category_list li input:checked + label p {

  opacity: 1;

}



.category_list li label p::before {

  position: absolute;

  top: 50%;

  left: 0;

  translate: 0 -50%;

  width: calc(34 * (60rem / 390));

  height: calc(34 * (60rem / 390));

  mask-position: center center;

  mask-size: cover;

  mask-repeat: no-repeat;

  -webkit-mask-position: center center;

  -webkit-mask-size: cover;

  -webkit-mask-repeat: no-repeat;

  content: "";

}



.category_list li.category_all label p::before {

  mask-image: url(../../img/202511/calendar/icon_all.svg);

  -webkit-mask-image: url(../../img/202511/calendar/icon_all.svg);

  background: var(--color_cat_all);

}



.category_list li.category_present label p::before {

  mask-image: url(../../img/202511/calendar/icon_present.svg);

  -webkit-mask-image: url(../../img/202511/calendar/icon_present.svg);

  background: var(--color_cat_present);

}



.category_list li.category_coupon label p::before {

  mask-image: url(../../img/202511/calendar/icon_coupon.svg);

  -webkit-mask-image: url(../../img/202511/calendar/icon_coupon.svg);

  background: var(--color_cat_coupon);

}



.category_list li.category_secret label p::before {

  mask-image: url(../../img/202511/calendar/icon_secret.svg);

  -webkit-mask-image: url(../../img/202511/calendar/icon_secret.svg);

  background: var(--color_cat_secret);

}



.category_list li.category_instalive label p::before {

  mask-image: url(../../img/202511/calendar/icon_instalive.svg);

  -webkit-mask-image: url(../../img/202511/calendar/icon_instalive.svg);

  background: var(--color_cat_instalive);

}



.category_list li.category_youtube label p::before {

  mask-image: url(../../img/202511/calendar/icon_youtube.svg);

  -webkit-mask-image: url(../../img/202511/calendar/icon_youtube.svg);

  background: var(--color_cat_youtube);

}



.category_list li.category_sns label p::before {

  mask-image: url(../../img/202511/calendar/icon_sns.svg);

  -webkit-mask-image: url(../../img/202511/calendar/icon_sns.svg);

  background: var(--color_cat_sns);

}



.category_list li.category_makeup label p::before {

  mask-image: url(../../img/202511/calendar/icon_makeup.svg);

  -webkit-mask-image: url(../../img/202511/calendar/icon_makeup.svg);

  background: var(--color_cat_makeup);

}





.category_list li label p::after {

  position: absolute;

  top: 50%;

  right: 100%;

  translate: 0 -50%;

  width: calc(12 * (60rem / 390));

  height: calc(12 * (60rem / 390));

  margin-right: calc(2 * (60rem / 390));

  border-radius: calc(2 * (60rem / 390));

  border: solid calc(2 * (60rem / 390));

  overflow: clip;

  box-sizing: border-box;

  mask-image: url(../../img/202511/calendar/icon_check.svg);

  mask-position: center center;

  mask-size: cover;

  mask-repeat: no-repeat;

  -webkit-mask-image: url(../../img/202511/calendar/icon_check.svg);

  -webkit-mask-position: center center;

  -webkit-mask-size: cover;

  -webkit-mask-repeat: no-repeat;

  content: "";

  transition: background-color .3s;

}



.category_list li.category_all label p::after {

  border-color: var(--color_cat_all);

}



.category_list li.category_present label p::after {

  border-color: var(--color_cat_present);

}



.category_list li.category_coupon label p::after {

  border-color: var(--color_cat_coupon);

}



.category_list li.category_secret label p::after {

  border-color: var(--color_cat_secret);

}



.category_list li.category_instalive label p::after {

  border-color: var(--color_cat_instalive);

}



.category_list li.category_youtube label p::after {

  border-color: var(--color_cat_youtube);

}



.category_list li.category_sns label p::after {

  border-color: var(--color_cat_sns);

}



.category_list li.category_makeup label p::after {

  border-color: var(--color_cat_makeup);

}



.category_list li.category_all input:checked + label p::after {

  background: var(--color_cat_all);

}



.category_list li.category_present input:checked + label p::after {

  background: var(--color_cat_present);

}



.category_list li.category_coupon input:checked + label p::after {

  background: var(--color_cat_coupon);

}



.category_list li.category_secret input:checked + label p::after {

  background: var(--color_cat_secret);

}



.category_list li.category_instalive input:checked + label p::after {

  background: var(--color_cat_instalive);

}



.category_list li.category_youtube input:checked + label p::after {

  background: var(--color_cat_youtube);

}



.category_list li.category_sns input:checked + label p::after {

  background: var(--color_cat_sns);

}



.category_list li.category_makeup input:checked + label p::after {

  background: var(--color_cat_makeup);

}



.sort_list {

  display: flex;

  width: fit-content;

  margin: 0 auto calc(40 * (60rem / 390));

  padding: calc(5 * (60rem / 390)) calc(6 * (60rem / 390));

  border-radius: calc(100 * (60rem / 390));

  background: var(--color_03);

}



.sort_list li label {

  display: grid;

  place-items: center;

  width: calc(150 * (60rem / 390));

  height: calc(40 * (60rem / 390));

  border-radius: calc(100 * (60rem / 390));

  font-size: calc(13 * (60rem / 390));

  font-weight: 700;

  line-height: 1.2;

  text-align: center;

  color: var(--color_04);

  cursor: pointer;

  transition: background-color .3s, color .3s;

}



.sort_list li input:checked + label {

  background: var(--color_05);

  color: var(--color_06);

  pointer-events: none;

}



.sort_result {

  display: none;

}



.sort_result:has(input[name="sortResult"]:checked) {

  display: block;

}



.date_list {

  display: grid;

  grid-template-columns: repeat(8, 1fr);

  gap: calc(2 * (60rem / 390));

}



.date_list li {

  height: calc(50 * (60rem / 390));

  transition: opacity .3s, height .3s, translate .3s;

}



.date_list li.notAvailable {

  height: calc(44 * (60rem / 390));

  translate: 0 calc(6 * (60rem / 390));

  opacity: .5;

  pointer-events: none;

}



.date_list li label {

  display: grid;

  place-items: center;

  height: 100%;

  border-radius: calc(15 * (60rem / 390)) calc(15 * (60rem / 390)) 0 0;

  background: var(--color_03);

  color: var(--color_04);

  transition: background-color .3s, color .3s;

  cursor: pointer;

}



.date_list li input:checked + label {

  background: var(--color_05);

  color: var(--color_06);

  pointer-events: none;

}



.date_list li label p {

  font-size: calc(24 * (60rem / 390));

  font-weight: 700;

  letter-spacing: 0;

  text-align: center;

}



.date_list li.preEvent label p {

  padding-top: calc(5 * (60rem / 390));

  font-size: calc(10 * (60rem / 390));

  font-weight: 600;

  line-height: 1.4;

}



.date_list li label p .txt_S {

  display: block;

  font-size: calc(11 * (60rem / 390));

  font-weight: 500;

}



.sort_date .switching_area {

  position: relative;

  border-top: solid var(--color_05) calc(2 * (60rem / 390));

  background: var(--color_03);

}



.each_schedule {

  position: relative;

  display: none;

  padding: calc(30 * (60rem / 390)) calc(15 * (60rem / 390)) calc(45 * (60rem / 390)) calc(10 * (60rem / 390));

}



.each_schedule:has(input[name="schedule"]:checked) {

  display: block;

}



.each_schedule::before {

  position: absolute;

  top: 0;

  left: 0;

  display: grid;

  place-items: center;

  width: 100%;

  height: 100%;

  font-size: calc(14 * (60rem / 390));

  content: "該当するイベントはありません。";

  white-space: nowrap;

}



.each_schedule:has(input[name="event"]:checked)::before {

  position: absolute;

  top: 0;

  left: 0;

  display: block;

  width: calc(1 * (60rem / 390));

  height: calc(100% - calc(80 * (60rem / 390)));

  margin: calc(30 * (60rem / 390)) 0 0 calc(20 * (60rem / 390));

  background: var(--color_regular);

  content: "";

}



.each_schedule:has(input[name="event"]:checked)::after {

  position: absolute;

  bottom: 0;

  left: 0;

  width: calc(11 * (60rem / 390));

  height: calc(11 * (60rem / 390));

  margin: 0 0 calc(40 * (60rem / 390)) calc(15 * (60rem / 390));

  border-radius: 50%;

  background: var(--color_regular);

  content: "";

}



.each_time .txt_time {

  position: relative;

  display: none;

  width: fit-content;

  border-radius: calc(100 * (60rem / 390));

  margin-bottom: calc(10 * (60rem / 390));

  padding: calc(4 * (60rem / 390)) calc(15 * (60rem / 390)) calc(4 * (60rem / 390)) calc(20 * (60rem / 390));

  background: var(--color_regular);

  font-family: var(--font_eng);

  font-size: calc(16 * (60rem / 390));

  font-weight: 500;

  color: var(--color_06);

}



.each_time .txt_time .date {

  margin-right: calc(6 * (60rem / 390));

}



.each_time .txt_time .txt_S {

  font-family: var(--font_regular);

  font-size: calc(12 * (60rem / 390));

  font-weight: 600;

  vertical-align: .03em;

}



.sort_date .each_schedule:not(.preEvent) .each_time .txt_time .date {

  display: none;

}



.each_time .txt_time::before {

  position: absolute;

  top: 50%;

  left: 0;

  translate: 0 -50%;

  width: calc(10 * (60rem / 390));

  height: calc(10 * (60rem / 390));

  margin-left: calc(6 * (60rem / 390));

  border-radius: 50%;

  background: var(--color_06);

  content: "";

}



.each_time:has(input[name="event"]:checked) .txt_time {

  display: block;

}



.each_event {

  position: relative;

  opacity: 0;

  height: 0;

  overflow: hidden;

  transition: opacity .5s;

}



.each_event.eventOver::before {

  position: absolute;

  z-index: 2;

  top: 0;

  right: 0;

  display: grid;

  place-items: center;

  width: calc(100% + calc(10 * (60rem / 390)));

  height: calc(100% - calc(10 * (60rem / 390)));

  margin-top: calc(-5 * (60rem / 390));

  border-radius: calc(10 * (60rem / 390));

  background: rgba(0, 0, 0, .7);

  font-size: calc(16 * (60rem / 390));

  font-weight: 700;

  color: var(--color_06);

  content: "終了しました。";

}



.each_event:has(input[name="event"]:not(:checked)) {

  margin-top: 0;

  padding-top: 0;

  border-top: none;

}



.each_event:has(input[name="event"]:checked) {

  opacity: 1;

  height: auto;

  overflow: visible;

  width: calc(335 * (60rem / 390));

  margin: 0 0 calc(30 * (60rem / 390)) auto;

  padding-bottom: calc(30 * (60rem / 390));

  padding-bottom: calc(35 * (60rem / 390));

  border-bottom: dashed calc(1 * (60rem / 390)) var(--color_regular);

}



.each_event:nth-last-of-type(1) {

  margin-bottom: 0 !important;

  border-bottom: none !important;

}



.each_event dl {

  position: relative;

}



.venue_list {

  position: absolute;

  bottom: 100%;

  right: 0;

  display: flex;

  padding-left: calc(20 * (60rem / 390));

  background: var(--color_03);

}



.venue_list li {

  width: calc(50 * (60rem / 390));

  position: relative;

}



.venue_list li::before {

  position: absolute;

  top: 50%;

  left: 50%;

  translate: -50% -50%;

  width: 100%;

  height: 100%;

  mask-position: center center;

  mask-size: cover;

  mask-repeat: no-repeat;

  -webkit-mask-position: center center;

  -webkit-mask-size: cover;

  -webkit-mask-repeat: no-repeat;

  content: "";

}



.venue_list li:nth-of-type(1)::before {

  mask-image: url(../../img/202511/icon_webstore.svg);

  -webkit-mask-image: url(../../img/202511/icon_webstore.svg);

}



.venue_list li:nth-of-type(2)::before {

  width: calc(100% + calc(10 * (60rem / 390)));

  height: calc(100% + calc(10 * (60rem / 390)));

  mask-image: url(../../img/202511/icon_shop.svg);

  -webkit-mask-image: url(../../img/202511/icon_shop.svg);

}



.event_present .venue_list li::before {

  background: var(--color_cat_present);

}



.event_coupon .venue_list li::before {

  background: var(--color_cat_coupon);

}



.event_secret .venue_list li::before {

  background: var(--color_cat_secret);

}



.event_instalive .venue_list li::before {

  background: var(--color_cat_instalive);

}



.event_sns .venue_list li::before {

  background: var(--color_cat_sns);

}



.event_makeup .venue_list li::before {

  background: var(--color_cat_makeup);

}



.venue_list li.notAvailable {

  opacity: .2;

}



.venue_list li img {

  opacity: 0;

}



.event_ttl {

  position: relative;

  display: flex;

  align-items: center;

  min-height: calc(42 * (60rem / 390));

  margin-bottom: calc(5 * (60rem / 390));

  padding-left: calc(42 * (60rem / 390));

  font-size: calc(17 * (60rem / 390));

  line-height: 1.5;

  letter-spacing: .06em;

  font-weight: 700;

  font-feature-settings: "palt";

}



.event_ttl span {

  line-height: 1.5;

  letter-spacing: .06em;

}



.event_present .event_ttl {

  color: var(--color_cat_present);

}



.event_coupon .event_ttl {

  color: var(--color_cat_coupon);

}



.event_secret .event_ttl {

  color: var(--color_cat_secret);

}



.event_instalive .event_ttl {

  color: var(--color_cat_instalive);

}



.event_youtube .event_ttl {

  color: var(--color_cat_youtube);

}



.event_sns .event_ttl {

  color: var(--color_cat_sns);

}



.event_makeup .event_ttl {

  color: var(--color_cat_makeup);

}



.event_ttl::before,

.event_ttl::after {

  position: absolute;

  top: 0;

  left: 0;

  width: calc(34 * (60rem / 390));

  height: calc(34 * (60rem / 390));

  margin-top: calc(3 * (60rem / 390));

  border-radius: 50%;

  content: "";

}



.event_present .event_ttl::before {

  background: var(--color_cat_present);

}



.event_coupon .event_ttl::before {

  background: var(--color_cat_coupon);

}



.event_secret .event_ttl::before {

  background: var(--color_cat_secret);

}



.event_instalive .event_ttl::before {

  background: var(--color_cat_instalive);

}



.event_youtube .event_ttl::before {

  background: var(--color_cat_youtube);

}



.event_sns .event_ttl::before {

  background: var(--color_cat_sns);

}



.event_makeup .event_ttl::before {

  background: var(--color_cat_makeup);

}



.event_present .event_ttl::after {

  background: url(../../img/202511/calendar/icon_present.svg) center center / cover no-repeat;

}



.event_coupon .event_ttl::after {

  background: url(../../img/202511/calendar/icon_coupon.svg) center center / cover no-repeat;

}



.event_secret .event_ttl::after {

  background: url(../../img/202511/calendar/icon_secret.svg) center center / cover no-repeat;

}



.event_instalive .event_ttl::after {

  background: url(../../img/202511/calendar/icon_instalive.svg) center center / cover no-repeat;

}



.event_youtube .event_ttl::after {

  background: url(../../img/202511/calendar/icon_youtube.svg) center center / cover no-repeat;

}



.event_sns .event_ttl::after {

  background: url(../../img/202511/calendar/icon_sns.svg) center center / cover no-repeat;

}



.event_makeup .event_ttl::after {

  background: url(../../img/202511/calendar/icon_makeup.svg) center center / cover no-repeat;

}



.event_ttl .instaAccount {

  margin-left: calc(5 * (60rem / 390));

  font-size: calc(12 * (60rem / 390));

}



.event_ttl .txt_tax {

  font-size: calc(11 * (60rem / 390));

}



.eventDetail_txt {

  font-size: calc(13 * (60rem / 390));

  font-weight: 500;

  line-height: 1.6;

}



.eventDetail_txt .txt_S {

  display: block;

  margin-top: calc(5 * (60rem / 390));

  font-size: calc(11 * (60rem / 390));

  line-height: 1.5;

}



.eventDetail_txt .txt_venue {

  margin-right: calc(5 * (60rem / 390));

  padding: calc(2 * (60rem / 390)) calc(18 * (60rem / 390));

  background: var(--color_regular);

  font-size: calc(10 * (60rem / 390));

  color: var(--color_06);

}



.event_access {

  position: relative;

  display: inline-block;

  width: fit-content;

  margin-top: calc(15 * (60rem / 390));

}



.event_access:before {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  margin-top: calc(3 * (60rem / 390));

  border-radius: calc(100 * (60rem / 390));

  border: solid var(--color_regular) calc(1 * (60rem / 390));

  background: #fff;

  box-sizing: border-box;

  content: "";

}



.event_access a {

  position: relative;

  z-index: 1;

  display: grid;

  place-items: center;

  width: calc(190 * (60rem / 390));

  height: calc(35 * (60rem / 390));

  border-radius: calc(100 * (60rem / 390));

  border: solid var(--color_regular) calc(1 * (60rem / 390));

  font-size: calc(14 * (60rem / 390));

  font-weight: 500;

  color: #fff;

  transition: translate .3s;

}



.event_instalive .event_access a {

  font-size: calc(12 * (60rem / 390));

}



.event_access a:hover {

  translate: 0 calc(3 * (60rem / 390));

}



.event_present .event_access a {

  background: var(--color_cat_present);

}



.event_coupon .event_access a {

  background: var(--color_cat_coupon);

}



.event_secret .event_access a {

  background: var(--color_cat_secret);

}



.event_instalive .event_access a {

  background: var(--color_cat_instalive);

}



.event_youtube .event_access a {

  background: var(--color_cat_youtube);

}



.event_sns .event_access a {

  background: var(--color_cat_sns);

}



.event_makeup .event_access a {

  background: var(--color_cat_makeup);

}



.event_access.sns_line a {

  background: var(--color_line);

}



.event_access span {

  position: relative;

}



.event_access.sns_x span {

  padding-left: calc(25 * (60rem / 390));

}



.event_access.sns_instagram span {

  padding-left: calc(25 * (60rem / 390));

}



.event_access.sns_line span {

  padding-left: calc(30 * (60rem / 390));

}



.event_access span::before {

  position: absolute;

  top: 50%;

  left: 0;

  translate: 0 -50%;

  width: calc(20 * (60rem / 390));

  height: calc(20 * (60rem / 390));

  content: "";

}



.event_access.sns_x span::before {

  background: url(../../img/202511/icon_x.svg) center center / cover no-repeat;

}



.event_access.sns_instagram span::before {

  background: url(../../img/202511/icon_instagram.svg) center center / cover no-repeat;

}



.event_access.sns_line span::before {

  width: calc(24 * (60rem / 390));

  height: calc(24 * (60rem / 390));

  background: url(../../img/202511/icon_line.svg) center center / cover no-repeat;

}



.app_list_wrap {

  margin-top: calc(15 * (60rem / 390));

}



.app_list_wrap p {

  margin-bottom: calc(8 * (60rem / 390));

  font-size: calc(13 * (60rem / 390));

}



.app_list {

  display: flex;

  gap: calc(10 * (60rem / 390));

}



.app_list li a {

  height: calc(36 * (60rem / 390));

}



.app_list li a img {

  width: auto;

  height: 100%;

}



.event_img {

  margin-bottom: calc(10 * (60rem / 390));

  border-radius: calc(10 * (60rem / 390));

  overflow: clip;

}



.event_instalive .event_img,

.event_youtube .event_img,

.event_makeup .event_img {

  width: calc(126 * (60rem / 390));

  margin: 0 calc(15 * (60rem / 390)) calc(4 * (60rem / 390)) 0;

  border-radius: unset;

  float: left;

}



.event_instalive dd .txt_wrap,

.event_youtube dd .txt_wrap,

.event_makeup dd .txt_wrap {

  padding-top: calc(10 * (60rem / 390));

  min-height: calc(120 * (60rem / 390));

}



.event_instalive dd .txt_wrap .event_access,

.event_youtube dd .txt_wrap .event_access {

  margin: 0 0 calc(15 * (60rem / 390));

}



.event_present .accordion_outside {

  margin-top: calc(10 * (60rem / 390));

}



.event_present .accordion_btn {

  padding-right: calc(15 * (60rem / 390));

  font-size: calc(13 * (60rem / 390));

  font-weight: 500;

  color: var(--color_cat_present);

}



.event_present .accordion_btn::before,

.event_present .accordion_btn::after {

  width: calc(8 * (60rem / 390));

  height: calc(1.5 * (60rem / 390));

  background: var(--color_cat_present);

}



.artistProfile {

  margin-top: calc(20 * (60rem / 390));

  font-size: calc(10 * (60rem / 390));

  line-height: 1.5;

}



.artistProfile .txt_S {

  display: block;

  margin-bottom: calc(5 * (60rem / 390));

  font-size: calc(10 * (60rem / 390));

  font-weight: 700;

}



.set_list_wrap {

  margin-bottom: calc(10 * (60rem / 390));

  padding: calc(15 * (60rem / 390)) calc(15 * (60rem / 390)) calc(20 * (60rem / 390));

  border-radius: calc(5 * (60rem / 390));

  background: var(--color_06);

  font-size: calc(12 * (60rem / 390));

}



.set_list_wrap > p {

  margin-bottom: calc(10 * (60rem / 390));

}



.set_list li {

  line-height: 1.3;

  letter-spacing: .125em;

  font-feature-settings: "palt";

  text-indent: -1em;

  padding-left: 1em;

}



.set_list li:nth-of-type(n+2) {

  border-top: dotted calc(1 * (60rem / 390)) rgba(0, 0, 0, .1);

  margin-top: calc(6 * (60rem / 390));

  padding-top: calc(6 * (60rem / 390));

}



.set_list li .sample_img {

  height: calc(60 * (60rem / 390));

  margin-top: calc(6 * (60rem / 390));

  padding-left: 1em;

}



.set_list li .sample_img img {

  width: auto;

  height: 100%;

}



.sort_category {

  background: var(--color_03);

}



.each_category {

  position: relative;

  padding-bottom: calc(40 * (60rem / 390));

}



.each_category::before {

  position: absolute;

  top: 0;

  left: 0;

  translate: unset;

  width: calc(1 * (60rem / 390));

  height: calc(100% - calc(110 * (60rem / 390)));

  margin: calc(70 * (60rem / 390)) 0 0 calc(20 * (60rem / 390));

  background: var(--color_regular);

  content: "";

}



.each_category::after {

  position: absolute;

  bottom: 0;

  left: 0;

  width: calc(11 * (60rem / 390));

  height: calc(11 * (60rem / 390));

  margin: 0 0 calc(40 * (60rem / 390)) calc(15 * (60rem / 390));

  border-radius: 50%;

  background: var(--color_regular);

  content: "";

}



.each_category:has(input[name="event"]:not(:checked)) {

  display: none;

}



.categoly_ttl {

  position: relative;

  display: flex;

  align-items: center;

  height: calc(35 * (60rem / 390));

  margin-bottom: calc(30 * (60rem / 390));

  padding-top: calc(2 * (60rem / 390));

  padding-left: calc(60 * (60rem / 390));

  font-size: calc(18 * (60rem / 390));

  font-weight: 700;

  color: var(--color_06);

}



.sec_present .categoly_ttl {

  background: var(--color_cat_present);

}



.sec_coupon .categoly_ttl {

  background: var(--color_cat_coupon);

}



.sec_secret .categoly_ttl {

  background: var(--color_cat_secret);

}



.sec_instalive .categoly_ttl {

  background: var(--color_cat_instalive);

}



.sec_youtube .categoly_ttl {

  background: var(--color_cat_youtube);

}



.sec_sns .categoly_ttl {

  background: var(--color_cat_sns);

}



.sec_makeup .categoly_ttl {

  background: var(--color_cat_makeup);

}



.categoly_ttl::before {

  position: absolute;

  top: 50%;

  left: 0;

  translate: 0 -50%;

  width: calc(35 * (60rem / 390));

  height: calc(35 * (60rem / 390));

  margin-left: calc(20 * (60rem / 390));

  content: "";

}



.sec_present .categoly_ttl::before {

  background: url(../../img/202511/calendar/icon_present.svg) center center / cover no-repeat;

}



.sec_coupon .categoly_ttl::before {

  background: url(../../img/202511/calendar/icon_coupon.svg) center center / cover no-repeat;

}



.sec_secret .categoly_ttl::before {

  background: url(../../img/202511/calendar/icon_secret.svg) center center / cover no-repeat;

}



.sec_instalive .categoly_ttl::before {

  background: url(../../img/202511/calendar/icon_instalive.svg) center center / cover no-repeat;

}



.sec_youtube .categoly_ttl::before {

  background: url(../../img/202511/calendar/icon_youtube.svg) center center / cover no-repeat;

}



.sec_sns .categoly_ttl::before {

  background: url(../../img/202511/calendar/icon_sns.svg) center center / cover no-repeat;

}



.sec_makeup .categoly_ttl::before {

  background: url(../../img/202511/calendar/icon_makeup.svg) center center / cover no-repeat;

}



.sort_category .each_time {

  padding: 0 calc(15 * (60rem / 390)) 0 calc(10 * (60rem / 390));

}



.sort_category .each_event:has(input[name="event"]:checked) {

  padding-bottom: calc(45 * (60rem / 390));

}

/*-------------------EventCalender*/



/*footer--------------------------*/

.footer_area {

  background: var(--color_01);

  perspective: calc(100000 * (60rem / 390));

}



.link_shopList_wrap {

  position: relative;

  padding-bottom: calc(90 * (60rem / 390));

}



.link_shopList_wrap::before {

  position: absolute;

  bottom: 0;

  left: 50%;

  translate: -50% 0;

  width: calc(70 * (60rem / 390));

  height: calc(70 * (60rem / 390));

  background: url(../../img/202511/maindeco/deco_ribbon_gold1.png?251119) center center / cover no-repeat;

  content: "";

  animation: stopmotion4 2s steps(1) infinite;

}



@keyframes stopmotion4 {

  0%, 100% {

    rotate: -10deg;

  }



  50% {

    rotate: 10deg;

  }

}



.link_shopList > a p {

  position: relative;

  padding-left: calc(30 * (60rem / 390));

}



.link_shopList > a p::before {

  position: absolute;

  top: 50%;

  left: 0;

  translate: 0 -50%;

  width: calc(50 * (60rem / 390));

  height: calc(50 * (60rem / 390));

  margin-left: calc(-25 * (60rem / 390));

  background: url(../../img/202511/icon_shop.svg) center center / cover no-repeat;

  content: "";

}



.LINEcoupon_outside {

  position: relative;

  width: fit-content;

  /*margin: calc(20 * (60rem / 390)) auto calc(100 * (60rem / 390));*/

  margin: calc(20 * (60rem / 390)) auto calc(70 * (60rem / 390));

  transform: rotateY(-180deg);

  transform-style: preserve-3d;

}



.LINEcoupon_outside .for_back {

  position: absolute;

  z-index: -1;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background: var(--color_line);

}



.LINEcoupon_outside.active {

  animation: rotateZ3 1s forwards;

}



@keyframes rotateZ3 {

  0% {

    transform: rotateY(-180deg);

  }



  100% {

    transform: rotateY(0deg);

  }

}



.LINEcoupon_wrap {

  position: relative;

  width: calc(360 * (60rem / 390));

  border: solid var(--color_regular) calc(2 * (60rem / 390));

  background: #fff;

  text-align: center;

  backface-visibility: hidden;

  -webkit-backface-visibility: hidden;

}



.LINEcoupon_wrap::before,

.LINEcoupon_wrap::after {

  position: absolute;

  top: 0;

  width: calc(26 * (60rem / 390));

  height: 100%;

  background: var(--color_line);

  content: "";

}



.LINEcoupon_wrap::before {

  left: 0;

}



.LINEcoupon_wrap::after {

  right: 0;

}



.LINEcoupon_wrap > div::before,

.LINEcoupon_wrap > div::after {

  position: absolute;

  z-index: 1;

  top: 0;

  width: calc(26 * (60rem / 390));

  height: 100%;

  background: url(../../img/202511/txt_couponInformation.svg) top center / 100% auto repeat-y;

  opacity: .5;

  content: "";

}



.LINEcoupon_wrap > div::before {

  left: 0;

  animation: loop3 10s linear infinite;

}



.LINEcoupon_wrap > div::after {

  right: 0;

  animation: loop3 10s linear infinite reverse;

}



@keyframes loop3 {

  0% {

    background-position: 0 0;

  }

  100% {

    background-position: 0 calc(-360 * (60rem / 390));

  }

}



.LINEcoupon_wrap > div {

  padding: calc(40 * (60rem / 390)) 0 calc(45 * (60rem / 390));

}



.LINEcoupon_lead {

  font-size: calc(15 * (60rem / 390));

  line-height: 1.75;

}



.LINEcoupon_lead .txt_bold {

  font-weight: 700;

  text-decoration: underline;

  text-decoration-skip-ink: none;

  text-decoration-color: #B2ECCB;

  text-decoration-thickness: calc(7 * (60rem / 390));

  text-underline-offset: calc(-4 * (60rem / 390));

}



.LINEcoupon_lead .txt_bold .txt_S {

  font-size: calc(12 * (60rem / 390));

}



.LINEcoupon_lead .txt_highlight {

  font-weight: 700;

  letter-spacing: .1em;

  font-feature-settings: "palt";

  color: var(--color_line);

  text-decoration: underline;

  text-decoration-skip-ink: none;

  text-decoration-thickness: calc(2 * (60rem / 390));

  text-underline-offset: calc(5 * (60rem / 390));

  text-decoration-style: dashed;

}



.LINEcoupon_lead.txt_L {

  font-size: calc(17 * (60rem / 390));

  font-weight: 600;

}



.LINEcoupon_lead:nth-of-type(n+2) {

  margin-top: calc(20 * (60rem / 390));

}



.LINEcoupon_wrap .accessBtn_wrap {

  margin-top: calc(35 * (60rem / 390));

}



.movie_area {

  position: relative;

  padding: calc(40 * (60rem / 390)) 0 calc(50 * (60rem / 390));

  background: var(--color_02);

}



.movie_area::before {

  position: absolute;

  bottom: 100%;

  left: 50%;

  translate: -50% 0;

  width: calc(70 * (60rem / 390));

  height: calc(70 * (60rem / 390));

  margin-bottom: calc(20 * (60rem / 390));

  background: url(../../img/202511/maindeco/deco_ribbon_gold1.png?251119) center center / cover no-repeat;

  content: "";

  animation: stopmotion4 2s steps(1) infinite reverse;

}



.movie_area > p {

  position: relative;

  width: fit-content;

  margin: 0 auto calc(25 * (60rem / 390));

  padding: calc(20 * (60rem / 390)) calc(40 * (60rem / 390)) calc(18 * (60rem / 390));

  border-radius: calc(25 * (60rem / 390));

  background: var(--color_06);

  font-size: calc(18 * (60rem / 390));

  font-weight: 600;

  text-align: center;

  opacity: 0;

  translate: 0 calc(12 * (60rem / 390));

  transition: opacity .6s, translate .6s;

}



.movie_area > p.active {

  opacity: 1;

  translate: unset;

}



.movie_area > p::before {

  position: absolute;

  top: 100%;

  left: 50%;

  translate: -50% 0;

  width: calc(14 * (60rem / 390));

  height: calc(14 * (60rem / 390));

  margin-top: calc(-1 * (60rem / 390));

  mask-image: url(../../img/202511/shape_speach.svg);

  mask-position: center center;

  mask-size: cover;

  mask-repeat: no-repeat;

  -webkit-mask-image: url(../../img/202511/shape_speach.svg);

  -webkit-mask-position: center center;

  -webkit-mask-size: cover;

  -webkit-mask-repeat: no-repeat;

  background: var(--color_06);

  content: "";

}



.movie_area > p .txt_S {

  position: relative;

  display: block;

  width: fit-content;

  margin: 0 auto calc(8 * (60rem / 390));

  padding: 0 calc(5 * (60rem / 390));

  font-size: calc(15 * (60rem / 390));

}



.movie_area > p .txt_S::before,

.movie_area > p .txt_S::after {

  position: absolute;

  bottom: 0;

  width: calc(1 * (60rem / 390));

  height: calc(12 * (60rem / 390));

  margin-bottom: calc(3 * (60rem / 390));

  border-radius: calc(10 * (60rem / 390));

  transform-origin: bottom center;

  background: var(--color_regular);

  content: "";

}



.movie_area > p .txt_S::before {

  left: 0;

  rotate: -30deg;

}



.movie_area > p .txt_S::after {

  right: 0;

  rotate: 30deg;

}



.movie_area > p .txt_S span {

  position: relative;

}



.movie_area > p .txt_S span::before {

  position: absolute;

  bottom: 100%;

  left: 50%;

  translate: -50% 0;

  width: calc(5 * (60rem / 390));

  height: calc(5 * (60rem / 390));

  margin-bottom: calc(1 * (60rem / 390));

  border-radius: 50%;

  background: var(--color_01);

  content: "";

}



.movie_area > p .txt_highlight {

  color: var(--color_05);

}



.movie_area h4 {

  margin-bottom: calc(20 * (60rem / 390));

  font-size: calc(35 * (60rem / 390));

  font-weight: 700;

  text-align: center;

  color: var(--color_06);

}



.movie_area .movie_outside {

  position: relative;

  width: fit-content;

  margin: 0 auto;

  transform: rotateY(-180deg);

  transform-style: preserve-3d;

}



.movie_area .movie_outside.active {

  animation: rotateZ3 1s forwards;

}



.movie_area .movie_wrap {

  width: calc(300 * (60rem / 390));

  backface-visibility: hidden;

  -webkit-backface-visibility: hidden;

}



.movie_area .movie_outside .for_back {

  position: absolute;

  z-index: -1;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background: var(--color_05);

}



.movie_area  .movie_inner {

  position: relative;

  padding: calc(16% / 0.09) 0 0 0;

}



.movie_area .movie_wrap iframe {

  position: absolute;

  top: 50%;

  left: 50%;

  translate: -50% -50%;

  width: 100%;

  height: 100%;

}



.about_wrap {

  padding: calc(50 * (60rem / 390)) 0;

  background: #fff;

}



.about_wrap .about_img {

  width: calc(370 * (60rem / 390));

  margin: 0 auto calc(25 * (60rem / 390));

}



.about_wrap h4 {

  margin-bottom: calc(30 * (60rem / 390));

  font-size: calc(26 * (60rem / 390));

  font-weight: 700;

  text-align: center;

  color: #D8706D;

}



.about_wrap h4 .txt_S {

  display: block;

  margin-top: calc(15 * (60rem / 390));

  font-size: calc(13 * (60rem / 390));

}



.about_lead {

  padding: 0 calc(15 * (60rem / 390));

  text-align: center;

}



.about_lead p {

  font-size: calc(14 * (60rem / 390));

  line-height: 1.75;

}



.about_lead p:nth-of-type(n+2) {

  margin-top: calc(30 * (60rem / 390));

}



.about_lead p:nth-last-of-type(1) {

  margin-bottom: calc(45 * (60rem / 390));

}



.about_lead a {

  position: relative;

  width: fit-content;

  margin: 0 0 0 auto;

  padding-right: calc(17 * (60rem / 390));

  font-size: calc(14 * (60rem / 390));

  text-decoration: underline;

  text-decoration-skip-ink: none;

  color: #D8706D;

}



.about_lead a::before {

  position: absolute;

  top: 50%;

  right: 0;

  translate: 0 -50%;

  mask-image: url(../../img/202511/shape_arrow2.svg);

  mask-position: center center;

  mask-size: cover;

  mask-repeat: no-repeat;

  -webkit-mask-image: url(../../img/202511/shape_arrow2.svg);

  -webkit-mask-position: center center;

  -webkit-mask-size: cover;

  -webkit-mask-repeat: no-repeat;

  width: calc(10 * (60rem / 390));

  height: calc(7 * (60rem / 390));

  rotate: -90deg;

  background: #D8706D;

  content: "";

}



.about_lead a:nth-of-type(n+2) {

  margin-top: calc(15 * (60rem / 390));

}



.about_wrap .logo_cosmekichen {

  width: calc(186 * (60rem / 390));

  margin: calc(45 * (60rem / 390)) auto 0;

}



/*--------------------------footer*/



/*fixed nav-----------------------*/

.fixed_nav {

  position: fixed;

  z-index: 3;

  bottom: 0;

  width: 100%;

  translate: 0 100%;

  transition: translate .3s;

}



.fixed_nav.active {

  translate: 0 0;

  filter: drop-shadow(0 calc(-3 * (60rem / 390)) calc(5 * (60rem / 390))) rgba(0, 0, 0, .1);

}



.fixed_nav_list {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  background: url(../../img/202511/maindeco/cloth3.jpg) center center / cover no-repeat;

}



.fixed_nav_list li {

  position: relative;

}



.fixed_nav_list li:nth-of-type(n+2)::before {

  position: absolute;

  top: 50%;

  left: 0;

  translate: 0 -50%;

  width: calc(1 * (60rem / 390));

  height: calc(100% - calc(20 * (60rem / 390)));

  background: #fff;

  content: "";

}





.fixed_nav_list li a {

  display: grid;

  place-items: center;

  height: calc(70 * (60rem / 390));

  text-align: center;

  color: #fff;

}



.fixed_nav_list li a p {

  font-size: calc(15 * (60rem / 390));

  line-height: 1.1;

  font-weight: 600;

}



.fixed_nav_list li a p .txt_S {

  display: block;

  margin-top: calc(6 * (60rem / 390));

  font-size: calc(10 * (60rem / 390));

  font-weight: 400;

  letter-spacing: 0;

}



/*-----------------------fixed nav*/



/*shareボタン、shareテキスト---------------------------*/

@media screen and  (max-width:768px) {

#share {

  z-index: 10 !important;

  transition: translate .3s;

}



#share.move {

  translate: 0 calc(-70 * (60rem / 390));

}



.share-txt {

  display: none;

}



.only_pc {

  display: none;

}



}

/*---------------------------shareボタン、shareテキスト*/





/*PC------------------------------------------------------*/

@media screen and  (min-width:769px) {

  .only_sp {

    display: none !important;

  }



  .LP_page_inner {

    position: relative;

    z-index: 1;

    width: 60rem;

    min-height: 100vh;

    margin: -100vh auto 0;

    overflow: clip;

  }



  .fixed_area {

    position: sticky;

    top: 0;

    z-index: 1;

    display: flex;

    justify-content: space-between;

    width: 100%;

    height: 100vh;

    margin: 0 auto;

    background: #BE905F;

  }



  .fixed_area::before {

    position: absolute;

    z-index: -1;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background: url(../../img/202511/maindeco/bg_ribbon1.png) center center / 39rem 12.4rem repeat;

    opacity: .08;

    content: "";

    pointer-events: none;

  }

  

  .fixed_left,

  .fixed_right {

    display: grid;

    place-items: center;

    width: calc((100% - 60rem) / 2);

    height: 100%;

  }



  .fixed_left .main_ttl {

    position: relative;

    width: 31rem;

    margin: 0 auto;

  }



  .fixed_left .main_ttl img {

    opacity: 0;

  }



  .fixed_left .main_ttl::before {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    mask-image: url(../../img/202511/ttl_theorganicdays.svg);

    mask-position: center center;

    mask-size: cover;

    mask-repeat: no-repeat;

    -webkit-mask-image: url(../../img/202511/ttl_theorganicdays.svg);

    -webkit-mask-position: center center;

    -webkit-mask-size: cover;

    -webkit-mask-repeat: no-repeat;

    background: var(--color_06);

    content: "";

  }



  .fixed_left .sub_ttl {

    margin-top: 3.5rem;

    font-size: 2.4rem;

    font-weight: 500;

    line-height: 1.5;

    letter-spacing: .2em;

    text-align: center;

    color: var(--color_06);

  }



  .fixed_left .sub_ttl .notes {

    display: block;

    margin-top: .6rem;

    font-size: 1rem;

    font-weight: 400;

  }



  .fixed_left .logo_cosmekichen {

    position: relative;

    width: 18.5rem;

    margin: 3rem auto 0;

  }



  .fixed_left .logo_cosmekichen::before {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    mask-image: url(../../img/202511/logo_cosmekichen2.svg);

    mask-position: center center;

    mask-size: cover;

    mask-repeat: no-repeat;

    -webkit-mask-image: url(../../img/202511/logo_cosmekichen2.svg);

    -webkit-mask-position: center center;

    -webkit-mask-size: cover;

    -webkit-mask-repeat: no-repeat;

    background: var(--color_regular);

    content: "";

  }



  .fixed_left .logo_cosmekichen img {

    opacity: 0;

  }



  .fixed_left .link_LINEcoupon {

    width: 21rem;

    margin: 7rem auto 0;

    cursor: pointer;

    transition: scale .5s;

  }



  .fixed_left .link_LINEcoupon:hover {

    scale: 1.1;

  }



  .pc_nav .nav_list > li:nth-of-type(n+2) {

    margin-top: 3.5rem;

  }



  .pc_nav .nav_list > li .nav_lead {

    margin-bottom: .8rem;

    font-size: 1.3rem;

    text-align: center;

    color: var(--color_03);

  }



  .pc_nav .nav_list > li > a {

    width: 32rem;

    height: 6.8rem;

  }



  .pc_nav .nav_list > li > a::before {

    mask-image: url(../../img/202511/shape_ribbon2.svg);

    -webkit-mask-image: url(../../img/202511/shape_ribbon2.svg);

    background: var(--color_05);

  }



  .pc_nav .nav_list > li > a p {

    font-size: 2rem;

  }



  .pc_nav .nav_list > li > a p .txt_S {

    margin-top: .8rem;

    font-size: 1.3rem;

  }



  .pc_nav .index_outside {

    width: 32rem;

    margin: 2rem auto 0;

    padding-bottom: .3rem;

    border-top-width: .2rem;

  }



  .pc_nav .index_outside::before {

    height: 1.8rem;

    border-radius: .2rem .2rem .4rem .4rem;

  }



  .pc_nav .index_outside::after {

    width: 31.5rem;

    height: .4rem;

    margin-top: 1.25rem;

    border-radius: 0 0 .2rem .2rem;

  }



  .pc_nav .index_wrap {

    width: 30rem;

    height: 15rem;

    margin: 0 auto;

    padding: 1.2rem 1.8rem;

  }



  .pc_nav .index_wrap::before {

    mask-image: url(../../img/202511/shape_index2.svg);

    -webkit-mask-image: url(../../img/202511/shape_index2.svg);

  }



  .pc_nav .index_wrap::after {

    width: 30.1rem;

    height: 15.1rem;

    mask-image: url(../../img/202511/shape_indexFrame2.svg);

    -webkit-mask-image: url(../../img/202511/shape_indexFrame2.svg);

  }



  .pc_nav .index_wrap dt {

    margin-bottom: .5rem;

    padding-bottom: .6rem;

    border-bottom-width: .15rem;

    font-size: 1.5rem;

  }



  .pc_nav .index_list li a {

    height: 3.4rem;

    font-size: 1.3rem;

  }



  .pc_nav .index_list li:nth-of-type(n+2) a::before {

    height: .15rem;

  }



  .pc_nav .index_list li a p sup {

    font-size: 1rem;

  }



  .pc_nav .index_list li a p::before {

    width: 1.2rem;

    height: 1.2rem;

  }



  .pc_nav .index_list li a p::after {

    width: .9rem;

    height: .6rem;

    margin-right: .15rem;

  }



  .pc_nav .index_list li a .index_num {

    margin-right: 1rem;

    font-size: 1.6rem;

  }







}

/*------------------------------------------------------PC*/





/*レスポンシブ対応-------------------------------*/

@media screen and (max-width: 1600px) and (min-width: 769px) {

  html {

    font-size: calc(10 * (100vw / 1600));

  }

}



@media screen and (max-width: 768px) {

  html {

    font-size: calc(10 * (100vw / 600));

  }

}

/*-------------------------------レスポンシブ＆タブレット対応*/