:root {
  --pc: 1440 * 100vw;
  --sp: 375 * 100vw;
}

#main {
  overflow: visible;
}

.lp {
  font-family: "Shippori Mincho", serif;
  color: #3D3D3D;
  scroll-behavior: smooth;
  text-align: center;
}
.lp * {
  box-sizing: border-box;
}
.lp .fade, .lp .zoom {
  opacity: 0;
}
.lp .fade.active {
  animation: fade 0.8s ease-in-out forwards;
}
.lp .zoom.active {
  animation: zoom 1s ease-in-out forwards;
}
@keyframes fade {
  0% {
    opacity: 0;
    filter: blur(4px);
    transform: translateY(10px);
  }
  100% {
    opacity: 1;
    filter: blur(0);
    transform: translateY(0);
  }
}
@keyframes zoom {
  0% {
    opacity: 0;
    transform: scale(1.1);
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes marquee {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}
.lp img {
  image-rendering: auto;
  max-width: none;
  display: block;
}
.lp .kv {
  display: flex;
  gap: 0 calc(59 / var(--pc));
  padding-left: calc(109 / var(--pc));
}
.lp .kv .kv-txt {
  width: calc(392 / var(--pc));
  flex-shrink: 0;
  margin-top: calc(168 / var(--pc));
}
.lp .kv .kv-txt h1 {
  font-size: calc(40 / var(--pc));
  line-height: calc(60 / var(--pc));
  font-weight: 400;
  text-align: left;
}
.lp .kv .kv-txt h1 .background {
  padding: 0 calc(14 / var(--pc)) 0 calc(12 / var(--pc));
  position: relative;
  display: inline-block;
}
.lp .kv .kv-txt h1 .background::before {
  display: block;
  content: "";
  width: calc(106 / var(--pc));
  height: calc(60 / var(--pc));
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
.lp .kv .kv-txt h1 .background:nth-of-type(1) {
  margin-left: calc(40 / var(--pc));
}
.lp .kv .kv-txt h1 .background:nth-of-type(1)::before {
  background-color: #FFE4D6;
}
.lp .kv .kv-txt h1 .background:nth-of-type(2) {
  margin-left: calc(-11 / var(--pc));
}
.lp .kv .kv-txt h1 .background:nth-of-type(2)::before {
  background-color: #EDE8FF;
}
.lp .kv .kv-txt h1 .background p {
  opacity: 0;
  animation: fade 0.8s ease-in-out forwards;
  position: relative;
}
.lp .kv .kv-txt h1 span {
  padding: 0 calc(4 / var(--pc)) 0;
  margin-left: calc(-10 / var(--pc));
}
.lp .kv .kv-txt h1 img {
  width: calc(318 / var(--pc));
  margin-top: calc(16 / var(--pc));
}
.lp .kv .kv-txt .kv-eng {
  font-family: "Cormorant Garamond", serif;
  font-size: calc(17 / var(--pc));
  line-height: calc(53 / var(--pc));
  letter-spacing: 0.08em;
  border-top: 1px solid #626262;
  border-bottom: 1px solid #626262;
  margin: calc(40 / var(--pc)) 0 0 calc(40 / var(--pc));
  width: calc(312 / var(--pc));
}
.lp .kv .kv-txt img {
  width: calc(192 / var(--pc));
  margin: calc(28 / var(--pc)) auto 0;
}
.lp .kv .kv-img {
  overflow: hidden;
}
.lp .kv .kv-img .kv-img-inner {
  display: flex;
  transform: scale(1.1);
  animation: zoom 1s ease-in-out forwards;
}
.lp .kv .kv-img .kv-img-inner img {
  width: calc(440 / var(--pc));
}
.lp .read {
  margin-top: calc(82 / var(--pc));
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: calc(13 / var(--pc));
  line-height: 190%;
}
.lp .menu {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  gap: 0 calc(20 / var(--pc));
  margin-top: calc(80 / var(--pc));
}
.lp .menu .menu-item {
  width: calc(220 / var(--pc));
}
.lp .menu .menu-item .menu-img {
  position: relative;
}
.lp .menu .menu-item .menu-img p {
  position: absolute;
  bottom: 0;
  width: 100%;
  font-size: calc(13 / var(--pc));
  line-height: 140%;
  padding: calc(9 / var(--pc)) 0;
  font-family: "Zen Kaku Gothic New", sans-serif;
}
.lp .menu .menu-item .menu-img + p {
  font-size: calc(18 / var(--pc));
  font-weight: 500;
  line-height: 100%;
  margin-top: calc(20 / var(--pc));
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0 calc(5 / var(--pc));
}
.lp .menu .menu-item .menu-img + p::after {
  display: inline-block;
  content: "";
  width: calc(19 / var(--pc));
  height: calc(19 / var(--pc));
  border-radius: 50%;
  background-image: url(../img/arrow.webp);
  background-repeat: no-repeat;
  background-size: calc(10 / var(--pc)) calc(10 / var(--pc));
  background-position: center center;
}
.lp .menu .menu-item:nth-of-type(1) .menu-img p {
  background-color: #FFEDE4;
}
.lp .menu .menu-item:nth-of-type(1) .menu-img + p::after {
  background-color: #FFAA81;
}
.lp .menu .menu-item:nth-of-type(2) .menu-img p {
  background: #E2EEF6;
}
.lp .menu .menu-item:nth-of-type(2) .menu-img + p::after {
  background-color: #ACCAF8;
}
.lp .menu .menu-item:nth-of-type(3) .menu-img p {
  background: #F0EDFB;
}
.lp .menu .menu-item:nth-of-type(3) .menu-img + p::after {
  background-color: #C7BBF0;
}
.lp .menu .menu-item:nth-of-type(4) .menu-img p {
  background: #FCF5D9;
}
.lp .menu .menu-item:nth-of-type(4) .menu-img + p::after {
  background-color: #EECD7A;
}
.lp .side-menu {
  position: fixed;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  writing-mode: vertical-lr;
  width: calc(46 / var(--pc));
  display: flex;
  gap: 0 1px;
  z-index: 4;
  opacity: 0;
  transition: 0.6s;
}
.lp .side-menu.fixed {
  opacity: 1;
}
.lp .side-menu li {
  font-size: calc(15 / var(--pc));
  display: block;
  width: 100%;
  height: calc(150 / var(--pc));
  background-color: #E1E1E1;
  position: relative;
}
.lp .side-menu li.active {
  color: #fff;
}
.lp .side-menu li.active.orange {
  background-color: #FFAA81;
}
.lp .side-menu li.active.blue {
  background-color: #A0BDE7;
}
.lp .side-menu li.active.purple {
  background-color: #C0BAE7;
}
.lp .side-menu li.active.yellow {
  background-color: #EECD7A;
}
.lp .side-menu li a {
  display: block;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.lp .marquee-txt {
  display: flex;
  align-items: center;
  overflow: hidden;
  white-space: nowrap;
}
.lp .marquee-txt span {
  font-family: "Cormorant Garamond", serif;
  font-size: calc(20 / var(--pc));
  font-weight: 300;
  line-height: calc(46 / var(--pc));
  display: inline-block;
  padding-right: 1em;
  animation: marquee 20s linear infinite;
}
.lp .marquee-txt.orange {
  border-top: 1px solid #FFAA81;
  border-bottom: 1px solid #FFAA81;
  margin-top: calc(120 / var(--pc));
}
.lp .marquee-txt.orange span {
  color: #FFAA81;
}
.lp .marquee-txt.blue {
  border-top: 1px solid #9DC2F8;
  border-bottom: 1px solid #9DC2F8;
  margin-top: calc(144 / var(--pc));
}
.lp .marquee-txt.blue span {
  color: #9DC2F8;
}
.lp .marquee-txt.purple {
  border-top: 1px solid #C3B8EA;
  border-bottom: 1px solid #C3B8EA;
  margin-top: calc(140 / var(--pc));
}
.lp .marquee-txt.purple span {
  color: #C3B8EA;
}
.lp .marquee-txt.yellow {
  border-top: 1px solid #EFC455;
  border-bottom: 1px solid #EFC455;
  margin-top: calc(140 / var(--pc));
}
.lp .marquee-txt.yellow span {
  color: #EFC455;
}
.lp .day-type {
  padding: calc(16 / var(--pc)) calc(29 / var(--pc));
  display: inline-block;
  margin: calc(172 / var(--pc)) auto 0;
}
.lp .day-type + p {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: calc(15 / var(--pc));
  text-align: left;
  line-height: 200%;
  display: flex;
  justify-content: center;
  margin-top: calc(40 / var(--pc));
  gap: 0 calc(40 / var(--pc));
  position: relative;
}
.lp .day-type + p::before {
  display: block;
  content: "";
  width: calc(4 / var(--pc));
  flex-shrink: 0;
}
.lp .day-type.orange {
  background-color: #FFAA81;
}
.lp .day-type.orange img {
  width: calc(150 / var(--pc));
}
.lp .day-type.orange + p::before {
  background: #FFAA81;
}
.lp .day-type.blue {
  background-color: #A0BDE7;
}
.lp .day-type.blue img {
  width: calc(150 / var(--pc));
}
.lp .day-type.blue + p::before {
  background: #A0BDE7;
}
.lp .day-type.purple {
  background-color: #C0BAE7;
}
.lp .day-type.purple img {
  width: calc(306 / var(--pc));
}
.lp .day-type.purple + p::before {
  background: #C0BAE7;
}
.lp .day-type.yellow {
  background-color: #EECD7A;
}
.lp .day-type.yellow img {
  width: calc(360 / var(--pc));
}
.lp .day-type.yellow + p::before {
  background: #EFC455;
}
.lp .style {
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
}
.lp .style .main-img, .lp .style .sub-img01, .lp .style .sub-img02, .lp .style .sub-img03 {
  overflow: hidden;
}
.lp .style .title {
  width: calc(620 / var(--pc));
  padding: calc(55 / var(--pc)) 0 calc(56 / var(--pc)) calc(88 / var(--pc));
  text-align: left;
}
.lp .style .title .sub-title {
  font-size: calc(16 / var(--pc));
  font-weight: 500;
  line-height: 170%;
}
.lp .style .title .main-title {
  font-size: calc(36 / var(--pc));
  font-weight: 500;
  line-height: 120%;
  margin: calc(8 / var(--pc)) 0 calc(20 / var(--pc));
  position: relative;
  display: inline-block;
  z-index: 0;
}
.lp .style .title .main-title::before {
  display: block;
  content: "";
  width: 0%;
  height: calc(12 / var(--pc));
  background: #FFF;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: -1;
  transition: 1.5s;
}
.lp .style .title .main-title.active::before {
  width: 100%;
}
.lp .style .title .icon-container {
  display: flex;
  gap: 0 calc(12 / var(--pc));
  margin-top: calc(40 / var(--pc));
}
.lp .style .title .icon-container .icon-item {
  width: calc(68 / var(--pc));
  height: calc(68 / var(--pc));
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.lp .style .title .icon-container .icon-item img {
  width: auto;
  height: calc(38 / var(--pc));
}
.lp .style .title .icon-container .icon-item p {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: calc(12 / var(--pc));
  color: #FFF;
  margin-top: calc(-6 / var(--pc));
}
.lp .style .style-detail {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: calc(13 / var(--pc));
  line-height: 180%;
  text-align: left;
  width: 100%;
}
.lp .style .item-wrapper .item-container {
  display: flex;
  gap: 0 calc(10 / var(--pc));
}
.lp .style .item-wrapper .item-container .item {
  width: calc(72 / var(--pc));
  text-decoration: underline;
  font-family: "Inter", sans-serif;
  font-size: calc(10 / var(--pc));
  font-weight: 300;
  line-height: 180%;
  letter-spacing: 0.08em;
  text-align: left;
}
.lp .style .item-wrapper .item-container .item img {
  margin-bottom: calc(7 / var(--pc));
}
.lp .style .features dl {
  text-align: left;
}
.lp .style .features dl dt {
  font-family: "Cormorant Garamond", serif;
  font-size: calc(20 / var(--pc));
  font-weight: 300;
  line-height: 180%;
  letter-spacing: 0.08em;
  border-bottom: 1px solid #3D3D3D;
}
.lp .style .features dl dd {
  margin-top: calc(14 / var(--pc));
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: calc(13 / var(--pc));
  line-height: 180%;
}
.lp .link-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0 calc(16 / var(--pc));
  width: calc(352 / var(--pc));
  color: #fff;
  font-size: calc(20 / var(--pc));
  font-weight: 500;
  line-height: calc(61 / var(--pc));
  border-radius: calc(70 / var(--pc));
  border: none;
  margin: calc(120 / var(--pc)) auto 0;
}
.lp .link-btn::after {
  display: block;
  content: "";
  width: calc(6 / var(--pc));
  height: calc(10 / var(--pc));
  background: url(../img/arrow2.webp) no-repeat;
  background-size: contain;
}
.lp #sunny-day .title {
  background: #FFEDE4;
}
.lp #sunny-day .title .main-title span {
  color: #FFAA81;
}
.lp #sunny-day .icon-item {
  background: #FFAA81;
}
.lp #sunny-day .link-btn {
  background-color: #FFAA81;
}
.lp #sunny-day .style01 {
  width: calc(1100 / var(--pc));
  margin-top: calc(104 / var(--pc));
}
.lp #sunny-day .style01 .main-img {
  width: calc(480 / var(--pc));
}
.lp #sunny-day .style01 .title {
  margin-top: calc(57 / var(--pc));
}
.lp #sunny-day .style01 .style-detail {
  margin-top: calc(-287 / var(--pc));
  padding-left: calc(572 / var(--pc));
}
.lp #sunny-day .style01 .item-wrapper {
  width: 100%;
  margin-top: calc(-185 / var(--pc));
  padding-left: calc(572 / var(--pc));
}
.lp #sunny-day .style01 .sub-img01 {
  width: calc(280 / var(--pc));
  margin: calc(199 / var(--pc)) 0 0 calc(100 / var(--pc));
}
.lp #sunny-day .style01 .sub-img02 {
  width: calc(460 / var(--pc));
  margin: calc(64 / var(--pc)) auto 0 calc(160 / var(--pc));
}
.lp #sunny-day .style02 {
  width: calc(1040 / var(--pc));
  margin-top: calc(144 / var(--pc));
}
.lp #sunny-day .style02 .main-img {
  width: calc(420 / var(--pc));
}
.lp #sunny-day .style02 .title {
  margin-top: calc(64 / var(--pc));
}
.lp #sunny-day .style02 .style-detail {
  margin-top: calc(-189 / var(--pc));
  padding: 0 calc(549 / var(--pc)) 0 calc(88 / var(--pc));
}
.lp #sunny-day .style02 .item-wrapper {
  margin: calc(56 / var(--pc)) 0 0 calc(140 / var(--pc));
}
.lp #sunny-day .style02 .sub-img01 {
  width: calc(360 / var(--pc));
  margin: calc(-40 / var(--pc)) 0 0 calc(120 / var(--pc));
}
.lp #sunny-day .style02 .features {
  width: calc(389 / var(--pc));
  margin: calc(125 / var(--pc)) 0 0 calc(120 / var(--pc));
}
.lp #sunny-day .style02 .sub-img02 {
  width: calc(280 / var(--pc));
  margin: calc(64 / var(--pc)) auto 0 calc(131 / var(--pc));
}
.lp #sunny-day .style02 .sub-img03 {
  width: calc(345 / var(--pc));
  margin: calc(-175 / var(--pc)) auto 0 calc(243 / var(--pc));
}
.lp #rainy-day .title {
  background: #E2EEf6;
}
.lp #rainy-day .title .main-title span {
  color: #9DC2F8;
}
.lp #rainy-day .icon-item {
  background: #A0BDE7;
}
.lp #rainy-day .link-btn {
  background-color: #A0BDE7;
}
.lp #rainy-day .style03 {
  width: calc(1100 / var(--pc));
  margin-top: calc(104 / var(--pc));
}
.lp #rainy-day .style03 .main-img {
  width: calc(480 / var(--pc));
}
.lp #rainy-day .style03 .title {
  margin-top: calc(60 / var(--pc));
}
.lp #rainy-day .style03 .style-detail {
  margin-top: calc(-310 / var(--pc));
  padding: 0 calc(549 / var(--pc)) 0 calc(88 / var(--pc));
}
.lp #rainy-day .style03 .item-wrapper {
  width: 100%;
  margin-top: calc(-184 / var(--pc));
  padding: 0 calc(549 / var(--pc)) 0 calc(88 / var(--pc));
}
.lp #rainy-day .style03 .sub-img01 {
  width: calc(460 / var(--pc));
  margin: calc(64 / var(--pc)) 0 0 calc(100 / var(--pc));
}
.lp #rainy-day .style03 .sub-img02 {
  width: calc(280 / var(--pc));
  margin: calc(200 / var(--pc)) auto 0 calc(160 / var(--pc));
}
.lp #rainy-day .style04 {
  width: calc(1040 / var(--pc));
  margin-top: calc(144 / var(--pc));
}
.lp #rainy-day .style04 .main-img {
  width: calc(420 / var(--pc));
}
.lp #rainy-day .style04 .title {
  margin: calc(64 / var(--pc)) 0 0 calc(-2 / var(--pc));
}
.lp #rainy-day .style04 .style-detail {
  margin-top: calc(-216 / var(--pc));
  padding-left: calc(508 / var(--pc));
}
.lp #rainy-day .style04 .item-wrapper {
  margin-top: calc(56 / var(--pc));
}
.lp #rainy-day .style04 .sub-img01 {
  width: calc(360 / var(--pc));
  margin: calc(-40 / var(--pc)) 0 0 calc(160 / var(--pc));
}
.lp #rainy-day .style04 .features {
  width: calc(389 / var(--pc));
  margin: calc(96 / var(--pc)) auto 0 calc(55 / var(--pc));
}
.lp #rainy-day .style04 .sub-img02 {
  width: calc(345 / var(--pc));
  margin: calc(48 / var(--pc)) 0 0 calc(126 / var(--pc));
}
.lp #humid-day .title {
  background: #F0EDFB;
}
.lp #humid-day .title .main-title span {
  color: #C3B8EA;
}
.lp #humid-day .icon-item {
  background: #C3B8EA;
}
.lp #humid-day .link-btn {
  background-color: #C3B8EA;
  width: calc(412 / var(--pc));
}
.lp #humid-day .style05 {
  width: calc(1100 / var(--pc));
  margin-top: calc(104 / var(--pc));
}
.lp #humid-day .style05 .main-img {
  width: calc(480 / var(--pc));
}
.lp #humid-day .style05 .title {
  margin-top: calc(69 / var(--pc));
}
.lp #humid-day .style05 .style-detail {
  margin-top: calc(-301 / var(--pc));
  padding-left: calc(568 / var(--pc));
}
.lp #humid-day .style05 .item-wrapper {
  width: 100%;
  margin-top: calc(-176 / var(--pc));
  padding-left: calc(568 / var(--pc));
}
.lp #humid-day .style05 .sub-img01 {
  width: calc(280 / var(--pc));
  margin: calc(200 / var(--pc)) 0 0 calc(100 / var(--pc));
}
.lp #humid-day .style05 .sub-img02 {
  width: calc(460 / var(--pc));
  margin: calc(64 / var(--pc)) auto 0 calc(160 / var(--pc));
}
.lp #temperature-swing-day .title {
  background: #FCF5D9;
}
.lp #temperature-swing-day .title .main-title span {
  color: #EFC455;
}
.lp #temperature-swing-day .icon-item {
  background: #EFC455;
}
.lp #temperature-swing-day .link-btn {
  background-color: #EFC455;
  width: calc(412 / var(--pc));
}
.lp #temperature-swing-day .style06 {
  width: calc(1040 / var(--pc));
  margin-top: calc(104 / var(--pc));
}
.lp #temperature-swing-day .style06 .main-img {
  width: calc(420 / var(--pc));
}
.lp #temperature-swing-day .style06 .title {
  margin-top: calc(64 / var(--pc));
}
.lp #temperature-swing-day .style06 .style-detail {
  margin-top: calc(-189 / var(--pc));
  padding: 0 calc(508 / var(--pc)) 0 calc(88 / var(--pc));
}
.lp #temperature-swing-day .style06 .item-wrapper {
  margin: calc(56 / var(--pc)) 0 0 calc(140 / var(--pc));
}
.lp #temperature-swing-day .style06 .sub-img01 {
  width: calc(360 / var(--pc));
  margin: calc(-40 / var(--pc)) 0 0 calc(120 / var(--pc));
}
.lp .banner {
  width: calc(640 / var(--pc));
  margin: calc(144 / var(--pc)) auto 0;
  display: flex;
  flex-direction: column;
  gap: calc(40 / var(--pc)) 0;
}

@media screen and (max-width: 769px) {
  .lp .kv {
    display: block;
    padding-left: 0;
    position: relative;
    margin-top: calc(12 / var(--sp));
  }
  .lp .kv .kv-txt {
    width: calc(187 / var(--sp));
    position: absolute;
    top: calc(28 / var(--sp));
    right: calc(8 / var(--sp));
    margin-top: 0;
    z-index: 2;
  }
  .lp .kv .kv-txt h1 {
    font-size: calc(20 / var(--sp));
    line-height: calc(30 / var(--sp));
    margin-left: calc(0 / var(--sp));
  }
  .lp .kv .kv-txt h1 .background {
    padding: 0 calc(7 / var(--sp)) 0 calc(6 / var(--sp));
  }
  .lp .kv .kv-txt h1 .background::before {
    width: calc(54 / var(--sp));
    height: calc(30 / var(--sp));
  }
  .lp .kv .kv-txt h1 .background:nth-of-type(1) {
    margin-left: calc(7 / var(--sp));
  }
  .lp .kv .kv-txt h1 .background:nth-of-type(2) {
    margin-left: calc(-6 / var(--sp));
  }
  .lp .kv .kv-txt h1 span:nth-of-type(1), .lp .kv .kv-txt h1 span:nth-of-type(2) {
    padding: 0 calc(4 / var(--sp)) 0;
    margin-left: calc(-6 / var(--sp));
  }
  .lp .kv .kv-txt h1 img {
    width: calc(165 / var(--sp));
    margin: calc(8 / var(--sp)) 0 0 calc(5 / var(--sp));
  }
  .lp .kv .kv-txt .kv-eng {
    font-size: calc(9 / var(--sp));
    line-height: calc(26 / var(--sp));
    margin: calc(18 / var(--sp)) 0 0 calc(6 / var(--sp));
    width: calc(162 / var(--sp));
  }
  .lp .kv .kv-txt img {
    width: calc(93 / var(--sp));
    margin: calc(12 / var(--sp)) auto 0 calc(40 / var(--sp));
  }
  .lp .kv .kv-img .kv-img-inner {
    align-items: flex-start;
  }
  .lp .kv .kv-img .kv-img-inner picture:nth-of-type(1) img {
    width: calc(234 / var(--sp));
  }
  .lp .kv .kv-img .kv-img-inner picture:nth-of-type(2) img {
    width: calc(179 / var(--sp));
    margin: calc(205 / var(--sp)) auto 0 calc(-58 / var(--sp));
  }
  .lp .read {
    margin-top: calc(33 / var(--sp));
    font-size: calc(13 / var(--sp));
  }
  .lp .menu {
    gap: calc(28 / var(--sp)) calc(12 / var(--sp));
    margin-top: calc(30 / var(--sp));
  }
  .lp .menu .menu-item {
    width: calc(150 / var(--sp));
  }
  .lp .menu .menu-item .menu-img p {
    font-size: calc(12 / var(--sp));
    padding: calc(7 / var(--sp)) 0;
    line-height: 142%;
  }
  .lp .menu .menu-item .menu-img + p {
    font-size: calc(18 / var(--sp));
    margin-top: calc(14 / var(--sp));
    gap: 0 calc(5 / var(--sp));
  }
  .lp .menu .menu-item .menu-img + p::after {
    width: calc(19 / var(--sp));
    height: calc(19 / var(--sp));
    background-size: calc(10 / var(--sp)) calc(10 / var(--sp));
  }
  .lp .side-menu {
    top: unset;
    bottom: 0;
    transform: translateY(0);
    writing-mode: unset;
    width: 100%;
    background: #fff;
  }
  .lp .side-menu li {
    font-size: calc(12 / var(--sp));
    height: calc(46 / var(--sp));
    width: 25%;
  }
  .lp .marquee-txt span {
    font-size: calc(18 / var(--sp));
    line-height: calc(45 / var(--sp));
  }
  .lp .marquee-txt.orange {
    margin-top: calc(87 / var(--sp));
  }
  .lp .marquee-txt.blue {
    margin-top: calc(80 / var(--sp));
  }
  .lp .marquee-txt.purple {
    margin-top: calc(78 / var(--sp));
  }
  .lp .marquee-txt.yellow {
    margin-top: calc(80 / var(--sp));
  }
  .lp .day-type {
    padding: calc(10 / var(--sp)) calc(26 / var(--sp));
    margin-top: calc(96 / var(--sp));
  }
  .lp .day-type h2 {
    font-size: calc(36 / var(--sp));
    line-height: calc(55 / var(--sp));
  }
  .lp .day-type + p {
    font-size: calc(13 / var(--sp));
    line-height: 190%;
    margin: calc(32 / var(--sp)) auto 0;
    gap: 0 calc(16 / var(--sp));
    width: calc(311 / var(--sp));
  }
  .lp .day-type + p::before {
    width: calc(4 / var(--sp));
  }
  .lp .day-type.orange img {
    width: calc(105 / var(--sp));
  }
  .lp .day-type.blue img {
    width: calc(105 / var(--sp));
  }
  .lp .day-type.purple img {
    width: calc(200 / var(--sp));
  }
  .lp .day-type.yellow img {
    width: calc(235 / var(--sp));
  }
  .lp .style {
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
  }
  .lp .style .title {
    width: 100%;
    padding: calc(40 / var(--sp)) 0 calc(50 / var(--sp)) calc(40 / var(--sp));
    position: relative;
  }
  .lp .style .title .sub-title {
    font-size: calc(13 / var(--sp));
  }
  .lp .style .title .main-title {
    font-size: calc(28 / var(--sp));
    margin: calc(8 / var(--sp)) 0 calc(14 / var(--sp));
    padding: 0;
  }
  .lp .style .title .main-title::before {
    height: calc(12 / var(--sp));
  }
  .lp .style .title .icon-container {
    flex-direction: column;
    gap: calc(9 / var(--sp)) 0;
    margin-top: 0;
    position: absolute;
    z-index: 2;
  }
  .lp .style .title .icon-container .icon-item {
    width: calc(56 / var(--sp));
    height: calc(56 / var(--sp));
  }
  .lp .style .title .icon-container .icon-item img {
    height: calc(31 / var(--sp));
  }
  .lp .style .title .icon-container .icon-item p {
    font-size: calc(10 / var(--sp));
    margin-top: calc(-3 / var(--sp));
  }
  .lp .style .style-detail {
    font-size: calc(12 / var(--sp));
    width: calc(311 / var(--sp));
  }
  .lp .style .item-wrapper .item-container {
    gap: calc(12 / var(--sp)) calc(22 / var(--sp));
    flex-wrap: wrap;
  }
  .lp .style .item-wrapper .item-container .item {
    width: calc(84 / var(--sp));
    font-size: calc(10 / var(--sp));
  }
  .lp .style .item-wrapper .item-container .item img {
    margin-bottom: calc(7 / var(--sp));
  }
  .lp .style .features dl dt {
    font-size: calc(14 / var(--sp));
    line-height: 200%;
  }
  .lp .style .features dl dd {
    margin-top: calc(15 / var(--sp));
    font-size: calc(13 / var(--sp));
  }
  .lp .link-btn {
    gap: 0 calc(10 / var(--sp));
    width: calc(278 / var(--sp));
    font-size: calc(16 / var(--sp));
    line-height: calc(47 / var(--sp));
    border-radius: calc(70 / var(--sp));
    margin-top: calc(37 / var(--sp));
  }
  .lp .link-btn::after {
    width: calc(12 / var(--sp));
    height: calc(12 / var(--sp));
  }
  .lp #sunny-day .style01 {
    width: 100%;
    margin-top: calc(55 / var(--sp));
  }
  .lp #sunny-day .style01 .main-img {
    width: calc(250 / var(--sp));
    order: 2;
    margin: calc(-24 / var(--sp)) 0 0 calc(27 / var(--sp));
  }
  .lp #sunny-day .style01 .title {
    margin-top: 0;
    order: 1;
  }
  .lp #sunny-day .style01 .title .icon-container {
    top: calc(166 / var(--sp));
    right: calc(27 / var(--sp));
  }
  .lp #sunny-day .style01 .style-detail {
    margin: calc(32 / var(--sp)) auto 0;
    padding-left: 0;
    order: 3;
  }
  .lp #sunny-day .style01 .item-wrapper {
    width: calc(296 / var(--sp));
    margin: calc(40 / var(--sp)) auto 0;
    padding-left: 0;
    order: 6;
  }
  .lp #sunny-day .style01 .sub-img01 {
    width: calc(310 / var(--sp));
    margin: calc(32 / var(--sp)) auto 0;
    order: 4;
  }
  .lp #sunny-day .style01 .sub-img02 {
    width: calc(250 / var(--sp));
    margin: calc(32 / var(--sp)) 0 0 0;
    order: 5;
  }
  .lp #sunny-day .style02 {
    width: 100%;
    margin-top: calc(66 / var(--sp));
  }
  .lp #sunny-day .style02 .main-img {
    width: calc(325 / var(--sp));
    margin: calc(-24 / var(--sp)) auto 0;
    order: 2;
  }
  .lp #sunny-day .style02 .title {
    margin-top: 0;
    order: 1;
  }
  .lp #sunny-day .style02 .title .icon-container {
    top: calc(180 / var(--sp));
    right: calc(40 / var(--sp));
  }
  .lp #sunny-day .style02 .style-detail {
    margin: calc(33 / var(--sp)) auto 0;
    padding: 0;
    order: 3;
  }
  .lp #sunny-day .style02 .item-wrapper {
    width: calc(296 / var(--sp));
    margin: calc(40 / var(--sp)) auto 0;
    order: 5;
  }
  .lp #sunny-day .style02 .sub-img01 {
    width: calc(250 / var(--sp));
    margin: calc(32 / var(--sp)) 0 0 0;
    order: 4;
  }
  .lp #sunny-day .style02 .features {
    width: calc(183 / var(--sp));
    margin: calc(47 / var(--sp)) calc(32 / var(--sp)) 0 auto;
    order: 7;
  }
  .lp #sunny-day .style02 .sub-img02 {
    width: calc(142 / var(--sp));
    margin: calc(73 / var(--sp)) auto 0 0;
    order: 6;
  }
  .lp #sunny-day .style02 .sub-img03 {
    width: calc(240 / var(--sp));
    margin: calc(-16 / var(--sp)) auto 0 calc(103 / var(--sp));
    order: 8;
  }
  .lp #rainy-day .style03 {
    width: 100%;
    margin-top: calc(52 / var(--sp));
  }
  .lp #rainy-day .style03 .main-img {
    width: calc(325 / var(--sp));
    margin-top: calc(-38 / var(--sp));
    order: 2;
  }
  .lp #rainy-day .style03 .title {
    margin-top: 0;
    order: 1;
    padding-top: calc(38 / var(--sp));
  }
  .lp #rainy-day .style03 .title .sub-title {
    line-height: 230%;
  }
  .lp #rainy-day .style03 .title .main-title {
    margin-top: calc(5 / var(--sp));
  }
  .lp #rainy-day .style03 .title .icon-container {
    top: calc(181 / var(--sp));
    right: calc(22 / var(--sp));
  }
  .lp #rainy-day .style03 .style-detail {
    margin: calc(32 / var(--sp)) auto 0;
    padding: 0;
    order: 3;
  }
  .lp #rainy-day .style03 .item-wrapper {
    width: calc(296 / var(--sp));
    margin: calc(40 / var(--sp)) auto 0;
    padding: 0;
    order: 6;
  }
  .lp #rainy-day .style03 .sub-img01 {
    width: calc(310 / var(--sp));
    margin: calc(34 / var(--sp)) 0 0 auto;
    order: 4;
  }
  .lp #rainy-day .style03 .sub-img02 {
    width: calc(200 / var(--sp));
    margin: calc(32 / var(--sp)) auto 0 calc(24 / var(--sp));
    order: 5;
  }
  .lp #rainy-day .style04 {
    width: 100%;
    margin-top: calc(66 / var(--sp));
  }
  .lp #rainy-day .style04 .main-img {
    width: calc(325 / var(--sp));
    margin: calc(-37 / var(--sp)) auto 0;
    order: 2;
  }
  .lp #rainy-day .style04 .title {
    margin: 0;
    order: 1;
  }
  .lp #rainy-day .style04 .title .icon-container {
    top: calc(146 / var(--sp));
    right: calc(39 / var(--sp));
  }
  .lp #rainy-day .style04 .style-detail {
    margin: calc(32 / var(--sp)) auto 0;
    padding-left: 0;
    order: 3;
  }
  .lp #rainy-day .style04 .item-wrapper {
    width: calc(296 / var(--sp));
    margin: calc(40 / var(--sp)) auto 0;
    order: 5;
  }
  .lp #rainy-day .style04 .sub-img01 {
    width: calc(250 / var(--sp));
    margin: calc(32 / var(--sp)) 0 0 calc(101 / var(--sp));
    order: 4;
  }
  .lp #rainy-day .style04 .features {
    width: calc(161 / var(--sp));
    margin: calc(41 / var(--sp)) 0 0 calc(32 / var(--sp));
    order: 6;
    z-index: 2;
  }
  .lp #rainy-day .style04 .sub-img02 {
    width: calc(202 / var(--sp));
    margin: calc(56 / var(--sp)) auto 0 calc(-20 / var(--sp));
    order: 7;
  }
  .lp #humid-day .link-btn {
    width: calc(326 / var(--sp));
  }
  .lp #humid-day .style05 {
    width: 100%;
    margin-top: calc(52 / var(--sp));
  }
  .lp #humid-day .style05 .main-img {
    width: calc(250 / var(--sp));
    margin-top: calc(-36 / var(--sp));
    order: 2;
  }
  .lp #humid-day .style05 .title {
    margin-top: 0;
    order: 1;
  }
  .lp #humid-day .style05 .title .icon-container {
    top: calc(133 / var(--sp));
    right: calc(45 / var(--sp));
  }
  .lp #humid-day .style05 .style-detail {
    margin: calc(32 / var(--sp)) auto 0;
    padding-left: 0;
    order: 3;
  }
  .lp #humid-day .style05 .item-wrapper {
    width: calc(296 / var(--sp));
    margin: calc(40 / var(--sp)) auto 0;
    padding-left: 0;
    order: 6;
  }
  .lp #humid-day .style05 .sub-img01 {
    width: calc(310 / var(--sp));
    margin: calc(-31 / var(--sp)) auto 0 0;
    order: 5;
  }
  .lp #humid-day .style05 .sub-img02 {
    width: calc(200 / var(--sp));
    margin: calc(34 / var(--sp)) 0 0 auto;
    order: 4;
    z-index: 2;
  }
  .lp #temperature-swing-day .link-btn {
    width: calc(341 / var(--sp));
  }
  .lp #temperature-swing-day .style06 {
    width: 100%;
    margin-top: calc(52 / var(--sp));
  }
  .lp #temperature-swing-day .style06 .main-img {
    width: calc(325 / var(--sp));
    margin-top: calc(-21 / var(--sp));
    order: 2;
  }
  .lp #temperature-swing-day .style06 .title {
    margin-top: 0;
    order: 1;
  }
  .lp #temperature-swing-day .style06 .title .icon-container {
    top: calc(187 / var(--sp));
    right: calc(22 / var(--sp));
  }
  .lp #temperature-swing-day .style06 .style-detail {
    margin: calc(32 / var(--sp)) auto 0;
    padding: 0;
    order: 3;
  }
  .lp #temperature-swing-day .style06 .item-wrapper {
    width: calc(296 / var(--sp));
    margin: calc(40 / var(--sp)) auto 0;
    order: 5;
  }
  .lp #temperature-swing-day .style06 .sub-img01 {
    width: calc(250 / var(--sp));
    margin: calc(34 / var(--sp)) auto 0 calc(101 / var(--sp));
    order: 4;
  }
  .lp .banner {
    width: calc(325 / var(--sp));
    margin-top: calc(80 / var(--sp));
    gap: calc(32 / var(--sp)) 0;
  }
}/*# sourceMappingURL=weather2026508.css.map */