@charset "UTF-8";
[data-define-width="site"].u-fullbleed{
  max-width: none;
  width: 100vw;
  margin-inline: calc(50% - 50vw);
  padding-inline: 0;
  display: block;
  overflow: visible; 
  isolation: isolate;
}
a:hover {
 opacity: 1; 
}

/* 画像をはみ出しなくフィットさせる */
.u-fullbleed > img{
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}
#news {
  background: #cccccc;
  color: #000000;
  margin: 0;
  padding: 0.5em 0;
}

#news h2 {
  font-size: clamp(1em, 1.1vw, 1.1em);
}

#news [data-arrangement] {
  --gap: clamp(1em, 2vw, 2em);
  grid-template: auto / min-content auto;
  align-items: center;
  gap: var(--gap);
}

#news [data-arrangement] > header {
  border-right: 1px solid #ffffff;
  white-space: nowrap;
  padding: 0 var(--gap) 0 0;
}

#news [data-composition="entries"] {
  gap: 0.5em;
}

#news [data-composition="entries"] > li {
  font-size: clamp(0.75em, 1vw, 1em);
  grid-template: auto / clamp(6em, 7vw, 7em) auto;
}

#intro-message {
  background: #ffffff;
  font-size: clamp(1em, 2vw, 1.75em);
  padding: clamp(4em, 8vw, 8em) 0;
}

#intro-message header.root h2 {
  font-weight: normal;
  font-size: clamp(1.5em, 4vw, 2em);
  margin: 0 0 1em 0;
  text-align: center;
  white-space: nowrap;
}

#intro-message h2 em {
  font-weight: 900;
}

#intro-message p {
  line-height: 2;
  word-wrap: break-word;
  overflow-wrap: break-word;
  word-break: keep-all;
  box-sizing: border-box;
}

#intro-message p:not(:last-child) {
  margin: 0 auto 1.75em 0;
}

/* ===== ヒーロー画像 ===== */
.hero{   position: relative;
  isolation: isolate;
  min-height: 56vh;
  display: grid;
  place-items: center;
  overflow: clip;}
.hero__bg{  position: absolute;
  inset: 0;
  z-index: -2;
  overflow: hidden;}
.hero__bg img{ position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); 
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--hero-focal, 50% 50%);
  filter: saturate(105%) contrast(105%);}

/* ===== 上段の白背景ブロック ===== */
.about-box{
  background:#fff; display:flex; margin-inline:auto; padding:100px 20px; justify-content:center;
}
@media (max-width:767px){
  .about-box{
    padding:50px 20px;
  }
}
.about-block{ width:1150px; display:flex; flex-direction:column; align-content:flex-start;
left: 70px; }

/* ===== レイヤー整列 ===== */
.page{ position:relative; z-index:1 }


/* ===== コンテナ／見出し ===== */
.sec-title{
  font-family:"Noto Sans JP"; font-weight:600; letter-spacing:.02em;
  margin:0 0 18px; font-size:3em; text-align:left;
}

.highlight {
  color: var(--accent, #009591);
}
.sec-lead{
  text-align:left; color:var(--ink-weak); font-size: 1.9em;
  width: auto;
  line-height: 1.8;
  margin-top: 10px;
}
@media (max-width:767px){
  .sec-title{ font-size:2.2em; } 
  .sec-lead { font-size: 1.5em; }
}

/* ===== カード（PC基準） ===== */
.card-list{
  display:grid;
  gap: clamp(28px, 10vw, 100px);
  margin-block: clamp(32px, 6vw, 96px);
}

.card-list{
  display:grid;
  gap: clamp(28px, 10vw, 100px);
  margin-block: clamp(32px, 6vw, 96px);
}

@media (max-width:767px){
  .card-list{
    margin-bottom: 70px;
  }
}
.card__text{
  width:min(100%,var(--lead-max));
  max-width:var(--lead-max);
  text-align:left;
  color:var(--ink-weak);
}

.card__eyebrow{
  display:inline-block; letter-spacing:2px;
  color:var(--accent,#7b8a91); border-radius:99px; margin-bottom:5px; font-size:20px;
}
.card__title{ font-weight: 700;
letter-spacing: .02em;
font-size: clamp(35px,4vw,50px);
margin-top: -20px;
margin-bottom: 13px;  }
.card__title .initial{ color:var(--initial,currentColor) }
.card__body{
 color:var(--ink-weak);font-size: 20px; }

@media (max-width:767px){
  .card__body{font-size: 16px; } 
}
.card__cta{
 margin-top: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .55em;
  border: 0;
  background: var(--ink);
  color: #fff;
  text-decoration: none;
  font-weight: 700;
  padding: 15px 14px;
  width: 270px;
  text-align: center; 
}
@media (max-width:767px){
  .card__cta{
    width: 100%;
  }
}
.card__cta:focus-visible{ outline:3px solid #000; outline-offset:3px }

.card-list .card:nth-child(1) .card__cta{
  background: linear-gradient(to left, #85c6c5, #009b9a);
}

.card-list .card:nth-child(2) .card__cta{
  background: linear-gradient(to left, #fabe00, #fddf8f);
}

.card-list .card:nth-child(3) .card__cta{
  background: linear-gradient(to left, #85c6c5, #009b9a);
}

.card-list .card:nth-child(4) .card__cta{
  background: linear-gradient(to left, #fabe00, #fddf8f);
}
.card-list .card:nth-child(5) .card__cta{
  background: linear-gradient(to left, #85c6c5, #009b9a);
}
.card-list .card:nth-child(6) .card__cta{
  background: linear-gradient(to left, #fabe00, #fddf8f);
}

/* ===== 画像＋カラー影板（安定積層） ===== */
.card__media{
  position:relative; width:530px;
  z-index:1;
  transform:none;
}

.card__img{
  width:530px; height:310px; object-fit:cover;
  box-shadow:0 10px 25px rgba(0,0,0,.12); border-radius:0;
  position:relative; z-index:1; 
}

/* ===== PCの交互配置 ===== */
@media (min-width:767px){
  .card{align-items: start; }

  /* 奇数：画像右（外へはみ出し） */
  .card:not(:nth-child(even)) .card__media{
    justify-self:end;
    margin-right: calc(-1 * var(--overhang));
    left: 8%;
  }

  /* 偶数：画像左（外へはみ出し） */
  .card:nth-child(even){
    grid-template-columns:auto 1fr;  /* 列を反転 */
  }
  .card:nth-child(even) .card__text{ order:2 }
  .card:nth-child(even) .card__media{
    order:1; justify-self:start;
    margin-left: calc(-1 * var(--overhang));
    right: 8%;
  }
}

/* ===== 1100px以下：詰まり防止・比率維持 ===== */
@media (max-width:1100px){
  .card__title{ margin-top: -25px;}
  .card__media{ width:min(48vw,530px); height: -webkit-fit-content;}
  .card__img{ width:100%; height:auto; aspect-ratio:530/310; object-fit:cover }
  .about-block{
    left: 0px;
    width: 1000px;
  }
}



/* 交互配置 */
@media (min-width:767px){
  .home .card-list .card:nth-child(even){
    grid-template-columns:auto 1fr;
  }
  .home .card-list .card:nth-child(even) .card__text{ order:2 ;left: 5px;}
  .home .card-list .card:nth-child(even) .card__media{
    order:1; justify-self:start;
    margin-left: calc(-1 * var(--overhang));
  }
  .home .card-list .card:not(:nth-child(even)) .card__media{
    justify-self:end;
    margin-right: calc(-1 * var(--overhang));
  }
}

/* ===== 色影（HOMEだけ） ===== */
/* 共通定義（必須） */
.home .card__media::after{
  content:"";
  position:absolute;
  inset:0;
  background: var(--accent, #009591);
  opacity:.3;
  z-index:0;
  transform: translate(25px, 25px); /* 既定 */
  pointer-events: none;
}

@media (min-width:767px){
  .home .card:nth-child(6n+1) .card__media::after,
  .home .card:nth-child(6n+3) .card__media::after,
  .home .card:nth-child(6n+5) .card__media::after{
    transform: translate(-25px, 25px);
  }
  .home .card:nth-child(6n+2) .card__media::after,
  .home .card:nth-child(6n+4) .card__media::after,
  .home .card:nth-child(6n+6) .card__media::after{
    transform: translate(25px, 25px);
  }
}

/* CTAの色分け（必要なら） */
.home .card-list .card:nth-child(1) .card__cta{ background: linear-gradient(to left, #85c6c5, #009b9a);margin-bottom: 10px; }
.home .card-list .card:nth-child(2) .card__cta{ background: linear-gradient(to left, #fabe00, #fddf8f);margin-bottom: 10px; }
.home .card-list .card:nth-child(3) .card__cta{ background: linear-gradient(to left, #85c6c5, #009b9a); margin-bottom: 10px;}
.home .card-list .card:nth-child(4) .card__cta{ background: linear-gradient(to left, #fabe00, #fddf8f); margin-bottom: 10px;}
.home .card-list .card:nth-child(5) .card__cta{ background: linear-gradient(to left, #85c6c5, #009b9a); margin-bottom: 10px;}
.home .card-list .card:nth-child(6) .card__cta{ background: linear-gradient(to left, #fabe00, #fddf8f); margin-bottom: 10px;}

/* 文字調整 */
.CAREER{
line-height: 1.1;
margin-top: -15px;
}
@media (max-width:767px){
.CAREER{
        margin-bottom: 10px!important;}}
/* ===== スマホ ===== */
@media (max-width:767px){
  .card{
    grid-template-columns:1fr;
    height:auto;
    padding:32px 24px;
    gap:22px;
    margin:0 !important;
  }
  .card__title{ margin-top:-10px;margin-bottom: 0px; }
  .card__text{ order:1 }
  .card__media{ order:2; width:100%; margin:0; justify-self:stretch; }
  .card__media::after{ transform: translate(9px,9px)!important; } 
  .card__img{ width:100%; height:auto; aspect-ratio:530/310; object-fit:cover }
  .card:nth-child(odd) .card__text {
    padding-right: 0%;
  }
  .card:nth-child(even) .card__text {
    padding-left: 0%;
  }
}