/* ------------------ 企業情報 ------------------ */
.open-page {
  color: rgb(204, 200, 241);
}

.sp-on {
  display: none;
}

/* ------------------ メインビュー ------------------ */
#main-view {
  position: relative;
}

.main-view-video {
  width: 100%;
  height: clamp(10px, 25vw, 244px);
  object-fit: cover;
}

.main-view-wrapper {
  text-align: center;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
}

.main-view-title {
  /* font-size: clamp(10px, 3vw, 38px);
  font-weight: bold; */
  font-family: tsukushigothic, "ms gothic", "ヒラギノ角ゴ pro w3", "hiragino kaku gothic pro", osaka, sans-serif;
  font-size: clamp(10px, 2.5vw, 26px);
  font-weight: 100;
  color: #ffffff;
  /* margin-bottom: 6%; */
  position: absolute;
  margin: 0;
  top: 45%;
  left: 50%;
  transform: translate(-50%,-50%);
}

.main-view-nav {
  font-size: clamp(10px, 2vw, 20px);
  font-weight: 400;
  color: #3e3a39;
}

.open-area {
  color: #3fc3ab;
}

.main-view-nav ul {
  display: flex;
  justify-content: center;
  gap: 8%;
  background-color: rgba(255, 255, 255, 0.5);
  padding: 1% 0;
}

/* ------------------ 企業情報 ------------------ */
#overview {
  padding: 8% 10%;
}

.common-title {
  font-family: "Noto Serif JP", serif;
  font-size: clamp(10px, 2.5vw, 32px);
  color: #3e3a39;
  border-bottom: solid 1px #00c4af;
  padding-bottom: 1%;
  margin-bottom: 8%;
}

.overview-content-area {
  text-align: center;
}

.logo {
  width: 30%;
  margin-bottom: 5%;
}

.company-name {
  font-size: clamp(10px, 1.5vw, 19px);
  font-weight: 500;
  color: #3e3a39;
  margin-bottom: 8%;
}

.common-content-title {
  font-family: "Zen Old Mincho", serif;
  font-family: "Noto Serif JP","YuMincho","Hiragino Mincho ProN",serif;
 font-weight: 400;
  font-size: clamp(10px, 2.5vw, 32px);
  /* font-weight: bold; */
  color: #3e3a39;
  margin-bottom: 8%;
  text-align: center;
}

.common-content {
  font-size: clamp(10px, 2vw, 20px);
  color: #595757;
  text-align: left;
  line-height: 2;
  margin-bottom: 10%;
  text-align: center;
}

.adjustment {
  text-align: left;
  font-family: "Noto Serif JP","YuMincho","Hiragino Mincho ProN",serif;
 font-weight: 100;
}

.info-area {
  font-size: clamp(10px, 1.5vw, 20px);
  font-weight: 500;
  color: #3e3a39;
  display: flex;
  border-top: solid 1px #00c4af;
  padding: 5% 5%;
  line-height: 2;
}

.info-area:last-child {
  border-bottom: solid 1px #00c4af;
}

.item {
  width: 28%;
}

.info-area-address {
  /* font-size: clamp(10px, 1.5vw, 19px);
  line-height: 2; */
}

/* ------------------ 企業理念 ------------------ */
#philosophy {
  display: none;
  padding: 8% 10%;
}

/* ------------------ 沖縄の歩み ------------------ */
#history {
  display: none;
  padding: 8% 10%;
}

/* ------------------ 代表挨拶 ------------------ */
#greeting {
  display: none;
  padding: 8% 10%;
}

.greeting-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.greeting-photo {
  width: 28%;
  margin-right: 10%;
  margin: 8% 5% 0 0;
}


/* ------------------ SP ------------------ */
@media screen and (max-width: 960px) {

  /* ------------------  SP ------------------ */
  .sp-on {
    display: block;
  }

  .sp-off {
    display: none;
  }

  /* ------------------ メインビュー　SP ------------------ */
  .main-view-video {
    height: clamp(10px, 35vw, 10320px);
  }

  .main-view-title {
    font-size: clamp(10px, 6vw, 77px);
    margin-bottom: 8%;
  }

  .main-view-nav {
    font-size: clamp(10px, 3.5vw, 58px);
  }

  .main-view-nav ul {
    gap: 6%;
    padding: 2% 0;
  }

  /* ------------------ 企業情報　SP ------------------ */
  #overview {
    padding: 8% 5%;
  }

  .common-title {
    font-size: clamp(10px, 6vw, 77px);
    padding-bottom: 4%;
    margin-bottom: 12%;
  }

  .logo {
    width: 60%;
    margin-bottom: 10%;
  }

  .company-name {
    font-size: clamp(10px, 4vw, 51px);
    margin-bottom: 10%;
  }

  .common-content-title {
    font-size: clamp(10px, 5vw, 64px);
    margin-bottom: 10%;
  }

  .common-content {
    font-size: clamp(10px, 4vw, 51px);
    margin-bottom: 15%;
  }

  .info-area {
    font-size: clamp(10px, 4vw, 126px);
    display: flex;
    border-top: solid 1px #00c4af;
    padding: 2% 0;
  }

  .info-area:last-child {
    border-bottom: solid 1px #00c4af;
  }

  .item {
    width: 28%;
  }

  .info-area-content {
    width: 72%;
  }

  .info-area-address {
    font-size: clamp(10px, 3.5vw, 45px);
    width: 72%;
  }

  /* ------------------ 企業理念 SP ------------------ */
  #philosophy {
    padding: 8% 5%;
  }

  /* ------------------ 沖縄の歩み SP ------------------ */
  #history {
    padding: 8% 5%;
  }

  /* ------------------ 代表挨拶 SP ------------------ */
  #greeting {
    padding: 8% 5%;
  }

  .greeting-wrapper {
    flex-wrap: wrap;
}

  .greeting-photo {
    /* display: none; */
    margin: 0 0 30px;
    width: 100%;
  }
}