/* Reset & Base Styles */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "Noto Serif SC" !important;
}
html {
  overflow-x: hidden;
  scroll-behavior: smooth;
  margin: auto;
}
body {
  font-family: "Noto Serif SC";
  line-height: 1.6;
  color: #000000;
}

img {
  max-width: 100%;
  height: auto;
}

/* Navigation */
.nav {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 7.66vw;
  background-color: rgba(27, 138, 123, 0.9);
  backdrop-filter: blur(0.21vw);
  z-index: 1000;
  font-family: "Noto Serif SC";
}

.nav-content {
  max-width: 100vw;
  margin: 0 auto;
  height: 100%;
  padding: 0 6.46vw;
}

.nav-links {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  list-style: none;
  width: 100%;
  height: 100%;
}
.nav-links li {
  display: block;
  flex: 1;
  text-align: center;
  line-height: 100%;
}
.nav-links a {
  color: #ffffff;
  text-decoration: none;
  font-weight: 900;
  font-size: 1.25vw;
}

/* Header */
.header {
  height: 42.5vw;
  background: url("images/bg-header.jpg") no-repeat center center;
  background-size: cover;
  position: relative;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  padding-top: 7.66vw;
  justify-content: center;
}

.header-content {
  text-align: right;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
  box-sizing: border-box;
  padding-top: 9.3vw;
  position: relative;
  right: -3vw;
}

.logo {
  width: 28.65vw;
  height: 28.65vw;
  display: block;
}

.company-name-en {
  font-family: "Inter", sans-serif;
  font-weight: 300;
  font-size: 1.46vw;
  letter-spacing: 0.3em;
  margin-top: -9.74vw;
}

.company-name-jp {
  font-weight: 700;
  font-size: 3.02vw;
  margin-top: 1.09vw;
  letter-spacing: 0.05em;
}

.company-slogan {
  font-weight: 600;
  font-size: 1.56vw;
  letter-spacing: 0.5em;
  margin-top: 0.36vw;
}

/* Common Section Styles */
#strengths .section-content {
  font-family: "Noto Serif SC";
}
.section-content {
  max-width: 66.88vw;
  margin: 0 auto;
  padding: 5.21vw 0;
  text-align: center;
  font-family: "Noto Serif SC";
}

.section-title {
  font-weight: 900;
  font-size: 2.08vw;
  color: #70a370;
  margin-bottom: 2.08vw;
}

.section-text {
  font-size: 1.46vw;
  line-height: 1.57;
}

/* Philosophy Section */
.philosophy {
  padding: 7.81vw 0;
}

.philosophy .section-title {
  color: #0f8478;
}

/* Image Sections */
.trust-section,
.balance-section,
.environment-section {
  position: relative;
  min-height: 52.08vw;
  overflow: hidden;
}

.section-image {
  position: relative;
  width: 100%;
  height: 100%;
}

.section-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.image-title {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #ffffff;
  font-size: 3.65vw;
  font-weight: 900;
  text-shadow: 0 0.26vw 0.52vw rgba(6, 42, 6, 1);
  text-align: center;
}
.trust-section .image-title {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-80%, -210%);
  color: #ffffff;
  font-size: 3.65vw;
  font-weight: 900;
  text-shadow: 0 0.26vw 0.52vw rgba(6, 42, 6, 1);
  text-align: left;
}

.balance-section .image-title {
  color: #36b6c7;
  transform: translate(20%, -60%);
  text-shadow: none;
}

/* Business Section */
.business {
  background: linear-gradient(180deg, #def5de 0%, #ffffff 100%);
  padding: 7.81vw 0 0;
  border-bottom: 5.21vw solid #ffffff;
}

.business .section-content {
  padding: 0;
}

.business-image {
  margin-top: 4.17vw;
}

.business-image img {
  max-width: 66.88vw;
  width: 100%;
}

/* Strengths Section */
.strengths {
  height: 84.48vw;
  background: url("images/Group\ 22.png") no-repeat top center;
  background-size: 100% auto;
  padding: 7.81vw 0;
}
.strengths .section-content {
  padding: 0;
}

.strengths-grid {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 3.65vw;
  max-width: 66.88vw;
  margin: 0 auto;
  padding: 0 4.79vw;
}
.strengths-grid::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 0.1vw;
  z-index: 1;
  background: url("images/Line\ 1.png") no-repeat center center;
}
.strengths-grid::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 0.1vw;
  height: 100%;
  background: url("images/Line\ 2.png") no-repeat center center;
}

.strength-item {
  text-align: center;
  padding: 1.56vw;
  position: relative;
}

.strength-item h3 {
  font-size: 1.25vw;
  margin-bottom: 1.04vw;
  font-weight: bold;
}

.strength-item p {
  font-size: 1.25vw;
  line-height: 1.42;
}

/* Final Image */
.final-image {
  height: 56.25vw;
  overflow: hidden;
}

.final-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Footer */
.footer {
  background-color: #0f8478;
  padding: 2.6vw 0;
  color: #ffffff;
}

.footer-content {
  max-width: 100vw;
  margin: 0 auto;
  padding: 2.71vw 18.96vw;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 18.23vw;
  box-sizing: border-box;
}

.footer-logo {
  display: flex;
  align-items: center;
}

.footer-logo img {
  width: 11.67vw;
  height: 11.67vw;
}

.footer-company {
  text-align: left;
}

.footer-company-name {
  font-weight: 900;
  font-size: 1.25vw;
}

.footer-company-type {
  font-weight: 600;
  font-size: 1.04vw;
  margin-bottom: 0.26vw;
}

.footer-info {
  text-align: right;
}

.footer-address {
  font-size: 1.04vw;
  font-weight: 400;
  letter-spacing: 0.3em;
}
.footer-phone {
  font-weight: 600;
  font-size: 1.67vw;
  margin-bottom: 0.99vw;
  display: flex;
  align-items: center;
  gap: 0.3em;
  flex-direction: row-reverse;
  margin-top: 0.3vw;
}

.footer-social {
  display: flex;
  flex-direction: row;
  gap: 0.94vw;
  justify-content: flex-end;
  margin-top: 0.99vw;
  align-items: center;
}

.social-icon {
  width: 1.56vw;
  height: 1.56vw;
  background-size: contain;
  background-repeat: no-repeat;
  display: block;
}

.social-icon.phone {
  background-image: url("data:image/svg+xml,%3Csvg width='31' height='31' viewBox='0 0 31 31' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M19.375 6.45833C20.7792 6.71667 22.0708 7.37917 23.0833 8.39167C24.0958 9.40417 24.7583 10.6958 25.0167 12.1M19.375 0.791667C22.3125 1.09583 25.025 2.325 27.0958 4.39583C29.1667 6.46667 30.3958 9.17917 30.7 12.1167M29.2917 21.7583V25.6333C29.2917 26.1125 29.1792 26.5833 28.9625 27.0125C28.7458 27.4417 28.4333 27.8167 28.0458 28.1125C27.6583 28.4083 27.2083 28.6167 26.7292 28.725C26.25 28.8333 25.7583 28.8375 25.2792 28.7375C21.1875 28.0458 17.3042 26.4458 13.9458 24.0375C10.8125 21.8167 8.18333 19.1875 5.9625 16.0542C3.54583 12.6833 1.94583 8.78333 1.2625 4.67917C1.1625 4.20417 1.16667 3.71667 1.275 3.24167C1.38333 2.76667 1.59167 2.32083 1.88333 1.9375C2.175 1.55417 2.54583 1.24583 2.97083 1.02917C3.39583 0.8125 3.86667 0.7 4.34167 0.7H8.21667C9.05417 0.691667 9.86667 0.966667 10.5167 1.475C11.1667 1.98333 11.6125 2.69167 11.7792 3.5125C12.0792 5.15417 12.5875 6.75 13.2917 8.26667C13.5583 8.84583 13.6542 9.48333 13.5667 10.1083C13.4792 10.7333 13.2125 11.3208 12.7917 11.8L10.9542 13.6375C12.9917 16.8792 15.7125 19.6 18.9542 21.6375L20.7917 19.8C21.2708 19.3792 21.8583 19.1125 22.4833 19.025C23.1083 18.9375 23.7458 19.0333 24.325 19.3C25.8417 20.0042 27.4375 20.5125 29.0792 20.8125C29.9125 20.9792 30.6292 21.4333 31.1417 22.0958C31.6542 22.7583 31.925 23.5833 31.9083 24.4292L29.2917 21.7583Z' stroke='white' stroke-width='2'/%3E%3C/svg%3E");
}

.social-icon.instagram {
  background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='3.75' y='3.75' width='22.5' height='22.5' rx='6' stroke='white' stroke-width='2'/%3E%3Ccircle cx='15' cy='15' r='5' stroke='white' stroke-width='2'/%3E%3Ccircle cx='21.875' cy='8.125' r='1.25' fill='white'/%3E%3C/svg%3E");
}

.social-icon.wechat {
  background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21.875 11.875C21.875 8.08333 18.125 5 13.75 5C9.375 5 5.625 8.08333 5.625 11.875C5.625 15.6667 9.375 18.75 13.75 18.75C14.5833 18.75 15.4167 18.75 16.25 18.3333L18.75 20V16.6667C20.4167 15.6667 21.875 13.75 21.875 11.875Z' stroke='white' stroke-width='2'/%3E%3Cpath d='M24.375 18.75C24.375 16.6667 22.0833 15 19.375 15C16.6667 15 14.375 16.6667 14.375 18.75C14.375 20.8333 16.6667 22.5 19.375 22.5C19.7917 22.5 20.2083 22.5 20.625 22.0833L22.0833 23.3333V21.25C23.3333 20.4167 24.375 19.5833 24.375 18.75Z' stroke='white' stroke-width='2'/%3E%3C/svg%3E");
}

/* Responsive Design */
/* @media (max-width: 1280px) {
  .nav-links {
    gap: 3vw;
  }

  .strengths-grid {
    grid-template-columns: 1fr;
    padding: 0 5%;
  }
}

@media (max-width: 768px) {
  .nav {
    height: auto;
  }

  .nav-content {
    padding: 4vw 5%;
  }

  .nav-links {
    flex-direction: column;
    gap: 3vw;
    text-align: center;
  }

  .nav-links a {
    font-size: 4vw;
  }

  .header {
    height: auto;
    padding: 15vw 0;
  }

  .header-content {
    position: static;
    text-align: center;
    padding: 0 5%;
  }

  .logo {
    width: 50vw;
    height: 50vw;
  }

  .company-name-en {
    margin-top: 4vw;
    font-size: 4vw;
  }

  .company-name-jp {
    font-size: 6vw;
  }

  .company-slogan {
    font-size: 4vw;
  }

  .section-title {
    font-size: 5vw;
  }

  .section-text {
    font-size: 3.5vw;
  }

  .image-title {
    font-size: 6vw;
    width: 90%;
  }

  .strength-item h3 {
    font-size: 4vw;
  }

  .strength-item p {
    font-size: 3.5vw;
  }

  .footer-content {
    flex-direction: column;
    text-align: center;
    gap: 5vw;
    padding: 5vw;
  }

  .footer-logo {
    flex-direction: column;
  }

  .footer-logo img {
    width: 30vw;
    height: 30vw;
  }

  .footer-company,
  .footer-info {
    text-align: center;
  }

  .footer-company-name {
    font-size: 4vw;
  }

  .footer-company-type {
    font-size: 3.5vw;
  }

  .footer-address,
  .footer-phone {
    font-size: 4vw;
  }

  .footer-social {
    justify-content: center;
  }

  .social-icon {
    width: 6vw;
    height: 6vw;
  }
} */
