:root {
  --pageHeight1: 20vh;
  --pageHeight2: 8500px;
  --pageHeight3: 4000px;
  --pageHeight4: 3000px;
  --blueAreaChangeStylePos: 1000px;
}

.siteMain div,
.siteMain dl,
.siteMain dt,
.siteMain dd,
.siteMain ul,
.siteMain ol,
.siteMain li,
.siteMain h1,
.siteMain h2,
.siteMain h3,
.siteMain h4,
.siteMain h5,
.siteMain h6,
.siteMain pre,
.siteMain code,
.siteMain form,
.siteMain fieldset,
.siteMain legend,
.siteMain input,
.siteMain textarea,
.siteMain p,
.siteMain blockquote,
.siteMain th,
.siteMain td,
.siteMain select,
.siteMain main,
.siteMain address,
.siteMain span,
.siteMain article,
.siteMain aside,
.siteMain details,
.siteMain figcaption,
.siteMain figure,
.siteMain footer,
.siteMain header,
.siteMain hgroup,
.siteMain menu,
.siteMain nav,
.siteMain section {
  box-sizing: border-box;
}


.air-page-loader__inner {
  max-width: 125px;
  max-height: 125px;
}

.siteMain a,
.siteMain span,
.siteMain details,
.siteMain summary {
  box-sizing: border-box;
}

.siteMain img {
  backface-visibility: hidden;
}

.siteMain {
  font-size: 1.125rem;
  color: #000;
  text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
}

@media (max-width: 479px) {
  .siteMain .for-pc {
    display: none !important;
  }
}

@media (min-width: 1024px) {
  .siteMain .for-tabsp {
    display: none !important;
  }
}

@media (min-width: 480px) {
  .siteMain .for-sp {
    display: none !important;
  }
}

.siteMain .clearfix:after {
  content: "";
  clear: both;
  display: block;
}

.siteMain img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom;
}

.siteMain a {
  text-decoration: none;
  transition: all 0.3s;
}

.siteMain a img {
  opacity: 1;
  transition: all 0.3s;
}

@media (min-width: 480px) {
  .siteMain a:hover img {
    opacity: 0.6;
  }
}

@media (max-width: 479px) {
  .siteMain a:active img {
    opacity: 0.8;
  }
}

.siteMain p {
  line-height: 190%;
}

@media (min-width: 480px) {
  .siteMain p a:hover {
    color: #0097e0;
  }
}

@media (max-width: 479px) {
  .siteMain p a:active {
    color: #0097e0;
  }
}

.btn-big {
  position: relative;
  display: inline-flex;
  align-items: center;
  height: 76px;
  padding: 10px 100px 10px 40px;
  color: #0097e0;
  font-size: 1.3rem;
  background: #fff;
  color: #0097e0;
  text-align: left;
}

@media (min-width: 480px) and (max-width: 1023px) {
  .btn-big {
    padding: 10px 120px 10px 30px;
  }
}

@media (max-width: 479px) {
  .btn-big {
    display: flex;
    height: 42px;
    padding: 5px 15px 5px;
    font-size: 1rem;
  }
}

@media (hover: hover) {
  .btn-big:hover {
    background: #d2f1ff;
  }
}

.btn-big:visited {
  color: #0097e0;
}

.btn-big::after {
  content: "";
  display: inline-block;
  position: absolute;
  right: 50px;
  top: calc(50% - 4px);
  width: 40px;
  height: 8px;
  background: url("/-/media/Project/Daikin/daikin_com/air/future/images/top/icon-arrow-long svg") center center/contain no-repeat;
}

@media (max-width: 479px) {
  .btn-big::after {
    width: 23px;
    right: 20px;
  }
}

.text-s {
  font-size: 85%;
}

.text-l {
  font-size: 120%;
}

.cl-red {
  color: #ff0000;
}

.al-l {
  text-align: left;
}

.al-r {
  text-align: right;
}

.al-c {
  text-align: center;
}

.full {
  width: 100%;
}

.size-30 {
  width: 30%;
}

@media (max-width: 479px) {
  .size-30 {
    width: 70%;
  }
}

.size-60 {
  width: 60%;
}

@media (max-width: 479px) {
  .size-60 {
    width: 100%;
  }
}

.indent {
  width: 97%;
  margin: 0 0 0 auto;
}

.section-small {
  margin-top: 20px;
  margin-bottom: 20px;
}

.section-1 {
  margin-top: 30px;
  margin-bottom: 40px;
}

.section-1:first-child {
  margin-top: 0;
}

.section-2 {
  margin-top: 40px;
  margin-bottom: 70px;
}

.section-2:first-child {
  margin-top: 0;
}

.section-3 {
  margin-top: 40px;
  margin-bottom: 100px;
}

.section-3:first-child {
  margin-top: 0;
}

.section-center {
  max-width: 1920px;
  width: 100%;
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 480px) and (max-width: 2019px) {
  .section-center {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (max-width: 479px) {
  .section-center-sp {
    width: 90% !important;
    margin-left: auto;
    margin-right: auto;
  }
}

.title-bold {
  margin-bottom: 5px;
  font-size: 1.6rem;
  font-weight: bold;
}

.title-center {
  position: relative;
  margin-bottom: 50px;
  padding-bottom: 60px;
  font-size: min(3.25rem, 5vw);
  font-weight: bold;
  color: #0097e0;
  text-align: center;
}

@media (max-width: 479px) {
  .title-center {
    line-height: 1.4;
    padding-bottom: 40px;
    margin-bottom: 40px;
    font-size: 1.75rem;
  }
}

.title-center.is-white {
  color: #fff;
}

.title-center::after {
  content: "";
  display: inline-block;
  position: absolute;
  bottom: 0;
  left: calc(50% - 40px);
  width: 80px;
  height: 8px;
  background: #BEA88B;
}

@media (max-width: 479px) {
  .title-center::after {
    height: 4px;
    width: 40px;
    left: calc(50% - 20px);
  }
}

.pagerDot {
  position: fixed;
  right: 25px;
  top: 0;
  display: flex;
  justify-content: center;
  flex-direction: column;
  height: 100%;
  z-index: 4;
}

@media (min-width: 1024px) {
  .pagerDot {
    padding-top: 50px;
  }
}

@media (min-width: 480px) and (max-width: 1023px) {
  .pagerDot {
    top: 62.7px;
    right: 16px;
  }
}

@media (max-width: 479px) {
  .pagerDot {
    top: 62.7px;
    right: 12px;
  }
}

.pagerDot-ul {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

@media (max-width: 479px) {
  .pagerDot-ul {
    gap: 10px;
    padding-bottom: 60px;
  }
}

.pagerDot-ul-li button {
  appearance: none;
  position: relative;
  width: 26px;
  height: 26px;
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
  transition: all 0.3s;
}

.pagerDot-ul-li button::before {
  content: "";
  position: absolute;
  top: calc(50% - 8px);
  left: calc(50% - 8px);
  display: inline-block;
  background: rgba(255, 255, 255, 0.5);
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 1px solid #707070;
  transition: all 0.2s;
  box-sizing: border-box;
}

@media (max-width: 479px) {
  .pagerDot-ul-li button::before {
    width: 14px;
    height: 14px;
    border-color: #8B7750;
  }
}

@media (hover: hover) {
  .pagerDot-ul-li button:hover::before {
    opacity: 0.5;
  }
}

.pagerDot-ul-li button.is-current::before {
  background: #8B7750;
}

#Pagetop {
  display: none !important;
}

@media (min-width: 480px) {
  #HeaderShrinking {
    position: absolute !important;
  }
}

@media (max-width: 1023px) {
  .set-responsiveWebDesign #HeaderShrinking {
    position: relative !important;
  }
}

@media (min-width: 480px) {
  #HeaderSubstitution {
    height: 0 !important;
  }
}

.air-page-loader {
  padding-top: 0 !important;
}

.siteMain {
  opacity: 1;
}

.siteMain.is-loading {
  opacity: 0;
}

.page {
  width: 100%;
}

.page.js-observedSection:not(.is-current) {
  pointer-events: none;
}

.page.is-1 {
  position: relative;
  height: var(--pageHeight1);
  z-index: 1;
}

.page.is-2 {
  height: var(--pageHeight2);
  z-index: 0;
}

.page.is-3 {
  height: var(--pageHeight3);
}

.page.is-4 {
  height: var(--pageHeight4);
}

.page-fixed {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding-block: 1px;
  perspective: 100px;
}

.page-fixed-zScene {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
}

.page-fixed-zScene.js-page-zScene-2 {
  transform-style: initial;
  perspective: 20px;
}

.page-fixed-zScene.js-page-zScene-3 {
  transform-style: initial;
  perspective: 80px;
}

.page-fixed-zScene.js-page-zScene-4 {
  transform-style: initial;
  perspective: 80px;
}

.topMv {
  width: fit-content;
  height: calc(100vh - 120px);
  margin: 128px auto 60px;
  padding-top: 4vh;
}

@media (max-width: 479px) {
  .topMv {
    margin: 100px auto 0;
    padding: 0 5%;
  }
}

.topMv-logo {
  grid-area: logo;
  max-width: 250px;
  height: 30%;
  max-height: 223px;
  margin: 0 auto min(4.5vh, 60px);
}

@media (max-width: 479px) {
  .topMv-logo {
    width: 82px;
    height: auto;
    margin: 0 auto 17px;
  }
}

.topMv-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.topMv-mainText {
  grid-area: mainText;
  max-width: 90%;
  height: 39%;
  max-height: 272px;
  margin-inline: auto;
}

@media (max-width: 479px) {
  .topMv-mainText {
    width: 80%;
    height: auto;
    margin: 0 auto 30px;
  }
}

.topMv-mainText img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.topMv-scroll {
  grid-area: scroll;
  position: relative;
  width: calc(26px - 1vh);
  margin: min(3vh, 70px) auto 0;
}

@media (max-width: 479px) {
  .topMv-scroll {
    width: 20px;
    margin: 50px auto 0;
  }
}

.topMv-scroll::after {
  content: "";
  position: absolute;
  top: calc(100% + 10px);
  left: calc(50% - 2px);
  width: 4px;
  height: 125px;
  background: linear-gradient(#b99876, rgba(0, 0, 0, 0));
  animation: scaleforever 1s ease-in-out infinite;
  transform-origin: top;
}

@media (max-width: 479px) {
  .topMv-scroll::after {
    width: 3px;
  }
}

.bgFall {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: -1;
  pointer-events: none;
}

.bgFall video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@keyframes scaleforever {
  0% {
    transform: scaleY(0);
  }

  100% {
    transform: scaleY(1);
  }
}

.photosPage {
  position: relative;
  width: 100%;
  height: 100%;
  perspective: inherit;
}

.photosPage-img {
  position: absolute;
  width: max(230px, 17%);
  transform-style: preserve-3d;
  will-change: transform;
}

@media (max-width: 479px) {
  .photosPage-img {
    width: 140px;
  }
}

.photosPage-img.is-1 {
  top: 53%;
  right: 3%;
}

@media (max-width: 479px) {
  .photosPage-img.is-1 {
    top: 70%;
  }
}

.photosPage-img.is-2 {
  top: 60%;
  left: -3%;
  transform: translate3d(0, 0, -5px);
}

@media (max-width: 479px) {
  .photosPage-img.is-2 {
    top: 70%;
    width: 120px;
  }
}

.photosPage-img.is-3 {
  top: -10%;
  right: -13%;
  transform: translate3d(0, 0, -10px);
}

@media (max-width: 479px) {
  .photosPage-img.is-3 {
    top: -10%;
  }
}

.photosPage-img.is-4 {
  top: 58%;
  left: 0;
  transform: translate3d(0, 0, -15px);
}

@media (max-width: 479px) {
  .photosPage-img.is-4 {
    top: 10%;
    left: -20%;
  }
}

.photosPage-img.is-5 {
  top: 27%;
  left: -25%;
  transform: translate3d(0, 0, -20px);
  width: max(300px, 17%);
}

@media (max-width: 479px) {
  .photosPage-img.is-5 {
    width: 260px;
    top: -20%;
    left: -30%;
  }
}

.photosPage-img.is-6 {
  top: -40%;
  left: -20%;
  transform: translate3d(0, 0, -25px);
  width: max(500px, 17%);
}

@media (max-width: 479px) {
  .photosPage-img.is-6 {
    width: 300px;
  }
}

.photosPage-img.is-7 {
  top: -10%;
  right: -35%;
  transform: translate3d(0, 0, -30px);
  width: max(450px, 17%);
}

@media (max-width: 479px) {
  .photosPage-img.is-7 {
    top: -20%;
    right: -45%;
    width: 270px;
  }
}

.photosPage-img.is-8 {
  top: 110%;
  right: -20%;
  transform: translate3d(0, 0, -35px);
  width: max(350px, 17%);
}

@media (max-width: 479px) {
  .photosPage-img.is-8 {
    top: 100%;
    right: -30%;
    width: 200px;
  }
}

.photosPage-img.is-9 {
  top: 0%;
  left: -20%;
  transform: translate3d(0, 0, -40px);
}

@media (max-width: 479px) {
  .photosPage-img.is-9 {
    top: -30%;
    left: -20%;
  }
}

.photosPage-img.is-10 {
  top: 0;
  left: 0;
  transform: translate3d(0, 0, -40px);
}

@media (max-width: 479px) {
  .photosPage-img.is-10 {
    top: -5%;
    left: 10%;
  }
}

.photosPage-img.is-11 {
  top: -50%;
  right: -10%;
  transform: translate3d(0, 0, -50px);
}

@media (max-width: 479px) {
  .photosPage-img.is-11 {
    top: -40%;
    right: 20%;
    width: 100px;
  }
}

.photosPage-img.is-12 {
  top: 80%;
  right: -20%;
  transform: translate3d(0, 0, -55px);
  width: max(340px, 17%);
}

@media (max-width: 479px) {
  .photosPage-img.is-12 {
    top: 160%;
    right: 20%;
    width: 200px;
  }
}

.photosPage-img.is-13 {
  top: 80%;
  left: -23%;
  transform: translate3d(0, 0, -60px);
}

@media (max-width: 479px) {
  .photosPage-img.is-13 {
    top: 90%;
    left: -50%;
  }
}

.photosPage-img.is-14 {
  top: 40%;
  right: -50%;
  transform: translate3d(0, 0, -65px);
  width: max(200px, 17%);
}

@media (max-width: 479px) {
  .photosPage-img.is-14 {
    top: 50%;
    right: -70%;
  }
}

.photosPage-img.is-15 {
  top: 30%;
  left: -10%;
  transform: translate3d(0, 0, -70px);
}

@media (min-width: 480px) and (max-width: 1023px) {
  .photosPage-img.is-15 {
    left: -25%;
  }
}

@media (max-width: 479px) {
  .photosPage-img.is-15 {
    top: -20%;
    left: -20%;
  }
}

.photosPage-img.is-16 {
  top: -20%;
  right: -80%;
  transform: translate3d(0, 0, -75px);
  width: max(300px, 17%);
}

@media (max-width: 479px) {
  .photosPage-img.is-16 {
    top: -30%;
    right: -90%;
  }
}

.photosPage-img.is-17 {
  top: 30%;
  right: -10%;
  transform: translate3d(0, 0, -80px);
  width: max(170px, 17%);
}

@media (max-width: 479px) {
  .photosPage-img.is-17 {
    top: -45%;
    right: -20%;
    width: 110px;
  }
}

.photosPage-img.is-18 {
  top: 0;
  left: -30%;
  transform: translate3d(0, 0, -85px);
}

@media (max-width: 479px) {
  .photosPage-img.is-18 {
    top: -10%;
    left: -45%;
  }
}

.photosPage-img.is-19 {
  top: -20%;
  right: -50%;
  transform: translate3d(0, 0, -90px);
  width: max(110px, 17%);
}

@media (max-width: 479px) {
  .photosPage-img.is-19 {
    top: -10%;
    right: -55%;
    width: 90px;
  }
}

.photosPage-img.is-20 {
  top: 70%;
  left: -80%;
  transform: translate3d(0, 0, -95px);
  width: max(510px, 17%);
}

@media (max-width: 479px) {
  .photosPage-img.is-20 {
    top: 90%;
    left: -100%;
    width: 300px;
  }
}

.photosPage-img.is-21 {
  top: -55%;
  right: -30%;
  transform: translate3d(0, 0, -100px);
  width: max(510px, 17%);
}

@media (max-width: 479px) {
  .photosPage-img.is-21 {
    top: -54%;
    right: -10%;
    width: 220px;
  }
}

.photosPage-img.is-22 {
  top: -45%;
  left: -30%;
  transform: translate3d(0, 0, -105px);
}

@media (max-width: 479px) {
  .photosPage-img.is-22 {
    top: -60%;
    left: 0%;
  }
}

.photosPage-img.is-23 {
  top: -7%;
  left: -10%;
  transform: translate3d(0, 0, -110px);
}

@media (min-width: 480px) and (max-width: 1023px) {
  .photosPage-img.is-23 {
    top: -20%;
  }
}

@media (max-width: 479px) {
  .photosPage-img.is-23 {
    top: -47%;
    left: -20%;
  }
}

.photosPage-img.is-24 {
  top: 30%;
  left: -20%;
  transform: translate3d(0, 0, -115px);
}

@media (min-width: 480px) and (max-width: 1023px) {
  .photosPage-img.is-24 {
    left: -34%;
  }
}

@media (max-width: 479px) {
  .photosPage-img.is-24 {
    top: 130%;
    left: -30%;
  }
}

.photosPage-img.is-25 {
  top: 110%;
  right: -10%;
  transform: translate3d(0, 0, -120px);
}

@media (max-width: 479px) {
  .photosPage-img.is-25 {
    top: 150%;
    right: -50%;
    width: 260px;
  }
}

.photosPage-img.is-26 {
  top: -12%;
  right: -30%;
  transform: translate3d(0, 0, -125px);
  width: max(300px, 17%);
}

@media (min-width: 480px) and (max-width: 1023px) {
  .photosPage-img.is-26 {
    top: -20%;
    right: -50%;
  }
}

@media (max-width: 479px) {
  .photosPage-img.is-26 {
    top: 120%;
    right: -80%;
    width: 200px;
  }
}

.photosPage-img.is-27 {
  top: -48%;
  right: 0%;
  transform: translate3d(0, 0, -130px);
  width: max(350px, 17%);
}

@media (max-width: 479px) {
  .photosPage-img.is-27 {
    top: 10%;
    right: 200%;
    width: 200px;
  }
}

.photosPage-img.is-28 {
  top: 110%;
  left: -30%;
  transform: translate3d(0, 0, -135px);
  width: max(370px, 17%);
}

@media (max-width: 479px) {
  .photosPage-img.is-28 {
    top: 190%;
    left: -20%;
  }
}

.photosPage-img.is-29 {
  top: -60%;
  left: -16%;
  transform: translate3d(0, 0, -140px);
}

@media (max-width: 479px) {
  .photosPage-img.is-29 {
    top: -75%;
    left: 50%;
  }
}

.photosPage-img.is-30 {
  top: 70%;
  right: -40%;
  transform: translate3d(0, 0, -145px);
  width: max(370px, 17%);
}

@media (min-width: 480px) and (max-width: 1023px) {
  .photosPage-img.is-30 {
    top: 80%;
    right: -70%;
  }
}

@media (max-width: 479px) {
  .photosPage-img.is-30 {
    top: 145%;
    right: -50%;
    width: 200px;
  }
}

.yearsCopy {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  max-width: 530px;
  height: fit-content;
  margin: auto;
  text-align: center;
}

.yearsCopy::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  display: inline-block;
  background: url("/-/media/Project/Daikin/daikin_com/air/future/images/top/decoration svg") center center/contain no-repeat;
  width: 995px;
  aspect-ratio: 1.736;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

@media (max-width: 479px) {
  .yearsCopy::before {
    width: 110%;
    left: -5%;
    top: auto;
    bottom: calc(100% - 100px);
    transform: translate(0);
    background-image: url("/-/media/Project/Daikin/daikin_com/air/future/images/top/decoration-sp svg");
  }
}

.yearsCopy-title {
  margin-bottom: 30px;
  font-size: min(3.25rem, 4.5vw);
  font-weight: bold;
  color: #0097e0;
}

@media (min-width: 480px) and (max-width: 1023px) {
  .yearsCopy-title {
    margin-bottom: 10px;
  }
}

@media (max-width: 479px) {
  .yearsCopy-title {
    margin-bottom: 20px;
    font-size: 1.75rem;
  }
}

.yearsCopy-lead {
  position: relative;
}

@media (min-width: 480px) and (max-width: 1023px) {
  .yearsCopy-lead {
    max-width: 380px;
    margin: 0 auto;
  }
}

@media (max-width: 479px) {
  .yearsCopy-lead {
    padding: 0 5%;
  }
}

@media (max-width: 479px) {
  .yearsCopy-lead p {
    line-height: 1.8;
  }
}

.yearsCopy-lead p+p {
  margin-top: 25px;
}

.lineImgs {
  display: flex;
}

.lineImgs-img {
  width: 600px;
}

.producingMap {
  position: relative;
  perspective: 30px;
  height: 100vh;
}

.producingMap-inner {
  transform-style: preserve-3d;
  position: absolute;
  top: -160px;
  left: calc(50% - 743px);
  width: 1485px;
  aspect-ratio: 2.04;
  pointer-events: none;
}

@media (min-width: 480px) and (max-width: 1023px) {
  .producingMap-inner {
    top: 0;
  }
}

@media (max-width: 479px) {
  .producingMap-inner {
    top: calc(50vh - 340px);
    left: 0;
    width: 100%;
  }
}

.producingMap-inner img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.producing {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  text-align: center;
  height: fit-content;
  padding-top: 7vh;
}

@media (max-width: 479px) {
  .producing {
    margin-top: 7vw;
  }
}

.producing::before {
  content: "";
  display: inline-block;
  position: absolute;
  top: -160px;
  left: calc(50% - 770px);
  width: 1543px;
  aspect-ratio: 1.87;
  background: url("/-/media/Project/Daikin/daikin_com/air/future/images/top/decoration-2 svg") center center/contain no-repeat;
  pointer-events: none;
}

@media (min-width: 480px) and (max-width: 1023px) {
  .producing::before {
    left: -15%;
    width: 137%;
  }
}

@media (max-width: 479px) {
  .producing::before {
    top: 10px;
    left: -14%;
    width: 130%;
    margin: 0 auto;
  }
}

.producing-title {
  margin-bottom: 80px;
  font-size: min(3.25rem, 4.5vw);
  font-weight: bold;
  color: #0097e0;
}

@media (max-width: 479px) {
  .producing-title {
    margin-bottom: 30px;
    font-size: 1.75rem;
  }
}

.producing-panels {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: center;
  max-width: 1226px;
  gap: 40px 1.3%;
}

@media (min-width: 480px) and (max-width: 1023px) {
  .producing-panels {
    max-width: 100%;
  }
}

@media (max-width: 479px) {
  .producing-panels {
    max-width: 90%;
    gap: 20px 4%;
    justify-content: flex-start;
  }
}

.producing-panels-item {
  width: 32%;
  text-align: left;
}

@media (max-width: 479px) {
  .producing-panels-item {
    width: 48%;
  }
}

.producing-panels-item-label {
  position: relative;
  display: flex;
  align-items: center;
  width: 90%;
  height: 62px;
  padding-left: 25px;
  margin-top: -31px;
  margin-left: 5%;
  background: #0097e0;
  color: #fff;
  font-weight: bold;
  font-size: 0.9rem;
  transition: all 0.2s;
}

#siteMain .producing-panels-item-label a,
#siteMain .producing-panels-item-label a:link,
#siteMain .producing-panels-item-label a:visited,
#siteMain .producing-panels-item-label a:active,
#siteMain .producing-panels-item-label a:hover {
  color: #fff !important;
}

@media (min-width: 480px) and (max-width: 1023px) {
  .producing-panels-item-label {
    width: 100%;
    margin: 0;
  }
}

@media (max-width: 479px) {
  .producing-panels-item-label {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 6px 15px 6px 15px;
    font-size: 0.8rem;
    line-height: 1.4;
  }
}

@media (hover: hover) {
  a:hover .producing-panels-item-label {
    background: #30baff;
  }
}

.producing-panels-item-label::after {
  content: "";
  display: inline-block;
  position: absolute;
  right: 25px;
  top: calc(50% - 6px);
  width: 40px;
  height: 8px;
  background: url("/-/media/Project/Daikin/daikin_com/air/future/images/top/icon-arrow-long-white svg") center center/contain no-repeat;
}

@media (max-width: 479px) {
  .producing-panels-item-label::after {
    width: 30px;
    height: 6px;
    right: 10px;
  }
}

.skyPerticle {
  position: relative;
  perspective: inherit;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.skyPerticle-item {
  display: block;
  position: absolute;
  width: 100%;
  transform-style: preserve-3d;
}

.skyPerticle-item.is-1 {
  left: 20%;
  width: 70%;
}

@media (max-width: 1023px) {
  .skyPerticle-item.is-1 {
    bottom: 30%;
  }
}

.skyPerticle-item.is-2 {
  top: -10vh;
  right: -20vw;
}

@media (max-width: 1023px) {
  .skyPerticle-item.is-2 {
    top: calc(50% - 50px);
  }
}

.skyPerticle-item.is-3 {
  top: 0;
  left: 5vw;
  width: 80%;
}

@media (max-width: 1023px) {
  .skyPerticle-item.is-3 {
    left: 0;
    top: 40%;
  }
}

.skyPerticle-item.is-4 {
  top: 0;
  left: -1vw;
  width: 50%;
}

@media (max-width: 1023px) {
  .skyPerticle-item.is-4 {
    top: 0;
  }
}

.airMainCopy {
  position: absolute;
  max-width: 850px;
  height: fit-content;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}

.airMainCopy::before {
  content: "";
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 1284px;
  height: 661px;
  background: url("/-/media/Project/Daikin/daikin_com/air/future/images/top/decoration-3 svg") center center/contain no-repeat;
  transform: translate3d(-50%, -50%, 0);
  pointer-events: none;
}

@media (max-width: 479px) {
  .airMainCopy::before {
    top: 8vh;
    width: 138%;
    aspect-ratio: 1.94;
    background-image: url("/-/media/Project/Daikin/daikin_com/air/future/images/top/decoration-3-sp svg");
  }
}

.airMainCopy-title {
  margin-bottom: 30px;
  font-size: min(3.25rem, 4.5vw);
  font-weight: bold;
  color: #0097e0;
  text-align: center;
  line-height: 1.6;
}

@media (max-width: 479px) {
  .airMainCopy-title {
    font-size: 1.75rem;
  }
}

.airMainCopy-lead {
  text-align: center;
}

@media (max-width: 479px) {
  .airMainCopy-lead {
    position: relative;
    padding: 0 5%;
  }
}

.airMainCopy-lead p+p {
  margin-top: 25px;
}

.defaultScrollArea {
  position: relative;
}

.blueArea {
  padding-bottom: 1px;
}

.is-expandBlue .blueArea {
  background: #0097e0;
}

.page5Ovserve {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
}

.forNext-stickyContainer {
  height: calc(100vh + var(--blueAreaChangeStylePos));
}

@media (max-width: 479px) {
  .forNext-stickyContainer {
    height: calc(125vh + var(--blueAreaChangeStylePos));
  }
}

.forNext-fix-maskWrap {
  position: sticky;
  top: 0;
  width: 100%;
  clip-path: circle(50% at 50% 50%);
}

.forNext-fix {
  width: 100%;
  height: 100%;
  min-height: 100vh;
  background: #0097e0;
  padding-block: 20vh 0;
}

.forNext {
  text-align: center;
}

.forNext-title {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #BEA88B;
  margin-bottom: 40px;
  width: 500px;
  max-width: 100%;
  height: 74px;
  padding: 10px 40px;
  font-size: 2rem;
  font-weight: bold;
  color: #fff;
}

@media (max-width: 479px) {
  .forNext-title {
    width: fit-content;
    height: 44px;
    font-size: 5vw;
  }
}

.forNext-copy {
  position: relative;
  margin-bottom: 50px;
  padding-bottom: 60px;
  font-size: min(3.25rem, 4.5vw);
  font-weight: bold;
  color: #fff;
}

@media (max-width: 479px) {
  .forNext-copy {
    line-height: 1.4;
    font-size: 1.75rem;
    padding-bottom: 40px;
    margin-bottom: 40px;
  }
}

.forNext-copy::after {
  content: "";
  display: inline-block;
  position: absolute;
  bottom: 0;
  left: calc(50% - 40px);
  width: 80px;
  height: 8px;
  background: #BEA88B;
}

@media (max-width: 479px) {
  .forNext-copy::after {
    height: 4px;
    width: 40px;
    left: calc(50% - 20px);
  }
}

.forNext-text {
  color: #fff;
  padding-inline: 5%;
}

@media (max-width: 479px) {
  .forNext-text {
    padding: 0 10%;
  }
}

.forNext-text p+p {
  margin-top: 25px;
}

.comfortableSpace {
  margin-top: 500px;
  padding-inline: 5%;
}

@media (min-width: 480px) and (max-width: 1023px) {
  .comfortableSpace {
    margin-top: 50px;
  }
}

@media (max-width: 479px) {
  .comfortableSpace {
    margin-top: 470px;
    padding-top: 30px;
  }
}

.comfortableSpace-img {
  max-width: 918px;
  max-height: calc(100vh - 300px);
  margin: 0 auto 120px;
  aspect-ratio: 1.08;
}

@media (max-width: 479px) {
  .comfortableSpace-img {
    margin-bottom: 50px;
  }
}

.comfortableSpace-text {
  color: #fff;
  text-align: center;
}

@media (max-width: 479px) {
  .comfortableSpace-text {
    padding: 0 10%;
  }
}

.comfortableSpace-text p+p {
  margin-top: 25px;
}

.comfortableSpace-btn {
  margin-top: 40px;
  text-align: center;
}

@media (max-width: 479px) {
  .comfortableSpace-btn {
    margin: 40px auto 0;
  }
}

.comfortableSpace-btn a {
  width: 536px;
  max-width: 90%;
}

@media (max-width: 479px) {
  .comfortableSpace-btn a {
    width: 165px;
    margin: 0 auto;
  }
}

.idealAir {
  margin-top: 500px;
}

@media (max-width: 479px) {
  .idealAir {
    margin-top: 220px;
    padding-top: 30px;
  }
}

.idealAir-text {
  color: #fff;
  text-align: center;
  padding-inline: 5%;
}

@media (max-width: 479px) {
  .idealAir-text {
    padding: 0 10%;
  }
}

.idealAir-text p+p {
  margin-top: 25px;
}

.idealAirBalloon {
  overflow: hidden;
}

.idealAirBalloon-main {
  margin-block: 180px 110px;
  margin-inline: auto;
  width: min(660px, 57%);
}

@media (max-width: 479px) {
  .idealAirBalloon-main {
    width: 50%;
    margin: 50px auto 10px;
  }
}

.idealAirBalloon-sub {
  margin-left: auto;
  margin-right: auto;
  max-width: 1920px;
  width: 100%;
  position: relative;
  height: 2400px;
}

@media (min-width: 480px) and (max-width: 2019px) {
  .idealAirBalloon-sub {
    max-width: 90%;
    width: 90%;
  }
}

@media (min-width: 480px) and (max-width: 1023px) {
  .idealAirBalloon-sub {
    height: 1500px;
  }
}

@media (max-width: 479px) {
  .idealAirBalloon-sub {
    height: 1200px;
    margin-top: 100px;
  }
}

.idealAirBalloon-sub-item {
  position: absolute;
  bottom: 0;
}

@media (max-width: 1023px) {
  .idealAirBalloon-sub-item {
    height: fit-content;
  }
}

.idealAirBalloon-sub-item.is-1 {
  top: 0;
  right: -2%;
}

@media (min-width: 1024px) and (max-width: 2019px) {
  .idealAirBalloon-sub-item.is-1 {
    width: 630px;
  }
}

@media (max-width: 1023px) {
  .idealAirBalloon-sub-item.is-1 {
    top: -200px;
    width: 60%;
  }
}

@media (max-width: 479px) {
  .idealAirBalloon-sub-item.is-1 {
    top: -40px;
    right: 8%;
  }
}

.idealAirBalloon-sub-item.is-2 {
  top: 300px;
  left: -6%;
}

@media (min-width: 1024px) and (max-width: 2019px) {
  .idealAirBalloon-sub-item.is-2 {
    width: 470px;
  }
}

@media (max-width: 1023px) {
  .idealAirBalloon-sub-item.is-2 {
    width: 45%;
    top: 0;
  }
}

@media (max-width: 479px) {
  .idealAirBalloon-sub-item.is-2 {
    top: 110px;
    left: -10%;
  }
}

.idealAirBalloon-sub-item.is-3 {
  top: 390px;
  left: 30%;
}

@media (min-width: 1024px) and (max-width: 2019px) {
  .idealAirBalloon-sub-item.is-3 {
    width: 520px;
    left: 35%;
  }
}

@media (max-width: 1023px) {
  .idealAirBalloon-sub-item.is-3 {
    width: 50%;
    top: 170px;
  }
}

@media (max-width: 479px) {
  .idealAirBalloon-sub-item.is-3 {
    top: 280px;
    left: 25%;
  }
}

.idealAirBalloon-sub-item.is-4 {
  top: 760px;
  right: -10%;
}

@media (max-width: 1023px) {
  .idealAirBalloon-sub-item.is-4 {
    width: 45%;
    top: 400px;
  }
}

@media (max-width: 479px) {
  .idealAirBalloon-sub-item.is-4 {
    top: 150px;
    right: -5%;
  }
}

.idealAirBalloon-sub-item.is-5 {
  top: 860px;
  left: -10%;
}

@media (min-width: 1024px) and (max-width: 2019px) {
  .idealAirBalloon-sub-item.is-5 {
    width: min(720px, 63%);
    left: -5%;
  }
}

@media (min-width: 480px) and (max-width: 1023px) {
  .idealAirBalloon-sub-item.is-5 {
    width: 70%;
    top: 400px;
    left: -5%;
  }
}

@media (max-width: 479px) {
  .idealAirBalloon-sub-item.is-5 {
    width: 80%;
    top: 440px;
    left: -8%;
  }
}

.idealAirBalloon-sub-item.is-6 {
  top: 1100px;
  right: 0%;
}

@media (min-width: 1024px) and (max-width: 2019px) {
  .idealAirBalloon-sub-item.is-6 {
    width: min(520px, 44%);
    top: 1200px;
    right: -3%;
  }
}

@media (min-width: 480px) and (max-width: 1023px) {
  .idealAirBalloon-sub-item.is-6 {
    width: 40%;
    top: 700px;
  }
}

@media (max-width: 479px) {
  .idealAirBalloon-sub-item.is-6 {
    width: 50%;
    top: 660px;
    right: -6%;
  }
}

.idealAirBalloon-sub-item.is-7 {
  top: 1800px;
  left: -1%;
}

@media (min-width: 1024px) and (max-width: 2019px) {
  .idealAirBalloon-sub-item.is-7 {
    top: 1570px;
    width: 390px;
  }
}

@media (max-width: 1023px) {
  .idealAirBalloon-sub-item.is-7 {
    width: 40%;
    top: 880px;
    left: 3%;
  }
}

@media (max-width: 479px) {
  .idealAirBalloon-sub-item.is-7 {
    top: 740px;
    left: 5%;
  }
}

.idealAirBalloon-sub-item.is-8 {
  top: 1670px;
  right: 40%;
}

@media (min-width: 1024px) and (max-width: 2019px) {
  .idealAirBalloon-sub-item.is-8 {
    top: 1460px;
    width: 300px;
  }
}

@media (max-width: 1023px) {
  .idealAirBalloon-sub-item.is-8 {
    width: 40%;
    top: 990px;
    right: 10%;
  }
}

@media (max-width: 479px) {
  .idealAirBalloon-sub-item.is-8 {
    top: 940px;
    right: 54%;
  }
}

.idealAirBalloon-sub-item.is-9 {
  top: 1780px;
  right: -5%;
}

@media (min-width: 1024px) and (max-width: 2019px) {
  .idealAirBalloon-sub-item.is-9 {
    width: 470px;
    top: 1670px;
    right: 0%;
  }
}

@media (max-width: 1023px) {
  .idealAirBalloon-sub-item.is-9 {
    right: auto;
    width: 50%;
    top: 1140px;
    left: 10%;
  }
}

@media (max-width: 479px) {
  .idealAirBalloon-sub-item.is-9 {
    top: 830px;
    left: auto;
    right: 5%;
  }
}

.idealAirBalloonLinkBox {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 750px;
  left: 0;
  right: 0;
  margin: auto;
  width: 1364px;
  max-width: 90%;
  background: rgba(77, 195, 255, 0.6);
  border-radius: 10px;
  height: 496px;
  z-index: 1;
}

@media (min-width: 480px) and (max-width: 1023px) {
  .idealAirBalloonLinkBox {
    top: 10%;
    padding: 40px 5%;
    height: auto;
  }
}

@media (max-width: 479px) {
  .idealAirBalloonLinkBox {
    width: 86%;
    top: 30%;
    padding: 30px 2%;
    height: auto;
  }
}

.idealAirBalloonLinkBox-title {
  margin-bottom: 50px;
  text-align: center;
  font-size: min(2.5rem, 6.8vw);
  font-weight: bold;
  color: #fff;
}

@media (max-width: 479px) {
  .idealAirBalloonLinkBox-title {
    margin-bottom: 20px;
    font-size: 1.5rem;
  }
}

.idealAirBalloonLinkBox-btn {
  text-align: center;
  width: 536px;
  max-width: 100%;
}

@media (max-width: 479px) {
  .idealAirBalloonLinkBox-btn {
    width: 60%;
  }
}

.idealAirBalloonLinkBox-btn a {
  width: 100%;
}

@media (max-width: 479px) {
  .idealAirBalloonLinkBox-btn a {
    width: 100%;
  }
}

.perfecting {
  position: relative;
  margin-top: 370px;
  z-index: 2;
}

@media (max-width: 479px) {
  .perfecting {
    margin-top: 110px;
    padding-top: 30px;
  }
}

.perfecting-text {
  max-width: 1000px;
  text-align: center;
  margin: 70px auto;
  padding-inline: 30px;
  color: #fff;
}

@media (min-width: 480px) and (max-width: 1023px) {
  .perfecting-text {
    padding-inline: 5%;
  }
}

@media (max-width: 479px) {
  .perfecting-text {
    margin-top: 30px;
    padding: 0 10%;
  }
}

.perfecting-text p+p {
  margin-top: 25px;
}

.perfecting-btn {
  text-align: center;
}

.perfecting-btn a {
  width: 536px;
  max-width: 90%;
}

@media (max-width: 479px) {
  .perfecting-btn a {
    width: 80%;
    height: 42px;
    margin: 0 auto;
    font-size: 1rem;
  }
}

.footerimg {
  position: relative;
  margin-top: min(-220px, -25vw);
  z-index: 1;
}

@media (min-width: 480px) and (max-width: 1023px) {
  .footerimg {
    margin-top: -25vw;
  }
}

@media (max-width: 479px) {
  .footerimg {
    margin-top: 0;
  }
}

.footerimg::before {
  content: "";
  display: inline-block;
  position: absolute;
  bottom: 100%;
  left: 0;
  width: 100%;
  height: 100vh;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0), #017be8);
}