.photo-credit {
  text-align: right;
  font-size: 10px;
  font-weight: 600;
  height: 10px;
}

.photo-credit.right_bot {
  position: absolute;
  bottom: 40px;
  right: 40px;
  color: white;
}

.top-photo-credit {
  text-align: right;
  font-size: 10px;
  font-weight: 600;
  height: 10px;
  color: #322B2B;
}



#page_title.service_railway,
#page_title.process {
  background: url(../image/railway/page_title_service_railway.png?20260526) no-repeat center center;
}


.rail_section_bot {
  padding: 100px 0 200px;
  text-align: center;
  background: url(../image/railway/service_automotive_img04_bg.png) repeat-x center bottom;
}

.rail_section_bot .title02 {
  color: var(--color-primary);
}

#page_title.service_ship,
#page_title.process {
  background: url(../image/marine/img01.png) no-repeat center center;
}


.ship_section_bot {
  padding: 100px 0 200px;
  text-align: center;
  background: url(../image/marine/img08.png) repeat-x center bottom;
}

.ship_section_bot .title02 {
  color: var(--color-primary);
}


#page_title.service_industrial_equipment {
  background: url(../image/industrial-equipment/img01.png) no-repeat center center;
}


.industrial_equipment_section_bot {
  padding: 100px 0 200px;
  text-align: center;
  background: url(../image/industrial-equipment/img09.png) repeat-x center bottom;
}

.industrial_equipment_section_bot .title02 {
  color: var(--color-primary);
}


#page_title.message {
  background: url(../image/message/img_top.png) no-repeat center center;
}

#page_title.quality {
  background: url(../image/quality/img_top.png) no-repeat center center;
}

#page_title.location {
  background: url(../image/location/img_top.png) no-repeat center center;
}

#page_title.privacypolicy {
  background: url(../image/privacypolicy/img_top.png) no-repeat center center;
}

#page_title.contact {
  background: url(../image/contact/img_top.png) no-repeat center center;
}





.rail_section_bot {
  padding: 100px 0 200px;
  text-align: center;
  background: url(../image/railway/service_automotive_img04_bg.png) repeat-x center bottom;
}

.message .title02 {
  color: var(--color-primary);
}

.company_sub .inner02 {
  display: flex;
  justify-content: space-between;
}

.campnytop_right_box_img {
  padding-top: 100px;
}

.campnytop_right_box {
  width: 30%;
}

.text_s_10 {
  font-size: 10px;
}

.text_s_11 {
  font-size: 11px;
}

.text_s_12 {
  font-size: 12px;
}

.text_s_14 {
  font-size: 14px;
}

.text_s_16 {
  font-size: 16px;
}

.s_b {
  display: flex;
  justify-content: space-between;
}

.text_s_18 {
  font-size: 18px;
}

.abc {
  font-family: "Josefin Sans", sans-serif;
}

.text_s_blue {
  color: #1B3C7F;
}

.message2 .txt_box .text_s_white {
  color: white;
}

.text_s_height0 {
  line-height: 0;
}

.text_s_height2 {
  line-height: 2;
}

.company-profile {
  padding-top: 30px;
}

.flex_row {
  display: flex;
  justify-content: space-between;
  position: relative;

}

.flex_row+.flex_row::before {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background-color: #ccc;
  position: absolute;
  top: 0;
  left: 0;
}

.bg_blue {
  background-color: #153374;

}

.quality .service_item02_wrap::before {
  content: none;
}

.quality .service_item02_wrap::after {
  content: none;
}

.quality .service_item02_wrap .txt_box {
  max-width: 580px;
}

.img_no_box {
  padding: 15px 0;
  gap: 10px;
}

.m_t_100 {
  margin-top: 100px;
  width: 100%;
}

.company_sub .inner01::before {
  content: none;
}

.privacypolicy_content {
  display: flex;
  flex-direction: column;
  gap: 40px;
  background-color: #F8F8F8;
  padding: 50px 100px;
}

.privacypolicy_content ul li {
  list-style: none;

}

.policy_indent {
  padding-left: 1em;
}

.contact_section {
  background-color: #153374;
}

.sub_contact_cf7 {
  background: #fff;
  border-radius: 30px;
  overflow: hidden;
  margin-top: 120px;
  margin-bottom: 120px;
  max-width: 1000px;
}

.sub_contact_cf7_head {
  padding: 60px 100px 40px;
  border-bottom: 1px solid #153374;
}

.sub_contact_cf7_head p {
  color: #153374;
  letter-spacing: 0.1em;
}

.sub_contact_cf7_body {
  padding: 60px 100px 70px;
}

.sub_contact_row {
  display: flex;
  gap: 40px;
  margin-bottom: 28px;
}

.sub_contact_row dt {
  width: 240px;
  color: #222;
  flex-shrink: 0;
}

.sub_contact_row dd {
  flex: 1;
}

.sub_req,
.sub_any {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 70px;
  height: 30px;
  border-radius: 15px;
  color: #fff;
  margin-right: 14px;
}

.sub_req {
  background: #153374;
}

.sub_any {
  background: #58A0C8;
}

.sub_contact_row input,
.sub_contact_row textarea {
  width: 100%;
  border: 1px solid #d3d9e3;
  border-radius: 8px;
  background: #fff;
  box-sizing: border-box;
  padding: 0 10px;
}

.sub_contact_row input:focus,
.sub_contact_row textarea:focus {
  border-color: #58A0C8;
  outline: none;
}

.sub_contact_row textarea {
  height: 180px;
  resize: none;
}

.sub_contact_address dd {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.sub_address_line {
  display: flex;
  align-items: center;
  gap: 24px;
}

.sub_address_line label {
  width: 110px;
  flex-shrink: 0;
}

.sub_address_line input {
  flex: 1;
}

.sub_contact_privacy {
  margin-top: 50px;
  text-align: center;
}

.sub_contact_privacy a {
  color: #153374;
  text-decoration: underline;
}

.sub_contact_submit {
  margin-top: 40px;
  text-align: center;
}

.sub_contact_submit input {
  width: 340px;
  height: 64px;
  border: none;
  border-radius: 12px;
  background: #153374;
  color: #fff;
  cursor: pointer;
  transition: 0.3s;
}

.sub_contact_submit input:hover {
  background: #58A0C8;
}

.contact_section .inner01 {
  justify-content: center;
}

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

  .sub_contact_cf7 {
    border-radius: 20px;
  }

  .sub_contact_cf7_head {
    padding: 40px 25px 30px;
  }

  .sub_contact_cf7_body {
    padding: 40px 25px 50px;
  }

  .sub_contact_row {
    flex-direction: column;
    gap: 15px;
    margin-bottom: 24px;
  }

  .sub_contact_row dt {
    width: 100%;
    padding-top: 0;
  }

  .sub_contact_address dd {
    gap: 14px;
  }

  .sub_address_line {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .sub_address_line label {
    width: 100%;
  }

  .sub_contact_submit input {
    width: 100%;
  }

}

.contact_section .title02 {
  font-size: 45px;
  letter-spacing: 0.1em;
  padding-top: 0;
  line-height: 1;
  margin-bottom: 0;
}

.contact_section .wpcf7-response-output {
  color: #fff;
}

.indent {
  text-indent: 1rem;
}

.quality .profile_box03 .inner02 dl dt span {
  min-width: 232px;
}

.quality .profile_box03 .inner02 dl dt {
  width: 30%;
}

.quality .profile_box03 .inner02 dl dd {
  width: 70%;
}

.m-t-20 {
  margin-top: 20px;
}

.profile_box03.quality .scope-card {
  background-color: #153374;
  border-radius: 20px;
  padding: 70px 80px;
  margin-top: 80px;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
}

.profile_box03.quality .scope-card .scope-label {
  width: 30%;
  display: flex;
  justify-content: center;
}

.profile_box03.quality .scope-card .scope-label span {
  background-color: #fff;
  border-radius: 999px;
  max-width: 240px;
  width: 100%;
  color: #153374;
  display: block;
  text-align: center;
  padding: 14px 0;
}

.profile_box03.quality .scope-card .scope-body {
  color: #fff;
}

.profile_box03.quality .scope-card .scope-body p {
  margin: 0;
}

.profile_box03.quality {
  margin-bottom: 0;
}

/* quality時 ─ dt のピルを下のscope-cardと同じ形状に */
.profile_box03.quality .inner02 dl dt span {
  border-radius: 999px;
  max-width: 240px;
  padding: 14px 0;
}

.profile_box03.quality .inner02 dl dt span.quality {
  line-height: 1.5;
}

/* 地図埋め込み（全拠点対応） */
.profile_box01 .txtbox dl dd .map {
  width: 100%;
  border-radius: 12px;
  overflow: hidden;
  line-height: 0;
}

.profile_box01 .txtbox dl dd .map iframe {
  width: 100%;
  height: 360px;
  border: 0;
  display: block;
}

/* 地図を含む項目は dt を隠して dd を横幅いっぱいに（左余白解消・全拠点対応） */
.profile_box01 .txtbox dl .item.map_item {
  display: block;
}

.profile_box01 .txtbox dl .item.map_item dt {
  display: none;
}

.profile_box01 .txtbox dl .item.map_item dd {
  width: 100%;
  padding-left: 0;
}

/* 横幅を全拠点で統一（点線・地図の幅揃え） */
.profile_box01 .flex_box .txtbox {
  width: 100%;
  box-sizing: border-box;
}

.profile_box01 .flex_box .txtbox .item dd {
  box-sizing: border-box;
}

.profile_box01 .txtbox dl .item.map_item dd .map {
  width: 100%;
}

/* 国際規格 ─ ロゴと説明文を横並びに */
.profile_box01 .txtbox dl dd .cert {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  flex-wrap: nowrap;
}

.profile_box01 .txtbox dl dd .cert+.cert {
  margin-top: 24px;
}

.profile_box01 .txtbox dl dd .cert .cert_logo {
  flex: 0 0 80px;
  width: 80px;
  margin: 0;
}

.profile_box01 .txtbox dl dd .cert .cert_logo img {
  width: 100%;
  height: auto;
  display: block;
}

.profile_box01 .txtbox dl dd .cert p {
  margin: 0;
  flex: 1;
  min-width: 0;
}

/* SHONAN ─ 色反転（白背景＋紺文字） */
.profile_box01.shonan {
  background-color: #fff;
}

/* タイトル */
.profile_box01.shonan .title01 .font01,
.profile_box01.shonan .title01 .sub {
  color: #153374;
}

/* dt / dd の文字色 */
.profile_box01.shonan .txtbox dl dt,
.profile_box01.shonan .txtbox dl dd {
  color: #153374;
}

/* 罫線（破線）色 ─ 湘南は紺へ反転（点線は .item に引かれているため .item を指定） */
.profile_box01.shonan .txtbox dl dt,
.profile_box01.shonan .txtbox dl dd {
  border-color: #153374;
}

.profile_box01.shonan .flex_box .txtbox .item {
  border-bottom-color: #153374;
}

.profile_box01.shonan .flex_box .txtbox .item:first-child {
  border-top-color: #153374;
}

.kyushu {
  margin-bottom: 77px;
}

.privacypolicy {
  margin-bottom: 77px;
}

@media only screen and (max-width: 999px) {
  .location .recruit_top {
    gap: 3vw;
    padding-top: clamp(70px, 16.667px + 13.333vw, 150px);
    margin-bottom: clamp(40px, 20.000px + 5vw, 70px);
    flex-direction: row;
  }
}



@media only screen and (max-width: 768px) {
  .location .recruit_top .right_box {
    margin-right: auto;
    max-width: initial;
  }

  .location .recruit_top {
    margin-bottom: clamp(40px, 20.000px + 5vw, 70px);
    flex-direction: column;
  }
}

@media only screen and (max-width: 768px) {
  .company_box01.location {
    margin-bottom: clamp(40px, 20.000px + 5vw, 70px);
  }
}

/* =============================================================
   所在地ページ TEL/FAX の下線対策（スマホ時のみ）
   iPhone(Safari)はTEL/FAX番号を自動でリンク化し、
   .profile_box01 .item dd a の border-bottom(白線)が
   下線として表示されてしまうため、自動リンク化された
   電話番号の下線・色変化を打ち消す。
   3拠点(京都/湘南/九州)固有クラスで限定。PC時は変更しない。
   ※京都/湘南/九州のprofile_box01は.locationの子孫ではないため
   　拠点固有クラス(.kyoto/.shonan/.kyushu)でセレクタを限定する。
   ============================================================= */
@media only screen and (max-width: 768px) {

  .profile_box01.kyoto .flex_box .txtbox .item dd a,
  .profile_box01.shonan .flex_box .txtbox .item dd a,
  .profile_box01.kyushu .flex_box .txtbox .item dd a {
    border-bottom: none;
    padding-bottom: 0;
    color: inherit;
    text-decoration: none;
    pointer-events: none;
  }
}

/* =============================================================
   所在地ページ 左右余白の統一（スマホ時のみ）
   導入文(.inner01)はスマホ時 width:88% だが、
   3拠点セクション(.inner02)は width:92% のままで
   左右余白が揃わない。導入文に合わせて 88% に統一する。
   PC時(769px以上)は変更しない。拠点固有クラスで限定。
   ============================================================= */
@media only screen and (max-width: 768px) {

  .profile_box01.kyoto .inner02,
  .profile_box01.shonan .inner02,
  .profile_box01.kyushu .inner02 {
    width: 88%;
  }
}

/* =============================================================
   品質・環境方針ページ(quality) スマホ時レイアウト調整
   PC時(769px以上)は一切変更しない。
   ============================================================= */
@media only screen and (max-width: 768px) {

  /* (1) 文の間が広い対策は下部の @media(max-width:999px) ブロックに
     一本化(タブレット縦積み帯 769〜999px でも icon_area の巨大な
     余白が残るため)。ここでは指定しない。 */

  /* (2) 環境方針 dl の項目(dt)と説明(dd)の被り対策は
     下部の @media(max-width:830px) ブロックに一本化(タブレット帯
     769〜833pxの重なりも解消するため)。ここでは指定しない。 */

  /* (3) 適用範囲(scope-card)の表示位置対策
     scope-label{width:30%}/scope-body{width:70%} が全幅共通で
     効き、狭い画面でピルが潰れ横並びが崩れる。スマホでは
     縦積みにして、ラベルを上・本文を下に配置する。 */
  .profile_box03.quality .scope-card {
    display: block;
    padding: 30px 24px;
  }

  .profile_box03.quality .scope-card .scope-label {
    width: 100%;
    margin-bottom: 16px;
  }

  .profile_box03.quality .scope-card .scope-label span {
    margin: 0;
  }

  .profile_box03.quality .scope-card .scope-body {
    width: 100%;
  }

  /* (4) レイアウト崩れ対策: SDGsアイコン(img_no_box)
     gap指定はあるがflex化されておらず、アイコンが原寸で
     縦積み・巨大表示になる。横並び＋折り返しは下部の
     @media(max-width:999px) ブロックに一本化(タブレット縦積み帯
     769〜999px でもアイコンが巨大縦積みになるため)。 */

  /* 適用範囲(scope-card)のピルを小さく(スマホ・タブレット時のみ)
     現状 max-width:240px で横幅に対して大きく見えるため、
     コンテンツに合わせた小さめのピルにする。PC時は変更しない。 */
  .profile_box03.quality .scope-card .scope-label span {
    display: inline-block;
    width: auto;
    max-width: none;
    padding: 12px 32px;
  }
}

/* =============================================================
   品質・ご挨拶ページ recruit_top 構造での写真カラム安定化
   quality(品質への取り組み/環境理念/SDGs)・message(会長/社長)の
   各セクションを location/profile と同じ
   recruit_top / left_box / right_box / box 構造に統一した。
   ============================================================= */

/* PC・横並び時(1000px以上): 左カラムのテキストが長いと右カラム(写真)が
   351pxより縮むため、右カラムを縮ませず固定する。
   recruit_top が横並びに切り替わるのは 1000px 以上なので、その全域で
   351px を保ち、1000〜1100px帯で写真が小さくなる現象を防ぐ。 */
@media only screen and (min-width: 1000px) {

  .company_box01.quality .recruit_top .right_box,
  .company_box01.message_greeting .recruit_top .right_box {
    flex-shrink: 0;
    width: 351px;
  }
}

/* タブレット〜スマホ時(max-width:1100px): message は右カラムに
   写真＋プロフィール文があり、共通CSSの max-width:initial で全幅に
   広がって間延びする。写真幅(351px)を上限に中央寄せし、写真と本文を
   まとめて見せる。狭い画面では画面幅に従い自然に全幅表示になる。
   .message_greeting 限定なので location/quality(画像のみ)には影響しない。 */
@media only screen and (max-width: 1100px) {
  .company_box01.message_greeting .recruit_top .right_box {
    max-width: 351px;
    margin-left: auto;
    margin-right: auto;
  }
}

/* =============================================================
   品質ページ(quality) 追加調整
   ============================================================= */

/* (B) What is ISO 9001? / ISO 14001? セクションの余白縮小
   .service_item02_wrap は背景の大きな飾り文字用に上下padding
   (上90〜170px / 下70〜120px)が確保されているが、quality内の
   ISO説明セクションでは余白が過大なので、PC・スマホとも縮小する。
   quality.phpのISOセクションに付与した .quality_iso で限定するため
   service ページ等には影響しない。 */
.quality_iso.service_item02_wrap {
  padding-top: clamp(50px, 35.000px + 3.75vw, 80px);
  padding-bottom: clamp(40px, 28.000px + 3vw, 64px);
}

/* (1) 文の間が広い対策(縦積み帯 max-width:999px をカバー)
   .company_box01 .icon_area はPC/共通で車両装飾画像を絶対配置する
   ための大きな上下padding(上64〜180px等)が入っているが、quality
   ページの icon_area は車両画像が無くテキストのみのため過大な余白
   になる。quality の左右カラムが縦積みになる 999px 以下で余白を解消。
   PC横並び(1000px以上)では元の余白(0)のまま。 */
@media only screen and (max-width: 999px) {
  .company_box01.quality .icon_area {
    padding: 0;
  }

  .company_box01.quality .icon_area+.icon_area {
    padding-top: 20px;
  }

  /* SDGsアイコン(img_no_box)の横並び＋折り返し
     gap指定はあるがflex化されておらず縦積み・原寸で巨大化する。
     縦積みレイアウト帯(999px以下)で横並び4列に整える。 */
  .quality .img_no_box {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
  }

  .quality .img_no_box img {
    width: calc((100% - 30px) / 4);
    height: auto;
  }
}

/* =============================================================
   品質ページ(quality) ENVIRONMENTAL POLICY のタブレット重なり対策
   環境方針 dl の縦積み切替を 830px(location/profile_box01 と同じ
   境界)まで広げ、769〜833px帯で dt のピルと dd が重なる崩れを解消。
   ============================================================= */
@media only screen and (max-width: 830px) {
  .profile_box03.quality .inner02 dl {
    display: block;
  }

  .profile_box03.quality .inner02 dl dt {
    width: 100%;
    border-bottom: none;
    padding: 20px 0 10px;
  }

  .profile_box03.quality .inner02 dl dt span {
    margin: 0;
    min-width: 0;
    max-width: 240px;
  }

  .profile_box03.quality .inner02 dl dd {
    width: 100%;
    padding: 0 0 20px;
  }
}

/* スマホ時 環境方針の項目タイトル(dtのピル)をさらに小さく
   文字サイズ・パディング・最大幅を抑え、コンパクトに表示する。 */
@media only screen and (max-width: 600px) {
  .profile_box03.quality .inner02 dl dt span {
    font-size: 12px;
    max-width: none;
    width: auto;
    display: inline-block;
    padding: 8px 18px;
  }

  .profile_box03.quality .inner02 dl dt span.quality {
    line-height: 2.5;
  }

  .profile_box03.quality .inner02 dl dt span.quality br {
    display: none;
  }
}

.message_greeting .title02.sensing.text_s_blue.move {
  margin-top: 0;
  padding-top: 0;
}

.message_greeting .title02.sensing.move {
  margin-top: 0;
  padding-top: 0;
}

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

  .message2 .flex_row {
    flex-direction: column-reverse;
    padding: 40px 0;
    gap: 30px;
  }
}

/* =============================================================
   品質ページ(quality) recruit_top 構成 追加調整
   ============================================================= */

/* (1) PC時(横並び/1000px以上) left_box のテキスト上の余白を消す
   .recruit_top .title02 に margin-top:20px / padding-top:100px が
   付いており、左テキスト先頭に余白ができるため、PC時のみ解消する。
   quality限定。 */
@media only screen and (min-width: 1000px) {
  .company_box01.quality .recruit_top .left_box .title02 {
    margin-top: 0;
    padding-top: 0;
  }
}

/* (2) 769〜999px で right_box(画像)が中央寄せにならない対策
   この帯では max-width:351px が効くが margin-left:auto のみ残り
   右寄せになる。margin-right:auto も付けて中央寄せにする。 */
@media only screen and (min-width: 769px) and (max-width: 999px) {
  .company_box01.quality .recruit_top .right_box {
    margin-left: auto;
    margin-right: auto;
  }
}

/* (3) 環境方針 dt のピルが横並び帯(831〜1060px等)で dd と
   隣接し窮屈に見える対策。「環境マネジメント体制の構築」など
   長いピルを少し小さくし、さらに dt枠(30%)と dd枠(70%)が
   隣接して詰まるため、dd 側に左余白を足して間隔を確保する。
   横並びになる 830px 超〜PC で適用(縦積み帯は別途調整済み)。 */
@media only screen and (min-width: 831px) {
  .profile_box03.quality .inner02 dl dt span {
    min-width: 0;
    max-width: 200px;
    font-size: 13px;
    padding: 12px 16px;
  }

  .profile_box03.quality .inner02 dl dd {
    padding-left: 24px;
    box-sizing: border-box;
  }
}

/* location ページ left_box の title02 上余白消し */
.location .title02.sensing.move {
  margin-top: 0;
  padding-top: 0;
}

/* =============================================================
   所在地ページ(location) 拠点写真の中央寄せ(600px以下)
   profile_box01 の figure 内画像(336px固定/inline)が、縦積み時に
   figure 全幅に対して左寄せになり右に余白ができるため、600px以下で
   figure を text-align:center にして画像を中央寄せにする。
   profile_box01 は profileページでも使われるため、location の拠点
   固有クラス(.kyoto/.shonan/.kyushu)で限定し、profileには影響させない。
   ============================================================= */
@media only screen and (max-width: 600px) {

  .profile_box01.kyoto .flex_box>figure,
  .profile_box01.shonan .flex_box>figure,
  .profile_box01.kyushu .flex_box>figure {
    text-align: center;
  }
}


.privacypolicy {
  font-size: 14px;
}

/* =============================================================
   サービス3ページ(railway/marine/industrial-equipment)
   service_item02 の見出し・サブタイトルのSP中央寄せ
   SP(縦積み)時、title02 と subtitle が左寄せで、2行に折り返すと
   不格好になるため中央寄せにして「いい感じに2行」に整える。
   ============================================================= */
@media only screen and (max-width: 768px) {
  .service_item02 .left_box .title02 {
    text-align: center;
  }

  /* subtitle(ピル)はコンテンツ幅のまま、left_box内で中央配置にする。
     ピル内テキストは元から justify-content:center で2行でも中央。 */
  .service_item02 .left_box {
    text-align: center;
  }

  /* 本文(m30)は中央寄せだと読みにくいので左寄せに戻す。 */
  .service_item02 .left_box .m30 {
    text-align: left;
  }
}

/* =============================================================
   お問い合わせ(contact) Contact Form 7 の調整
   ============================================================= */

/* (1) 送信ボタン後の白い大きなスペース対策
   CF7 の応答メッセージ枠(.wpcf7-response-output)は、送信前で
   メッセージが空でも margin / border で領域を確保してしまい、
   ボタン下に大きな空白ができる。空のときは余白・枠線を消す。 */
.contact_section .wpcf7-response-output {
  margin: 1em 0 0;
  padding: 0.4em 1em;
}

.contact_section .wpcf7-response-output:empty {
  display: none;
  margin: 0;
  padding: 0;
  border: 0;
}

/* フォーム下部の余分な余白を詰める */
.contact_section .wpcf7 form .wpcf7-spinner {
  margin: 0 0 0 8px;
}

.contact_section .wpcf7 form p:last-child {
  margin-bottom: 0;
}

/* (2) 個人情報保護方針(同意文・リンク)を中央寄せ(PC)
   CF7 内のプライバシーポリシー同意文/送信ボタン段落を中央に。
   acceptance チェックや送信ボタンを含む段落を中央揃えにする。 */
.contact_section .wpcf7 form .wpcf7-acceptance,
.contact_section .wpcf7 form p:has(.wpcf7-submit),
.contact_section .wpcf7 form p:has(.wpcf7-acceptance) {
  text-align: center;
}

.contact_section .wpcf7 .wpcf7-list-item {
  margin-left: 0;
}

/* =============================================================
   サービスページ ヘッダー写真クレジットのSP余白
   .top-photo-credit がヘッダー画像下端ぎりぎりに接して窮屈なため、
   SP時に少し下げて余裕を持たせる(被り・近接の解消)。
   ============================================================= */
@media only screen and (max-width: 768px) {
  .top-photo-credit {
    padding-top: 4px;
    padding-right: 4px;
    padding-bottom: 4px;
  }
}

/* =============================================================
   下層ページのヘッダー画像(#page_title)を横いっぱいに伸ばす
   ・#page_title は max-width:1285px で頭打ちになり、1285px超の
   　画面で左右に大きな余白ができていた。最大幅の制限を解除し、
   　左右に25pxの余白だけ残してほぼ全幅に広げる。
   ・各ページ背景が background ショートハンドで指定されており
   　background-size が auto にリセットされて cover が効かないため、
   　改めて cover を指定して画像を全面に表示する。
   ・角は元のデザイン通り角丸を維持する。
   ・スマホ/タブレット(1100px以下)は既存CSSで width:95%/calc(100%-56px)
   　により左右余白＋中央寄せ済みのため、PC(1100px超)のみ全幅化する。
   #page_title はトップ以外の下層ページ専用のため、トップには影響しない。
   ============================================================= */
/* ・スマホ(768px以下)は既存CSSのまま(現状維持)、769px以上の
   　タブレット・PCで全幅化(左右25px余白・角丸)する。
   　既存の width:calc(100%-56px) / width:95% を確実に上書きするため
   　width を calc(100% - 50px) とし margin auto で左右25px対称にする。 */
@media only screen and (min-width: 769px) {
  #page_title {
    max-width: none;
    width: calc(100% - 50px);
    margin-left: auto;
    margin-right: auto;
    background-size: cover;
    background-position: center center;
    border-radius: clamp(20px, 10.588px + 2.941vw, 40px);
  }
}

/* 各ページの背景は #page_title.クラス の background ショートハンドで
   指定されており background-size が auto に戻るため、同じ詳細度で
   cover を上書きする(全幅・スマホ問わず画像を埋める)。
   ページ別クラスを個別列挙すると漏れる(profile/career/graduate等)ため、
   class属性を持つ #page_title すべてを属性セレクタでまとめて対象にする
   (#page_title[class] は #page_title.xxx と同詳細度で、後勝ちで効く)。 */
#page_title[class] {
  background-size: cover;
  background-position: center center;
}

/* =============================================================
   事業内容(BUSINESS OVERVIEW)の現在表示中ページ表示
   表示中の部門は VIEW MORE リンクではなく「CURRENT PAGE」の
   押せない表示(.btn02.is-current)にして誤クリックを防ぐ。
   通常ボタンと同じ形状・サイズで、色を抑え矢印を出さない。
   ============================================================= */
.btn02.is-current .text {
  width: 175px;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #d3d9e3;
  color: #fff;
  border: 3px solid #d3d9e3;
  border-radius: 50px;
  font-size: var(--font-size-sm);
  font-family: "Josefin Sans", sans-serif;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.6;
  cursor: default;
  padding-top: 4px;
  box-sizing: border-box;
}

/* =============================================================
   404ページ
   既存の下層ページデザインに合わせた最低限のスタイル。
   ヘッダーは背景画像がないため紺色の単色背景にする。
   ============================================================= */
#page_title.error404 {
  background: var(--color-primary);
}

.error404_section {
  text-align: center;
  padding-top: clamp(40px, 20px + 5vw, 80px);
  padding-bottom: clamp(40px, 20px + 5vw, 80px);
}

.error404_box {
  max-width: 800px;
  margin: 0 auto;
}

.error404_box .txt01 {
  margin-top: 24px;
}

.error404_btn {
  margin-top: 40px;
  display: flex;
  justify-content: center;
}

@media only screen and (min-width: 361px) {
  .br-360 {
    display: none;
  }
}

@media only screen and (max-width: 999px) {
  .company_box01.message_greeting .inner01 {
    flex-direction: column-reverse;
  }
}

@media only screen and (max-width: 600px) {
  .none-600 {
    display: none;
  }
}

@media only screen and (max-width: 600px) {
  .line-600 {
    line-height: 1;
  }
}



/* =============================================================
   スマホ ハンバーガーメニュー(nav_sp)の調整
   ============================================================= */
@media only screen and (max-width: 768px) {

  /* (1) メニュー項目の段落ち対策
     .nav_box_wrap が width:49%(2列)で狭く、「『住江工業』はこんな会社」
     等の長い項目が2行に折り返す。横幅を広げて(1列にして)1行で
     収まるようにする。 */
  #nav_sp .menu {
    flex-direction: column;
    flex-wrap: nowrap;
  }

  .nav_box_wrap {
    width: 100%;
  }

  /* (2) 翻訳ボタン(ページ上部に出るGoogle翻訳バナー等)とメニュー上部の
     ロゴが被るため、メニュー上部に余白を追加してロゴを下げる。 */
  .is-active#nav_sp {
    padding-top: clamp(80px, 60px + 8vw, 130px);
    padding-bottom: 250px;
  }

  /* (3) 画面下部に固定表示される翻訳バー(JA)と、メニュー下部の
     CONTACT ボタンが被るため、メニュー下部に余白を追加して
     CONTACT ボタンが翻訳バーに重ならないようにする。 */
  #nav_sp .btn01 {
    margin-bottom: clamp(70px, 50px + 6vw, 110px);
  }
}



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

  .sub_contact_row input,
  .sub_contact_row textarea,
  .entry-cf7 input[type=text],
  .entry-cf7 input[type=email],
  .entry-cf7 input[type=tel],
  .entry-cf7 textarea {
    font-size: 16px;
    height: auto;
    padding: 16px;
  }

  .sub_contact_row textarea {
    height: 160px;
  }

  .sub_req,
  .sub_any {
    height: 24px;
    font-size: 12px;
    width: 55px;
  }

  .sub_contact_row dt {
    font-size: 14px;
  }

  .sub_address_line label {
    font-size: 14px;
  }

}

/* =============================================================
   所在地ページ(location) SP時のマップと点線の被り解消
   各項目(.item)の区切り点線(border dashed)とマップ(.map)の上端が
   密着して被って見えるため、SP時にマップ上部へ余白を入れて離す。
   対象は /company/location/ のページ(マップは location のみで使用)。
   ============================================================= */
@media only screen and (max-width: 768px) {
  .profile_box01 .txtbox dl .item.map_item dd .map {
    margin-top: 20px;
  }
}

/* =============================================================
   社員インタビュー個別ページ Q&Aの「Q」円
   .question span(青い丸)は flex中央寄せだが padding-left:3px が
   入っているため Q が中央からずれて見える。左右paddingを0にして
   水平方向を中央に戻す(上のベースライン調整 padding-top は維持)。
   ============================================================= */
.question span {
  padding-left: 6px;
  padding-right: 0;
}


@media only screen and (min-width: 768px) {
  .news_box p span.date {
    width: 75px;
  }
}

@media only screen and (max-width: 767px) {
  .news_box p span.date {
    width: 65px;
  }
}

/* ===== 環境方針 ENVIRONMENTAL POLICY ===== */

/* リード文 */
.quality .quality_lead {
  margin-bottom: 8px;
  padding-bottom: 35px;
  border-bottom: 1px solid #153374;
}

/* リスト本体 */
.quality .quality_list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.quality .quality_list > li {
  display: flex;
  gap: 50px;                 /* 数字と本文の間隔を拡大 */
  padding: 24px 0;
  border-bottom: 1px solid #153374;
}

@media only screen and (max-width: 767px) {
.quality .quality_list > li {
  gap: 20px;                 /* 数字と本文の間隔を拡大 */

}
}



/* 丸数字 */
.quality .quality_list > li .num {
  flex-shrink: 0;
  width: 50px;
  height: 50px;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border-radius: 50%;
  background: #1B3C7F;
  color: #fff;
  font-family: "Josefin Sans", sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
  text-indent: 0;
  letter-spacing: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 本文 */
.quality .quality_list .txt {
  flex: 1;
}
.quality .quality_list .txt p {
  margin: 0;
  line-height: 1.9;
}

/* 入れ子リスト（1）2）3）） */
.quality .sub_list {
  list-style: none;
  margin: 8px 0 0;
  padding: 0;
}
.quality .sub_list li {
  line-height: 1.9;
}
.quality .sub_list .indent {
  display: inline-block;
  padding-left: 1em;
}

/* 末尾（開示文・日付・社名） */
.quality .quality_foot {
  margin-top: 24px;
}
.quality .quality_foot p {
  margin: 0;
  line-height: 1.9;
}
/* ===== 適用範囲 ===== */
.quality .scope-body .scope-lead {
  margin: 0 0 16px;
  line-height: 2.5;
  color: #fff;
}

.quality .scope-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.quality .scope-list > li {
  margin-bottom: 12px;
}
.quality .scope-list > li:last-child {
  margin-bottom: 0;
}
.quality .scope-item-ttl {
  margin: 0;
  line-height: 2.2;
  color: #fff;
}
.quality .scope-item-txt {
  margin: 0;
  padding-left: 1.5em;   /* 「：」以下を字下げ */
  line-height: 2.2;
  color: #fff;
}
.quality .scope-card {
  position: relative;       /* ラベルの基準にする */
  margin-top: 30px;         /* ラベルがはみ出す分の余白 */
  padding: 70px 80px;
}

.quality .scope-label {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);   /* 上辺中央にまたがせる */
}
.quality .scope-label span {
  display: inline-block;
  background: #fff;
  color: #1B3C7F;
  border-radius: 999px;
  padding: 12px 40px;
  font-weight: 700;
  white-space: nowrap;
}
/* 環境方針セクション 本文のウェイトを400に統一（タイトル・丸数字は除く） */
.quality .quality_lead,
.quality .quality_list .txt p,
.quality .sub_list li,
.quality .quality_foot p,
.quality .scope-body .scope-lead,
.quality .scope-item-ttl,
.quality .scope-item-txt {
  font-weight: 400;
}

.btn02 .btn-pdf {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;   /* アイコンの基準 */
}
.btn02 .btn-pdf__icon {
  position: absolute;
  left: 20px;           /* ボタン左端からの位置。お好みで調整 */
  width: 20px;
  height: auto;
}
/* SDGs宣言書ボタン PC時の上余白 */
.btn-sdgs.pc_tb {
  margin-top: 30px;   /* 余白量はお好みで調整 */
}
/* SDGs宣言書ボタン SP時は中央配置 */

@media only screen and (max-width: 767px) {
.btn-sdgs.sp {
  display: flex;
  justify-content: center;
  margin-top: 30px;
}
}


/* 環境方針リスト 最後の項目は下線を非表示 */
.quality .quality_list > li.quality_list__last {
  border-bottom: none;
}