/* 全局样式 */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
html {
  overflow-x: hidden;
  margin: auto;
}
body {
  font-family: "Noto Serif SC", serif;
  line-height: 1.6;
  color: #333333;
  background-color: #ffffff;
  overflow-x: hidden;
}

/* 导航栏样式 */
.nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  background: #002f5d;
  height: 7.66vw; /* 147/1920*100 */
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  backdrop-filter: blur(0.1vw); /* 2/1920*100 */
}

.nav-content {
  width: 100%;
  max-width: 100vw;
  height: 100%;
}

.nav-links {
  list-style: none;
  display: flex;
  justify-content: space-between;
  box-sizing: border-box;
  padding: 0 16.46vw;
  align-items: center;
  height: 100%;
}
.nav-links li {
  display: block;
  padding: 0;
  margin: 0;
  text-align: center;
}

.nav-links a {
  display: block;
  color: #ffffff;
  text-decoration: none;
  font-size: 1.25vw; /* 24/1920*100 */
  font-weight: 900;
  transition: opacity 0.3s ease;
  height: 100%;
  line-height: 100%;
}

.nav-links a:hover {
  opacity: 0.8;
}

.nav-links a.active {
  opacity: 1;
  position: relative;
}

.nav-links a.active::after {
  content: "";
  position: absolute;
  bottom: -0.5vw;
  left: 50%;
  transform: translateX(-50%);
  width: 60%;
  height: 0.15vw;
  background: #ffffff;
  border-radius: 0.075vw;
}

/* 首页横幅样式 */
.hero {
  position: relative;
  height: 43.85vw;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: linear-gradient(180deg, #001932 -56.85%, rgba(0, 0, 0, 0) 91.3%),
    url("../images/1049246173978820633\ 1.png") no-repeat center center;
  background-size: contain;
  box-sizing: border-box;
  overflow: hidden;
  padding-top: 6vw;
  gap: 4.5vw;
}

.hero-background {
  width: 40.31vw;
  height: 40.31vw;
}

.hero-bg-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero-content {
  text-align: center;
  color: #ffffff;
  padding-top: 3vw;
  position: relative;
  left: -20vw;
}

.hero-logo {
  width: 8.85vw;
  height: 11.46vw;
  margin: 0 auto 1.56vw;
  background: url("../images/图层_1.png") no-repeat center center;
  background-size: 100% 100%;
}

.hero-title-en {
  font-family: "Kalam", cursive;
  font-size: 2.5vw; /* 48/1920*100 */
  font-weight: 700;
  letter-spacing: 0.1vw; /* 2/1920*100 */
  line-height: 1.594em;
}

.hero-title-brand {
  font-family: "Arial Black";
  font-style: normal;
  font-weight: 900;

  color: #ffffff;

  font-size: 3.85vw; /* 74/1920*100 */
  margin-bottom: 0.1vw; /* 30/1920*100 */
  color: #ffffff;
  line-height: 1.306em;
}

.hero-title-jp {
  font-family: "Noto Serif SC", serif;
  font-size: 1.88vw; /* 36/1920*100 */
  font-weight: 900;
  margin-bottom: 1vw;
  line-height: 1.2em;
}

.hero-subtitle {
  font-family: "Noto Serif SC", serif;
  font-size: 1.67vw; /* 32/1920*100 */
  font-weight: 900;
  opacity: 1;
  line-height: 1.2em;
  color: #ffffff;
}

/* 公司介绍样式 */
.company-intro {
  padding: 6.25vw 0; /* 120/1920*100 */
  background: #ffffff;
  /* height: 18.23vw; 350/1920*100 */
  display: flex;
  align-items: center;
}

.section-content {
  max-width: 100vw;
  margin: 0 auto;
  padding: 0 16.67vw; /* 320/1920*100 */
}

.intro-text {
  font-size: 1.25vw; /* 24/1920*100 */
  line-height: 1.5;
  text-align: center;
  color: #000000;
}

/* 营养食品样式 */
.nutrition {
  position: relative;
  height: 26.04vw; /* 500/1920*100 */
  display: flex;
  align-items: center;
  text-align: center;
  color: #002f5d;
  background: url("../images/dan-meyers-0AgtPoAARtE-unsplash\ 1.png") no-repeat
      center center,
    rgba(0, 47, 93, 0.35);
  background-size: 100% 100%;
  background-blend-mode: color;
  color: #fff;
}

.section-background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

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

.section-category {
  font-size: 3.85vw; /* 74/1920*100 */
  font-weight: 900;
  margin-bottom: 0.57vw; /* 20/1920*100 */
  /* color: #09b6a2; */
  line-height: 1.15em;
  z-index: 2;
  position: relative;
}

.section-title {
  font-size: 1.67vw; /* 32/1920*100 */
  font-weight: 900;
  line-height: 1.2em;
  z-index: 2;
  position: relative;
}

.section-subtitle {
  font-size: 2.5vw; /* 48/1920*100 */
  font-weight: 700;
  font-family: "Kalam", cursive;
  font-style: italic;
  line-height: 1.208em;
  z-index: 2;
  position: relative;
  margin-bottom: 2.5vw;
}

/* 营养食品详情样式 */
.nutrition-detail {
  padding: 4.17vw 0; /* 80/1920*100 */
  background: #ffffff;
  height: 18.23vw; /* 350/1920*100 */
  display: flex;
  align-items: center;
}

.description-text {
  font-size: 1.25vw; /* 24/1920*100 */
  line-height: 1.5;
  text-align: center;
  color: #000000;
}

/* 产品展示样式 */
.product {
  position: relative;
  height: 38.02vw; /* 916/1920*100 */
  background: url("../images/product_bg.png") no-repeat center center, #ffffff;
  background-size: 100% 100%;
}
.product-info {
  text-align: center;
  /* padding-top: 4.9vw; */
}
.product-content {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  padding-top: 2.76vw;
}

.product-brand {
  font-family: "Arial Black";
  font-size: 4.17vw; /* 80/1920*100 */
  font-weight: 400;
  color: #000;
  margin-bottom: 1.46vw; /* 20/1920*100 */
  line-height: 1.3em;
}

.product-name {
  font-family: "Lemon", cursive;
  font-size: 1.88vw; /* 36/1920*100 */
  font-weight: 400;
  color: #333333;
  margin-bottom: 2vw; /* 40/1920*100 */
  line-height: 1.306em;
  margin-top: -2vw;
}

.product-descriptions .brand-description {
  font-size: 1.46vw; /* 28/1920*100 */
  font-weight: 900;
  line-height: 1.786em;
  color: #000;
  /* margin-bottom: 3.39vw; */
}
.product-description {
  text-align: center;
  font-family: "Noto Serif SC";
  font-style: normal;
  font-weight: 400;
  font-size: 1.25vw;
  line-height: 1.875vw;
  color: #000000;
}

.product-image {
  width: 19.11vw;
  height: 18.9vw;
  position: relative;
}
.product-image::before {
  content: "";
  left: 50%;
  position: absolute;
  width: 16.4vw;
  height: 0.94vw;
  background: linear-gradient(
    90deg,
    #4a736e 16.35%,
    rgba(255, 255, 255, 0) 100%
  );
  border-radius: 50%;
  mix-blend-mode: multiply;
  filter: blur(0.14vw);
  bottom: 50%;
  transform: translate(-15%, 900%);
}
.product-image img {
  width: 100%;
  height: 100%;
  position: relative;
}

/* 国际贸易样式 */
.trade {
  position: relative;
  /* height: 72.92vw; */
  height: 26.04vw;
  display: flex;
  align-items: center;
  text-align: center;
  color: #fff;
  background: #e3f2ff;
}
.trade .section-background {
  background: url("../images/bec18248-5826-4750-bf38-15691c18d79e\ 1.png")
      no-repeat center center,
    rgba(0, 47, 93, 0.6);
  background-size: 100% 100%;
  background-blend-mode: color;
}

/* 贸易详情样式 */
.trade-detail {
  color: #000000;
  font-family: "Noto Serif SC";
  padding: 5.42vw 0 0;
  box-sizing: border-box;
  background: #fff;
  height: 46.88vw; /* 350/1920*100 */
}

.trade-images {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-top: 5.42vw; /* 60/1920*100 */
  justify-content: space-between;
}
.image-item {
  width: 100%;
  height: 23.7vw; /* 455/1920*100 */
  overflow: hidden;
}
.image-item img {
  width: 100%;
  height: 23.7vw; /* 455/1920*100 */
  object-fit: cover;
  border-radius: 0;
}

/* 投资合作样式 */
.investment {
  position: relative;
  height: 26.04vw; /* 500/1920*100 */
  display: flex;
  align-items: center;
  text-align: center;
  color: #fff;
  background: #f8fad3;
}
.investment .section-category {
  margin-bottom: 0.73vw;
}
.investment .section-background {
  background: url("../images/pexels-fauxels-3184418\ 1.png") no-repeat center
      center,
    rgba(0, 47, 93, 0.6);
  background-size: 100% 100%;
  background-blend-mode: color;
}
/* 投资详情样式 */
.investment-detail {
  padding: 6.35vw 4.84vw 6.35vw;
  background: #fff;
  /* height: 46.88vw; */
}
/* 
.investment-images {
  height: 23.7vw;
}
.investment-images img {
  width: 100%;
  height: auto;
  object-fit: cover;
} */

.investment-all {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 3.125vw;
  margin-top: 6.35vw;
}
.investment-all-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.investment-all-item img {
  display: block;
  width: 100%;
  height: auto;
}
.investment-all-item img:nth-child(2) {
  margin-top: 1.51vw;
}
.investment-all-item-text {
  font-size: 1.25vw;
  font-family: "Noto Serif SC";
  font-style: normal;
  font-weight: 400;
  line-height: 1.875vw;
  color: #000000;
  margin-top: 3.125vw;
  text-align: left;
}

/* 联系信息样式 */
.footer {
  background: #002f5d;
  padding: 0 10vw;
  color: #ffffff;
  height: 13.02vw;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  justify-content: space-between;
}

.footer-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.contact-details {
  display: flex;
  align-items: center;
  gap: 1.04vw; /* 20/1920*100 */
  text-align: right;
}
.contact-text .contact-options {
  display: flex;
  flex-direction: row;
  gap: 2vw;
}
.contact-text .address {
  font-size: 1.25vw;
  font-weight: 600;
  line-height: 1.2em;
  display: flex;
  align-items: center;
  gap: 0.5vw;
  margin-top: 0.7em;
  text-align: right;
  flex-direction: row-reverse;
}
.contact-text .phone {
  font-size: 1.25vw;
  font-weight: 600;
  line-height: 1.2em;
  display: flex;
  align-items: center;
  gap: 0.5vw;
}

.footer-logo {
  display: flex;
  align-items: center;
  gap: 1.04vw; /* 20/1920*100 */
}

.company-logo {
  min-width: 6.3vw; /* 121/1920*100 */
  height: 8.13vw; /* 156/1920*100 */
  background: #ffffff;
  border-radius: 0;
  background: url("../images/图层_1.png") no-repeat center center;
  background-size: 100% 100%;
}
.friends-logo {
  display: flex;
  flex-direction: column;
}
.friends-intro {
  font-style: normal;
  font-weight: 400;
  font-size: 1.04vw;
  text-align: left;
  color: #ffffff;
  border-bottom: 1px solid #fff;
  padding-bottom: 0.5vw;
  margin-bottom: 0.5vw;
}
.company-logo-link {
  text-decoration: none;
  display: block;
  width: 11vw;
  height: 2.8vw;
  background: url("../images/Frame.png") no-repeat center center;
  background-size: 100% 100%;
}

.company-name {
  text-align: right;
}

.company-type {
  font-size: 0.73vw; /* 14/1920*100 */
  opacity: 0.8;
}

.company-name-jp {
  font-family: "Lemon", cursive;
  font-size: 1.25vw; /* 24/1920*100 */
  font-weight: 400;
}
