@charset "utf-8";

:root {
  --cs-textcolor: #000000;
  --cs-textcolor-a: #0d6efd;
  --cs-textcolor-hover: #6610f2;
  --cs-bordercolor: #ccc; /* ボーダーのデフォルト色 */
  --cs-blue: #0050a2; /* コピーライトと同じ色 */
  --cs-blue-light: #4682B4;
  --cs-blue-dark: #233B6C;
  --cs-navy: #000033;
  --cs-purple: #7e67a2;
  --cs-pink: #FF6699;
  --cs-pink-light: #e6c2bf;	
  --cs-red: #b92125;
  --cs-red-light: #ffe3e5;
  --cs-red-dark: #440000;
  --cs-orange: #ed6a02; /* メインカラー */
  --cs-yellow: #f4d668;
  --cs-green: #668863;
  --cs-green-light: #b6c0a8;	
  --cs-brown: #534741;
  --cs-brown-light: #d8d2c2;	
  --cs-brown-dark: #403134;
  --cs-black: #000;
  --cs-white: #fff;
  --cs-gray: rgba(153, 153, 153, 1);
  --cs-gray-light: rgba(230, 230, 230, 1);
  --cs-gray-dark: #666666; /* 背景に使用 */
  --cs-color01: #ed6a02;
  --cs-color02: #657598; 
  --cs-color03: #F6F2E9;
  --cs-color04: #2d50a0;
  --cs-color05: #f2f2f2;
  --cs-color06: #fff;
  --cs-color07: #fff;
  --cs-color08: #fff;
  --cs-color09: #fff;
  --cs-color10: #fff;
  --cs-shadowcolor01: 149,157,112,; /* shadowに使用するRGB */
  --cs-shadowcolor02: 0,0,0,; /* shadowに使用するRGB */
  --cs-shadowcolor03: 255,255,255,; /* shadowに使用するRGB */
  --cs-basefont: "游ゴシック Medium",YuGothic-M, YuGothic,"Hiragino Kaku Gothic ProN",メイリオ,Meiryo,sans-serif;
  --cs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
  --header-bgcolor:  rgba(255,255,255,0.7); /* ヘッダー背景色 */
  --header-textcolor: #000;                 /* ヘッダーテキスト色 */
  --headermenu-bgcolor: rgba(255,255,255,1); /* ヘッダーメニュー背景色 */
  --headermenu-bgcolor-shadow: rgba(0,0,0,0); /* PCグランドメニューboxshadow色 */
  --headermenu-bgcolor-shadow-sp: rgba(0,0,0,0.3); /* スマホグランドメニューboxshadow色 */
  --headermenu-bgcolor-drop: #f2f2f2; /* ヘッダーメニュー背景色（ドロップダウン） */
  --headermenu-bgcolor-drop-hover: rgba(0,0,0,0.2); /* ヘッダーメニュー背景色（ドロップダウンhover） */
  --headermenu-textcolor: rgba(0,0,0,1);             /* ヘッダーメニューテキスト色 */
  --headermenu-textcolor-hover: #ed6a02;    /* ヘッダーメニューテキスト色（hover） */
  --header-hbgcolor: #000;                  /* ハンバーガー棒の色 */
  --header-hbgcolor-close: #fff;            /* ハンバーガー棒の色（close） */
  --hbgmenu-bgcolor: rgba(0,0,0,0.9);       /* ハンバーガーメニュー背景色 */
  --hbgmenu-textcolor: #fff;                /* ハンバーガーメニューテキスト色 */
  --hbgmenu-bordercolor: #ccc;              /* ハンバーガーメニューボーダー色 */
  --pagetitle-bgcolor: #e8e8e8;             /* ページタイトル背景 */
  --pagetitle-bgcolor-s: #f2f2f2;             /* ページタイトル背景（ストライプにした時の色） */
  --pagetitle-textcolor: #000;              /* ページタイトルテキスト色 */
  --pagetitle-bgtextcolor: rgba(255,255,255,0.2); /* ページタイトルテキストの背景色 */
  --footer-bgcolor: #fff;               /* フッター背景色 */
  --footer-textcolor: #000;              /* フッターテキスト色 */
  --copyright-bgcolor: #0050a2;             /* コピーライト背景色 */
  --copyright-textcolor: #fff;              /* フッターテキスト色 */
  --slick-dots: #595757;                /* スリックスライダードットの色 */
  --slick-active: #000;                 /* スリックスライダードットのアクティブ色 */
  --sns-bgcolor: #fff;               /* SNS丸ボタンの背景色 */
  --sns-iconcolor: #333;             /* SNS丸ボタンのアイコン色（ロールオーバも同じ色） */
  --sns-bordercolor: #fff;           /* SNS丸ボタンのボーダー色 */
  --sns-bordercolor-hover: #333;     /* SNS丸ボタンのロールオーバ時のボーダー色 */
  --fnav-iconcolor-pc: rgba(0,80,162,1);         /* PCの時のページトップアイコンの色 */
  --fnav-iconcolor-pc-hover: rgba(0,80,162,0.7);   /* PCの時のページトップアイコンロールオーバ時の色 */
  --fnav-iconcolor-pc-shadow: rgba(255,255,255,0.7);  /* PCの時のページトップアイコンシャドウの色 */
  --fnav-bgcolor-sp: #333;           /* スマホの時のフッターアイコンの背景色 */
  --fnav-iconcolor-sp: #fff;         /* スマホの時のフッターアイコンの色 */
  --sec-bgimg-maskcolor: rgba(0,0,0,0.4);     /*コンテンツの背景に画像を配置した時の背景マスクの色*/
  --img-maru-s--size: 260px;         /* 画像を円形にトリミング（画像サイズが480px以下）画像の縦幅サイズを指定 */
}

/*/////////////////////////////////////////////////////////////////////////////////////////

★★ ヘッダ固定の時のアンカー位置調整したい場合 ★★
common.jsを修正します。
PCの場合：150行目の　 headerHeight = headerHeight + 50; //ヘッダの高さ
　　　　　　　　　　　　　　　　　　　　　　　　　　↑ この数値を50から変更してください。

/////////////////////////////////////////////////////////////////////////////////////////*/

/* -------- header.cssの変更 --------- */
	@media (max-width: 767px) {
    .l-headerbase {
      height: 50px;
      }
		.l-header h1 img {
			height: 45px;
			}   
    .l-pagetitle {
      height: 100px;
      }
    .l-pagetitle h1 {
      margin-top: 2rem;
      }
	}


/* -------- 特有スタイル --------- */
	/* ストライプの背景 */
	.p-sec-back__stripe {
		background-image: -webkit-repeating-linear-gradient(90deg, var(--pagetitle-bgcolor), var(--pagetitle-bgcolor) 3px, var(--pagetitle-bgcolor-s) 3px, var(--pagetitle-bgcolor-s) 12px);
		background-image: repeating-linear-gradient(-90deg, var(--pagetitle-bgcolor), var(--pagetitle-bgcolor) 3px, var(--pagetitle-bgcolor-s) 3px, var(--pagetitle-bgcolor-s) 12px);
		}

/* アンダーライン */
.under-line {
    background: linear-gradient(transparent 68%, rgba(244, 214, 104, .6) 68%);
    display: inline;	
}

  /*「社内設備」の「設備名称」幅調整*/
  .w-170-res { width: 170px; }
@media print, screen and (min-width: 768px) {
  .w-170-res { width: inherit;}
}

.c-phbnlink {
  background-color: rgba(0,0,0, 0) !important;
  }


/* ------- メールフォームプロ ------- */

/* 確認画面 */
div#mfp_phase_confirm h4 {
  padding-top: 0;
  margin-bottom: 30px;
}
table#mfp_confirm_table tr.mfp_colored {
  background-color: #FFFFFF !important;
}
table#mfp_confirm_table tr th,table#mfp_confirm_table tr td {
  font-size: inherit;
}
#mfp_phase_confirm_inner th {
  background-color: var(--cs-gray-light) !important;
}
@media screen and (max-width: 800px) {
  table#mfp_confirm_table tr td {
    border-top: none !important;
  }
}

.mfp_buttons {
  --mfp_button_send-bgcolor: var(--cs-red);          /*送信ボタンの背景色*/
  --mfp_button_send-textcolor: var(--cs-white);      /*送信ボタンのテキスト色*/
  --mfp_button_send-bgcolor-hover: var(--cs-white);  /*送信ボタンのロールオーバ時の背景色*/
  --mfp_button_cancel-bgcolor: var(--cs-gray);         /*キャンセルボタンの背景色*/
  --mfp_button_cancel-textcolor: var(--cs-white);      /*キャンセルボタンのテキスト色*/
  --mfp_button_cancel-bgcolor-hover: var(--cs-white);   /*キャンセルボタンのロールオーバ時の背景色*/
  padding: 0 !important;
  }
/* 送信ボタン、キャンセルボタン */
  button#mfp_button_send, button#mfp_button_cancel {
    text-decoration: none;
    border: 2px solid var(--cs-bordercolor);
    font-weight: bold;
    letter-spacing: 0.5px;
    line-height: 1.4;
    padding: 10px 15px;
    margin: 0 auto;
    display: -webkit-flex;
    display: flex;
    gap: 10px;
    position: relative;
    width: 40%;
    padding-block: 20px;
    justify-content: center;
  }
@media (max-width: 767px) {
  button#mfp_button_send, button#mfp_button_cancel {
    width: 100%;
    }
}
  button#mfp_button_send {
    background-color: var(--mfp_button_send-bgcolor);
    border-color: var(--mfp_button_send-bgcolor);
    color: var(--mfp_button_send-textcolor) !important;
    }
    button#mfp_button_send:hover {
      background-color: var(--mfp_button_send-bgcolor-hover);
      color: var(--mfp_button_send-bgcolor) !important;
      }
  button#mfp_button_cancel {
    border-color: var(--mfp_button_cancel-bgcolor);
    background-color: var(--mfp_button_cancel-bgcolor);
    color: var(--mfp_button_cancel-textcolor) !important;
    }
    button#mfp_button_cancel:hover {
      background-color: var(--mfp_button_cancel-bgcolor-hover);
      color: var(--mfp_button_cancel-bgcolor) !important;
      }


/* ------- 翻訳ツール ------- */
  .gtranslate {
    display: inline-block;
    padding: 0 10px!important;
    text-shadow: none;
    position: absolute;
    }
  .gtranslate .gt_container--hich1m .gt_switcher a img {
    vertical-align: text-bottom;
    }
  .gt_container--hich1m .gt_switcher,
  .gt_container--hich1m .gt_switcher .gt_option {
    width: 200px !important;
    }
  .gt_container--hich1m .gt_switcher .gt_selected a {
    width: auto !important;
    }

	@media print, screen and (min-width: 768px) {
    .gtranslate {
      right: 130px;
      top: 15px;
      }
    .l-hnav-bn__1 a {
      padding-top: 3px;
      padding-bottom: 3px;
      }
  }
  @media (max-width: 767px) {
    .gtranslate {
      right: 0px;
      top: 110px;
      }
    .l-gnav-over {
      margin-bottom: -5px;
      }
  }
  @media (max-width: 767px) {
    .gtranslate {
      top: 55px;
      }
  }