@charset "UTF-8";

/* ==== root ========================== */
:root {
  --color-black: #4d4d4d;
  --color-white: #fcfcfb;
  --color-navy: #003e72;
  --color-primary: #afa37d;
  --color-txt-gold: #8d7c47;
  --color-bg: #efede6;
  --color-bg-gray: #f5f5f5;
  --color-underline: #bdbdbd;

  --noto-sans: 'Noto Sans JP', serif;
  --cormorant: 'Cormorant Garamond', serif;
  --zen-old: 'Zen Old Mincho', serif;
  --klee-one: 'Klee One', serif;
  --cormorant-garamond: 'Cormorant Garamond', serif;

  --line-middle: 2;
  --line-large: 2.4;
}

/*================================================
 *  philosophy
 ================================================*/
.section {
  padding-bottom: 0;
}

.section#future_vision,
.section#overview {
  padding-bottom: 80px;
}

.sp-only {
  display: none;
}

.narrow {
  width: 1100px;
  margin: 0 auto;
}

.bg-highlight {
  background-color: var(--color-txt-gold);
  color: var(--color-white);
}

.underline {
  text-decoration: underline;
  text-decoration-thickness: 0.1rem;
  text-underline-offset: 0.3rem;
  text-decoration-color: var(--color-underline);
}

.title_en {
  display: block;
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 20px;
  letter-spacing: 0;
  font-family: var(--cormorant-garamond);
}

.title_en .num {
  color: var(--color-txt-gold);
  margin-right: 5px;
}

.title_ja {
  font-size: 36px;
  font-family: var(--zen-old);
  font-weight: 500;
  margin-bottom: 60px;
  line-height: 1;
}

.title_ja_sub {
  font-size: 24px;
  font-family: var(--zen-old);
  margin-top: 1em;
}

.highlight {
  color: var(--color-txt-gold);
  font-weight: 500;
}

.content_header p {
  font-size: 24px;
  font-family: var(--zen-old);
  letter-spacing: 0;
  line-height: 1.6;
  font-weight: 500;
  margin-bottom: 1.5em;
}

.content_body {
  display: flex;
  align-items: flex-start;
  gap: 80px;
}

.content_body.reverse {
  flex-direction: row-reverse;
}

.content_body.align-center {
  align-items: center;
}

.content_body p {
  font-size: 16px;
  text-align: left;
}

.content_txt {
  flex: 1;
  max-width: 60%;
}

.content_txt p {
  margin-bottom: 1em;
  line-height: 1.8;
  letter-spacing: 0.03em;
}

.content_list {
  background-color: var(--color-bg-gray);
  padding: 20px;
  margin-bottom: 2em;
  width: fit-content;
}

.content_list ul {
}

.content_list ul li {
  margin-bottom: 3em;
  position: relative;
  padding-left: 1.5em;
}

.content_list ul li::before {
  content: '';
  width: 1px;
  height: 100%;
  background-color: var(--color-txt-gold);
  position: absolute;
  left: 0;
  top: 0;
}

.content_list ul li:last-child {
  margin-bottom: 0;
}

.content_list ul li p {
  margin-bottom: 0;
  font-size: 14px;
}

.content_txt .no-wrap {
  white-space: nowrap;
}

.content_img {
  flex: 0 0 38%;
  max-width: 38%;
}

.content_img img {
  width: 100%;
  height: auto;
}

#ending_workplace .content_body {
  gap: 20px;
}

#values_character .content_img {
  flex: 0 0 42%;
  max-width: 42%;
}

/* レスポンシブ対応 */
@media screen and (max-width: 767px) {
  .pc-only {
    display: none;
  }
  .sp-only {
    display: block;
  }

  .section#philosophy {
    padding-top: 80px;
  }

  .section {
    padding-top: 40px;
  }

  .narrow {
    width: 100%;
  }

  .post {
    padding: 0 15px;
  }

  .title_en {
    font-size: 12px;
  }

  .title_ja {
    font-size: 20px;
  }

  .title_ja_sub {
    font-size: 16px;
    line-height: 1.6;
  }

  .content_header p {
    font-size: 16px;
  }

  .content_txt {
    max-width: 100%;
  }

  .content_txt .no-wrap {
    white-space: unset;
  }

  .sp-br {
    margin-bottom: 1em;
  }

  .content_img,
  #values_character .content_img {
    flex: 0 0 100%;
    max-width: 100%;
  }

  .title_ja {
    font-size: 20px;
    margin-bottom: 30px;
  }

  .content_body,
  .content_body.reverse {
    flex-direction: column-reverse;
    gap: 20px;
    align-items: flex-start;
  }

  .content_body p {
    font-size: 12px;
  }

  .content_list {
    padding: 15px;
  }

  .content_list ul li p {
    font-size: 12px;
  }
}