@charset "UTF-8";

.blur-word {
    display: inline-block;
    opacity: 0;
    filter: blur(10px);
    animation: blurIn 2s ease forwards;
}

body.home .blur-word {
	display: block;
}

@keyframes blurIn {
    to {
        opacity: 1;
        filter: blur(0px);
    }
}

.fadein {
    opacity: 0;
    transform: translate(0, 50px);
    transition: all 900ms;
}

.fadein.short {
    opacity: 0;
    transform: translate(0, 20px);
    transition: all 900ms;
}

.fadein.scrollin {
    opacity: 1;
    transform: translate(0, 0);
}

.fadein.delay-1 {
    transition-delay: 0.2s;
}
.fadein.delay-2 {
    transition-delay: 0.4s;
}
.fadein.delay-3 {
    transition-delay: 0.6s;
}

/* ==========================================================================
   基本設定
   ========================================================================== */

:root {
  /* カラー定義 */
  --color-primary: #036eb8;
  --color-primary-light: #0886dd;
  --color-orange: #f39700;
  --color-text: #070707;
  --color-white: #ffffff;
  --color-gray: #6b7280;
  --color-gray-bg: #F9F9F9;
  --color-border: #e6e3df;
  --color-breadcrumb-bg: #f9f9f8;
  --color-breadcrumb-current: #868c91;
  --color-border-sp: #7ba5d0;
  --color-footer-sub: #1a3859;
  --color-copyright-pc: #6487ad;
  --color-copyright-sp: #636060;

  /* フォントサイズ */
  --font-size-base: 1rem; /* 16px */
}

html {
  font-size: 16px;
}

body {
  font-family: YakuHanJP, "Google Sans Flex", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  line-height: 1.8;
  color: var(--color-text);
	touch-action: manipulation;
}

a {
  color: var(--color-text);
  text-decoration: none;
}

a.blank {
	position: relative;
	transition: transform 0.3s ease;
	color: var(--color-primary);
}

a.blank:hover {
	text-decoration: underline
}

a.blank:before {
	content: '';
	position: absolute;
	-webkit-mask: url(../images/ico_blank.svg) 0 0 no-repeat;
  mask: url(../images/ico_blank.svg) 0 0 no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
      background-color: var(--color-primary);
    width: 14px;
    height: 14px;
    transition: transform 0.3s ease;
    right: -20px;
    top: 3px;
}

.pc_only{
	display: block;
}

.sp_only{
	display: none;
}

@media (max-width: 767px) {
	.pc_only{
	display: none;
}

.sp_only{
	display: block;
}
}


/* ==========================================================================
   ユーティリティ
   ========================================================================== */

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ==========================================================================
   ヘッダー
   ========================================================================== */

.l-header {
  position: relative;
  background-color: var(--color-white);
}

/* 上部の青い線 */
.l-header::before {
  content: "";
  display: block;
  width: 100%;
  height: 4px;
  background-color: var(--color-primary);
}

.l-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 75px;
}

/* ------------------
   ロゴ
   ------------------ */

.l-header__logo {
  display: block;
  flex-shrink: 0;
  width: 212px;
  height: 31px;
  margin-left: 42px;
  background: url(../images/logo.svg) no-repeat center / contain;
}

/* ------------------
   PC/タブレット用ナビゲーション
   ------------------ */

.l-header__nav {
  display: flex;
  align-items: center;
  margin-left: auto;
}

/* グローバルナビゲーション */
.l-header__gnav {
  display: flex;
  align-items: center;
  gap: 50px;
  margin-right: 20px;
}

.l-header__gnav-item {
  position: relative;
}

.l-header__gnav-link {
  display: block;
  font-size: 1rem;
  font-weight: 500;
  transition: color 0.3s ease;
}

.l-header__gnav-link:hover {
  color: var(--color-primary);
}

/* 現在地表示 *
.l-header__gnav-link.is-current {
  color: var(--color-primary);
}

.l-header__gnav-link.is-current::before {
  content: "";
  position: absolute;
  top: -5px;
  left: 0;
  width: 22px;
  height: 4px;
  background: url(../images/gnavi_bar.svg) no-repeat center / contain;
}*/

body.home ul.l-header__gnav li:nth-child(1) .l-header__gnav-link {
  color: var(--color-primary);
}

body.home ul.l-header__gnav li:nth-child(1) .l-header__gnav-link::before {
  content: "";
  position: absolute;
  top: -5px;
  left: 0;
  width: 22px;
  height: 4px;
  background: url(../images/gnavi_bar.svg) no-repeat center / contain;
}

body.about ul.l-header__gnav li:nth-child(2) .l-header__gnav-link {
  color: var(--color-primary);
}

body.about ul.l-header__gnav li:nth-child(2) .l-header__gnav-link::before {
  content: "";
  position: absolute;
  top: -5px;
  left: 0;
  width: 22px;
  height: 4px;
  background: url(../images/gnavi_bar.svg) no-repeat center / contain;
}

body.service ul.l-header__gnav li:nth-child(3) .l-header__gnav-link {
  color: var(--color-primary);
}

body.service ul.l-header__gnav li:nth-child(3) .l-header__gnav-link::before {
  content: "";
  position: absolute;
  top: -5px;
  left: 0;
  width: 22px;
  height: 4px;
  background: url(../images/gnavi_bar.svg) no-repeat center / contain;
}

body.news ul.l-header__gnav li:nth-child(4) .l-header__gnav-link {
  color: var(--color-primary);
}

body.news ul.l-header__gnav li:nth-child(4) .l-header__gnav-link::before {
  content: "";
  position: absolute;
  top: -5px;
  left: 0;
  width: 22px;
  height: 4px;
  background: url(../images/gnavi_bar.svg) no-repeat center / contain;
}

body.recruit ul.l-header__gnav li:nth-child(5) .l-header__gnav-link {
  color: var(--color-primary);
}

body.recruit ul.l-header__gnav li:nth-child(5) .l-header__gnav-link::before {
  content: "";
  position: absolute;
  top: -5px;
  left: 0;
  width: 22px;
  height: 4px;
  background: url(../images/gnavi_bar.svg) no-repeat center / contain;
}

/* ------------------
   ヘッダーボタン
   ------------------ */

.l-header__buttons {
  display: flex;
  margin-left: 50px;
}

.l-header__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 166px;
  height: 75px;
  color: var(--color-white);
  font-weight: 500;
  transition: opacity 0.3s ease;
}

.l-header__btn-text {
  display: block;
	z-index: 1;
}

.l-header__btn-icon {
  display: block;
  flex-shrink: 0;
}

/* Contactボタン */
.l-header__btn--contact {
	position: relative;
  background-color: var(--color-orange);
  font-size: 1rem;
	transition: background .2s cubic-bezier(0.33, 1, 0.68, 1);
	overflow: hidden;
}

.l-header__btn--contact::before {
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    background: #ffbd50;
    -webkit-transition: 1.0s cubic-bezier(0.475, 0.425, 0, 0.995);
    transition: 1.0s cubic-bezier(0.475, 0.425, 0, 0.995);
    right: auto;
    right: -100px;
    bottom: -100px;
    transform: rotate(35deg);
}

@media (hover: hover) and (pointer: fine) {
    .l-header__btn--contact:hover:before {
        width: 500px;
        height: 500px;
        opacity: 1;
    }
}


.l-header__btn-icon--arrow {
  -webkit-mask: url(../images/arrow_1.svg) 0 0 no-repeat;
  mask: url(../images/arrow_1.svg) 0 0 no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  background-color: var(--color-white);
  width: 6px;
  height: 12px;
  transition: transform 0.3s ease;
}

/* SIC GROUPボタン */
.l-header__btn--group {
	position: relative;
  background-color: var(--color-primary);
  font-size: 0.9375rem;
	transition: background .2s cubic-bezier(0.33, 1, 0.68, 1);
	overflow: hidden;
}

.l-header__btn--group::before {
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    background: #3692d2;
    -webkit-transition: 1.0s cubic-bezier(0.475, 0.425, 0, 0.995);
    transition: 1.0s cubic-bezier(0.475, 0.425, 0, 0.995);
    right: auto;
    right: -100px;
    bottom: -100px;
    transform: rotate(35deg);
}

@media (hover: hover) and (pointer: fine) {
    .l-header__btn--group:hover:before {
        width: 500px;
        height: 500px;
        opacity: 1;
    }
}

.l-header__btn-icon--blank {
  -webkit-mask: url(../images/ico_blank.svg) 0 0 no-repeat;
  mask: url(../images/ico_blank.svg) 0 0 no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  background-color: var(--color-white);
  width: 14px;
  height: 14px;
  transition: transform 0.3s ease;
}

/* ------------------
   スマホ用ボタン（PC/タブレットでは非表示）
   ------------------ */

.l-header__sp-buttons {
  display: none;
}

/* ==========================================================================
   スマホメニュー（PC/タブレットでは非表示）
   ========================================================================== */

.l-sp-menu {
  display: none;
}

/* ==========================================================================
   ヘッダー レスポンシブ対応
   ========================================================================== */

/* ------------------
   1200px以下: ロゴとナビの間の余白が縮まる
   ------------------ */

@media (max-width: 1200px) {
  .l-header__nav {
    margin-left: 20px;
  }
}

/* ------------------
   1199px以下～1010px: ナビテキスト間隔 50px→20px
   ------------------ */

@media (max-width: 1199px) {
  .l-header__gnav {
    gap: clamp(18px, calc(18px + (50 - 18) * ((100vw - 1010px) / (1199 - 1010))), 50px);
    margin-right: 0px;
  }
}

/* ------------------
   1010px以下: ナビテキスト間隔20px固定、ボタン幅が縮まる
   ------------------ */

@media (max-width: 1010px) {
  .l-header__gnav {
    gap: 18px;
    margin-right: 20px;
  }

  .l-header__buttons {
    margin-left: 20px;
  }

  .l-header__btn {
    width: clamp(86px, calc(86px + (166 - 86) * ((100vw - 850px) / (1010 - 850))), 166px);
  }
}

/* ------------------
   930px以下: ボタン幅がさらに縮まる
   ------------------ */

@media (max-width: 930px) {
  .l-header__btn {
    width: clamp(86px, calc(86px + (120 - 86) * ((100vw - 850px) / (930 - 850))), 120px);
  }

  .l-header__btn {
    flex-direction: column;
    gap: 4px;
    width: 86px;
  }

  .l-header__btn--contact {
    font-size: clamp(0.875rem, calc(0.875rem + (1 - 0.875) * ((100vw - 768px) / (850 - 768))), 1rem);
  }

  .l-header__btn--group {
    font-size: clamp(0.75rem, calc(0.75rem + (0.875 - 0.75) * ((100vw - 768px) / (850 - 768))), 0.875rem);
  }

  /* ナビフォントサイズ縮小 */
  .l-header__gnav-link {
    font-size: clamp(0.9375rem, calc(0.9375rem + (1 - 0.9375) * ((100vw - 768px) / (850 - 768))), 1rem);
  }

  /* ロゴサイズ縮小 */
  .l-header__logo {
    width: clamp(184px, calc(184px + (212 - 184) * ((100vw - 768px) / (850 - 768))), 212px);
    height: auto;
    aspect-ratio: 212 / 31;
    margin-left: clamp(15px, calc(15px + (42 - 15) * ((100vw - 768px) / (850 - 768))), 42px);
  }
}

/* ------------------
   767px以下: スマホ表示
   ------------------ */

@media (max-width: 767px) {
  /* 上部の青い線 */
  .l-header::before {
    height: 3px;
  }

  .l-header__inner {
    height: 55px;
  }

  /* ロゴ */
  .l-header__logo {
    width: 173px;
    height: 24px;
    margin-left: 15px;
  }

  /* PC用ナビ非表示 */
  .l-header__nav {
    display: none;
  }

  /* スマホ用ボタン表示 */
  .l-header__sp-buttons {
    display: flex;
    margin-left: auto;
  }

  /* スマホ用お問い合わせボタン */
  .l-header__sp-contact {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 55px;
    background-color: var(--color-orange);
  }

  .l-header__sp-contact-icon {
    display: block;
    width: 25px;
    height: 19px;
    -webkit-mask: url(../images/ico_mail.svg) 0 0 no-repeat;
    mask: url(../images/ico_mail.svg) 0 0 no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
    background-color: var(--color-white);
  }

  /* ハンバーガーメニューボタン */
  .l-header__hamburger {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 56px;
    height: 55px;
    background-color: var(--color-primary);
    border: none;
    cursor: pointer;
  }

  .l-header__hamburger-line {
    display: block;
    height: 2px;
    background-color: var(--color-white);
    transition: transform 0.3s ease, opacity 0.3s ease;
  }

  .l-header__hamburger-line--top {
    width: 18px;
    margin-left: 5px;
  }

  .l-header__hamburger-line--bottom {
    width: 23px;
  }

  /* ハンバーガーメニュー開いた時 */
  .l-header__hamburger.is-open .l-header__hamburger-line--top {
    width: 26px;
    transform: translateY(5px) rotate(45deg);
  }

  .l-header__hamburger.is-open .l-header__hamburger-line--bottom {
    width: 26px;
    transform: translateY(-5px) rotate(-45deg);
  }

  /* ==========================================================================
     スマホメニュー
     ========================================================================== */

  .l-sp-menu {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
  }

  .l-sp-menu.is-open {
    opacity: 1;
    visibility: visible;
  }

  .l-sp-menu__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    backdrop-filter: blur(5px);
    background: rgba(3, 110, 184, 0.8);
  }

  .l-sp-menu__content {
    position: relative;
    z-index: 1;
  }

  /* メニューヘッダー */
  .l-sp-menu__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 58px;
    padding: 0 15px 0 20px;
  }

  .l-sp-menu__group-link {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--color-white);
    font-size: 1rem;
    font-weight: 500;
  }

  .l-sp-menu__group-icon {
    display: block;
    width: 14px;
    height: 14px;
    -webkit-mask: url(../images/ico_blank.svg) 0 0 no-repeat;
    mask: url(../images/ico_blank.svg) 0 0 no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
    background-color: var(--color-white);
  }

  /* 閉じるボタン */
  .l-sp-menu__close {
    position: relative;
    width: 26px;
    height: 26px;
    background: none;
    border: none;
    cursor: pointer;
  }

  .l-sp-menu__close-line {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 26px;
    height: 2px;
    background-color: var(--color-white);
  }

  .l-sp-menu__close-line--1 {
    transform: translate(-50%, -50%) rotate(45deg);
  }

  .l-sp-menu__close-line--2 {
    transform: translate(-50%, -50%) rotate(-45deg);
  }

  /* メニューナビゲーション */
  .l-sp-menu__nav {
    padding: 0 20px;
  }

  .l-sp-menu__list {
    border-top: 1px solid var(--color-border-sp);
  }

  .l-sp-menu__item {
    border-bottom: 1px solid var(--color-border-sp);
  }

  .l-sp-menu__link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 70px;
    color: var(--color-white);
  }

  .l-sp-menu__link-inner {
    display: flex;
    flex-direction: column;
  }

  .l-sp-menu__link-en {
    font-family: "Google Sans Flex", sans-serif;
    font-size: 1.875rem;
    font-weight: 500;
    line-height: 1.2;
  }

  .l-sp-menu__link-ja {
    font-size: 0.8125rem;
    color: var(--color-orange);
    line-height: 1.4;
  }

  .l-sp-menu__link-arrow {
    display: block;
    width: 8px;
    height: 15px;
    -webkit-mask: url(../images/arrow_1.svg) 0 0 no-repeat;
    mask: url(../images/arrow_1.svg) 0 0 no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
    background-color: var(--color-white);
  }
}

/* ==========================================================================
   レイアウト - 大枠エリア（確認用背景色）
   ========================================================================== */

/* ヒーローセクションエリア */
.l-hero {
  _background-color: var(--color-gray);
}

/* コンテンツエリア */
.l-contents {
  background-color: var(--color-breadcrumb-bg);
}


/* コンテンツエリア（グレー背景） */
.l-contents--gray {
  background-color: var(--color-gray-bg);
}

/* ==========================================================================
   コンテンツエリア
   ========================================================================== */

.l-contents--gray .l-contents--gray__inner {
	max-width:1160px;
	margin:0 auto;
	padding: 100px 0 100px;
    display: flow-root;
}

body.bottom .l-contents--gray .l-contents--gray__inner {
	padding: 90px 20px 0;
}

body.service .l-contents--gray .l-contents--gray__inner {
	padding: 100px 20px 0;
}

.l-contents--gray .l-contents--gray__inner section,
.l-contents--gray .l-contents--gray__inner article{
	margin-bottom:120px;
}

body.service .l-contents--gray .l-contents--gray__inner section{
	margin-bottom:80px;
}

.l-contents--gray .l-contents--gray__inner section .test_img{
	width:100%;
}

/* ==========================================================================
   テーブル
   ========================================================================== */

.list_title {
    position: relative;
    width: 100%;
    font-size: 1.25rem;
    font-weight: bold;
    border-bottom: 1px solid #e7e7e7;
    padding-bottom: 20px;
    margin-bottom: 20px;
    display: flex;
}

.list_title::after {
    position: absolute;
    bottom: 0;
    left: 0;
    content: "";
    vertical-align: bottom;
    width: 185px;
    border-bottom: 1px solid #231815;
}

.list_title--type2 {
    position: relative;
    width: 100%;
    font-size: 1rem;
    font-weight: bold;
    border-bottom: 1px solid #e7e7e7;
    padding-bottom: 20px;
    margin-bottom: 20px;
    display: flex;
}

.list_title--type2::after {
    position: absolute;
    bottom: 0;
    left: 0;
    content: "";
    vertical-align: bottom;
    width: 185px;
    border-bottom: 1px solid #231815;
}

.list_title h3 {
    font-weight: bold;
}

.list_title span {
    margin-left: auto;
    font-weight: normal;
    font-size: 0.9375rem;
}

.list_table dl {
    display: table;
    width: 100%;
}

.list_table dl dt {
    display: table-cell;
    width: 185px;
    border-bottom: 1px solid #231815;
    padding: 25px 0;
    font-size: 1rem;
    line-height: 1.6;
}

.list_table dl dt.dtsp {
    width: 70px;
    border-bottom: none;
}

.list_table dl dt {
    display: table-cell;
    width: 185px;
    border-bottom: 1px solid #231815;
    padding: 25px 0;
    font-size: 1rem;
    line-height: 1.6;
}

.list_table dl:last-child dt,
.list_table dl:last-child dd{
	border-bottom:none;
}

.list_table dl dd {
    display: table-cell;
    border-bottom: 1px solid #e7e7e7;
    padding: 25px 0;
    font-size: 1rem;
    line-height: 1.6;
}

.list_table dl dd .mapArea{
	display: flex;
	align-items: center;
	gap:30px;
	margin-top:20px;
}

.list_table dl dd .mapArea div{
	width:50%;
}

.list_table dl dd .mapArea div iframe{
	width:100%;
	height:290px;
}


.list_table dl dd .dd_table {
    width: 270px;
    display: table;
}

.list_table dl dd .dd_th {
    display: table-cell;
    padding-bottom: 5px;
}

.list_table dl dd .dd_table .dd_td {
    width: 130px;
    display: table-cell;
    text-align: left;
    padding-bottom: 5px;
}

.list_table dl dd a {
	position: relative;
transition: color 0.3s ease;
}

.list_table dl dd a:hover {
	color:var(--color-primary);
}

.list_table dl dd a:before {
	content: '';
	position: absolute;
    text-decoration: underline;
    width: 14px;
    height: 14px;
    -webkit-mask: url(../images/ico_blank.svg) 0 0 no-repeat;
    mask: url(../images/ico_blank.svg) 0 0 no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
    background-color: var(--color-text);
	top: 3px;
    right: -22px;
}

.list_table dl dd .pmark a:before{
	content: none;
}

.list_table dl dd .pmark{
	display: flex;
	gap:20px;
	align-items: flex-start;
}

.history-section .list_table dl dd .dd_table {
    width: 100%;
    display: table;
}


.history-section .list_table dl dd .his_ph {
    float: right;
    margin: 0 0 30px 30px;
    width: 200px;
}

.history-section .list_table dl dd .his_ph img{
	border-radius: 4px;
}

.history-section .list_table dl dd.ph .dd_table {
    width: auto;
    display: table;
}

.history-section .list_table dl dd .dd_th {
    display: table-cell;
    padding-bottom: 15px;
    text-align: right;
    width: 50px;
    font-weight: bold;
}

.history-section .list_table dl dd .dd_td {
    display: table-cell;
    text-align: left;
    padding: 0 0 15px 0px;
	width:100%;
}


.history-section .list_table dl dd .his_ph img {
    margin-bottom: 5px;
    display: block;
}

.history-section .list_table dl dd .his_ph span {
    font-size: 0.875rem;
    line-height: 1.3;
    display: block;
    margin-bottom: 15px;
}


/* ==========================================================================
   経営方針ボックス - About
   ========================================================================== */

.p-policy {
  display: flex;
  gap: 30px;
  margin-top: 40px;
}

.p-policy__item {
  flex: 1;
  background-color: var(--color-white);
  border: 1px solid #dddddd;
  border-radius: 6px;
  padding: 40px;
}

.p-policy__title {
  position: relative;
  font-size: 1.4375rem;
  font-weight: bold;
  margin-bottom: 25px;
  padding-top: 25px;
}

.p-policy__title::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 67px;
  height: 4px;
  background: url(../images/txt_bar_l.svg) no-repeat center / contain;
}

.p-policy__content {
  display: block;
}

.p-policy__image {
  margin-bottom: 25px;
}

.p-policy__image img {
  width: 100%;
  height: auto;
  display: block;
	border-radius: 4px;
}

.p-policy__text {
  font-size: 1rem;
  line-height: 1.8;
}

/* ==========================================================================
   サービスヘッダー（SEサービス見出し）
   ========================================================================== */

.p-service-header {
    text-align: center;
    _padding: 120px 0 100px;
}

/* SEサービス */
.p-service-header__title {
    font-size: 3.125rem;
    font-weight: 700;
    background: linear-gradient(90deg, var(--color-primary) 0%, var(--color-primary-light) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 10px;
}

.p-service-header__title span{
    font-family: "Google Sans Flex", sans-serif;
	font-weight: 600;
}


/* 開発現場を支えるSEの技術支援 */
.p-service-header__subtitle {
    font-size: 1.6875rem;
    font-weight: 700;
    color: var(--color-text);
    display: inline-block;
    padding-bottom: 3px;
    border-bottom: 3px solid var(--color-orange);
    margin-bottom: 20px;
	    line-height: 1;
}

/* アプリケーション開発や～ */
.p-service-header__desc {
    font-size: 1.125rem;
    color: var(--color-text);
}


/* ==========================================================================
   選ばれる理由ボックス - Service
   ========================================================================== */

.p-reason {
  display: flex;
  gap: 30px;
  margin-top: 40px;
}

.p-reason__item {
  flex: 1;
  background-color: var(--color-white);
  border: 1px solid #dddddd;
  border-radius: 6px;
  padding: 40px;
}

.p-reason__title {
  position: relative;
  font-size: 1.125rem;
  font-weight: 500;
  margin-bottom: 25px;
  padding-top: 25px;
	line-height: 1.5;
}

.p-reason__title::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 67px;
  height: 4px;
  background: url(../images/txt_bar_l.svg) no-repeat center / contain;
}

.p-reason__content {
  display: block;
}

.p-reason__image {
  margin-bottom: 25px;
}

.p-reason__image img {
  width: 100%;
  height: auto;
  display: block;
	border-radius: 4px;
}

.p-reason__text {
  font-size: 1rem;
  line-height: 1.8;
}

ul.p-reason__text {
  color: var(--color-primary); /* マーカーの色 */
	padding-left:20px;
}

ul.p-reason__text li {
  list-style-type:disc;
  position: relative;
	margin-bottom:15px;
	line-height: 1.3
}

ul.p-reason__text li:last-child {
	margin-bottom:0px;
}

ul.p-reason__text li span {
  color: var(--color-text); /* テキストの色 */
}

/* ==========================================================================
   このようなお悩みを解決します - Service
   ========================================================================== */

.p-assignment {
  display: flex;
  gap: 30px;
  margin-top: 40px;
}

.p-assignment__item {
  flex: 1;
  background-color: var(--color-white);
  border: 1px solid #dddddd;
  border-radius: 6px;
  padding: 40px;
}

.p-assignment__content {
  display: flex;
	    align-items: center;
    gap: 20px;
}

.p-assignment__image {
  /*margin-bottom: 25px;*/
}

.p-assignment__image img {
  width: 100%;
  height: auto;
  display: block;
}

.p-assignment__text {
  font-size: 1rem;
  line-height: 1.8;
	width: calc(100% - 94px);
}

/* ==========================================================================
   実績 - Service
   ========================================================================== */

.p-project {
  display: flex;
  gap: 30px;
  margin-top: 40px;
}

.p-project__item {
  flex: 1;
  background-color: var(--color-white);
  border: 1px solid #dddddd;
  border-radius: 6px;
  padding: 40px;
}

.p-project__content {
  display: block;
}

.p-project__title {
	font-weight: 800;
    font-size: 1.125rem;
  }

.p-project__text {
  font-size: 1rem;
  line-height: 1.8;
}

/* ==========================================================================
   コンテンツエリア レスポンシブ対応
   ========================================================================== */

/* ------------------
   1200px以下: 各要素がclampで縮小
   ------------------ */

@media (max-width: 1200px) {
	
	.l-contents--gray .l-contents--gray__inner,
	body.service .l-contents--gray .l-contents--gray__inner{
	max-width:1160px;
	margin:0 auto;
		_padding:100px 20px;
		padding: clamp(60px, calc(60px + (140 - 60) * ((100vw - 767px) / (1200 - 767))), 140px) 20px;
}
	
	.l-contents--gray .l-contents--gray__inner section,
.l-contents--gray .l-contents--gray__inner article{
	margin-bottom:80px;
}

  /* 経営方針ボックス レスポンシブ */
  .p-policy {
    gap: clamp(15px, calc(15px + (30 - 15) * ((100vw - 767px) / (1200 - 767))), 30px);
  }

  .p-policy__item {
    padding: clamp(20px, calc(20px + (40 - 20) * ((100vw - 767px) / (1200 - 767))), 40px);
  }

  /* h3見出し: 1200px→900pxで23px→16px、900px以下は16px固定 */
  .p-policy__title {
    font-size: clamp(16px, calc(16px + (23 - 16) * ((100vw - 900px) / (1200 - 900))), 23px);
    margin-bottom: clamp(15px, calc(15px + (25 - 15) * ((100vw - 767px) / (1200 - 767))), 25px);
    padding-top: clamp(15px, calc(15px + (25 - 15) * ((100vw - 767px) / (1200 - 767))), 25px);
  }

  .p-policy__title::before {
    width: clamp(40px, calc(40px + (67 - 40) * ((100vw - 767px) / (1200 - 767))), 67px);
    height: clamp(3px, calc(3px + (4 - 3) * ((100vw - 767px) / (1200 - 767))), 4px);
  }

  .p-policy__image {
    margin-bottom: clamp(15px, calc(15px + (25 - 15) * ((100vw - 767px) / (1200 - 767))), 25px);
  }

  /* テキスト: 1200px→900pxで16px→14px、900px以下は14px固定 */
  .p-policy__text {
    font-size: clamp(14px, calc(14px + (16 - 14) * ((100vw - 900px) / (1200 - 900))), 16px);
  }
	
	/* サービスヘッダー（SEサービス見出し） レスポンシブ */
	
	/*.p-service-header {
        padding: clamp(60px, calc(60px + (120 - 60) * ((100vw - 767px) / (1200 - 767))), 120px) 0
                 clamp(50px, calc(50px + (100 - 50) * ((100vw - 767px) / (1200 - 767))), 100px);
    }*/

    .p-service-header__title {
        font-size: clamp(25px, calc(25px + (50 - 25) * ((100vw - 767px) / (1200 - 767))), 50px);
        margin-bottom: clamp(10px, calc(10px + (20 - 10) * ((100vw - 767px) / (1200 - 767))), 20px);
    }

    .p-service-header__subtitle {
        font-size: clamp(18px, calc(18px + (27 - 18) * ((100vw - 767px) / (1200 - 767))), 27px);
        margin-bottom: clamp(15px, calc(15px + (30 - 15) * ((100vw - 767px) / (1200 - 767))), 15px);
    }

    .p-service-header__desc {
        font-size: clamp(15px, calc(15px + (18 - 15) * ((100vw - 767px) / (1200 - 767))), 18px);
    }
	
	
	/* 選ばれる理由ボックス レスポンシブ */
  .p-reason {
    gap: clamp(15px, calc(15px + (30 - 15) * ((100vw - 767px) / (1200 - 767))), 30px);
  }

  .p-reason__item {
    padding: clamp(20px, calc(20px + (40 - 20) * ((100vw - 767px) / (1200 - 767))), 40px);
  }

  /* h3見出し: 1200px→900pxで23px→16px、900px以下は16px固定 */
  .p-reason__title {
    font-size: clamp(14px, calc(14px + (18 - 14) * ((100vw - 900px) / (1200 - 900))), 18px);
    margin-bottom: clamp(15px, calc(15px + (25 - 15) * ((100vw - 767px) / (1200 - 767))), 25px);
    padding-top: clamp(15px, calc(15px + (25 - 15) * ((100vw - 767px) / (1200 - 767))), 25px);
  }

  .p-reason__title::before {
    width: clamp(40px, calc(40px + (67 - 40) * ((100vw - 767px) / (1200 - 767))), 67px);
    height: clamp(3px, calc(3px + (4 - 3) * ((100vw - 767px) / (1200 - 767))), 4px);
  }

  .p-reason__image {
    margin-bottom: clamp(15px, calc(15px + (25 - 15) * ((100vw - 767px) / (1200 - 767))), 25px);
  }

  /* テキスト: 1200px→900pxで16px→14px、900px以下は14px固定 */
  .p-reason__text {
    font-size: clamp(14px, calc(14px + (16 - 14) * ((100vw - 900px) / (1200 - 900))), 16px);
  }
	
	/* このようなお悩みを解決します */
  .p-assignment {
    gap: clamp(15px, calc(15px + (30 - 15) * ((100vw - 767px) / (1200 - 767))), 30px);
  }

  .p-assignment__item {
    padding: clamp(20px, calc(20px + (40 - 20) * ((100vw - 767px) / (1200 - 767))), 40px);
  }
	
	.p-assignment__image {
    /*margin-bottom: clamp(15px, calc(15px + (25 - 15) * ((100vw - 767px) / (1200 - 767))), 25px);*/
  }

  /* テキスト: 1200px→900pxで16px→14px、900px以下は14px固定 */
  .p-assignment__text {
    font-size: clamp(14px, calc(14px + (16 - 14) * ((100vw - 900px) / (1200 - 900))), 16px);
  }
	
	/* 実績 */
  .p-project {
    gap: clamp(15px, calc(15px + (30 - 15) * ((100vw - 767px) / (1200 - 767))), 30px);
  }

  .p-project__item {
    padding: clamp(20px, calc(20px + (40 - 20) * ((100vw - 767px) / (1200 - 767))), 40px);
  }
	
	.p-project__title {
    font-size: clamp(15px, calc(14px + (18 - 15) * ((100vw - 900px) / (1200 - 900))), 18px);
  }
  /* テキスト: 1200px→900pxで16px→14px、900px以下は14px固定 */
  .p-project__text {
    font-size: clamp(14px, calc(14px + (16 - 14) * ((100vw - 900px) / (1200 - 900))), 16px);
  }
	
}

/* ------------------
   767px以下: スマホ表示
   ------------------ */



@media (max-width: 767px) {
	
	.l-contents--gray .l-contents--gray__inner {
	max-width:1160px;
	margin:0 auto;
		_padding:20px 20px;
}
	
	body.bottom .l-contents--gray .l-contents--gray__inner {
	padding: 40px 10px 0;
}
	
	.l-contents--gray .l-contents--gray__inner section{
	margin-bottom:80px;
}
	
	body.service .l-contents--gray .l-contents--gray__inner section{
	margin-bottom:60px;
}
	
	.list_table dl dd .dd_table:first-child {
    border-top: none;
    padding-top: 0;
  }
	
	.list_table dl dd .dd_table {
    width: 100%;
    /*border-top: solid 1px #e7e7e7;
		padding-top: 15px;*/
	}
	
	.list_table dl dd .dd_th {
    padding-bottom: 5px;
    width: 100%;
    display: block;
  }
	
	.list_table dl dd .dd_td {
    width: 100px;
    padding-bottom: 10px;
    display: block;
  }
	
	 .list_title {
    position: relative;
    width: 100%;
    font-size: 1.125rem;
    font-weight: bold;
    border-bottom: 1px solid #e7e7e7;
    padding-bottom: 20px;
    margin-bottom: 20px;
    display: flex;
  }
	
 .list_title::after {
    position: absolute;
    bottom: 0;
    left: 0;
    content: "";
    vertical-align: bottom;
    width: 100px;
    border-bottom: 1px solid #231815;
  }
	
.list_title span {
    margin-left: auto;
    font-weight: normal;
    font-size: 0.875rem;
  }

.list_table dl dt {
    width: 100px;
    padding: 20px 0;
    font-size: 0.9375rem;
  }
	
	 .list_table dl dt.dtsp {
    width: 30px;
    border-bottom: none;
  }
	
	 .list_table dl dd {
    display: table-cell;
    padding: 20px 0;
    font-size: 0.9375rem;
    word-break: break-all;
  }
	
	.list_table dl dd .mapArea{
	display: block;
}

.list_table dl dd .mapArea div{
	width:100%;
}
	
	.list_table dl dd .mapArea div:first-child{
		margin-bottom:20px;
	}
	
	.list_table dl dd .mapArea div iframe{
	width:100%;
	height:200px;
}
	
	.history-section .list_table dl {
    position: relative;
    padding-top: 30px;
  }
	
	.history-section .list_table dl dt.dtsp {
    display: none;
  }
	
	
	 .history-section .list_table dl dt:first-child {
    position: absolute;
    display: block;
    width: 100%;
    top: 0;
    border-bottom: none;
    _font-weight: bold;
    font-size: 1.125rem;
  }
	
	  .history-section .list_table dl dd {
    padding: 40px 0 0 0;
    font-size: 0.9375rem;
    border-bottom: none;
  }
	
	.history-section .list_table dl dd .dd_table {
    width: 100%;
		display: table;
  }

	  .history-section .list_table dl dd {
    padding: 40px 0 0 0;
    font-size: 0.9375rem;
    border-bottom: none;
  }
	
	.history-section .list_table dl dd .dd_th {
    position: relative;
    padding-bottom: 15px;
    width: 65px;
    font-size: 0.9375rem;
    padding: 0 23px 0 0;
  }
	
	 .history-section .list_table dl dd .dd_table:last-child .dd_th::after {
    position: absolute;
    bottom: 0;
    left: 0;
    content: "";
    vertical-align: bottom;
    width: 45px;
    border-bottom: 1px solid #231815;
  }
	
	.history-section .list_table dl dd .dd_table:last-child .dd_td {
    border-bottom: 1px solid #e7e7e7;
  }
	
	 .history-section .list_table dl dd .his_ph {
    float: none;
    margin: 20px 0 20px 0px;
    text-align: center;
    width: 100%;
  }
	
	 .history-section .list_table dl dd .his_ph img {
    display: block;
    margin: 0 auto 10px;
    text-align: center;
  }
	
	.history-section .list_table dl dd .dd_td {
    position: relative;
    font-size: 0.9375rem;
    padding: 0 0 15px 0;
  }

  /* 経営方針ボックス スマホ */
  .p-policy {
    flex-direction: column;
    gap: 15px;
    margin-top: 20px;
  }

  .p-policy__item {
    padding: 20px;
    border-radius: 5px;
  }

  .p-policy__title {
    font-size: 1.125rem;
    margin-bottom: 20px;
    padding-top: 10px;
  }

  .p-policy__title::before {
    top: 0;
    width: 33.5px;
    height: 2px;
    background: url(../images/txt_bar_sp.svg) no-repeat left / contain;
  }

  .p-policy__content {
    display: block;
    overflow: hidden;
  }

  .p-policy__image {
    float: left;
    width: calc(50% - 10px);
    margin-right: 20px;
    margin-bottom: 10px;
  }

  .p-policy__image img {
    width: 100%;
    height: auto;
    object-fit: cover;
  }

  .p-policy__text {
    font-size: 0.9375rem;
  }
	
	/* サービスヘッダー（SEサービス見出し） スマホ */
	
	.p-service-header {
        _padding: 60px 20px 50px;
    }

    .p-service-header__title {
        font-size: 1.5625rem;
        margin-bottom: 10px;
    }

    .p-service-header__subtitle {
        font-size: 1.125rem;
        margin-bottom: 15px;
    }

    .p-service-header__desc {
        font-size: 0.9375rem;
        text-align: left;
    }
	
	/* 選ばれる理由ボックス スマホ */
  .p-reason {
    flex-direction: column;
    gap: 15px;
    margin-top: 20px;
  }

  .p-reason__item {
    padding: 20px;
    border-radius: 5px;
  }

  .p-reason__title {
    font-size: 1rem;
    margin-bottom: 20px;
    padding-top: 10px;
  }

  .p-reason__title::before {
    top: 0;
    width: 33.5px;
    height: 2px;
    background: url(../images/txt_bar_sp.svg) no-repeat left / contain;
  }

  .p-reason__content {
    display: block;
    overflow: hidden;
  }

  .p-reason__image {
    width: 100%;
    margin-bottom: 20px;
  }

  .p-reason__image img {
    width: 100%;
    height: auto;
    object-fit: cover;
  }

  .p-reason__text {
    font-size: 0.9375rem;
  }
	
	/* このようなお悩みを解決します スマホ */
  .p-assignment {
    flex-direction: column;
    gap: 15px;
    margin-top: 20px;
  }

  .p-assignment__item {
    padding: 20px;
    border-radius: 5px;
  }
	
	.p-assignment__content {
    display: flex;
    overflow: hidden;
  }

  .p-assignment__image img {
    width: 70%;
    height: auto;
    object-fit: cover;
  }

  .p-assignment__text {
    font-size: 0.9375rem;
  }
	
	/* 実績 スマホ */
  .p-project {
    flex-direction: column;
    gap: 15px;
    margin-top: 20px;
  }

  .p-project__item {
    padding: 20px;
    border-radius: 5px;
  }
	
	.p-project__content {
    display: block;
    overflow: hidden;
  }
	
	.p-project__title {
    font-size: 1rem;
  }

  .p-project__text {
    font-size: 0.9375rem;
  }
	
	
}


/* ==========================================================================
   フッター
   ========================================================================== */

.l-footer {
  width: 100%;
}

.totop {
    display: block;
    position: fixed;
    right: 2em;
    width: 52px;
    height: 52px;
    background: #fff;
    background-size: 16px auto;
    pointer-events: none;
    transition: opacity 0.5s ease-in, bottom 0.3s ease-out; /* bottomのトランジションを追加 */
    border-radius: 30px;
    box-shadow: 0px 1px 12px 4px rgb(228 228 228 / 38%);
    z-index: 10;
    opacity: 0;
	bottom:20px;
}
.totop:hover {
    box-shadow: 0px 1px 12px 4px rgba(228 228 228, 1);
}
.totop::after {
    position: absolute;
    top: 44%;
    left: 40%;
    display: block;
    content: "";
    width: 10px;
    height: 10px;
    box-sizing: border-box;
    border-left: 2px solid #212121;
    border-top: 2px solid #212121;
    transform: rotate(45deg);
}
.totop.active {
    pointer-events: all;
    cursor: pointer;
    opacity: 1;
}


/* ------------------
   青背景エリア
   ------------------ */

.l-footer__main {
  position: relative;
  padding-top: 70px;
    min-height: 370px;
	overflow: hidden;
}

/* 背景画像 */
.l-footer__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}

.l-footer__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.l-footer__main-inner {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: space-between;
  max-width: 1160px;
  margin: 0 auto;
  padding: 0 20px;
}

/* 左側エリア（会社情報） */
.l-footer__info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.l-footer__logo {
  display: block;
  width: 406px;
  height: 56px;
  background: url(../images/logo_w.svg) no-repeat left center / contain;
  margin-bottom: 20px;
}

.l-footer__address {
  color: var(--color-white);
  font-size: 0.9375rem;
  line-height: 1.6;
  margin-bottom: 20px;
}

.l-footer__address-title {
  font-weight: bold;
  margin-bottom: 5px;
}

.l-footer__address-zip,
.l-footer__address-text,
.l-footer__address-tel {
  font-weight: normal;
}

.l-footer__sns {
  display: flex;
  gap: 15px;
}

.l-footer__sns-link {
  display: block;
}

.l-footer__sns-icon {
  display: block;
  width: 22px;
  height: 22px;
  background-color: var(--color-white);
transition: background .2s
}

.l-footer__sns-icon:hover {
	background-color: var(--color-orange);
}

.l-footer__sns-icon--facebook {
  -webkit-mask: url(../images/sns_facebook.svg) 0 0 no-repeat;
  mask: url(../images/sns_facebook.svg) 0 0 no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.l-footer__sns-icon--note {
  -webkit-mask: url(../images/sns_note.svg) 0 0 no-repeat;
  mask: url(../images/sns_note.svg) 0 0 no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
}

/* 右側エリア（ナビゲーション） */
.l-footer__nav {
  display: flex;
  align-items: flex-start;
}

.l-footer__nav-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(3, auto);
  gap: 20px 135px;
}

.l-footer__nav-item {
  display: flex;
}

.l-footer__nav-link {
  display: flex;
  flex-direction: column;
  color: var(--color-white);
  transition: opacity 0.3s ease;
}

.l-footer__nav-link:hover {
  opacity: 0.7;
}

.l-footer__nav-en {
  font-family: "Google Sans Flex", sans-serif;
  font-size: 2.5rem;
  font-weight: 500;
  line-height: 1.2;
}

.l-footer__nav-ja {
  font-size: 0.8125rem;
  color: var(--color-orange);
  line-height: 1.4;
}

/* ------------------
   濃い青背景エリア
   ------------------ */

.l-footer__sub {
  background-color: var(--color-footer-sub);
  height: 122px;
}

.l-footer__sub-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1160px;
  height: 100%;
  margin: 0 auto;
  padding: 0 20px;
}

.l-footer__group-logo {
  display: block;
  width: 300px;
  height: 38px;
  background: url(../images/logo_group.svg) no-repeat left center / contain;
}

.l-footer__policy {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.l-footer__policy-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 3px 24px;
  margin-bottom: 10px;
}

.l-footer__policy-item {
  display: flex;
}

/* PC/tablet用改行要素 */
.l-footer__policy-break {
  flex-basis: 100%;
  height: 0;
}

.l-footer__policy-link {
  color: var(--color-white);
  font-size: 0.8125rem;
  transition: opacity 0.3s ease;
}

.l-footer__policy-link:hover {
  opacity: 0.7;
}

.l-footer__copyright {
  font-size: 0.8125rem;
}

.l-footer__copyright--pc {
  color: var(--color-copyright-pc);
}

/* SP用コピーライト（PCでは非表示） */
.l-footer__copyright-sp {
  display: none;
}

/* ==========================================================================
   フッター レスポンシブ対応
   ========================================================================== */

/* ------------------
   1200px以下: 各要素がclampで縮小
   ------------------ */

@media (max-width: 1200px) {
  /* ロゴ縮小 */
  .l-footer__logo {
    width: clamp(340px, calc(340px + (406 - 340) * ((100vw - 768px) / (1200 - 768))), 406px);
  }

  /* ナビ英語テキスト縮小 */
  .l-footer__nav-en {
    font-size: clamp(2.25rem, calc(2.25rem + (2.5 - 2.25) * ((100vw - 768px) / (1200 - 768))), 2.5rem);
  }

  /* ナビ間隔縮小 */
  .l-footer__nav-list {
    gap: 20px clamp(45px, calc(45px + (135 - 45) * ((100vw - 768px) / (1200 - 768))), 135px);
  }

  /* SIC GROUPロゴ縮小 */
  .l-footer__group-logo {
    width: clamp(300px, calc(260px + (300 - 260) * ((100vw - 768px) / (1200 - 768))), 300px);
  }

  /* ポリシーリンク縮小 */
  .l-footer__policy-list {
    gap: 3px clamp(10px, calc(10px + (24 - 10) * ((100vw - 768px) / (1200 - 768))), 24px);
  }

  .l-footer__policy-link {
    font-size: clamp(0.75rem, calc(0.75rem + (0.8125 - 0.75) * ((100vw - 768px) / (1200 - 768))), 0.8125rem);
  }
}

/* ------------------
   767px以下: スマホ表示
   ------------------ */

@media (max-width: 767px) {
	
	.totop.active {
        pointer-events: all;
        cursor: pointer;
        opacity: 1;
    }
    .totop {
        right: 15px;
        bottom: 10px;
        width: 45px;
        height: 45px;
    }
    .totop::after {
        position: absolute;
        top: 44%;
        left: 40%;
        display: block;
        content: "";
        width: 10px;
        height: 10px;
        box-sizing: border-box;
        border-left: 2px solid #212121;
        border-top: 2px solid #212121;
        transform: rotate(45deg);
    }
	
  /* 青背景エリア */
  .l-footer__main {
    padding: 35px 30px;
    min-height: auto;
  }

  .l-footer__bg img {
    object-fit: cover;
  }

  .l-footer__main-inner {
    flex-direction: column;
    padding: 0;
  }

  /* ナビゲーションを上に */
  .l-footer__nav {
    order: -1;
    width: 100%;
    margin-bottom: 35px;
  }

  .l-footer__nav-list {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    gap: 20px 0;
  }

  .l-footer__nav-item {
    width: 50%;
  }

  .l-footer__nav-item:nth-child(even) {
    padding-left: 30px;
  }

  .l-footer__nav-en {
    font-size: clamp(1.5625rem, calc(1.5625rem + (2.25 - 1.5625) * ((100vw - 320px) / (767 - 320))), 2.25rem);
  }

  .l-footer__nav-ja {
    font-size: 0.75rem;
  }

  /* 会社情報 */
  .l-footer__info {
    align-items: flex-start;
  }

  .l-footer__logo {
    width: 260px;
    height: 40px;
    margin-bottom: 15px;
  }

  .l-footer__address {
    font-size: 0.9375rem;
    margin-bottom: 15px;
  }

  /* 濃い青背景エリア */
  .l-footer__sub {
    height: auto;
    padding: 35px 30px;
  }

  .l-footer__sub-inner {
    flex-direction: column;
    align-items: flex-start;
    height: auto;
    padding: 0;
  }

  .l-footer__group-logo {
    width: 260px;
    max-width: 100%;
    height: 40px;
    margin-bottom: 20px;
  }

  .l-footer__policy {
    align-items: flex-start;
  }

  /* PC用改行要素を非表示 */
  .l-footer__policy-break {
    display: none;
  }

  .l-footer__policy-list {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px 20px;
    margin-bottom: 0;
    justify-content: left;
  }

  .l-footer__policy-link {
    font-size: 0.8125rem;
  }

  /* PC用コピーライト非表示 */
  .l-footer__copyright--pc {
    display: none;
  }

  /* SP用コピーライト表示 */
  .l-footer__copyright-sp {
    display: block;
    background-color: var(--color-white);
    padding: 30px;
    text-align: center;
  }

  .l-footer__copyright-sp .l-footer__copyright {
    color: var(--color-copyright-sp);
  }
}

/* ==========================================================================
   パンくずエリア
   ========================================================================== */

.l-breadcrumb {
  background-color: var(--color-breadcrumb-bg);
  border-top: 1px solid var(--color-border);
  height: 44px;
}

.l-breadcrumb__inner {
  _max-width: 1200px;
  height: 100%;
  margin: 0 auto;
  padding: 0 20px;
}

.l-breadcrumb__list {
  display: flex;
  align-items: center;
  height: 100%;
  padding-left: 32px;
}

.l-breadcrumb__item {
  display: flex;
  align-items: center;
  font-size: 0.8125rem;
  line-height: 1;
}

.l-breadcrumb__item:not(:last-child)::after {
  content: "";
  display: block;
  width: 4px;
  height: 8px;
  margin: 0 10px;
  -webkit-mask: url(../images/arrow_1.svg) no-repeat center / contain;
  mask: url(../images/arrow_1.svg) no-repeat center / contain;
  background-color: var(--color-text);
}

.l-breadcrumb__link {
  color: var(--color-text);
  transition: opacity 0.3s ease;
}

.l-breadcrumb__link:hover {
  opacity: 0.7;
}

.l-breadcrumb__current {
  color: var(--color-breadcrumb-current);
}

/* ==========================================================================
   パンくず レスポンシブ対応
   ========================================================================== */

@media (max-width: 767px) {
  .l-breadcrumb {
    height: 45px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .l-breadcrumb__inner {
    padding: 0;
    min-width: max-content;
  }

  .l-breadcrumb__list {
    padding-left: 20px;
    padding-right: 20px;
    white-space: nowrap;
  }
}

/* ==========================================================================
   下層ページヒーローセクション
   ========================================================================== */

.p-page-hero {
  position: relative;
}

body.bottom .p-page-hero {
	height:214px;
}

/* ------------------
   ヒーロー画像
   ------------------ */

.p-page-hero__image {
	position: relative;
  width: 100%;
  overflow: hidden;
}

@keyframes pinDrop {
    0% {
        opacity: 0;
        transform: translateX(-50%) translateY(-30px);
    }
    100% {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
}

.p-page-hero__image .p-page-hero__pin {
    position: absolute;
    height: clamp(50px, 5.3vw, 62px);
    top: 38%;
    left: 47%;
    transform: translateX(-50%);
    z-index: 1;
	opacity: 0;
    animation: pinDrop 0.8s ease-out 0.5s forwards;
}

@media (max-width: 1200px) {
	.p-page-hero__image .p-page-hero__pin {
        height: clamp(40px, 5.3vw, 62px);
    }
}

@media (max-width: 767px) {
	.p-page-hero__image .p-page-hero__pin {
	height: clamp(60px, 11.7vw, 90px);
		top: 30%;
		left: 50%;
	}
}


.p-page-hero__image img {
  display: block;
  width: 2560px;
  height: 367px;
  max-width: none;
  margin: 0 auto;
  transform: translateX(calc((100vw - 2560px) / 2));
}

body.bottom .p-page-hero__image img {
  height: 214px;
}


/* ------------------
   タイトルエリア
   ------------------ */

.p-page-hero__title-area {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
  margin-top: -70px;
}

.p-page-hero__title-box {
  position: relative;
  width: 640px;
  height: 210px;
  background-color: var(--color-white);
}

body.bottom .p-page-hero__title-area {
	position: relative;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    margin-top: -146px;
}

body.utility.bottom .p-page-hero__title-area {
	margin-top: -134px;
}


body.bottom .p-page-hero__title-box {
	background-color:rgba(0, 0, 0, 0);
	width: auto;
    height: auto;
}


.p-page-hero__title {
  position: absolute;
  top: 90px;
  left: 60px;
  font-family: "Google Sans Flex", sans-serif;
  font-size: 7.5rem;
  font-weight: 500;
  line-height: 1;
  background: linear-gradient(90deg, var(--color-primary) 0%, var(--color-primary-light) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.p-page-hero__title .blur-word {
    background: linear-gradient(90deg, var(--color-primary) 0%, var(--color-primary-light) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

body.bottom .p-page-hero__title {
	top: 0px;
	font-size: 4.375rem;
}

body.utility.bottom .p-page-hero__title {
	top: 0px;
	font-size: 3.125rem;
}


.p-page-hero__title::before {
  content: "";
  position: absolute;
  top: -25px;
  left: 0;
  width: 67px;
  height: 4px;
  background: url(../images/txt_bar_l.svg) no-repeat center / contain;
}

body.bottom .p-page-hero__title::before {
  top: -15px;
}

body.utility.bottom .p-page-hero__title::before {
  top: -25px;
}

.p-page-hero__lead {
  padding: 20px 0 0 60px;
  font-size: 1.25rem;
  font-weight: 500;
  line-height: 1.8;
}

body.bottom .p-page-hero__lead {
	padding: 70px 0 0 60px;
}

body.utility.bottom .p-page-hero__lead {
	padding: 55px 0 0 60px;
}

/* ------------------
   アンカーリンク
   ------------------ */

.p-page-hero__anchor {
  position: relative;
  margin-top: 80px;
  padding-bottom: 0px;
  background: linear-gradient(to bottom, var(--color-white) 50%, var(--color-gray-bg) 50%);
}

body.bottom .p-page-hero__anchor {
	background: #F9F9F9;
	padding-top: 0px;
	    margin-top: 0;
}

.p-page-hero__anchor::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: var(--color-border);
  transform: translateY(-50%);
}

body.bottom .p-page-hero__anchor::before{
	content: none;
}

.p-page-hero__anchor-inner {
  position: relative;
  z-index: 1;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

.p-page-hero__anchor-list {
  display: flex;
  justify-content: center;
  gap: 30px;
}

.p-page-hero__anchor-item {
  display: flex;
}

.p-page-hero__anchor-link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 156px;
  height: 48px;
  background-color: var(--color-white);
  border: 1px solid var(--color-border);
  font-size: 0.9375rem;
  transition: opacity 0.3s ease;
	transition: opacity 0.3s ease, border-color 0.3s ease;
	border-radius: 2em;
}

.p-page-hero__anchor-link:hover {
border: 1px solid var(--color-primary);
}

.p-page-hero__anchor-icon {
  display: block;
  width: 15px;
  height: 15px;
  -webkit-mask: url(../images/arrow_2.svg) no-repeat center / contain;
  mask: url(../images/arrow_2.svg) no-repeat center / contain;
  background-color: var(--color-primary);
  transform: rotate(90deg);
	top: 2px;
  position: relative;
}

.p-page-hero__anchor-text {
  color: var(--color-text);
	line-height: 1.2;
	text-align: center
}

/* ==========================================================================
   下層ページヒーローセクション レスポンシブ対応
   ========================================================================== */

/* ------------------
   1200px以下: 同じ比率で80%まで縮小
   ------------------ */

@media (max-width: 1200px) {
	
	
  /* ヒーロー画像 */
  .p-page-hero__image img {
    width: clamp(2048px, calc(2048px + (2560 - 2048) * ((100vw - 768px) / (1200 - 768))), 2560px);
    height: clamp(293.6px, calc(293.6px + (367 - 293.6) * ((100vw - 768px) / (1200 - 768))), 367px);
    transform: translateX(calc((100vw - clamp(2048px, calc(2048px + (2560 - 2048) * ((100vw - 768px) / (1200 - 768))), 2560px)) / 2));
  }

  /* タイトルエリア */
  .p-page-hero__title-area {
    margin-top: clamp(-56px, calc(-56px + (-70 - (-56)) * ((100vw - 768px) / (1200 - 768))), -70px);
  }

  .p-page-hero__title-box {
    width: clamp(512px, calc(512px + (640 - 512) * ((100vw - 768px) / (1200 - 768))), 640px);
    height: clamp(168px, calc(168px + (210 - 168) * ((100vw - 768px) / (1200 - 768))), 210px);
  }

  .p-page-hero__title {
    top: clamp(72px, calc(72px + (90 - 72) * ((100vw - 768px) / (1200 - 768))), 90px);
    left: clamp(48px, calc(48px + (60 - 48) * ((100vw - 768px) / (1200 - 768))), 60px);
    font-size: clamp(96px, calc(96px + (120 - 96) * ((100vw - 768px) / (1200 - 768))), 120px);
  }

  .p-page-hero__title::before {
    top: clamp(-20px, calc(-20px + (-25 - (-20)) * ((100vw - 768px) / (1200 - 768))), -25px);
    width: clamp(53.6px, calc(53.6px + (67 - 53.6) * ((100vw - 768px) / (1200 - 768))), 67px);
    height: clamp(3.2px, calc(3.2px + (4 - 3.2) * ((100vw - 768px) / (1200 - 768))), 4px);
  }

  .p-page-hero__lead {
    padding-left: clamp(48px, calc(48px + (60 - 48) * ((100vw - 768px) / (1200 - 768))), 60px);
    font-size: clamp(16px, calc(16px + (20 - 16) * ((100vw - 768px) / (1200 - 768))), 20px);
  }
}

/* ------------------
   767px以下: スマホ表示
   ------------------ */

@media (max-width: 767px) {
	
	body.bottom .p-page-hero {
	height:auto;
}
	
  /* ヒーロー画像 */
  .p-page-hero__image img {
    width: 100%;
    height: auto;
    transform: none;
  }

	body.news .p-page-hero__image,
	body.contact .p-page-hero__image,
	body.utility .p-page-hero__image{
  width: 100%;
  overflow: hidden;
	height: 80px;
}
	
	body.bottom .p-page-hero__image img {
  height: auto;
}

  /* タイトルエリア */
  .p-page-hero__title-area {
    margin-top: -50px;
    padding: 0 30px;
  }
	
	body.bottom .p-page-hero__title-area,
	body.utility.bottom .p-page-hero__title-area {
	position: relative;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 30px;
    margin-top: -50px;
}

  .p-page-hero__title-box {
    width: 100%;
    height: auto;
    padding: 58px 30px 30px;
    margin: 0 auto;
  }
	
	body.bottom .p-page-hero__title-box {
		background-color: var(--color-white);
		padding: 58px 30px 0px;
		width: 100%;
    height: auto;
}

  .p-page-hero__title {
    position: relative;
    top: auto;
    left: auto;
    font-size: 2.5rem;
  }
	
	body.bottom .p-page-hero__title {
	top: auto;
	font-size: 2.5rem;
}
	
	body.utility.bottom .p-page-hero__title {
	top: auto;
	font-size: 1.375rem;
		line-height: 1.2;
		font-weight: bold
}
	

  .p-page-hero__title::before {
    top: -18px!important;
    width: 33.5px;
    height: 2px;
  }

  .p-page-hero__lead {
    padding: 0px 0 30px 0;
    font-size: 0.9375rem;
  }
	
	body.bottom .p-page-hero__lead {
		padding: 0px 0 30px 30px;
	}
	
	body.utility.bottom .p-page-hero__lead {
	padding: 5px 0 30px 30px;
		line-height: 1.2;
}
	

  /* アンカーリンク */
  .p-page-hero__anchor {
    margin-top: 0;
    padding: 30px 15px 0px;
    background: var(--color-gray-bg);
  }
	
	body.top .p-page-hero__anchor {
    margin-top: 0;
    padding: 0px 20px 0px;
    background: var(--color-gray-bg);
  }
	
	body.about .p-page-hero__anchor {
    margin-top: 0;
    padding: 40px 20px 0px;
    background: var(--color-gray-bg);
  }

  .p-page-hero__anchor::before {
    display: none;
  }
	
	body.bottom .p-page-hero__anchor {
	_background: var(--color-gray-bg);
		_padding-top: 30px;
}
	.p-page-hero__anchor-inner{
		max-width: 100%;
		padding: 0;
	}

  .p-page-hero__anchor-list {
    display: flex;
	  gap: 15px;
  }

  .p-page-hero__anchor-link {
	  position: relative;
    width: 100%;
    height: auto;
    font-size: 0.9375rem;
    border-radius: 0px;
    text-align: left;
    justify-content: flex-start;
    background-color: rgba(0,0,0,0);
    border: none;
    margin-bottom: 0px;
  }
	
	.p-page-hero__anchor-icon {
  display: block;
  width: 24px;
  height: 12px;
  -webkit-mask: url(../images/arrow_1.svg) no-repeat center / contain;
  mask: url(../images/arrow_1.svg) no-repeat center / contain;
  background-color: var(--color-primary);
  transform: rotate(90deg);
  top: 20px;
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
}
	
	body.service .p-page-hero__anchor-icon {
	top: 37px;	
	}
	
	
	.p-page-hero__anchor-list li:last-child .p-page-hero__anchor-link{
		_margin-bottom: 0px;
	}

	
}

/* ==========================================================================
   2カラムレイアウト
   ========================================================================== */

.l-two-column {
  display: flex;
  gap: 76px;
}

.l-two-column__main {
  flex: 1;
  max-width: 850px;
}

.l-two-column__side {
  width: 234px;
  flex-shrink: 0;
}

/* ==========================================================================
   ローカルナビゲーション
   ========================================================================== */

/* SP用は非表示（PC表示時） */
.p-local-nav--sp {
  display: none;
}

.p-local-nav--pc {
  width: 234px;
  height: 210px;
  background-color: var(--color-white);
  border: 3px solid var(--color-primary);
  border-radius: 10px;
  box-shadow: 0px 0px 10px 0px rgba(114, 114, 114, 0.3);
  overflow: hidden;
}

.p-local-nav__list {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.p-local-nav__item {
  flex: 1;
  display: flex;
  border-bottom: 1px solid #d6d5d2;
}

.p-local-nav__item:last-child {
  border-bottom: none;
}

.p-local-nav__link {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 0 15px;
  font-size: 0.9375rem;
  color: var(--color-text);
  transition: background-color 0.3s ease;
}

.p-local-nav__link:hover {
  background-color: var(--color-gray-bg);
}

.p-local-nav__link.is-current {
  background-color: var(--color-primary);
  color: var(--color-white);
}

.p-local-nav__icon {
  display: block;
  width: 5px;
  height: 10px;
  flex-shrink: 0;
  -webkit-mask: url(../images/arrow_1.svg) no-repeat center / contain;
  mask: url(../images/arrow_1.svg) no-repeat center / contain;
  background-color: var(--color-primary);
}

.p-local-nav__link.is-current .p-local-nav__icon {
  background-color: var(--color-white);
}

.p-local-nav__text {
  flex: 1;
	line-height: 1.2;
}

/* ==========================================================================
   サイドバナーエリア
   ========================================================================== */

.p-side-banner {
  margin-top: 45px;
}

.p-side-banner__item {
  display: block;
  position: relative;
  background-color: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: 10px;
  padding: 35px 15px 20px;
  text-align: center;
  margin-bottom: 45px;
  transition: opacity 0.3s ease;
	transition: opacity 0.3s ease, border-color 0.3s ease;
}

.p-side-banner__item:hover {
	border: 1px solid var(--color-primary);
}

.p-side-banner__item:last-child {
  margin-bottom: 0;
}

.p-side-banner__item:hover {
  opacity: 0.7;
}

.p-side-banner__image {
  margin-bottom: 20px;
}

.p-side-banner__image img {
  width: 101px;
  height: auto;
  display: block;
	margin: 0 auto;
}

.p-side-banner__text {
  display: inline-block;
  position: relative;
  font-size: 1rem;
  color: var(--color-text);
}

.p-side-banner__blank {
  position: absolute;
  top: 15px;
  right: 15px;
  width: 14px;
  height: 14px;
  -webkit-mask: url(../images/ico_blank.svg) no-repeat center / contain;
  mask: url(../images/ico_blank.svg) no-repeat center / contain;
  background-color: var(--color-text);
}

/* ==========================================================================
   2カラムレイアウト レスポンシブ対応
   ========================================================================== */

@media (max-width: 1200px) {
  .l-two-column {
    gap: clamp(30px, calc(30px + (76 - 30) * ((100vw - 767px) / (1200 - 767))), 76px);
  }

  .l-two-column__side {
    width: clamp(200px, calc(200px + (234 - 200) * ((100vw - 767px) / (1200 - 767))), 234px);
  }

  .p-local-nav--pc {
    width: 100%;
  }
}

/* ------------------
   767px以下: スマホ表示
   ------------------ */

@media (max-width: 767px) {
  .l-two-column {
    flex-direction: column;
    gap: 0;
  }

  .l-two-column__main {
    max-width: 100%;
  }

  .l-two-column__side {
    width: 100%;
  }
	
	body.entry .l-two-column__side {
		display: none;
	}

  /* PC用ローカルナビ非表示 */
  .p-local-nav--pc {
    display: none;
  }
	
	.p-page-recTop__navi{
		padding: 30px 20px 0;
    background-color: var(--color-gray-bg);
		display: flow-root;
	}

  /* SP用ローカルナビ表示 */
  .p-local-nav--sp {
    display: block;
    width: 100%;
    background-color: var(--color-white);
    border: 2px solid var(--color-primary);
    border-radius: 10px;
    box-shadow: 0px 0px 10px 0px rgba(114, 114, 114, 0.3);
    padding: 10px;
    margin-bottom: 40px;
  }
	
	body.entry .p-local-nav--sp {
	display: none;	
	}

  .p-local-nav--sp .p-local-nav__list {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 5px 0px;
    height: auto;
  }

  .p-local-nav--sp .p-local-nav__item {
    flex: none;
    width: auto;
    border-bottom: none;
  }

  .p-local-nav--sp .p-local-nav__link {
    padding: 8px 12px;
    font-size: 0.875rem;
    border-radius: 5px;
    white-space: nowrap;
  }

  .p-local-nav--sp .p-local-nav__link.is-current {
    background-color: var(--color-primary);
    color: var(--color-white);
  }

  /* バナーエリア スマホ */
  .p-side-banner {
    margin-top: 40px;
  }

  .p-side-banner__item {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 10px;
    text-align: left;
	  margin-bottom: 20px;
  }
	


  .p-side-banner__image {
    width: 115px;
    height: 83px;
    flex-shrink: 0;
    margin-bottom: 0;
    border: 1px solid #d6d5d2;
    overflow: hidden;
	  padding: 5px;
  }

  .p-side-banner__image img {
    width: 50%;
    height: auto;
    margin: 0 auto;
  }

  .p-side-banner__text {
    flex: 1;
    font-size: 0.9375rem;
    padding-right: 0;
  }

  .p-side-banner__blank {
    position: absolute;
    top: 10px;
    right: 10px;
  }
}

/* ==========================================================================
   Recruit 左カラム
   ========================================================================== */


.p-section-lead{
	margin-bottom:80px;
}

.p-section-title {
    position: relative;
    font-size: 1.25rem;
    font-weight: bold;
    margin-bottom: 25px;
    padding-top: 20px;
}

.p-section-title::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 67px;
    height: 4px;
    background: url(../images/txt_bar_l.svg) no-repeat center / contain;
}

.p-section-text{
	margin-bottom:40px;
}

.p-content-banner{
	margin-bottom:40px;
}

  .p-left-banner__item {
    display: flex;
	  position: relative;
  background-color: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: 10px;
    align-items: center;
    gap: 15px;
    padding: 20px;
    text-align: left;
	  transition: opacity 0.3s ease;
	  transition: opacity 0.3s ease, border-color 0.3s ease;
	  width:315px;
  }

.p-left-banner__item:hover {
	border: 1px solid var(--color-primary);
}

.p-left-banner__image {
    width: 128px;
    height: 78px;
    flex-shrink: 0;
    margin-bottom: 0;
    overflow: hidden;
    padding: 5px;
  }

.p-left-banner__image img {
    width: 100%;
    height: auto;
    margin: 0 auto;
	display: block;
  }

.p-left-banner__text {
    flex: 1;
    padding-right: 0;
	display: inline-block;
  position: relative;
  font-size: 1rem;
  color: var(--color-text);
  }

 .p-left-banner__blank {
    position: absolute;
    top: 10px;
    right: 10px;
	 width: 14px;
  height: 14px;
	 -webkit-mask: url(../images/ico_blank.svg) no-repeat center / contain;
  mask: url(../images/ico_blank.svg) no-repeat center / contain;
  background-color: var(--color-text);
  }

.p-section__btn-or {
	position: relative;
    background-color: var(--color-orange);
    font-size: 0.9375rem;
	width:190px;
	height:54px;
	display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: var(--color-white);
    font-weight: 500;
    transition: opacity 0.3s ease;
	margin:60px auto 0;
	border-radius:2em;
	    transition: background .2s cubic-bezier(0.33, 1, 0.68, 1);
    overflow: hidden;
}

.p-section__btn-or::before {
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    background: #ffbd50;
    -webkit-transition: 1.0s cubic-bezier(0.475, 0.425, 0, 0.995);
    transition: 1.0s cubic-bezier(0.475, 0.425, 0, 0.995);
    right: auto;
    right: -100px;
    bottom: -100px;
    transform: rotate(35deg);
}

.p-section__btn-or.new {
    margin: 40px auto 60px;
}

@media (hover: hover) and (pointer: fine) {
    .p-section__btn-or:hover:before {
        width: 500px;
        height: 500px;
        opacity: 1;
    }
}

.p-section__btn-or.w230 {
	width:230px;
}

.p-section__btn-text {
    display: block;
	z-index: 1;
}

.p-section__btn-icon {
    display: block;
    flex-shrink: 0;
}

.p-section__btn-icon--arrow {
    -webkit-mask: url(../images/arrow_1.svg) 0 0 no-repeat;
    mask: url(../images/arrow_1.svg) 0 0 no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
    background-color: var(--color-white);
    width: 6px;
    height: 12px;
    transition: transform 0.3s ease;
}


/* ==========================================================================
   FAQ アコーディオン
   ========================================================================== */

.p-faq-list {
    border-top: 1px solid var(--color-border);
}

.p-faq-item {
    border-bottom: 1px solid var(--color-border);
}

/* 質問行 */
.p-faq-question {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px 0;
    width: 100%;
    background: none;
    border: none;
    text-align: left;
    font-family: inherit;
    font-size: 1rem;
    line-height: 1.8;
    color: var(--color-text);
    cursor: pointer;
}

/* Q / A アイコン共通 */
.p-faq-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 39px;
    height: 37px;
    border-radius: 3px;
    border: 1px solid var(--color-border);
    background-color: var(--color-white);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1;
}

.p-faq-icon--q {
    color: var(--color-primary);
}

.p-faq-icon--a {
    color: var(--color-orange);
}

/* 質問テキスト */
.p-faq-question__text {
    flex: 1;
    font-weight: 500;
}

/* +/- トグルボタン */
.p-faq-toggle {
    position: relative;
    flex-shrink: 0;
    width: 24px;
    height: 24px;
}

.p-faq-toggle__line {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 18px;
    height: 2px;
    background-color: var(--color-primary);
    transition: transform 0.3s ease;
}

.p-faq-toggle__line:first-child {
    transform: translate(-50%, -50%);
}

.p-faq-toggle__line:last-child {
    transform: translate(-50%, -50%) rotate(90deg);
}

.p-faq-item.is-open .p-faq-toggle__line:last-child {
    transform: translate(-50%, -50%) rotate(0deg);
}

/* 回答エリア（アコーディオン） */
.p-faq-answer {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.3s ease;
}

.p-faq-item.is-open .p-faq-answer {
    grid-template-rows: 1fr;
}

.p-faq-answer__inner {
    overflow: hidden;
}

.p-faq-answer__content {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 0 0 24px;
}

.p-faq-answer__text {
    flex: 1;
    font-size: 1rem;
    line-height: 1.8;
}

.p-faq-answer__text p + p {
    margin-top: 0.8em;
}


/* ステップリスト */
.p-step-list {
    counter-reset: step;
}

.p-step-item {
    counter-increment: step;
}

.p-step-item__box {
    display: flex;
    gap: 20px;
    background-color: var(--color-white);
    border-radius: 10px;
    padding: 20px;
	align-items: center;
}

/* 数字（CSS counter） */
.p-step-item__box::before {
    content: counter(step);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background-color: var(--color-primary);
    color: var(--color-white);
    font-size: 1.375rem;
    font-weight: 500;
    line-height: 1;
}

.p-step-item__title {
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 4px;
}

.p-step-item__text {
    font-size: 1rem;
}

/* 下向き矢印 */
.p-step-item__arrow {
    display: block;
    width: 32px;
    height: 16px;
    margin: 12px 0 12px 36px;
    -webkit-mask: url(../images/arrow_1.svg) no-repeat center / contain;
    mask: url(../images/arrow_1.svg) no-repeat center / contain;
    background-color: var(--color-primary);
    transform: rotate(90deg);
}

/*  */


.p-training-section__box {
    display: flex;
    gap: 20px;
    background-color: var(--color-white);
    border-radius: 10px;
    padding: 20px;
	align-items: center;
	margin-bottom:20px;
}

.p-training-section__image {
    width: 168px;
    height: 109px;
    flex-shrink: 0;
    margin-bottom: 0;
    overflow: hidden;
    padding: 5px;
}

.p-training-section__image img {
    width: 100%;
    height: auto;
    margin: 0 auto;
    display: block;
}

.p-training-section__title {
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 4px;
}

.p-training-section__text {
    font-size: 1rem;
}

/* ==========================================================================
   キャリア採用募集要項一覧
   ========================================================================== */

.p-career-list {
    border-top: 1px solid var(--color-border);
}

/* 各アイテム */
.p-career-item {
    display: flex;
    align-items: center;
    gap: 40px;
    padding: 24px 0;
    border-bottom: 1px solid var(--color-border);
}

/* タグエリア */
.p-career-item__tags {
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex-shrink: 0;
}

/* タグ共通 */
.p-career-tag {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 125px;
    height: 30px;
    padding: 0 10px;
    border-radius: 3px;
    font-size: 0.8125rem;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

/* 青背景タグ */
.p-career-tag--filled {
    background-color: var(--color-primary);
    color: var(--color-white);
}

/* 白背景タグ */
.p-career-tag--outline {
    background-color: var(--color-white);
    border: 1px solid var(--color-primary);
    color: var(--color-primary);
}

/* テキスト＋矢印エリア */
.p-career-item__body {
    display: flex;
    align-items: center;
    flex: 1;
    gap: 16px;
}

/* リンクテキスト */
.p-career-item__link {
    flex: 1;
    font-size: 1rem;
    color: var(--color-text);
    transition: opacity 0.3s ease;
}

.p-career-item__link:hover {
    opacity: 0.7;
}

/* 右矢印 */
.p-career-item__arrow {
    display: block;
    flex-shrink: 0;
    width: 15px;
    height: 15px;
    -webkit-mask: url(../images/arrow_2.svg) no-repeat center / contain;
    mask: url(../images/arrow_2.svg) no-repeat center / contain;
    background-color: var(--color-primary);
}

/* ------------------
   1200px以下
   ------------------ */

@media (max-width: 1200px) {

}


/* ------------------
   767px以下: スマホ表示
   ------------------ */

@media (max-width: 767px) {

.p-section-lead{
	margin-bottom:40px;
}
	
.p-section-text{
	margin-bottom:20px;
}

.p-content-banner{
	margin-bottom:20px;
}

  .p-left-banner__item {
  border-radius: 10px;
    padding: 10px;
	  width:100%;
  }

.p-left-banner__image {
    width: 115px;
    height: 78px;
    flex-shrink: 0;
    margin-bottom: 0;
    overflow: hidden;
    padding: 5px;
  }

.p-left-banner__image img {
    width: 100%;
    height: auto;
    margin: 0 auto;
	display: block;
  }

.p-left-banner__text {
    flex: 1;
    padding-right: 0;
	display: inline-block;
  position: relative;
  font-size: 0.9375rem;
  color: var(--color-text);
  }

 .p-left-banner__blank {
    position: absolute;
    top: 10px;
    right: 10px;
	 width: 14px;
  height: 14px;
	 -webkit-mask: url(../images/ico_blank.svg) no-repeat center / contain;
  mask: url(../images/ico_blank.svg) no-repeat center / contain;
  background-color: var(--color-text);
  }
	
	.p-section__btn-or {
		margin:40px auto 0;
	}

  /* FAQ SP調整 */
  .p-faq-question {
      gap: 12px;
      padding: 16px 0;
      font-size: 0.9375rem;
  }

  .p-faq-answer__content {
      gap: 12px;
      padding: 0 0 16px;
  }

  .p-faq-answer__text {
      font-size: 0.9375rem;
  }
	
.p-step-item__box {
    padding: 15px;
    gap: 15px;
}

.p-step-item__title {
    font-size: 0.9375rem;
}

.p-step-item__text {
    font-size: 0.9375rem;
	line-height: 1.4;
}
	
	.p-training-section__box {
    display: flex;
    gap: 15px;
    background-color: var(--color-white);
    border-radius: 10px;
    padding: 10px;
    align-items: flex-start;
    margin-bottom: 20px;
}
	
	.p-training-section__image {
    width: 115px;
    height: 83px;
    flex-shrink: 0;
    margin-bottom: 0;
    overflow: hidden;
    padding: 5px;
}
	
	.p-training-section__image img {
    width: 100%;
    height: auto;
    margin: 0 auto;
    display: block;
}
	
	.p-training-section__title {
    font-size: 0.9375rem;
    font-weight: 700;
    margin-bottom: 4px;
}
	
	.p-training-section__text {
    font-size: 0.9375rem;
}
	
/* 2段組みに変更 */
    .p-career-item {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
        padding: 20px 0;
    }

    /* タグを横並びに */
    .p-career-item__tags {
        flex-direction: row;
        gap: 8px;
    }

    /* テキスト＋矢印 */
    .p-career-item__body {
        width: 100%;
        align-items: center;
    }

    .p-career-item__link {
        font-size: 0.9375rem;
    }

}

/* ==========================================================================
   News
   ========================================================================== */
.p-news-list {
    border-top: 1px solid var(--color-border);
}

.p-news-item {
    display: flex;
    align-items: center;
    gap: 40px;
    padding: 24px 0;
    border-bottom: 1px solid var(--color-border);
}

.p-news-item__meta {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-shrink: 0;
}

.p-news-item__date {
    font-size: 1rem;
    white-space: nowrap;
	width: 90px;
}

.p-news-tag {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 90px;
    height: 30px;
    padding: 0 10px;
    border-radius: 3px;
    border: 1px solid var(--color-primary);
    background-color: var(--color-white);
    color: var(--color-primary);
    font-size: 0.9375rem;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

.p-news-item__body {
    display: flex;
    align-items: center;
    flex: 1;
    gap: 16px;
}

.p-news-item__link {
    flex: 1;
    font-size: 1rem;
    color: var(--color-text);
    transition: color 0.3s ease;
}

a.p-news-item__link:hover {
    color: var(--color-primary);
}

.p-news-item__arrow {
    display: block;
    flex-shrink: 0;
    width: 15px;
    height: 15px;
    -webkit-mask: url(../images/arrow_2.svg) no-repeat center / contain;
    mask: url(../images/arrow_2.svg) no-repeat center / contain;
    background-color: var(--color-primary);
}


/* ==========================================================================
   ページネーション
   ========================================================================== */

.p-pagination {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 40px;
}

.p-pagination__item {
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--color-text);
    transition: opacity 0.3s ease;
}

.p-pagination__item:hover {
    opacity: 0.7;
}

.p-pagination__item--next{
	margin-left: auto;
}

.p-pagination__circle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 1px solid var(--color-border);
	background-color: var(--color-white);
}

.p-pagination__icon {
    display: block;
    width: 15px;
    height: 15px;
    -webkit-mask: url(../images/arrow_2.svg) no-repeat center / contain;
    mask: url(../images/arrow_2.svg) no-repeat center / contain;
    background-color: var(--color-primary);
}

.p-pagination__icon.p-pagination__icon--next {
    position: relative;
	top: 2px;
    left: 1px;	
}

.p-pagination__icon.p-pagination__icon--prev {
    position: relative;
	top: -1px;
    left: -1px;	
}

.p-pagination__icon--prev {
    transform: rotate(180deg);
}

.p-pagination__text {
    font-size: 1rem;
}

/* お知らせ詳細 */

/* 日付＋カテゴリ */
.p-news-detail__meta {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 16px;
}

.p-news-detail__date {
    font-size: 1rem;
}

/* 記事タイトル */
.p-news-detail__title {
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1.8;
    margin-bottom: 40px;
}

/* 区切り線 */
.p-news-detail__line {
    border: none;
    border-top: 1px solid var(--color-border);
    margin-bottom: 50px;
}

/* 本文 */
.p-news-detail__body {
    font-size: 1.125rem;
    line-height: 1.8;
}

.p-news-detail__body p + p {
    margin-top: 1.5em;
}

/* 本文内リンク */
.p-news-detail__link {
    color: var(--color-primary);
    text-decoration: underline;
    transition: opacity 0.3s ease;
}

.p-news-detail__link:hover {
    opacity: 0.7;
}

/* ------------------
   1200px以下
   ------------------ */

@media (max-width: 1200px) {

}


/* ------------------
   767px以下: スマホ表示
   ------------------ */

@media (max-width: 767px) {
.p-news-item {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
        padding: 20px 0;
    }

    .p-news-item__meta {
        gap: 12px;
    }

    .p-news-item__body {
        width: 100%;
        align-items: center;
    }

    .p-news-item__link {
        font-size: 0.9375rem;
    }

    .p-pagination {
        margin-top: 30px;
    }

    .p-pagination__text {
        font-size: 1rem;
    }

    .p-news-detail__title {
        font-size: 0.9375rem;
    }

    .p-news-detail__body {
        font-size: 0.9375rem;
    }
	
}



/* ==========================================================================
   フッター 光アニメーション（パターン1: radial-gradient + @keyframes）
   ========================================================================== */

/* コンテナにoverflow:hiddenを追加（光がはみ出さないように） */
.l-footer__main {
    overflow: hidden;
}

/* フッター内のコンテンツを光より上に */
.l-footer__main-inner {
    position: relative;
    z-index: 2;
}

/* JS生成の光要素 */
.l-footer__light-orb {
    position: absolute;
    width: 1000px;
    height: 1000px;
    background: radial-gradient(circle, rgb(61 170 239 / 60%) 0%, rgba(10, 122, 194, 0) 70%);
    border-radius: 50%;
    pointer-events: none;
    z-index: 1;
    top: 50%;
    left: 50%;
    margin-top: -500px;
    margin-left: -500px;
    will-change: transform;
}

@media (max-width: 767px) {
	.l-footer__light-orb {
	width: 600px;
    height: 600px;
	}
}

