﻿@charset "utf-8";
/***  メインビジュアル　フェード  ***/

/*==========================
	メインの背景色
=========================***/
.main_bg {
  background: #ffefb2;
}

/*サブぺージタイトル下のテキストの背景色*/
.title_sub_text h3 {
  background: #1a5d94;
}

/*====================================
	TOPリフォーム一覧
===================================***/

/*TOPリフォームのタイトルの背景色*/
.top01_04title::after {
  background: #fbb03b;
}

/*TOPリフォームのタイトルのドット*/
.top01_04title::before {
  background: url("../img/top/mizu_bg_F9E794.png") repeat;
}

/*TOPリフォームのボタン１つ目*/
.top01_04btn a {
  background: #fb7b1b; /*背景*/
  border: #fb7b1b 1px solid; /*枠*/
}

/*TOPリフォームのボタン１つ目にカーソルが合った時*/
.top01_04btn a:hover {
  background: #ffffff; /*背景*/
  color: #fb7b1b; /*文字色*/
}

/*TOPリフォームのボタン2つ目*/
.top01_04btn_02 a {
  background: #1a5d94; /*背景*/
  border: #1a5d94 1px solid; /*枠*/
}

/*TOPリフォームのボタン2つ目にカーソルが合った時*/
.top01_04btn_02 a:hover {
  background: #ffffff; /*背景*/
  color: #1a5d94; /*文字色*/
}

/*イベント＆お知らせ一覧のタイトルのテキスト*/
.top04_01title {
  color: #29abe2;
}

/*イベント＆お知らせ一覧の日付の色*/
.top04_01day {
  color: #0071bc;
}

/*イベント＆お知らせ一覧のタイトルの隣のカテゴリ*/
.top04_01cate > ul > li a {
  background: #ffe780; /*背景*/
  border: #ffe780 1px solid; /*枠*/
}

/*イベント＆お知らせ一覧のタイトルの隣のカテゴリにカーソルが合った時*/
.top04_01cate > ul > li a:hover {
  background: #ffffff; /*背景*/
  color: #000000; /*文字色*/
}

/*イベント＆お知らせ一覧の日付の隣のカテゴリ*/
.top04_02cate > ul > li a {
  background: #29abe2; /*背景*/
  border: #29abe2 1px solid; /*枠*/
  color: #ffffff; /*文字色*/
}

/*イベント＆お知らせ一覧の日付の隣のカテゴリにカーソルが合った時*/
.top04_02cate > ul > li a:hover {
  background: #ffffff; /*背景*/
  color: #29abe2; /*文字色*/
}

/*==========================
	TOP　イベント＆お知らせ
=========================***/

/*イベント＆お知らせ一覧　のテキスト*/
.top04_01more a {
  color: #29abe2;
}
/*イベント＆お知らせ一覧　のテキストにカーソル合わせたとき*/
.top04_01more a:hover {
  color: #000000;
}

/*イベント＆お知らせ一覧　の矢印アイコン*/
.top04_01more a::before {
  background: url("../img/common/icon_more_F15A24.svg") no-repeat;
}

/*==========================
	TOP　施工事例
=========================***/

/*施工事例の全体の背景色*/
.top03_01 > ul > li a,
.top03_02text {
  background: #ffffff; /*背景色*/
}
/*施工事例にカーソルが合ったときの全体背景色*/
.top03_01 > ul > li a:hover .top03_02text {
  background: #fdd23e; /*背景色*/
}
/*施工事例料金部分の背景*/
.top03_02fee {
  background: #ffe780; /*背景色*/
}
/*施工事例にカーソルが合ったときの料金の背景色*/
.top03_01 > ul > li a:hover .top03_02fee {
  background: #fbb03b; /*背景色*/
}
/*施工事例の#○○のテキスト部分*/
.top03_01tag > ul > li,
.top03_01tag > ul > li a {
  color: #00a6dc; /*文字色*/
}
/*施工事例の#○○の#部分*/
.top03_01tag > ul > li::before {
  content: "#";
  color: #00a6dc; /*文字色*/
}
/*施工事例の#○○にカーソルが合ったとき*/
.top03_01tag > ul > li a:hover {
  color: #000000; /*文字色*/
}

/*施工事例下部分のボタン２つ（地域で選ぶ、工事内容で選ぶ）*/
.top03_03 > ul > li > a {
  background: #fb7b1b; /*背景色*/
  border: #fb7b1b 2px solid; /*枠*/
}

/*施工事例下部分のボタン２つ（地域で選ぶ、工事内容で選ぶ）にカーソルが合った時*/
.top03_03 > ul > li > a:hover {
  border: #ffffff 2px solid; /*枠*/
}

/*==========================
	TOP　選ばれる理由
=========================***/

/*枠の色*/
.top02_01 > ul > li {
  border: #bdd5f2 6px solid; /*枠*/
}

/*==========================
	TOP　ショールームのご案内
=========================***/

/*対応エリアの色*/
.top06_01area {
  background: #002f7b; /*背景*/
  color: #ffffff; /*文字色*/
}

/*==========================
	フッター
=========================***/
/*フッターの背景色*/
.back_foot {
  background: #29abe2; /*背景*/
}
/*フッターの文字色*/
.foot_colo {
  color: #ffffff !important;
} /*文字色*/
.foot_colo a {
  color: #ffffff !important;
} /*文字色*/

/*=========================================
	流れ
=========================================*/

.flow02_01 > ul > li::after {
  background-image: radial-gradient(circle farthest-side, #002f7b 35%, transparent 25%, transparent 100%); /*点線の色*/
}

.flow02_01text {
  background: #ffffff; /*背景色*/
  box-shadow: 4px 4px rgba(0, 0, 0, 0.15); /*影の色*/
}

/*=========================================
	よくある質問
=========================================*/

.qa01_01 > ul > li {
  border: #ffefb2 5px solid; /*ボーダーの色*/
}
.qa01_01 > ul > li > a {
  background: #ffefb2; /*アンサーの背景色*/
}
.qa01_00 h3 {
  color: #002f7b; /*カテゴリタイトルの文字色*/
}
.qa01_01 > ul > li dl dt {
  color: #f15a24; /*QとAの文字色*/
}
.qa01_01 > ul > li > a::after {
  content: "";
  background: url("../img/sub/icon_faq_plus.svg") no-repeat; /*＋の画像*/
}

.qa01_01 > ul > li > a.active::after {
  content: "";
  background: url("../img/sub/icon_faq_minus.svg") no-repeat; /*-の画像*/
}

/*=================================================================================*/
/** 768px以上　タブレット縦　サイズ画面  **/
@media (min-width: 768px) {
  /*==========================
	TOP　イベント＆お知らせ
=========================***/

  /*イベント＆お知らせ一覧　の記事の真ん中の縦線*/
  .top04_02 > ul > li {
    border-right: #3194cb 1px solid;
  }
}

@media (min-width: 1200px) {
}

/*=================================================================================*/
/** 1600px以上 padding: ;PCサイズ画面 **/

@media (min-width: 1300px) {
}

@media (min-width: 1400px) {
  /*=================================
	ヘッダーのお問い合わせボタン
==================================*/

  /*ボタンの色*/
  .head_cont {
    background: #fb7b1b;
  }
  /*ボタンの矢印の色*/
  .head_cont::after {
    content: "";
    background: url("../img/common/icon_arrow_FCEE21.svg") no-repeat;
  }

  /*=================================
	ヘッダーの影
==================================*/

  .head_block {
    box-shadow: 0 5px #ffb000;
  }
}

@media (min-width: 1750px) {
}
