@charset "UTF-8";

/*-------------------------
 common
-------------------------*/
.l-container {
  width: 100%;
  margin: 0;
}

#feature {
  margin: 0 auto;
  font-feature-settings: "palt";
  text-align: center;
  overflow: clip;
  font-family: "seiwa-do-l", sans-serif;
  font-weight: 400;
  font-style: normal;
  min-width: 1400px;
  width: 100%;
}

.feature-inner {
  margin: 0 auto 205px;
}

.feature img {
  width: 100%;
  height: auto;
  display: block;
}

.feature a {
  text-decoration: none;
  transition: all 0.3s ease-in-out;
}

.feature a:link,
.feature a:visited {
  color: #000;
}

.feature .item a:hover,
.feature .btn a:hover {
  opacity: 0.7;
}

.feature figure a:hover {
  opacity: 0.7;
  background-color: rgba(255, 255, 255, 1);
}

.feature a:hover {
  opacity: 0.7;
}

.feature .section {
  position: relative;
  margin: 90px auto 0;
  width: 100%;
}


/*-------------------------
 fade
-------------------------*/

/** bottom **/
#feature .fadeUp {
  clip-path: inset(100% 0 0 0);
  opacity: 1;
  transition: 0.5s 0s cubic-bezier(0.4, 0, 0.2, 1);
}

#feature .fadeUp.is_show {
  clip-path: inset(0);
}

#feature .fixed{
  opacity: 0;
  transition: all .8s;
  position: fixed;
  margin: auto;
  top: 0;
  bottom: 0;
  right: 30px;
  height: fit-content;
  width: 18px;
}
#feature .fixed.show{
  opacity: 1;
  z-index: 10;
}

/*-------------------------
  animation
-------------------------*/
.scroll-infinity__wrap {
  display: flex;
  overflow: hidden;
}

.scroll-infinity__list {
  display: flex;
  list-style: none;
  padding: 0
}

.scroll-infinity__list--left {
  animation: infinity-scroll-left 100s infinite linear 0.5s both;
}

.scroll-infinity__item {
  width: 363px;
  margin: 0 2.5px;
}

.scroll-infinity__item>img {
  width: 100%;
}

.scroll-infinity__list--left {
  animation: infinity-scroll-left 80s infinite linear 0.5s both;
}

@keyframes infinity-scroll-left {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-100%);
  }
}

.fade-slider {
  position: relative;
  width: 100%;
  height: 352px;
  overflow: hidden;
}

.fade-slider figure {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: none;
}

.fade-slider figure img {
  width: 100%;
  height: auto;
}


/*-------------------------
  font
-------------------------*/
#feature .creditList ul li {
  font-family: "meno-banner", serif;
  font-weight: 300;
  font-style: normal;
  font-size: 16px;
  line-height: 2.25;
  color: #666666;
}

#feature .staffcredit {
  font-family: "ivyora-display",
    sans-serif;
  font-weight: 300;
  font-style: normal;
}

/*-------------------------
  credit
-------------------------*/
#feature .creditList {
  margin-top: 10px;
}

#feature .set--5 .creditList,
#feature .set--10 .creditList{
  margin-top: 13px;
}

#feature .creditList a {
  font-size: 15px;
  color: #666666;
}

#feature .creditList ul {
  display: flex;
  justify-content: center;
}

#feature .creditList ul li {
  margin: 0 4px;
}

/*-------------------------
  top
-------------------------*/
#feature .hero {
  object-fit: cover;
  margin: 0 auto 91px;
  width: 100%;
  overflow: hidden;
  position: relative;
}

#feature .hero-text p {
  font-size: 16px;
  font-weight: 300;
  margin: 2.6rem 0 0 0;
  letter-spacing: 0.01em;
  line-height: 2.5;
  color: #040000;
}

/*-------------------------
  content
-------------------------*/

#feature .scroll-infinity {
  margin-top: 173px;
}

#feature .slider {
  border: solid 0.1rem #000;
}

#feature .sec__flex {
  display: flex;
  justify-content: center;
}

#feature .set--1 {
  margin-top: 100px;
}

#feature .set--2 {
  margin-top: 173px;
}

#feature .set--5 {
  margin: 175px auto 0 35px;
}

#feature .set--6_2 {
  margin: 0 auto;
}

#feature .set--7 {
  margin: 182px -368px 0 auto;
}

#feature .set--8 {
  width: 390px;
  margin: 178px auto 0;
  transform: translateX(-332px);
}

#feature .set--9 {
  width: 440px;
  margin: 141px auto 0;
  transform: translateX(5px);
}

#feature .set--10 {
  width: 755.2184px;
  margin: 164px auto 0;
}

#feature .set--11 {
  margin: 176px auto 0;
}

#feature .set--1 .sec__flex {
  gap: 5px;
}

#feature .set--4 .sec__flex {
  flex-wrap: wrap;
  width: 600px;
  margin: 152px auto 0;
  gap: 15px 0;
}

#feature .set--6_2 .sec__flex {
  margin: 171px auto 0;
  flex-direction: row-reverse;
  gap: 72px;
}

#feature .set--7 .sec__flex {
  gap: 10px;
}

#feature .set--10 .sec__flex {
  gap: 5px;
}

#feature .img01 {
  width: 350px;
  margin: 0 auto;
}

#feature .img02 {
  width: 375px;
  margin: 0;
}

#feature .img03 {
  width: 375px;
  margin: 0;
}

#feature .img04 {
  width: 450px;
  margin: 0 auto;
}

#feature .img05 {
  width: 361.6751px;
  margin: 0;
}

#feature .img06 {
  width: 361.6751px;
  margin: 0;
}

#feature .img07 {
  width: 380px;
  margin: 179px auto 0;
}

#feature .img08 {
  width: 300px;
  margin: 0;
}

#feature .img09 {
  width: 300px;
  margin: 0;
}

#feature .img10 {
  width: 300px;
  margin: 0;
}

#feature .img11 {
  width: 300px;
  margin: 0;
}

#feature .img12 {
  width: 440px;
  margin: 0 auto;
}

#feature .img13 {
  width: 440px;
  margin: 10px auto;
}

#feature .img14 {
  width: 450px;
  margin: 0;
}

#feature .img15 {
  width: 350px;
  margin: 420px auto 0;
}

#feature .img16 {
  width: 510.6817px;
  margin: 0;
}

#feature .img17 {
  width: 510.6817px;
  margin: 0;
}

#feature .img18 {
  width: 390px;
  margin: 0;
}

#feature .img19 {
  width: 600px;
  margin: 175px auto 0;
}

#feature .img20 {
  margin: 0;
}

#feature .img21 {
  width: 375px;
  margin: 0;
}

#feature .img22 {
  width: 375px;
  margin: 0;
}

#feature .img23 {
  width: 360px;
  margin: 0 auto;
}

#feature .staffcredit {
  margin: 151px auto 0;
  font-size: 15px;
  letter-spacing: 0.05em;
  line-height: 2;
  transform: translateX(-5px);
}

#feature .btn {
  margin: 115px auto 0;
  width: 361.1367px;
}

#feature .btn a {
  font-size: 2.1rem;
  font-weight: 400;
  letter-spacing: 0.1rem;
  border-bottom: double 3px #000;
  line-height: 2;
  padding-bottom: 0.5rem;
}