@charset "UTF-8";
/* テーマーカラー - Navy */

/*CSSカスタムプロパティ（サイト全体を一括管理する為の設定）
---------------------------------------------------------------------------*/
:root {

	/*テンプレートのメインまたはアクセントとなる色*/
	--col-main: #16257A;
	--col-sub: #2D4AA8;
  --col-accent: #FFB800;
  --col-light: #5B7DB8;

	/*上のprimary-colorの対となる色*/
	--primary-inverse-color: #fff;

	/*サイト内の左右へとる余白を一括管理しています。画面幅100%＝100vwです。*/
	--global-space: 5vw;

  /*form*/
  --form-hr: #e3e3e3;
  --input-line: #ccc;
  --form-check: #192988;/*ネイビー：#192988*/
  --form-note01: #9E9E9E;/*入力例テキスト*/
  --form-note02: #F03636;/*エラーテキスト*/
  --input-error-line: #FB7777;/*エラー罫*/

  /*table*/
  --table-border: #e0e0e0;/*テーブル罫線*/
  --table-bg-category: #f5f5f5;/*区分列の背景色*/
  --table-bg-hover: #f9f9f9;/*ホバー時の背景色*/
  --table-shadow: rgba(0, 0, 0, 0.1);/*テーブルの影*/

  /*text*/
  --text-dark: #333;/*濃いグレー*/
  --text-gray: #666;/*グレー*/
  --text-light: #555;/*明るいグレー*/
}
html { background-color: #041446;/*footer と同じ色*/}
body {
  background: #f8f9fc;
	color: #333;
}
/*ロゴ 黒字 明朝*/
.h-logo.no-img a {
  color: #333;
  font-family: "Times New Roman", serif;
}
@media (hover: hover) {
  .h-logo a:hover {
    opacity: 0.8;
  }
}


/*リンク（全般）設定
---------------------------------------------------------------------------*/
a {
	color: #555;
}
a:hover {
	color: var(--col-sub);	/*文字色。css冒頭で指定しているcol-subを読み込みます*/
}

/*メニューバーの色設定
---------------------------------------------------------------------------*/
/* スマホ: デフォルト */
#menubar.display-block,
#menubar.display-block a {
  color: #fff;
}

/* PC: メニューの背景色と文字色 */
@media screen and (min-width: 900px) {
  #menubar li a {
    background: var(--col-main);
    color: var(--primary-inverse-color);
  }

  /* マウスオン時に明るくする */
  #menubar li a:hover {
    background-color: var(--col-sub);
  }
}

/*３本バー（ハンバーガー）アイコン設定
---------------------------------------------------------------------------*/
/*３本バーを囲むブロック*/
#menubar_hdr {
  background: var(--col-main);
}
/*バー１本あたりの設定*/
#menubar_hdr span {
	border-top: 1.5px solid #fff;	/*線の幅、線種、色*/
}

/*×印が出ている状態の3本バーの背景色*/
#menubar_hdr.ham {
	background: var(--col-main);
}


/*Slick slider
---------------------------------------------------------------------------*/
.slick-slide .caption {/*キャッチコピー*/
  color: #fff;
}
.slick-dots li button {/*ドット*/
  border: 1.5px solid #d6d6d6;
  /*color: #ddd;*/
  box-shadow: 0 0 0 0 transparent;
  background-color: #fff;
}
.slick-dots li.slick-active button {
  border-color: var(--col-light);
  box-shadow: 0 0 0 1.5px #fff;/*白枠がつく*/
}
.slide-btn01 a {/*スライダー内のボタン*/
  border: #fff 2px solid;
  color: #fff;
}

/*サイドの問い合わせボタン
---------------------------------------------------------------------------*/
.top-bt-contact a {
  background-color: var(--col-main);
  border: 1px solid #fff;
  color: #fff;
}
.top-bt-contact a i.fas {
  color: #fff;
}
@media (hover: hover) {
  .top-bt-contact a:hover {
    filter: brightness(1.3);
  }
}

/*パンくず
---------------------------------------------------------------------------*/
.breadcrumb li {
  color: #b3b3b3;
}
.breadcrumb li:not(:last-child)::after {
  border-top: #b3b3b3 1px solid;
  border-right: #b3b3b3 1px solid;
}

/*マーカー*/
.ttl01 span.marker {
  /*background: linear-gradient(transparent 50%, #FFE3EA 50%);*/
}
.ttl01 span.marker::before {
  background-color: #C8D9F5;
}

/*Button
---------------------------------------------------------------------------*/
.btn1 a {/*メインカラー*/
	background-color: var(--col-main);
  border: 1px solid var(--col-main);
  color: #fff;
}
@media (hover: hover) {
  .btn1 a:hover {
    /* background-color: #fff; */
    /* border: 1px solid var(--col-main); */
    /* color: var(--col-main); */
    opacity: 0.8;
  }
}

/*PAGE TOP（↑）設定
---------------------------------------------------------------------------*/
.pagetop a {
  background: rgba(25, 41, 136, 0.85);
  color: #fff;
}


/*Footer
---------------------------------------------------------------------------*/
footer {
  border-top: 3px solid var(--col-main);
  /* background-color: #041446; */
  background-color: #041446;
  color: #fff;
}
/*SNSアイコン　背景により、black white 画像を入れ替え*/
.footer_info ._sns_icons li.icon-instagram a {
  background: url("../images/sns_icon/instagram_icon_white.png") no-repeat center;
  background-size: contain;
}
.footer_info ._sns_icons li.icon-facebook a {
  background: url("../images/sns_icon/fb_icon_white.png") no-repeat center;
  background-size: contain;
}
.footer_info ._sns_icons li.icon-x a {
  background: url("../images/sns_icon/x_icon-white.png") no-repeat center;
  background-size: contain;
}
.footer_info ._sns_icons li.icon-youtube a {
  background: url("../images/sns_icon/youtube_icon_white.png") no-repeat center;
  background-size: contain;
}

#footermenu li a,
.copy a {
  color: var(--primary-inverse-color);
  border-bottom: 1px solid transparent;
}
@media (hover: hover) {
  #footermenu li a:hover,
  .copy a:hover {
    border-bottom: 1px solid var(--primary-inverse-color);
  }
}

/*ブログのカテゴリーアイコン
---------------------------------------------------------------------------*/
.new dt {/*日付(dt)設定*/
  background: rgba(0,0,0,0.04);
  color: #aaa;
}
.new dd a:not([href^="#"]) {
  /*color: var(--col-sub);*/
  border-bottom: 1px solid transparent;
}
.new dd::before {/*下線*/
  /*background-color: #ddd;*/
}
.post-info .news-icon {
  background: #fff;
  color: #555;
  border: 1px solid #999;
}
@media (hover: hover) {
  .post-info .news-icon:hover {
    opacity: 0.8;
  }
  .new dd a:not([href^="#"]):hover {
    color: var(--col-sub);
    border-bottom: 1px solid var(--col-sub);
  }
}

/*NEWマーク*/
.new-mark {
	background-color: var(--col-main);
  color: #fff;
}
.bg1 .new-mark {/*背景がある場合*/
  background-color: var(--col-accent);
  color: #333;
}
/*newアイコン*/
.list .newicon {
  background: var(--col-main);
	color: var(--primary-inverse-color);
}

/*Title
---------------------------------------------------------------------------*/
/*h2見出し*/
.main-ttl {
  border-bottom: 2px solid #ddd;
  color: var(--col-main);
}
/*h2のアクセントラインの設定*/
.main-ttl .uline {
  border-bottom: 2px solid var(--col-main);
}



/*layout04
---------------------------------------------------------------------------*/
/*質問*/
.faq dt {
  background: rgba(0,0,0,0.04);
}
/*アイコン（Font Awesome）*/
.faq dt::before {
  color: var(--col-main);
}
.bg1 .faq dt {/*背景がある場合*/
  background: #fff;
  color: #555;
}
/*layout06
---------------------------------------------------------------------------*/
.access-info dt {
  /*border-left: var(--col-main) 4px solid;*/
}
.access-info dt::before {
  background-color: var(--col-main)
}
.access-info dd {
  border-bottom: #ddd 1px dotted;
}

/*テーブル、layout07
---------------------------------------------------------------------------*/
/*ta1テーブルブロック設定*/
.ta1 {
	border-top: 1px solid #ddd;
}
/*tr（１行分）タグ設定*/
.ta1 tr {
	border-bottom: 1px solid #ddd;
}

/*top用 営業時間表*/
.tbl-top ._tbl-label {
  background-color: var(--col-main);
  color: #fff;
}
.tbl-top ._tbl-label th:not(:first-child) {
  border-left: 1px solid rgba(255,255,255,0.40);
}
.tbl-top tr:not(._tbl-label) {
  background-color: #f7f7f7;
}
.tbl-top ._tbl-head {
  border-bottom: 1px solid #ddd;
}
.tbl-top td {
  border-bottom: 1px solid #ddd;
}


/*WPのフリーエディターエリア
---------------------------------------------------------------------------*/
.free-edit-container h1,
.free-edit-container h2,
.free-edit-container h3,
.free-edit-container h4,
.free-edit-container h5,
.free-edit-container h6 {
  color: #555;
}

/*続きを読む*/
.readmore .bt-readmore {
  background-color: rgba(255,255,255,0.30);
  border-bottom: 1px solid var(--col-main);
  color: var(--col-main);
}

/*Form
---------------------------------------------------------------------------*/
.error-box {/*フォーム上部のエラーボックス*/
  background-color: #f2dce7;
  /*border: #DDB4B4 1px solid;*/
  color: #dc72a4;
}
.item-name {/*入力項目*/
  /*border-left: var(--col-main) 4px solid;*/
}
.item-name::before {/*入力項目*/
  background-color: var(--col-main);
}
.required {
  background-color: #FF5757;
}
.form-select select {
  color: #555;
  background-color: #fff;
}
.form-checkbox-name {
  color: #666;
}
.btn-wrap .form-bt1 {/*実行ボタン*/
  background-color: var(--col-main);
  color: #fff;
}
.btn-wrap .form-bt2 {/*戻るボタン*/
  background-color: #ddd;
}

/*ページネーション
---------------------------------------------------------------------------*/
.page-nav li.prev span,
.page-nav li.next span {
  border: #ccc 1px solid;
}
.page-nav li.prev span::after,
.page-nav li.next span::after {
  border-top: #ccc 2px solid;
  border-right: #ccc 2px solid;
}
@media (hover: hover) {
  .page-nav li a:hover {
    color: var(--col-main);
  }
  .page-nav li.prev a:hover span,
  .page-nav li.next a:hover span {
    border: var(--col-main) 1px solid;
  }
  .page-nav li.prev a:hover span::after,
  .page-nav li.next a:hover span::after {
    border-top: var(--col-main) 2px solid;
    border-right: var(--col-main) 2px solid;
  }
}

/*トップページ　.home 独自の設定
---------------------------------------------------------------------------*/
/*layout06*/
.home .home-layout06 {
  background-color: #E8EDF7;
  border-bottom: 1px solid #E8EDF7;
}