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

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

	/*テンプレートのメインまたはアクセントとなる色*/
	--col-main: #0D66FC;		/*テンプレートのメインまたはアクセントカラー*/
	--primary-inverse-color: #fff;
  --col-accent: #fffa1e;
	
	/*サイト内の左右へとる余白を一括管理しています。画面幅100%＝100vwです。*/
	--global-space: 7vw;
  
  /*form*/
  --form-hr: #e3e3e3;
  --input-line: #ccc;
  --form-check: #0D66FC;/*青：#2196f3*/
  --form-note01: #9E9E9E;/*入力例テキスト*/
  --form-note02: #F03636;/*エラーテキスト*/
  --input-error-line: #FB7777;/*エラー罫*/
}

body {
  background: #fff;
	color: #333;
}

/*トップページのヘッダー下の背景画像*/
body.home {
	background: #fff url("../images/bg_header_blue.png") no-repeat center top / 100%;
}

/*ロゴ*/
.h-logo.no-img a {
  color: #fff;
}

/*リンク（全般）設定
---------------------------------------------------------------------------*/
a {
	color: inherit;
}
@media (hover: hover) {
  a:hover {
    color: var(--col-main);
  }
}

/*header
---------------------------------------------------------------------------*/
header {
	background: var(--col-main);
	color: var(--primary-inverse-color);
}

header a {color: inherit;}

@media (hover: hover) {
  header nav li a:hover {
    color: inherit;
    opacity: 0.8;
  }
}

/*ヘッダー内メニューのドロップダウン（メニュー入れ子の場合なので不使用）
---------------------------------------------------------------------------*/
/*メニュー１個あたりの設定*/
header nav ul ul a {
	background: var(--primary-inverse-color);
	color: var(--col-main);
	border: 1px solid var(--col-main);
}

/*大きな端末、小さな端末、共通のドロップダウンメニュー設定
---------------------------------------------------------------------------*/
/*リンク（a要素）の設定*/
.large-screen #menubar li a {
	background: var(--col-main);
	color: var(--primary-inverse-color);
}
/*マウスオン時に明るくする*/
.large-screen #menubar li a:hover {
	filter: brightness(1.2);
}
/*文字色*/
.small-screen #menubar, .small-screen #menubar a {
	color: #fff;
}

.ddmenu_parent > ul {
  background-color: #fff;
}


/*開閉メニュー
---------------------------------------------------------------------------*/
/*メニューブロック設定*/
.small-screen #menubar.display-block {
	background: var(--col-main);
	color: var(--primary-inverse-color);
}
/*メニュー１個あたりの設定*/
.small-screen #menubar nav ul li {
	border: 1px solid var(--primary-inverse-color);
}
.small-screen #menubar a {
	color: inherit;
}
@media (hover: hover) {
  .small-screen #menubar a:hover {
    color: var(--col-main);
    background: var(--primary-inverse-color);
  }
}

/*３本バー（ハンバーガー）アイコン設定
---------------------------------------------------------------------------*/
/*３本バーを囲むブロック*/
#menubar_hdr {
	background: var(--col-main);
}

/*バーの設定*/
#menubar_hdr div span {
	background-color: var(--primary-inverse-color);
}

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

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

/*スライダー部2カラムに
---------------------------------------------------------------------------*/
.top-2col-container {
  /*background-color: #fff;
  padding: 12px;
  border-radius: 12px;*/
}
/*トップのスライド下のバナー*/
.slide-btm_banner li {
  background-color: #fff;
}
/*レンタカー事業者検索*/
.business-serch {
  background-color: #5b94fd;
  color: #fff;
}
/*事業者ログイン*/
.business-login {
  background-color: #0c37aa;
  color: #fff;
}
@media screen and (min-width:900px) {
  .top-2col-container {
    background-color: #fff;
  }
}


/*パンくず
---------------------------------------------------------------------------*/
.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%);
}


/*Title
---------------------------------------------------------------------------*/
/*枠付きh2タイトル*/
main .main-ttl.box1 {
	border: 1px solid var(--col-main);
}

.blog-ttl {/*お知らせ詳細*/
  border-bottom: 2px solid #eee;
  color: var(--col-main);
}

/*pointアイコン
---------------------------------------------------------------------------*/
/*pointブロック全体*/
.point {
	color: var(--primary-inverse-color);	/*文字色。css冒頭のprimary-inverse-colorを読み込みます。*/
	background: url("../images/bg1_blue.svg") no-repeat center center / 100%;	/*アイコンの背景画像の読み込み。幅を100%に。*/
}

/*回転させる場合の指定*/
.point.spin::before {
	background: url("../images/bg1_blue.svg") no-repeat center center / 100%;	/*アイコンの背景画像の読み込み。幅を100%に。*/
}

.point_num-wrap .point span._num::before {
  color: #fff;
}

/*list-free（レイアウトフリー用）
---------------------------------------------------------------------------*/
/*h3見出し*/
.list-free .list-free-ttl {
	color: var(--col-main);
}

/*bg1背景上でのh3*/
.bg1 .list-free .list-free-ttl {
	color: var(--primary-inverse-color);
}

/*縦書きスタイル*/
.list-free .vertical-text::after {
	border: 1px solid var(--col-main);	/*枠線の幅、線種、varは色の事でcss冒頭で指定しているcol-mainを読み込みます*/
}

/*bg1背景上で枠線の色のみ変更*/
.bg1 .list-free .vertical-text::before,
.bg1 .list-free .vertical-text::after {
	border-color: var(--primary-inverse-color);
}

/*2・3カラム（main-contents、sub-contents設定）
---------------------------------------------------------------------------*/
/*サイドバー内のh3要素(見出し)*/
.sub-contents h3 {
	border-bottom: 1px solid #ccc;
	background: linear-gradient(transparent, rgba(0,0,0,0.05));
}
/*メニュー１個あたり（子メニュー以外）*/
.submenu > li {
	border-bottom: 1px solid #ddd;
  border-top: none;
}

/*サイドバーの検索リストタイトルの飾り*/
span._ttl-l-bd::before {
  background-color: var(--col-main);
}

/*検索結果 事業者一覧
---------------------------------------------------------------------------*/
/*検索結果の項目名タイトル*/
.search-ttl {
  background-color: #f3f3f3;
}
/*事業者カード*/
.business-serch-list .result-item {
  border: 1px solid #ddd;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
}
/*詳細ページにリンクする矢印*/
.business-serch-list .result-item a.link-detail {
  background-color: #eee;
  color: #888;
}
@media (hover: hover) {
  .business-serch-list .result-item a.link-detail:hover {
    background-color: var(--col-main);
    color: #fff;
  }
}
.business-serch-list .result-item ._inner ._separate {
  border-bottom: 1px solid #ddd;
}
.business-serch-list .result-item ._inner ._separate ._item {
  color: #999;
}


/*Button
---------------------------------------------------------------------------*/
.btn1 a {/*メインカラー*/
	background-color: var(--col-main);
  border: 1px solid var(--col-main);
  color: #fff;
}
/*背景がある場合*/
.bg1 .btn1 a {
  border: 1px solid #fff;
  opacity: 1
}
@media (hover: hover) {
  .btn1 a:hover {
    background-color: #fff;
    border: 1px solid var(--col-main);
    color: var(--col-main);
    opacity: 1
  }
  .bg1 .btn1 a:hover {
    background-color: #fff;
    color: var(--col-main);
    opacity: 1
  }
}

/*ログインボタン*/
.btn-login {
	background-color: #F9B41D;
  /*border: 1px solid #EFAC1A;*/
  color: #fff;
}
@media (hover: hover) {
  .btn-login:hover {
    background-color: #EF9119;
    /*border: 1px solid #D99C16;*/
    color: #fff;
    opacity: 1
  }
}

/*layout02　list
---------------------------------------------------------------------------*/
/*ボックス１個あたり*/
.list-grid1 .list {
	background: #fff;
	color: #111;
}

/*layout05 ギャラリー
---------------------------------------------------------------------------*/
/*ボックス１個あたり*/
.list-grid1 .gallery {
	background: #fff;
	color: #111;
}

/*layout04
---------------------------------------------------------------------------*/
.faq dt ._head {
  background: var(--col-main);
  color: #fff;
}
.faq ._head span._num::before {
  color: #fff;
}

/*質問*/
.faq dt {
  background: rgba(0,0,0,0.04);
}

.bg1 .faq dt {/*背景がある場合*/
  background: #fff;
  color: #777;
}

/*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;
}
.ta1 th {
	background: #f5f5f5;
}

/*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;
}


/*bg1背景
---------------------------------------------------------------------------*/
.bg1 {
	background: var(--col-main);
	color: var(--primary-inverse-color);
}

/*bg2背景
---------------------------------------------------------------------------*/
.bg2 {
	background: #f0f0f0;
	/*color: var(--col-main);*/
}

/*Footer
---------------------------------------------------------------------------*/
footer {
  border-top: 3px solid var(--col-main);
  background-color: #f7f7f7;
}
/*メニュー１個あたり*/
.footermenu li a {
  color: #999;
}
/*SNSアイコン　背景により、black white 画像を入れ替え*/
footer ._sns_icons li.icon-instagram a {
  background: url("../images/sns_icon/instagram_icon_black.png") no-repeat center;
  background-size: contain;
}
footer ._sns_icons li.icon-facebook a {
  background: url("../images/sns_icon/fb_icon_black.png") no-repeat center;
  background-size: contain;
}
footer ._sns_icons li.icon-x a {
  background: url("../images/sns_icon/x_icon-black.png") no-repeat center;
  background-size: contain;
}
footer ._sns_icons li.icon-youtube a {
  background: url("../images/sns_icon/youtube_icon_dark.png") no-repeat center;
  background-size: contain;
}

@media (hover: hover) {
  .footermenu li a:hover {
    color: var(--col-main);
  }
}


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


/*ブログのカテゴリーアイコン
---------------------------------------------------------------------------*/
.new dt {/*日付(dt)設定*/
  /*color: #aaa;*/
}
/*記事(dd)設定*/
.new dd {
	border-bottom: 1px solid #ccc;
}

.post-info .news-icon {
  background: #fff;
	color:#777;
	border: 1px solid #999;
}
/*NEWマーク*/
.new-mark {
	background-color: var(--col-main);
  color: var(--primary-inverse-color);
	border-color: transparent;
}
.bg1 .new-mark {/*背景がある場合*/
  background: var(--primary-inverse-color);
	color: var(--col-main);
  
}
/*newアイコン*/
.list .newicon {
  background: var(--col-main);
	color: var(--primary-inverse-color);
}
/*newアイコン 背景がある場合*/
.bg1 .list .newicon {
  background: var(--col-accent);
  /*border: 1px solid var(--col-main);*/
	color: var(--col-main);
}

/*戻るリンク*/
.prev-link {
  border-top: 1px solid #ddd;
}

@media (hover: hover) {
  .post-info .news-icon:hover {
    opacity: 0.8;
  }
}


/*Title
---------------------------------------------------------------------------*/
/*h2見出し*/
main .main-ttl {
	color: var(--col-main);
}
/*bg1背景上でのh2*/
main .bg1 .main-ttl {
	color: var(--primary-inverse-color);
	border-color: var(--primary-inverse-color);
}


/*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: #777;*/
}
/*続きを読む*/
.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: #ffecf5;
  /*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: #777;
  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: #ede7e8;
  border-bottom: 1px solid #ede7e8;
}