/*
Theme Name:cyberdyne
Theme URI:
Description:WordPressテーマ「cyberdyne」子テーマです。
Template:solaris_tcd088
Author:Hayashi T.
Author URI:http://cyberdyne.jp/
Version:0.0.1
*/

:root {
  --color-brand: #0f80c5;
  --color-text: #0d131a;
  --color-muted: #a3a6aa;
  --color-head1: #5b5e65;
  --color-head: #47494e;
  --color-hover: #00466d;
  --color-hover-bg: rgba(15,128,197,0.2); /* ボタンhover */
  --color-toc: #a3a6aa;

  --width-main-col: 810px;
  --width-side-col: 300px;

  /* cdp要素 */
  --color-border: #e5e7eb; /* 枠線の薄グレー */
  --color-card: #ffffff; /* カード背景 */
  --color-card-alt: #f6f8fa; /* サムネ背景の淡色 */
  --radius: 12px;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 6px 16px rgba(0, 0, 0, 0.1);
  --ring: 0 0 0 3px rgba(0, 112, 164, 0.18);
}

/* ----------------------------------------------------------------------
-------------------------------------------------------------------------
style.css
-------------------------------------------------------------------------
---------------------------------------------------------------------- */
/* ----------------------------------------------------------------------
 基本設定
---------------------------------------------------------------------- */
body {
  font-family: "Inter", "Helvetica Neue", "FORM UDPGothic",
    "Hiragino Kaku Gothic ProN", "Yu Gothic UI", sans-serif !important;
  color: var(--color-text);
}

/* home page */
#home_contents {
  margin: 0 auto;
  padding: 0 58px 150px;
  max-width: 1280px;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}
@media screen and (max-width: 781px) {
  #home_contents {
    padding: 35px 20px 40px;
    display: block;
  }
}
@media screen and (max-width: 550px) {
  #home_contents {
    padding: 20px 20px 40px;
  }
}

/* レイアウト */
.pc #container {
  margin-top: 80px;
}
body.page #main_col {
  padding-top: 40px;
}
body.hide_sidebar #main_col {
  padding-top: 40px;
}
#main_contents:after {
  position:absolute;
  left: calc(var(--width-main-col) + 40px);
  content:'';
  width:1px;
  height:100%;
  background:#ddd;
}
#main_col {
	width:var(--width-main-col);
  padding:40px 0 0 0;
  margin:0 40px 0 0;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
#side_col { width:var(--width-side-col); }

/* サイドバーを非表示にする機能 */
#main_contents.single_col #main_col {
  margin: 0 auto;
  width: 100%;
  max-width: 950px;
  padding-left: 1em;
  padding-right: 1em;
}

/* デザインボタン */
.design_button {
  text-align: center;
  z-index: 10;
  position: relative;
  height: 50px;
}
.design_button a {
  display: inline-block;
  min-width: 260px;
  max-width: 100%;
  height: 50px;
  line-height: 50px;
  font-size: 16px;
  padding: 0 20px;
  position: relative;
  overflow: hidden;
  z-index: 3;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}

/* ----------------------------------------------------------------------
 トップページ　ヘッダーコンテンツ
---------------------------------------------------------------------- */
/* 親テーマのナビボタンは非表示にする */
#header_slider_nav_wrap {
  display: none;
}
#header_slider_wrap {
  aspect-ratio: 2;
  height: auto !important;
  max-height: 540px !important;
  /* min-height: 280px !important; */
  width: 100%;
}
#header_slider {
  aspect-ratio: 2;
  height: auto !important;
  max-height: 540px !important;
  /* min-height: 280px !important; */
  width: 100%;
}
#header_slider .item {
  aspect-ratio: 2;
  height: auto !important;
  max-height: 540px !important;
  /* min-height: 280px !important; */
  width: 100%;
}
#header_slider .desc {
  margin: 5px 0 0 0;
  position: relative;
}
.pc #header_slider .caption,
.mobile #header_slider .caption {
  width:100%;
  padding: 0 40px;
}
#header_slider .bg_image {
  width:100%;
  height:100%;
  position:absolute;
  top:0px;
  left:0px;
  z-index:1;
  background-position: left center !important;  /* 左端・上下中央 */
}
#header_slider .design_button {
  margin-top: 3em;
}

/* ナビゲーション */
#header_slider .slick-dots {
  display: none !important; /* 動画のみにするので 非表示*/
  position: absolute;
  bottom: 23px;
  left: 0px;
  width: 100%;
  z-index: 10;
  text-align: center;
}
#header_slider .slick-dots li {
  display: inline-block;
  width: 10px;
  height: 10px;
  margin: 0 10px;
  font-size: 10px;
}
#header_slider .slick-dots button {
  cursor: pointer;
  border: none;
  color: transparent;
  width: 14px;
  height: 10px;
  display: block;
  font-size: 0;
  background: none;
  position: relative;
}
#header_slider .slick-dots button::before {
  content: "";
  display: block;
  width: 11px;
  height: 11px;
  line-height: 10px;
  background: none;
  border: 1px solid #fff;
  border-radius: 100px;
  position: absolute;
  top: 0;
  left: 0;
}
#header_slider .slick-dots button:hover::before,
#header_slider .slick-dots .slick-active button::before {
  background: #ccc;
  border-color: #ccc;
}

#header_slider .item .catch span {
  font-size: clamp(24px, 2.5vw, 1em);
}
#header_slider .item .desc p {
  font-size: clamp(14px, 2vw, 1em);
}
@media screen and (max-width: 950px) {
  #header_slider .slick-dots {
    display: none !important;
  }
}
/* ----------------------------------------------------------------------
 トップページ　その他
---------------------------------------------------------------------- */
.tab_content_top .tab .item:hover {
  color: var(--color-text);
}

/* ----------------------------------------------------------------------
 ページヘッダー
---------------------------------------------------------------------- */
#page_header {
  height: auto !important;
  aspect-ratio: 2.5;
  max-height: 600px !important;
}

/* パンくずリンク */
.pc #bread_crumb {
  margin-top: 20px;
}
#bread_crumb li:after {
  color: var(--color-text);
}
#bread_crumb li.last {
  color: var(--color-text);
}
#bread_crumb li a {
  color: var(--color-text);
}
#bread_crumb li.home a:before {
  color: var(--color-text);
}

/* ----------------------------------------------------------------------
 プロジェクトアーカイブページ
---------------------------------------------------------------------- */
.project_list .desc {
  color: var(--color-text);
}

/* ----------------------------------------------------------------------
 サービス詳細ページ
---------------------------------------------------------------------- */
#service_banner .desc {
  color: var(--color-text);
}
#company_list .title {
  font-size: 120px;
}

/* ----------------------------------------------------------------------
 お知らせ詳細ページ
---------------------------------------------------------------------- */
#news_next_prev_post .title:after {
  color: var(--color-text);
}

/* ページナビ */
.page_navi {width:100%;}
.page_navi span {
  color: var(--color-text);
}
.page_navi span.current {
  border-color: var(--color-text);
}

/* アニメーションを無効化する */
#cd-newslist-archive.inview {
  opacity: 1; /* 最初から表示 */
  position: static; /* relative をリセット（必要なら） */
  top: auto; /* 移動を解除 */
  -webkit-transition: none !important;
  transition: none !important;
}
#cd-newslist-archive.inview.animate {
  opacity: 1; /* 最初から同じ */
  top: auto;
}

/* ----------------------------------------------------------------------
 ブログ詳細ページ
---------------------------------------------------------------------- */
#post_pagination p {
  color: var(--color-text);
}
#post_pagination p {
  background: var(--color-text);
  border-color: var(--color-text);
}
#post_pagination a:hover {
  background: var(--color-text);
  border-color: var(--color-text);
}

/* ナビゲーション */
#next_prev_post {
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
}
#next_prev_post .title {
  word-break: normal;
}
#next_prev_post .title:after {
  color: var(--color-text);
}

/* ----------------------------------------------------------------------
  ヘッダー
---------------------------------------------------------------------- */
/* ドロワーメニューを開いてウインドウ幅を広げた時に表示を復活させるための上書き */
.open_menu #header {
  opacity: 1 !important;
}

#header {
  z-index: 1000;
  background: #fff;
  position: fixed !important;
  top: 0px !important;
  left: 0px;
  width: 100%;
  height: 80px;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.15);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: none !important;
  transition: none !important;
}
#header:after {
  content: "";
  display: block;
  width: 100%;
  height: 80px;
  background: #fff;
  top: 0px;
  left: 0px;
  position: absolute;
  z-index: 1;
  -webkit-transition: none !important;
  transition: none !important;
}
@media screen and (max-width: 781px) {
  #header {
    z-index: 1000;
    height: 60px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: #fff;
  }
  #header:after {
    content: "";
    display: block;
    width: 100%;
    height: 60px;
    background: #fff;
    top: 0px;
    left: 0px;
    position: absolute;
    z-index: 1;
  }
}

#header.active:after {
  top: 0px;
}
#global_menu {
  padding-left: 30px !important;
}
#global_menu > ul > li > a {
  color: var(--color-text) !important;
}
#global_menu > ul > li.current-menu-item > a {
  color: var(--color-brand) !important;
}
#header_search_button:before {
  color: var(--color-text);
}
#header.active #header_search_button:before,
body.header_fix #header_search_button:before,
body.single #header_search_button:before {
  color: var(--color-text);
}

/* ヘッダーコンテンツを表示しない場合 */
body.no_index_header_content #header,
body.no_index_header_content.header_fix #header,
body.no_index_header_content.header_fix_mobile #header {
  border-bottom: 1px solid #ddd;
}
body.no_index_header_content #header_search_button:before {
  color: var(--color-text);
}

/* ----------------------------------------------------------------------
 フッター
---------------------------------------------------------------------- */
/* ページ上部へ戻るボタン（PC用） */
#return_top2 a:before {
  color: var(--color-text) !important;
}
/* ページ上部へ戻るボタン（モバイル用） */
#return_top a {
  background: var(--color-text);
}

/* SNSボタン（ヘッダーも共通） */
.sns_button_list.color_type2 li.twitter a:before {
  color: var(--color-text);
}
.sns_button_list.color_type2 li.tiktok a:before {
  color: var(--color-text);
}

#footer_menu .footer_menu {
 padding:0 28px 50px;
}
#footer_menu .footer_menu li.highlight {
  font-size:16px;
  font-weight:600;
  margin:20px 0 20px 0;
}
#footer_menu .footer_menu li.highlight a {
  color: var(--color-brand);
}
#footer_menu .footer_menu li.highlight a:hover {
  color: var(--color-hover);
}
@media screen and (max-width: 781px) {
  #footer_menu .footer_menu li.highlight {
    font-size:14px;
  }
}

/* ----------------------------------------------------------------------
 ウィジェット
---------------------------------------------------------------------- */
.p-dropdown__title {
  color: var(--color-text);
}
.p-dropdown__title::after {
  color: var(--color-text);
}

/* ----------------------------------------------------------------------
 searchページ
---------------------------------------------------------------------- */
#page_search_header .search_button label:before {
  color: var(--color-text);
}

/* ----------------------------------------------------------------------
 コメント
---------------------------------------------------------------------- */
#comment_tab li a,
#comment_tab li p {
  color: var(--color-text);
}
#comment_textarea textarea {
  color: var(--color-text);
}
#submit_comment {
  color: var(--color-text);
}

/* ----------------------------------------------------------------------
 WordPress プリセットスタイル
---------------------------------------------------------------------- */
.post_content p {
  line-height: 2.4;
  margin: 0 0 1.5em 0;
}
.post_content p:last-child {
  margin: 0;
}
.post_content h1,
.post_content h2,
.post_content h3,
.post_content h4,
.post_content h5,
.post_content h6 {
  clear: both;
  line-height: 1.7;
  margin: 0 0 1em 0;
  padding: 0;
  font-weight: 550;
  color: var(--color-head);
}
@media screen and (min-width: 769px) {
  .post_content :not(h2):not(h3):not(h4):not(h5):not(h6) + h2
 { margin-top: 80px; } 
  .post_content :not(h2):not(h3):not(h4):not(h5):not(h6) + h3,
  .post_content :not(h2):not(h3):not(h4):not(h5):not(h6) + h4,
  .post_content :not(h2):not(h3):not(h4):not(h5):not(h6) + h5,
  .post_content :not(h2):not(h3):not(h4):not(h5):not(h6) + h6
  { margin-top: 40px; } 
}
@media screen and (max-width: 781px) {
  .post_content h1,
  .post_content h2,
  .post_content h3,
  .post_content h4,
  .post_content h5,
  .post_content h6
  { margin:0 0 1em 0;
    color: var(--color-head);
  }

}

.post_content h1 {
  font-size: 46px !important;
  color: var(--color-head1);
  margin-bottom: 20px;
  text-align: center;
  margin-bottom: 1.5em;
}
.post_content h2 {
  font-size: 32px !important;
  color: var(--color-head1);
  text-align: center;
  margin-bottom: 1.5em;
}
.post_content h3 {
  font-size: 22px !important;
}
.post_content h4 {
  font-size: 120%;
}
.post_content h5 {
  font-size: 110%;
}
.post_content h6 {
  font-size: 100%;
}
.post_content p {
  line-height: 2 !important;
}

/* table */
.post_content table {
  margin: 0;
  width: 100%;
}
.post_content td, .post_content th {
  border:1px solid #ddd;
  padding:17px 30px;
  line-height:1.7;
  background:#fff;
}
.post_content th {
  background:#f7f7f7;
  font-weight: 550;
}


/* Cardlink style - カードリンクのスタイル */
.cardlink_title a {
  color: var(--color-text);
}

/* ----------------------------------------------------------------------
-------------------------------------------------------------------------
responsive.css
-------------------------------------------------------------------------
---------------------------------------------------------------------- */
/* ----------------------------------------------------------------------
 基本設定
---------------------------------------------------------------------- */
@media screen and (max-width: 781px) {
  .post_content h1 {
    font-size: 33px !important;
    color: var(--color-head1);
    margin-bottom: 20px;
  }
  .post_content h2 {
    font-size: 24px !important;
    color: var(--color-head1);
  }
  .post_content h3 {
    font-size: 18px !important;
  }
}
/* レイアウト */
@media screen and (max-width: 781px) {
  body.page #main_contents {
    padding-top: 20px;
    padding-bottom: 20px;
  }
}



/* ----------------------------------------------------------------------
 ページヘッダー
---------------------------------------------------------------------- */
.mobile #page_header {
  height: 400px;
}
@media screen and (max-width: 781px) {
  .mobile #page_header {
    aspect-ratio: 2.4 !important;
    height: auto !important;
  }
}
/* ----------------------------------------------------------------------
 ヘッダー
---------------------------------------------------------------------- */
.use_mobile_header_fix #header:after {
  content: "";
  display: block;
  width: 100%;
  height: 60px;
  background: var(--color-text);
  top: -60px;
  left: 0px;
  position: absolute;
  z-index: 1;
  -webkit-transition: none !important;
  transition: none !important;
}
.use_mobile_header_fix #header:after {
  content: "";
  display: block;
  width: 100%;
  height: 60px;
  background: var(--color-text);
  top: -60px;
  left: 0px;
  position: absolute;
  z-index: 1;
  -webkit-transition: none !important;
  transition: none !important;
}
#header.active:after {
  top: 0px;
}
.open_menu #header {
  opacity: 0;
}
.mobile body #header {
  position: fixed;
  top: 0px;
  left: 0px;
  -webkit-animation: none !important;
  animation: none !important;
}
.mobile body #header:after {
  top: 0px !important;
}
.mobile body.hide_global_menu #header {
  position: absolute;
}
.mobile body.hide_global_menu #header:after {
  display: none;
}
.mobile body.single {
  padding-top: 60px;
}
.mobile body.single #header:before {
  display: none;
}
.mobile body.single #header.active:after {
  display: block;
}
.mobile body {
  padding-top: 60px;
}
.mobile body.hide_header_image #header.active:after {
  display: block;
}
.mobile body.hide_header_logo.hide_global_menu.hide_header_image {
  padding-top: 0px;
}
.pc body.hide_header_image.header_fix { padding-top:0px; }


/* メニューボタン */
#global_menu_button span {
  width: 22px;
  height: 2px;
  background: var(--color-text) !important;
  display: block;
  position: absolute;
  -webkit-transition: none !important;
  transition: none !important;
}
/* ナビゲーション */
@media screen and (max-width: 781px) {
  #next_prev_post .title_area {
    color: var(--color-text);
  }
}

/* ----------------------------------------------------------------------
 その他
---------------------------------------------------------------------- */
/*  WordPress プリセットスタイル */
@media screen and (max-width: 781px) {
  .post_content td,
  .post_content th {
    line-height: 1.7;
    padding: auto;
  }
}

/* ----------------------------------------------------------------------
-------------------------------------------------------------------------
design-plus.css
-------------------------------------------------------------------------
---------------------------------------------------------------------- */
/* ----------------------------------------------------------------------
 Contactform - お問い合わせフォーム
---------------------------------------------------------------------- */
.wpcf7 {
  width: 100%;
  margin: 0 0 2.5em !important;
  padding: 0;
}
.wpcf7 form {
  margin: 0;
  padding: 0;
}
.wpcf7 p {
  display: inline;
  margin: 0;
}
.wpcf7 input,
.wpcf7 textarea {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  padding: 0.5em;
  border: 1px solid #ccc;
  line-height: 1.2;
}
.wpcf7 select,
.wpcf7 input[type="checkbox"],
.wpcf7 input[type="radio"] {
  width: auto;
  max-width: 97%;
  padding: 0.5em;
  border: 1px solid #ccc;
}
.wpcf7 .wpcf7-list-item-label {
  line-height: 1.2;
}
.wpcf7-select{
  line-height: 1.2;
  height: 2.4em;
  padding-right: 1em !important;
}
.wpcf7 .wpcf7-list-item {
  display: block;
}
.wpcf7 textarea {
  height: 300px;
}
.wpcf7 input:focus,
.wpcf7 textarea:focus {
  border: 1px solid #bbb;
  outline: solid rgba(61, 175, 247, 0.586);
}
.wpcf7 .wpcf7-submit,
.wpcf7 .wpcf7-previous {
  box-sizing: border-box;
  display: block;
  position: relative;
  width: 225px;
  height: 48px;
  margin: 30px auto 0;
  border: 1px solid var(--color-brand);
  color: var(--color-brand);
  background-color: #fff;
  font-size: 1em;
  line-height: 1.5;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}
.wpcf7 .wpcf7-submit:before,
.wpcf7 .wpcf7-submit:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.wpcf7 .wpcf7-submit:hover,
.wpcf7 .wpcf7-previous:hover {
  background-color: var(--color-brand);
  color: #ffffff;
}
.wpcf7 .wpcf7-submit .wpcf7-not-valid {
  background: pink;
}
.wpcf7 .wpcf7-submit .wpcf7-response-output {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  margin: 10px 0 0;
  padding: 8px 35px 8px 14px;
  border-radius: 4px;
}
.wpcf7 .wpcf7-submit .wpcf7-validation-errors {
  border: 1px solid #eed3d7;
  background-color: #f2dede;
  color: #b94a48;
}
.wpcf7 .wpcf7-submit .wpcf7-mail-sent-ok {
  border: 1px solid #bce8f1;
  background-color: #d9edf7;
  color: #3a87ad;
}
.wpcf7 br {
  display: none;
}
.wpcf7 form .wpcf7-response-output {
  margin: 2em 0.5em 2em;
  padding: 0;
  border: none;
  text-align: center;
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output {
  color: #dc3232;
  font-size: 1em;
}
/* エラーメッセージの上部を消去 */
.wpcf7 div.screen-reader-response {
  display: none;
}
/* エラーや注意メッセージのスタイル */
.wpcf7 .wpcf7-not-valid-tip {
  font-size:90%;
  color: #dc3232;
}
/* 「必須」部分のスタイリング */
.wpcf7 .required {
  font-size: 120%;
  color: red;
}

/* radio-tab ラップ時にタブ風にする */
.radio-tab {
  margin: 0 0 1em 0;
}
.radio-tab .wpcf7-radio {
  display: flex;
  width: 100%;
  border: 1px solid #ccc;
  border-radius: 6px;
  overflow: hidden;
}
.radio-tab .wpcf7-list-item {
  flex: 1; /* 均等割り */
  margin: 0;
}
.radio-tab .wpcf7-list-item label {
  display: block;
  width: 100%;
  height: 100%;
  text-align: center;
  padding: 10px 0;
  cursor: pointer;
  border-right: 1px solid #ccc;
  box-sizing: border-box;
  user-select: none;
}
/* 最後のタブは右境界線を消す */
.radio-tab .wpcf7-list-item.last label {
  border-right: none;
}
/* ホバー時 */
.radio-tab .wpcf7-list-item label:hover {
  background: var(--color-hover-bg);
}
/* ラジオボタン自体は非表示に */
.radio-tab input[type="radio"] {
  display: none;
}
/* 選択状態のタブ（:has() で親を装飾） */
.radio-tab .wpcf7-list-item:has(input[type="radio"]:checked) label {
  background: var(--color-brand, #0073aa);
  color: #fff;
  font-weight: bold;
}

/* ContactForm7のテーブル化レスポンシブ調整 */
/* テーブルを親要素の幅いっぱいに伸ばす */
.table-res-form {
  width: 100%;
}
/* thとtd内の余白指定 */
.table-res-form th,
.table-res-form td {
  padding: 18px 15px;
}
/* th（項目欄）*/
.table-res-form th {
  text-align: left;
}
/* お問い合わせ項目のセル高さ */
.table-res-form .inquiry-items {
  height: calc(2.4 * 10em);
}
.table-res-form label.address {
  display: block;
}
.table-res-form label.address:not(:first-child) {
  margin-top: 1em;
}
/* 法人名とお名前の横並び */
.table-res-form .your-name{
  display: flex;
  gap: 10px;
}
.table-res-form .your-name div {
  width: 100%;
}
/* 住所 */
.table-res-form input.postal-code {
  width: 8em;
  display: block;
}

/* モバイルの指定 */
@media only screen and (max-width: 781px) {
  /*thとtdをブロック化して幅100％にして縦積み*/
  .table-res-form th,
  .table-res-form td {
    display: block;
  }
  /*th（項目名）欄の不要な余白削除・テキスト左寄せ*/
  .table-res-form th {
    padding-top: 8px;
    padding-bottom: 8px;
    text-align: left;
    border-bottom: none;
  }
  /* 法人名とお名前を縦積み */
  .table-res-form .your-name {
    display: block;
  }
  /* 最後のセル以外は枠線を全部消す */
  .table-res-form tr:not(:last-child) td {
    border-top: none;
    border-bottom: none;
  }
  .table-res-form tr:last-child td {
    border-top: none;
  }
}


/* ----------------------------------------------------------------------
-------------------------------------------------------------------------
 自作のカスタマイズ
-------------------------------------------------------------------------
---------------------------------------------------------------------- */
/* ----------------------------------------------------------------------
 gridボックスをレスポンシブ対応させる 4>2>1
---------------------------------------------------------------------- */
.is-layout-grid {
  display: grid;
  row-gap: 80px;
  column-gap: 16px;
  margin: 0 auto 50px;
}
@media screen and (max-width: 950px) {
  .is-layout-grid {
    grid-template-columns: repeat(2, 1fr) !important; /* 2列 */
  }
}
@media screen and (max-width: 781px) {
  .is-layout-grid {
    grid-template-columns: 1fr !important; /* 1列 */
    row-gap: 30px;
  }
}

/* ----------------------------------------------------------------------
 ヘッダ画像がない時の余白調整
---------------------------------------------------------------------- */
h1.wp-block-heading,
h1.wp-block-post-title {
  margin-top: 20px;
}

/* ----------------------------------------------------------------------
 blog 記事
---------------------------------------------------------------------- */
/* 見出しサイズ調整 */
h1.entry-title {
  font-size: 24px !important;
}
.post-template-default .post_content a {
  color: var(--color-brand) !important;
}
.post-template-default .post_content a:hover {
  text-decoration: underline  !important;
}

/* ----------------------------------------------------------------------
 製品ページのカバーブロックの体裁
---------------------------------------------------------------------- */
/* 外側コンテナ：背景画像はインラインstyleで指定 */
.cd-block-overlay__container {
  position: relative;
  display: flex;
  align-items: center; /* 垂直方向の中央揃え */
  width: 100%;
  /* aspect-ratio はインラインstyleで付与 */
  background-position: center center; /* 初期値。上書きはインラインstyle */
  background-repeat: no-repeat;
  background-size: cover;
  margin: 2em 0;
}
.cd-block-overlay__right {
  justify-content: right; /* 水平方向の位置揃え */
}
.cd-block-overlay__left {
  justify-content: left; /* 水平方向の位置揃え */
}
/* オーバーレイ（アルファ対応） */
.cd-block-overlay__overlay {
  position: absolute;
  inset: 0;
  display: block;
  pointer-events: none;
  z-index: 1;
  background: transparent; /* インラインstyleで上書き */
}
/* 内側ラッパー：コンテンツ */
.cd-block-overlay__inner {
  position: relative;
  z-index: 2;
  padding: 0;
  display: flex;
  flex-direction: column;
  width: 40%;
}
.cd-block-overlay__inner p {
  font-size: 15px;
  line-height: 1.7em !important;
  margin-bottom: 0.5em;
}
.cd-block-overlay__inner ul,
.cd-block-overlay__inner ol {
  margin-bottom: 0.5em !important;
}
.cd-block-overlay__inner li {
  font-size: 15px;
  line-height: 1.7em !important;
  margin-bottom: 0;
}
.cd-block-overlay__inner h3 {
  font-size: 20px;
  margin-bottom: 16px;
}
.cd-block-overlay__inner div.footnote {
  margin: 0 0 1em 0;
}

/* PC（デフォルト）ではコンテナの背景を使い、メディア要素は非表示 */
.cd-block-overlay__media {
  display: none;
}

/* スマホ設定 */
@media screen and (max-width: 800px) {
  /* コンテナの背景を無効化し、画像はメディア要素で表示 ブロックは縦積み*/
  .cd-block-overlay__container {
    display: flex; /* 継続してOK */
    flex-direction: column; /* 縦積み */
    align-items: stretch; /* 横幅いっぱいに */
    justify-content: flex-start; /* 上から配置 */
    background-image: none !important;
    margin-bottom: 2em;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 3px 9px 0px;
  }
  .cd-block-overlay__right,
  .cd-block-overlay__left {
    justify-content: flex-start !important;
  }
  .cd-block-overlay__media {
    display: block;
    width: 100%;
    aspect-ratio: 36 / 25 !important; /* 24/10 の横を 3/5 にした比率 */
    background-repeat: no-repeat;
    background-size: calc(5/3 * 100%) auto !important; /* 横を5/3倍 → 見える横幅が3/5になる */
    /* aspect-ratio と background-position はインラインstyleで付与 */
  }
  /* オーバーレイは重ねない */
  .cd-block-overlay__overlay {
    display: none;
  }
  .cd-block-overlay__inner {
    padding: 1em;
    width: auto;
  }
  .cd-block-overlay__inner h3 {
    margin-bottom: 10px;
  }
}

/* ----------------------------------------------------------------------
 固定ページのセクション
---------------------------------------------------------------------- */
article section:first-of-type {
  margin-top: 48px;
}
section {
  margin: 80px 0 0 0;
}

/* ----------------------------------------------------------------------
 共用要素のスタイル
---------------------------------------------------------------------- */
/* 連続文字列を改行させる (長いURLを改行させる) */
.text-break {
  overflow-wrap: anywhere;
}
/* 改行禁止 */
.nowrap {
  white-space: nowrap;
}
/* 記号なしリスト */
.no-bullet {
  list-style-type: none !important;
  margin: 0 !important;
}
/* コラム縦積みで逆順にする */
@media screen and (max-width: 781px) {
  .column-reverse {
    flex-direction: column-reverse;
}
}
/* 画像の中央揃え */
.aligncenter img {
  display: block;
  margin-left: auto !important;
  margin-right: auto !important;
}
/* 下に余白追加 (カラムなどで使用) */
.add-margin-bottom {
  margin-bottom: 4em;
}
/* 外部リンクのアイコンを付与 */
.extlink::after {
  font-family: "Material Symbols Outlined";
  content: "open_in_new"; /* Material Symbol のアイコン名 */
  font-size: 0.8em;
  margin-left: 0.2em;
  vertical-align: text-top;
  /* Material Symbols のバリアブル設定 */
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
}

/* 画像の処理 */
img {
  pointer-events: none; /* 画像へのマウスイベントを無効化 */
  -webkit-user-drag: none; /* Safari系のドラッグ保存抑止 */
  user-select: none; /* 選択不可（テキスト選択経由のコピー抑止の一助）*/
}
/* 区切り線 */
hr {
  border-top: 1px solid #ddd !important;
  width: 80%;            /* 幅 */
  margin: 2em auto;      /* 上下の余白＋中央揃え */
}
/* ----------------------------------------------------------------------
 wordpress標準ボタン
---------------------------------------------------------------------- */
/* Gutenberg button: .action 相当のホバーアニメーション */
.wp-block-button .wp-block-button__link {
  /* 矢印用の右余白 */
  --button-arrow-space: 3.8rem;
  --button-arrow-offset-x: 1.6rem; /* 矢印の右オフセット */
  --button-arrow-offset-y: 50%;    /* 矢印のY位置（デフォルトは中央） */

  /* ここでボタン色をカスタマイズ可能（必要なら上書き） */
  --action-color: var(--color-brand);
  --action-color-hover: #ffffff;
  --action-background-color: transparent;
  --action-background-color-hover: var(--color-brand);
  --action-border-color: var(--color-brand);
  --action-border-color-hover: var(--color-brand);

  /* current-* に寄せておく（元CSSの構造を踏襲） */
  --current-action-color: var(--action-color);
  --current-action-color-hover: var(--action-color-hover);
  --current-action-background-color: var(--action-background-color);
  --current-action-background-color-hover: var(--action-background-color-hover);
  --current-action-border-color: var(--action-border-color);
  --current-action-border-color-hover: var(--action-border-color-hover);

  position: relative;
  display: inline-flex;
  align-items: center;

  min-height: 3.6rem;

  color: var(--current-action-color);
  background-color: var(--current-action-background-color);
  border: 1px solid var(--current-action-border-color);
  border-radius: 0px;

  padding: 0 1.6rem;
  padding-right: var(--button-arrow-space); /* 右だけ矢印ぶんの余白 */

  white-space: nowrap;
  line-height: 1.2;
  font-size: 1em;

  /* WPテーマが text-decoration を付ける場合があるので */
  text-decoration: none;

  transition:
    color .3s ease-in-out,
    background-color .3s ease-in-out,
    border-color .3s ease-in-out;
}

/* hover / focus */
.wp-block-button .wp-block-button__link:hover,
.wp-block-button .wp-block-button__link:focus-visible {
  color: var(--current-action-color-hover);
  background-color: var(--current-action-background-color-hover);
  border-color: var(--current-action-border-color-hover);
  filter: brightness(1.03);
}

/* キーボード操作時の視認性 */
.wp-block-button .wp-block-button__link:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}

/* 矢印本体 */
.wp-block-button .wp-block-button__link::after {
  content: "";
  position: absolute;
  right: var(--button-arrow-offset-x);
  top: var(--button-arrow-offset-y);

  /* 矢印の寸法高さ */
  height: 0.9em;
  /* viewBoxの比率に合わせて横幅を指定 */
  width: 1.26em;

  background-color: currentColor;

  /* 初期位置（上下中央揃え + 横移動0） */
  transform: translateY(-50%) translateX(0); /* デフォルトは中央基準 */

  /* あなたのSVGをそのままマスク化（点の位置関係は不変） */
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 10'%3E%3Cpath d='M0 5H13 M8 0L13 5L8 10' fill='none' stroke='%23000' stroke-width='0.7' stroke-linecap='butt' stroke-linejoin='miter'/%3E%3C/svg%3E") no-repeat center / contain;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 10'%3E%3Cpath d='M0 5H13 M8 0L13 5L8 10' fill='none' stroke='%23000' stroke-width='0.7' stroke-linecap='butt' stroke-linejoin='miter'/%3E%3C/svg%3E") no-repeat center / contain;

  transition:
    transform .3s ease-in-out,
    background-color .3s ease-in-out;
}

/* file_icon を付けたボタンは矢印の代わりにファイルアイコンを表示 */
.wp-block-buttons.file_icon .wp-block-button__link::after,
.wp-block-button.file_icon .wp-block-button__link::after {
  content: "docs";
  font-family: "Material Symbols Outlined";
  font-size: 1.4em;
  line-height: 1;
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;

  display: inline-block;
  width: auto;
  height: auto;
  background-color: transparent;

  -webkit-mask: none;
  mask: none;

  position: absolute;
  right: var(--button-arrow-offset-x);
  top: 50%;
  transform: translateY(-50%);
}
.wp-block-buttons.file_icon .wp-block-button__link:hover::after,
.wp-block-buttons.file_icon .wp-block-button__link:focus-visible::after,
.wp-block-button.file_icon .wp-block-button__link:hover::after,
.wp-block-button.file_icon .wp-block-button__link:focus-visible::after {
  transform: translateY(-50%);
}

/* 複数行ボタン（.multi-line） */
/* .multi-line を wp-block-button 側 or link 側どちらに付けても動くように */
.wp-block-button.multi-line .wp-block-button__link,
.wp-block-button .wp-block-button__link.multi-line {
  /* 1行固定を解除して折り返し可能に */
  white-space: normal;

  /* テキスト→矢印の順で縦並び（矢印は必ず次行へ） */
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  text-align: left;

  /* 右paddingを左と同じに戻す（= 矢印分の余白は取らない） */
  padding-left: 1.6rem;
  padding-right: 1.6rem;

  /* 複数行でも窮屈にならないように上下余白を確保 */
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}

.wp-block-button.multi-line .wp-block-button__link::after,
.wp-block-button .wp-block-button__link.multi-line::after {
  /* 絶対配置をやめて、リンク内の「次行」に配置する */
  position: static;
  top: auto;
  right: auto;
  bottom: auto;

  /* もとの中央揃え transform を解除 */
  transform: none;

  /* 矢印を右寄せして、次行の右側に置く */
  align-self: flex-end;
  margin-top: 0.5rem;
}

.wp-block-button.multi-line .wp-block-button__link:hover::after,
.wp-block-button.multi-line .wp-block-button__link:focus-visible::after,
.wp-block-button .wp-block-button__link.multi-line:hover::after,
.wp-block-button .wp-block-button__link.multi-line:focus-visible::after {
  transform: translateX(4px);
}

@media screen and (max-width: 781px) {
  .wp-block-button .wp-block-button__link {
    min-height: 3rem;
    padding-left: 1rem;
    padding-right: var(--button-arrow-space);
    padding-top: 0;
    padding-bottom: 0;
  }

  /* mobileでは .multi-line を従来型（1行ボタン）に揃える */
  .wp-block-button.multi-line .wp-block-button__link,
  .wp-block-button .wp-block-button__link.multi-line {
    white-space: nowrap;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    text-align: center;

    /* 従来型のpaddingに戻す（右は矢印ぶん確保） */
    padding-left: 1rem;
    padding-right: var(--button-arrow-space);
    padding-top: 0;
    padding-bottom: 0;
  }

  .wp-block-button.multi-line .wp-block-button__link::after,
  .wp-block-button .wp-block-button__link.multi-line::after {
    position: absolute;
    right: var(--button-arrow-offset-x);
    top: 50%;
    bottom: auto;

    /* 従来型の中央基準に戻す */
    transform: translateY(-50%) translateX(0);
    margin-top: 0;
    align-self: auto;
  }

  .wp-block-button.multi-line .wp-block-button__link:hover::after,
  .wp-block-button.multi-line .wp-block-button__link:focus-visible::after,
  .wp-block-button .wp-block-button__link.multi-line:hover::after,
  .wp-block-button .wp-block-button__link.multi-line:focus-visible::after {
    transform: translateY(-50%) translateX(4px);
  }
}

/* ファイルのタイトル文字サイズをデフォルトに */
.wp-block-file:not(.wp-element-button) {
  font-size:1em;
  line-height: 1.7em;
}
/* 添付ファイルのファイルサイズ表示 */
.file_size {
  font-size: 0.9em !important;
  color: var(--color-head) !important;
}

/* 定義リストの高さ調整 */
dl dt {
  line-height: 1em !important;
}
/* 横並び定義リスト */
dl.inline-dl {
  display: grid;
  grid-template-columns: fit-content(12em) 1fr; /* dt列幅 / dd列 */
  column-gap: 2em;
  row-gap: 0.5em;
}

dl.inline-dl dt,
dl.inline-dl dd {
  margin: 0;
  line-height: 1.5em !important;
}
@media screen and (max-width: 781px) {
  dl.inline-dl {
    grid-template-columns: 1fr; /* 1列に */
  }
}

/* ----------------------------------------------------------------------
 注釈・脚注用のスタイル
---------------------------------------------------------------------- */
/* 段落形式のラッパー */
div.footnote {
  margin-top: 1em;
  margin-bottom: 2em;
}
div.footnote_close {
  margin-top: -1.5em;
  margin-bottom: 2em;
}
/* 段落形式の段落 */
p.footnote,
div.footnote p,
div.footnote_close {
  font-size: 90%;
  line-height: 1.7 !important;
}
/* リスト形式 */
ul.footnote {
  font-size: 90%;
  line-height: 1.7 !important;
  list-style-type: none !important;
}
/* 複数注釈を意図した表形式 */
.footnote table {
  margin: 0.5em 0;
  border-collapse: collapse;
  border-spacing: 0;
}
.footnote table tr th,
.footnote table tr td {
  font-size: 90% !important;
  background-color: #fff !important;
  font-weight: normal !important;
  border: none !important;
  padding: 4px 0 !important;
}
.footnote table tr th {
  white-space: nowrap;
}
.footnote table tr td:not(:first-child) {
  padding-left: 1em !important;
  width: 100% !important;
}
/* ----------------------------------------------------------------------
 ニュースの見出し的段落スタイル
---------------------------------------------------------------------- */
p.news-section-label {
  margin-top: 2em;
  margin-bottom: .5em;
  font-weight: 700;
}
/* ----------------------------------------------------------------------
 Flexible Table 横スクロールで固定セルの線が消えないようにする処理
---------------------------------------------------------------------- */
table.is-sticky-first-column th:first-child {
  position: sticky;
  left: 0;
  white-space: nowrap;
  background: none;
  border-left: none !important;
  border-right: none !important;
}
table.is-sticky-first-column th:first-child:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: calc(100% - 1px);
  height: 100%;
  border-left: 1px solid #ddd;
  border-right: 1px solid #ddd;
  background: #f7f7f7;
  z-index: -1;
}

/* ----------------------------------------------------------------------
search.php のスタイル
---------------------------------------------------------------------- */
/* タイトルと検索フォーム */
#search_result_header {
  box-sizing:border-box;
  padding: 0 60px;
  max-width:1150px;
  margin: 120px auto 0;
}
.mobile #search_result_header{
  margin-top: 40px;
}
@media screen and (max-width:950px) {
	#search_result_header {
    margin-top: 40px;
    padding: 0 40px;
  }
}
@media screen and (max-width:750px) {
  #search_result_header {
    padding: 0 20px;
  }
}

/* 検索フォーム全体 */
#search_form {
  width: 100%;
  max-width: 800px;
  margin: 20px auto;
}
#search_form form {
  display: flex;
  border: 1px solid #ccc;
  border-radius: 0px;
  overflow: hidden;
}

/* 入力欄 */
#search_form .search_input {
  flex: 1;
  padding: 12px 16px;
  font-size: 16px;
  border: none;
  outline: none;
}

/* 検索ボタン */
#search_form .search_button {
  width: 60px;
  background: #666; /* ボタン背景色、後で変更可 */
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

/* アイコン */
#search_form .search_icon {
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 2px solid #fff; /* 色は後で変更 */
  border-radius: 50%;
  position: relative;
}

#search_form .search_icon::after {
  content: "";
  position: absolute;
  right: -6px;
  bottom: -6px;
  width: 10px;
  height: 2px;
  background: #fff; /* 色は後で変更 */
  transform: rotate(45deg);
}

/* 結果枠組み */
.pc #blog_archive,
.mobile #blog_archive {
  border-top: 1px solid #ddd;
  border-left: none;
  border-right: none;
}

#blog_list .item {
  height:auto;
  position:relative;
  border-bottom:1px solid #ddd;
  padding: 20px 60px;
  display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex;
  -ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
.pc #blog_list .image_link,
.mobile #blog_list .image_link {
  display:block;
  width:240px;
  height:135px;
}
.pc #blog_list .content,
.mobile #blog_list .content {
  height:auto;
  width:calc(100% - 240px);
  position:relative;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
.pc #blog_list .content{
  padding-left:60px;
}
#blog_list .meta { margin-bottom: 0px; }
@media screen and (max-width:950px) {
	#blog_list .item {
    height:auto !important;
    padding:40px;
  }
  #blog_list .image_link { padding-right:20px; height:135px; }
  #blog_list .content { padding-left:20px; height:auto; }
}
@media screen and (max-width:750px) {
  #blog_list .image_link { display: none !important; }
  #blog_list .content { width: 100% !important; }
  #blog_list .meta { margin-bottom:0 !important; }
  #blog_list .desc { display:block !important; margin:7px 0 0 0; }
}

/* ----------------------------------------------------------------------
 [bogo] のスタイル
---------------------------------------------------------------------- */
#bogo_box {
  margin: 0;
  padding: 0 0.1em;
  border: 0;
  outline: 0;
  text-align: center;
  vertical-align: middle;
  position: absolute;
  right: 80px;
  top: 0px;
  bottom: 0px;
  z-index: 100;
  display: flex;
  justify-content: center;
  align-items: center;
}
.mobile #bogo_box {
  right: 60px;
}

#bogo_box .bogo-language-switcher li {
  margin: 5px 0;
}
.mobile .bogo-language-switcher li {
  margin: 3px 0;
}

.bogo-language-name {
  font-size: 12px;
  font-weight: 600;
  color: var(--color-muted);
}
.mobile .bogo-language-name {
  font-size: 11px;
  font-weight: 600;
}
.bogo-language-name > a {
  color: var(--color-text) !important;
}
.bogo-language-name > a:hover {
  color: var(--color-brand) !important;
}

/* ----------------------------------------------------------------------
 [toc] ページ内目次のスタイル
---------------------------------------------------------------------- */
ul.toc_list {
  font-size: 14px;
  display: grid;
  gap: 1em;
  /* 各要素は最小180px、最大で余白いっぱい */
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  margin: 64px 0 !important;
  padding: 0;
  list-style: none !important;
}
ul.toc_list li a {
  border-bottom: 1px solid var(--color-toc);
  text-align: center;
  position: relative;
  box-sizing: border-box;
  display: block;
  height: 100%;
  padding-left: 22px !important;
  padding-right: 12px !important;
  padding-top: 6px;
  padding-bottom: 6px;
  overflow-wrap: break-word; /* 長い単語を折り返す */
  white-space: nowrap;
  color: var(--color-text);
}
ul.toc_list li a:before {
  content: "";
  width: 8px;
  height: 8px;
  border: 0;
  border-bottom: solid 1px var(--color-toc);
  border-right: solid 1px var(--color-toc);
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  left: 6px;
  bottom: 0;
  margin: auto;
}
ul.toc_list li a:hover {
  border-color: var(--color-brand);
  color: var(--color-brand);
}
ul.toc_list li a:hover:before {
  border-color: var(--color-brand);
}
@media screen and (max-width: 781px) {
  ul.toc_list {
    flex-wrap: wrap;
  }
  ul.toc_list li {
    flex: 0 0 calc(33.333% - 2.67px); /* 親幅の50%に固定 */
    box-sizing: border-box;
  }
  ul.toc_list li a {
    padding-top: 10px;
    padding-bottom: 10px;
  }
}

/* ----------------------------------------------------------------------
 [contact_info]
---------------------------------------------------------------------- */
#contact_info {
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-width: 480px;
  margin: 0 auto;
}
#contact_info * {
  box-sizing: border-box;
}
#contact_info .contact-card {
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  padding: 20px 24px;
  background: var(--color-brand);
  color: #fff;
  text-decoration: none;
  border-radius: 2px;
  transition: transform 0.06s ease, filter 0.2s ease;
}
#contact_info .contact-card:hover {
  filter: brightness(1.1);
}
#contact_info .contact-card:active {
  filter: brightness(0.98);
}
#contact_info .contact-card__title {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 8px;
}
#contact_info .contact-card__number {
  font-size: 26px;
  font-weight: 700;
  align-items: center;
}
#contact_info .contact-card__form {
  font-size: 22px;
  font-weight: 800;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
/* アイコン */
#contact_info .contact-icon {
  font-size: 1.1em;
  line-height: 1;
  margin-right: 6px;
}
@media screen and (max-width: 781px) {
  #contact_info .contact-card__title {
    font-size: 16px;
  }
  #contact_info .contact-card__number {
    font-size: 23px;
  }
  #contact_info .contact-card__form {
    font-size: 20px;
  }
  #contact_info .contact-icon {
    font-size: 1em;
    margin-right: 4px;
  }
}

/* ----------------------------------------------------------------------
 [cd_tagline] 見出しにしないタグライン
---------------------------------------------------------------------- */
.cd_tagline {
  font-size: 140%;
  font-weight: 550;
  color: var(--color-head);
  margin-bottom: 12px;
  line-height: 1.6;
}

/* ----------------------------------------------------------------------
 [cd_badge] バッジ文字列
---------------------------------------------------------------------- */
.cd_badge {
  margin: -12px auto 10px 0 !important;
  line-height: 1em;
  padding: 0.5em 1em;
  border: 1px solid var(--color-brand);
  border-radius: 100px;
  background-color: #fff;
  color: var(--color-brand);
  font-size: 12px;
  width: fit-content;
}
.mobile .cd_badge {
  margin: -5px auto 5px 0 !important;
}
@media screen and (max-width: 781px) {
  .cd_badge {
    margin: 0 auto 5px 0 !important;
  }
}

/* ----------------------------------------------------------------------
 ブログアーカイブページ, [cd-newsfeed]
---------------------------------------------------------------------- */
#cd-newslist-archive {
  border-left: none;
  border-right: none;
}

#cd-newsfeed-container {
  max-width: 1150px;
  margin: 0 auto;
}
#cd-newsfeed {
  margin: 24px 0 !important;
}
/* ブログ記事一覧 */
#cd-newslist .item,
#cd-newsfeed .item {
  height: auto;
  position: relative;
  border-bottom: 1px solid #ddd;
  padding: 18px 0 17px;
  display: flex;
  display: -ms-flexbox;
  display: -webkit-flex;
  -ms-flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  align-items: center;
  row-gap: 12px;
  column-gap: 16px;
}
#cd-newslist .meta,
#cd-newsfeed .meta {
  display: flex;
  column-gap: 16px;
  padding: 0px;
  margin: 0px;
}
#cd-newslist .category,
#cd-newsfeed .category {
  font-size: 12px;
  line-height: 24px;
  color: #fff;
  display: flex;
  flex-direction: column;
  row-gap: 4px;
}
#cd-newslist .category span,
#cd-newsfeed .category span {
  text-align: center;
  border-radius: 30px;
  height: auto;
  width: 13ch;
  padding: 0 10px;
  display: inline-block;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  white-space: nowrap;
  flex-shrink: 0;
}
#cd-newslist .date,
#cd-newsfeed .date {
  font-size: 16px;
  color: #333;
  position: relative;
  height: auto;
  width: 10ch;
  line-height: 24px;
  font-family: "Arial" !important;
  display: flex;
  align-items: center;
}
#cd-newslist .title,
#cd-newsfeed .title {
  font-weight: 400;
  line-height: 1.6;
  max-height: none;
  overflow: visible;
  visibility: visible;
  overflow-wrap: break-word;
  word-break: auto-phrase;
}
/* blog_list のcategory-nav ボックス*/
.post_content .category-nav, 
.category-nav {
  display: flex;
  gap: 48px; /* タブ間の余白 */
  list-style: none;
  padding: 0;
  margin: 3em 0;
  border-bottom: 1px solid #d9d9d9; /* 全体の薄い下線 */
}
.post_content .category-nav ul,
.category-nav ul {
  list-style-type: none !important;
}
/* liはレイアウト専用 */
.category-nav li {
  margin: 0;
}

/* ボタン風の見た目 */
.category-nav li a {
  position: relative;
  display: inline-block;
  padding: 12px 0 14px;
  font-size: 16px;
  font-weight: 500;
  color: #333;
  text-decoration: none;
  transition: color 0.2s ease;
}

/* 非アクティブ時の下線 */
.category-nav a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 100%;
  height: 2px;
  background-color: transparent;
  transition: background-color 0.2s ease, height 0.2s ease;
}

/* ホバー時の効果 */
.category-nav li a:hover {
  color: var(--color-brand);
}
.category-nav li a:hover::after {
  background-color: var(--color-brand);
}

/* 選択された時の見た目 */
.category-nav li.active a {
  color: var(--color-brand);
}
.category-nav li.active a::after,
.category-nav a[aria-current="page"]::after {
  background-color: var(--color-brand);
  height: 4px; /* アクティブ時だけ太く */
}

/* ------------------------------
   category-nav: mobile（縦積み）
   - 横スクロールは避け、縦リストに
   - 下線は「左側の縦線」で状態を表現
------------------------------ */
@media screen and (max-width: 781px) {
  .post_content .category-nav, 
  .category-nav {
    flex-direction: column;
    gap: 0;
    margin: 1.5em 0;

    /* 下線（横）をやめて左の縦ラインに */
    border-bottom: none;
    border-left: 2px solid #d9d9d9;
    padding-left: 0;
  }

  .category-nav li {
    margin: 0;
  }

  .category-nav li a {
    display: block;
    padding: 12px 0 12px 14px;
    font-size: 15px;
    line-height: 1.6;

    /* モバイルでは改行は許容（縦積み前提） */
    white-space: normal;
  }

  /* 横下線 → 左の縦線へ変更 */
  .category-nav a::after {
    left: -2px;          /* 親のborder-leftに重ねる */
    top: 0;
    bottom: 0;
    width: 2px;
    height: 100%;        /* 行の高さいっぱい */
    transform: none;
    background-color: transparent;
  }

  .category-nav li.active a::after,
  .category-nav a[aria-current="page"]::after {
    width: 4px;
    height: 100%;       /* 常に行高フル */
    left: -2px;
    background-color: var(--color-brand);
  }

  /* 各行の区切り（任意：清潔感） */
  .category-nav li + li a {
    border-top: 1px solid #eee;
  }
}

/* ----------------------------------------------------------------------
 スマホ対応
---------------------------------------------------------------------- */
@media screen and (max-width: 950px) {
  #cd-newslist .item,
  #cd-newsfeed .item {
    height: auto !important;
    padding: 18px 0 17px !important;
  }
}
@media screen and (max-width: 781px) {
  #cd-newslist .item,
  #cd-newsfeed .item {
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    row-gap: 5px;
    padding: 18px 0 12px !important;
  }
  #cd-newslist .meta,
  #cd-newsfeed .meta {
    column-gap: 10px;
  }
  #cd-newslist .date,
  #cd-newsfeed .date {
    font-size: 13px;
    line-height: 22px;
  }
  #cd-newslist .category,
  #cd-newsfeed .category {
    font-size: 11px;
    line-height: 20px;
    flex-direction: row;
    column-gap: 5px;
    padding: 1px 5px 0;
  }
  #cd-newslist .title,
  #cd-newsfeed .title {
    width: 100%;
    flex: auto;
  }
}

/* ----------------------------------------------------------------------
 cd-newslist のスタイル
---------------------------------------------------------------------- */
#cd-newslist-container {
  max-width: 1050px;
  margin: 0 auto;
  padding: 40px 0 150px;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}
.mobile #cd-newslist-container {
  width: auto;
  padding: 20px 20px 60px;
  margin: 0 auto;
  display: block;
}
@media screen and (max-width: 900px) {
  #cd-newslist-container {
    padding: 80px 20px 40px;
    display: block;
  }
}
.mobile body.one_news_category {
  padding-top: 60px;
}

#cd-newslist-container article {
  width: 100%;
}

/* ----------------------------------------------------------------------
 会社情報・IR詳細ページ
---------------------------------------------------------------------- */
#cd-title-block {
  font-size: 26px;
  border-bottom: 1px solid #ddd;
  padding-right: 40px;
  margin: -40px -40px 40px 0;
  height: 159px;
  position: relative;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  text-align: center;
}
.mobile #cd-title-block {
  padding-right: 0px;
  margin:-40px 0 60px 0;
  height: auto;
}
#cd-title-block h1.wp-block-heading {
  bottom: -1px;
  font-size: 36px !important;
  line-height: 1.5;
  height: 156px;
  display: inline-block;
  position: relative;
  margin: 0 auto;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: -webkit-inline-flex;
  display: inline-flex;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-align-items: center;
  -webkit-align-items: center;
  align-items: center;
}

/* ----------------------------------------------------------------------
 ウィジェット
---------------------------------------------------------------------- */
/* カテゴリー一覧 */
.cd-menu-widget {
  border-bottom: none;
  padding: 0;
}
.cd-menu-widget .square-headline {
  display: block;
  height: 159px;
  padding-left: 30px;
  box-sizing: border-box;
  border-bottom: 1px solid #ddd;
  border-left: 1px solid #ddd;
  background-color: #fff;
  color: var(--color-brand);
  position: relative;
  z-index: 1;
}
.cd-menu-widget .square-headline:hover {
  background-color: var(--color-hover-bg);
}

.cd-menu-widget .square-headline .headline {
  font-size: 24px;
}
.cd-menu-widget .square-headline div.head {
  line-height: 1.5;
  position: absolute;
  top: 50%;
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.cd-menu-widget .square-headline div.head span {
  display: block;
}
.cd-menu-widget .square-headline div.head .sub_headline {
  font-weight: 500;
}
.cd-menu-widget ul {
  margin: 0;
  padding: 0;
  border: none;
}
.cd-menu-widget li {
  font-size: 16px;
  margin: 0;
  padding: 0;
  position: relative;
}
.cd-menu-widget > ul > li {
  border-bottom: 1px solid #ddd;
}
.cd-menu-widget ul.inpage{
  margin: -8px 0 13px 0;
  border-bottom: none;
}
.cd-menu-widget ul.inpage li {
  border-bottom: none;
}

.cd-menu-widget li a {
  display: block;
  background: #fff;
  border-bottom: none;
  padding: 0 15px 0 30px;
  overflow: visible !important;
  position: relative;
  width: 100%;
  height: 60px;
  line-height: 1.4em;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-justify-content: space-between;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-align-items: center;
  -webkit-align-items: center;
  align-items: center;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}
.cd-menu-widget li li a {
  padding-left: 49px;
  height: 54px;
}
.cd-menu-widget li li li a {
  padding-left: 63px;
  height: 54px;
}
.cd-menu-widget li a:hover {
  background-color: var(--color-hover-bg);
}
.cd-menu-widget li .title {
  display: block;
  overflow: visible;
  white-space: nowrap;
  text-overflow: ellipsis;
  -ms-flex: 1 0 auto;
  -webkit-flex: 1 0 auto;
  flex: 1 0 auto;
}
.cd-menu-widget li.current-menu-item > a {
  color:#fff;
  background-color: rgba(15,128,197,0.5);
  position: relative;
  pointer-events:none;
}
/* リンクなし中間見出し部 */
.cd-menu-widget .menu-heading-item {
  display: block;
  color:#444;
  background-color: #eee;
  text-align: center;
  font-weight: 600;
  font-size: 1em;
  padding: 6px 0;
}
/* モバイル用設定 */
.mobile .cd-menu-widget {
  margin-top:0px;
  border-top: 1px solid #ddd;
  border-left: 1px solid #ddd;
  border-right: 1px solid #ddd;
}
.mobile .cd-menu-widget .square-headline {
  border-left:none;
  height:auto;
  line-height:1;
  padding:0 20px;
  position:relative;
  z-index:2;
}
.mobile .cd-menu-widget .square-headline div.head {
  height:60px;
  line-height:60px;
  position:relative !important;
  top:auto;
  text-align: center;
  -ms-transform: translateY(0%); -webkit-transform: translateY(0%); transform: translateY(0%);
  display:-ms-flexbox; display:-webkit-flex; display:flex;
  -ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;
  -ms-justify-content:space-between; -webkit-justify-content:space-between; justify-content:space-between;
}
.mobile .cd-menu-widget .square-headline div.head * {
  margin: auto;
}
.mobile .cd-menu-widget .square-headline .headline { font-size:18px; }
.mobile .cd-menu-widget .square-headline .sub_headline { font-size:12px; }
.mobile .cd-menu-widget > ul > li {
  border-bottom: 1px solid #ddd;
}
.mobile .cd-menu-widget ul { z-index:1; position:relative; }
@media screen and (max-width:550px) {
  .mobile .cd-menu-widget .square-headline div.head {
    height:50px; line-height:50px;
  }
}


/* ----------------------------------------------------------------------
 リンクボックス：フロントページのピックアップとトピックス、製品ページの関連製品
---------------------------------------------------------------------- */
.cd-linkcard-container {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
}
.cd-linkcard {
  text-decoration: none;
  display: block;
  margin: 0;
  padding: 0;
  height: 100%;
  width: 100%;
  animation: none;
  transition: background-position 0.3s, background-size 0.3s; /* 補助的なスムーズ効果 */
}
.cd-linkcard:hover {
  background-position: right center;
  background-size: 200% auto;
  animation: ripple 1.5s forwards; /* 波紋 */
  background-color: rgb(27 133 251 / 2%);
}
@keyframes ripple {
  0% {
    box-shadow: 0 0 0 0 var(--color-brand);
  }
  70% {
    box-shadow: 0 0 0 10px rgb(27 133 251 / 0%);
  }
  100% {
    box-shadow: 0 0 0 0 rgb(27 133 251 / 0%);
  }
}
.cd-linkcard p {
  margin: 0 !important;
  padding: 0 8px;
  line-height: 2;
  font-size: 14px !important;
}
.post_content .cd-linkcard h3,
.post_content .cd-linkcard h4 {
  font-size: 16px !important;
  font-weight: 550 !important;
  margin: 0 !important;
  padding: 12px 8px 6px !important;
}
.post_content .cd-linkcard:hover h3,
.post_content .cd-linkcard:hover h4,
.post_content .cd-linkcard:hover p {
  color: var(--color-brand) !important;
}

/* ----------------------------------------------------------------------
 製品・サービスリスト
---------------------------------------------------------------------- */
#cd_products {
  margin-top: 2em;
}
/* リスト（グリッドレイアウト）*/
#cdp-list {
  list-style: none;
  margin: 1em 0em !important;
  padding: 0;
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}
@media screen and (max-width: 781px) {
  #cdp-list {
    gap: 16px;
  }
}

/* 各カード */
#cdp-list > .item {
  padding: 0;
  background: var(--color-card);
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.15s ease, box-shadow 0.15s ease,
    border-color 0.15s ease;
}
#cdp-list > .item:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
  border-color: rgba(0, 112, 164, 0.25);
}
/* サムネイル */
#cdp-list .item__thumb {
  position: relative;
  background: var(--color-card-alt);
  aspect-ratio: 16 / 9; /* 画像が無くても高さを確保 */
  display: block;
}
#cdp-list .item__thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain; /* 製品画像が切れないように */
  object-position: center;
  display: block;
}
/* 本文領域 */
#cdp-list .cdp-card__body {
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
@media screen and (max-width: 781px) {
  #cdp-list .cdp-card__body {
    padding: 12px;
    gap: 8px;
  }
}
/* タイトル（ページ名） */
#cdp-list .item__title {
  margin: 0;
  color: var(--color-head);
  font-weight: 600;
  font-size: 0.92rem;
  line-height: 1.35;
}
#cdp-list > .item:hover .item__title {
  color: var(--color-brand);
}

/* カード内のタグリスト */
#cdp-list .item__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px; /* タグ同士の間隔 */
  margin-top: 10px;
}
#cdp-list .item__tag {
  display: inline-block;
  font-size: 12px;
  line-height: 1.4;
  padding: 4px 10px;
  border-radius: 999px; /* pill 形状 */
  background-color: #f1f3f4; /* 薄いグレー背景 */
  color: var(--color-text);
  border: 1px solid #d1d5db; /* 薄めの枠線 */
  white-space: nowrap;
}
/* カード内の抜粋 */
#cdp-list .item__excerpt {
  color: var(--color-text);
  font-size: 0.85rem;
  line-height: 1.6;
  /* 3行で省略 */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  overflow: hidden;
  min-height: calc(1.6em * 3);
}

/* ================================
   ボタン風チェックボックス
   input[type="checkbox"].cdp-check + label.cdp-chip
   └ labelクリックでON/OFF、ON時はブランド反転
================================ */
/* 2カラムの親グリッド。左=親ラベル列、右=タグ群列 */
.cdp-controls {
  display: grid;
  grid-template-columns: max-content 1fr; /* 左列はラベル幅にフィット、右は残り */
  column-gap: 0.75rem;        /* 列間 */
  row-gap: 1.4rem;         /* 行間 */
  align-items: center;
}
/* 各行(.tag-group)の箱をフラット化して、子を親グリッドの2カラムに直接置く */
.cdp-controls .tag-group {
  display: contents; /* 各行の label/chips を親グリッドの同一カラムに配置 */
}
/* 右カラム（タグ群）は flex 指定 */
.cdp-controls .tag-group__chips {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem .75rem;
}
/* 左カラム（親ラベル）の見た目 */
.cdp-controls .tag-group__label {
  font-weight: 600;
  line-height: 1.6;
  white-space: nowrap;
}

/* もとのチェックは隠す（アクセシビリティ対応あり） */
.cdp-tag-checkbox {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  clip: rect(0 0 0 0);
  overflow: hidden;
}
/* 見た目のボタン */
.cdp-tag-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  font-size: 14px;
  line-height: 1;
  border-radius: 999px;
  border: 1px solid var(--color-border);
  background: #fff;
  color: var(--color-text);
  cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease,
    color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
  user-select: none;
}
.cdp-tag-chip:hover {
  border-color: rgba(0, 112, 164, 0.35);
  transform: translateY(-1px);
}
/* ONの状態 */
.cdp-tag-checkbox:checked + .cdp-tag-chip {
  background: var(--color-brand);
  border-color: var(--color-brand);
  color: #fff;
}
/* キーボード操作のフォーカスリング */
.cdp-tag-checkbox:focus-visible + .cdp-tag-chip,
.cdp-tag-checkbox:focus-visible {
  outline: none;
  box-shadow: var(--ring);
}
/* 無効状態（任意） */
.cdp-tag-checkbox:disabled + .cdp-tag-chip {
  opacity: 0.5;
  cursor: not-allowed;
}

/* ----------------------------------------------------------------------
 開発中のテンポラリ
---------------------------------------------------------------------- */
/*
figure:not(:has(img, video)) {
  background: #bbb;
}
  */