@charset "UTF-8";

:root {
  --color-1: #bf9000;
  --color-2: #2e75b6;
  --color-3: #548235;
  --color-4: #c55a11;
  --color-navy: #02205c;
  --color-orange: #efdab5;
  --bg-color-a: #534334;
  --bg-color-b: #ecf1f5;
  --bg-color-1: #f1ecd8;
  --bg-color-2: #dbe3ec;
  --bg-color-3: #e0ecd6;
  --bg-color-4: #ebe0da;
  --bg-color-menu: #ecf1f5;
  --blockPt-1: 120px;
  --fade-up-length: 200px;
  --fade-up-length-l: 250px;
}
.bg-color-1 {
  background-color: var(--bg-color-a);
}
.bg-color-1.done {
  background-color: var(--bg-color-1);
}
.bg-color-2 {
  background-color: var(--bg-color-1);
}
.bg-color-2.done {
  background-color: var(--bg-color-2);
}
.bg-color-3 {
  background-color: var(--bg-color-2);
}
.bg-color-3.done {
  background-color: var(--bg-color-3);
}
.bg-color-4 {
  background-color: var(--bg-color-3);
}
.bg-color-4.done {
  background-color: var(--bg-color-4);
}
/* .bg-color-1 {
  background-color: var(--bg-color-1);
}
.bg-color-2 {
  background-color: var(--bg-color-2);
}
.bg-color-3 {
  background-color: var(--bg-color-3);
}
.bg-color-4 {
  background-color: var(--bg-color-4);
} */
.color-1 {
  color: var(--color-1) !important;
}
.color-2 {
  color: var(--color-2) !important;
}
.color-3 {
  color: var(--color-3) !important;
}
.color-4 {
  color: var(--color-4) !important;
}
.color-orange {
  color: var(--color-orange) !important;
}
.bg-color-a {
  background-color: var(--bg-color-a);
}
.bg-color-b {
  background-color: var(--bg-color-b);
}
.txt-white {
  color: #ffffff;
}
.section-items {
  margin-top: -70px;
  margin-bottom: 20px;
  border-bottom: 1px solid var(--color-navy);
  padding: 0 0 15px;
  font-size: 18px;
}

.mr20 {
  margin-right: 20px !important;
}
.ml20 {
  margin-left: 20px !important;
}
.mt00 {
  margin-top: 0px !important;
}
.mt20 {
  margin-top: 20px !important;
}
.mt30 {
  margin-top: 30px !important;
}
.mt40 {
  margin-top: 40px !important;
}
.mb20 {
  margin-bottom: 20px !important;
}
.mb30 {
  margin-bottom: 30px !important;
}
.mb40 {
  margin-bottom: 40px !important;
}
.mr00 {
  margin-right: 0px !important;
}
.txt-underline {
  text-decoration: underline !important;
}
.raw-gap-00 {
  row-gap: 0 !important;
}

.font-12 {
  font-size: 12px !important;
}
.font-13 {
  font-size: 13px !important;
}
.font-14 {
  font-size: 14px !important;
}
.font-15 {
  font-size: 15px !important;
}
.font-16 {
  font-size: 16px !important;
}
.font-18 {
  font-size: 18px !important;
}
.font-20 {
  font-size: 20px !important;
}
.font-22 {
  font-size: 22px !important;
}
.font-24 {
  font-size: 24px !important;
}
.opacity-00 {
  opacity: 0 !important;
}

.contents-wrap {
  margin-bottom: 0 !important;
}

.full-w {
  width: calc(100vw);
  margin-left: calc(50% - 50vw);
  position: relative;
}

#section-1,
#section-2,
#section-3,
#section-4,
.bg-color-1,
.bg-color-2,
.bg-color-3,
.bg-color-4 {
  margin-top: -50%;
}

.lead-block,
.bg-color-1,
.bg-color-2,
.bg-color-3 {
  padding-bottom: 50%;
}
.floating-box-parent {
  position: relative;
  z-index: 10;
}
.floating-box {
  position: absolute;
  background-color: #fff;
  padding: 20px 20px 40px;
  box-shadow: 7px 7px 0px currentColor;
  font-weight: bold;
  top: 40px;
  /* z-index: 2; */
  min-width: 320px;
}

.floating-box img {
  width: 50px;
  height: 50px;
}
.floating-box span:nth-child(1) {
  display: flex;
  align-items: center;
  gap: 10px;
}

.lead-items {
  width: 100%;
  position: relative;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 30px 30px 27px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
  box-sizing: border-box;
  text-align: center;
  font-weight: bold;
}
.lead-items span {
  background-color: var(--bg-color-b);
  padding: 0 15px;
  position: relative;
  z-index: 2;
  margin-bottom: 30px;
  display: inline-block;
}
.item-feature {
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  align-items: flex-start;
}
.lead-items .item,
.item-feature li {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0 !important;
}
.item-feature li {
  align-items: flex-start;
}

.item-feature li {
  font-size: 14px;
  line-height: 1.6;
  font-weight: 500;
  padding: 5px 0;
}
.lead-items .item::before {
  content: "";
  display: inline-block;
  width: 22px;
  height: 25px;
  background-image: url(/special/autumn2026/images/check-navy.svg);
  background-repeat: no-repeat;
  padding-right: 13px;
  flex-shrink: 0;
}
div.line {
  position: absolute;
  top: 43px;
  width: calc(100% - 70px);
  height: 1px;
  background-color: var(--color-navy);
  left: 50%;
  transform: translateX(-50%);
}

.cta-purchase-support-list p,
.cta-purchase-support-list li {
  margin-bottom: 0;
  transition: 0.6s;
}
.cta-purchase-support-list li:hover {
  background-color: currentColor;
}
.cta-purchase-support-list li a,
.cta-purchase-support-list li p {
  color: currentColor;
}
.cta-purchase-support-list li:hover p {
  color: #fff !important;
}
.cta-purchase-support-list li:hover img {
  filter: grayscale(100%);
}

html {
  margin-bottom: 40px;
}

.item-feature li::before {
  content: "";
  display: inline-block;
  width: 22px;
  height: 25px;
  background-image: url(/special/autumn2026/images/check-navy.svg);
  background-repeat: no-repeat;
  background-size: contain;
  padding-right: 15px;
  flex-shrink: 0;
  margin-top: 5px;
}

.check-1 li::before {
  background-image: url(/special/autumn2026/images/check-1.svg) !important;
}
.check-2 li::before {
  background-image: url(/special/autumn2026/images/check-2.svg) !important;
}
.check-3 li::before {
  background-image: url(/special/autumn2026/images/check-3.svg) !important;
}
.check-4 li::before {
  background-image: url(/special/autumn2026/images/check-4.svg) !important;
}

@media screen and (max-width: 925px),
  only screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape),
  only screen and (min-device-width: 414px) and (max-device-width: 736px) and (-webkit-min-device-pixel-ratio: 3) and (orientation: landscape) {
  .full-w {
    width: calc(100% + 40px);
    margin-left: -20px;
  }
}

/* menu */
ul.menu .item a {
  display: block;
  text-align: center;
  background-color: var(--bg-color-menu);
  font-weight: bold;
  color: inherit;
  position: absolute;
  width: 100%;
  padding-bottom: calc(100% + 10px);
}

ul.menu .item a:hover img,
ul.menu .item a:hover span,
ul.menu .item span:hover,
ul.menu .item img:hover {
  opacity: 1 !important;
}
ul.menu .item a img,
ul.menu .item a div,
ul.menu .item a span {
  position: absolute;
}
ul.menu .item a img:nth-of-type(1) {
  width: 50px;
  height: 50px;
  top: 0;
  transform: translate(-50%, -50%);
  z-index: 2;
}
ul.menu .item a span {
  top: 33px;
  left: 50%;
  transform: translateX(-50%);
  color: currentColor;
  font-size: 20px;
  width: 100%;
}
ul.menu .item a img:nth-of-type(2) {
  width: 25px;
  height: 25px;
  bottom: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
}
ul.menu .item a div {
  left: 0;
  bottom: 14px;
  z-index: 1;
  overflow: hidden;
}
ul.menu .item a div img {
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  top: auto !important;
  transform: translate(0%, 0%) !important;
  display: block;
  transition: 0.3s;
}
ul.menu .item a:hover div img {
  transform: scale(1.05) !important;
}
.floating-box span:nth-of-type(2) {
  font-size: 24px;
}

@media screen and (min-width: 768px) and (max-width: 1100px) {
  .floating-box {
    top: 3vw;
    padding-bottom: 4vw;
  }
  /* .floating-box span:nth-of-type(2) {
    font-size: 2.2vw !important;
  } */
  ul.menu .item a img:nth-of-type(1) {
    width: 5vw;
    height: 5vw;
  }
  ul.menu .item a span {
    top: 3vw;
    font-size: 1.5vw;
    line-height: 1.8vw;
  }
  ul.menu .item a img:nth-of-type(2) {
    width: 20px;
    height: 20px;
    bottom: 53%;
  }
}

.inner-wrap.check-1,
.inner-wrap.check-2,
.inner-wrap.check-3,
.inner-wrap.check-4 {
  margin-top: 20px;
}

@media screen and (min-width: 801px) {
  .lead-items {
    margin-bottom: 30px;
  }
}
@media screen and (max-width: 700px) {
  .lead-items {
    margin-bottom: 35px !important;
  }
}
@media screen and (max-width: 600px) {
  .lead-items {
    margin-bottom: 20px !important;
  }
}
@media screen and (max-width: 550px) {
  .lead-items {
    margin-bottom: 0px !important;
  }
}
@media screen and (max-width: 500px) {
  .lead-items {
    margin-bottom: -140px !important;
  }
}

@media screen and (max-width: 768px) {
  .inner-wrap.check-1,
  .inner-wrap.check-2,
  .inner-wrap.check-3,
  .inner-wrap.check-4 {
    margin-top: calc(-30% + 20px);
  }
  .item-feature {
    height: auto;
  }
  .item-feature li {
    line-height: 1.4;
  }
  .lead-items .item,
  .item-feature li {
    font-size: 16px;
    padding-bottom: 20px;
  }
  .lead-items .item {
    justify-content: start;
    width: 250px !important;
    letter-spacing: 0.7vw;
  }
  .lead-items ul.wide .item {
    width: calc(60% - 22px) !important;
    min-width: 330px;
  }
  .floating-box span:nth-of-type(2) {
    font-size: 24px;
  }
  ul.menu .item a span {
    font-size: 3.7vw;
    line-height: 4.2vw;
    top: 15%;
  }
  .floating-box {
    width: 60%;
    left: 20px;
    top: -80px;
    min-width: 210px;
    max-width: 320px;
    margin-top: -20%;
  }
  .lead-items {
    margin-bottom: 50px;
    padding: 30px 15px 13px;
  }
  .lead-items .cmn-card-list.card-3 {
    padding-bottom: 0;
  }
  .check-4 .cmn-card-list.card-3 {
    padding-bottom: 50px;
  }
  ul.menu .item a img:nth-of-type(1) {
    width: 10vw;
    height: 10vw;
  }
  ul.menu .item a img:nth-of-type(2) {
    width: 5vw;
    height: 5vw;
    bottom: 48%;
  }
  .section-items {
    padding: 0 0 15px;
  }
  .inner-wrap.lead-items-parent {
    /* margin-bottom: calc(3% + 30px); */
    /* margin-top: -30%; */
  }
}

/* fade-up アニメ */
.fade-up {
  opacity: 0;
  transform: translateY(var(--fade-up-length));
  transition:
    opacity 1.2s ease,
    transform 1.5s ease;
}
.fade-up.show {
  opacity: 1;
  transform: translateY(0);
}
.lead-items.fade-up {
  transform: translate(-50%, calc(var(--fade-up-length) - 50%));
}
.fade-up-late {
  transition-delay: 0.5s;
}
/* .fade-up-late_sp {
  transition-delay: 0s;
} */
.lead-items.fade-up.show {
  transform: translate(-50%, -50%);
}
.change-color {
  transition: background-color 2.5s ease
}

#section-1,
#section-2,
#section-3,
#section-4 {
  scroll-margin-top: 380px;
}

@media screen and (max-width: 768px) {
  .fade-up {
    opacity: 0;
    transform: translateY(var(--fade-up-length));
    transition:
      opacity 0.5s ease,
      transform 0.8s ease;
  }
  .floating-box.fade-up {
    transform: translateY(var(--fade-up-length) - 70%);
  }
  .floating-box.fade-up.show {
    transform: translateY(-70%);
    min-width: calc(100% - 40px);
    box-sizing: border-box;
  }
  .fade-up-late {
    transition-delay: 0.3s;
  }
  .fade-up-late_sp {
    transition-delay: 0.3s;
  }
}

/* misc */
@media screen and (max-width: 768px) {
  .cta-following-wrap {
    display: none;
  }
  .bg-color-a p {
    text-align: left;
  }
  #section-1,
  #section-2,
  #section-3,
  #section-4 {
    scroll-margin-top: 380px;
  }
  div.line {
    top: 55px;
    width: calc(100% - 50px);
  }
  .lead-items span {
    padding: 0 10px;
  }
  .spacer {
    height: 10px;
    position: absolute;
    z-index: 100;
    background-color: red;
    width: 100vw;
    margin-left: -20px;
    padding-bottom: 100%;
  }
}

a:hover,
a:hover img {
  opacity: 1 !important;
}
div.another-link span:hover {
  transition: 0.2s opacity;
}
div.another-link span:hover {
  opacity: 0.5;
}

.pc-narrow-only {
  display: block;
}

@media screen and (max-width: 440px) {
  .inner-wrap.lead-items-parent {
    margin-bottom: 0;
  }
}

@media screen and (max-width: 420px) {
  .pc-narrow-only {
    display: none;
  }
  .lead-items .item {
    width: 100% !important;
  }
  .lead-items ul.wide .item {
    width: calc(60% - 22px) !important;
    min-width: calc(100% - 10px) !important;
  }
  .lead-items ul .item {
    min-width: calc(80% - 10px) !important;
  }
  .lead-items .item::before {
    padding-right: 10px;
  }
}

@media screen and (max-width: 315px) {
  .floating-box {
    left: 0;
  }
}