@charset "UTF-8";

:root {
  --u: min(0.1333333333vw, 1px);
  --black: #000;
  --white: #fff;
  --gray-bg: rgba(217, 217, 217, 0.3);
  --page-bg: #f4f4f4;
  --line: #e5e5ea;
  --font-serif: "IvyOra Display", "ivyora-display", "EB Garamond", "Times New Roman", serif;
  --font-en: "acumin-pro", "Hanken Grotesk", "Helvetica Neue", Arial, sans-serif;
  --font-ja: "Yu Gothic", "YuGothic", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  --font-script: "liana", "IvyOra Display", cursive;
  --kv-extra: 0px;

}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background: var(--white);
  color: var(--black);
  font-family: var(--font-ja);
  letter-spacing: 0;
}

img {
  display: block;
  width: 100%;
  height: 100%;
}

a {
  color: inherit;
  text-decoration: none;
}

p {
	margin: 0;
	padding: 0;
}


.gensei-sp {
  width: 100%;
  overflow-x: hidden;
  background: var(--white);
}

.gensei-sp__canvas {
  position: relative;
  width: calc(750 * var(--u));
  height: calc(36180 * var(--u));
  margin: 0 auto;
  overflow: hidden; 
  /* background: var(--white); */
}

.gensei-sp__canvas::before {
  position: absolute;
  top: calc(968 * var(--u));
  left: calc(2 * var(--u));
  width: calc(746 * var(--u));
  height: calc(31916 * var(--u));
  content: "";
  /* background: var(--page-bg); */
  /* border: calc(1 * var(--u)) solid var(--black); */
}

.gensei-sp__canvas::after {
  position: absolute;
  top: calc(967 * var(--u));
  left: 0;
  width: calc(750 * var(--u));
  height: calc(31916 * var(--u));
  content: "";
  /* background: var(--gray-bg); */
  pointer-events: none;
}

.gensei-sp__below-kv {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  transform: translateY(var(--kv-extra, 0px));
}


.read-section,
.menu-section,
.items-section,
.look-section,
.event-section,
.footer-section {
  position: absolute;
  z-index: 1;
  overflow: hidden;
}

.kv-section {
  position: relative;
  top: 0;
  left: 0;
/*
  width: calc(750 * var(--u));
  height: calc(1050 * var(--u));
*/
  width: 100vw;
  height: 100lvh;
}

.kv-section__image {
  /* position: absolute; */
  /* left: calc(-66 * var(--u));
  top: calc(-127 * var(--u)); */
  /* left: 0;
  top: 0; */
  /* width: calc(883 * var(--u));
  height: calc(1177 * var(--u)); */
  object-fit: cover;
  width: 100vw;
  height: 100lvh;
  object-fit: cover; /* 画像の縦横比を崩さずに全領域を埋める */
  object-position: center; /* 画像の中心を表示エリアの中央に合わせる */
}

.kv-section__title {
  /* position: absolute;
  top: calc(457 * var(--u));
  left: calc(88 * var(--u));
  width: calc(574 * var(--u));
  height: calc(137 * var(--u));
  margin: 0; */
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: calc(574 * var(--u));
  height: calc(137 * var(--u));
}

.kv-section__title-image {
  position: absolute;
  object-fit: contain;
}

.kv-section__title-image--top {
  top: 0;
  left: 0;
  width: calc(574 * var(--u));
  /* height: calc(44 * var(--u)); */
}

.kv-section__title-image--bottom {
  right: calc(89 * var(--u));
  bottom: 0;
  width: calc(396 * var(--u));
  height: calc(63 * var(--u));
}



.read-section {
    top: calc(130 * var(--u));
    left: calc(4 * var(--u));
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(741 * var(--u));
    height: calc(916 * var(--u));
    text-align: center;
	
	 flex-direction: column;   /* ← これを追加 */
}

.read-section__text {
  margin: calc(10 * var(--u)) 0;
  font-size: calc(20 * var(--u));
  font-weight: 400;
  line-height: 1.5;
  white-space: normal;
  word-break: break-word;
  overflow-wrap: break-word;
}
.item_info_img {
  display: block;
  width: calc(180 * var(--u)); /* 数値は仮。実際のデザインに合わせて調整してください */
  height: auto;
  margin: calc(10 * var(--u)) auto;
	padding-bottom: calc(5 * var(--u));
	border-bottom: hsla(0,0%,0%,1.00) solid 1px;
}

.item_info_sec{
  margin: calc(20 * var(--u)) 0;
  /* text-align: center; */
/*	border: calc(1 * var(--u)) solid var(--black);*/
	padding:  calc(23 * var(--u));
}

.item_info{
  display: block;
  margin: calc(20 * var(--u)) 0;
  /* text-align: center; */
}

.item_info_img{
	
  /* text-align: center; */
}

.item_info_title{
font-size: calc(24 * var(--u));
	font-weight: 500;
  display: block;
/*  margin: calc(10 * var(--u)) 0;*/
	margin:0;
  /* text-align: center; */
}

.item_info_sub{
	font-size: calc(17 * var(--u));
  display: block;
	margin:0;
/*  margin: calc(10 * var(--u)) 0;*/
	color: hsla(0,0%,38%,1.00);
  /* text-align: center; */
}

.menu-section {
  top: calc(1160 * var(--u));
  /* left: calc(143 * var(--u)); */
  left: 50%;
  transform: translateX(-50%);
  width: calc(613 * var(--u));
  height: calc(396 * var(--u));
  background: var(--gray-bg);
}

.menu-section__list {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  height: 100%;
  padding: calc(20 * var(--u)) calc(40 * var(--u)) calc(20 * var(--u)) calc(40 * var(--u));
  margin: 0;
  list-style: none;
}

.menu-section__item {
  min-height: calc(98 * var(--u));
}

.menu-section__link {
  font-family: var(--font-serif);
  font-size: calc(32 * var(--u));
  line-height: 1.25;
  border-bottom: #000 solid calc(1 * var(--u));
  padding: 0 0 calc(15 * var(--u));
  display: flex;
  justify-content: space-between;  /* ラベルを左、番号+>>を右に */
  align-items: baseline;  
}

.menu-section__right {
  display: flex;
  align-items: baseline;
  gap: calc(10 * var(--u));        /* 番号と>>の間隔 */
  flex-shrink: 0;                  /* 幅が狭くても縮まないように */
}

.menu-section__num {
  min-width: calc(40 * var(--u));  /* 01〜03の幅を固定して縦に揃える */
  text-align: right;
}

.section-title {
  position: absolute;
  display: flex;
  align-items: flex-end;
  gap: calc(13 * var(--u));
  height: calc(141 * var(--u));
  padding: 0 calc(10 * var(--u));
  color: var(--black);
}

.section-title__number {
  flex: 0 0 auto;
  width: calc(100 * var(--u)) !important;
  font-family: "EB Garamond", var(--font-serif);
  font-size: calc(100 * var(--u));
  font-weight: 400;
  line-height: 1;
}

.section-title__text {
  margin: 0 0 calc(17 * var(--u));
  font-family: var(--font-serif);
  font-size: calc(45 * var(--u));
  font-weight: 400;
  line-height: 1;
  white-space: nowrap;
}

.items-section {
  top: calc(1712 * var(--u));
  left: 0;
  width: calc(750 * var(--u));
  height: calc(3672 * var(--u));
  border-top: #000 solid calc(1 * var(--u));
}

.items-section::before,
.look-section::before,
.event-section::before {
  position: absolute;
  top: 0;
  right: 0;
  width: calc(700 * var(--u));
  height: 100%;
  content: "";
  /* background: var(--gray-bg); */
}

.items-section__title {
  top: calc(-10 * var(--u));
  left: 0;
}

.item-card {
  position: absolute;
  width: calc(750 * var(--u));
}

.item-card__title{
	border-bottom: none;
}

.item-card--01 {
  top: calc(60 * var(--u));
  left: 0;
  height: calc(1371 * var(--u));
}

.item-card--02 {
  top: calc(1345 * var(--u));
  left: 0;
  height: calc(1108 * var(--u));
}

.item-card--03 {
  top: calc(2572 * var(--u));
  left: 0;
  height: calc(1154 * var(--u));
}

.item-card__date{
  position: absolute;
  left: 50%;
  transform: translateX(-50%) !important;
  width: calc(380 * var(--u));
  text-align: center;
  font-family: var(--font-en);
  font-size: calc(23 * var(--u));
  line-height: 1.35;
  /* margin: calc(10 * var(--u)); */
/*  border: #000 solid calc(1 * var(--u));*/
/*	border: calc(1 * var(--u)) solid var(--black);*/
/*
	  border-width: max(1px, calc(1.5 * var(--u)));
  border-style: solid;
  border-color: var(--black);
*/
	box-shadow: inset 0 0 0 calc(1.0 * var(--u)) var(--black);
	padding:  calc(23 * var(--u));
}

.item-card__date span{
  font-size:calc(20 * var(--u));
}

.item-card__date1{
  top: calc(190 * var(--u));
}

.item-card__date2{
  top: calc(2520 * var(--u));
}

.item-card__image-wrap {
  position: absolute;
  top: calc(354 * var(--u));
  left: 0;
  width: calc(750 * var(--u));
  height: calc(850 * var(--u));
  overflow: hidden;
}

.item-card--02 .item-card__image-wrap {
  top: calc(141 * var(--u));
  right: calc(-10 * var(--u));
  left: 0;
}

.item-card--03 .item-card__image-wrap {
  top: calc(174 * var(--u));
  right: 0;
  left: auto;
}

.item-card__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.item-card__catch {
  position: absolute;
  margin: 0;
  color: var(--white);
  
  font-family: var(--font-en);
  font-size: calc(65 * var(--u));
  font-style: normal;
  font-weight: 200;
  line-height: 1;
  white-space: nowrap;
}


.item {
  font-family: var(--font-script);
}

.item-card__catch--left {
  top: calc(770 * var(--u));
/*  top: calc(740 * var(--u));*/
  left: calc(20 * var(--u));
}

.item-card__catch--right {
  top: calc(770 * var(--u));
/*  top: calc(740 * var(--u));*/
  right: calc(30 * var(--u));
}

.item-card__sub--left {
  top: calc(715 * var(--u));
/*  top: calc(660 * var(--u));*/
  left: calc(30 * var(--u));
  font-size: calc(50 * var(--u));
}

.item-card__sub--right {
  top: calc(715 * var(--u));
/*  top: calc(660 * var(--u));*/
  right: calc(35 * var(--u));
  font-size: calc(50 * var(--u));
}

.item-card__detail1 {
  position: absolute;
  top: calc(1231 * var(--u)) !important;
  left: 0;
  width: calc(651 * var(--u));
  padding-left: calc(20 * var(--u));
  font-family: var(--font-en);
  font-size: calc(20 * var(--u));
  line-height: 1.35;
}

.item-card__detail2 {
  position: absolute;
  top: calc(1011 * var(--u)) !important;
  left: 0;
  width: calc(651 * var(--u));
  padding-left: calc(20 * var(--u));
  font-family: var(--font-en);
  font-size: calc(20 * var(--u));
  line-height: 1.35;
}

.item-card__detail3{
  position: absolute;
  top: calc(1041 * var(--u)) !important;
  left: 0;
  width: calc(651 * var(--u));
  padding-left: calc(20 * var(--u));
  font-family: var(--font-en);
  font-size: calc(20 * var(--u));
  line-height: 1.35;
}

.item-card--02 .item-card__detail,
.item-card--03 .item-card__detail {
  top: calc(1025 * var(--u));
}

.item-card__name,
.item-card__price {
  margin: 0 0 calc(7 * var(--u));
}

.item-card__price {
  margin-left:calc(14 * var(--u));
}

.item-card__buy {
  margin-left: calc(18 * var(--u));
  text-decoration: underline;
	z-index: 999; /* 追加してみる */
}

.look-section {
  top: calc(5584 * var(--u));
  left: 0;
  width: calc(750 * var(--u));
  height: calc(25346 * var(--u));
  border-top: #000 solid calc(1 * var(--u));
  border-bottom: #000 solid calc(1 * var(--u));
}

.look-section::before {
  top: calc(0 * var(--u));
  height: calc(24095 * var(--u));
}

.look-section__title {
  top: calc(5 * var(--u));
  left: 0;
}

.look-section__image {
  position: absolute;
  overflow: hidden;
}

.look-section__image img {
  object-fit: cover;
}

.look-section__image--01 { top: calc(185 * var(--u)); left: 0; width: calc(749 * var(--u)); height: calc(562 * var(--u)); }
.look-section__image--02 { top: calc(887 * var(--u)); left: calc(104 * var(--u)); width: calc(543 * var(--u)); height: calc(724 * var(--u)); border: calc(1 * var(--u)) solid var(--line); }
.look-section__image--03 { top: calc(1751 * var(--u)); left: calc(-35 * var(--u)); width: calc(581 * var(--u)); height: calc(435 * var(--u)); }
.look-section__image--04 { top: calc(2326 * var(--u)); left: calc(272 * var(--u)); width: calc(494 * var(--u)); height: calc(659 * var(--u)); }
.look-section__image--05 { top: calc(3112 * var(--u)); left: calc(-75 * var(--u)); width: calc(825 * var(--u)); height: calc(1100 * var(--u)); }
.look-section__image--06 { top: calc(4381 * var(--u)); left: calc(-8 * var(--u)); width: calc(766 * var(--u)); height: calc(575 * var(--u)); }
.look-section__image--07 { top: calc(5072 * var(--u)); left: calc(42 * var(--u)); width: calc(503 * var(--u)); height: calc(671 * var(--u)); }
.look-section__image--08 { top: calc(5864 * var(--u)); left: calc(191 * var(--u)); width: calc(528 * var(--u)); height: calc(705 * var(--u)); }
.look-section__image--09 { top: calc(6690 * var(--u)); left: 0; width: calc(756 * var(--u)); height: calc(1008 * var(--u)); }
.look-section__image--10 { top: calc(7851 * var(--u)); left: 0; width: calc(601 * var(--u)); height: calc(451 * var(--u)); }
.look-section__image--11 { top: calc(8431 * var(--u)); left: calc(104 * var(--u)); width: calc(646 * var(--u)); height: calc(485 * var(--u)); }
.look-section__image--12 { top: calc(9019 * var(--u)); left: calc(-24 * var(--u)); width: calc(808 * var(--u)); height: calc(606 * var(--u)); }
.look-section__image--13 { top: calc(9726 * var(--u)); left: calc(112 * var(--u)); width: calc(638 * var(--u)); height: calc(851 * var(--u)); }
.look-section__image--14 { top: calc(10788 * var(--u)); left: calc(56 * var(--u)); width: calc(638 * var(--u)); height: calc(851 * var(--u)); }
.look-section__image--15 { top: calc(11761 * var(--u)); left: calc(-25 * var(--u)); width: calc(618 * var(--u)); height: calc(825 * var(--u)); }
.look-section__image--16 { top: calc(12723 * var(--u)); left: calc(-65 * var(--u)); width: calc(906 * var(--u)); height: calc(680 * var(--u)); }
.look-section__image--17 { top: calc(13535 * var(--u)); left: calc(-113 * var(--u)); width: calc(902 * var(--u)); height: calc(677 * var(--u)); }
.look-section__image--18 { top: calc(14376 * var(--u)); left: 0; width: calc(591 * var(--u)); height: calc(789 * var(--u)); }
.look-section__image--19 { top: calc(15269 * var(--u)); left: calc(226 * var(--u)); width: calc(524 * var(--u)); height: calc(698 * var(--u)); }
.look-section__image--20 { top: calc(16101 * var(--u)); left: calc(-19 * var(--u)); width: calc(787 * var(--u)); height: calc(1050 * var(--u)); }
.look-section__image--21 { top: calc(17285 * var(--u)); left: calc(123 * var(--u)); width: calc(504 * var(--u)); height: calc(672 * var(--u)); }
.look-section__image--22 { top: calc(18087 * var(--u)); left: calc(-38 * var(--u)); width: calc(788 * var(--u)); height: calc(1050 * var(--u)); }
.look-section__image--23 { top: calc(19271 * var(--u)); left: calc(102 * var(--u)); width: calc(546 * var(--u)); height: calc(729 * var(--u)); }
.look-section__image--24 { top: calc(20140 * var(--u)); left: calc(-19 * var(--u)); width: calc(606 * var(--u)); height: calc(455 * var(--u)); }
.look-section__image--25 { top: calc(20725 * var(--u)); left: calc(123 * var(--u)); width: calc(630 * var(--u)); height: calc(472 * var(--u)); }
.look-section__image--26 { top: calc(21333 * var(--u)); left: 0; width: calc(767 * var(--u)); height: calc(1023 * var(--u)); }
.look-section__image--27 { top: calc(22576 * var(--u)); left: calc(117 * var(--u)); width: calc(642 * var(--u)); height: calc(856 * var(--u)); }

.look-section__credit {
  position: absolute;
  overflow: hidden;
  font-size:calc(18 * var(--u));
  font-family: var(--font-en);
  color: #696969;
line-height: 1.3;
	text-transform: uppercase;
}

.look-section__credit a {
  text-decoration: underline;
  text-decoration-thickness: calc(1 * var(--u));
  text-underline-offset: calc(3 * var(--u));
  text-decoration-color: currentColor;
}

.look-section__credit--02 { 
  top: calc(1621 * var(--u)); left: calc(104 * var(--u)); 

}

.look-section__credit--05 { 
  top: calc(4220 * var(--u)); left: calc(10 * var(--u)); 
}

.look-section__credit--09 { 
  top: calc(7706 * var(--u)); left: calc(10 * var(--u));
}

.look-section__credit--10 { 
  top: calc(8310 * var(--u)); left: calc(10 * var(--u));
}

.look-section__credit--13 { 
  top: calc(10590 * var(--u)); left: calc(112 * var(--u));
}

.look-section__credit--17 { 
  top: calc(14220 * var(--u)); left: calc(10 * var(--u));
}

.look-section__credit--23 { 
  top: calc(20007 * var(--u)); left: calc(102 * var(--u));
}

.look-section__credit--26 { 
  top: calc(22365 * var(--u)); left: calc(10 * var(--u));
}


.look-section__note {
  position: absolute;
  margin: 0;
  font-family: var(--font-en);
  font-size: calc(16 * var(--u));
  line-height: 1.25;
}

.look-section__note--01::before {
  content: "";
  position: absolute;
  bottom: calc(7 * var(--u));
  left: calc(75 * var(--u));
  width: calc(80 * var(--u));
  height: calc(1.3 * var(--u));
  background-color: #000; 
  transform-origin: left center;
  transform: rotate(32deg);
  z-index: 999;
}

.look-section__note--02::before {
  content: "";
  position: absolute;
  bottom: calc(20 * var(--u));
  left: calc(50 * var(--u));
  width: calc(120 * var(--u));
  height: calc(1.3 * var(--u));
  background-color: #000; 
  transform-origin: left center;
  transform: rotate(12deg);
  z-index: 999;
}

.look-section__note--03::before {
  content: "";
  position: absolute;
     bottom: calc(0 * var(--u));
    left: calc(-8 * var(--u));
    width: calc(43 * var(--u));
  height: calc(1.3 * var(--u));
  background-color: #000; 
  transform-origin: left center;
  transform: rotate(145deg);
  z-index: 999;
}

.look-section__note--04::before {
  content: "";
  position: absolute;
     bottom: calc(30 * var(--u));
    left: calc(60 * var(--u));
    width: calc(120 * var(--u));
  height: calc(1.3 * var(--u));
  background-color: #000; 
  transform-origin: left center;
  transform: rotate(-35deg);
  z-index: 999;
}

.look-section__note--05::before {
  content: "";
  position: absolute;
  bottom: calc(10 * var(--u));
  left: calc(-10 * var(--u));
  width: calc(100 * var(--u));
  height: calc(1.3 * var(--u));
  background-color: #000; 
  transform-origin: left center;
  transform: rotate(145deg);
  z-index: 999;
}

.look-section__note--06::before {
  content: "";
  position: absolute;
      bottom: calc(29 * var(--u));
    left: calc(-10 * var(--u));
    width: calc(40 * var(--u));
  height: calc(1.3 * var(--u));
  background-color: #000;
  transform-origin: left center;
  transform: rotate(215deg);
  z-index: 999;
}

.look-section__note--07::before {
  content: "";
  position: absolute;
bottom: calc(21 * var(--u));
    left: calc(-11 * var(--u));
    width: calc(80 * var(--u));
  height: calc(1.3 * var(--u));
  background-color: #000;
  transform-origin: left center;
  transform: rotate(205deg);
  z-index: 999;
}

.look-section__note--08::before {
    content: "";
    position: absolute;
    bottom: calc(20 * var(--u));
    left: calc(70 * var(--u));
    width: calc(80 * var(--u));
    height: calc(1.3 * var(--u));
    background-color: #000;
    transform-origin: left center;
    transform: rotate(15deg);
  z-index: 999;
}

.look-section__note--09::before {
  content: "";
  position: absolute;
  bottom: calc(30 * var(--u));
  left: calc(60 * var(--u));
    width: calc(110 * var(--u));
  height: calc(1.3 * var(--u));
  background-color: #000;
  transform-origin: left center;
  transform: rotate(-5deg);
  z-index: 999;
}

.look-section__note--10::before {
     content: "";
    position: absolute;
    bottom: calc(-5 * var(--u));
    left: calc(60 * var(--u));
    width: calc(90 * var(--u));
    height: calc(1.3 * var(--u));
    background-color: #000;
    transform-origin: left center;
    transform: rotate(45deg);
    z-index: 999;
}

.look-section__note--11::before {
    content: "";
    position: absolute;
    bottom: calc(5 * var(--u));
    left: calc(-10 * var(--u));
    width: calc(96 * var(--u));
    height: calc(1.3 * var(--u));
    background-color: #000;
    transform-origin: left center;
    transform: rotate(-216deg);
    z-index: 999;
}

.look-section__note--12::before {
  	content: "";
    position: absolute;
    bottom: calc(0 * var(--u));
    left: calc(85 * var(--u));
    width: calc(90 * var(--u));
    height: calc(1.3 * var(--u));
    background-color: #000;
    transform-origin: left center;
    transform: rotate(20deg);
    z-index: 999;
}

.look-section__note--13::before {
    content: "";
    position: absolute;
    bottom: calc(-8 * var(--u));
    left: calc(15 * var(--u));
    width: calc(105 * var(--u));
    height: calc(1.3 * var(--u));
    background-color: #000;
    transform-origin: left center;
    transform: rotate(-236deg);
    z-index: 999;
}

.look-section__note--14::before {
  	content: "";
    position: absolute;
    bottom: calc(10 * var(--u));
    left: calc(-15 * var(--u));
    width: calc(170 * var(--u));
    height: calc(1.3 * var(--u));
    background-color: #000;
    transform-origin: left center;
    transform: rotate(155deg);
    z-index: 999;
}

.look-section__note--15::before {
  	content: "";
    position: absolute;
    bottom: calc(0 * var(--u));
    left: calc(85 * var(--u));
    width: calc(120 * var(--u));
    height: calc(1.3 * var(--u));
    background-color: #000;
    transform-origin: left center;
    transform: rotate(20deg);
    z-index: 999;
}


.look-section__note--01 { top: calc(1226 * var(--u)); left: calc(208 * var(--u)); }
.look-section__note--02 { top: calc(1390 * var(--u)); left: calc(217 * var(--u)); }
.look-section__note--03 { top: calc(3506 * var(--u)); left: calc(513 * var(--u)); }
.look-section__note--04 { top: calc(3618 * var(--u)); left: calc(208 * var(--u)); }
.look-section__note--05 { top: calc(7390 * var(--u)); left: calc(544 * var(--u)); }
.look-section__note--06 { top: calc(8134 * var(--u)); left: calc(483 * var(--u)); }
.look-section__note--07 { top: calc(8173 * var(--u)); left: calc(354 * var(--u)); }
.look-section__note--08 { top: calc(10000 * var(--u)); left: calc(284 * var(--u)); }
.look-section__note--09 { top: calc(10238 * var(--u)); left: calc(284 * var(--u)); }
.look-section__note--10 { top: calc(13600 * var(--u)); left: calc(120 * var(--u)); }
.look-section__note--11 { top: calc(13805 * var(--u)); left: calc(480 * var(--u)); }
.look-section__note--12 { top: calc(13800 * var(--u)); left: calc(50 * var(--u)); }
.look-section__note--13 { top: calc(19360 * var(--u)); left: calc(530 * var(--u)); }
.look-section__note--14 { top: calc(21930 * var(--u)); left: calc(640 * var(--u)); }
.look-section__note--15 { top: calc(21800 * var(--u)); left: calc(60 * var(--u)); }

.staff-section {
      position: absolute;
    z-index: 2;
    top: calc(23580 * var(--u));
    left: 0;
    width: calc(750 * var(--u));
    height: calc(360 * var(--u));
    overflow: hidden;
    text-align: center;
    font-family: var(--font-en);
    font-size: calc(23 * var(--u));
    line-height: 1.55;
    border-bottom: #000 solid calc(1 * var(--u));
}

.prof-section {
  position: absolute;
  z-index: 2;
  top: calc(24116  * var(--u));
  left: 0;
  width: calc(750 * var(--u));
  height: calc(1140 * var(--u));
  overflow: hidden;
}

.prof-section .prof {
  position: absolute;
  z-index: 999;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  margin: 0;
  width: calc(350 * var(--u));
  overflow: hidden;
}

.prof-section .name{
  position: absolute;
  z-index: 999;
  top: calc(530  * var(--u));
  left: 50%;
  transform: translateX(-50%);
	margin-top: calc(30  * var(--u));
	font-size: calc(34 * var(--u));
	font-family: var(--font-en);
}

.prof-section .icon {
  display: flex;
  position: absolute;
  z-index: 999;
  top: calc(645  * var(--u));
  left: 50%;
  transform: translateX(-50%);
}

.prof-section .icon img{
  width: calc(100 * var(--u));
}

.prof-section .icon .insta{
  padding: 0 5%;
  width: calc(80 * var(--u));
}
.prof-section .icon .yt{
  padding: 0 5%;
  width: calc(100 * var(--u));
}

.prof-section .prof-read {
  position: absolute;
  z-index: 999;
  top: calc(756  * var(--u));
  left: 50%;
  transform: translateX(-50%);
  font-size: calc(20 * var(--u));
}



/* イベント */

.event-section {
  top: calc(30920 * var(--u));
  left: 0;
  width: calc(749 * var(--u));
  height: calc(4500 * var(--u));
}

.event-section::before {
  left: 0;
  right: auto;
  height: calc(869 * var(--u));
}

.event-section__title {
  position: absolute;
  top: calc(11 * var(--u));
  left: 0;
  width: calc(748 * var(--u));
}

.event-section .section-title__number {
  width: calc(141 * var(--u));
}

.event-section .section-title__text {
  font-size: calc(35 * var(--u));
}

.event-section__block {
  position: absolute;
  left: 0;
  width: calc(748 * var(--u));
  padding: calc(27 * var(--u)) calc(50 * var(--u));
  font-size: calc(20 * var(--u));
  font-weight: 400;
  line-height: 1.6;
}

.event-section__block--event {
  top: calc(149 * var(--u));
}




/* プレゼント */

.event-section__block--campaign {
  top: calc(1310 * var(--u));
}


.event-present {
  /* display: flex;
  align-items: flex-start;
  gap: calc(70 * var(--u));
  margin: calc(30 * var(--u)) 0; */

  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(70 * var(--u));
  margin: 0 auto;
	margin-top: calc(20 * var(--u));
}

.under{
/*	border-bottom: hsla(0,0%,0%,1.00) solid 1px;*/
	text-decoration: underline;
text-decoration-color: hsla(0,0%,0%,1.00);
text-decoration-thickness: 1px;
	text-underline-offset: calc(2 * var(--u));
/*	padding-bottom: calc(2 * var(--u));*/
}

.attention{
	display: inline-block;
    font-size: calc(16 * var(--u));
    line-height: 1.3; /* お好みの値 */
}

.small{
	margin: calc(5 * var(--u)) 0;
}

.event-section__image {
  position: relative;
  flex: 0 0 calc(200 * var(--u));
  height: calc(300 * var(--u));
}

.event-section__tokuten_info{
/*	line-height: 1.0 !important;*/
	font-size: calc(23 * var(--u));
}

.event-section__tokuten{
	margin-top: calc(30 * var(--u));
}
.tokuten{
/*
  border-width: max(1px, calc(1 * var(--u)));
  border-style: solid;
  border-color: var(--black);
*/
	box-shadow: inset 0 0 0 calc(1.0 * var(--u)) var(--black);
/*	padding: calc(5 * var(--u));*/
/*	  width: calc(600 * var(--u));    四角の横幅。数値は仮なので調整可 */
  max-width: 100%;
  margin: calc(10 * var(--u)) auto 0;
  padding: calc(30 * var(--u));

  background: var(--gray-bg); 
}

.event-section__image img,
.event-section__pora img {
  /* width: 100%; */
  display: block;
  object-fit: cover;
  height: auto;
  margin: 0 auto;
}

.event-section__image img {
  width: calc(230 * var(--u));
  /* height: calc(240 * var(--u)); */
  /* object-fit: cover; */
}
.event-section__pora {
  flex: 0 0 calc(280 * var(--u));
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, auto);
  gap: calc(70 * var(--u));
  margin: 0 auto;
}

.event-section__pora::before {
  content: "+";
  position: absolute;
  left: calc(-50 * var(--u));
  top: 50%;
  transform: translateY(-50%);
  font-size: calc(30 * var(--u));
  line-height: 1;
  width: calc(20 * var(--u));
  height: auto;
}

/* .event-section__pora img:nth-child(1), */
.event-section__pora img:nth-child(2),
.event-section__pora img:nth-child(3),
.event-section__pora img:nth-child(4) {
  position: relative;
  z-index: 3;
}

.event-section__pora img:nth-child(5) {
  position: absolute;
  top: 50%;
  left: 50%;
  width: calc(130 * var(--u));
  height: auto;
  transform: translate(-50%, -50%);
  z-index: 2;
}

.look-section__note--16::before {
   	content: "";
    position: absolute;
    bottom: calc(8 * var(--u));
    left: calc(45 * var(--u));
    width: calc(70 * var(--u));
    height: calc(2 * var(--u));
    background-color: #000;
    transform-origin: left center;
    transform: rotate(20deg);
    z-index: 999;
}

.padd{
	padding-left: calc(20 * var(--u));
}

.look-section__note--16 { top: calc(90 * var(--u)); left: calc(-30 * var(--u)); font-size: calc(15 * var(--u)); }

/*.event-section__heading,*/
.event-section__text {
  /* margin: 0 0 calc(25 * var(--u)); */
  font-size: inherit;
  font-weight: inherit;
  text-align: center;
}

.event-section__heading {
  /* margin: 0 0 calc(25 * var(--u)); */
  font-size: calc(30 * var(--u));
  font-weight: inherit;
  text-align: left;
	font-family: var(--font-serif);
/*	margin-bottom: calc(25 * var(--u));*/
	margin: 0;
}

.event-section__text {
  text-align: left;
	margin: 0;
/*  margin: calc(5 * var(--u)) auto;*/
  /* position: absolute; */
  /* top: calc(150 * var(--u)); */
  /* left: 0; */
  /* width: calc(748 * var(--u)); */
  /* left: 50%; */
  /* transform: translate(-50%, 0);  */
  /* margin: 0 auto; */
}

.event-section__detaile {
  position: relative;
  padding: calc(15 * var(--u)) 0;
  margin-top: calc(70 * var(--u));
/*  text-align: center;*/
}

/*
.event-section__detaile::before,
.event-section__detaile::after {
  content: "";
  position: absolute;
  left: 50%;
  width: calc(330 * var(--u));
  max-width: 90%;
  height: calc(2 * var(--u));
  background: #000;
  transform: translateX(-50%);
}

.event-section__detaile::before {
  top: 0;
  transform: translate(-50%, -50%);
}

.event-section__detaile::after {
  bottom: 0;
  transform: translate(-50%, 50%);
}
*/


/* pora */

.present_name {
  margin: calc(15 * var(--u)) 0 0 0;
  font-size: calc(16 * var(--u));
  line-height: 1.3;
}

.present-section__text{
  /* position: absolute;
  top: calc(550 * var(--u));
  left: 0;
  width: calc(748 * var(--u)); */
/*  padding: 0 calc(50 * var(--u));*/
  margin: calc(70 * var(--u)) 0 calc(50 * var(--u));
  text-align: left;
}
.event-section__pora__text{
  position: absolute;
  top: calc(550 * var(--u));
  left: 0;
  width: calc(748 * var(--u));
  padding: 0 calc(50 * var(--u));
  margin: 0;
}

.event-section__campaign__steps {
  position: absolute;
  top: calc(860 * var(--u));
  left: 0;
  width: calc(748 * var(--u));
  padding: 0 calc(50 * var(--u));
  text-align: center;
}

.campaign__steps__tit {
  font-size: calc(25 * var(--u));
/*  border-bottom: #000 solid calc(1 * var(--u));*/
  width: calc(300 * var(--u));
	margin: 0 auto calc(10 * var(--u));
/*  margin: 0 auto;*/
  text-align: center;
}
.campaign__steps {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: calc(15 * var(--u));
  row-gap: calc(20 * var(--u));
  align-items: center;

/*  width: calc(600 * var(--u));   */
  max-width: 100%;
  margin: calc(20 * var(--u)) auto 0;  /* 左右autoで中央寄せ */
  padding: calc(30 * var(--u));

  background: var(--gray-bg);           /* :rootで定義済みの薄いグレー */
/*
  border-width: max(1px, calc(1 * var(--u)));
  border-style: solid;
  border-color: var(--black);
*/
	box-shadow: inset 0 0 0 calc(1.0 * var(--u)) var(--black);
}

.event-section__sub{
	margin-top: calc(10 * var(--u));
	font-size: calc(20 * var(--u));
  
}

.event_date{
	margin: calc(50 * var(--u)) 0;
}

.campaign__steps__text {
  font-size: calc(18 * var(--u));
  line-height: 1.5;
  text-align: left;
}
.stepnum{
	width: calc(90 * var(--u));
}

.campaign__info {
/*  font-size: calc(18 * var(--u));*/
/*  line-height: 1.5;*/
  text-align: left;
/*margin-top: calc(20 * var(--u)) 0;
	*/
	margin: 0;
}

.campaign__info_text {
  font-size: calc(18 * var(--u));
  line-height: 1.5;
  text-align: left;
	margin-bottom:calc(30 * var(--u));
}

.event-section__info {
  position: absolute;
  top: calc(1530 * var(--u));
  left: 0;
  width: calc(748 * var(--u));
  padding: 0 calc(70 * var(--u));
  text-align: left;
}

.campaign__info__tit {
  font-size: calc(25 * var(--u));
  border-bottom: #000 solid calc(1 * var(--u));
  width: calc(150 * var(--u));
  margin: 0 auto;
  text-align: center;
}

.event-section__campaign__btn {
    position: absolute;
    top: calc(1180 * var(--u));
    left: 50%;
    transform: translateX(-50%) !important;
/*    font-size: calc(25 * var(--u));*/
/*    border: #000 solid calc(2 * var(--u));*/
/*    border-radius: 50%;*/
    width: calc(650 * var(--u));
    text-align: center;
    padding: calc(35 * var(--u)) 0;
}

.footer-section {
  top: calc(35050 * var(--u));
  left: calc(-3 * var(--u));
  width: calc(755 * var(--u));
  height: calc(414 * var(--u));
  background: var(--white);
  border-top: #000 solid calc(1 * var(--u));
  /* padding-top: calc(100 * var(--u)); */
}

.footer-section__logo {
  position: absolute;
  top: calc(100 * var(--u));
  left: calc(219 * var(--u));
  width: calc(317 * var(--u));
  height: calc(54 * var(--u));
  object-fit: contain;
}

.footer-section__links {
  position: absolute;
  top: calc(216 * var(--u));
  left: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: calc(10 * var(--u));
  width: calc(750 * var(--u));
  height: calc(61 * var(--u));
  padding: calc(16 * var(--u)) calc(69 * var(--u));
  margin: 0;
  font-family: var(--font-en);
  font-size: calc(24 * var(--u));
  line-height: 1.2;
  text-align: center;
  list-style: none;
}

.footer-section__link {
  text-decoration: underline;
}

.footer-section__copy {
  position: absolute;
  top: calc(330 * var(--u));
  left: 50%;
  transform: translateX(-50%);
  font-family: var(--font-en);
  font-size: calc(16 * var(--u));
  line-height: 1.2;
  text-align: center;
  /* width: calc(224 * var(--u)); */
}

@keyframes floatUp {
  0% {
    opacity: 0;
    transform: translateY(10px);
  }
  35% {
    opacity: 0.15;
    /* transform: translateY(22px); */
  }
  65% {
    opacity: 0.55;
    /* transform: translateY(10px); */
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fade {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
     transform: translateY(0); 
  }
}

.kv-section__title-image {
  animation: floatUp 2.5s ease-in-out forwards;
  /* animation-delay: 0.5s; */
  opacity: 0;
}

.kv-section__image {
  animation: fade 2.5s ease-in-out forwards;
  opacity: 0;
}

/*
.anim {
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 1.3s ease, transform 1s ease;
}

.anim.show {
  opacity: 1;
  transform: translateY(0);
}
*/

.anim {
	opacity: 0;
	filter: blur(8px);
	transform: translateY(10px);
	transition: 
	opacity 1s ease-out,
	filter 1s ease-out,
	transform 1s cubic-bezier(0.16, 1, 0.3, 1);
	animation-delay: 1s;
}

.anim.show {
  opacity: 1;
  transform: translateY(0);
  filter: blur(0);
}

.left {
  opacity: 0;
	filter: blur(8px);
/*  transform: translateX(-5px);*/
  transition: opacity 1.8s ease-in-out, filter 1s ease-in-out, transform 1.5s ease-in-out;
}

.left.show {
  opacity: 1;
	filter: blur(0);
/*  transform: translateX(0);*/
}

.big {
	opacity: 0;
	filter: blur(8px);
	transform: scale(0.8);
	transition: 
	opacity 1.5s ease-out,
	filter 1.2s ease-out,
	transform 1s cubic-bezier(0.16, 1, 0.3, 1);
	animation-delay: 2s;
}

.big.show {
  opacity: 1;
  filter: blur(0);
  transform: scale(1);
}

.gensei-sp__canvas {
  position: relative;
  width: calc(750 * var(--u));
  height: auto; /* ← below-kvが実寸を持つので自動計算でOKになる */
  margin: 0 auto;
  overflow: hidden;
}

.kv-section {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  height: 100dvh; /* アドレスバー分を自動考慮してくれる単位。古いブラウザは上のvhにフォールバック */
  z-index: 0;
}

.gensei-sp__below-kv {
  position: relative; /* absoluteをやめる */
  top: auto;
  left: 0;
  width: 100%;
  margin-top: 100vh;
  margin-top: 100dvh; /* KVの実寸ぶんだけ下にずらす */
  height: calc(35504 * var(--u)); /* footer-sectionの下端(top:35670u + height:414u) */
  background: var(--white); /* 覆いかぶさる時にKVが透けないように必須 */
  z-index: 1;
  transform: none; /* もう不要 */
}

@media (min-width: 768px) {
  body {
		background-image: url('https://www.dot-st.com/static/docs/babylone/pages/260716_gensei/assets/images/bg.jpg');
		background-repeat: no-repeat;
		background-position: center;
		background-attachment: fixed;
		background-size: cover;
		min-height: 100vh;
	  }

  .kv-section {
	  position: relative;
	  top: 0;
	  left: 0;
	  width: calc(750 * var(--u));
	  height: calc(1050 * var(--u));
	}

	.kv-section__title {
	  position: absolute;
	  top: calc(457 * var(--u));
	  left: calc(88 * var(--u));
	  width: calc(574 * var(--u));
	  height: calc(137 * var(--u));
	}
	
	.item_info_sec{
  margin: calc(20 * var(--u)) 0;
  /* text-align: center; */
}

.read-section {
    top: calc(1100 * var(--u));
    left: calc(4 * var(--u));
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(741 * var(--u));
    height: calc(680 * var(--u));
    text-align: center;
}

	.menu-section {
	  top: calc(1840 * var(--u));
	  left: 50%;
	  transform: translateX(-50%);
	  width: calc(613 * var(--u));
	  height: calc(375 * var(--u));
	  background: var(--gray-bg);
	}


	.kv-section__image {
	  position: absolute;
	  left: calc(-66 * var(--u));
	  top: calc(-127 * var(--u));
	  width: calc(883 * var(--u));
	  height: calc(1177 * var(--u));
	  object-fit: cover;
	}

	.kv-section__title {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: calc(574 * var(--u));
		height: calc(137 * var(--u));
		margin: 0;
	}

  .gensei-sp {
		padding: 0 calc(24 * var(--u));
		background: transparent;
	}

  .gensei-sp__canvas {
		box-shadow: 0 0 calc(40 * var(--u)) rgba(39, 37, 37, 0.08);
		background: #fff;
		margin: calc(40 * var(--u)) auto;
		position: relative;
		width: calc(750 * var(--u));
		height: calc(35860 * var(--u));
	}

  .items-section {
	  top: calc(2272 * var(--u));
	  left: 0;
	  width: calc(750 * var(--u));
	  height: calc(3672 * var(--u));
	  border-top: #000 solid calc(1 * var(--u));
	}

	.look-section {
	  top: calc(6104 * var(--u));
	  left: 0;
	  width: calc(750 * var(--u));
	  height: calc(25346 * var(--u));
	  border-top: #000 solid calc(1 * var(--u));
	  border-bottom: #000 solid calc(1 * var(--u));
	}

	.event-section {
	  top: calc(31430 * var(--u));
	  left: 0;
	  width: calc(749 * var(--u));
	  height: calc(4500 * var(--u));
	}

	.footer-section {
	  top: calc(35370 * var(--u));
	  left: calc(-3 * var(--u));
	  width: calc(755 * var(--u));
	  height: calc(414 * var(--u));
	  background: var(--white);
	  border-top: #000 solid calc(1 * var(--u));
	}

	  .gensei-sp__below-kv {
    position: static;
    margin-top: 0;
    height: auto;
    transform: none;
  }
	
	.read-section__text {
  font-size: calc(16 * var(--u));
}
	
	.menu-section__link {
  font-size: calc(25 * var(--u));
}
	
	.section-title__number {
  font-size: calc(80 * var(--u));
}

.section-title__text {
  font-size: calc(35 * var(--u));
}
	
.items-section__title{
		top: calc(-50 * var(--u));
	}

.item-card__date1 {
	top: calc(180 * var(--u));
}
	
.item-card__date{
  font-size: calc(20 * var(--u));
}

.item-card__date span{
  font-size:calc(17 * var(--u));
}
	
/*
.item-card__catch {
  font-size: calc(55 * var(--u));
}
*/
	
	.look-section__title {
    top: calc(-55 * var(--u));
    left: 0;
}
	
	.look-section__credit {
    font-size: calc(13 * var(--u));
}
	
	.look-section__note {
    font-size: calc(14 * var(--u));
}
	
	.staff-section {
    font-size: calc(18 * var(--u));
}
	
	.prof-section .name {
		    top: calc(540 * var(--u));
    font-size: calc(28 * var(--u));
}
	.prof-section .prof-read {
    font-size: calc(19 * var(--u));
}
	
	.prof-section {
    top: calc(24170 * var(--u));
}
	
	.event-section__block--campaign {
  top: calc(1150 * var(--u));
}
	
	.event-section__title {
    top: calc(-34 * var(--u));
	}
	
	.event-section__block {
    font-size: calc(16 * var(--u));
	}
	
	.footer-section__links {
    font-size: calc(19 * var(--u));
}
	
	.attention{
    font-size: calc(14 * var(--u));
}
/*
	
	  .gensei-sp__below-kv {
		position: static;
		transform: none;
	  }
*/
}
