@charset "UTF-8";
@-moz-document url-prefix() {}html {
  font-size: 10px;
}

body {
  overflow-x: hidden;
}

.l-container {
  width: 100%;
}

.l-container #feature {
  color: #000;
  font-family: 游ゴシック体, 游ゴシック Medium, Yu Gothic Medium, Yu Gothic, YuGothic, Hiragino Kaku Gothic ProN, Meiryo, sans-serif;
  font-feature-settings: "palt";
  font-weight: 400;
  font-style: normal;
  margin: 0 auto 94px;
  overflow: hidden;
  text-align: center;
  width: 100%;
}

.l-container #feature .default-img {
  image-rendering: -webkit-optimize-contrast;
  image-rendering: -moz-crisp-edges;
  width: 100%;
  height: auto;
  display: block;
}

.l-container:after{
  content: none;
}

.l-container #feature * {
  box-sizing: border-box;
  color: #000000;
}

.l-container #feature *::after {
  box-sizing: border-box;
}

.l-container #feature *::before {
  box-sizing: border-box;
}

.l-container #feature a {
  display: block;
  text-decoration: none;
  position: relative;
}

.l-container #feature a::after {
  content: "";
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.3);
  transition: all 0.4s;
}

.l-container #feature a:hover {
  cursor: pointer;
}

.l-container #feature a:hover::after {
  opacity: 1;
  transition: 0.4s;
}

.l-container #feature #sp-only{
  display: none !important;
}

.l-container #feature .target[data-fade="fadeIn"] {
  opacity: 0;
  transform: translateY(10rem);
  transition: ease-in, opacity 1s, transform 1s;
}
.l-container #feature .target[data-fade="fadeIn"][data-is-active="true"] {
  opacity: 1;
  transform: translateY(0);
}

.l-container .feature::before{
  background: url("../view/page_pc.jpg") center top / contain no-repeat;
  top: 49px;
}

/* credit */

.l-container #feature .creditList{
  height: fit-content;
  width: fit-content;
}

.l-container #feature .creditList .credit{
  display: flex;
  flex-wrap: wrap;
  gap: 12.2px 12.5px;
}

.l-container #feature .creditList li,
.l-container #feature .creditList li a{
  color: #000;
  font-family: "pragmatica", sans-serif;
  font-weight: 300;
  font-size: 14px;
  letter-spacing: 0.05em;
  line-height: 1;
  width: fit-content;
}

.l-container #feature .creditList .txt{
  position: relative;
}
.l-container #feature .creditList .price{
  letter-spacing: 0.04em;
  margin: 0 0 0 1px;
}
.l-container #feature .creditList .brand{
  letter-spacing: 0.04em;
  margin: 0 0 0 1px;
}

.l-container #feature .credit01{
  margin: 30px auto 0;
  width: 380px;
}
.l-container #feature .credit01 .credit{
  justify-content: center;
}

.l-container #feature .credit02{
  margin: 30px 0 0 -1px;
  width: 380px;
}
.l-container #feature .credit03{
  margin: auto 30px 0 0;
  width: 380px;
}
.l-container #feature .credit03 .credit{
  align-items: flex-end;
  flex-direction: column;
}

/* hero */

.l-container #feature .hero {
  margin: 0 auto;
  position: relative;
  width: 100%;
}

.l-container #feature .hero__mv{
  margin: 0 auto;
  width: 1000px;
}

.l-container #feature .hero__text{
  font-size: 14px;
  letter-spacing: 0.05em;
  line-height: 2;
  margin: 74px auto 0;
}

/* main */

.l-container #feature .sec{
  margin: 0 auto;
  position: relative;
  width: 100%;
}

.l-container #feature .sec .inner{
  margin: 0 auto;
  position: relative;
}

.l-container #feature .sec .sec__flex{
  display: flex;
}

.l-container #feature .sec .sec__img{
  position: relative;
}

/* sec01 */

.l-container #feature .sec01{
  margin: 91px auto 0;
}

.l-container #feature .sec01 .flex01{
  flex-wrap: wrap;
  margin: 100px auto 0;
  width: 840px;
}

.l-container #feature .sec01 .img03{
  width: 420px;
}

.l-container #feature .sec01 .slide01{
  margin: 0 auto;
  width: 405px;
}
.l-container #feature .sec01 .slide02{
  margin: 0;
  width: 420px;
}

/* sec02 */

.l-container #feature .sec02{
  margin: 120px auto 0;
}

.l-container #feature .sec02 .inner{
  width: 1200px;
}

.l-container #feature .sec02 .item01{
  margin: 0 auto;
  position: relative;
  width: 545px;
}
.l-container #feature .sec02 .item01::before{
  background: url("../img/text01.svg") center top / contain no-repeat;
  content: "";
  position: absolute;
  top: 95px;
  right: 0;
  height: 346.05px;
  width: 93.3px;
  z-index: 2;
}
.l-container #feature .sec02 .item02{
  margin: 100px 0 0 70px;
  width: 450px;
}
.l-container #feature .sec02 .item03{
  align-items: flex-start;
  display: flex;
  justify-content: space-between;
  margin: -370px 0 0 auto;
  width: 510px;
}

.l-container #feature .sec02 .item03 .img06:nth-of-type(1){
  margin: 60px 0 0;
  width: 330px;
}
.l-container #feature .sec02 .item03 .img06:nth-of-type(2){
  width: 170px;
}

.l-container #feature .sec02 .slide03{
  margin: 0 auto;
  position: relative;
  width: 405px;
  z-index: 1;
}
.l-container #feature .sec02 .slide04{
  margin: 120px auto 0;
  width: 420px;
}

/* sec03 */

.l-container #feature .sec03{
  margin: 74px auto 0;
}

.l-container #feature .sec03 .inner{
  width: 980px;
}

.l-container #feature .sec03 .img08{
  margin: 0 0 0 15px;
  width: 390px;
}

.l-container #feature .sec03 .item01{
  display: flex;
  flex-direction: row-reverse;
  margin: -415px 0 0 auto;
}

.l-container #feature .sec03 .slide05{
  margin: 0;
  width: 450px;
}

/* sec04 */

.l-container #feature .sec04{
  margin: 120px auto 0;
}

.l-container #feature .sec04 .sec__btn{
  margin: 0 auto;
  width: 264px;
}

.l-container #feature .sec04 .sec__logo{
  margin: 80px auto 0;
  width: 204px;
}

.l-container #feature .sec04 .sec__schedule{
  font-size: 13px;
  letter-spacing: 0.05em;
  line-height: 2;
  margin: 18px auto 0;
  text-align: center;
}
.l-container #feature .sec04 .sec__schedule span{
  font-family: "questa-grande", serif;
  font-weight: 500;
  font-size: 21px;
  letter-spacing: 0.05em;
  line-height: 1.71428;
  position: relative;
}

.pc-footer {
  margin: 0;
}

.area-header {
  max-width: 100%;
}

.breadcrumbs {
  max-width: 100%;
}

#feature-snslist {
  overflow: hidden;
}

.l-footer,
.pc-footer {
  overflow: hidden;
  padding: 0;
}

@media screen and (max-width: 1400px) {
  html {
    font-size: calc(10 * (100vw / 1400));
  }
}

@media screen and (max-width: 1401px) {

}