@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/*　画像フルワイドの設定 */
  .main {
    padding-left: 0px !important;
    padding-right: 0px !important;
  }

/* ID9(トップページ)全画面背景の設定 */
body {
  background-image:linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5)), url('https://akisho-workshop-tool.com/wp-content/uploads/2025/04/183470.jpg');
  background-size: auto; /* 必要に応じて変更可能 */
  background-position: top left; /* または center */
  background-attachment: scroll; /* ← スクロールに追従 */
  background-repeat: repeat; /* ← 繰り返し表示 */
}



/*　ヘッダーやフッターを透明にする。 */
.header-container, .main, .sidebar, .footer, .navi, .navi-in > ul, .navi-in > ul li, .navi-in > ul .sub-menu, .mobile-menu-buttons{
  background-color: transparent !important;
}

/*　ヘッダーやフッターを透明にする。(ホバー時) */
.navi-in > ul li:hover, .navi-in a:hover {
  background-color: transparent !important;
}

/* ヘッダーが背景画像の全面に出るように設定*/
.header-container-in.hlt-top-menu .wrap {
	position: relative; /* または fixed/sticky など */
	z-index:100000;
}


/*　モバイルのハンバーガーメニューを右から出す*/
.navi-menu-content {
  left: auto;
  right: 0;
  transform: translateX(105%);
}


/* モバイルヘッダーの文字を消す */
.menu-caption {
    visibility: hidden; 
}

/* モバイルヘッダーの星マークを消す */
.fa-star {
    visibility: hidden;	
}

/* モバイルヘッダーの縁の影を消す */
.mobile-header-menu-buttons {
  box-shadow: none !important;
}

/* ヘッダーロゴにホバーされたときに薄くする */
.logo-header img:hover {
  opacity: 50%;
}

/* ヘッダーの文字*/
.item-label {
  font-size: small !important;	
}
.item-label:hover {
  color: #1fbf31 !important; /* ホバー時の色 */
}

/* フッターの文字
.page-id-496 .footer-bottom-content {
  color:white !important;	
}
.page-id-496 .navi-footer-in a {
  color:white !important;	
}
.page-id-496 .navi-footer-in a:hover {
  background-color:transparent;	
  color: #1fbf31 !important; /* ホバー時の色 */
}
*/


  /* メカナビWEB用_スピンボタンを削除_Chrome, Safari, Edge, Opera */
  input[type="number"]::-webkit-outer-spin-button,
  input[type="number"]::-webkit-inner-spin-button {
      -webkit-appearance: none;
      margin: 0;
  }

  /* メカナビWEB用_スピンボタンを削除_Firefox */
  input[type="number"] {
      -moz-appearance: textfield;
  }

  /* メカナビWEB用_🔹 全ボタンの基本デザイン（デフォルトのグレーを解除） */
  button {
      font-size: 16px;        /* 文字サイズを大きく */
      padding: 10px 20px;     /* 内側の余白を増やす */
      margin: 5px;            /* ボタン間の余白 */
      border: none;           /* 枠線をなくす */
      border-radius: 5px;     /* 角を丸くする */
      cursor: pointer;        /* カーソルをポインターに */
      transition: 0.3s;       /* ホバー時のアニメーション */
      color: white;           /* 文字色を白に */
  }

  /* メカナビWEB用_✅ 個別のボタンの背景色設定 */

  /* メカナビWEB用_行を追加ボタン（緑） */
  #addRowBtn {
      background-color: #4CAF50 !important;
  }
  #addRowBtn:hover {
      background-color: #45a049 !important;
  }


/* メカナビWEB用_メカナビWebへボタン（紫） */
#navigateBtn {
      background-color: #008CBA !important;
}
#navigateBtn:hover {
      background-color: #007bb5 !important;
}

/* メカナビWEB用_インプットフォームの設定 */
  input {
      width: 100%;
      padding: 5px;
      text-align: center;
      font-size: 16px !important;
  }

  /* メカナビWEB用_ボタンを横並びにするためのスタイル */
  .button-container{
      display: flex;
      gap: 10px; /* ボタン間に隙間を追加 */
      margin-bottom: 20px; /* ボタンとテーブルの間に余白を追加 */
	  justify-content: center;
	  align-items: center;
	  height: 100px; /* 高さは必要に応じて調整 */
  }


/*会社概要ページの表デザイン*/
table {
  width: 100%;
  border-collapse: collapse;
}

th {
  background-color: white !important;
  border: none;
  border-bottom: 1px solid #ccc;
  padding-top: 50px;
  padding-bottom: 50px;

}

td {
  background-color: white !important;
  border: none;
  border-bottom: 1px solid #ccc;
  padding-top: 50px;
  padding-bottom: 50px;
}


/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}