@charset "UTF-8";

/* ======================================================
  pc
====================================================== */

html {
  /* 1rem = 10px */
  font-size: calc(100vw * 10 / 1366);
  scroll-behavior: smooth;
}

img {
  max-width: 100%;
}

.inner {
  max-width: 112.6rem;
  margin-inline: auto;
}

/* main
----------------------- */
.main {
  background: url(../img/pc/main_bg.png) center top no-repeat;
  background-size: cover;
  aspect-ratio: 1365 / 876;
  position: relative;
  z-index: 10;
}

.main .main_title {
  width: 73.1rem;
  padding-top: 8.3rem;
  margin-inline: auto;
}


/* present
----------------------- */
/* 共通 */
.present {
  margin-top: -15.3rem;
}

.present_wrapper {
  background: url(../img/pc/present_bg.png) center top no-repeat;
  background-size: cover;
  padding: 7.1rem 0 8.9rem;
}

.present_inner {
  position: relative;
  z-index: 20;
}

.present_bg {
  padding-left: 4rem;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: right top;
}

/* 先着順 */
.present_first_come {
  background-image: url(../img/pc/present_first_come_bg.png);
  aspect-ratio: 1126/310;
}

.present_first_come h2 {
  width: 30rem;
  padding-top: 3.2rem;
  margin-left: 19.1rem;
}

.present_first_come p {
  width: 68.3rem;
  margin-top: 3rem;
}

/* 抽選 */
.present_lottery {
  background-image: url(../img/pc/present_lottery_bg.png);
  aspect-ratio: 1126/851;
  margin-top: 4rem;
  padding-right: 4rem;
}

.present_lottery h2 {
  width: 62rem;
  padding-top: 6rem;
  margin-left: 21.3rem;
}

.present_lottery_content {
  display: flex;
  gap: 4rem;
  margin-top: 4rem;
}

.present_lottery_note {
  margin-top: 4rem;
}

/* points
----------------------- */
.points {
  padding: 20rem 0;
  background-image: url(../img/pc/points_bg.png);
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
}


.points_title {
  width: 72rem;
  margin-inline: auto;
}

.points_list {
  display: flex;
  flex-direction: column;
  gap: 10rem;
  margin-top: 6rem;
}

.points_item {
  display: flex;
  flex-direction: column;
  gap: 4rem;
  align-items: center;
  position: relative;
  padding: 4rem 8rem;
  border-radius: 2rem;
  background-color: rgba(255, 255, 255, 0.6);
  box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.15);
}

.points_item h3 {
  width: 80.3rem;
}

.points_item_contents {
  display: flex;
  gap: 2rem;
}

.points_item_content {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
}

.points_item_btn {
  width: 34.8rem;
  margin-inline: auto;
}

.points_item_deco {
  position: absolute;
  left: -6rem;
  top: -6rem;
  display: block;
  width: 21rem;
  aspect-ratio: 1;
}

/* 各リストアイテムごとの設定 */
.points_warmth_content {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
  justify-content: space-between;
}

.points_clean_txt {
  width: 75.1rem;
  margin-inline: auto;
}

.points_clean_note {
  width: 58.8rem;
  margin-inline: auto;
}


.points_relief_txt {
  width: 81.6rem;
  margin-inline: auto;
  margin-top: -1rem;
}

/* consulting
----------------------- */
.consulting {
  border-radius: 2rem;
  background-color: rgba(255, 255, 255, 0.6);
  box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.15);
  padding: 4rem 0 0.8rem;
  margin-top: 10rem;
}


.consulting_title {}

.consulting_list {
  margin-top: 3.2rem;
  padding-inline: 4rem;
  display: flex;
  justify-content: space-between;
  gap: 2.7rem;
}

.consulting_item {
  /* width: calc((100% - 2.7rem * 2) / 3);  */
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

/* links
----------------------- */
.links {
  padding: 20rem 0 8rem;
}

.links_inner {
  display: flex;
  flex-direction: column;
  gap: 6rem;
}

.links_item {
  padding: 4rem;
  border: 1px solid #000;
}

.links_content p {
  margin-top: 2.4rem;
  width: 33rem;
  margin-inline: auto;
}


.links_content a {
  margin-top: 2rem;
  display: block;
}

.links_img {
  width: 51rem;
}

/* youtube
----------------------- */
.youtube_inner {
  display: flex;
  gap: 9.8rem;
  align-items: center;
  justify-content: flex-end;
}

.youtube_content {
  width: 37.8rem;
}

.youtube_content a {
  width: 34.9rem;
  margin-inline: auto;
}

/* instagram
----------------------- */
.instagram_inner {
  display: flex;
  gap: 8.7rem;
  align-items: center;
  justify-content: flex-end;
}

.instagram_content {
  width: 40.2rem;
}

.instagram_content a {
  width: 34.7rem;
  margin: 2rem auto 0;
}

/* myhomepark
----------------------- */
.myhomepark {
  padding: 0 4rem 0 0;
}

.myhomepark_inner {
  display: flex;
  gap: 6.3rem;
  align-items: center;
  justify-content: flex-start;
}

.myhomepark_content {
  width: 42.4rem;
}

.myhomepark_img {
  width: 57.6rem;
}

.myhomepark_img img {
  height: 100%;
  object-fit: cover;
}

.myhomepark_content a {
  margin-top: 2rem;
  display: block;
  width: 34.8rem;
  margin-inline: auto;
}


.myhomepark_txt {
  margin-top: 1rem;
  width: 32rem;
  margin-inline: auto;
}

.myhomepark_note {
  margin-top: 2rem;
}

/* green
----------------------- */
.green {
  background-color: #DCFCC6;
  padding: 8rem 12rem 12rem;
}

.green_inner {
  background-color: #fff;
  padding: 8rem;
}

.green_main {
  max-width: 65.7rem;
  margin-inline: auto;
}

.green01 {
  margin: 6rem auto 0;
}

.green02 {
  margin: 8rem auto 0;
}

.green_btn {
  max-width: 61.5rem;
  margin: 6rem auto 0;
}