@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Albert+Sans:ital,wght@0,100..900;1,100..900&family=M+PLUS+Rounded+1c:wght@100;300;400;500;700;800;900&family=Noto+Sans+JP:wght@100..900&family=Roboto:ital,wdth,wght@0,75..100,100..900;1,75..100,100..900&family=Zen+Kaku+Gothic+New:wght@300;400;500;700;900&family=Zen+Old+Mincho:wght@400;500;600;700;900&family=Zen+Maru+Gothic&&family=Shippori+Antique+B1&family=Heebo:wght@100..900&display=swap");
@keyframes work_slider_loop {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-224% - 32vw));
  }
}
#fv {
  position: fixed;
}
#fv .fv_wrapper {
  width: 100vw;
  height: 100vh;
}
#fv .fv_wrapper .fv_frame {
  position: relative;
  width: 100%;
  height: 100%;
}
#fv .fv_wrapper .fv_frame img {
  transition: filter 0.2s ease;
}
#fv .fv_wrapper .fv_frame .fv_frame_image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: fill;
  z-index: 0;
  pointer-events: none;
}
#fv .fv_wrapper .fv_frame .fv_images {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#fv .fv_wrapper .fv_frame .fv_images .fv_image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 1.5s ease-in-out;
  z-index: -1;
}
#fv .fv_wrapper .fv_frame .fv_images .fv_image.one {
  object-position: 62% 20%;
}
#fv .fv_wrapper .fv_frame .fv_images .fv_image.two {
  object-position: 62% 35%;
}
#fv .fv_wrapper .fv_frame .fv_images .fv_image.three {
  object-position: 45% 20%;
}
#fv .fv_wrapper .fv_frame .fv_images .fv_image.four {
  object-position: 70% 20%;
}
#fv .fv_wrapper .fv_frame .fv_images .fv_image.active {
  opacity: 1;
}
#fv .fv_wrapper .fv_frame .fv_overlay {
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0);
  backdrop-filter: blur(0px);
  transition: none;
  pointer-events: none;
}
#fv .fv_wrapper .fv_title {
  width: 90%;
  position: absolute;
  bottom: clamp(25px, -15px + 5.208vw, 60px);
  left: 7%;
  display: flex;
  z-index: 1;
  justify-content: space-between;
  opacity: 1;
  transition: opacity 0.3s ease;
  pointer-events: all;
}
@media screen and (max-width: 900px) {
  #fv .fv_wrapper .fv_title {
    width: 93%;
    left: 5%;
  }
}
@media screen and (max-width: 1280px) {
  #fv .fv_wrapper .fv_title {
    justify-content: center;
  }
}
#fv .fv_wrapper .fv_title .main_concept {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
#fv .fv_wrapper .fv_title .main_concept .concept_down {
  margin-left: clamp(40px, -234.286px + 35.714vw, 280px);
}
@media screen and (max-width: 768px) {
  #fv .fv_wrapper .fv_title .main_concept .concept_down {
    margin-left: clamp(0px, -77.391px + 23.098vw, 100px);
  }
}
#fv .fv_wrapper .fv_title .main_concept .fv_text {
  font-family: "Shippori Antique B1", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: #FFF;
  text-shadow: 0 0px 15.5px rgba(35, 92, 0, 0.95);
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #FFF;
  font-size: clamp(32px, 11.577px + 5.446vw, 90px);
  font-style: normal;
  letter-spacing: -3.599px;
}
@media screen and (max-width: 768px) {
  #fv .fv_wrapper .fv_title .main_concept .fv_text {
    letter-spacing: -1.599px;
  }
}
#fv .fv_wrapper .fv_title .main_concept .big {
  font-size: clamp(40px, 14px + 6.667vw, 110px);
  line-height: clamp(70px, 62.692px + 1.827vw, 89px);
  letter-spacing: -4.431px;
}
@media screen and (max-width: 768px) {
  #fv .fv_wrapper .fv_title .main_concept .big {
    letter-spacing: -3.5px;
  }
}
#fv .fv_wrapper .fv_title .recruit_buttons {
  display: flex;
  flex-direction: column;
  gap: clamp(10px, -3.714px + 1.786vw, 22px);
  margin-top: clamp(40px, -58.286px + 12.798vw, 126px);
}
@media screen and (max-width: 1280px) {
  #fv .fv_wrapper .fv_title .recruit_buttons {
    margin: 0 0 0 auto;
    display: none;
  }
}
#fv .fv_wrapper .fv_title .recruit_buttons .recruit_button {
  display: flex;
  width: 243px;
  height: 53px;
  padding: 9px 14px;
  justify-content: flex-end;
  align-items: center;
  gap: 42px;
  flex-shrink: 0;
  border-radius: 10px;
  border: 1px solid #86BE13;
  background: #FFF;
}
#fv .fv_wrapper .fv_title .recruit_buttons .recruit_button:hover .circle::after {
  transform: translate(-50%, -50%) scale(3);
  opacity: 1;
  animation: arrow_animation 1.5s ease-in-out;
}
#fv .fv_wrapper .fv_title .recruit_buttons .recruit_button:hover .circle .arrow {
  animation: arrow_animation 1.5s ease-in-out;
}
#fv .fv_wrapper .fv_title .recruit_buttons .recruit_button .circle {
  width: 28px;
  height: 28px;
  background-color: #86BE13;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  z-index: 1;
  transition: background-color 0.8s ease;
}
#fv .fv_wrapper .fv_title .recruit_buttons .recruit_button .circle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  background-color: #86BE13;
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(0);
  opacity: 0;
  transition: transform 0.6s ease, opacity 0.4s ease;
  z-index: -1;
}
#fv .fv_wrapper .fv_title .recruit_buttons .recruit_button .circle .arrow {
  transform: translate(0);
}
@keyframes arrow_animation {
  0%, 60% {
    opacity: 1;
    transform: translateX(0%);
  }
  30% {
    opacity: 0;
    transform: translateX(150%);
  }
  40% {
    opacity: 0;
    transform: translateX(-150%);
  }
}
#fv .fv_wrapper .fv_title .recruit_buttons .recruit_button .circle {
  width: 30px;
  height: 30px;
}
#fv .fv_wrapper .fv_title .recruit_buttons .recruit_button .circle:hover::after {
  transform: translate(-50%, -50%) scale(3);
  opacity: 1;
  animation: arrow_animation 1.5s ease-in-out;
}
#fv .fv_wrapper .fv_title .recruit_buttons .recruit_button .circle:hover .arrow {
  animation: arrow_animation 1.5s ease-in-out;
}
#fv .fv_wrapper .fv_title .recruit_buttons .recruit_button .circle .arrow {
  width: 15px;
}
#fv .fv_wrapper .fv_title .recruit_buttons .recruit_button p {
  font-family: "Noto Sans JP", serif;
  font-weight: 400;
  font-style: normal;
  color: #363636;
  text-align: right;
  font-size: 16px;
  line-height: 120%; /* 19.2px */
  letter-spacing: 0.48px;
}
#fv .fv_wrapper .fv_title.hidden {
  opacity: 0;
  pointer-events: none;
}

#top_message {
  width: 100%;
  height: 300vh;
  display: flex;
  flex-direction: column;
  z-index: 3;
  position: relative;
  overflow: visible;
  gap: 20px;
  pointer-events: none;
  opacity: 0;
}
#top_message .top_message_container {
  width: 100%;
  height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: sticky;
  top: 0;
  overflow: hidden;
  padding-top: 100px;
}
@media screen and (max-width: 1280px) {
  #top_message .top_message_container {
    padding-top: 50px;
  }
}
@media screen and (max-width: 768px) {
  #top_message .top_message_container {
    padding-top: 70px;
    align-items: center;
  }
}
#top_message .top_message_container .message_box {
  width: fit-content;
  display: flex;
  flex-direction: column;
  position: relative;
  gap: 15px;
  align-items: center;
}
@media screen and (max-width: 768px) {
  #top_message .top_message_container .message_box {
    width: 90%;
  }
}
#top_message .top_message_container .message_box .top_message_text {
  font-family: "Noto Sans JP", serif;
  font-weight: 400;
  font-style: normal;
  color: #FFF;
  text-align: center;
  font-size: 18px;
  line-height: 170%; /* 30.6px */
  letter-spacing: 0.54px;
  display: block;
  transition: opacity 0.6s ease;
}
#top_message .top_message_container .message_box .top_message_text br {
  display: block;
}
@media screen and (max-width: 768px) {
  #top_message .top_message_container .message_box .top_message_text {
    font-size: 16px;
  }
  #top_message .top_message_container .message_box .top_message_text br {
    display: none;
  }
}
#top_message .top_message_container .message_box .top_message_text span {
  display: inline-block;
  opacity: 1;
  transform: translateX(-10px) translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
#top_message .top_message_container .message_box .top_message_text span.show {
  opacity: 1;
  transform: translateX(0) translateY(0);
}
#top_message .top_message_container .message_box .message_title {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: clamp(0px, -21.667px + 3.333vh, 15px);
  align-items: center;
}
#top_message .top_message_container .message_box .message_title .bottom_line {
  width: max(689px, 75%);
  height: 1px;
  background: #FFF;
  margin-top: 11px;
  transition: opacity 0.8s ease;
  opacity: 0;
}
@media screen and (max-width: 768px) {
  #top_message .top_message_container .message_box .message_title .bottom_line {
    max-width: 689px;
    width: 95%;
  }
}
#top_message .top_message_container .message_box .message_title .bottom_line.show {
  opacity: 1;
}
#top_message .top_message_container .message_box .message_title .message {
  font-family: "Heebo", sans-serif;
  font-weight: 200;
  font-style: normal;
  text-shadow: 0 4px 4px rgba(122, 122, 122, 0.25);
  font-size: clamp(19px, 13.841px + 1.323vw, 24px);
  line-height: 142%; /* 34.08px */
  letter-spacing: 1.92px;
}
#top_message .top_message_container .message_box .message_title .top_title {
  text-shadow: 0 4px 4px rgba(84, 84, 84, 0.25);
  font-size: 26px;
  line-height: 150%; /* 39px */
  letter-spacing: 0.78px;
}
#top_message .top_message_container .message_box .message_title .top_title br {
  display: none;
}
@media screen and (max-width: 768px) {
  #top_message .top_message_container .message_box .message_title .top_title {
    line-height: clamp(80%, 0.594px + 0.053vw, 100%);
    text-align: center;
    font-size: clamp(17px, 11.841px + 1.323vw, 22px);
  }
  #top_message .top_message_container .message_box .message_title .top_title br {
    display: block;
  }
}
#top_message .top_message_container .message_box .message_lead {
  display: flex;
  flex-direction: column;
  gap: clamp(5px, -60px + 10vh, 50px);
  align-items: center;
}
@media screen and (max-width: 768px) {
  #top_message .top_message_container .message_box .message_lead {
    align-items: flex-start;
  }
}
#top_message .top_message_container .message_box .woodchem_text.sp {
  display: none;
}
@media screen and (max-width: 1280px) {
  #top_message .top_message_container .message_box .woodchem_text.sp {
    display: block;
  }
}
#top_message .top_message_container .woodchem_text {
  font-family: "Heebo", sans-serif;
  font-weight: 100;
  font-style: normal;
  color: rgba(255, 255, 255, 0.1);
  font-size: clamp(45px, 15.657px + 7.524vw, 124px);
  line-height: 1;
  letter-spacing: -1.24px;
  margin: auto auto 3% 3%;
  transition: opacity 0.8s ease, transform 0.8s ease;
  opacity: 0;
}
@media screen and (max-width: 1280px) {
  #top_message .top_message_container .woodchem_text {
    text-align: center;
    margin: 0 auto;
  }
}
#top_message .top_message_container .woodchem_text.pc {
  display: block;
}
@media screen and (max-width: 1280px) {
  #top_message .top_message_container .woodchem_text.pc {
    display: none;
  }
}
#top_message .top_message_container .woodchem_text.show {
  opacity: 1;
  z-index: 10;
  left: 0;
}
@media screen and (max-width: 1280px) {
  #top_message .top_message_container .woodchem_text.show {
    right: 0;
    left: 0;
  }
}
#top_message .message_img_box {
  width: fit-content;
  height: 100%;
  position: relative;
}
#top_message .message_img1 {
  width: clamp(330px, -38px + 28.75vw, 376px);
  top: 38%;
  left: 0;
  position: absolute;
  margin-right: auto;
}
#top_message .message_img2 {
  width: clamp(330px, -38px + 28.75vw, 376px);
  top: 62%;
  right: 0;
  position: absolute;
  margin-left: auto;
}
#top_message .top_img_animation {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
@media screen and (max-width: 1280px) {
  #top_message .top_img_animation {
    display: none;
  }
}
#top_message .top_img_animation.show {
  opacity: 1;
  transform: translateY(0);
  z-index: 10;
}
#top_message.scroll_hidden .top_message_container .message_box .message_title .bottom_line {
  opacity: 0;
}
#top_message.scroll_hidden .top_message_container .message_box .top_message_text {
  opacity: 0;
}
#top_message.scroll_hidden .top_message_container .message_img1 {
  opacity: 0;
}
#top_message.scroll_hidden .top_message_container .message_img2 {
  opacity: 0;
}
#top_message.scroll_hidden .top_message_container .woodchem_text {
  opacity: 0;
}

#top_about_us {
  width: 100%;
  background: #F5F2E2;
  display: flex;
  flex-direction: column;
  position: relative;
  align-items: center;
}
#top_about_us .top_about_us_union.pc {
  display: block;
  position: absolute;
  top: 140px;
  object-fit: cover;
}
@media screen and (max-width: 1280px) {
  #top_about_us .top_about_us_union.pc {
    display: none;
  }
}
#top_about_us .top_about_us_union.sp {
  display: none;
}
@media screen and (max-width: 1280px) {
  #top_about_us .top_about_us_union.sp {
    display: block;
    position: absolute;
    object-fit: cover;
    width: 1800px;
    top: clamp(80px, -55.44px + 17.613vw, 170px);
  }
}
@media screen and (max-width: 768px) {
  #top_about_us .top_about_us_union.sp {
    width: auto;
    top: clamp(35px, -103.359px + 36.896vw, 180px);
  }
}
#top_about_us .about_us_container {
  width: 100%;
  display: flex;
  flex-direction: column;
  margin-top: 102px;
  z-index: 1;
  align-items: center;
}
#top_about_us .about_us_container .img_box {
  width: clamp(328px, 118.769px + 52.308vw, 872px);
  height: clamp(168px, 59.923px + 27.019vw, 449px);
  position: relative;
  overflow: hidden;
  border-radius: 35px;
}
#top_about_us .about_us_container .img_box .top_parallax_img {
  width: 120%;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
#top_about_us .about_us_container .top_about_us_message {
  width: 85%;
  max-width: 739px;
  display: flex;
  flex-direction: column;
  margin-top: 43px;
}
@media screen and (max-width: 768px) {
  #top_about_us .about_us_container .top_about_us_message {
    align-items: center;
  }
}
#top_about_us .about_us_container .top_about_us_message .text_container {
  width: 100%;
  display: flex;
  flex-direction: column;
}
@media screen and (max-width: 768px) {
  #top_about_us .about_us_container .top_about_us_message .text_container {
    width: 100%;
    margin: 0;
  }
}
#top_about_us .about_us_container .top_about_us_message .text_container p {
  font-family: "Noto Sans JP", serif;
  font-weight: 300;
  font-style: normal;
  color: #FFF;
  font-size: 16px;
  font-style: normal;
  line-height: 200%; /* 32px */
  letter-spacing: 0.48px;
}
#top_about_us .about_us_container .top_about_us_message .text_container .top_about_us_title {
  font-family: "Noto Sans JP", serif;
  font-weight: 500;
  font-style: normal;
  font-size: 32px;
  letter-spacing: 0.96px;
}
@media screen and (max-width: 768px) {
  #top_about_us .about_us_container .top_about_us_message .text_container .top_about_us_title {
    font-size: 27px;
  }
}
#top_about_us .about_us_container .top_about_us_message .text_container .message_btn .circle {
  width: 28px;
  height: 28px;
  background-color: #FFF;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  z-index: 1;
  transition: background-color 0.8s ease;
}
#top_about_us .about_us_container .top_about_us_message .text_container .message_btn .circle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  background-color: #FFF;
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(0);
  opacity: 0;
  transition: transform 0.6s ease, opacity 0.4s ease;
  z-index: -1;
}
#top_about_us .about_us_container .top_about_us_message .text_container .message_btn .circle .arrow {
  transform: translate(0);
}
@keyframes arrow_animation {
  0%, 60% {
    opacity: 1;
    transform: translateX(0%);
  }
  30% {
    opacity: 0;
    transform: translateX(150%);
  }
  40% {
    opacity: 0;
    transform: translateX(-150%);
  }
}
#top_about_us .about_us_container .top_about_us_message .text_container .message_btn:hover .circle::after {
  transform: translate(-50%, -50%) scale(3);
  opacity: 1;
  animation: arrow_animation 1.5s ease-in-out;
}
#top_about_us .about_us_container .top_about_us_message .text_container .message_btn:hover .circle .arrow {
  animation: arrow_animation 1.5s ease-in-out;
}
#top_about_us .about_us_container .top_about_us_message .text_container .message_btn {
  width: fit-content;
  display: flex;
  gap: 13px;
  align-items: center;
  margin-top: 16px;
}
#top_about_us .about_us_container .top_about_us_message .text_container .message_btn .circle {
  width: 60px;
  height: 60px;
  background: #FFF;
}
#top_about_us .about_us_container .top_about_us_message .text_container .message_btn .circle:hover::after {
  transform: translate(-50%, -50%) scale(3);
  opacity: 1;
  animation: arrow_animation 1.5s ease-in-out;
}
#top_about_us .about_us_container .top_about_us_message .text_container .message_btn .circle:hover .arrow {
  animation: arrow_animation 1.5s ease-in-out;
}
#top_about_us .about_us_container .top_about_us_message .text_container .message_btn span {
  font-family: "Noto Sans JP", serif;
  font-weight: 300;
  font-style: normal;
  color: #FFF;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 335%; /* 53.6px */
}
#top_about_us .about_us_container .top_about_us_menu {
  width: 85%;
  display: flex;
  gap: 20px;
  justify-content: center;
}
@media screen and (max-width: 1280px) {
  #top_about_us .about_us_container .top_about_us_menu {
    flex-direction: column;
    align-items: center;
    margin-top: 70px;
  }
}
#top_about_us .about_us_container .top_about_us_menu .top_about_us_content {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 106px;
}
@media screen and (max-width: 1280px) {
  #top_about_us .about_us_container .top_about_us_menu .top_about_us_content {
    margin-top: 0;
  }
}
#top_about_us .about_us_container .top_about_us_menu .top_about_us_content .img_wrapper {
  width: 400px;
  overflow: hidden;
  border-radius: 10px;
}
#top_about_us .about_us_container .top_about_us_menu .top_about_us_content .img_wrapper img {
  width: 100%;
  aspect-ratio: 400/210;
  object-fit: cover;
  transform: scale(1);
  transition: transform 0.3s ease;
}
@media screen and (max-width: 1280px) {
  #top_about_us .about_us_container .top_about_us_menu .top_about_us_content .img_wrapper {
    width: clamp(334px, 258.545px + 18.864vw, 500px);
  }
}
#top_about_us .about_us_container .top_about_us_menu .top_about_us_content p {
  width: fit-content;
  position: relative;
  font-family: "Noto Sans JP", serif;
  font-weight: 500;
  font-style: normal;
  color: #FFF;
  font-style: normal;
  font-weight: 500;
  line-height: 27px; /* 150% */
  letter-spacing: 0.36px;
  transition: 0.3s;
}
#top_about_us .about_us_container .top_about_us_menu .top_about_us_content p::after {
  position: absolute;
  left: 0;
  content: "";
  width: 100%;
  height: 1px;
  background: #FFF;
  bottom: -2px;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: transform 0.3s;
}
#top_about_us .about_us_container .top_about_us_menu .top_about_us_content:hover p::after {
  transform: scale(1, 1);
  transform-origin: left top;
}
#top_about_us .about_us_container .top_about_us_menu .top_about_us_content:hover img {
  transform: scale(1.1);
}

#top_about_work {
  width: 100%;
  display: flex;
  flex-direction: column;
  margin-top: 114px;
  align-items: center;
  position: relative;
}
#top_about_work .about_work_background {
  width: 100%;
  bottom: 0;
  position: absolute;
  top: 139px;
  background: #F0F7EE;
}
#top_about_work .top_work_thick {
  font-family: "Noto Sans JP", serif;
  font-weight: 500;
  font-style: normal;
  color: #363636;
  font-size: clamp(28px, 23.652px + 1.087vw, 32px);
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.96px;
}
#top_about_work .top_work_thin {
  font-family: "Noto Sans JP", serif;
  font-weight: 300;
  font-style: normal;
  color: #363636;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 335%; /* 53.6px */
}
@media screen and (max-width: 768px) {
  #top_about_work .top_work_thin {
    line-height: 200%;
  }
}
#top_about_work .about_work_container {
  background: #F0F7EE;
  border-radius: 60px;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 95%;
  max-width: 1360px;
  padding: 60px 0 70px 0;
}
@media screen and (max-width: 1280px) {
  #top_about_work .about_work_container {
    width: 100%;
    border-radius: 30px;
  }
}
#top_about_work .about_work_container .about_work_title {
  width: 85%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#top_about_work .about_work_container .about_work_title .message_btn {
  display: flex;
  gap: 13px;
  align-items: center;
}
#top_about_work .about_work_container .about_work_title .message_btn:hover .circle::after {
  transform: translate(-50%, -50%) scale(3);
  opacity: 1;
  animation: arrow_animation 1.5s ease-in-out;
}
#top_about_work .about_work_container .about_work_title .message_btn:hover .circle .arrow {
  animation: arrow_animation 1.5s ease-in-out;
}
#top_about_work .about_work_container .about_work_title .message_btn .circle {
  width: 28px;
  height: 28px;
  background-color: #86BE13;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  z-index: 1;
  transition: background-color 0.8s ease;
}
#top_about_work .about_work_container .about_work_title .message_btn .circle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  background-color: #86BE13;
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(0);
  opacity: 0;
  transition: transform 0.6s ease, opacity 0.4s ease;
  z-index: -1;
}
#top_about_work .about_work_container .about_work_title .message_btn .circle .arrow {
  transform: translate(0);
}
@keyframes arrow_animation {
  0%, 60% {
    opacity: 1;
    transform: translateX(0%);
  }
  30% {
    opacity: 0;
    transform: translateX(150%);
  }
  40% {
    opacity: 0;
    transform: translateX(-150%);
  }
}
@media screen and (max-width: 768px) {
  #top_about_work .about_work_container .about_work_title .message_btn {
    gap: clamp(8px, 2.841px + 1.323vw, 13px);
  }
}
#top_about_work .about_work_container .about_work_title .message_btn .circle {
  width: 60px;
  height: 60px;
}
#top_about_work .about_work_container .about_work_title .message_btn .circle:hover::after {
  transform: translate(-50%, -50%) scale(3);
  opacity: 1;
  animation: arrow_animation 1.5s ease-in-out;
}
#top_about_work .about_work_container .about_work_title .message_btn .circle:hover .arrow {
  animation: arrow_animation 1.5s ease-in-out;
}
@media screen and (max-width: 768px) {
  #top_about_work .about_work_container .about_work_title .message_btn .circle {
    width: clamp(45px, 29.524px + 3.968vw, 60px);
    height: clamp(45px, 29.524px + 3.968vw, 60px);
  }
}
#top_about_work .about_work_container .work_menu_container {
  width: 90%;
  display: grid;
  grid-template-rows: 1fr 1fr;
  grid-template-columns: 1fr 1fr;
  gap: 15px;
  margin-top: 55px;
}
@media screen and (max-width: 1280px) {
  #top_about_work .about_work_container .work_menu_container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
  }
}
#top_about_work .about_work_container .work_menu_container .menu1 {
  grid-row: 1/3;
  grid-column: 1;
}
#top_about_work .about_work_container .work_menu_container .menu2 {
  grid-row: 1;
  grid-column: 2;
}
#top_about_work .about_work_container .work_menu_container .menu3 {
  grid-row: 2;
  grid-column: 2;
}
#top_about_work .about_work_container .work_menu_container .work_menu_content {
  position: relative;
}
#top_about_work .about_work_container .work_menu_container .work_menu_content .img_wrapper {
  width: 100%;
  height: fit-content;
  border-radius: 20px;
  overflow: hidden;
}
#top_about_work .about_work_container .work_menu_container .work_menu_content .img_wrapper img {
  width: 100%;
  transform: scale(1);
  object-fit: cover;
  transition: transform 0.3s ease;
}
#top_about_work .about_work_container .work_menu_container .work_menu_content p {
  position: absolute;
  top: clamp(15px, 7px + 1.042vw, 22px);
  left: clamp(20px, -2.857px + 2.976vw, 40px);
  font-family: "Noto Sans JP", serif;
  font-optical-sizing: auto;
  font-weight: 500;
  color: #FFF;
  font-size: clamp(16px, 11.652px + 1.087vw, 20px);
  font-style: normal;
  line-height: 23.4px; /* 117% */
  letter-spacing: 0.28px;
  text-shadow: 0 0 15.5px rgba(35, 92, 0, 0.95);
}
#top_about_work .about_work_container .work_menu_container .work_menu_content .message_btn {
  display: block;
  position: absolute;
  bottom: 12px;
  left: clamp(500px, -20px + 40.625vw, 565px);
}
#top_about_work .about_work_container .work_menu_container .work_menu_content .message_btn .circle {
  width: 28px;
  height: 28px;
  background: #86BE13;
}
#top_about_work .about_work_container .work_menu_container .work_menu_content .message_btn .circle .arrow {
  width: 10px;
  height: 10px;
}
@media screen and (max-width: 1280px) {
  #top_about_work .about_work_container .work_menu_container .work_menu_content .message_btn {
    display: none;
  }
}
#top_about_work .about_work_container .work_menu_container .work_menu_content:hover img {
  transform: scale(1.1);
}
#top_about_work .about_work_container .work_menu_container .menu1:hover .circle::after {
  transform: translate(-50%, -50%) scale(3);
  opacity: 1;
  animation: arrow_animation 1.5s ease-in-out;
}
#top_about_work .about_work_container .work_menu_container .menu1:hover .circle .arrow {
  animation: arrow_animation 1.5s ease-in-out;
}
#top_about_work .about_work_container .work_menu_container .menu1 .circle {
  width: 28px;
  height: 28px;
  background-color: #86BE13;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  z-index: 1;
  transition: background-color 0.8s ease;
}
#top_about_work .about_work_container .work_menu_container .menu1 .circle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  background-color: #86BE13;
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(0);
  opacity: 0;
  transition: transform 0.6s ease, opacity 0.4s ease;
  z-index: -1;
}
#top_about_work .about_work_container .work_menu_container .menu1 .circle .arrow {
  transform: translate(0);
}
@keyframes arrow_animation {
  0%, 60% {
    opacity: 1;
    transform: translateX(0%);
  }
  30% {
    opacity: 0;
    transform: translateX(150%);
  }
  40% {
    opacity: 0;
    transform: translateX(-150%);
  }
}
#top_about_work .about_work_container .work_menu_container .menu2:hover .circle::after {
  transform: translate(-50%, -50%) scale(3);
  opacity: 1;
  animation: arrow_animation 1.5s ease-in-out;
}
#top_about_work .about_work_container .work_menu_container .menu2:hover .circle .arrow {
  animation: arrow_animation 1.5s ease-in-out;
}
#top_about_work .about_work_container .work_menu_container .menu2 .circle {
  width: 28px;
  height: 28px;
  background-color: #86BE13;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  z-index: 1;
  transition: background-color 0.8s ease;
}
#top_about_work .about_work_container .work_menu_container .menu2 .circle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  background-color: #86BE13;
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(0);
  opacity: 0;
  transition: transform 0.6s ease, opacity 0.4s ease;
  z-index: -1;
}
#top_about_work .about_work_container .work_menu_container .menu2 .circle .arrow {
  transform: translate(0);
}
@keyframes arrow_animation {
  0%, 60% {
    opacity: 1;
    transform: translateX(0%);
  }
  30% {
    opacity: 0;
    transform: translateX(150%);
  }
  40% {
    opacity: 0;
    transform: translateX(-150%);
  }
}
#top_about_work .about_work_container .work_menu_container .menu3:hover .circle::after {
  transform: translate(-50%, -50%) scale(3);
  opacity: 1;
  animation: arrow_animation 1.5s ease-in-out;
}
#top_about_work .about_work_container .work_menu_container .menu3:hover .circle .arrow {
  animation: arrow_animation 1.5s ease-in-out;
}
#top_about_work .about_work_container .work_menu_container .menu3 .circle {
  width: 28px;
  height: 28px;
  background-color: #86BE13;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  z-index: 1;
  transition: background-color 0.8s ease;
}
#top_about_work .about_work_container .work_menu_container .menu3 .circle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  background-color: #86BE13;
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(0);
  opacity: 0;
  transition: transform 0.6s ease, opacity 0.4s ease;
  z-index: -1;
}
#top_about_work .about_work_container .work_menu_container .menu3 .circle .arrow {
  transform: translate(0);
}
@keyframes arrow_animation {
  0%, 60% {
    opacity: 1;
    transform: translateX(0%);
  }
  30% {
    opacity: 0;
    transform: translateX(150%);
  }
  40% {
    opacity: 0;
    transform: translateX(-150%);
  }
}
#top_about_work .top_interview {
  width: 100%;
  padding-top: 70px;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
}
#top_about_work .top_interview .interview_background {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
}
#top_about_work .top_interview .top_interview_title {
  width: 90%;
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  position: relative;
  z-index: 2;
}
#top_about_work .top_interview .top_interview_title .message_btn .circle {
  width: 28px;
  height: 28px;
  background-color: #86BE13;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  z-index: 1;
  transition: background-color 0.8s ease;
}
#top_about_work .top_interview .top_interview_title .message_btn .circle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  background-color: #86BE13;
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(0);
  opacity: 0;
  transition: transform 0.6s ease, opacity 0.4s ease;
  z-index: -1;
}
#top_about_work .top_interview .top_interview_title .message_btn .circle .arrow {
  transform: translate(0);
}
@keyframes arrow_animation {
  0%, 60% {
    opacity: 1;
    transform: translateX(0%);
  }
  30% {
    opacity: 0;
    transform: translateX(150%);
  }
  40% {
    opacity: 0;
    transform: translateX(-150%);
  }
}
#top_about_work .top_interview .top_interview_title .message_btn:hover .circle::after {
  transform: translate(-50%, -50%) scale(3);
  opacity: 1;
  animation: arrow_animation 1.5s ease-in-out;
}
#top_about_work .top_interview .top_interview_title .message_btn:hover .circle .arrow {
  animation: arrow_animation 1.5s ease-in-out;
}
#top_about_work .top_interview .top_interview_title .message_btn {
  display: flex;
  gap: 10px;
  align-items: center;
}
#top_about_work .top_interview .top_interview_title .message_btn .circle {
  width: 60px;
  height: 60px;
}
#top_about_work .top_interview .top_interview_title .message_btn .circle:hover::after {
  transform: translate(-50%, -50%) scale(3);
  opacity: 1;
  animation: arrow_animation 1.5s ease-in-out;
}
#top_about_work .top_interview .top_interview_title .message_btn .circle:hover .arrow {
  animation: arrow_animation 1.5s ease-in-out;
}
#top_about_work .top_interview .interviews {
  width: 100%;
  height: 720px;
  margin: 0 0 60px;
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 2;
}
@media screen and (max-width: 768px) {
  #top_about_work .top_interview .interviews {
    height: clamp(550px, 374.603px + 44.974vw, 720px);
  }
}
#top_about_work .top_interview .interviews .swiper-wrapper {
  width: 100%;
  align-items: flex-end;
}
#top_about_work .top_interview .interviews .swiper-wrapper .swiper-slide {
  position: relative;
  width: clamp(400px, 291.304px + 27.174vw, 500px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
#top_about_work .top_interview .interviews .swiper-wrapper .swiper-slide img {
  opacity: 0.6;
  height: 396px;
  transition: 0.5s ease;
  margin-top: -120px;
}
#top_about_work .top_interview .interviews .swiper-wrapper .swiper-slide .catch_copy {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: clamp(298px, 159.957px + 34.511vw, 425px);
  position: absolute;
  top: clamp(360px, 184.603px + 44.974vw, 530px);
}
#top_about_work .top_interview .interviews .swiper-wrapper .swiper-slide .catch_copy .copy {
  padding: 13px 24px;
  border-radius: 4px;
  background: var(--Linear, linear-gradient(90deg, #72B817 38.52%, #F4E101 100%));
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone; /* Safari対策 */
}
#top_about_work .top_interview .interviews .swiper-wrapper .swiper-slide .person_info {
  display: flex;
  gap: 15px;
  position: absolute;
  top: 690px;
}
@media screen and (max-width: 768px) {
  #top_about_work .top_interview .interviews .swiper-wrapper .swiper-slide .person_info {
    top: clamp(520px, 385.873px + 34.392vw, 650px);
  }
}
#top_about_work .top_interview .interviews .swiper-wrapper .swiper-slide p {
  width: auto;
  opacity: 0;
  visibility: visible;
  font-family: "Noto Sans JP", serif;
  font-weight: 400;
  font-style: normal;
  font-style: normal;
  line-height: normal;
}
#top_about_work .top_interview .interviews .swiper-wrapper .swiper-slide p.copy {
  color: #FFF;
  font-size: clamp(16px, 7.304px + 2.174vw, 24px);
  letter-spacing: 1.2px;
  text-align: center;
}
#top_about_work .top_interview .interviews .swiper-wrapper .swiper-slide p.join, #top_about_work .top_interview .interviews .swiper-wrapper .swiper-slide p.job_type {
  color: #363636;
  font-size: 18px;
  letter-spacing: 0.72px;
}
#top_about_work .top_interview .interviews .swiper-wrapper .swiper-slide.swiper-slide-active img {
  height: clamp(390px, 266.087px + 30.978vw, 504px);
  opacity: 1;
}
#top_about_work .top_interview .interviews .swiper-wrapper .swiper-slide.swiper-slide-active .catch_copy {
  top: clamp(360px, 241.349px + 30.423vw, 475px);
}
#top_about_work .top_interview .interviews .swiper-wrapper .swiper-slide.swiper-slide-active p {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.5s ease;
}
#top_about_work .top_interview .interviews .swiper-wrapper .swiper-slide.swiper-slide-next {
  opacity: 0.6;
  transition: opacity 1s ease;
}
#top_about_work .top_interview .interviews .swiper-wrapper .swiper-slide.swiper-slide-prev {
  opacity: 0.6;
  transition: opacity 1s ease;
}
#top_about_work .top_interview .interviews .navigation {
  width: clamp(352px, 222.652px + 32.337vw, 471px);
  justify-content: space-between;
  display: flex;
  position: absolute;
  top: 690px;
  z-index: 3;
}
@media screen and (max-width: 768px) {
  #top_about_work .top_interview .interviews .navigation {
    top: clamp(520px, 385.873px + 34.392vw, 650px);
  }
}
#top_about_work .top_interview .interviews .navigation svg {
  width: 28px;
  height: 28px;
}

#top_talk {
  width: 100%;
  position: relative;
  display: flex;
  justify-content: flex-end;
  background: #86BE13;
  padding-bottom: 300px;
  overflow-y: hidden;
  z-index: 2;
}
@media screen and (max-width: 768px) {
  #top_talk {
    justify-content: center;
  }
}
#top_talk .top_talk_union {
  width: 100%;
  position: absolute;
  top: 285px;
  object-fit: cover;
}
#top_talk .top_talk_container {
  width: 90%;
  display: flex;
  justify-content: center;
  gap: clamp(5px, -30.528px + 4.62vw, 36px);
  margin-top: clamp(120px, 28.316px + 11.923vw, 200px);
  z-index: 1;
}
@media screen and (max-width: 1280px) {
  #top_talk .top_talk_container {
    width: 95%;
  }
}
@media screen and (max-width: 768px) {
  #top_talk .top_talk_container {
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    margin-top: 70px;
  }
}
#top_talk .top_talk_container .top_talk_thick {
  font-family: "Noto Sans JP", serif;
  font-weight: 500;
  font-style: normal;
  color: #FFF;
  font-size: clamp(28px, 23.416px + 0.596vw, 32px);
  font-style: normal;
  line-height: normal;
  margin-right: auto;
}
#top_talk .top_talk_container .top_talk_thin {
  font-family: "Noto Sans JP", serif;
  font-weight: 300;
  font-style: normal;
  color: #FFF;
  font-size: 16px;
  font-style: normal;
  line-height: 200%; /* 32px */
  letter-spacing: 0.48px;
}
#top_talk .top_talk_container .top_talk_title {
  font-family: "Heebo", sans-serif;
  font-weight: 100;
  font-style: normal;
  color: rgba(255, 255, 255, 0.1);
  font-size: clamp(80px, 6.653px + 9.538vw, 144px);
  font-style: normal;
  line-height: normal;
  letter-spacing: -1.44px;
  margin-right: auto;
}
#top_talk .top_talk_container .top_talk_title.pc {
  display: block;
}
@media screen and (max-width: 768px) {
  #top_talk .top_talk_container .top_talk_title.pc {
    display: none;
  }
}
#top_talk .top_talk_container .top_talk_title.sp {
  display: none;
}
@media screen and (max-width: 768px) {
  #top_talk .top_talk_container .top_talk_title.sp {
    display: block;
    margin: 0 0 0 auto;
  }
}
#top_talk .top_talk_container .top_talk_text.sp {
  display: none;
}
@media screen and (max-width: 768px) {
  #top_talk .top_talk_container .top_talk_text.sp {
    display: flex;
    width: 90%;
    max-width: 530px;
    flex-direction: column;
    gap: 16px;
    margin: 0;
  }
}
#top_talk .top_talk_container .top_talk_img_container {
  width: clamp(380px, 146.206px + 30.402vw, 584px);
  height: clamp(235px, 89.452px + 18.927vw, 362px);
  display: flex;
  justify-content: center;
  align-items: center;
  background: #FFF;
  border-radius: 40px;
  position: relative;
  padding: 20px;
}
@media screen and (max-width: 768px) {
  #top_talk .top_talk_container .top_talk_img_container {
    margin-top: 15px;
    width: clamp(355px, 126.739px + 57.065vw, 565px);
    height: clamp(215px, 68.261px + 36.685vw, 350px);
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0.1;
  }
  1% {
    opacity: 0.1;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  99% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
#top_talk .top_talk_container .top_talk_img_container .top_talk_img_content {
  animation: fadeOut 0.8s ease-in 0s forwards;
  display: none;
  opacity: 0;
}
#top_talk .top_talk_container .top_talk_img_container .top_talk_img_content .top_talk_img {
  display: none;
  width: clamp(365px, 136.936px + 29.657vw, 564px);
  border-radius: 30px;
}
@media screen and (max-width: 768px) {
  #top_talk .top_talk_container .top_talk_img_container .top_talk_img_content .top_talk_img {
    width: clamp(340px, 111.739px + 57.065vw, 550px);
  }
}
#top_talk .top_talk_container .top_talk_img_container .top_talk_img_content .img_text {
  display: none;
}
#top_talk .top_talk_container .top_talk_img_container .top_talk_img_content.active {
  opacity: 1;
  display: block;
  animation: fadeIn 0.8s ease-in 0s forwards;
}
#top_talk .top_talk_container .top_talk_img_container .top_talk_img_content.active .top_talk_img {
  display: block;
  opacity: 1;
  transition: 0.5s;
  object-fit: cover;
}
#top_talk .top_talk_container .top_talk_img_container .top_talk_img_content.active .text_container {
  width: 50%;
  height: 16%;
  position: absolute;
  bottom: 7px;
  right: 7px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #FFF;
  border-radius: 40px 0 15px 0;
}
@media screen and (max-width: 768px) {
  #top_talk .top_talk_container .top_talk_img_container .top_talk_img_content.active .text_container {
    border-radius: 40px 0 25px 0;
    bottom: 5px;
    right: 6px;
  }
}
#top_talk .top_talk_container .top_talk_img_container .top_talk_img_content.active .text_container .img_text {
  font-family: "Noto Sans JP", serif;
  font-weight: 700;
  font-style: normal;
  color: #71AC42;
  font-size: clamp(13px, 7.27px + 0.745vw, 18px);
  font-style: normal;
  line-height: normal;
  display: block;
  opacity: 1;
  transition: 0.5s;
}
@media screen and (max-width: 768px) {
  #top_talk .top_talk_container .top_talk_img_container .top_talk_img_content.active .text_container .img_text {
    font-size: clamp(14px, 9.652px + 1.087vw, 18px);
  }
}
#top_talk .top_talk_container .top_talk_menu {
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media screen and (max-width: 768px) {
  #top_talk .top_talk_container .top_talk_menu {
    width: 100%;
    max-width: 550px;
  }
}
#top_talk .top_talk_container .top_talk_menu .top_talk_text.pc {
  width: 90%;
  display: flex;
  max-width: 530px;
  flex-direction: column;
  gap: 16px;
  margin: -30px;
}
@media screen and (max-width: 768px) {
  #top_talk .top_talk_container .top_talk_menu .top_talk_text.pc {
    width: 90%;
    margin: 20px 0 0 0;
    display: none;
  }
}
#top_talk .top_talk_container .top_talk_contents {
  width: 80%;
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-top: 64px;
}
@media screen and (max-width: 768px) {
  #top_talk .top_talk_container .top_talk_contents {
    width: auto;
    margin-top: 42px;
  }
}
#top_talk .top_talk_container .top_talk_contents .top_talk_content {
  width: clamp(320px, 302.809px + 2.235vw, 335px);
  display: flex;
  justify-content: space-between;
  border-bottom: solid 1px #FFF;
  padding: 0 20px 10px 0;
  margin: 0 auto 0 0;
  cursor: pointer;
}
#top_talk .top_talk_container .top_talk_contents .top_talk_content:hover .circle::after {
  transform: translate(-50%, -50%) scale(3);
  opacity: 1;
  animation: arrow_animation 1.5s ease-in-out;
}
#top_talk .top_talk_container .top_talk_contents .top_talk_content:hover .circle .arrow {
  animation: arrow_animation 1.5s ease-in-out;
}
@media screen and (max-width: 768px) {
  #top_talk .top_talk_container .top_talk_contents .top_talk_content {
    width: 335px;
  }
}
#top_talk .top_talk_container .top_talk_contents .top_talk_content p {
  font-family: "Noto Sans JP", serif;
  font-weight: 500;
  font-style: normal;
  color: #FFF;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 200%; /* 32px */
  letter-spacing: 0.48px;
}
#top_talk .top_talk_container .top_talk_contents .top_talk_content .message_btn .circle {
  width: 28px;
  height: 28px;
  background-color: #FFF;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  z-index: 1;
  transition: background-color 0.8s ease;
}
#top_talk .top_talk_container .top_talk_contents .top_talk_content .message_btn .circle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  background-color: #FFF;
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(0);
  opacity: 0;
  transition: transform 0.6s ease, opacity 0.4s ease;
  z-index: -1;
}
#top_talk .top_talk_container .top_talk_contents .top_talk_content .message_btn .circle .arrow {
  transform: translate(0);
}
@keyframes arrow_animation {
  0%, 60% {
    opacity: 1;
    transform: translateX(0%);
  }
  30% {
    opacity: 0;
    transform: translateX(150%);
  }
  40% {
    opacity: 0;
    transform: translateX(-150%);
  }
}
#top_talk .top_talk_container .top_talk_contents .top_talk_content .message_btn .circle:hover::after {
  transform: translate(-50%, -50%) scale(3);
  opacity: 1;
  animation: arrow_animation 1.5s ease-in-out;
}
#top_talk .top_talk_container .top_talk_contents .top_talk_content .message_btn .circle:hover .arrow {
  animation: arrow_animation 1.5s ease-in-out;
}
#top_talk .top_talk_container .top_talk_contents .top_talk_content .message_btn .circle {
  width: 28px;
  height: 28px;
}
#top_talk .top_talk_container .top_talk_contents .top_talk_content .message_btn .circle .arrow {
  width: 10px;
  height: 10px;
}

#top_anchor {
  width: 100%;
  display: flex;
  justify-content: center;
  position: relative;
}
#top_anchor .top_anchor_background {
  width: 100%;
  height: 650px;
  background: #F5F2E2;
}
@media screen and (max-width: 768px) {
  #top_anchor .top_anchor_background {
    height: clamp(730px, 595.873px + 34.392vw, 860px);
  }
}
#top_anchor .top_anchor_all_container {
  width: 95%;
  display: flex;
  flex-direction: column;
  gap: 20px;
  background: #F5F2E2;
  z-index: 2;
  border-radius: 60px;
  padding: 57px clamp(60px, 8.428px + 6.706vw, 105px) 150px;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: -135px;
}
@media screen and (max-width: 768px) {
  #top_anchor .top_anchor_all_container {
    width: 100%;
    padding: 50px clamp(22px, -19.304px + 10.326vw, 60px) 150px;
    border-radius: 30px;
  }
}
#top_anchor .top_anchor_all_container .top_anchor_thick {
  font-family: "Noto Sans JP", serif;
  font-weight: 500;
  font-style: normal;
  color: #363636;
  font-size: 32px;
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.96px;
  transition: 0.3s;
}
#top_anchor .top_anchor_all_container .top_anchor_thick.title {
  font-size: 28px;
}
#top_anchor .top_anchor_all_container .top_anchor_thin {
  font-family: "Noto Sans JP", serif;
  font-weight: 300;
  font-style: normal;
  color: #363636;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 335%; /* 53.6px */
}
#top_anchor .top_anchor_all_container .anchor_title {
  width: 100%;
  display: flex;
  gap: 50px;
  align-items: center;
}
@media screen and (max-width: 768px) {
  #top_anchor .top_anchor_all_container .anchor_title {
    gap: 0;
    justify-content: space-between;
  }
}
#top_anchor .top_anchor_all_container .anchor_title .message_btn {
  display: flex;
  gap: 13px;
  align-items: center;
}
#top_anchor .top_anchor_all_container .anchor_title .message_btn .circle {
  width: 28px;
  height: 28px;
  background-color: #86BE13;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  z-index: 1;
  transition: background-color 0.8s ease;
}
#top_anchor .top_anchor_all_container .anchor_title .message_btn .circle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  background-color: #86BE13;
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(0);
  opacity: 0;
  transition: transform 0.6s ease, opacity 0.4s ease;
  z-index: -1;
}
#top_anchor .top_anchor_all_container .anchor_title .message_btn .circle .arrow {
  transform: translate(0);
}
@keyframes arrow_animation {
  0%, 60% {
    opacity: 1;
    transform: translateX(0%);
  }
  30% {
    opacity: 0;
    transform: translateX(150%);
  }
  40% {
    opacity: 0;
    transform: translateX(-150%);
  }
}
#top_anchor .top_anchor_all_container .anchor_title .message_btn:hover .circle::after {
  transform: translate(-50%, -50%) scale(3);
  opacity: 1;
  animation: arrow_animation 1.5s ease-in-out;
}
#top_anchor .top_anchor_all_container .anchor_title .message_btn:hover .circle .arrow {
  animation: arrow_animation 1.5s ease-in-out;
}
#top_anchor .top_anchor_all_container .anchor_title .message_btn .circle {
  width: 60px;
  height: 60px;
}
#top_anchor .top_anchor_all_container .anchor_title .message_btn .circle:hover::after {
  transform: translate(-50%, -50%) scale(3);
  opacity: 1;
  animation: arrow_animation 1.5s ease-in-out;
}
#top_anchor .top_anchor_all_container .anchor_title .message_btn .circle:hover .arrow {
  animation: arrow_animation 1.5s ease-in-out;
}
#top_anchor .top_anchor_all_container .top_anchor_wrapper {
  margin-top: 68px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  row-gap: 58px;
  column-gap: clamp(50px, -46.268px + 12.519vw, 134px);
}
@media screen and (max-width: 768px) {
  #top_anchor .top_anchor_all_container .top_anchor_wrapper {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 16px;
  }
}
#top_anchor .top_anchor_all_container .top_anchor_wrapper .anchor_link {
  display: flex;
  justify-content: space-between;
  padding: 0 clamp(0px, -61.887px + 8.048vw, 54px) clamp(16px, 7.304px + 2.174vw, 24px) 0;
  border-bottom: solid 1px #D6D6D6;
  align-items: center;
  gap: 30px;
}
@media screen and (max-width: 768px) {
  #top_anchor .top_anchor_all_container .top_anchor_wrapper .anchor_link {
    align-items: flex-start;
  }
}
#top_anchor .top_anchor_all_container .top_anchor_wrapper .anchor_link p {
  font-size: clamp(21px, 17.562px + 0.447vw, 24px);
}
@media screen and (max-width: 768px) {
  #top_anchor .top_anchor_all_container .top_anchor_wrapper .anchor_link p {
    font-size: clamp(16px, 10.565px + 1.359vw, 21px);
  }
}
#top_anchor .top_anchor_all_container .top_anchor_wrapper .anchor_link .image_container {
  width: clamp(140px, 105.618px + 4.471vw, 170px);
  height: fit-content;
  overflow: hidden;
  border-radius: 4px;
}
@media screen and (max-width: 768px) {
  #top_anchor .top_anchor_all_container .top_anchor_wrapper .anchor_link .image_container {
    width: clamp(88px, 31.478px + 14.13vw, 140px);
  }
}
#top_anchor .top_anchor_all_container .top_anchor_wrapper .anchor_link .image_container img {
  width: 100%;
  transition: 0.3s;
}
#top_anchor .top_anchor_all_container .top_anchor_wrapper .anchor_link:hover p {
  color: #86BE13;
  transition: 0.3s;
}
#top_anchor .top_anchor_all_container .top_anchor_wrapper .anchor_link:hover img {
  scale: 1.1;
  transition: 0.3s;
}

/*# sourceMappingURL=index.css.map */