:root {
  /**[ヘッダ-境界線]**/
  --fa-header-border-color: #0A548E;
  /**[ヘッダ-背景]**/
  --fa-header-background-color: transparent;
  /**[メインコンテンツエリア-背景]**/
  --fa-main-content-background-color: linear-gradient(90deg, rgb(10,84,142) 0%, rgba(10,84,142) 100%);
  /**[サブコンテンツエリア-背景]**/
  --fa-sub-content-background-color: #f0f8fd;
  /**[コンテンツエリア-背景]**/
  --fa-content-color: #f9fafb;
  /**[フッター-背景]**/
  --fa-footer-background-color: linear-gradient(90deg, rgba(10,84,142) 0%, rgba(10,84,142) 100%);
  /**[検索キーワード]**/
  --fa-keyword-color: #0A548E;
  /**[検索ナビゲーション-アイコン-背景]**/
  --fa-category-background-color: #0A548E;
  /**[検索ナビゲーション-フォーカス]**/
  --fa-category-focus-color: #dff0ff;
  /**[検索ナビゲーション-タイトル-境界線]**/
  --fa-category-content-border-color: linear-gradient(90deg, rgba(10,84,142) 0%, rgba(10,84,142) 100%);
  /**[リンク]**/
  --fa-link-color: #007bc7;
  /**[リンク-フォーカス]**/
  --fa-link-focus-color: #0A548E;
  /**[ボタン1-背景]**/
  --fa-button1-background-color: linear-gradient(90deg, rgba(10,84,142) 0%, rgba(10,84,142) 100%);
  /**[ボタン1-文字]**/
  --fa-button1-font-color: #fff;
  /**[ボタン2-境界線]**/
  --fa-button2-border-color: rgba(18, 38, 63, .2);
  /**[ボタン2-背景]**/
  --fa-button2-background-color: transparent;
  /**[ボタン2-文字]**/
  --fa-button2-font-color: #333;
  /**[ボタン3-境界線]**/
  --fa-button3-border-color: #0093f7;
  /**[ボタン3-背景]**/
  --fa-button3-background-color: transparent;
  /**[ボタン3-文字]**/
  --fa-button3-font-color: #333;
  /**[一覧-境界線]**/
  --fa-list-border-color: #d5d9e0;
  /**[アイコン1]**/
  --fa-icon1-color: #009dfe;
  /**[アイコン2]**/
  --fa-icon2-color: #ef2020;
  /**[フォームウイジェット]**/
  --fa-form-widget-color: #009dfe;
  /**[ウィザードコンテンツ]**/
  --fa-wizard-color: #009dfe;
}

a[href] {
  color: var(--fa-link-color);
}
a:hover,
a:focus {
  color: var(--fa-link-focus-color);
}
body.color-blue #login-main .login-main-inner .area-login .area-login-content-inner .area-btn-login .btn-login {
  background: var(--fa-button1-background-color);
  color: var(--fa-button1-font-color);
}
.hdg-lv2-01 .hdg-icon.label-new {
  background-color: var(--fa-icon1-color);
}
.label-new {
  background-color: var(--fa-icon2-color);
}
.fhButton a,
#str-header .str-header-inner .area-header .txt-header-login,
#str-header .str-header-inner .area-header .txt-header-contact a,
#str-header .str-header-inner .area-header .txt-header-general a {
  box-shadow: 0px 0px 6px 0 var(--fa-button2-border-color);
  background-color: var(--fa-button2-background-color);
  color: var(--fa-button2-font-color);
}
#str-header .str-header-inner .area-header .txt-header-login span {
  color: var(--fa-button2-font-color);
}
#str-header .str-header-inner .area-header .lyt-header-menu .header-login-controls[aria-expanded="false"]::before {
  border-color: var(--fa-button2-font-color) transparent transparent transparent;
}
#str-header .str-header-inner .area-header .lyt-header-menu .header-login-controls[aria-expanded="true"]::before {
  background-color: inherit;
  border-color: transparent transparent var(--fa-button2-font-color) transparent;
}
.fhButton.js-modal-link.advanced a {
  border: 1px solid var(--fa-button3-border-color);
  background: var(--fa-button3-background-color);
  color: var(--fa-button3-font-color);
}
#str-header .str-header-inner .area-header .font-size-change button[type="button"] {
  border-color: var(--fa-button2-border-color);
  background-color: var(--fa-button2-background-color);
  color: var(--fa-button2-font-color);
}
#str-header .str-header-inner .area-header .font-size-change button[type="button"]:last-child {
  border-color: var(--fa-button2-border-color);
}
/* ============================================================================
 * _link リンクモジュール
 * ========================================================================= */
.link-single a::after {
  border-top: .125rem solid var(--fa-link-color);
  border-left: .125rem solid var(--fa-link-color);
}
/* ----------------------------------------------------------------------------
 * .list-link-row
 * ------------------------------------------------------------------------- */
.list-link-row > li a::before {
  border-top: .14em solid var(--fa-link-color);
  border-left: .14em solid var(--fa-link-color);
}
/* ----------------------------------------------------------------------------
 * .list-news　ニュースリスト
 * ------------------------------------------------------------------------- */
.list-news li {
  border-bottom: 0px solid var(--fa-list-border-color);
}

.list-news li:first-child {
  border-top: 1px solid var(--fa-list-border-color);
}
/* ----------------------------------------------------------------------------
 * .list-question　質問リスト
 * ------------------------------------------------------------------------- */
.list-question li {
  border-bottom: 1px solid var(--fa-list-border-color);
}
/* ----------------------------------------------------------------------------
 * .area-general-wrap　汎用エリア
 * ------------------------------------------------------------------------- */
.area-general-wrap:nth-child(odd) {
  background-color: var(--fa-content-color);
}

.area-general-wrap:only-child {
	background-color: initial;
}
/* ----------------------------------------------------------------------------
 * .list-category　カテゴリリスト（SP時トグル）
 * ------------------------------------------------------------------------- */
.list-category li .hdg-category a:hover,
.list-category li .hdg-category a:focus,
.list-category li .hdg-category .hdg-category-inner:hover,
.list-category li .hdg-category .hdg-category-inner:focus {
  background-color: var(--fa-category-focus-color);
}
/* ----------------------------------------------------------------------------
 * .list-search-results　開閉機能（検索結果リスト）
 * ------------------------------------------------------------------------- */
.list-search-results li {
  border-bottom: 1px solid var(--fa-list-border-color);
}
.list-search-results li .js-search-results-hdg .btn::before,
.list-search-results li .js-search-results-hdg .btn::after {
  background: var(--fa-icon1-color);
}
/* ----------------------------------------------------------------------------
 * #str-header　共通ヘッダ
 * ------------------------------------------------------------------------- */
body.color-blue #str-header {
  border-bottom-color: var(--fa-header-border-color);
  background-color: var(--fa-header-background-color);
}

/* ----------------------------------------------------------------------------
 * .site-main　メインコンテンツエリア
 * ------------------------------------------------------------------------- */
body.color-blue #str-main #knowledgeSearch::after {
  background: var(--fa-main-content-background-color);
}
/* ----------------------------------------------------------------------------
 * #str-footer　共通フッタ
 * ------------------------------------------------------------------------- */
body.color-blue #str-footer .area-footer {
  background: var(--fa-footer-background-color);
}
/* ============================================================================
 * _module
 * ========================================================================= */
/* ----------------------------------------------------------------------------
 * .area-search-form　トップページ 検索エリア
 * ------------------------------------------------------------------------- */
body.color-blue .area-search-form .area-search-input {
  border-color: var(--fa-keyword-color);
}

body.color-blue .area-search-form .area-search-submit {
  border-color: var(--fa-keyword-color);
  background-color: var(--fa-keyword-color);
}

body.color-blue .area-search-form .area-search-submit button {
  border-color: var(--fa-keyword-color);
  background-color: var(--fa-keyword-color);
}

body.color-blue .area-search-form .area-search-category {
  border-color: var(--fa-keyword-color);
}
/* ----------------------------------------------------------------------------
 * .hdg-lv2-03　見出しレベル2
 * ------------------------------------------------------------------------- */

/* ----------------------------------------------------------------------------
 * .hdg-lv3-01　見出しレベル3
 * ------------------------------------------------------------------------- */

/* ============================================================================
 * _btn ボタンモジュール
 * ========================================================================= */
/* ----------------------------------------------------------------------------
 * .btn-contact　お問い合わせボタン
 * ------------------------------------------------------------------------- */
body.color-blue .btn-contact .btn-contact-inner:not(:disabled) {
  background: var(--fa-button1-background-color);
  color: var(--fa-button1-font-color);
}

/* ----------------------------------------------------------------------------
 * .btn-send　送信ボタン
 * ------------------------------------------------------------------------- */
body.color-blue .area-btn-send .btn-send:enabled {
  background: var(--fa-button1-background-color);
  color: var(--fa-button1-font-color);
}
body.color-blue .area-btn-send .btn-send:enabled .btn-inner::before {
  border-top: solid var(--fa-button1-font-color);
  border-left: solid var(--fa-button1-font-color);
}

/* ============================================================================
 * _box ボックスモジュール
 * ========================================================================= */
/* ----------------------------------------------------------------------------
 * .box-searchlocation　店舗検索ボックス（トップ固有）
 * ------------------------------------------------------------------------- */

/* ============================================================================
 * _list リストモジュール
 * ========================================================================= */
/* ----------------------------------------------------------------------------
 * .list-question　質問リスト（サブメニュー機能）
 * ------------------------------------------------------------------------- */
 
/* ----------------------------------------------------------------------------
 * .link-sns-print　SNS・印刷ボタン
 * ------------------------------------------------------------------------- */
.link-sns-print li .btn-sns,
.link-sns-print li.btn-print > button[type="button"],
.link-sns-print li.btn-copy-link {
  box-shadow: 0px 0px 6px 0 var(--fa-button2-border-color);
  background-color: var(--fa-button2-background-color);
  color: var(--fa-button2-font-color);
}

/* ----------------------------------------------------------------------------
 * .list-category　カテゴリリスト（SP時トグル）
 * ------------------------------------------------------------------------- */

body.color-blue .list-category li .hdg-category a .icon-category,
body.color-blue .list-category li .hdg-category .hdg-category-inner .icon-category {
  background-color: var(--fa-category-background-color);
}

/* ----------------------------------------------------------------------------
 * .list-search-results　開閉機能（検索結果リスト）
 * ------------------------------------------------------------------------- */
.list-search-results li .js-search-results-content {
  background-color: rgba(236,238,242,.3);
}

/* ----------------------------------------------------------------------------
 * .list-frm-radio　ラジオボタン
 * ------------------------------------------------------------------------- */

/* ----------------------------------------------------------------------------
 * .list-frm-check　チェックボックス
 * ------------------------------------------------------------------------- */
body.color-blue .txt-check-item-label input[type="checkbox"]:checked + .txt-check-item::after,
body.color-blue .list-frm-check li .txt-check-item-label input[type="checkbox"]:checked + .txt-check-item::after {
  border-bottom-color: var(--fa-form-widget-color);
  border-left-color: var(--fa-form-widget-color);
}
/* ----------------------------------------------------------------------------
 * .dropzone　添付ファイル
 * ------------------------------------------------------------------------- */
 .area-contents .dropzone .dz-preview .dz-remove {
  border: 1px solid var(--fa-button2-border-color);
  background-color: var(--fa-button2-background-color);
  color: var(--fa-button2-font-color);
}
/* ============================================================================
 * _tbl テーブルモジュール
 * ========================================================================= */
/* ----------------------------------------------------------------------------
 * .tbl-frm フォームテーブル
 * ------------------------------------------------------------------------- */

/* ============================================================================
 * _form フォーム関連モジュール
 * ========================================================================= */

/* ----------------------------------------------------------------------------
 * .btn-form
 * ------------------------------------------------------------------------- */
body.color-blue .btn-form li button[type="submit"]:enabled {
  background: var(--fa-button1-background-color);
  color: var(--fa-button1-font-color);
}
.btn-form li button[type="submit"]:enabled .btn-inner::after {
  border-top-color: var(--fa-button1-font-color);
  border-left-color:  var(--fa-button1-font-color);
}
/* ----------------------------------------------------------------------------
 * .area-free-opinion　テキストエリア
 * ------------------------------------------------------------------------- */

/* ----------------------------------------------------------------------------
 * .txt-agree .txt-privacy　（お問い合わせ）
 * ------------------------------------------------------------------------- */
body.color-blue .txt-privacy .txt-privacy-check input[type="checkbox"]:checked + .txt-check-item::after {
  border-bottom-color: var(--fa-form-widget-color);
  border-left-color: var(--fa-form-widget-color);
}

/* ----------------------------------------------------------------------------
 * .list-frm-radio　ラジオボタン
 * ------------------------------------------------------------------------- */
body.color-blue .list-frm-radio li input[type="radio"] + .txt-label::after {
  background: var(--fa-form-widget-color);
  border-color: var(--fa-form-widget-color);
}

/* ============================================================================
 * _area エリア
 * ========================================================================= */
/* ----------------------------------------------------------------------------
 * .area-faq-cont　質問エリア
 * ------------------------------------------------------------------------- */
body.color-blue .area-faq-cont {
  background-color: var(--fa-sub-content-background-color);
}
/* ----------------------------------------------------------------------------
 * .area-searchlocation-cont　店舗検索エリア
 * ------------------------------------------------------------------------- */
body.color-blue .area-searchlocation-cont {
  background-color: var(--fa-sub-content-background-color);
}
/* ----------------------------------------------------------------------------
 * .talk トークスクリプト トーク
 * ------------------------------------------------------------------------- */
.talk .header {
  background: var(--fa-wizard-color);
  border: 1px solid var(--fa-wizard-color);
}
.talk .content {
  border: 1px solid var(--fa-wizard-color);
}
.talk .talkLog .fhButton a:hover,
.talk .content .talkTransition .fhButton a.selected {
  border-color: var(--fa-wizard-color);
  background-color: var(--fa-wizard-color);
}
.talk .talkDownAllow {
  border-top: 25px solid var(--fa-wizard-color);
}

@media screen and (max-width: 767px){
  .js-sp-toggle li .hdg-category a,
  .js-sp-toggle li .hdg-category .hdg-category-inner{
    color: var(--fa-link-color);
  }
  .js-sp-toggle li .hdg-category .btn::before,
  .js-sp-toggle li .hdg-category .btn::after{
    background: var(--fa-icon1-color);
  }
  .js-sp-toggle li .list-link-row{
    border-top: 1px solid var(--fa-list-border-color);
  }
}

#str-header .str-header-inner .area-header .lyt-header-menu  .dropdown-box-iner {

}
.list-search-results li .js-search-results-hdg .label-reception-open {
	background-color: var(--fa-icon1-color);
}
.label-call-reg-type-web {
  background-color: var(--fa-icon1-color);
}
.area-border-top .hdg-lv2-01::after {
  background: var(--fa-category-content-border-color);
}
/* ----------------------------------------------------------------------------
 * 画像差し替え
 * ------------------------------------------------------------------------- */
.icon-faq {
	width:56px;
	height:56px;
	mask: url('../images/icon-faq.svg'); /* マスクとしてSVGを使用 */
	mask-repeat: no-repeat;
	mask-size: contain;
	mask-position: center;

	/* Webkit対応のためのベンダープレフィックス */
	-webkit-mask: url('../images/icon-faq.svg');
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	-webkit-mask-position: center;
	
	background-color: var(--fa-icon1-color);
}
.icon-attach {
	width:29px;
	height:29px;
	mask: url('../images/icon-attach.svg'); /* マスクとしてSVGを使用 */
	mask-repeat: no-repeat;
	mask-size: contain;
	mask-position: center;

	/* Webkit対応のためのベンダープレフィックス */
	-webkit-mask: url('../images/icon-attach.svg');
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	-webkit-mask-position: center;
	
	background-color: var(--fa-icon1-color);
}
.icon-important {
	width:36px;
	height:36px;
	mask: url('../images/icon-important.svg'); /* マスクとしてSVGを使用 */
	mask-repeat: no-repeat;
	mask-size: contain;
	mask-position: center;

	/* Webkit対応のためのベンダープレフィックス */
	-webkit-mask: url('../images/icon-important.svg');
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	-webkit-mask-position: center;
	
	background-color: var(--fa-icon1-color);
}
.icon-look {
	width:36px;
	height:36px;
	mask: url('../images/icon-look.svg'); /* マスクとしてSVGを使用 */
	mask-repeat: no-repeat;
	mask-size: contain;
	mask-position: center;

	/* Webkit対応のためのベンダープレフィックス */
	-webkit-mask: url('../images/icon-look.svg');
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	-webkit-mask-position: center;
	
	background-color: var(--fa-icon1-color);
}
.icon-mypage {
	width:56px;
	height:56px;
	mask: url('../images/icon-mypage.svg'); /* マスクとしてSVGを使用 */
	mask-repeat: no-repeat;
	mask-size: contain;
	mask-position: center;

	/* Webkit対応のためのベンダープレフィックス */
	-webkit-mask: url('../images/icon-mypage.svg');
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	-webkit-mask-position: center;
	
	background-color: var(--fa-icon1-color);
}
.icon-inquiry-list {
	width:56px;
	height:56px;
	mask: url('../images/icon-inquiry-list.svg'); /* マスクとしてSVGを使用 */
	mask-repeat: no-repeat;
	mask-size: contain;
	mask-position: center;

	/* Webkit対応のためのベンダープレフィックス */
	-webkit-mask: url('../images/icon-inquiry-list.svg');
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	-webkit-mask-position: center;
	
	background-color: var(--fa-icon1-color);
}
.icon-contract-list {
	width:56px;
	height:56px;
	mask: url('../images/icon-contract-list.svg'); /* マスクとしてSVGを使用 */
	mask-repeat: no-repeat;
	mask-size: contain;
	mask-position: center;

	/* Webkit対応のためのベンダープレフィックス */
	-webkit-mask: url('../images/icon-contract-list.svg');
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	-webkit-mask-position: center;
	
	background-color: var(--fa-icon1-color);
}