@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-family: "yu-gothic-pr6n", sans-serif;
  font-weight: 400;
  font-style: normal;
  margin: 0 auto;
  width: 100%;
}

.l-container #feature .default-img {
  display: block;
  height: auto;
  width: 100%;
}

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

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

.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;
  transition: all 0.3s;
}

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

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

.l-container #feature .target[data-fade="fadeIn"]{
  opacity: 0;
  transition: opacity 3s;
}
.l-container #feature .target[data-fade="fadeIn"][data-is-active="true"]{
  opacity: 1;
}

.l-container #feature .target[data-fade="parent"] .fade-child{
  opacity: 0;
  transform: translateY(50px);
  transition: opacity 1.5s cubic-bezier(.165,.84,.44,1), transform 1.5s cubic-bezier(.165,.84,.44,1);
}
.l-container #feature .target[data-fade="parent"][data-is-active="true"] .fade-child{
  opacity: 1;
  transform: translateY(0);
}

.l-container #feature .delay01{
  transition-delay: 0.3s !important;
}
.l-container #feature .delay02{
  transition-delay: 0.6s !important;
}

/* credit */

.l-container #feature .creditList{
  align-items: center;
  background: rgb(128, 128, 128,0.62);
  display: flex;
  justify-content: center;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}

.l-container #feature .flex03 .creditList,
.l-container #feature .warp12 .creditList,
.l-container #feature .flex10 .creditList,
.l-container #feature .warp29 .creditList{
  border-radius: calc(8 *(100vw / 1280));
}

.l-container #feature .creditList .credit{
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: calc(10.5 *(100vw / 1280)) 0;
  height: fit-content;
  width: fit-content;
}

.l-container #feature .creditList .credit li,
.l-container #feature .creditList .credit li a{
  color: #fff;
  display: flex;
  font-feature-settings: "palt";
  font-family: "neulis-sans", sans-serif;
  font-weight: 400;
  font-size: calc(12 *(100vw / 1280));
  letter-spacing: 0.011em;
  line-height: 1;
}
.l-container #feature .creditList.unique .credit li,
.l-container #feature .creditList.unique .credit li a{
  flex-wrap: wrap;
  font-size: calc(12.6 *(100vw / 1280));
  letter-spacing: 0.025em;
}

.l-container #feature .creditList .credit li .shop{
  font-family: "noto-sans-cjk-jp", sans-serif;
  font-weight: 300;
  font-size: calc(12 *(100vw / 1280));
}
.l-container #feature .creditList .credit li .shop .en{
  font-family: "neulis-sans", sans-serif;
  font-weight: 400;
  font-size: calc(12.6 *(100vw / 1280));
  margin: 0 calc(3 *(100vw / 1280));
  position: relative;
  top: calc(-1 *(100vw / 1280));
}

.l-container #feature .creditList .credit li .price{
  margin-left: calc(6.5 *(100vw / 1280));
}

.l-container #feature .creditList{
  opacity: 0;
  pointer-events: none;
  transition: opacity .5s;
}

.l-container #feature .sec__credit:hover .creditList,
.l-container #feature .sec__credit-slide:hover .creditList{
  opacity: 1;
}
.l-container #feature .sec__credit:hover .creditList .credit li,
.l-container #feature .sec__credit:hover .creditList .credit li a,
.l-container #feature .sec__credit-slide:hover .creditList .credit li,
.l-container #feature .sec__credit-slide:hover .creditList .credit li a{
  pointer-events: all;
}

.l-container #feature .credit02 .credit{
  margin: calc(-22 *(100vw / 1280)) 0 0;
}

.l-container #feature .credit03 .credit{
  margin: calc(-30 *(100vw / 1280)) 0 0;
}
.l-container #feature .credit03 .credit li:nth-of-type(1),
.l-container #feature .credit18 .credit li:nth-of-type(1){
  flex-wrap: wrap;
  justify-content: center;
  width: calc(200 *(100vw / 1280));
}
.l-container #feature .credit03 .credit li:nth-of-type(1) .shop,
.l-container #feature .credit18 .credit li:nth-of-type(1) .shop{
  margin: calc(-2 *(100vw / 1280)) 0 0 calc(3 *(100vw / 1280));
}
.l-container #feature .credit03 .credit li:nth-of-type(1) .price,
.l-container #feature .credit18 .credit li:nth-of-type(1) .price{
  margin: calc(5 *(100vw / 1280)) 0 calc(-5.5 *(100vw / 1280));
}

.l-container #feature .credit08 .credit li:nth-of-type(1) a{
  align-items: center;
  flex-direction: column;
}
.l-container #feature .credit08 .credit li:nth-of-type(1) .price{
  margin: calc(10 *(100vw / 1280)) 0 0;
}

/* hero */

.l-container #feature .hero{
  margin: 0 auto;
  position: sticky;
  top: 0;
  width: 100%;
  z-index: 1;
}

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

/* main */

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

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

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

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

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

/* sec01 */

.l-container #feature .sec01{
  background: #fff;
  overflow: hidden;
  padding: calc(105 *(100vw / 1280)) 0 calc(120 *(100vw / 1280));
  position: sticky;
  top: calc((calc(1295 *(100vw / 1280)) - 100vh) * -1);
  z-index: 2;
}

.l-container #feature .sec01 .bg01{
  pointer-events: none;
  position: absolute;
  margin: auto;
  top: calc(-117 *(100vw / 1280));
  left: 0;
  right: calc(4 *(100vw / 1280));
  height: calc(726 *(100vw / 1280));
  width: calc(1130 *(100vw / 1280));
  z-index: 3;
}
.l-container #feature .sec01 .bg02{
  margin: auto;
  pointer-events: none;
  position: absolute;
  bottom: calc(-147 *(100vw / 1280));
  left: 0;
  right: 0;
  height: calc(582 *(100vw / 1280));
  width: calc(1232 *(100vw / 1280));
  z-index: 1;
}

.l-container #feature .sec01 .flex01{
  align-items: flex-start;
  justify-content: space-between;
  left: calc(-8 *(100vw / 1280));
  margin: 0 auto;
  position: relative;
  width: calc(950 *(100vw / 1280));
  z-index: 2;
}

.l-container #feature .sec01 .flex02{
  justify-content: space-between;
  margin: calc(174 *(100vw / 1280)) auto 0 calc(127 *(100vw / 1280));
  position: relative;
  width: calc(1027 *(100vw / 1280));
  z-index: 2;
}

.l-container #feature .sec01 .sec__text{
  margin: calc(50 *(100vw / 1280)) 0 0;
  width: calc(413.86 *(100vw / 1280));
}

.l-container #feature .sec01 .sec__novelty{
  position: relative;
  width: calc(212 *(100vw / 1280));
}
.l-container #feature .sec01 .sec__novelty:nth-of-type(1)::before{
  background: url("../img/text02.svg") center top / contain no-repeat;
  content: "";
  margin: auto;
  position: absolute;
  top: calc(-22 *(100vw / 1280));
  left: calc(4 *(100vw / 1280));
  right: 0;
  height: calc(30.4 *(100vw / 1280));
  width: calc(133.4 *(100vw / 1280));
}

.l-container #feature .sec01 .sec__novelty .sec__novelty-text{
  background: #bdd47b;
  border-radius: calc(120 *(100vw / 1280));
  color: #fff;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  left: 0;
  text-align: center;
  transition: opacity .5s;
  height: 100%;
  width: calc(211 *(100vw / 1280));
}
.l-container #feature .sec01 .sec__novelty:nth-of-type(2) .sec__novelty-text{
  background: #99dae3;
}
.l-container #feature .sec01 .sec__novelty:nth-of-type(3) .sec__novelty-text{
  background: #f2f2f2;
  color: #f1acbf;
}
.l-container #feature .sec01 .sec__novelty:nth-of-type(4) .sec__novelty-text{
  background: #f1acbf;
}
.l-container #feature .sec01 .sec__novelty:hover .sec__novelty-text{
  opacity: 1;
  pointer-events: all;
}

.l-container #feature .sec01 .sec__novelty-text p .num{
  font-family: "neulis-sans", sans-serif;
}

.l-container #feature .sec01 .sec__novelty-text p:nth-of-type(1){
  font-family: "neulis-sans", sans-serif;
  font-weight: 600;
  font-size: calc(20 *(100vw / 1280));
  left: calc(1 *(100vw / 1280));
  letter-spacing: 0.038em;
  line-height: calc(21 *(100vw / 1280));
  margin: calc(126 *(100vw / 1280)) auto 0;
  position: relative;
}
.l-container #feature .sec01 .sec__novelty-text p:nth-of-type(2){
  font-family: "noto-sans-cjk-jp", sans-serif;
  font-weight: 500;
  font-size: calc(10 *(100vw / 1280));
  letter-spacing: -0.022em;
  line-height: 1.4;
  margin: calc(8 *(100vw / 1280)) auto 0;
}
.l-container #feature .sec01 .sec__novelty-text p:nth-of-type(2) .en{
  font-family: "neulis-sans", sans-serif;
  font-size: calc(10.5 *(100vw / 1280));
}
.l-container #feature .sec01 .sec__novelty-text p:nth-of-type(2) .num{
  font-size: calc(11.23 *(100vw / 1280));
}
.l-container #feature .sec01 .sec__novelty-text p:nth-of-type(3){
  font-family: "noto-sans-cjk-jp", sans-serif;
  font-weight: 500;
  font-size: calc(8.5 *(100vw / 1280));
  letter-spacing: -0.022em;
  line-height: 1.3;
  margin: calc(8 *(100vw / 1280)) auto 0;
}
.l-container #feature .sec01 .sec__novelty-text p:nth-of-type(3) .en{
  font-family: "neulis-sans", sans-serif;
  font-size: calc(8.92 *(100vw / 1280));
  letter-spacing: -0.007em;
}

.l-container #feature .sec01 .sec__novelty:nth-of-type(2) .sec__novelty-text p:nth-of-type(1){
  margin: calc(136 *(100vw / 1280)) auto 0;
}
.l-container #feature .sec01 .sec__novelty:nth-of-type(3) .sec__novelty-text p:nth-of-type(1){
  left: calc(3 *(100vw / 1280));
  margin: calc(111 *(100vw / 1280)) auto 0;
}
.l-container #feature .sec01 .sec__novelty:nth-of-type(4) .sec__novelty-text p:nth-of-type(1){
  margin: calc(131 *(100vw / 1280)) auto 0;
}

.l-container #feature .sec01 .sec__novelty:nth-of-type(2) p:nth-of-type(2){
  margin: calc(9 *(100vw / 1280)) auto 0;
}
.l-container #feature .sec01 .sec__novelty:nth-of-type(3) p:nth-of-type(2){
  margin: calc(11 *(100vw / 1280)) auto 0;
}

.l-container #feature .sec01 .sec__novelty:nth-of-type(3) .sec__novelty-text p:nth-of-type(3),
.l-container #feature .sec01 .sec__novelty:nth-of-type(4) .sec__novelty-text p:nth-of-type(3){
  line-height: 1.5;
  margin: calc(9 *(100vw / 1280)) auto 0;
}

.l-container #feature .sec01 .img01{
  width: calc(432 *(100vw / 1280));
}

/* sec02 */

.l-container #feature .sec02{
  background: #fff;
  border-top: calc(0.99 *(100vw / 1280)) solid #000;
  padding: 0 0 calc(62 *(100vw / 1280));
  position: sticky;
  z-index: 3;
}

.l-container #feature .sec02 .sec__fixed{
  margin: calc(36 *(100vw / 1280)) 0 0 calc(27 *(100vw / 1280));
  padding: 0 0 calc(200 *(100vw / 1280));
  position: sticky;
  top: calc(36 * (100vw / 1280) + 79.8px);
  width: calc(210.1 *(100vw / 1280));
}

.l-container #feature .sec02 .sec__fixed-text{
  color: #2b1d0a;
  display: flex;
  flex-direction: column;
  font-family: "neulis-sans", sans-serif;
  font-weight: 800;
  font-size: calc(15 *(100vw / 1280));
  gap: calc(6.5 *(100vw / 1280)) 0;
  letter-spacing: 0.038em;
  line-height: 1;
  margin: calc(35 *(100vw / 1280)) 0 0 calc(5 *(100vw / 1280));
}
.l-container #feature .sec02 .sec__fixed-text .href-top:hover{
  color: #f1acbf;
  cursor: pointer;
}
.l-container #feature .sec02 .sec__fixed-text a:nth-of-type(1):hover{
  color: #6babb5;
}
.l-container #feature .sec02 .sec__fixed-text a:nth-of-type(2):hover{
  color: #b4d171;
}

.l-container #feature .sec02 .sec__flex{
  margin: 0 0 0 auto;
  position: relative;
  width: fit-content;
}

.l-container #feature .sec02 .flex01{
  margin: calc(-428 *(100vw / 1280)) 0 0 auto;
}
.l-container #feature .sec02 .flex02::before,
.l-container #feature .sec02 .flex05::before,
.l-container #feature .sec02 .flex06::before,
.l-container #feature .sec02 .flex08::before,
.l-container #feature .sec02 .flex09::before{
  background: #fff;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: calc(2 *(100vw / 1280));
  width: 100%;
  z-index: 2;
}

.l-container #feature .sec02 .sec__flex .sec__img{
  width: calc(426.6 *(100vw / 1280));
}

.l-container #feature .sec02 .flex03{
  align-items: flex-start;
  margin: calc(97 *(100vw / 1280)) calc(80 *(100vw / 1280)) 0 auto;
}
.l-container #feature .sec02 .flex03 .sec__img:nth-of-type(1){
  margin: calc(274 *(100vw / 1280)) calc(-50 *(100vw / 1280)) 0 0;
  width: calc(283.5 *(100vw / 1280));
  z-index: 2;
}
.l-container #feature .sec02 .flex03 .sec__img:nth-of-type(2){
  width: calc(426.6 *(100vw / 1280));
  z-index: 1;
}

.l-container #feature .sec02 .flex04{
  margin: calc(111 *(100vw / 1280)) 0 0 auto;
}

.l-container #feature .sec02 .warp12{
  margin: calc(66 *(100vw / 1280)) calc(60 *(100vw / 1280)) 0 auto;
  width: calc(520 *(100vw / 1280));
}

.l-container #feature .sec02 .flex07{
  margin: calc(77 *(100vw / 1280)) 0 0 auto;
}

.l-container #feature .sec02 .flex10{
  align-items: flex-start;
  margin: calc(86 *(100vw / 1280)) calc(74 *(100vw / 1280)) 0 auto;
}
.l-container #feature .sec02 .flex10 .sec__img:nth-of-type(1){
  width: calc(375 *(100vw / 1280));
  z-index: 1;
}
.l-container #feature .sec02 .flex10 .sec__img:nth-of-type(2){
  margin: calc(338 *(100vw / 1280)) 0 0 calc(-81 *(100vw / 1280));
  width: calc(390 *(100vw / 1280));
  z-index: 2;
}
.l-container #feature .sec02 .flex11{
  margin: calc(72 *(100vw / 1280)) 0 0 auto;
}

.l-container #feature .sec02 .warp29{
  margin: calc(79 *(100vw / 1280)) calc(61 *(100vw / 1280)) 0 auto;
  width: calc(386 *(100vw / 1280));
}

.l-container #feature .sec02 .sec__slide{
  margin: 0;
  width: calc(426.6 *(100vw / 1280));
}
.l-container #feature .sec02 .wrap04 p,
.l-container #feature .sec02 .flex04 .sec__img:nth-of-type(2) p,
.l-container #feature .sec02 .flex09 .sec__img:nth-of-type(2) p,
.l-container #feature .sec02 .flex11 .sec__img p{
  color: #fff;
  font-family: "neulis-sans", sans-serif;
  font-weight: 500;
  font-size: calc(13 *(100vw / 1280));
  letter-spacing: 0.063em;
  top: calc(120 *(100vw / 1280));
  right: calc(-314 *(100vw / 1280));
  position: absolute;
  transform: rotate(90deg);
  transform-origin: 0;
  white-space: nowrap;
}
.l-container #feature .sec02 .flex04 .sec__img:nth-of-type(2) p{
  top: calc(118 *(100vw / 1280));
  right: calc(-318 *(100vw / 1280));
}
.l-container #feature .sec02 .flex09 .sec__img:nth-of-type(2) p{
  top: calc(95 *(100vw / 1280));
  right: calc(-361 *(100vw / 1280));
}
.l-container #feature .sec02 .flex11 .sec__img:nth-of-type(1) p{
  top: calc(121 *(100vw / 1280));
  left: calc(21 *(100vw / 1280));
  right: initial;
}
.l-container #feature .sec02 .flex11 .sec__img:nth-of-type(2) p{
  top: calc(97 *(100vw / 1280));
  right: calc(-361 *(100vw / 1280));
}

.l-container #feature .sec02 .flour01{
  position: absolute;
  top: calc(-103*(100vw / 1280));
  left: calc(-10*(100vw / 1280));
  width: calc(66 *(100vw / 1280));
}
.l-container #feature .sec02 .flour02{
  position: absolute;
  top: calc(-22 *(100vw / 1280));
  right: calc(17 *(100vw / 1280));
  width: calc(56 *(100vw / 1280));
}
.l-container #feature .sec02 .flour03{
  position: absolute;
  bottom: calc(-35*(100vw / 1280));
  left: calc(248*(100vw / 1280));
  width: calc(60 *(100vw / 1280));
  z-index: 3;
}
.l-container #feature .sec02 .flour04{
  position: absolute;
  top: calc(322*(100vw / 1280));
  right: calc(31*(100vw / 1280));
  width: calc(58 *(100vw / 1280));
  z-index: 2;
}
.l-container #feature .sec02 .flour05{
  position: absolute;
  bottom: calc(-50*(100vw / 1280));
  left: calc(180*(100vw / 1280));
  width: calc(66 *(100vw / 1280));
  z-index: 2;
}
.l-container #feature .sec02 .flour06{
  position: absolute;
  top: calc(-34 *(100vw / 1280));
  left: calc(-22 *(100vw / 1280));
  width: calc(60 *(100vw / 1280));
  z-index: 2;
}
.l-container #feature .sec02 .flour07{
  position: absolute;
  top: calc(-39 *(100vw / 1280));
  left: calc(253 *(100vw / 1280));
  width: calc(58 *(100vw / 1280));
  z-index: 2;
}
.l-container #feature .sec02 .flour08{
  position: absolute;
  top: calc(396 *(100vw / 1280));
  left: calc(-42 *(100vw / 1280));
  width: calc(66 *(100vw / 1280));
  z-index: 2;
}
.l-container #feature .sec02 .flour09{
  position: absolute;
  top: calc(-112 *(100vw / 1280));
  left: calc(-54 *(100vw / 1280));
  width: calc(54 *(100vw / 1280));
  z-index: 2;
}
.l-container #feature .sec02 .flour10{
  position: absolute;
  top: calc(73 *(100vw / 1280));
  right: calc(-23 *(100vw / 1280));
  width: calc(48 *(100vw / 1280));
  z-index: 2;
}
.l-container #feature .sec02 .flour11{
  position: absolute;
  top: calc(542 *(100vw / 1280));
  left: calc(119 *(100vw / 1280));
  width: calc(58 *(100vw / 1280));
}

.l-container #feature .sec02 .sec__staff{
  color: #2b1d0a;
  font-family: "neulis-sans", sans-serif;
  font-weight: 500;
  font-size: calc(12 *(100vw / 1280));
  letter-spacing: 0.024em;
  line-height: calc(21.8 *(100vw / 1280));
  position: absolute;
  bottom: calc(-4.5 *(100vw / 1280));
  left: calc(33 *(100vw / 1280));
}
.l-container #feature .sec02 .sec__staff span{
  display: block;
  font-weight: 600;
  font-size: calc(15 *(100vw / 1280));
  margin: 0 0 calc(1 *(100vw / 1280));
}

/* slick */

.l-container #feature .slick-dots{
  display: flex;
  gap: 0 calc(4 *(100vw / 1280));
  top: calc(13.5 *(100vw / 1280));
  bottom: initial;
  left: initial;
  right: calc(23 *(100vw / 1280));
  width: fit-content;
}

.l-container #feature .slide02 .slick-dots{
  top: calc(14.5*(100vw / 1280));
  left: calc(11.5*(100vw / 1280));
  right: initial;
}

.l-container #feature .slick-dots li{
  box-sizing: border-box;
  margin: 0;
  height: calc(6.56 *(100vw / 1280));
  width: calc(6.56 *(100vw / 1280));
}
.l-container #feature .slick-dots li button{
  margin: 0;
  padding: 0;
  height: 100%;
  width: 100%;
}
.l-container #feature .slick-dots li button::before{
  border: calc(1 *(100vw / 1280)) solid #fff;
  border-radius: calc(10 *(100vw / 1280));
  content: "";
  opacity: 1;
  height: 100%;
  width: 100%;
}
.l-container #feature .slick-dots li.slick-active button:before{
  background: #fff;
  opacity: 1;
}

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

}

.l-footer{
  padding: 0;
  position: relative;
  z-index: 4;
}
.pc-footer{
  margin: 0;
}

/* .l-container #feature{
  cursor: url("../img/cursor01.png"), auto;
}
.l-container #feature img:hover,
.l-container #feature .sec__credit:hover,
.l-container #feature .sec__credit-slide:hover{
  cursor: url("../img/cursor02.png"), auto;
} */

.l-container #feature{
  cursor: none;
}

#cursor{
  pointer-events: none;
  position: fixed;  
  z-index: 15;
  height: calc(66 *(100vw / 1280));
  width: calc(66 *(100vw / 1280));
}