@charset "utf-8";
#top {
  /* background: #fff; */
}
/*--------------------------------

Mainvisual
---------------------------------*/
.sec-mainvisual {
  display: flex;
  align-items: flex-end;
  width: 100%;
  aspect-ratio: 465 / 650;
  padding-bottom: 50px;
  position: relative;
}
.sec-mainvisual video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sec-mainvisual h1 {
  position: relative;
  z-index: 1;
}
/*--------------------------------

Intro
---------------------------------*/
.sec-intro {
  padding-top: 30px;
  text-align: center;
}
.sec-intro >figure:first-of-type {
  margin-bottom: 110px;
}
.sec-intro .yellow-block {
  margin-top: 60px;
  padding: 50px 0;
  background: linear-gradient(117deg, rgba(255, 255, 245, .8), transparent 30%), linear-gradient(rgba(245, 244, 201, .8), rgba(254, 248, 232, .8));
}
.sec-intro .yellow-block > * + * {
  margin-top: 30px;
}
.sec-intro .brand-accordion {
  display: grid;
  grid-template-rows: 400px;
  position: relative;
}
.sec-intro .brand-accordion:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100px;
  background: linear-gradient(to bottom, transparent, #ebe0b0 70%);
  z-index: 0;
}
.sec-intro .brand-accordion.is-open {
  grid-template-rows: 1fr;
}
.sec-intro .brand-accordion p {
  overflow: hidden;
}
.sec-intro .brand-accordion .btn {
  position: absolute;
  bottom: -25px;
  left: 50%;
  transform: translateX(-50%);
  width: 260px;
  height: 50px;
  background: url(../img/top/intro-btn-open.jpg) no-repeat center center / contain;
  z-index: 1;
}
.sec-intro .brand-accordion.is-open .btn {
  transition-delay: 0.2s;
  background: url(../img/top/intro-btn-close.jpg) no-repeat center center / contain;
}
.sec-intro .pink-block {
  padding: 125px 50px 50px;
  background: linear-gradient(rgba(253, 242, 235, .8), rgba(251, 229, 236, .8));
}
.sec-intro .pink-block .app-accordion {
  margin-block: 50px 100px;
  position: relative;
}
.sec-intro .pink-block .app-accordion button {
  position: relative;
  z-index: 1;
}
.sec-intro .pink-block .app-accordion .content {
  position: relative;
  background: #fff;
  border-radius: 0 0 30px 30px;
  border: 10px solid #fff;
  margin-top: -40px;
  display: grid;
  grid-template-rows: 0fr;
  transition: all .2s;

}
.sec-intro .pink-block .app-accordion.is-open .content{
  padding-top: 30px;
  grid-template-rows: 1fr;
}
.sec-intro .pink-block .app-accordion .content .inner{
  position: relative;
  overflow: hidden;
}
.sec-intro .pink-block .app-accordion a {
  width: min(496px, 76.3%);
  position: absolute;
  bottom: 13.5%;
  left: 50%;
  transform: translateX(-50%);
}
/*--------------------------------

Popup
---------------------------------*/
.sec-popup {
  position: relative;
}
.sec-popup a {
  width: min(550px, 73.3%);
  position: absolute;
  bottom: 2.2%;
  left: 50%;
  transform: translateX(-50%);
}
/*--------------------------------

Fashion
---------------------------------*/
.sec-fashion {
  position: relative;
}
.sec-fashion nav {
  margin-top: 30px;
}
.sec-fashion nav a {
  display: block;
  margin-top: -40px;
  position: relative;
}
.sec-fashion nav a:last-of-type {
  margin-top: 50px;
}

/*--------------------------------

Others
---------------------------------*/
.sec-others {
  margin-top: 0;
  padding-top: 150px;
}
