@charset "UTF-8";
/* CSS Document */
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box; }

html, body {
  font-size: 62.5%;
  height: 100%;
  padding: 0;
  margin: 0;
  scroll-behavior: smooth; }

body {
  font-family: 'Noto Sans JP', "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
  text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  line-height: 1.6;
  color: #303030;
  letter-spacing: 1px;
  font-size: 1.8rem;
  font-weight: 400; }

h1, h2, h3, h4, p, dl, dt, dd, img, a, div {
  padding: 0;
  margin: 0; }

ul, ul > li {
  margin: 0;
  padding: 0;
  list-style-type: none; }

img {
  display: block;
  width: 100%;
  height: auto;
  vertical-align: top; }

table {
  border-collapse: collapse; }

a {
  text-decoration: none;
  color: #1d1d1d;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
  outline: none; }

a:hover {
  color: #005bab;
  text-decoration: none;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear; }

h2 {
  text-align: center;
  margin-bottom: 65px;
  line-height: 1; }
  h2 small {
    color: #005bab;
    display: block;
    font-size: 1.8rem;
    margin-top: 47px;
    line-height: 1; }

h3 {
  margin-bottom: 52px; }
  h3 small {
    color: #005bab;
    display: block;
    font-size: 1.8rem; }

p {
  margin-bottom: 2em; }

article {
  padding: 130px 4%; }

section {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto; }

figure {
  margin: 0; }

figure img {
  border-radius: 34px; }

.pc {
  display: block; }

.sp {
  display: none; }

@media screen and (max-width: 850px) {
  .pc {
    display: none !important; }

  .sp {
    display: block !important; } }
/*------------------------------------------------

	header

------------------------------------------------*/
#header .inner {
  display: flex;
  justify-content: space-between;
  padding: 30px 4%;
  align-items: center; }
#header .sitename {
  max-width: 250px; }
#header nav ul {
  display: flex;
  column-gap: 0px; }
#header nav a {
  display: block;
  padding: 15px;
  line-height: 1; }
#header nav .nav_contact {
  margin-left: 20px; }
  #header nav .nav_contact a {
    background: #005bab;
    color: #fff;
    border-radius: 30px;
    padding: 15px 20px; }
#header .main_visual {
  position: relative; }
  #header .main_visual .mv_text {
    position: absolute;
    top: 50%;
    left: 15%;
    transform: translateY(-50%);
    z-index: 2;
    width: 320px; }

.scroll {
  position: relative; }

@media screen and (max-width: 850px) {
  #header {
    padding-top: 0;
    flex-wrap: wrap; }
    #header .inner {
      width: 100%;
      align-items: center; }
    #header .sitename {
      width: 240px;
      margin: 0 auto 0 0; }
    #header nav {
      display: none; }
    #header .main_visual .mv_text {
      top: 40%;
      width: 35%; }

  .scroll {
    position: absolute;
    bottom: -380px;
    z-index: 2;
    right: 5%;
    padding-top: 120px;
    width: 120px; } }
/*------------------------------------------------

スマホ用ナビ

------------------------------------------------*/
#g-nav {
  /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
  position: fixed;
  z-index: 999;
  /*ナビのスタート位置と形状*/
  bottom: -120%;
  left: 0;
  width: 100%;
  height: 100vh;
  /*ナビの高さ*/
  background: rgba(255, 255, 255, 0.95);
  /*動き*/
  transition: all 0.6s; }
  #g-nav.panelactive {
    bottom: 0; }
  #g-nav #g-nav-list {
    /*ナビの数が増えた場合縦スクロール*/
    position: fixed;
    z-index: 999;
    width: 100%;
    height: 100vh;
    /*表示する高さ*/
    overflow: auto;
    -webkit-overflow-scrolling: touch; }

/*ナビゲーション*/
#g-nav ul {
  /*ナビゲーション天地中央揃え*/
  position: absolute;
  z-index: 999;
  top: 30%;
  left: 10%;
  width: 80%;
  transform: translateY(-50%); }
  #g-nav ul li {
    list-style: none;
    text-align: center;
    border-bottom: solid 1px #ccc; }
    #g-nav ul li:first-child {
      border-top: solid 1px #ccc; }
    #g-nav ul li a {
      text-decoration: none;
      padding: 24px 10px;
      display: block;
      text-transform: uppercase;
      letter-spacing: 0.1em;
      font-weight: bold;
      font-size: 2.2rem; }

@media screen and (max-width: 850px) {
  #g-nav ul {
    transform: translateY(-40%); }
    #g-nav ul li a {
      padding: 16px 5px;
      font-size: 1.7rem; } }
@media screen and (min-width: 851px) {
  .openbtn1 {
    display: none; } }
/*========= ハンバーガー ===============*/
.openbtn1 {
  position: fixed;
  z-index: 9999;
  top: 20px;
  right: 0px;
  cursor: pointer;
  width: 80px;
  height: 80px;
  background-color: #005bab;
  border-radius: 0 0 0 50px; }
  .openbtn1 span {
    display: inline-block;
    transition: all .4s;
    position: absolute;
    left: 36.5%;
    height: 2px;
    border-radius: 2px;
    background-color: #fff;
    width: 35%;
    font-size: 1rem; }
  .openbtn1.active span:nth-of-type(1) {
    top: 38px;
    left: 13px;
    transform: translateY(6px) rotate(-45deg);
    width: 65%; }
  .openbtn1.active span:nth-of-type(3) {
    top: 50px;
    left: 13px;
    transform: translateY(-6px) rotate(45deg);
    width: 65%; }

@media screen and (max-width: 850px) {
  .openbtn1 {
    width: 80px;
    height: 80px;
    top: 0; }
    .openbtn1 span:nth-of-type(1) {
      top: 30px; }
    .openbtn1 span:nth-of-type(2) {
      top: 38px; }
    .openbtn1 span:nth-of-type(3) {
      top: 46px; }
    .openbtn1.active span:nth-of-type(1) {
      top: 30px;
      left: 35.5%;
      transform: translateY(6px) rotate(-45deg);
      width: 40%; }
    .openbtn1.active span:nth-of-type(2) {
      opacity: 0; }
    .openbtn1.active span:nth-of-type(3) {
      top: 42px;
      left: 35.5%;
      transform: translateY(-6px) rotate(45deg);
      width: 40%; } }
/*------------------------------------------------

コンテンツ

------------------------------------------------*/
#content h2 {
  font-size: 4.2rem; }
#content .banners {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap; }
#content .banner {
  width: 50%; }
#content .inner {
  position: relative;
  overflow: hidden;
  max-width: 100%;
  padding-top: 45%; }
#content .inner::after {
  position: absolute;
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  top: 0;
  opacity: .8;
  /*背景画像 不透明度80%*/
  transition: all .3s ease-out; }
#content .inner:hover::after {
  opacity: 1;
  -moz-transform: scale(1.03);
  -webkit-transform: scale(1.03);
  -ms-transform: scale(1.03);
  transform: scale(1.03); }
#content .banner_01 .inner::after {
  background: url("../images/banner_01.jpg") no-repeat center/cover; }
#content .banner_02 .inner::after {
  background: url("../images/banner_02.jpg") no-repeat center/cover; }
#content .inner a {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 3.4rem;
  text-align: center;
  font-weight: 300;
  text-decoration: none;
  z-index: 1; }
  #content .inner a::after {
    position: absolute;
    left: 50%;
    bottom: 10%;
    transform: translateX(-50%);
    content: "";
    width: 50px;
    height: 25px;
    background: url("../images/arrow_01.png") no-repeat 0 0/cover;
    transition: all .3s ease-out; }
  #content .inner a:hover::after {
    bottom: 8%; }

@media screen and (max-width: 850px) {
#lead {
  padding: 50px 4% 0 4%;
  line-height: 0;
  padding-bottom: 0;
  margin-bottom: 0;
}

#lead img {
  display: block;
  width: 100%;
  height: auto;
}
  #content {
    padding: 80px 5%; }
    #content h2 {
      font-size: 4.2vw; }
      #content h2 small {
        margin-top: 2em; }
    #content .banner {
      width: 100%; }
      #content .banner:first-child {
        margin-bottom: 20px; }
    #content .inner a {
      font-size: 4vw; } }
#abroad {
  position: relative;
  padding-bottom: 75px; }
  #abroad::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background: #005bab;
    width: 30%;
    height: 100%;
    border-radius: 0 400px 0 0;
    z-index: -1; }
  #abroad section {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap; }
  #abroad figure {
    width: 42%;
    max-width: 500px; }
  #abroad .summary {
    width: 51%; }

#medical_care {
  position: relative;
  padding-bottom: 0;
  margin-bottom: 175px; }
  #medical_care::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    background: #005bab;
    width: 30%;
    height: 100%;
    border-radius: 400px 0 0 0;
    z-index: -1; }
  #medical_care section {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap; }
  #medical_care figure {
    width: 42%;
    max-width: 500px;
    order: 2; }
  #medical_care .summary {
    width: 51%;
    order: 1; }

.column h3 {
  font-size: 3.6rem;
  font-weight: 400;
  letter-spacing: 0.2em;
  margin-bottom: 80px; }
  .column h3 small {
    font-size: 1.8rem;
    letter-spacing: 0.02em;
    margin-top: 25px; }
.column h4 {
  font-size: 3rem;
  margin-bottom: 1em; }

@media screen and (max-width: 850px) {
  #abroad,
  #medical_care {
    padding: 100px 5% 60px;
    background-size: 50% auto; }
    #abroad::before,
    #medical_care::before {
      width: 50%;
      height: 30%; }
    #abroad figure,
    #abroad .summary,
    #medical_care figure,
    #medical_care .summary {
      width: 100%; }
    #abroad figure,
    #medical_care figure {
      margin-bottom: 20px; }
    #abroad h3,
    #medical_care h3 {
      font-size: 5vw; }
    #abroad h4,
    #medical_care h4 {
      font-size: 4vw; }

  #medical_care {
    margin-bottom: 0; }
    #medical_care figure {
      order: 1; }
    #medical_care .summary {
      order: 2; }

  .column h3 {
    margin-bottom: 40px; }
    .column h3 small {
      margin-top: 1em; } }
#about {
  background: #f0f4f8; }
  #about h3 {
    font-size: 4.6rem; }
    #about h3 small {
      margin-top: 20px; }
  #about h4 {
    font-size: 3rem;
    margin-bottom: 1em; }
  #about section {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: flex-end; }
  #about figure {
    width: 34%;
    padding-right: 27px; }
  #about .summary {
    width: 56%;
    padding-left: 75px; }
  #about .title {
    font-size: 1.3rem;
    margin-bottom: 0; }
    #about .title .name {
      font-size: 1.7rem; }

@media screen and (max-width: 850px) {
  #about {
    padding: 75px 5% 85px; }
    #about h3 {
      font-size: 5vw; }
    #about h4 {
      font-size: 4vw; }
    #about figure,
    #about .summary {
      width: 100%;
      padding-left: 0; }
    #about .summary {
      margin-bottom: 30px; }
    #about figure img {
      width: 60%;
      margin: 0 auto; } }
#outline h3 {
  text-align: center;
  font-size: 4.6rem;
  margin-bottom: 75px; }
  #outline h3 small {
    margin-top: 20px; }
#outline table {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto; }
#outline th, #outline td {
  padding: 25px 20px 25px 0;
  vertical-align: top; }
#outline th {
  width: 25%;
  position: relative;
  text-align: left;
  font-weight: normal; }
  #outline th::before {
    content: "";
    width: 10px;
    height: 1px;
    background: #005bab;
    position: absolute;
    top: 0;
    left: 0; }
#outline td {
  border-bottom: solid 1px #e8e8e8; }

@media screen and (max-width: 850px) {
  #outline {
    padding: 75px 4% 0; }
    #outline h3 {
      font-size: 5vw; }
    #outline h4 {
      font-size: 4vw; }
    #outline table {
      width: 80%; } }
#contact {
  padding-bottom: 0; }
  #contact h3 {
    text-align: center;
    font-size: 4.6rem;
    margin-bottom: 75px; }
    #contact h3 small {
      margin-top: 20px; }
    #contact h3 + p {
      background: #e5e5e5;
      padding: 24px;
      max-width: 850px;
      margin: 0 auto; }
  #contact .form_area {
    height: 1280px;
    width: 100%;
    max-width: 850px;
    margin: 0 auto; }
    #contact .form_area iframe {
      width: 100%;
      max-width: 850px;
      transform: translateY(-170px);
      border: none; }

@media screen and (max-width: 850px) {
  #contact h3 {
    font-size: 5vw; }
  #contact h4 {
    font-size: 4vw; } }

/* 事業内容：タイトルとサブを確実に改行（#content内だけ） */
#content .inner a{
  flex-direction: column;     /* ← これで縦積みになる */
  gap: .35em;
}

#content .inner a .bn-title,
#content .inner a .bn-sub{
  display: block;
  line-height: 1.2;
}

#content .inner a .bn-sub{
  font-size: 0.7em;           /* small相当。好みで調整OK */
  opacity: .95;
}
/* ==================================================
   #career（専門職キャリア支援）を #abroad/#medical_care と同レイアウトに
   ※影響範囲を限定するためID指定のみ
================================================== */

#career{
  position: relative;
  padding-bottom: 75px;
}

/* 左側に青い背景シェイプ（#abroad と同系統） */
#career::before{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  background: #005bab;
  width: 30%;
  height: 100%;
  border-radius: 0 400px 0 0;
  z-index: -1;
}

/* 2カラム */
#career section{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

#career figure{
  width: 42%;
  max-width: 500px;
}

#career .summary{
  width: 51%;
}

/* SP（#abroad/#medical_care と同じ落とし方） */
@media screen and (max-width: 850px){
  #career{
    padding: 100px 5% 60px;
  }

  #career::before{
    width: 50%;
    height: 30%;
  }

  #career figure,
  #career .summary{
    width: 100%;
  }

  #career figure{
    margin-bottom: 20px;
  }
}
/*------------------------------------------------

	footer

------------------------------------------------*/
#footer {
  padding: 80px 4%;
  background: #f4f4f4;
  color: #364246; }
  #footer .footer_inner {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between; }
    #footer .footer_inner .footer_info .sitename {
      text-align: center;
      font-size: 1.8rem;
      margin-bottom: 40px; }
      #footer .footer_inner .footer_info .sitename img {
        max-width: 110px;
        margin: 0 auto 20px; }
    #footer .footer_inner .footer_info .address {
      font-size: 1.6rem; }
    #footer .footer_inner .footer_link {
      text-align: right;
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      padding-top: 20px; }
      #footer .footer_inner .footer_link ul {
        display: flex;
        gap: 30px;
        margin-bottom: 2em; }
        #footer .footer_inner .footer_link ul li a {
          font-size: 1.6rem;
          display: block;
          color: #364246; }
          #footer .footer_inner .footer_link ul li a:hover {
            color: #005bab; }
      #footer .footer_inner .footer_link .permit {
        margin: auto 0 2em 0; }
      #footer .footer_inner .footer_link .copyright {
        font-size: 1.4rem; }

@media screen and (max-width: 850px) {
  #footer {
    padding: 72px 6% 20px; }
    #footer .footer_inner {
      flex-wrap: wrap; }
      #footer .footer_inner .footer_info {
        width: 100%;
        margin-bottom: 50px; }
        #footer .footer_inner .footer_info .sitename {
          text-align: center;
          max-width: 300px;
          font-size: 3vw;
          margin: 0 auto 50px; }
        #footer .footer_inner .footer_info br {
          display: block; }
        #footer .footer_inner .footer_info .address {
          margin-bottom: 0; }
      #footer .footer_inner .footer_link {
        text-align: left; }
        #footer .footer_inner .footer_link ul {
          flex-wrap: wrap;
          margin-bottom: 50px;
          gap: 0px; }
          #footer .footer_inner .footer_link ul li {
            width: 100%;
            margin-bottom: 1em; }
        #footer .footer_inner .footer_link .copyright {
          font-size: 1.4rem; } }
/*==================================================
スライダーのためのcss
===================================*/
.slider {
  /*横幅94%で左右に余白を持たせて中央寄せ*/
  width: 100%;
  margin: 0 auto; }

.slick-slide {
  margin: 0 10px; }

.slick-slide img {
  width: 85vw;
  /*スライダー内の画像を60vwにしてレスポンシブ化*/
  height: auto;
  border-radius: 60px;
  transition: opacity .5s;
  /*拡大や透過のアニメーションを0.5秒で行う*/
  opacity: 0.5;
  /*透過50%*/ }

.slick-center img {
  opacity: 1; }

/*ドットナビゲーションの設定*/
.slick-dots {
  text-align: center;
  margin: 20px 0 0 0; }

.slick-dots li {
  display: inline-block;
  margin: 0 10px; }

.slick-dots button {
  color: transparent;
  outline: none;
  width: 6px;
  height: 6px;
  display: block;
  border: none;
  border-radius: 50%;
  padding: 0;
  background: #acbbbf; }

.slick-dots .slick-active button {
  background: #005bab; }
  
  

/* ========================================
   ユイリンクメディカルページ用追加CSS
   style.cssの末尾に追加してください
======================================== */

/* テキストサイズ - トップページと統一（1.8rem） */
.yuilink-text-body,
.yuilink-text-standard,
.yuilink-text-large {
  font-size: 1.8rem;
  line-height: 1.8;
}

/* カードコンテナ */
.yuilink-card {
  padding: 30px;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease;
}

.yuilink-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

/* リストアイテム */
.yuilink-list-item {
  padding: 25px 25px 25px 30px;
  background: #f9f9f9;
  border-left: 4px solid #005bab;
  border-radius: 4px;
  transition: all 0.3s ease;
}

.yuilink-list-item:hover {
  background: #fff;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  transform: translateX(5px);
}

.yuilink-list-item strong {
  color: #005bab;
  font-size: 1.8rem;
  display: block;
  margin-bottom: 10px;
}

/* テーブルフォントサイズ */
.yuilink-table {
  font-size: 1.6rem;
}

/* 引用文 - 斜体を解除 */
.yuilink-blockquote {
  border-left: 4px solid #005bab;
  padding-left: 30px;
  font-style: normal;
  color: #555;
  margin-bottom: 30px;
}

/* センタリングコンテナ */
.yuilink-center-text {
  text-align: center;
}

/* スマホサイズでの調整 */
@media screen and (max-width: 850px) {
  .yuilink-text-body,
  .yuilink-text-standard,
  .yuilink-text-large {
    font-size: 1.7rem;
  }
  
  .yuilink-card {
    padding: 20px;
  }
  
  .yuilink-card:hover {
    transform: translateY(-3px);
  }
  
  .yuilink-list-item {
    padding: 20px 20px 20px 25px;
  }
  
  .yuilink-list-item:hover {
    transform: translateX(3px);
  }
  
  .yuilink-list-item strong {
    font-size: 1.7rem;
  }
  

   .yuilink-blockquote {
    padding-left: 20px;
  }
}
/*-----------------------------------------
  User Voices
-----------------------------------------*/
#user_voices {
  background: #f8fbff;              /* Our messageと相性の良い淡いブルー */
  padding: 100px 4%;
}

#user_voices h3 {
  text-align: center;
  font-size: 4.6rem;                 /* #about/#outline と統一 */
  margin-bottom: 60px;
}
#user_voices h3 small {
  display: block;
  color: #005bab;
  font-size: 1.8rem;
  margin-top: 20px;
}

#user_voices .voice_item {
  max-width: 980px;
  margin: 0 auto 48px;
  display: flex;
  align-items: center;
  gap: 40px;
  background: #fff;
  border-radius: 24px;
  padding: 32px 36px;
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
}

#user_voices .voice_photo {
  width: 180px;
  flex: 0 0 180px;
  margin: 0;
}
#user_voices .voice_photo img {
  width: 180px;
  height: 180px;
  object-fit: cover;
  border-radius: 50%;                /* 丸型写真 */
}

#user_voices .voice_text {
  flex: 1 1 auto;
}
#user_voices .voice_text h4 {
  font-size: 2.4rem;                 /* サブ見出し */
  margin-bottom: 12px;
}
#user_voices .voice_text p {
  margin-bottom: 0;
  color: #555;
  line-height: 1.9;
}
#user_voices .voice_attr {
  color: #7b8a93;
  font-size: 1.5rem;
}

/* SPレイアウト */
@media screen and (max-width: 850px) {
  #user_voices {
    padding: 75px 5%;
  }
  #user_voices h3 {
    font-size: 4.4vw;   /* 5vw → 4.4vw */
  }
  #user_voices .voice_item {
    flex-direction: column;
    text-align: left;
    gap: 20px;
    padding: 24px;
  }
  #user_voices .voice_photo,
  #user_voices .voice_photo img {
    width: 140px;
    height: 140px;
  }
  #user_voices .voice_text h4 {
    font-size: 3.8vw;   /* 4.2vw → 3.8vw */
  }
  #user_voices .voice_text p {
    font-size: 3.6vw;   /* 本文サイズを追加 */
    line-height: 1.8;
  }
}
#contact {
  scroll-margin-top: 100px; /* ヘッダーの高さに合わせて調整 */
}
/*-----------------------------------------
  共通：スマホ時の見出しサイズを調整
-----------------------------------------*/
@media screen and (max-width: 850px) {
  /* 全体の見出しサイズを少し控えめに */
  #about h3,
  #outline h3,
  #contact h3 {
    font-size: 4.4vw; /* 5vw → 4.4vw に統一 */
  }

  #about h4,
  #outline h4,
  #contact h4 {
    font-size: 3.8vw; /* 4vw → 3.8vw に統一 */
  }

  /* 段落の本文もやや控えめに */
  #about p,
  #outline p,
  #contact p {
    font-size: 3.6vw;
    line-height: 1.8;
  }
}
/* ===== Outline（会社概要）— トップページ専用 ===== */
.outline--top {
  padding: 100px 4% 0;
}

.outline--top h3 {
  text-align: center;
  font-size: 4.6rem;
  margin-bottom: 60px;
}
.outline--top h3 small {
  display: block;
  color: #005bab;
  font-size: 1.8rem;
  margin-top: 20px;
}

/* ライン型テーブル（トップだけ） */
.outline--top table {
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  border-collapse: collapse;
  border-spacing: 0;
}

.outline--top th {
  width: 24%;
  text-align: left;
  font-weight: 600;
  color: #005bab;
  padding: 16px 12px;
  letter-spacing: .02em;
  position: relative;
  vertical-align: top;
  border-bottom: 1px solid #e8e8e8;
}

/* 左の青バー（控えめ） */
.outline--top th::before {
  content: "";
  width: 3px;
  height: 1em;
  background: #005bab;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 2px;
}

.outline--top td {
  padding: 16px 12px 16px 24px;
  color: #303030;
  line-height: 1.9;
  border-bottom: 1px solid #e8e8e8;
}

.outline--top td ol,
.outline--top td ul { margin: 0; padding-left: 1.2em; }
.outline--top td li { margin-bottom: .6em; }

/* スマホ */
@media screen and (max-width: 850px) {
  .outline--top { padding: 75px 5% 0; }

  .outline--top h3 { font-size: 4.4vw; }

  .outline--top table,
  .outline--top tbody,
  .outline--top tr,
  .outline--top th,
  .outline--top td {
    display: block;
    width: 100%;
  }

  .outline--top th {
    padding: 14px 0 6px 12px;
    margin-top: 18px;
    white-space: nowrap;
  }
  .outline--top th::before {
    left: 0;
    top: 12px;
    transform: none;
    height: .9em;
  }

  .outline--top td {
    padding: 0 0 16px 12px;
    font-size: 3.6vw;  /* User Voicesと整合 */
    line-height: 1.8;
    border-bottom: none;
  }

  .outline--top tr { border-bottom: 1px solid #e8e8e8; }
}
/*-----------------------------------------
  スマホ時：#abroad・#medical_care・#outline 本文サイズ統一
-----------------------------------------*/
@media screen and (max-width: 850px) {
  #abroad p,
  #medical_care p,
  #outline p {
    font-size: 3.6vw;   /* User Voicesと統一（約14px相当） */
    line-height: 1.8;
  }
}
/* Business content の前の余白を調整 */
#lead article {
  padding-bottom: 40px; /* ← もとの130pxからぐっと短くする */
}

/* Business content の上余白もやや詰める */
#content {
  padding-top: 40px; /* ← 80pxから半分に */
}
/* ハンバーガーメニュー修正：クリックできない問題対応 */
#g-nav {
  pointer-events: none; /* ← 非表示中はクリック無効化 */
}

#g-nav.panelactive {
  pointer-events: auto; /* ← 開いたときだけ有効 */
}

.openbtn1 {
  z-index: 10001; /* ← メニューより前面に出す */
}
/* ==================================================
   Business content（#content） 3枚横並びだけ上書き
   ※他セクションに影響を出さないため #content 配下限定
================================================== */

#content .banners{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;                 /* 画像同士の隙間なし（今の雰囲気） */
}

#content .banner{
  width: auto;            /* 既存の width:50% を無効化 */
}

/* PC：少し高さを出す（スマホは今まで通り） */
#content .inner{
  padding-top: 52%;       /* 45%→52% にして少しだけ高さを出す */
}

/* 3枚目の背景（必要に応じてファイル名変更） */
#content .banner_03 .inner::after{
  background: url("../images/banner_03.jpg") no-repeat center/cover;
}

/* 文字の読みやすさ：今の雰囲気（大きめ）を維持しつつ、3枚でも窮屈にしない */
#content .inner a{
  font-size: 3.0rem;      /* 3.4rem だと3枚時に窮屈になりやすいので少しだけ下げる */
  line-height: 1.25;
  padding: 0 12px;
  letter-spacing: 0.06em;
}

/* 3枚のとき矢印位置が上に見えがちなので微調整 */
#content .inner a::after{
  bottom: 8%;
}
#content .inner a:hover::after{
  bottom: 6%;
}

/* タブレット幅：2列→1列に落とす（崩れ防止） */
@media screen and (max-width: 1100px){
  #content .banners{
    grid-template-columns: repeat(2, 1fr);
  }
}

/* スマホ：縦並び（今のままでOK）＋文字サイズは既存の 4vw を優先 */
@media screen and (max-width: 850px){
  #content .banners{
    grid-template-columns: 1fr;
    gap: 20px;
  }
  #content .inner{
    padding-top: 45%;      /* スマホは元のまま */
  }
  #content .inner a{
    font-size: 4vw;        /* 既存と合わせる */
  }
}


/* ==================================================
   スマホ時：#career だけ #abroad/#medical_care と同じ見出しサイズに揃える
   ※影響範囲を #career 内だけに限定
================================================== */
@media screen and (max-width: 850px){
  #career h3{
    font-size: 5vw;
  }
  #career h4{
    font-size: 4vw;
  }

  /* 本文も他2つに寄せる（必要なら） */
  #career p{
    font-size: 3.6vw;
    line-height: 1.8;
  }
}

/* ========================================
   スマホ時：MV（スライダー画像）の角丸を小さく
======================================== */
@media screen and (max-width: 850px){
  .slick-slide img{
    border-radius: 30px; /* 60pxの半分 */
  }
}

/* ================================
   スマホ時：MVの高さを少し出す
================================ */
@media screen and (max-width: 850px){
  .slick-slide img{
    height: 60vh;
    object-fit: cover;
  }
}

/* ========================================
   yuilink : definition / support block / mini FAQ
======================================== */

.yuilink-definition {
  max-width: 900px;
  margin: 32px auto 0;
  padding: 0 4%;
}
.yuilink-definition h2 {
  font-size: clamp(2.4rem, 4.2vw, 3.4rem);
  margin: 0 0 12px;
  color: #005bab;
  line-height: 1.25;
  letter-spacing: 0.02em;
}
.yuilink-definition p {
  font-size: 1.7rem;
  line-height: 1.9;
  margin: 0;
}

.yuilink-subsection {
  max-width: 900px;
  margin: 35px auto 0;
  padding: 28px 26px;
  border-radius: 20px;
  background: #f0f4f8;
  position: relative;
}
.yuilink-subsection:before {
  content: "";
  position: absolute;
  left: 0;
  top: 18p
}




/* ========================================
   yuilink : Activities (main initiatives)
======================================== */
.yuilink-activities-lead{
  max-width: 900px;
  margin: 0 auto 25px;
}

.yuilink-activities-list{
  max-width: 900px;
  margin: 0 auto;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 25px;
}

.yuilink-activity{
  padding: 26px 26px 24px 30px;
  background: #f9f9f9;
  border-left: 4px solid #005bab;
  border-radius: 8px;
  transition: all 0.3s ease;
}

.yuilink-activity:hover{
  background: #fff;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  transform: translateX(5px);
}

.yuilink-activity-title{
  color: #005bab;
  font-size: clamp(2.0rem, 3.2vw, 2.4rem);
  margin: 0 0 12px;
  line-height: 1.35;
}

.yuilink-activity .yuilink-text-standard{
  margin: 0;
}

@media screen and (max-width: 850px){
  .yuilink-activity{
    padding: 20px 20px 18px 24px;
  }
  .yuilink-activity:hover{
    transform: translateX(3px);
  }
}

/* ====== YUILINK EMBEDDED STYLES - EXTRACTED FROM <style> TAG ====== */

/* ====== Definition Section ====== */
.yuilink-definition {
  max-width: 900px;
  margin: 32px auto 0;
  padding: 0 4%;
}

.yuilink-definition h2 {
  font-size: clamp(2.4rem, 4.2vw, 3.4rem);
  margin: 0 0 12px;
  color: #005bab;
  line-height: 1.25;
  letter-spacing: 0.02em;
}

.yuilink-definition p {
  font-size: 1.7rem;
  line-height: 1.9;
  margin: 0;
}

/* ====== Subsection Block ====== */
.yuilink-subsection {
  max-width: 900px;
  margin: 35px auto 0;
  padding: 28px 26px;
  border-radius: 20px;
  background: #f0f4f8;
  position: relative;
}

.yuilink-subsection:before {
  content: "";
  position: absolute;
  left: 0;
  top: 18px;
  bottom: 18px;
  width: 4px;
  background: #005bab;
  border-radius: 4px;
}

.yuilink-subsection h3 {
  margin: 0 0 14px;
  padding-left: 14px;
  color: #005bab;
  font-size: clamp(1.9rem, 3vw, 2.3rem);
}

.yuilink-subsection p,
.yuilink-subsection li,
.yuilink-subsection dd {
  font-size: 1.6rem;
  line-height: 1.9;
}

/* ====== Note & FAQ ====== */
.yuilink-note {
  margin-top: 10px;
  font-size: 1.4rem;
  color: #666;
}

.yuilink-mini-faq {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid #d8e2ee;
}

.yuilink-mini-faq dt {
  font-weight: 700;
  margin-top: 14px;
}

.yuilink-mini-faq dd {
  margin: 8px 0 0;
  color: #333;
}

/* ====== Responsive ====== */
/* Background文章：PCでも縦長になりすぎない行幅に制御 */
.yuilink-background-text{
  max-width: 900px;
  margin: 0 auto;
  padding: 0 4%;
}

.yuilink-background-text p{
  /* ここがキモ：行幅を“文字数ベース”で制御 */
  max-width: 42em;
  margin: 0 auto 1.8em;
  line-height: 1.95;
  letter-spacing: 0.02em;
  text-wrap: pretty; /* 対応ブラウザでは改行が自然になる */
}

/* PCで詰まりすぎるなら少しだけ広げる */
@media (min-width: 1024px){
  .yuilink-background-text p{
    max-width: 46em;
  }
}

/* スマホはそのまま自然に折り返し */
@media (max-width: 768px){
  .yuilink-background-text p{
    max-width: 100%;
    line-height: 2.0;
  }
}

/* =========================================
   Outline : YUILINK link styled like nav_contact
========================================= */
.btn-contact-like{
  display: inline-block;
  padding: 14px 28px;
  border-radius: 999px;            /* お問い合わせと同じ丸さ */
  background: #005bab;             /* グローバルナビと同色 */
  color: #fff;
  font-size: 1.6rem;
  font-weight: 500;
  text-decoration: none;
  letter-spacing: 0.06em;
  transition: all .25s ease;
}

.btn-contact-like:hover{
  background: #004a8c;             /* hover時少し濃く */
  transform: translateY(-1px);
}

/* スマホ調整 */
@media screen and (max-width: 850px){
  .btn-contact-like{
    font-size: 3.6vw;
    padding: 14px 24px;
  }
}

/* ================================
   Outline 追加：ユイリンク案内（トップページ内だけ）
   ※影響範囲を #outline .outline-related に限定
================================ */
#outline .outline-related{
  max-width: 960px;          /* outline--top table と揃える */
  margin: 28px auto 0;
  padding-top: 22px;
  text-align: center;  
}

#outline .outline-related-title{
  font-size: 2.1rem;         /* 「少し大きめ」 */
  font-weight: 600;
  letter-spacing: .02em;
  margin-bottom: 12px;
}

#outline .outline-related-text{
  margin-bottom: 16px;
  line-height: 1.9;
  color: #303030;
}

#outline .outline-related-link{
  margin-bottom: 0;
}

/* ボタンに矢印を付与（お問い合わせと同じ雰囲気のまま） */
#outline .btn-contact-like--arrow::after{
  content: " →";
}

#outline .btn-contact-like:hover{
  background: #004a8c;  /* 少し濃いブルー */
  color: #eaf3ff;       /* ← 文字色を少し明るく */
}


/* SP微調整 */
@media screen and (max-width: 850px){
  #outline .outline-related{
    width: 100%;
    padding-top: 18px;
  }
  #outline .outline-related-title{
    font-size: 4.0vw;
  }
}
