.kaso-top{
      overflow: hidden;
      position: relative;
  height: 430px;
}
.kaso-top2{
      overflow: hidden;
      position: relative;
  height: 430px;
}
.news-cat{
  padding: 0px 5px;
  color: white;
  font-size: 11px;
  background-color: var(--brand-blue);
}
.news-title{
  margin-left: 1em;
  display: flex;
  align-items: center;
  gap: 8px; /* カテゴリとタイトルの間隔 */
}

/* --- カテゴリ --- */
.news-cat a {
  transition: opacity 0.3s ease;
}

.news-cat a:hover {
  opacity: 0.8;
}

/* --- タイトル --- */
.news-title2 {
  position: relative;
  display: inline-block;
  text-decoration: none;

  padding-bottom: 3px; /* 線との距離 */
}

/* 初期状態では線の幅0 */
.news-title2::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 1px;
  background-color: currentColor; /* 文字色と同じ */
  transition: width 0.3s ease;
}

/* hoverで左から右へラインを伸ばす */
.news-title2:hover::after {
  width: 100%;
}

.kaso-top-w {
  z-index: 2500;
  position: absolute;
  left:120px;
  top:205px;
}
.kaso-top-w span:first-child{
  font-weight: bold;
  display: block;
  font-size: 45px;
}
.kaso-top-w span:nth-child(2){
    font-weight: 900;
    margin-top: 0.7em;
      display: block;
  font-size: 18px;
}
.contact .cont-area {
    background-color:inherit;
}
.cont-area{
  margin-top: 60px;
}
.privacy .cont-area{
  margin-top: 80px;
}
.top-left-triangle-css{
  position: absolute;
  top: 0;
  left: 0;
  width: 931px;
  height: 1145px;
  z-index: -1;
  pointer-events: none;
  background-color: white; /* グレー */
  /* 左上を直角にする三角形に切り抜く */
  clip-path: polygon(0 0, 100% 0, 0 100%);
}
.doui-box .wpcf7-list-item {
    display: inline-block;
    margin: 0 ;
}
.header-inner2.migi {
  top: 0;
}
.fa-home{
  color: #0B2E74;
}
.kaso-box{
  max-width: 1100px;
  margin: 100px auto 0;
}
.nav-links-cat{
   display: flex;
  justify-content: flex-end;
}
.back-to-archive-cat{
  margin-top: 20px;
  display: inline-block;
  padding: 5px 10px;
  font-size: 12px;
  margin-left: auto;
  background-color: var(--brand-blue);
  color: #fff;
  border-radius: 4px;
  text-decoration: none;
  transition: background-color 0.3s ease;
}

.back-to-archive-cat {
  background-color:#60b6de;
}

.back-to-archive-cat:hover {
  background-color: #727171;
}

.pan{
  padding: 20px 50px;
  font-size: 13px;
  border-bottom: 1px solid #BFDFF1;
}
.pan a {
  position: relative;
  display: inline-block;
  text-decoration: none;
  color: #000; /* 任意 */
  padding-bottom: 4px; /* 線との間隔を調整 */
}


/* 初期状態では線は幅0 */
.pan a::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 1px; /* 線の太さ */
  background-color: #000; /* 線の色 */
  transition: width 0.3s ease;
}

/* hover時に線を左→右へ伸ばす */
.pan a:hover::after {
  width: 100%;
}


.kaso2.pan{
  position: absolute;
  left: 50px;
  padding:0px;
  font-size: 13px;
  border-bottom: none;
}
.kaso-top-2{
  box-sizing: border-box;
  overflow: hidden;
  position: relative;
}
.kaso-top-2-t {
  
  position: absolute;
  left: 55px;
  top: 50px;

  font-size: 7.6rem;
  font-weight: bold;
  color: #0B2E74;

  display: inline-block;
  position: relative; /* 擬似要素の基準 */
}

.recruit .kaso-top-2-t::after {
    content: "";
    position: absolute;
    width: 545px;
    left: -55px;
    bottom: 0;
    height: 46px;
    background-color: #e7e7e7;
    z-index: -1;
}
/* 文字下の四角ライン */
.kaso-top-2-t::after {
  content: "";
  position: absolute;
  width: 545px;
  left: -55px;  /* 左に少し伸ばす */

  bottom: 0;    /* 文字下に配置 */
  height: 46px; /* 四角の高さ */
  background-color: #DEEEF8;
  z-index: -1;  /* 文字の下に表示 */
  
}
.office .kaso-top-2-t::after {
  content: "";
  position: absolute;
  width: 1057px;
  left: -55px;  /* 左に少し伸ばす */

  bottom: 0;    /* 文字下に配置 */
  height: 46px; /* 四角の高さ */
  background-color: #F5E2E2;
  z-index: -1;  /* 文字の下に表示 */
}
.kaso-top-w1{
  margin-bottom: 1em;
  font-size: 4rem;
  font-weight: bold;
}
.kaso-top-w2{
      line-height: 2.5em;
    font-size: 2.1rem;
}
  


@media screen and (max-width: 768px) {
  
    .nav-links-cat {
        margin: 0 auto;
        width: calc(100% - 20px);
    }
.top-left-triangle-css {
    width: 293px;
    height: 377px;
  }
.kaso-top2 {
    height: 283px;
}

.kaso-top {
    height: 280px;
}
.kaso-top-w span:first-child {
    font-size: 28px;
}
.kaso-top-w span:nth-child(2) {
    font-size: 11px;
}
.kaso-top-w {
    left: 20px;
    top: 131px;
}
.kaso2.pan {
    left: 20px;
  }
.pan {
    padding: 10px 20px;
    font-size: 12px;
}

.kaso-top-2-t {
    left: 20px;
    font-size: 3.2rem;
  }
  .recruit .kaso-top-2-t::after {
    width: 239px;
    height: 20px;
  }
  .kaso-top-2-t::after {
    width: 239px;
    height: 20px;
  }
    .office .kaso-top-2-t::after{
      width: 480px;
      height: 20px;
    }
  .kaso-top-w1 {
    font-size: 2.5rem;
  }
  .recruit .kaso-top-w1 {
      font-size: 2.5rem;
      letter-spacing: -1px;
    }
  .kaso-box {
     width: calc(100% - 40px); /* 左右20pxずつの余白を確保 */
    margin: 100px auto 0;
}
.kaso-top-w2 {
    font-size: 1.3rem;
    line-height: 2em;
}
 .nobr2{

    display: inline-block;   /* ブロック特性を維持しつつ横並び */

 }
    .kaso-top-w2 p{
  margin-bottom: 0px;
    }

    @media screen and (max-width: 380px) {
          .office .kaso-top-2-t::after{
            width: 320px;
            height: 20px;
          }
      .office .kaso-top-2-t::before {
      content: "";
    position: absolute;
width: 205px;
        left: -55px;
        bottom: 47px;
    height: 20px;
    background-color: #F5E2E2;
    z-index: -1;
    }
  }
    

}
