@charset "UTF-8";

body {
  margin-top: 5px;
}

.mt80 { margin-top: 80px;}

/* =============================
   サブページ用:ページタイトル部
============================= */
.page-title {
    background: var(--main-bg-image) no-repeat center/cover;
    padding: 0px;
    text-align: center;
    color: var(--white);
    font-size: 2rem;
    display: block;
    height: 230px;
    line-height: 230px;
}
div.h1pagetitle,
.page-title h1{
    font-size: 2.5rem;
    font-weight: 800;
}

@media screen and (min-width: 901px) and (max-width: 1280px) {

  .header-spacer {
    height: 40px; 
    margin: 0;
    padding: 0;
  }

  .page-title {
    padding: 0px !important;
    display: block !important;
  }

}

/* ▼ 900px以下 */
@media screen and (max-width: 900px) {

  .header-spacer {
    height: 20px; 
    margin: 0;
    padding: 0;
  }

  .page-title {
    font-size: 1rem;
    padding: 0;
    display: block;
    height: 200px;
    line-height: 200px;
  }
  .page-title h1,
  div.h1pagetitle{
    font-size: 1.75rem !important;
  }

}

@media screen and (max-width: 768px) {

  .header-spacer {
        height: 10px;
        margin: 0;
        padding: 0;
    }

  }

@media screen and (max-width: 420px) {

  .page-title {
    font-size: 1rem;
    padding: 0;
    display: block;
    height: 180px;
    line-height: 180px;
  }

  .page-title h1,
  div.h1pagetitle {
    font-size: 1.25rem !important;
  }

}

/* =============================
   サブページ用:パンくずリスト部
============================= */
.page-main {
    margin-top: 35px;
}

.inner {
    margin: 0 auto;
    width: 1280px;
}

.page-main h2{
    text-align: center;
    margin-top: 50px;
    font-size: 1.625rem;
    line-height: 1.5;
}

.breadcrumb ol {
    display: flex;
    list-style: none;
    padding: 0;
    font-weight: 600;
    flex-wrap: wrap;
    align-items: center;
}

.breadcrumb ol li {
    position: relative;
    margin-right: 30px;
    margin-top: 0; 
    white-space: nowrap;
    font-size: 1rem; 
    line-height: 1.5; 
}

.breadcrumb ol li a {
    font-size: 1rem; 
    text-decoration: none;
    color: inherit;
}


.breadcrumb ol li::after {
    position: absolute;
    font-family: "Font Awesome 5 Free";
    content: '\f105';
    right: -20px;
    top: 50%; 
    transform: translateY(-50%); 
    font-size: 1rem;
    font-weight: 900; 
}

.breadcrumb ol li:last-child::after {
    display: none;
}

.breadcrumb ol li:last-child {
    white-space: normal; 
    margin-right: 0; 
}

/* --- タブレット（1024px以下） --- */
@media (max-width: 1024px) {

  .page-main h2 {
    font-size: 1.5rem; 
    margin-top: 40px;
  }

}

/* --- スマホ（768px以下） --- */
@media (max-width: 768px) {

  .page-main h2 {
    font-size: 1.25rem;
    margin-top: 35px;
    line-height: 1.6; 
  }
  
  .breadcrumb ol li {
    font-size: 0.875rem; 
  }

.breadcrumb ol li a {
    font-size: 0.875rem; 
  }

.breadcrumb ol li::after {
    font-size: 0.875rem;
  }

}

/* --- 超小型スマホ（480px以下） --- */
@media (max-width: 480px) {

  .page-main h2 {
    font-size: 1rem;
    margin-top: 30px;
    line-height: 1.7;
  }

}

/* =============================
   改行制御
============================= */
.sp-only-head {
  display: none;
}

@media (min-width: 641px) {

  .sp-only-head {
    display: none;
  }

}

@media (max-width: 640px) {

  .sp-only-head {
    display: block;
  }

  .mt80 { margin-top: 40px;}
}

/* =============================
   会社概要
============================= */

.company-block table{
    margin: 80px auto;
    width: 1080px;
    border-collapse: collapse;
    padding: 0;
}

.company-block table th{
    width: 20%;
    padding: 10px;
    text-align: left;
}

.company-block table td{
    width: 80%;
    padding: 10px;
}

.sp-only {
    display: none;
}


/* ▼ 1200px以下（大画面ノートPC） */
@media screen and (max-width: 1280px) {

    .inner {
        margin: 0 auto;
        width: 96%;
    }

    .company-block table{
        width: 90%;
    }

    .sp-only {
        display: none;
    }

}

/* ▼ 1024px以下（タブレット横） */
@media screen and (max-width: 1024px) {

    .inner {
        margin: 0 auto;
        width: 96%;
    }

    .sp-only {
        display: none;
    }

}

/* ▼ 768px以下（タブレット縦） */
@media screen and (max-width: 768px) {

    .inner {
        margin: 0 auto;
        width: 90%;
    }
    
    .company-block table{
        width: 90%;
        margin: 40px auto;
    }
    
    .company-block table th{
        width: 100%;
        display: block;
    }
    
    .company-block table td{
        width: 100%;
        display: block;
        padding-left: 2rem;
        box-sizing: border-box;
    }

    .sp-only {
        display: block;
    }

}

/* ▼ 480px以下（スマホ） */
@media screen and (max-width: 480px) {
  .page-main {
    margin-top: 32px;
  }

  .inner {
    margin: 0 auto;
    width: 96%;
  }

}

/* ▼ 360px以下（小型スマホ） */
@media screen and (max-width: 360px) {

}