@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Anton&family=Noto+Sans+JP:wght@100..900&display=swap");
/*------------------------------------------
  Base Layout
------------------------------------------*/
.lp-main {
  position: relative;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 4.2666666667vw;
  font-weight: 700;
  color: #231815;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
.lp-main__contents {
  position: relative;
  overflow: hidden;
}
.lp-main section {
  position: relative;
}
.lp-main img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}
.lp-main a {
  color: #231815;
  outline: none;
}
.lp-main h2 {
  font-size: 100%;
}

@media only screen and (min-width: 768px) {
  .lp-main {
    position: relative;
    font-size: 16px;
  }
  .lp-main__in {
    display: flex;
    flex-wrap: wrap;
  }
  .lp-main__contents {
    width: 375px;
    z-index: 10;
  }
  .lp-main a:hover {
    text-decoration: none;
  }
  .lp-main .hover-opacity {
    transition: opacity 0.3s;
  }
  .lp-main .hover-opacity:hover {
    opacity: 0.7;
    text-decoration: none;
  }
  .lp-main .hover-zoom__image {
    transition: transform 0.4s;
  }
  .lp-main .hover-zoom:hover .hover-zoom__image {
    transform: scale(1.2);
  }
}
.is--pc {
  display: none;
}

@media only screen and (min-width: 768px) {
  .is--sp {
    display: none;
  }
  .is--pc {
    display: block;
  }
}
body > .wrapper {
  overflow: visible;
}

/*------------------------------------------
  layout
------------------------------------------*/
.l-inner {
  padding: 0 1.25em;
  position: relative;
}

.l-pcLeft {
  display: none;
}

@media only screen and (min-width: 768px) {
  .l-pcLeft {
    display: block;
    position: sticky;
    top: 0;
    left: 0;
    height: 100vh;
    width: calc(85% - 375px);
    z-index: 1;
    background-color: #66CFEC;
    background-image: url(../images/pc-visual.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: auto 100%;
  }
}
.l-pcRight {
  display: none;
}

@media only screen and (min-width: 768px) {
  .l-pcRight {
    display: block;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 70px;
    position: sticky;
    top: 0;
    height: 100vh;
    width: 15%;
    background: #66CFEC;
  }
}
/*------------------------------------------
  Component
------------------------------------------*/
.nowrap {
  white-space: nowrap;
}

.c-button {
  display: inline-block;
  width: 13.75em;
}
.c-button.--large {
  width: 19.375em;
}

.c-item {
  position: relative;
  display: block;
  margin-bottom: 0.625em;
}
.c-item:last-child {
  margin-bottom: 0;
}

.c-itemImage {
  position: relative;
  max-width: 19.375em;
  z-index: 1;
}
.c-itemImage img {
  width: 100%;
}
.c-itemImage.--left {
  margin-left: auto;
}

.c-itemText {
  position: absolute;
  z-index: 2;
}
.c-itemText__inner {
  width: 9.75em;
  max-width: 100%;
  letter-spacing: 0.04em;
}
.c-itemText__inner.--w100 {
  width: 100%;
}
.c-itemText__inner.--flex {
  display: flex;
  align-items: center;
  gap: 0.4em;
}
.c-itemText__inner.--flex .c-itemText__title {
  margin-bottom: 0;
  padding-top: 0.3em;
}
.c-itemText__title {
  font-size: 0.8125em;
  line-height: 1.46;
  margin-bottom: 0.3em;
}
.c-itemText__title.--small {
  font-size: 0.75em;
}
.c-itemText__title .sub {
  font-size: 85%;
}
.c-itemText__price {
  display: inline-block;
  position: relative;
  color: #1C61AD;
}
.c-itemText__price p {
  display: inline-flex;
  vertical-align: middle;
  gap: 0.125em;
  line-height: 1.4;
  align-items: center;
  border-bottom: 2px solid;
}
.c-itemText__price p span {
  font-size: 0.625em;
}
.c-itemText__price p .num {
  font-size: 0.875em;
}
.c-itemText__price.--small p span {
  font-size: 0.5625em;
}
.c-itemText__price.--small p .num {
  font-size: 0.8125em;
}
.c-itemText__price-arrow {
  position: absolute;
  bottom: -0.3em;
  left: 100%;
  width: 1.875em;
  margin-left: 0.6875em;
}
.c-itemText__price-arrow.--small {
  width: 1.625em;
}

.--left-start .c-item:nth-child(odd) .c-itemText {
  left: 2em;
}
.--left-start .c-item:nth-child(even) .c-itemText {
  left: 50%;
}

.--left-start2 .c-item:nth-child(odd) .c-itemText {
  left: 2em;
}
.--left-start2 .c-item:nth-child(even) .c-itemText {
  left: 58%;
}

.--right-start .c-item:nth-child(odd) .c-itemText {
  left: 50%;
}
.--right-start .c-item:nth-child(even) .c-itemText {
  left: 2em;
}

.--right-start2 .c-item:nth-child(odd) .c-itemText {
  left: 58%;
}
.--right-start2 .c-item:nth-child(even) .c-itemText {
  left: 2em;
}

.c-brand {
  position: relative;
}
.c-brand__more {
  text-align: center;
}
.c-brand__more img {
  animation: poyopoyo 2s ease-out infinite;
}
.c-brand__illust {
  position: absolute;
}

/*------------------------------------------
  メインビジュアル
------------------------------------------*/
.mv {
  position: relative;
  background: #FFD800;
  text-align: center;
}
.mv-illust {
  opacity: 0;
  position: absolute;
  left: 0;
  top: 1.5625em;
  width: 100%;
}
.mv-illust img {
  width: 13.625em;
}
.mv-title {
  opacity: 0;
  position: absolute;
  left: 0;
  bottom: 1.1875em;
  width: 100%;
  margin: 0;
  font-size: 100%;
}
.mv-title img {
  width: 19.5625em;
}
.mv.is--active .mv-illust {
  opacity: 1;
  transition: 1s 2s;
}
.mv.is--active .mv-title {
  opacity: 1;
  transition: 1s 1s;
}

.mv2 {
  position: relative;
  background: #FFD800;
  text-align: center;
}
.mv2-illust {
  position: absolute;
  left: 0;
  bottom: 4em;
  width: 100%;
  text-align: center;
  opacity: 0;
  transform: translateX(80%);
}
.mv2-illust img {
  width: 21.5em;
}
.mv2-title {
  opacity: 0;
  position: absolute;
  left: 0;
  top: 1.6875em;
  width: 100%;
  margin: 0;
  font-size: 100%;
}
.mv2-title img {
  width: 19.9375em;
}
.mv2.is--active .mv2-illust {
  opacity: 1;
  transform: translateX(0);
  transition: 1s 1s;
}
.mv2.is--active .mv2-title {
  opacity: 1;
  transition: 1s 2s;
}

/*------------------------------------------
  section 共通
------------------------------------------*/
.has--frame:before {
  content: "";
  background-repeat: no-repeat;
  background-position: center top;
  background-size: 100%;
  position: absolute;
  width: 100%;
  height: 3.125em;
  left: 0;
  bottom: 0;
  margin-bottom: -2px;
}

.check {
  text-align: center;
}

.illust {
  position: absolute;
  pointer-events: none;
}

/*------------------------------------------
  リード
------------------------------------------*/
.sec01 {
  padding-top: 2.25em;
  background: #FFD800;
  border-bottom: 0.625em solid #E73736;
  overflow: hidden;
}
.sec01__inner {
  border-bottom: 0.625em solid #1C61AD;
  padding-bottom: 9.75em;
  background-image: url(../images/sec01-bg.png);
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: 100%;
}
.sec01 .lead {
  text-align: center;
}
.sec01 .lead__title {
  margin-bottom: 1.125em;
}
.sec01 .lead__title img {
  width: 16.705em;
}
.sec01 .lead p {
  font-size: 0.75em;
  color: #334C9E;
  line-height: 1.928;
}
.sec01 .button {
  text-align: center;
  margin-top: 1.875em;
}
.sec01 .illust-car {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 6.6875em;
  background-image: url(../images/illust01.png);
  background-repeat: repeat-x;
  background-position: 0 0;
  background-size: auto 100%;
  animation: carLoop 10s linear infinite;
}

/*------------------------------------------
  コラボレーション
------------------------------------------*/
.sec02 {
  padding: 2.125em 0 6.875em;
  background: #ffffff;
}
.sec02:before {
  background-image: url(../images/sec02-frame.png);
}
.sec02__head .date {
  text-align: center;
  margin-bottom: 1.25em;
}
.sec02__head .date img {
  width: 19.875em;
}
.sec02__head .title {
  margin: 0;
}
.sec02 .item-list .c-itemImage {
  max-width: 100%;
}
.sec02 .item-list .item01 {
  padding-bottom: 4.3125em;
}
.sec02 .item-list .item01 .c-itemText {
  bottom: 0;
}
.sec02 .item-list .item02 {
  padding-bottom: 4.3125em;
}
.sec02 .item-list .item02 .c-itemText {
  bottom: 0;
}
.sec02 .item-list .item03 {
  padding-bottom: 3.375em;
}
.sec02 .item-list .item03 .c-itemText {
  bottom: 0;
}
.sec02 .item-list .item04 {
  padding-bottom: 3.375em;
}
.sec02 .item-list .item04 .c-itemText {
  bottom: 0;
}
.sec02 .illust01 {
  width: 4.8em;
  left: 1.5em;
  bottom: -0.625em;
  transform: rotate(55deg);
}
.sec02 .illust02 {
  width: 4.6em;
  right: 2em;
  bottom: -2em;
}
.sec02 .illust03 {
  width: 10.084375em;
  bottom: -2em;
  left: -1em;
  transform: rotate(-18deg);
}
.sec02 .illust04 {
  width: 4.76em;
  bottom: -3.2em;
  right: 1.25em;
}
.sec02 .check {
  margin-top: 4.625em;
}

/*------------------------------------------
  WARM ITEMS
------------------------------------------*/
.sec03 {
  padding: 0.5em 0 6.875em;
  background: #EAC0CD;
}
.sec03 + .sec04 {
  padding-top: 2.75em;
}
.sec03 + .sec04 .illust01 {
  top: -3.125em;
}
.sec03:before {
  background-image: url(../images/sec03-frame.png);
}
.sec03__title {
  margin-bottom: 5em;
}
.sec03 .date {
  text-align: center;
  margin-bottom: 1em;
}
.sec03 .date img {
  width: 19.875em;
}
.sec03 .item-list .c-itemImage img {
  filter: drop-shadow(0.5em 0.5em 0px #E3ACBB);
}
.sec03 .item-list .c-itemText__price {
  color: #334C9E;
}
.sec03 .item-list .item01 {
  margin-bottom: 1.25em;
}
.sec03 .item-list .item01 .c-itemText {
  top: 50%;
  transform: translateY(-50%);
}
.sec03 .item-list .item02 .c-itemText {
  bottom: 0.75em;
}
.sec03 .item-list .item03 {
  margin-top: -0.625em;
  margin-bottom: 1.3375em;
}
.sec03 .item-list .item03 .c-itemText {
  bottom: 0;
}
.sec03 .item-list .item04 {
  margin-bottom: 2.875em;
}
.sec03 .item-list .item04 .c-itemText {
  bottom: -1em;
}
.sec03 .item-list .item05 {
  margin-bottom: 0;
}
.sec03 .item-list .item05 .c-itemText {
  bottom: 0;
}
.sec03 .item-list .item06 {
  margin-bottom: 0;
}
.sec03 .item-list .item06 .c-itemImage {
  margin: auto;
}
.sec03 .item-list .item06 .c-itemText {
  bottom: 3.4375em;
}
.sec03 .item-list .item07 .c-itemText {
  bottom: 0;
}
.sec03 .illust01 {
  width: 11.5625em;
  left: 1.25em;
  top: 7.875em;
}
.sec03 .illust02 {
  width: 8.425625em;
  top: -1.875em;
  right: -1.875em;
  transform: rotate(-64deg);
}
.sec03 .illust03 {
  width: 5.06625em;
  top: -1.875em;
  right: 1.25em;
}
.sec03 .illust04 {
  width: 7.646875em;
  top: -3.375em;
  left: -0.5em;
  transform: rotate(11deg);
}
.sec03 .illust05 {
  width: 10.084375em;
  bottom: -7.4em;
  right: -2.5em;
  transform: rotate(-110deg);
}
.sec03 .illust06 {
  width: 4em;
  bottom: -4.5em;
  left: 1.25em;
}
.sec03 .check {
  margin-top: 3.125em;
}

/*------------------------------------------
  ONLINE STORE LIMITED
------------------------------------------*/
.sec04 {
  padding: 7.75em 0 6.875em;
  background: #00A199;
}
.sec04:before {
  background-image: url(../images/sec04-frame.png);
}
.sec04__title {
  position: relative;
  z-index: 1;
  margin-bottom: 1.875em;
}
.sec04 .visual {
  margin-bottom: 2.25em;
}
.sec04 .item-list .c-itemImage img {
  filter: drop-shadow(0.5em 0.5em 0px #007E78);
}
.sec04 .item-list .c-itemText__title {
  color: #fff;
}
.sec04 .item-list .c-itemText__price {
  color: #FFD800;
}
.sec04 .item-list .item01 {
  margin-bottom: 1.25em;
  padding-bottom: 2.625em;
}
.sec04 .item-list .item01 .c-itemText {
  bottom: 0;
}
.sec04 .item-list .item02 {
  margin-bottom: 1.5em;
}
.sec04 .item-list .item02 .c-itemText {
  bottom: 0;
}
.sec04 .item-list .item03 {
  margin-bottom: 0;
}
.sec04 .item-list .item03 .c-itemText {
  bottom: 2.375em;
}
.sec04 .item-list .item04 {
  margin-bottom: 1.25em;
  padding-bottom: 2.15625em;
}
.sec04 .item-list .item04 .c-itemText {
  bottom: 0;
}
.sec04 .item-list .item05 {
  margin-bottom: 1.25em;
  padding-bottom: 2.65625em;
}
.sec04 .item-list .item05 .c-itemText {
  bottom: 0;
}
.sec04 .item-list .item06 {
  margin-bottom: 0;
  padding-bottom: 2.09375em;
}
.sec04 .item-list .item06 .c-itemText {
  bottom: 0;
}
.sec04 .item-list .item07 .c-itemText {
  bottom: 0;
}
.sec04 .illust01 {
  width: 7.4375em;
  top: 1.875em;
  right: 0.875em;
}
.sec04 .illust02 {
  width: 8.201875em;
  top: -0.5em;
  left: -1.5em;
  transform: rotate(6deg);
}
.sec04 .illust03 {
  width: 6.65em;
  right: 1.5em;
  top: -0.5em;
  z-index: 2;
}
.sec04 .illust04 {
  width: 4.725em;
  right: 2em;
  top: -5em;
}
.sec04 .illust05 {
  width: 10.084375em;
  top: 0.625em;
  left: -0.625em;
  transform: rotate(-36deg);
}
.sec04 .illust06 {
  width: 7.646875em;
  top: -2em;
  left: 0.5em;
  transform: rotate(-8deg);
}
.sec04 .check {
  margin-top: 3.125em;
}

/*------------------------------------------
  RECOMMEND ITEMS
------------------------------------------*/
.sec05 {
  background: #F39300;
}
.sec05--top {
  padding: 1.25em 0 0;
}
.sec05--bottom {
  padding: 2.75em 0 6.875em;
}
.sec05:before {
  background-image: url(../images/sec05-frame.png);
}
.sec05__title {
  margin-bottom: 4.375em;
}
.sec05 .visual {
  margin-bottom: 3.75em;
}
.sec05 .item-list {
  margin-bottom: 5em;
}
.sec05 .item-list .c-itemImage img {
  filter: drop-shadow(0.5em 0.5em 0px #D97227);
}
.sec05 .item-list .c-itemText__price {
  color: #fff;
}
.sec05 .item-list .item01 {
  margin-bottom: 0;
  padding-bottom: 3.375em;
}
.sec05 .item-list .item01 .c-itemText {
  bottom: 0;
}
.sec05 .item-list .item02 .c-itemText {
  bottom: 0;
}
.sec05 .item-list .item03 {
  padding-bottom: 4.375em;
}
.sec05 .item-list .item03 .c-itemImage {
  margin-left: 2em;
}
.sec05 .item-list .item03 .c-itemText {
  bottom: 0;
}
.sec05 .item-list .item04 {
  padding-bottom: 2.125em;
  margin-bottom: 1.25em;
}
.sec05 .item-list .item04 .c-itemImage {
  margin: auto;
}
.sec05 .item-list .item04 .c-itemText {
  bottom: 0;
}
.sec05 .item-list .item05 {
  padding-bottom: 3.375em;
}
.sec05 .item-list .item05 .c-itemImage {
  max-width: 100%;
}
.sec05 .item-list .item05 .c-itemText {
  bottom: 0;
}
.sec05 .illust01 {
  width: 9.0625em;
  right: 2em;
  top: 4em;
}
.sec05 .illust02 {
  width: 3.71em;
  right: 1.25em;
  top: -6.625em;
}
.sec05 .illust03 {
  width: 7.646875em;
  top: -0.8em;
  left: -1.25em;
  transform: rotate(-7deg);
}
.sec05 .illust04 {
  width: 2.9em;
  left: 2em;
  top: -3em;
}
.sec05 .illust05 {
  width: 10.084375em;
  top: -2.25em;
  right: -3.25em;
  transform: rotate(-115deg);
}
.sec05 .illust06 {
  width: 17em;
  top: -4.0625em;
  right: -7.3125em;
}
.sec05 .illust07 {
  width: 3em;
  left: 0.75em;
  top: 0;
  z-index: 1;
  transform: rotate(-2deg);
}
.sec05 .illust08 {
  width: 3.08em;
  right: 1.25em;
  top: 0;
  z-index: 1;
}
.sec05 .check {
  margin-top: 2.75em;
}

.recommend-block {
  margin-bottom: 5em;
  position: relative;
}
.recommend-block:last-child {
  margin-bottom: 0;
}
.recommend-block__title {
  margin-bottom: 2.125em;
}
.recommend-block__slider {
  width: 18.125em;
  margin: auto;
}
.recommend-block__slider .swiper {
  overflow: visible;
}
.recommend-block__slider .swiper-slide {
  height: auto;
  transform-origin: center 160em;
}
.recommend-block__slider .c-item {
  background: #fff;
  padding: 1.875em;
  border-radius: 0.625em;
  height: 100%;
}
.recommend-block__slider .c-item.--bg01 {
  background-color: #1C61AD;
}
.recommend-block__slider .c-item.--bg02 {
  background-color: #00A43A;
}
.recommend-block__slider .c-item.--bg03 {
  background-color: #A54795;
}
.recommend-block__slider .c-itemText {
  position: relative;
  margin-top: 1em;
}
.recommend-block__slider .c-itemText__title {
  color: #fff;
}
.recommend-block__slider .c-itemText__price {
  color: #FFD800;
}
.recommend-block__slider .recommend-arrow {
  position: absolute;
  z-index: 10;
  width: 2.5em;
  top: 50%;
  transform: translateY(-50%);
  transition: opacity 0.4s;
}
.recommend-block__slider .recommend-arrow--prev {
  left: -1.25em;
}
.recommend-block__slider .recommend-arrow--next {
  right: -1.25em;
}
.recommend-block__slider .swiper-button-disabled {
  opacity: 0;
}

.recommend-more {
  padding: 0 0.875em;
  text-align: center;
}
.recommend-more__hide {
  height: 0;
  overflow: hidden;
}
.recommend-more__trigger {
  cursor: pointer;
  display: inline-block;
  width: 9.78125em;
  height: 2.09375em;
  border: none;
  background-color: transparent;
  background-image: url(../images/button-moreitems-black.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  transition: background-image 0.4s;
  padding: 0;
  margin: 0;
  font-size: 100%;
}
.recommend-more__trigger:hover {
  background-image: url(../images/button-moreitems-white.png);
}
.recommend-more__trigger.is--active {
  background-image: url(../images/button-moreitems-close-black.png);
}
.recommend-more__trigger.is--active:hover {
  background-image: url(../images/button-moreitems-close-white.png);
}
.recommend-more__trigger.is--active.--close {
  background-image: url(../images/button-moreitems-close-black2.png);
}
.recommend-more__trigger.is--active.--close:hover {
  background-image: url(../images/button-moreitems-close-white2.png);
}
.recommend-more__trigger.--close {
  margin-top: 1.25em;
}
.recommend-more__list {
  display: flex;
  flex-wrap: wrap;
  gap: 1em 4%;
  margin-top: 1em;
}
.recommend-more__item {
  background: #fff;
  width: 48%;
  padding: 0.625em 0.625em 1.25em;
  margin-bottom: 0;
}
.recommend-more__item .c-itemImage {
  text-align: center;
  margin-bottom: 0.625em;
}
.recommend-more__item .c-itemImage img {
  width: 7.5em;
}
.recommend-more__item .c-itemText {
  position: relative;
  text-align: left;
}
.recommend-more__item .c-itemText__price {
  color: #00A199;
  display: block;
}
.recommend-more__item .c-itemText__price-arrow {
  left: auto;
  right: 0;
  margin-left: 0;
}
.recommend-more__item.has--arrow {
  padding-bottom: 2.875em;
}
.recommend-more__item .bottom-arrow {
  position: absolute;
  bottom: 0.625em;
  right: 0.625em;
  width: 1.625em;
}

/*------------------------------------------
  STRAND
------------------------------------------*/
.sec06 {
  padding: 0 0 6.875em;
  background: #C30D23;
}
.sec06:before {
  background-image: url(../images/sec06-frame.png);
}
.sec06 .c-brand {
  margin-bottom: 2.5em;
}
.sec06 .c-brand__logo {
  margin-bottom: 1.375em;
}
.sec06 .c-brand__illust {
  width: 5.75em;
  right: 0.625em;
  bottom: -1.875em;
}
.sec06 .visual {
  margin-bottom: 1.875em;
}
.sec06 .check {
  margin-top: 1.25em;
}

.book-block {
  position: relative;
  display: flex;
  justify-content: center;
  margin-bottom: 1.25em;
  min-height: 30.25em;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
}
.book-block.--book01 {
  background-image: url(../images/book01-bg.png);
}
.book-block.--book02 {
  background-image: url(../images/book02-bg.png);
}
.book-block.--book03 {
  background-image: url(../images/book03-bg.png);
}
.book-block.--book04 {
  background-image: url(../images/book04-bg.png);
}
.book-block:last-child {
  margin-bottom: 0;
}
.book-block__inner {
  padding: 1.875em 2em 0 0;
}
.book-block .swiper {
  width: 16em;
  height: 23em;
  perspective: 1500px;
  overflow: visible;
}
.book-block .swiper-slide {
  background-color: #fbf3e6;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  backface-visibility: hidden;
  transform-style: preserve-3d;
  padding: 0.8em 0.8em 0;
}
.book-block .c-itemText {
  margin-top: 1em;
}
.book-block .c-itemText__price {
  color: #231815;
}

.book-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 2.5em;
}
.book-arrow--prev {
  left: -3.2em;
  display: none;
}
.book-arrow--next {
  right: -3.2em;
}

/*------------------------------------------
  MAPTOTE
------------------------------------------*/
.sec07 {
  background: #fff;
}
.sec07:before {
  background-image: url(../images/sec07-frame.png);
}
.sec07__inner {
  padding: 1.875em 0 6.875em;
  background: url(../images/sec07-bg.png) repeat-y center top;
  background-size: 100%;
}
.sec07 .c-brand {
  padding: 2.5em 0 1.75em;
  border-bottom: 4px solid #334C9E;
}
.sec07 .c-brand:before {
  content: "";
  width: 100%;
  height: 16.4375em;
  position: absolute;
  left: 0;
  top: -5.375em;
  background: url(../images/illust13.png) no-repeat center top;
  background-size: 100%;
  pointer-events: none;
}
.sec07 .c-brand__logo {
  text-align: center;
  margin-bottom: 1.25em;
}
.sec07 .c-brand__logo img {
  width: 14.375em;
}
.sec07 .c-brand__illust {
  width: 5.9375em;
  right: 0;
  bottom: 0;
}
.sec07 .visual {
  margin-bottom: 1.25em;
}
.sec07 .item-list .c-itemImage {
  transform: scale(0.7);
}
.sec07 .item-list .c-itemText {
  width: 11.5em;
  padding: 1.25em 1.25em 1.5em;
  background-color: #fff;
  background-image: url(../images/sec07-item-bg-top.png), url(../images/sec07-item-bg-bottom.png), url(../images/sec07-item-bg.png);
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position: center top, center bottom, center top;
  background-size: 100%;
}
.sec07 .item-list .c-item:nth-child(odd) .c-itemImage {
  animation: zoomImage 2s infinite;
}
.sec07 .item-list .c-item:nth-child(even) .c-itemImage {
  animation: zoomImage 2s 1s infinite;
}
.sec07 .item-list .item01 {
  padding-bottom: 4.5em;
}
.sec07 .item-list .item01 .c-itemText {
  bottom: 0;
  right: 1.25em;
}
.sec07 .item-list .item02 {
  padding-bottom: 5.375em;
}
.sec07 .item-list .item02 .c-itemText {
  bottom: 0;
  left: 1.25em;
}
.sec07 .item-list .item03 {
  padding-bottom: 4.5em;
}
.sec07 .item-list .item03 .c-itemText {
  bottom: 0;
  right: 1.25em;
}
.sec07 .item-list .item04 {
  padding-bottom: 5.25em;
}
.sec07 .item-list .item04 .c-itemText {
  bottom: 0;
  left: 1.25em;
}
.sec07 .item-list .item05 {
  padding-bottom: 3.4375em;
}
.sec07 .item-list .item05 .c-itemText {
  bottom: 0;
  right: 1.25em;
}
.sec07 .item-list .item06 {
  padding-bottom: 5.875em;
}
.sec07 .item-list .item06 .c-itemText {
  bottom: 0;
  left: 1.25em;
}
.sec07 .item-list .item07 {
  padding-bottom: 0.625em;
}
.sec07 .item-list .item07 .c-itemText {
  bottom: 0;
  right: 1.25em;
}
.sec07 .illust01 {
  width: 6.125em;
  left: 0.625em;
  top: 2em;
}
.sec07 .illust02 {
  width: 5.375em;
  right: 0.625em;
  top: 0.3em;
}
.sec07 .illust03 {
  width: 4.136875em;
  top: 0;
  right: 1.25em;
}
.sec07 .illust04 {
  width: 8.25em;
  left: -1.75em;
  top: 0.3em;
}
.sec07 .check {
  margin-top: 3.125em;
}

/*------------------------------------------
  BROOKLYN
------------------------------------------*/
.sec08 {
  padding: 0.625em 0 6.875em;
  background: #FFD800;
}
.sec08:before {
  background-image: url(../images/sec08-frame.png);
}
.sec08__head {
  margin-bottom: 2.5em;
  position: relative;
}
.sec08__head-inner {
  background: #3B302E;
  box-shadow: 0.5em 0.5em 0px 0px #CBA131;
  padding: 1.875em 0.75em 2em;
}
.sec08__head .head-block {
  margin-top: 2.875em;
  padding: 0 1.25em;
}
.sec08__head .head-block__title {
  margin-bottom: 1.875em;
  text-align: center;
}
.sec08__head .head-block__title img {
  width: auto;
  height: 1.43625em;
}
.sec08__head .head-block .c-item {
  margin-bottom: 1.5em;
}
.sec08__head .head-block .c-item.--has-arrow {
  padding-bottom: 2em;
}
.sec08__head .head-block .c-item:last-child {
  margin-bottom: 0;
}
.sec08__head .head-block .c-itemText {
  position: relative;
  margin-top: 0.625em;
}
.sec08__head .head-block .c-itemText__title {
  color: #fff;
}
.sec08__head .head-block .c-itemText__price {
  color: #fff;
}
.sec08__head .head-block .c-itemText__price p {
  border-bottom: none;
}
.sec08__head .head-block .c-itemText__arrow {
  position: absolute;
  right: 0;
  top: 100%;
  width: 1.875em;
  margin-top: 0.3em;
}
.sec08 .c-brand__logo {
  text-align: center;
  margin-bottom: 1em;
}
.sec08 .c-brand__logo img {
  width: 18.375em;
}
.sec08 .visual {
  margin: 1.75em 0;
}
.sec08 .item-list .c-itemImage {
  margin: auto;
}
.sec08 .item-list .c-itemImage img {
  filter: drop-shadow(0.5em 0.5em 0px #EABB00);
}
.sec08 .item-list .c-itemText__price {
  color: #334C9E;
}
.sec08 .item-list .item01 {
  padding-bottom: 5em;
}
.sec08 .item-list .item01 .c-itemText {
  bottom: 0;
}
.sec08 .item-list .item02 {
  padding-bottom: 1.25em;
}
.sec08 .item-list .item02 .c-itemText {
  bottom: 0;
}
.sec08 .item-list .item03 {
  padding-bottom: 4.625em;
}
.sec08 .item-list .item03 .c-itemText {
  bottom: 0;
}
.sec08 .illust01 {
  width: 4em;
  bottom: -7.875em;
  right: 1.25em;
}
.sec08 .illust02 {
  width: 10.084375em;
  bottom: -4.625em;
  right: -2.5em;
  transform: rotate(-115deg);
}
.sec08 .illust03 {
  width: 7.646875em;
  top: -0.75em;
  left: -1.5em;
  transform: rotate(-7deg);
}
.sec08 .illust04 {
  top: -5.25em;
  left: 2.5em;
  width: 5.9375em;
}
.sec08 .check {
  margin-top: 3.125em;
}

/*------------------------------------------
  ALL ITEMS
------------------------------------------*/
.sec09 {
  padding: 0.625em 0 6.875em;
  background: #A54795;
}
.sec09:before {
  background-image: url(../images/sec09-frame.png);
}
.sec09 .button {
  text-align: center;
}

/*------------------------------------------
  COMING SOON
------------------------------------------*/
.sec10 {
  padding: 1em 0 23.4375em;
  background-color: #EAC0CD;
  background-image: url(../images/sec10-bg.png);
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: 100%;
}
.sec10__title {
  margin: 0 0 1.25em;
}
.sec10 .date {
  text-align: center;
  margin-bottom: 1.25em;
}
.sec10 .date img {
  width: 19.875em;
}
.sec10 .visual {
  margin-bottom: 1.25em;
}
.sec10 .lead {
  background: #fff;
  border-radius: 0.625em;
  padding: 1.25em;
  margin-bottom: 1.25em;
}
.sec10 .lead p {
  font-size: 0.68em;
  color: #334C9E;
  line-height: 1.928;
}
.sec10 .banner {
  padding: 0 0.75em;
}
.sec10 .banner-item {
  position: relative;
  margin-bottom: 1.25em;
}
.sec10 .banner-item:last-child {
  margin-bottom: 0;
}
.sec10 .banner-item.--end {
  pointer-events: none;
}
.sec10 .banner-item.--end:after {
  content: "終了しました";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(-10deg);
  transform-origin: center center;
  font-size: 1.3125em;
  font-weight: 500;
  color: #fff;
  letter-spacing: 0.04em;
  background: #334C9E;
  padding: 0.4em 2em;
  white-space: nowrap;
}
.sec10 .banner-note {
  font-size: 0.625em;
  line-height: 1.8;
  letter-spacing: 0.04em;
  font-weight: 500;
}
.sec10 .illust {
  height: 5.6875em;
  width: 100%;
  left: 0;
  bottom: 2.25em;
  background: url(../images/illust14.png) repeat-x;
  background-size: auto 100%;
  animation: loop 20s linear infinite;
}

/*------------------------------------------
  fixed button
------------------------------------------*/
footer .block-page-top {
  display: none !important;
}

.btn-pagetop {
  width: 3.125em;
  position: fixed;
  right: 1.25em;
  bottom: calc(6.5em + 60px);
  margin-left: auto;
  z-index: 100;
  opacity: 0;
  transition: opacity 1s;
}
.btn-pagetop a {
  display: block;
  opacity: 0.4;
}
.btn-pagetop.is--show {
  opacity: 1;
}

@media only screen and (min-width: 768px) {
  .btn-pagetop {
    width: 60px;
  }
  .btn-pagetop a {
    opacity: 1;
  }
}
@media only screen and (min-width: 1264px) {
  .btn-pagetop {
    right: 15%;
    margin-right: -80px;
  }
}
.btn-campaign {
  width: 5.75em;
  position: fixed;
  right: 0;
  bottom: 70px;
  margin-left: auto;
  z-index: 100;
}
.btn-campaign a {
  display: block;
}
.btn-campaign img {
  animation: campaign 2.4s 2.4s linear infinite;
}

@media only screen and (min-width: 768px) {
  .btn-campaign {
    width: 92px;
  }
}
@media only screen and (min-width: 1264px) {
  .btn-campaign {
    right: 15%;
    margin-right: -106px;
  }
}
/*------------------------------------------
  animation
------------------------------------------*/
@keyframes carLoop {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -37.5em 0;
  }
}
@keyframes car {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(-100%);
  }
}
@keyframes carBounce {
  0% {
    transform: translateY(0) rotate(0deg);
  }
  100% {
    transform: translateY(-10px) rotate(-2deg);
  }
}
@keyframes campaign {
  0% {
    transform: scale(1, 1) translate(0, 0);
  }
  2% {
    transform: scale(1.01, 0.99) translate(0, 2%);
  }
  8.7% {
    transform: scale(1.02, 0.98) translate(0, 4%);
  }
  10.7% {
    transform: scale(1, 1) translate(0, 0);
  }
  13.3% {
    transform: scale(1, 1.01) translate(0, -2%);
  }
  18.7% {
    transform: scale(1.01, 0.99) translate(0, 2%);
  }
  100%, 22% {
    transform: scale(1, 1) translate(0, 0);
  }
}
@keyframes loop {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -31.875em 0;
  }
}
@keyframes jump {
  0%, 100%, 50%, 70%, 90% {
    transform: translateY(0px);
  }
  60%, 80% {
    transform: translateY(-8px);
  }
}
@keyframes yurayura {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(20deg);
  }
  100% {
    transform: rotate(0deg);
  }
}
@keyframes zoomImage {
  0% {
    transform: scale(0.7);
  }
  50% {
    transform: scale(0.95);
  }
  100% {
    transform: scale(0.7);
  }
}
@keyframes poyopoyo {
  0%, 35%, 45%, 55% {
    transform: scale(1);
  }
  40%, 50% {
    transform: scale(0.85);
  }
}
.jump {
  animation: jump 2s 0.3s ease-in-out infinite;
}

.yurayura {
  animation: yurayura 3s 0.3s ease-in-out infinite;
}

.fadeInUp {
  transform: translateY(1em);
  opacity: 0;
}
.fadeInUp.js-scr-active {
  transition: 1s;
  transform: translateY(0);
  opacity: 1;
}

.slideInRight {
  transform: translateX(50%);
  opacity: 0;
}
.slideInRight.js-scr-active {
  transition: 1s;
  transform: translateX(0);
  opacity: 1;
}

.slideInLeft {
  transform: translateX(-50%);
  opacity: 0;
}
.slideInLeft.js-scr-active {
  transition: 1s;
  transform: translateX(0);
  opacity: 1;
}

/*------------------------------------------
  modal
------------------------------------------*/
.js-modal {
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.6s ease, visibility 0s 0.6s;
  position: fixed;
  width: 100%;
  height: 100vh;
  height: 100dvh;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  background: rgba(255, 255, 255, 0.9);
  z-index: 1000;
}
.js-modal.is--active {
  visibility: visible;
  opacity: 1;
  transition: opacity 0.6s ease;
}
.js-modalOuter {
  display: table;
  width: 100%;
  height: 100vh;
  height: 100dvh;
}
.js-modalInner {
  display: table-cell;
  vertical-align: middle;
  padding: 1.25em 0;
}
.js-modalContent {
  position: relative;
  margin: auto;
  box-sizing: border-box;
}
.js-modalOpen {
  cursor: pointer;
}
.js-modalClose {
  cursor: pointer;
}

.modal-close-icon {
  position: absolute;
  bottom: 100%;
  right: 1.25em;
  margin-bottom: 0.625em;
  text-align: right;
  width: 3.125em;
}

.modal-close-button {
  text-align: center;
  margin-top: 1.25em;
}

@media only screen and (min-width: 768px) {
  .js-modalContent {
    width: 390px;
    margin: auto;
  }
}