@charset "utf-8";

:root {
  --cs-textcolor: #ffffff;
  --cs-textcolor-a: #998675;
  --cs-textcolor-hover: #6610f2;
  --cs-bordercolor: rgba(128, 128, 128, 1); /* ボーダーのデフォルト色 */
  --cs-blue: #0066CC;
  --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: #F2613F;/* ヘッダーhover色 */
  --cs-yellow: #f4d668;
  --cs-green: #8DB596;　
  --cs-green-light: #b6c0a8;	
  --cs-brown: #705843;/* コピーライトと同じ */
  --cs-brown-light: #d8d2c2;	
  --cs-brown-dark: #403134;
  --cs-black: #000;
  --cs-white: #fff;
  --cs-gray: rgba(128, 128, 128, 1); /* タイトルの線、テキストなど　808080 */
  --cs-gray-light: rgba(242, 242, 242, 1); /* 背景など　f2f2f2 */
  --cs-gray-dark:  rgba(77, 77, 77, 1);
  --cs-color01: #1A1A1A;
  --cs-color02: #657598;
  --cs-color03: #F6F2E9;
  --cs-color04: #dac47d;
  --cs-color05: #fff;
  --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: "ヒラギノ明朝 ProN W3", Hiragino Mincho ProN , Times New Roman , "游明朝", YuMincho, "MSP明朝","MS PMincho","MS 明朝",serif;
  --cs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
  --header-bgcolor:  rgba(0,0,0,1); /* ヘッダー背景色 */
  --header-textcolor: #fff;                 /* ヘッダーテキスト色 */
  --headermenu-bgcolor: rgba(255,255,255,1); /* ヘッダーメニュー背景色 */
  --headermenu-bgcolor-shadow: rgba(0,0,0,0.2); /* PCグランドメニューboxshadow色 */
  --headermenu-bgcolor-shadow-sp: rgba(0,0,0,0.3); /* スマホグランドメニューboxshadow色 */
  --headermenu-bgcolor-drop: #000000; /* ヘッダーメニュー背景色（ドロップダウン） */
  --headermenu-bgcolor-drop-hover: rgba(255,255,255,0.2); /* ヘッダーメニュー背景色（ドロップダウンhover） */
  --headermenu-textcolor: rgba(255,255,255,1);             /* ヘッダーメニューテキスト色 */
  --headermenu-textcolor-hover: #998675;    /* ヘッダーメニューテキスト色（hover） */
  --header-hbgcolor: #666666;                  /* ハンバーガー棒の色 */
  --header-hbgcolor-close: #fff;            /* ハンバーガー棒の色（close） */
  --hbgmenu-bgcolor: rgba(0,0,0,0.9);       /* ハンバーガーメニュー背景色 */
  --hbgmenu-textcolor: #fff;                /* ハンバーガーメニューテキスト色 */
  --hbgmenu-bordercolor: #ccc;              /* ハンバーガーメニューボーダー色 */
  --pagetitle-bgcolor: #000000;             /* ページタイトル背景 */
  --pagetitle-bgcolor-s: #f2f2f2;             /* ページタイトル背景（ストライプにした時の色） */
  --pagetitle-textcolor: #ffffff;              /* ページタイトルテキスト色 */
  --pagetitle-bgtextcolor: rgba(255,255,255,0); /* ページタイトルテキストの背景色 */
  --footer-bgcolor: #000;               /* フッター背景色 */
  --footer-textcolor: #fff;              /* フッターテキスト色 */
  --copyright-bgcolor: #1A1A1A;             /* コピーライト背景色 */
  --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(133,15,15,1);         /* PCの時のページトップアイコンの色 */
  --fnav-iconcolor-pc-hover: rgba(133,15,15,0.6);   /* PCの時のページトップアイコンロールオーバ時の色 */
  --fnav-iconcolor-pc-shadow: rgba(0,0,0,0.7);  /* PCの時のページトップアイコンシャドウの色 */
  --fnav-bgcolor-sp: #93011c;           /* スマホの時のフッターアイコンの背景色 */
  --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カスタマイズ

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

  @media print, screen and (min-width: 768px) {
    
		/* l-header */
    .l-header {
      min-height: 120px;
      }
		.l-gnav > ul > li {
			}
		.l-gnav > ul > li > a {
      padding: 0 18px;
      height: auto;
      line-height: 1;
      border-left: solid 1px var(--cs-gray);
			}
		.l-gnav > ul > li:first-child > a {
      border-left: none;
			}
    
  }
	@media (max-width: 767px) {
		.l-header h1 img {
			height: 40px;
			}
  }



/*/////////////////////////////////////////////////////////////////////////////////////////
　
  サイドバーカスタマイズ

/////////////////////////////////////////////////////////////////////////////////////////*/
	@media (max-width: 767px) {
		.l-sidenav-bn__1 a {
      padding-top: 12px;
      padding-bottom: 12px;
			}
  }



/*/////////////////////////////////////////////////////////////////////////////////////////
　
  協力会社

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

  @media print, screen and (min-width: 768px) {
    .p-tac {
      width: 700px;
      margin: 0 auto;
      }    
    .p-tac dt {
      width: 300px!important;
      }    
    .p-tac dd {
      width: 50%!important;
      width: -webkit-calc( 100% - 300px)!important;
      width: -moz-calc( 100% - 300px )!important; 
      width: calc( 100% - 300px )!important; 
      }
  }
	@media (max-width: 767px) {
    .p-tac dd {
      padding-bottom: 20px!important;
      }
  }

/* ビデオのレスポンシブ 
===================================================== */
.mv-wrap {
      padding-top: 56.25%;
      width: 100%;
      position: relative;
      @media (width >= 1200px) {
        padding-top: 50%;
      }
      
 video {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0px;
        left: 0px;
        object-fit: fill;
      }
    }

/* 会社概要
===================================================== */
/* dt　dd　横並び */
  dl.dl-horizon2 {
    display: -webkit-flex;
    display: flex;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
    align-items: stretch;	
    width: 100%;
    box-sizing: border-box;
    }
  dl.dl-horizon2 > dt {
    padding: 5px;
    width: 80px;
    box-sizing: border-box;
    }
  dl.dl-horizon2 > dd {
    margin: 0;
    padding: 5px;
    width: 100%;
    width: -webkit-calc( 100% - 80px);
    width: -moz-calc( 100% - 80px ); 
    width: calc( 100% - 80px ); 
    box-sizing: border-box;
    }
  @media screen and (max-width: 767px) {
    dl.dl-horizon2 > dt { 
      width: 100%;
      }
    dl.dl-horizon2 > dd {
      width: 100%; 
      }
  }  

/* お問合せ
===================================================== */
/*ポップアップ色*/
#mfp_overlay {color: black !important;}
.prefcodeResult {color: black !important;}
/*エラー色*/
.mfp_ng {
	background-color: rgba(133,15,15,0.6) !important;
	}
.mfp_err{color:#dac47d !important}