/* Decotra page styles extracted from coder source 20260701. */

.u__dela {
  font-family: "Dela Gothic One", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.decotora__fv {
  aspect-ratio: 72 / 37;
  background-image: url(../images/page-decotora/bg-fv.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: bottom center;
  -webkit-padding-before: 3.89vw;
          padding-block-start: 3.89vw;
  -webkit-padding-start: 45.28vw;
          padding-inline-start: 45.28vw;
}
@media (width < 500px) {
  .decotora__fv {
    aspect-ratio: 374 / 615;
    background-image: url(../images/page-decotora/bg-fv-sp.png);
    -webkit-padding-before: 0;
            padding-block-start: 0;
    -webkit-padding-start: 0;
            padding-inline-start: 0;
  }
}
.decotora__fv_cont {
  width: min(100%, 794px);
}
.decotora__fv_cont .-btns {
  width: 80%;
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0 2%;
  -webkit-margin-before: -40px;
          margin-block-start: -40px;
}
@media (width < 500px) {
  .decotora__fv_cont .-btns {
    width: 96vw;
    -webkit-margin-before: 58.67vw;
            margin-block-start: 58.67vw;
  }
}
.decotora__fv_cont .-btns a {
  display: block;
  transition: opacity 0.3s;
  align-self: end;
}
.decotora__fv_cont .-btns a:focus-visible {
  opacity: 0.7;
}
@media (any-hover: hover) {
  .decotora__fv_cont .-btns a:hover {
    opacity: 0.7;
  }
}
.decotora__yl {
  background-color: #FED801;
}
.decotora__heading {
  height: min(13.87vw, 79px);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
}
.decotora__heading img {
  width: auto;
  height: 100%;
}
.decotora__block1 {
  -webkit-padding-before: 24px;
          padding-block-start: 24px;
}
.decotora__gallery {
  width: min(100% - 80px, 1334px);
  margin-inline: auto;
  -webkit-margin-after: 24px;
          margin-block-end: 24px;
}
@media (width < 500px) {
  .decotora__gallery {
    width: 94vw;
  }
}
.decotora__gallery_card {
  border: 2px solid #000;
  border-radius: 10px;
  background-color: #fff;
  padding-block: 20px;
  padding-inline: 17px;
  aspect-ratio: 9 / 16;
}
@media (width < 900px) {
  .decotora__gallery_card {
    padding-block: 15px;
    padding-inline: 13px;
  }
}
.decotora__gallery_card img, .decotora__gallery_card video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.decotora__gallery_bottom {
  background-color: #fff;
  height: 100px;
  position: relative;
}
.decotora__gallery_bottom .-main-wrap {
  width: 1440px;
  height: 47px;
  overflow: hidden;
  position: relative;
}
.decotora__gallery_bottom .-main {
  width: auto;
  height: 100%;
  position: absolute;
  top: 0;
  left: 50%;
  translate: -50% 0;
}
.decotora__gallery_bottom .-left {
  width: 135px;
  position: absolute;
  left: 0;
  top: -33px;
}
.decotora__gallery_bottom .-right {
  width: 133px;
  position: absolute;
  right: 0;
  top: -40px;
}
.decotora__block2 {
  -webkit-padding-before: 0;
          padding-block-start: 0;
  -webkit-padding-after: min(10.67vw, 74px);
          padding-block-end: min(10.67vw, 74px);
}
.decotora__block2 .l__container {
  container-type: inline-size;
}
.decotora__block2 .-inner {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: stretch;
  -webkit-margin-before: 30px;
          margin-block-start: 30px;
  border-block: 2px solid #011D8A;
  border-inline: 1px solid #011D8A;
}
@container (max-width: 1050px) {
  .decotora__block2 .-inner {
    gap: 4px 2px;
    border-block: none;
    border-inline: none;
  }
}
.decotora__block2 .-item {
  font-size: min(3.73vw, 1.6rem);
  padding-block: 1.75em 1.875em;
  padding-inline: 1em;
  border-inline: 1px solid #011D8A;
  width: 13.125em;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: -webkit-max-content 1fr;
  grid-template-rows: max-content 1fr;
}
@container (max-width: 1050px) {
  .decotora__block2 .-item {
    border-block: 2px solid #011D8A;
    border-inline: 2px solid #011D8A;
  }
}
@media (width < 500px) {
  .decotora__block2 .-item {
    width: 100%;
    padding-block: 1em;
  }
}
.decotora__block2 .-heading {
  font-size: 1.5em;
  color: #011D8A;
  text-align: center;
}
.decotora__block2 .-heading::after {
  content: "";
  width: 1.6666666667em;
  height: 2px;
  background-color: #011D8A;
  display: block;
  -webkit-margin-before: 0.4166666667em;
          margin-block-start: 0.4166666667em;
  margin-inline: auto;
}
.decotora__block2 .-txt {
  display: grid;
  place-items: center;
  place-content: center;
  -webkit-padding-before: 1.625em;
          padding-block-start: 1.625em;
  text-align: center;
  font-weight: 700;
  color: #011D8A;
  line-height: 1.6;
}
@media (width < 500px) {
  .decotora__block2 .-txt {
    -webkit-padding-before: 0.6em;
            padding-block-start: 0.6em;
  }
}
.decotora__cta {
  background: linear-gradient(to bottom, #011D8A, #000824);
  position: relative;
}
.decotora__cta .-heading {
  width: min(100%, 850px);
  margin-inline: auto;
  position: relative;
  z-index: 20;
}
.decotora__cta .-deco-1 {
  width: min(13.96vw, 201px);
  position: absolute;
  top: 16px;
  right: min((100% - var(--w-wrap)) / 2 + var(--w-wrap), 100% - 13.96vw);
}
@media (width < 500px) {
  .decotora__cta .-deco-1 {
    width: 26.67vw;
    top: 10.67vw;
    right: unset;
    left: 0;
  }
}
.decotora__cta .-deco-2 {
  width: min(9.24vw, 133px);
  position: absolute;
  top: 44px;
  left: min((100% - var(--w-wrap)) / 2 + var(--w-wrap), 100% - 13.96vw);
}
@media (width < 500px) {
  .decotora__cta .-deco-2 {
    width: 18.67vw;
    top: 10.67vw;
    right: 0;
    left: unset;
  }
}
.decotora__cta_btns {
  width: min(100%, 638px);
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0 2%;
}
.decotora__cta_btns a {
  display: block;
  transition: opacity 0.3s;
  align-self: end;
}
.decotora__cta_btns a:focus-visible {
  opacity: 0.7;
}
@media (any-hover: hover) {
  .decotora__cta_btns a:hover {
    opacity: 0.7;
  }
}
.decotora__cta .-lead {
  font-size: min(4.27vw, 1.8rem);
  font-weight: 700;
  text-align: center;
  color: #fff;
  line-height: 1.2;
  translate: 0 -80%;
}
@media (width < 900px) {
  .decotora__cta .-lead {
    translate: 0 -50%;
  }
}
@media (width < 500px) {
  .decotora__cta .-lead {
    translate: initial;
    -webkit-margin-after: 1em;
            margin-block-end: 1em;
  }
}
.decotora__cta .-note {
  font-size: min(3.73vw, 1.6rem);
  font-weight: 500;
  text-align: center;
  color: #fff;
  line-height: 1.2;
  -webkit-margin-before: 2em;
          margin-block-start: 2em;
  -webkit-margin-after: 35px;
          margin-block-end: 35px;
}
.decotora__cta .-zigzag-wrap {
  width: 100%;
  overflow: hidden;
  height: 47px;
  position: relative;
}
.decotora__cta .-zigzag-wrap .-zigzag {
  width: auto;
  height: 100%;
  position: absolute;
  top: 0;
  left: 50%;
  translate: -50% 0;
}
.decotora__cta .-curve-wrap {
  width: 100%;
  overflow: hidden;
  height: 57px;
  position: relative;
}
.decotora__cta .-curve-wrap .-curve {
  width: auto;
  height: 100%;
  position: absolute;
  top: 0;
  left: 50%;
  translate: -50% 0;
}
.decotora__block3 {
  display: grid;
  grid-template-columns: 42% 1fr;
  gap: 0 5%;
  padding-block: min(2.67vw, 30px);
}
@media (width < 900px) {
  .decotora__block3 {
    grid-template-columns: 1fr;
  }
}
.decotora__block3 .-heading {
  width: min(90%, 327px);
}
.decotora__block3 .-tags {
  width: min(100%, 464px);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2%;
  -webkit-margin-before: 24px;
          margin-block-start: 24px;
}
.decotora__block3 .-txt {
  width: min(100%, 470px);
  font-size: min(3.73vw, 1.8rem);
  font-weight: 500;
  line-height: 2;
  -webkit-margin-before: 2em;
          margin-block-start: 2em;
}
.decotora__block4 {
  background: linear-gradient(to bottom, #04258A 0%, #2E4473 50%, #FFDC00 100%);
}
.decotora__block4 .-zigzag-wrap {
  width: 100%;
  overflow: hidden;
  height: 47px;
  position: relative;
}
.decotora__block4 .-zigzag-wrap .-zigzag {
  width: auto;
  height: 100%;
  position: absolute;
  top: 0;
  left: 50%;
  translate: -50% 0;
}
.decotora__block4 .l__container {
  -webkit-padding-before: 24px;
          padding-block-start: 24px;
  -webkit-padding-after: 70px;
          padding-block-end: 70px;
}
.decotora__block4_cont {
  width: min(100%, 1028px);
  margin-inline: auto;
}
.decotora__block4_cont .-item {
  -webkit-margin-before: 50px;
          margin-block-start: 50px;
  display: grid;
  gap: 0 6%;
}
.decotora__block4_cont .-item:nth-of-type(odd) {
  grid-template-columns: 1fr 50%;
  grid-template-areas: "img txts";
}
@media (width < 500px) {
  .decotora__block4_cont .-item:nth-of-type(odd) {
    grid-template-columns: 1fr;
    grid-template-areas: "ttl" "img" "txt" "note";
  }
}
.decotora__block4_cont .-item:nth-of-type(even) {
  grid-template-columns: 50% 1fr;
  grid-template-areas: "txts img";
}
@media (width < 500px) {
  .decotora__block4_cont .-item:nth-of-type(even) {
    grid-template-columns: 1fr;
    grid-template-areas: "ttl" "img" "txt" "note";
  }
}
.decotora__block4_cont .-item .-txts {
  font-size: min(4.27vw, 1.8rem);
  grid-area: txts;
}
@media (width < 500px) {
  .decotora__block4_cont .-item .-txts {
    display: contents;
  }
}
.decotora__block4_cont .-item-heading {
  color: #fff;
  line-height: 1.1666666667em;
  font-size: 1.6666666667em;
  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
}
@media (width < 500px) {
  .decotora__block4_cont .-item-heading {
    grid-area: ttl;
    -webkit-margin-after: 0.8em;
            margin-block-end: 0.8em;
  }
}
.decotora__block4_cont .-item-txt {
  color: #fff;
  font-weight: 500;
  line-height: 1.69;
  margin-block: 1.5em;
  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
}
@media (width < 500px) {
  .decotora__block4_cont .-item-txt {
    grid-area: txt;
  }
}
.decotora__block4_cont .-item-note {
  color: #fff;
  font-weight: 700;
  font-size: 0.8888888889em;
  display: grid;
  grid-template-columns: 4px 1fr;
  gap: 1em;
  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
}
@media (width < 500px) {
  .decotora__block4_cont .-item-note {
    grid-area: note;
  }
}
.decotora__block4_cont .-item-note span {
  line-height: 1.3;
}
.decotora__block4_cont .-item-note::before {
  content: "";
  width: 4px;
  height: 1.3125em;
  display: block;
  background-color: #FEDB02;
}
.decotora__block4_cont .-item img {
  grid-area: img;
}
.decotora__block5 {
  padding-block: min(10vw, 40px);
}
.decotora__block5_cont {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
  gap: 20px;
  -webkit-margin-before: min(20vw, 30px);
          margin-block-start: min(20vw, 30px);
}
@media (width < 500px) {
  .decotora__block5_cont {
    grid-template-columns: 1fr;
  }
}
.decotora__block5_cont .-item {
  font-size: min(3.73vw, 1.8rem);
  background-color: #fff;
  border: 2px solid #000;
  border-radius: 10px;
  padding-block: 20px;
  padding-inline: 20px;
}
.decotora__block5_cont .-item .-heading {
  font-size: 2.1111111111em;
  display: grid;
  grid-template-columns: 2.1052631579em 1fr;
  gap: 0.4em;
  align-items: center;
}
.decotora__block5_cont .-item .-heading .-num {
  font-size: 0.8421052632em;
  aspect-ratio: 1/1;
  display: grid;
  place-items: center;
  place-content: center;
  border: 2px solid #000;
  color: #fff;
  -webkit-text-stroke: 4px #000;
  paint-order: stroke;
  letter-spacing: 0.15em;
  border-radius: 50%;
  line-height: 1;
  -webkit-padding-after: 0.2em;
          padding-block-end: 0.2em;
}
.decotora__block5_cont .-item .-heading .-num.-yl {
  background-color: #FED801;
}
.decotora__block5_cont .-item .-heading .-num.-or {
  background-color: #FC6401;
}
.decotora__block5_cont .-item .-heading .-num.-rd {
  background-color: #DC0516;
}
.decotora__block5_cont .-item .-heading .-num .-ttl {
  line-height: 1;
}
.decotora__block5_cont .-item .-txt {
  line-height: 1.4;
  font-weight: 400;
  -webkit-margin-before: 1em;
          margin-block-start: 1em;
}
.decotora__block6 {
  padding-block: min(20vw, 40px);
  background-color: #04258A;
}
.decotora__block6 .-lead {
  font-size: min(4.27vw, 2rem);
  color: #fff;
  font-weight: 700;
  line-height: 1.9;
  text-align: center;
  margin-block: 1.4em;
}
.decotora__block7 {
  padding-block: min(20vw, 40px);
}
.decotora__block7 .trabody__faq_item {
  width: min(100%, 1000px);
  margin-inline: auto;
}

.slider__decotora {
  padding-inline: 50px;
  position: relative;
  -webkit-margin-before: min(5vw, 40px);
          margin-block-start: min(5vw, 40px);
}
@media (width < 500px) {
  .slider__decotora {
    padding-inline: 6.67vw;
  }
}
.slider__decotora .splide__slide {
  padding-inline: 10px;
}
.slider__decotora .splide__arrows {
  width: 100%;
  position: absolute;
  top: 40%;
  left: 0;
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
}
.slider__decotora .splide__arrow {
  width: min(6.67vw, 50px);
  height: min(6.67vw, 50px);
  background-color: #fff;
  border-radius: 50%;
  border: 2px solid #000;
  display: grid;
  place-items: center;
  place-content: center;
  transition: opacity 0.3s;
}
.slider__decotora .splide__arrow:focus-visible {
  opacity: 0.7;
}
@media (any-hover: hover) {
  .slider__decotora .splide__arrow:hover {
    opacity: 0.7;
  }
}
.slider__decotora .splide__arrow svg {
  width: 50%;
}
.slider__decotora .splide__arrow--prev {
  rotate: 180deg;
}
