@charset "utf-8";
/*//////////////////////////////////////

  さくら外壁塗装PC　基本設定

/////////////////////////////////////*/

/*=================================
  リセット
=================================*/
html,body {
  margin: 0;
  padding: 0;
  font-family: "helvetica neue", helvetica, verdana, arial, meiryo, sans-serif;
}
* {
  margin: 0;
  padding: 0;
  border: none;
  color: #333;
  font-size: 100%;
  font-weight: normal;
  list-style: none;
  text-decoration: none;
}
img {
  vertical-align: bottom;
}
a:hover {
  text-decoration: underline;
}


/* スマホサイト誘導ボタン */
#bt_sp {
  z-index: 1;
  position: relative;
  padding: 40px 40px 60px;
}
#bt_sp a {
  /*position: relative;*/
  /*top: 0;*/
  display: block;
  padding: 40px 20px;
  border-radius: 10px;
  border: 3px solid #d77;
  -webkit-box-shadow: 4px 4px 10px rgba(0,0,0,0.2);
  box-shadow: 4px 4px 10px rgba(0,0,0,0.2);
  background-color: #fee;
  color: #c00;
  text-align: center;
  font-size: 70px;
  font-weight: bold;
  text-decoration: none;
}
#bt_sp + #container #header {
  position: relative;
  margin-top: -24px;
  /*margin-top: 290px;*/
}
#bt_sp + #container .header_top {
  z-index: 100;
  position: relative;
}


/*=================================
  大枠
=================================*/
.wrapper {
  margin: auto;
  border-top: 3px solid #fda4a4;
}


/*=================================
  ヘッダー
=================================*/
header {
  position: relative;
  width: 980px;
  min-height: 70px;
  margin: auto;
  padding-top: 50px;
}

/* 上部テキスト
------------------------------------*/
header .desc {
  position: absolute;
  top: 5px;
  left: 0;
  width: 528px;
  white-space: nowrap;
  overflow: hidden;
  color: #555;
  font-size: 11px;
}

/* 上部リンク
------------------------------------*/
header ul.links {
  position: absolute;
  top: 4px;
  right: 0;
  /*display: table;*/
}
header ul.links li {
  display: inline-block;
  margin-right: 10px;
}
header ul.links li a {
  display: block;
  padding-left: 10px;
  font-size: 11px;
  background: url(/public/img/common/ico_arrow_gray_small.png) no-repeat left center;
}
header ul.links li:last-of-type {
  margin-right: 0;
}

/* サイトロゴ
------------------------------------*/
p.logo {
}

/* ３訴求
------------------------------------*/
header .points {
  position: absolute;
  top: 47px;
  left: 267px;
  width: 472px;
  letter-spacing: -0.4em; /* inline-blockの隙間対策 */
}
header .points li {
  display: inline-block;
  vertical-align: middle;
  letter-spacing: normal; /* inline-blockの隙間対策 */
}
header .points li:nth-child(1),
header .points li:nth-child(2),
header .points li:nth-child(3) {
  padding-bottom: 10px;
}
header .points li:nth-child(1) { padding-right: 23px; }
header .points li:nth-child(2) { padding-right: 21px; }
header .points li:nth-child(4) { padding-right: 14px; }

/* フリーダイヤル
------------------------------------*/
.fdial {
  position: absolute;
  top: 40px;
  right: 0;
  display: block;
  text-align: center;
}
.fdial:hover {
  text-decoration: none;
}
.fdial_ttl {
  margin-bottom: 7px;
}
.fdial-body p {
  margin-bottom: 2px;
}
.fdial-body span {
  font-size: 11px;
}
.fdial-body .num {
  font-size: 12px;
  letter-spacing: 0.12em;
}

/*=================================
  グロナビ
=================================*/
.g-nav {
  display: block;
  margin: 13px auto 20px;
}
.g-nav_list {
  display: flex;
  flex-wrap: wrap;
  width: 980px;
  margin: auto;
}
.g-nav_list li {
  vertical-align: top;
}
.g-nav_list li a {
  box-sizing: border-box;
  position: relative;
  display: block;
  border-bottom: 2px solid #fff;
  color: #000;
  font-size: 16px;
  text-align: center;
  line-height: 1.2;
}
.g-nav_list li.color a {
  font-size: 14px;
}
.g-nav_list li a:hover {
  background: -webkit-linear-gradient(top, #fff2f2 0%,#fffafa 45%,#fff2f2 95%,#fd898b 100%);
  background: linear-gradient(to bottom, #fff2f2 0%,#fffafa 45%,#fff2f2 95%,#fd898b 100%);
  text-decoration: none;
  border-bottom: 2px solid #fd898b;
}
.g-nav_list li a .en {
  position: absolute;
  bottom: 7px;
  right: 0;
  left: 0;
  display: block;
  margin: 0 auto;
  color: #ffaaab;
  font-size: 9px;
  letter-spacing: 0.1ex;
  line-height: 1;
}
.g-nav_list li .em {
  color: #ff3e3f;
  font-weight: bold;
}
.g-nav_list li .em-num {
  font-size: 22px;
}
.g-nav_list li .em-txt {
  font-size: 20px;
}
.g-nav_list img {
  vertical-align: middle;
}
.g-nav_icon-free {
  position: absolute;
  top: -20px;
  left: 12px;
  height: 23px;
  padding: 0 8px;
  border-radius: 3px;
  border: 1px solid #ffaaab;
  background-color: #fff;
  color: #ff3e3f;
  font-size: 18px;
  font-weight: bold;
  line-height: 23px;
}
.g-nav_icon-free::before,
.g-nav_icon-free::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  width: 0;
  height: 0;
  margin: 0 auto;
  border: 5px solid transparent;
  border-bottom: none;
}
.g-nav_icon-free::before {
  bottom: -7px;
  border-top: 6px solid #ffaaab;
}
.g-nav_icon-free::after {
  bottom: -5px;
  border-top: 6px solid #fff;
}
/*=================================
  ページトップ
=================================*/
p.pagetop {
  clear: both;
  width: 980px;
  margin: 30px auto 0;
  padding-right: 20px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background: url(/public/img/common/ico_pagetop.png) 100% center no-repeat;
  font-size: 14px;
  text-align: right;
}
p.pagetop a:hover {
  text-decoration: none;
}


/*=================================
  フッター
=================================*/
footer {
  clear: both;
  width: 980px;
  margin: 0 auto 90px;
  padding: 0;
}
footer ul.bnr_footer {
  display: table;
  width: 998px;
  margin: 15px 0;
  padding: 10px 0;
}
footer .bnr_footer li {
  display: table-cell;
  vertical-align: top;
}
footer .bnr_footer li img {
  display: inline-block;
  vertical-align: middle;
}
footer .bnr_footer li .txt {
  display: inline-block;
  font-size: 11.5px;
  line-height: 1.4;
  text-align: justify;
  -ms-text-justify: inter-ideograph;
  text-justify: inter-ideograph;
  vertical-align: middle;
}

/**/

/**/
footer .security {
  width: 180px;
  padding: 0 42px 0 52px;
  border-right: 1px solid #ddd;
}
footer .security_wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 180px;
}
footer .security .security_wrap img {
  margin-right: 0px;
}
footer .security_txt{
  width: 180px;
  margin-bottom: 8px;
  color: #4170b3;
  font-size: 12px;
  font-weight: bold;
  text-align: center;
}
footer .sns {
  width: 200px;
  padding: 0 20px 0 30px;
}
footer .sns_txt {
  width: 200px;
  margin-bottom: 8px;
  font-size: 12px;
  font-weight: bold;
  text-align: center;
}
footer .sns_wrap {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  width: 200px;
}
/**/
footer .bnr_footer li.logo {
  width: 319px;
  padding-right: 0px;
  padding: 0 52px;
  vertical-align: middle;
  border-right: 1px solid #ddd;
}
footer .logo img {
  margin: 10px 25px  0 0;
  vertical-align: middle;
}

/**/
footer small {
  clear: both;
  display: block;
  color: #555;
  font-size: 10px;
  text-align: center;
}
/*--------------------------------
  フッターリンク
--------------------------------*/
.footer-link-wrap {
  margin: 10px 0 0;
  background-color: #f9f9f9;
}
.footer-link {
  box-sizing: border-box;
  width: 980px;
  margin: 0 auto;
  padding: 22px 0 15px 9px;
}
.footer-link-list li {
  margin-bottom: 10px;
  padding-left: 1em;
  text-indent: -1em;
}
.footer-link-list a {
  color: #333;
  font-size: 13px;
  text-decoration: none;
}
.footer-link-list a:hover {
  text-decoration: underline;
}
.footer-link-list a::before {
  content: "";
  display: inline-block;
  margin-right: 9px;
  border: 4px solid transparent;
  border-left: 8px solid #ccc;
  border-right: none;
  vertical-align: baseline;
}
.footer-link-list--sub a {
  font-size: 12px;
}
.footer-link-list--sub a::before {
  margin-right: 5px;
  border: 4px solid transparent;
  border-left: 6px solid #ccc;
  border-right: none;
}
/* 列
--------------------------------*/
.footer-link-col {
  box-sizing: border-box;
  float: left;
}
.footer-link-col--1 {
  width: 230px;
}
.footer-link-col--2 {
  width: 252px;
}
.footer-link-col--3 {
  width: 294px;
  padding-right: 24px;
}
.footer-link-col--4 {
  width: 195px;
}
/* 見出し
--------------------------------*/
.footer-link-hd {
  margin-bottom: 5px;
  font-size: 13px;
}
.footer-link-hd--adjust {
  margin-top: 24px;
}
/*--------------------------------
  施工店リスト
--------------------------------*/
footer section.list_area_shop {
  clear: both;
  width: 980px;
  margin: 12px auto 0;
  padding: 0 9px 8px;
  border-bottom: 1px solid #ccc;
  font-size: 13px;
}
footer section.list_area_shop .h_list_area_shop {
  margin-bottom: 12px;
}
footer .h_list_area_shop a {
  display: inline-block;
  height: 26px;
  font-size: 14px;
  padding-left: 35px;
  background: url("/public/img/common/icon_shop.png") left center no-repeat;
  color: #d51f20;
  font-weight: bold;
  text-decoration: none;
  line-height: 26px;
}
footer section.list_area_shop .h_area {
  clear: both;
  float: left;
}
footer section.list_area_shop .h_area a {
  display: inline-block;
  width: 128px;
  height: 23px;
  background-color: #ffe7e9;
  text-align: center;
  text-decoration: none;
  line-height: 23px;
}
footer section.list_area_shop .h_area.widen:first-letter {
  margin-right: 1em;
}
footer section.list_area_shop .shops {
  margin: 0 0 0 138px;
}
footer section.list_area_shop .shops .list li {
  float: left;
  margin: 0 20px 13px 0;
}
footer section.list_area_shop .shops .list a::before {
  content: "";
  display: inline-block;
  margin-right: 5px;
  border: 4px solid transparent;
  border-left: 7px solid #ffc1c5;
  border-right: none;
  vertical-align: middle;
}
footer section .list {
  margin: 15px 0 22px 13px;
}
.footer-shop-area_list {
  display: flex;
  margin-left: 12px;
}
.footer-shop-area_list li {
  margin-right: 30px;
}
.footer-shop-area_list a {
  font-size: 13px;
  color: #f6565d;
  background: none;
  font-weight: bold;
  vertical-align: middle;
  padding: 0;
}
.footer-shop-area_list a:hover{
  text-decoration: underline;
}
/* ====================================================
  フッターGPバナー
====================================================*/
.footer-gp-brand {
  width: 998px;
  margin: 0 auto 34px;
  padding-top: 26px;
  border-top: 1px solid #ccc;
}
.footer-gp-brand_head {
  margin-bottom: 11px;
}
.footer-gp-brand_head-lead {
  float: left;
  font-size: 13px;
}
.footer-gp-brand_head-lead a {
  color: #019204;
  text-decoration: none;
}
.footer-gp-brand_head-lead a:hover {
  text-decoration: underline;
}
.footer-gp-brand_head-logo,
.footer-gp-brand_head-txt {
  float: left;
}
.footer-gp-brand_head-txt {
  margin: 3px 0 0 11px;
}
.footer-gp-brand_head-addr {
  float: right;
  margin-top: 2px;
  font-size: 11px;
  text-align: right;
  line-height: 1.27;
}

/* ====================================================
 お問い合わせ（固定UI）
====================================================*/
#ui-fixed-contact {
  position: fixed !important;
  bottom: 0;
  right: 0;
  z-index: 999;
  height: 53px;
  width: 100%;
  background: #fff;
  border-top: 1px solid #bbb;
  box-shadow: 0px -1px 6px 0px rgba(0, 0, 0, 0.2);
}
#ui-fixed-contact img {
  vertical-align: baseline;
}
#ui-fixed-contact .box {
  display: block;
  width: 982px;
  height: 48px;
  margin: 0 auto;
  padding: 0;
  background: url("/public/img/common/footer/ui_fixed_contact/img_operator.png") right 4px no-repeat;
}
#ui-fixed-contact .box dl,
#ui-fixed-contact .box dt,
#ui-fixed-contact .box dd {
  float: left;
}
/*--------------------------------
  お電話でのご注文・ご相談
--------------------------------*/
#ui-fixed-contact .box .tel {
  margin-right: 34px;
}
#ui-fixed-contact .box .tel dt {
  padding: 10px 19px 0 0;
}
#ui-fixed-contact .box .tel dd {
  position: relative;
  padding-top: 10px;
}
#ui-fixed-contact .box .tel dd::after {
  content: "";
  position: absolute;
  top: 10px;
  right: -17px;
  width: 1px;
  height: 31px;
  background-color: #ccc;
}
/*--------------------------------
  サイトから問い合わせる
--------------------------------*/
#ui-fixed-contact .box .site {
  height: 29px;
  margin-top: 10px;
  border-radius: 4px 3px 3px 4px;
  border: 1px solid #f45f5f;
  background-color: #fff8f8;
  line-height: 29px;
}
#ui-fixed-contact .box .site dt {
  position: relative;
  margin-right: 24px;
  padding: 0 3px 0 8px;
  border-radius: 3px 0 0 3px;
  background-color: #f45f5f;
}
#ui-fixed-contact .box .site dt::after {
  content: "";
  position: absolute;
  top: 0;
  right: -11px;
  width: 0;
  height: 0;
  border: 14.5px solid transparent;
  border-left: 11px solid #f45f5f;
  border-right: none;
}
#ui-fixed-contact .box .site dt img {
  vertical-align: middle;
}
#ui-fixed-contact .box .site .link li {
  float: left;
  margin: 6px 16px 0 0;
  line-height: 1;
}
#ui-fixed-contact .box .site .link li.rightmost {
  margin-right: 13px;
}
#ui-fixed-contact .box .site .link a {
  padding-left: 18px;
  background: url("/public/img/common/footer/ui_fixed_contact/icon_trico_circle.png") left center no-repeat;
  color: #111;
  font-size: 13px;
  text-decoration: none;
}
#ui-fixed-contact .box .site .link a:hover {
  text-decoration: underline;
}
/* ====================================================
  現調問い合わせバナー
====================================================*/
.fixed-contact-footer {
  position: fixed !important;
  bottom: 0;
  right: 0;
  z-index: 999;
  width: 100%;
}
.fixed-contact-footer_inner {
  position: relative;
  width: 980px;
  margin: 0 auto;
}
.fixed-contact-footer_box {
  position: absolute;
  bottom: 0;
  right: -11px;
  display: flex;
  align-items: center;
  padding: 10px 10px 6px;
  border-radius: 7px 7px 0 0;
  background-color: rgba(0, 0, 0, 0.4);
}
.fixed-contact-footer_box a:first-of-type {
  margin-right: 11px;
}
.fixed-contact-footer_bnr {
  margin-right: 11px;
}
.fixed-contact-footer_btn {
  display: flex;
  align-items: center;
  border-radius: 8px;
  box-shadow: 1px 1px 6px 0px rgba(0, 0, 0, 0.6);
}
.fixed-contact-footer_bnr-lp {
  margin-right: 0;
  box-shadow: none;
}
.fixed-contact-footer_bnr-lp img {
  position: relative;
  top: -3px;
  filter: drop-shadow(1px 1px 6px rgba(0, 0, 0, 0.6));
}
/*=================================
  コンテンツ
=================================*/
article {
  width: 980px;
  margin: auto;
}


/*=====================================
  左カラム
=====================================*/
.left {
  float: left;
  width: 220px;
  padding-bottom: 30px;
}
/*--------------------------------
  営業日のお知らせ
--------------------------------*/
.left_holiday-notice {
  margin: 0 auto 15px;
  padding: 6px 10px;
  border-radius: 6px;
  border: 1px solid #0087dc;
  background: #f6fcff;
  font-size: 12px;
  text-align: left;
  line-height: 1.5;
}
.left_holiday-notice-hd {
  display: block;
  margin-bottom: 5px;
  padding-bottom: 2px;
  border-bottom: 1px dotted #0087dc;
  font-weight: normal;
  text-align: center;
  color: #0087dc;
}
/* ====================================================
  左カラムカテゴリメニュー
====================================================*/
.gleft-const-menu {
  margin-bottom: 15px;
}
.gleft-const-menu_ttl a {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px 0 5px;
  border-radius: 6px 6px 0 0;
  color: #fff;
  font-family: '游ゴシック Light', 'Yu Gothic Light', '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
  font-size: 19px;
  font-weight: bold;
  font-feature-settings: "palt";
  text-decoration: none;
  text-align: center;
  line-height: 1em;
}
.gleft-const-menu-list_ttl {
  font-size: 13px;
  color: #df494d;
  font-weight: bold;
  margin-bottom: 10px;
  text-indent: -0.3em;
}
.gleft-const-menu--wall .gleft-const-menu-list {
  padding: 0;
  border: none;
  margin-bottom: 15px;
}
.gleft-const-menu-list   {
  padding: 13px 15px 5px;
  border: 1px solid #000;
  border-radius: 0 0 6px 6px;
}
.gleft-const-menu-list li{
  margin-bottom: 9px;
} 
.gleft-const-menu-list a {
  font-size: 14px;
}
.gleft-const-menu--wall .gleft-const-menu-list a {
  display: inline-block;
  padding-left: 1em;
  text-indent: -1em;
}
.gleft-const-menu-list a::before {
  content: "";
  display: inline-block;
  margin-right: 9px;
  border: 4px solid transparent;
  border-left: 8px solid #fff;
  border-right: none;
  vertical-align: middle;
}
.gleft-const-menu--wall .gleft-const-menu_ttl a {
  padding: 10px 0 7px;
  background-color: #ef5353;
  font-weight: bold;
  font-family: meiryo, "メイリオ";
  letter-spacing: 0.1ex;
  text-shadow: 2px 2px 0px #ee0000;
}
.gleft-const-menu_wrap {
	border: 1px solid #df494d;
	border-radius: 0 0 6px 6px;
	padding: 13px 15px 2px;
}
.gleft-const-menu--wall .gleft-const-menu-list a::before {
  border-left-color: #df494d;
}
.gleft-const-menu--roof .gleft-const-menu_ttl a {
  padding: 10px 0 7px;
  text-shadow: 2px 2px 0px #d04281;
  background-color: #ef9295;
  font-size: 18px;
  font-weight: bold;
  font-family: meiryo, "メイリオ";
}
.gleft-const-menu--roof .gleft-const-menu-list {
  border-color: #ef9295;
}
.gleft-const-menu--roof .gleft-const-menu-list a::before {
  border-left-color: #ef9295;
}
.gleft-const-menu--siding .gleft-const-menu_ttl a {
  background-color: #eb985e;
  text-shadow: 2px 2px 0px #ec6941;
  padding: 10px 0 7px;
  font-weight: bold;
  font-family: meiryo, "メイリオ";
  letter-spacing: 0.1ex;
}
.gleft-const-menu--siding .gleft-const-menu-list {
  border-color: #eb985e;
}
.gleft-const-menu--siding .gleft-const-menu-list a::before {
  border-left-color: #eb985e;
}
.gleft-const-menu--accessories-painting-reform .gleft-const-menu_ttl a {
  background-color: #6f90c6;
  text-shadow: 2px 2px 0px #1f4d96;
  padding: 10px 0 7px;
  font-size: 17px;
  font-weight: bold;
  font-family: meiryo, "メイリオ";
}
.gleft-const-menu--accessories-painting-reform .gleft-const-menu-list {
  border-color: #6f90c6;
}
.gleft-const-menu--accessories-painting-reform .gleft-const-menu-list a::before {
  border-left-color: #6f90c6;
}
/* ====================================================
  スタッフブログ
====================================================*/
.gleft-staffblog {
  margin-bottom: 15px;
  border: 1px solid #ccc;
  border-radius: 4px;
}
.gleft-staffblog_ttl {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 35px;
  margin-bottom: 13px;
  border-radius: 3px 3px 0 0;
  background-color: #ffecec;
  font-size: 14px;
  font-weight: bold;
}
.gleft-staffblog-list {
  margin: 0 14px 10px;
}
.gleft-staffblog-list li {
  margin-bottom: 5px;
}
.gleft-staffblog-list a {
  display: block;
  color: #00479d;
  font-size: 13px;
  text-decoration: underline;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.gleft-staffblog-list a:hover {
  text-decoration: none;
}
.gleft-link-top li {
  margin-bottom: 15px;
}
.gleft-spr {
  display: block;
  background-image: url(/public/img/common/left/left_bnr_sprite.webp?2025020401);
  background-repeat: no-repeat;
  overflow: hidden;
  white-space: nowrap;
  text-indent: 100%;
}
.gleft-link-top li .customer-voice {
  width: 220px;
  height: 121px;
  background-position: 0px -128px;
  border-radius: 5px;
}
.gleft-link-top li .after-service {
  width: 220px;
  height: 110px;
  background-position: 0px -249px;
}

/* ====================================================
  選ばれる6つの理由
====================================================*/
.gleft-select {
  margin: -7px 0 15px -14px;
}
.gleft-select .six-reason {
  width: 234px;
  height: 128px;
  background-position: 0px 1px;
}
/* ====================================================
  配色メモ
====================================================*/
.gleft-colormemo {
  position: relative;
  display: none;
}
.gleft-colormemo-count {
  position: absolute;
  right: 8px;
  top: 0;
  bottom: 0;
  margin: auto 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 25px;
  border: 1px solid #f19149;
  border-radius: 50%;
  background-color: #fff;
  color: #f19149;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 17px;
}
/*----------------------------
  店舗検索
----------------------------*/
.left .shop-search {
  margin-bottom: 15px;
  padding-top: 7px;
  border-radius: 4px;
  border: 1px solid #fda4a4;
  background: linear-gradient(to bottom, #ffffff 47%,#ffe6e6 100%);
}
.left .shop-search_ttl {
  text-align: center;
}
.left .shop-search .shop-search_ttl .nationwide {
  display: block;
  width: 204px;
  height: 31px;
  margin: 0 auto;
  background-position: 0px -359px;
}
.left .shop-search-head {
  padding: 10px 9px 3px;
  background: url(/public/img/common/left/shop/img_map.png?20210202) right 34px top -4px no-repeat;
}
/* リンク */
.box_search_shop a:hover {
  text-decoration: none;
}
.left .shop-search_txt-num {
  margin: 0 0 26px 5px;
}
.left .shop-search_txt-num .base-point {
  width: 128px;
  height: 40px;
  background-position: 0px -390px;
}
.left .shop-search_txt-search {
  margin: 0 0 5px 0;
}
.left .shop-search_txt-search .your-town {
  width: 200px;
  height: 16px;
  background-position: 0px -430px;
}
.left .shop-search form {
  display: flex;
  justify-content: center;
  margin-bottom: 14px;
}
.left .shop-search input {
  display: inline-block;
  width: 152px;
  height: 35px;
  margin: 0;
  padding: 0 11px;
  box-sizing: border-box;
  border-radius: 3px 0 0 3px;
  border: 1px solid #007fe5;
  border-right: none;
  box-shadow: inset 1px 1px 2px rgba(0,0,0,0.1);
  font-size: 20px;
  font-family: meiryo;
  line-height: 35px;
  vertical-align: middle;
  opacity: 0.8;
}
.left .shop-search input::-webkit-input-placeholder {
  font-size: 14px;
}
.left .shop-search input::-moz-placeholder {
  font-size: 14px;
}
.left .shop-search input::placeholder-shown {
  font-size: 14px;
}
.left .shop-search button {
  cursor: pointer;
  display: inline-block;
  width: 47px;
  height: 35px;
  padding: 6px 0;
  box-sizing: border-box;
  border-radius: 0 3px 3px 0;
  background: url(/sp/img/common/icon_search_lacking_bold-white.svg) center center no-repeat #007fe5;
  background-size: 22px auto;
  vertical-align: middle;

  text-indent: 110%;
  overflow: hidden;
  white-space: nowrap;
}
.left .shop-search-btns li {
  margin-bottom: 8px;
  text-align: center;
}
.left .shop-search-btns li .gleft-spr {
  width: 189px;
  height: 36px;
  margin: 0 auto;
}
.left .shop-search-btns .store-list {
  background-position: 0px -612px;
}
.left .shop-search-btns .free-search{
  background-position: 0px -648px;
}
.left .shop-search_txt-freedial {
  padding: 1px 0 9px;
  border-radius: 0 0 2px 2px;
  text-align: center;
}
.left .shop-search_txt-freedial .call-consultaion {
  display: block;
  width: 176px;
  height: 58px;
  margin: 0 auto;
  background-position: 0px -554px;
}
.left .search-shop-list_hd {
  font-size: 14px;
}
.left .find_sekou_shop {
  position: relative;
  margin: 10px 0 10px;
  padding: 7px;
  border: 1px solid rgb(170, 170, 170);
  border-radius: 5px;
  box-shadow: 1px 1px 4px 0px rgba(0, 0, 0, 0.1);
  background-color: rgb(255, 251, 229);
  font-size: 13px;
  line-height: 1.3;
  letter-spacing: -0.01ex;
  text-align: center;
  white-space: nowrap;
}
.left .find_sekou_shop::after {
  content: "";
  position: absolute;
  bottom: -12px;
  left: 20px;
  width: 13px;
  height: 12px;
  background: url("/sp/img/menu/img_balloon_sekohzip.png") left top no-repeat;
  background-size: contain;
}
.left .contactable_area ul {
  margin: 15px auto;
}
.left .contactable_area ul li {
  display: inline-block;
  margin-right: 10px;
}
.left .contactable_area ul li a {
  padding-left: 20px;
  background: url("/sp/img/menu/icon_sakura.png") left center no-repeat;
  background-size: 14px auto;
  color: rgb(67, 158, 32);
  font-size: 14px;
}
.left .shop-search_num {
  position: absolute;
  top: -16px;
  left: -18px;
}
/*--------------------------------
  現在準備中
--------------------------------*/
.left-srch-zip-noinfo {
  margin: 10px 0;
}
.left-srch-zip-noinfo_ttl {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 8px;
  padding: 7px 0;
  border: 1px solid #b5dfa4;
  background-color: #fafdf9;
  color: #4aaf22;
  font-family: "YuGothicM", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 13px;
  font-weight: bold;
  text-align: center;
  line-height: 1.3;
}
.left-srch-zip-noinfo_txt {
  margin-bottom: 9px;
  font-size: 12px;
	text-align: justify;
}
/*--------------------------------
  問合せ
--------------------------------*/
.left-srch-zip-contact-tel_ttl {
  margin-bottom: 7px;
  color: #008f00;
  font-size: 12px;
  line-height: 1;
}
.left-srch-zip-contact-tel_num {
  padding-left: 35px;
  background: url("/public/img/common/icon_freedial.svg") 3px center no-repeat;
  background-size: 26px auto;
  color: #f00000;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 26px;
  font-weight: bold;
}
.left-srch-zip-contact_time {
  font-size: 12px;
  text-align: center;
}
/*-----------------------------------
  地域別の店舗一覧から探す
-----------------------------------*/
.box_search_shop {
  border-radius: 5px;
  box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, 0.1);
}
.box_search_shop .ttl {
  position: relative;
  display: block;
  height: 40px;
  padding-left: 13px;
  border: 1px solid #ccc;
  border-radius: 5px;
  background: url("/public/img/common/ico_map.png") 13px center no-repeat;
  color: #66bd44;
  font-size: 14px;
  /*font-weight: bold;*/
  text-align: center;
  line-height: 40px;
}
.box_search_shop .ttl.ui-open {
  border-radius: 5px 5px 0 0;
}
.box_search_shop .ttl::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 3px;
  width: 12px;
  height: 12px;
  margin: auto 0;
  border-radius: 50%;
  background: url("/sp/img/common/icon_next-moderateharlequin.svg") center no-repeat;
  background-size: 5px auto;
}
.box_search_shop .ttl.ui-open::after {
  transform: rotate(180deg);
}

/* 地方エリア
--------------------------------*/
.box_search_shop .h_area {
  position: relative;
  display: block;
  padding: 10px;
  border: 1px solid #ccc;
  border-top: none;
  background-color: #fafafa;
  font-size: 12px;
  line-height: 1.25;
}
.box_search_shop .h_area::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 10px;
  width: 13px;
  height: 8px;
  margin: auto 0;
  background: url("/public/img/common/icon_down-moderateharlequin.svg") left top no-repeat;
  background-size: contain;
}
.box_search_shop .h_area.ui-open {
  box-shadow: 0px 3px 4px 0px rgba(0, 20, 0, 0.1);
  background-color: #66bd44;
  color: #fff;
  font-weight: bold;
  z-index: 1; /* box-shadow用 */
}
.box_search_shop .h_area.ui-open::after {
  background-image: url("/public/img/common/icon_down-white.svg");
  transform: rotate(180deg);
}
.box_search_shop .h_area.last {
  border-radius: 0 0 5px 5px;
}
.box_search_shop .h_area.last.ui-open {
  border-radius: 0;
}

/* 店舗一覧
--------------------------------*/
.box_search_shop .list_shop {
  border: 1px solid #ccc;
  border-top: none;
}
.box_search_shop .list_shop.last {
  border-radius: 0 0 5px 5px;
}
.box_search_shop .list_shop li {
  border-bottom: 1px solid #ccc;
}
.box_search_shop .list_shop li:last-of-type {
  border-bottom: none;
}
.box_search_shop .list_shop li a {
  position: relative;
  display: flex;
  align-items: center;
  /*min-height: 45px;*/
  padding: 5px 10px 5px 24px;
  background: url("/public/img/common/icon_next-moderateharlequin.svg") 10px center no-repeat #f9fff7;
  background-size: 6px auto;
  color: #66bd44;
  font-size: 12px;
}
.box_search_shop .list_shop.last li a {
  border-radius: 0 0 5px 5px;
}
.box_search_shop .list_shop li:last-of-type a {
  box-shadow: 0px -3px 4px 0px rgba(0, 20, 0, 0.08) inset;
}

/*--------------------------------
  相見積もり
--------------------------------*/
.left-competitive-bids_txt {
  margin-bottom: 9px;
}

/**/
.left .buttons li,
.left .banner li {
  margin-bottom: 15px;
}
.left .banner-menu li {
  margin-bottom: 15px;
  border-bottom: 1px solid #ccc;
}
.left .buttons li {
  overflow: hidden;
  border-radius: 4px;
  -webkit-box-shadow: 2px 2px 2px rgba(0,0,0,0.2);
  box-shadow: 2px 2px 2px rgba(0,0,0,0.2);
}
.left .bnr_sim {
  overflow: hidden;
  border-radius: 4px;
  -webkit-box-shadow: 2px 2px 2px rgba(0,0,0,0.1);
  box-shadow: 2px 2px 2px rgba(0,0,0,0.1);
}
.left .bnr_shadow {
  overflow: hidden;
  border-radius: 4px;
  box-shadow: 2px 2px 4px 0px rgba(0, 0, 0, 0.15);
}
.left .bnr_shadow .fifty {
  display: block;
  width: 220px;
  height: 110px;
  background-position: 0px -684px;
}
.left .opacity .loan {
  display: block;
  width: 220px;
  height: 85px;
  background-position: 0px -795px;
}
.left .bnr_shadow .cash-back {
  display: block;
  width: 220px;
  height: 110px;
  background-position: 0px -880px;
}
.left .bnr_shadow .free-wash {
  display: block;
  width: 220px;
  height: 110px;
  background-position: 0px -991px;
}
.left .bnr_sim .estimate {
  display: block;
  width: 220px;
  height: 110px;
  background-position: 0px -1102px;
}
.left .bnr_sim .color {
  display: block;
  width: 220px;
  height: 111px;
  background-position: 0px -1212px;
}
.left .bnr_sim .wall-roof-diagnose {
  display: block;
  width: 220px;
  height: 111px;
  background-position: 0px -1323px;
}
.left .bnr_sim .self-diagnose {
  display: block;
  width: 220px;
  height: 110px;
  background-position: 0px -1545px;
}
.left .banner-menu .bnr_shadow span {
  display: block;
  width: 220px;
  height: 110px;
}
.left .banner-menu .bnr_shadow .wall-paint {
  background-position: 0px -1655px;
}
.left .banner-menu .bnr_shadow .painting-reform {
  background-position: 0px -1765px;
}
.left .banner-menu .bnr_shadow .siding-plan {
  background-position: 0px -1875px;
}
.left .banner-menu .bnr_shadow .accessories-painting-reform {
  background-position: 0px -3722px;
}
.left .banner .bnr_shadow span {
  display: block;
  width: 220px;
  height: 110px;
} 
.left .banner .bnr_shadow .roof-design {
  background-position: 0px -1985px;
}
.left .banner .bnr_shadow .reform-discount {
  background-position: 0px -2095px;
}
.left .banner .opacity .reform-blog {
  display: block;
  width: 220px;
  height: 85px;
  background-position: 0px -2205px;
}
/**/
.left .txt_links {
  margin-top: 20px;
}
.left .txt_links li {
  margin-bottom: 15px;
}
.left .txt_links li:last-of-type {
  margin-bottom: 20px;
}
.left .txt_links li a {
  display: block;
  padding-left: 15px;
  background: url(/public/img/common/ico_link_gray.png) no-repeat left center;
  font-size: 15px;
}
/*--------------------------------
  お得なキャンペーン情報
--------------------------------*/
.left-campaign-info {
  margin: 20px 0 15px;
}
.left-campaign-info_hd {
  margin-bottom: 10px;
}
/*--------------------------------
  外壁塗装コラム
--------------------------------*/
.gleft-bnr-column {
  margin: 30px 0 30px;
}
.gleft-bnr-column .blog-column {
  width: 220px;
  height: 110px;
  background-position: 0px -2290px;
}
/*--------------------------------
  カラーバナー
--------------------------------*/
.gleft-bnr-color {
  margin: 20px 0 0;
}
.gleft-bnr-color li {
  margin-bottom: 23px;
}
.gleft-bnr-color span {
  width: 220px;
  height: 50px;
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.2);
}
.gleft-bnr-color .color-estimate {
  background-position: 0px -2400px;
}
.gleft-bnr-color .color-ranking {
  background-position: 0px -2450px;
}
.gleft-bnr-color .perfecures-cost {
  background-position: 0px -2500px;
}
/* ===========================================================
  カレンダー
  global_include/left/calendar.html
===========================================================*/
.left .left_calender {
  width: 220px;
  margin-top: 20px;
}
.left .left_calender dt {
  margin-bottom: 10px;
  color: #333;
  font-size: 14px;
  text-align: center;
  line-height: 1.3;
}
.left .left_calender .workday {
  width: 220px;
  height: 36px;
  display: block;
  background-position: 0px -2551px;
}
.left .left_calender dd {
  margin-bottom: 15px;
}
.left .left_calender table {
  width: 220px;
  margin-bottom: 10px;
  border-collapse: collapse;
  border-spacing: 0;
  border: 2px solid #ddd;
}
.left .left_calender table caption {
  margin: 0 0 3px;
  padding: 0 0 0 2px;
  color: #2f7300;
  font-size: 13px;
  font-weight: bold;
  text-align: center;

  *line-height: 16px; /* IE6 & IE7 */
}
.left .left_calender table td,
.left .left_calender table th {
  padding: 5px 0 3px;
  border: 1px solid #ddd;
  font-family: "helvetica neue", helvetica, arial, meiryo, sans-serif;
  text-align: center;
  vertical-align: middle;
}
.left .left_calender table th {
  background-color: #f7f7f7;
  font-size: 12px;
  font-weight: bold;
}
.left .left_calender table td {
  padding: 4px 0;
  font-size: 12px;
}

.left .left_calender table td.sat,
.left .left_calender table th.sat,
.left .left_calender table tr td:last-child,
.left .left_calender table tr th:last-child {/* 土曜日 */
  color: #0058a8;
}
.left .left_calender table td.sun,
.left .left_calender table th.sun,
.left .left_calender table tr td:first-child,
.left .left_calender table tr th:first-child {/* 日曜日 */
  color: #e00;
}
.left .left_calender table td.holiday,
.left .left_calender table th.holiday {
  background: #ffe0e0;
}
.left .left_calender .left_calendar_info {
  margin: 3px 0 0 0;
  padding: 0 0 5px 0;
  line-height: 19px;
  white-space: nowrap;

  *white-space: normal; /* IE6 & IE7 */
  *letter-spacing: -1px; /* IE6 & IE7 */
  font-size: 11px;
}
.left .left_calender .left_calendar_info p {
  display: inline-block;
  width: 14px;
  height: 14px;
  margin-right: 3px;

  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  background: #fee3e4;
  vertical-align: middle;
}
.left .left_calender .left_calendar_notice {
  font-size: 11px;
  font-weight: normal;
}
/* フリーダイヤル
-------------------------------------------*/
.left .left_calender dd.freedial {
  margin-bottom: 20px;
  padding: 15px 0 0;
  border-top: 1px dotted #ccc;
}
.left .left_calender dd.freedial .tel {
  margin-bottom: 5px;
  text-align: center;
}
.left .left_calender dd.freedial .tel .freedial-bnr {
  display: block;
  width: 209px;
  height: 21px;
  margin: 0 0 0 auto;
  background-position: 0px -2589px;
}
.left .left_calender dd.freedial .time {
  text-align: center;
  font-size: 14px;
}
/* ===========================================================
  コールセンタースタッフ
===========================================================*/
.left .left_staff {
  width: 220px;
  margin: 15px 0 20px;
}
.left .left_staff dt {
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  line-height: 1.3;
}
.left .left_staff .call-center {
  display: block;
  width: 220px;
  height: 32px;
  background-position: 0px -2610px;
}
.left .left_staff .txt {
  padding: 10px 12px 10px;
  font-size: 13px;
  text-align: justify;
  -ms-text-justify: inter-ideograph;
  text-justify: inter-ideograph;
  line-height: 1.6;
}
.left .left_staff .staff .list {
  padding-left: 5px;
  text-align: center;
}
.left .left_staff .staff li {
  float: left;
  margin-bottom: 5px;
  padding: 0 5px;
}
.left .left_staff .staff .pic {
  background-image: url(/public/img/common/staff/sprite_staff.webp?2025102300);
  background-repeat: no-repeat;
  width: 60px;
  height: 80px;
}

.left .left_staff .staff .uematsu     { background-position: 0% 0%;  }
.left .left_staff .staff .ogawa       { background-position: 20% 0%; }
.left .left_staff .staff .morita      { background-position: 40% 0%; }
.left .left_staff .staff .sugihara    { background-position: 60% 0.2%; }
.left .left_staff .staff .kin         { background-position: 80% 0%; }
.left .left_staff .staff .murakami    { background-position: 100% 0%; }
.left .left_staff .staff .ishii       { background-position: 0% 10%; }
.left .left_staff .staff .ohta        { background-position: 20% 10.5%; }
.left .left_staff .staff .okada       { background-position: 40% 10.5%; }
.left .left_staff .staff .maeda       { background-position: 60% 10.5%; }
.left .left_staff .staff .tanaka      { background-position: 80% 10.5%; }
.left .left_staff .staff .takeuchi    { background-position: 100% 10.5%; }
.left .left_staff .staff .onishi      { background-position: 0% 20%; }
.left .left_staff .staff .nakano      { background-position: 20% 20%; }
.left .left_staff .staff .shima       { background-position: 40% 19.9%; }
.left .left_staff .staff .hachimura   { background-position: 60% 20.4%; }
.left .left_staff .staff .suda        { background-position: 0% 30.5%; }
.left .left_staff .staff .kojima      { background-position: 20% 30%; }
.left .left_staff .staff .muneyuki    { background-position: 40% 30%; }
.left .left_staff .staff .ori         { background-position: 60% 30.5%; }
.left .left_staff .staff .fukuyama    { background-position: 80% 30%; }
.left .left_staff .staff .misaka      { background-position: 100% 30%; }
.left .left_staff .staff .morisue     { background-position: 0% 40.6%; }
.left .left_staff .staff .asai        { background-position: 20% 40%; }
.left .left_staff .staff .kimura_kai  { background-position: 0% 50.5%; }
.left .left_staff .staff .ishida      { background-position: 40% 40%; }
.left .left_staff .staff .teraguchi   { background-position: 0% 60.5%; }
.left .left_staff .staff .yumoto      { background-position: 60% 40%; }
.left .left_staff .staff .koshiba     { background-position: 80% 40%; }
.left .left_staff .staff .nishimura   { background-position: 100% 40%; }
.left .left_staff .staff .fukumoto    { background-position: 20% 50%; }
.left .left_staff .staff .maeda-yu    { background-position: 40% 50%; }
.left .left_staff .staff .matsumoto   { background-position: 80% 50.5%; }
.left .left_staff .staff .ideta       { background-position: 100% 50%; }
.left .left_staff .staff .miyako      { background-position: 40% 60.1%; }
.left .left_staff .staff .yoshida     { background-position: 60% 60%; }
.left .left_staff .staff .kimura      { background-position: 80% 60%; }
.left .left_staff .staff .yokota      { background-position: 100% 60%; }
.left .left_staff .staff .sato        { background-position: 0% 70%; }
.left .left_staff .staff .yoshimura   { background-position: 80% 20.3%; }
.left .left_staff .staff .morimoto    { background-position: 100% 26%; }
.left .left_staff .staff .ueda        { background-position: 60% 50.5%; }
.left .left_staff .staff .maeda-ma    { background-position: 20% 60%; }
.left .left_staff .staff .hashimoto    { background-position: 60% 70%; }
.left .left_staff .staff .kobayashi       { background-position: 0% 80.5%; }
.left .left_staff .staff .tameda       { background-position: 80% 80.5%; }
.left .left_staff .staff .hanai       { background-position: 40% 70.5%; }
.left .left_staff .staff .hamada       { background-position: 100% 80.5%; }
.left .left_staff .staff .kamitani       { background-position: 100% 70.5%; }
.left .left_staff .staff .morimitu       { background-position: 20% 80%; }
.left .left_staff .staff .date       { background-position: 80% 70%; }
.left .left_staff .staff .kobayashi-me       { background-position: 40% 80.5%; }
.left .left_staff .staff .fukui       { background-position: 60% 80%; }
.left .left_staff .staff .miyachi       { background-position: 0% 90%; }
.left .left_staff .staff .miura       { background-position: 20% 90.3%; }
.left .left_staff .staff .yamamoto       { background-position: 40% 90%; }
.left .left_staff .staff .konishi       { background-position: 60% 90.5%; }
.left .left_staff .staff .nakahara       { background-position: 80% 90%; }
.left .left_staff .staff .nagahamaya       { background-position: 100% 90.3%; }
.left .left_staff .staff .tushi       { background-position: 20% 100.5%; }
.left .left_staff .staff .higasa       { background-position: 40% 100.2%; }
.left .left_staff .staff .ishibashi       { background-position: 60% 100%; }




.left .left_staff .staff .name {
  margin-top: 2px;
  font-size: 11px;
  text-align: center;
}
.left .left_staff a.bt_form {
  display: block;
  margin: 5px 9px 0;
  font-size: 14px;
  font-weight: bold;
  text-decoration: none;
  line-height: 1;
  border-radius: 4px;
  box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.1);
}
/* ====================================================
  スタッフスライダー
====================================================*/
.left_staff .staff_pagenation {
  padding-left: 9px;
  letter-spacing: -0.4em; /* inline-blockの隙間対策 */
}
.left_staff .staff_pagenation_foot {
  margin: 13px 0 20px;
}
.left_staff .staff_pagenation .num {
  display: inline-block;
  width: 112px;
  height: 24px;
  font-size: 12px;
  text-align: center;
  vertical-align: top;
  line-height: 24px;
  letter-spacing: normal; /* inline-blockの隙間対策 */
}
.left_staff .staff_pagenation .num .current_num {
  padding-right: 3px;
}
.left_staff .staff_pagenation .num .total_num {
  padding-left: 3px;
}
.left_staff .staff_pagenation .prev,
.left_staff .staff_pagenation .next {
  display: inline-block;
  width: 44px;
  height: 24px;
  border-radius: 3px;
  background-position: center center;
  background-repeat: no-repeat;
  background-color: #eee;
  text-indent: 100%;
  overflow: hidden;
  white-space: nowrap;
  letter-spacing: normal; /* inline-blockの隙間対策 */
}
.left_staff .staff_pagenation .prev {
  background-image: url("/public/img/common/left/staff/icon_prev-verydarkgray.png");
}
.left_staff .staff_pagenation .next {
  background-image: url("/public/img/common/left/staff/icon_next-verydarkgray.png");
}
.left_staff .staff_pagenation .disabled_nav {
  cursor: default;
  opacity: 0.4;
}
.left_staff .bt_form .mail-consultaion {
  display: block;
  width: 202px;
  height: 44px;
  background-position: 0px -2643px;
}
/* ====================================================
  ご利用ガイド
====================================================*/
.left .left_navi_guide dt {
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  line-height: 1.3;
}
.left .left_navi_guide dt .use-guide {
  width: 220px;
  height: 32px;
  display: block;
  background-position: 0px -2691px;
}
/* ====================================================
  お得なキャンペーン情報
====================================================*/
.left-campaign-information {
  margin-bottom: 6px;
}
.left-campaign-information_hd {
  height: 32px;
  margin-bottom: 16px;
  border-radius: 2px;
  font-size: 14px;
  font-weight: bold;
  line-height: 32px;
  background-color: #eee;
  text-align: center;
}
.left-campaign-information_list a {
  display: block;
  padding-left: 15px;
  background: url(/public/img/common/ico_link_gray.png) no-repeat left center;
  font-size: 14px;
}
.left-campaign-information_list li {
  padding-bottom: 10px;
}
/* ====================================================
  外壁塗装の基礎知識
====================================================*/
.left-basic-knowledge {
  margin-bottom: 23px;
}
.left-basic-knowledge--top {
  border: 1px solid #aaa;
}
.left-basic-knowledge_hd {
  height: 32px;
  margin-bottom: 16px;
  padding-left: 54px;
  border-radius: 2px;
  background: url("/public/img/common/left/icon_light.png") 30px center no-repeat #eee;
  font-size: 14px;
  font-weight: bold;
  line-height: 32px;
}
.left-basic-knowledge--top .left-basic-knowledge_list {
  padding: 0 10px 10px;
}
.left-basic-knowledge_list li {
  margin-bottom: 12px;
  font-size: 14px;
  padding-left:1em;
  text-indent:-1em;
}
.left-basic-knowledge_list > li {
  border-bottom: 1px solid #ddd;
  padding-bottom: 12px;
}
.left-basic-knowledge_list > li:last-child {
  border-bottom: none;
  padding-bottom: 0;
}
.left-basic-knowledge_list a:hover {
  text-decoration: underline;
}
.left-basic-knowledge_list-hd::before,
.left-basic-knowledge_list a::before {
  content: "";
  display: inline-block;
  margin-right: 7px;
  border: 4px solid transparent;
  border-left: 8px solid #ccc;
  border-right: none;
  vertical-align: middle;
}
.left-basic-knowledge_list .left-basic-knowledge_list-sub {
  padding-top: 12px;
  margin-bottom: -12px;
  margin-left: -1em;
}
.left-basic-knowledge_list .left-basic-knowledge_list-sub > a {
  font-size: 12px;
}
.left-basic-knowledge_list .left-basic-knowledge_list-sub li {
  font-size: 12px;
  text-align: justify;
  margin-left: 3px;
}
.left-basic-knowledge_list .left-basic-knowledge_list-sub a::before {
  content: "";
  display: inline-block;
  margin-right: 7px;
  border: 3px solid transparent;
  border-left: 5px solid #ccc;
  border-right: none;
  vertical-align: middle;
}

/* ====================================================
  よくあるご質問
====================================================*/
.left-faq-link {
  margin-bottom: 19px;
  padding: 8px 0 13px;
  border-radius: 5px;
  background-color: #ffecec;
}
.left-faq-link_ttl {
  margin: 0 0 8px 11px;
}
.left-faq-link_list {
  padding: 0 5px;
}
.left-faq-link_list li {
  margin-bottom: 5px;
}
.left-faq-link_list li:last-of-type {
  margin-bottom: 11px;
}
.left-faq-link_list li a {
  position: relative;
  display: block;
  padding: 12px 21px 8px 35px;
  border-radius: 4px;
  background: url("/public/img/common/left/faq/txt_q.png") 7px center no-repeat #fff;
  font-size: 14px;
  text-decoration: none;
}
.left-faq-link_list li a::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 3px;
  width: 10px;
  height: 17px;
  margin: auto 0;
  background: url("/public/img/common/left/faq/icon_next.png") left center no-repeat;
}
.left-faq-link_more {
  margin-right: 10px;
  text-align: right;
}
/* ====================================================
  ブログ
====================================================*/
.left-sg-blog {
  margin-top: -13px;
}
.left-sg-blog_ttl a {
  display: block;
  height: 32px;
  padding-left: 36px;
  background: url("/sp/img/common/icon_nib-black.svg") 12px center no-repeat #ffecec;
  background-size: 17px;
  font-size: 14px;
  font-weight: bold;
  text-decoration: none;
  line-height: 32px;
}
.left-sg-blog-list {
  margin-bottom: 4px;
}
.left-sg-blog-list li {
  border-bottom: 1px solid #ddd;
}
.left-sg-blog-list a:hover {
  text-decoration: none;
}
.left-sg-blog-media {
  display: flex;
  min-height: 64px;
  padding: 10px 0 6px;
}
.left-sg-blog-media_img img {
  width: 60px;
}
.left-sg-blog-media-body {
  width: 147px;
  margin-left: auto;
}
.left-sg-blog-media_date {
  display: inline-block;
  margin-top: -3px;
  padding-right: 10px;
  background: url("/sp/img/common/icon_next-brilliantred.svg") right center no-repeat;
  background-size: 5px auto;
  color: #333;
  font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 11px;
  vertical-align: top;
  font-weight: bold;
}
.left-sg-blog-media_txt {
  margin-top: -3px;
  font-size: 12px;
  text-align: justify;
  line-height: 1.4;
}
.left-sg-blog-more {
  text-align: right;
}
.left-sg-blog-more a {
  padding-right: 14px;
  background: url("/sp/img/common/icon_next-brilliantred.svg") right center no-repeat;
  background-size: 7px auto;
  color: #333;
  font-size: 12px;
  font-weight: bold;
}

/* ====================================================
  塗装事例一覧
====================================================*/
.left-sg-construction {
  margin-top: 30px;
}
.left-sg-construction_ttl a {
  display: block;
  text-align: center;
  height: 32px;
  background-color: #ffecec;
  font-size: 14px;
  font-weight: bold;
  text-decoration: none;
  line-height: 32px;
}
.left-sg-construction-list {
  margin-bottom: 4px;
}
.left-sg-construction-list li {
  border-bottom: 1px solid #ddd;
}
.left-sg-construction-list a:hover {
  text-decoration: none;
}
.left-sg-construction-media {
  display: flex;
  min-height: 64px;
  padding: 10px 0 6px;
}
.left-sg-construction-media_img img {
  width: 60px;
  height: 60px;
  object-fit: cover;
}
.left-sg-construction-media-body {
  width: 147px;
  margin-left: auto;
}
.left-sg-construction-media_date {
  display: inline-block;
  margin-top: -3px;
  padding-right: 10px;
  background: url("/sp/img/common/icon_next-brilliantred.svg") right center no-repeat;
  background-size: 5px auto;
  color: #333;
  font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 11px;
  vertical-align: top;
  font-weight: bold;
}
.left-sg-construction-media_txt {
  margin-top: -3px;
  font-size: 12px;
  text-align: justify;
  line-height: 1.4;
}
.left-sg-construction-more {
  text-align: right;
}
.left-sg-construction-more a {
  padding-right: 14px;
  background: url("/sp/img/common/icon_next-brilliantred.svg") right center no-repeat;
  background-size: 7px auto;
  color: #333;
  font-size: 12px;
  font-weight: bold;
}

/* ====================================================
  ガーデンプラスからのお知らせ
====================================================*/
.left-gp-blog {
  margin: 19px 0 30px;
}
.left-gp-blog_list {
  margin-bottom: 3px;
}
.left-gp-blog_list li {
  border-bottom: 1px solid #d1e7a5;
}
.left-gp-blog_list li:last-of-type {
  border-bottom: 2px solid #a4ce4c;
}
.left-gp-blog_list-link {
  position: relative;
  display: block;
  padding: 10px 15px 10px 0;
  background: url("/public/img/common/left/gp_blog/icon_next.png") right 2px center no-repeat;
  color: #333;
  text-decoration: none;
}
.left-gp-blog_list-img {
  float: left;
}
.left-gp-blog_list-img img {
  width: 70px;
  height: 70px;
  border-radius: 2px;
}
.left-gp-blog_list-detail {
  float: right;
  width: 127px;
}
.left-gp-blog_list-txt {
  font-size: 14px;
  line-height: 1.4;
}
.left-gp-blog_list-date {
  position: absolute;
  bottom: 10px;
  right: 15px;
  color: #888;
  font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 11px;
  line-height: 1;
}
.left-gp-blog_more {
  text-align: right;
}
/* ====================================================
  セキュリティ
====================================================*/
.left-security {
  margin: 30px 0 20px;
}
.left-security .left-security_ttl .relief-security {
  display: block;
  width: 220px;
  height: 32px;
  background-position: 0px -2724px;
}
.left-security_holder {
  padding-top: 10px;
  border: 1px solid #ccc;
  border-top: none;
}
/*--------------------------------
  プライバシーマーク
--------------------------------*/
.left-security_pmark {
  margin: 0 14px 13px 12px;
  padding-bottom: 11px;
  border-bottom: 1px dotted #cdcdcd;
  letter-spacing: -0.4em; /* inline-blockの隙間対策 */
}
.left-security_pmark .logo-pmark {
  display: block;
  width: 70px;
  height: 70px;
  background-position: 0px -2756px;
}
.left-security_pmark-img,
.left-security_pmark-txt {
  display: inline-block;
  vertical-align: middle;
  letter-spacing: normal; /* inline-blockの隙間対策 */
}
.left-security_pmark-img {
  margin-right: 12px;
}
.left-security_pmark-txt {
  width: 110px;
  font-size: 11px;
}
/*--------------------------------
  SSL
--------------------------------*/
.left-security_ssl {
  padding: 0 15px 13px;
}
.left-security_ssl-img {
  margin-bottom: 10px;
  text-align: center;
}
.left-security_ssl .left-security_ssl-img .mark-ssl {
  display: block;
  width: 121px;
  height: 70px;
  margin: 0 auto;
  background-position: 0px -2826px;
}
.left-security_ssl-txt {
  font-size: 11px;
  text-align: justify;
}
/* ====================================================
  左カラムバナー
====================================================*/
.left .left_bnr li {
  margin-bottom: 15px;
}
.left .left_bnr li.vissel .vissel-bnr {
  width: 220px;
  height: 229px;
  background-position: 0px -3832px;
}
.left .left_bnr li.vissel .text {
  margin-top: 3px;
  font-size: 11px;
  color: #ac0931;
}
.left .left_bnr .ex-shop-bnr {
  width: 220px;
  height: 154px;
  background-position: 0px -2996px;
}
.left .left_bnr .gp-shop-bnr {
  width: 220px;
  height: 154px;
  background-position: 0px -3150px;
}
.left .left_bnr .kagu-shop-bnr {
  width: 220px;
  height: 113px;
  background-position: 0px -3304px;
}
.left .left_bnr .jitensya-shop-bnr {
  width: 220px;
  height: 150px;
  background-position: 0px -3417px;
}
.left .left_bnr .swimmy-bnr {
  width: 220px;
  height: 155px;
  background-position: 0px -3567px;
}
.left .left_bnr li.swimmy .text {
  margin-top: 3px;
  color: #020101;
  font-size: 11px;
}
.left_bnr_group-link {
  padding: 5px 0 3px;
  text-align: center;
}
.left_bnr_group-link a {
  padding-right: 16px;
  background: url("/public/img/common/icon_next-brilliantazure.svg") right center no-repeat;
  background-size: 6px auto;
  color: #008ae9;
  font-size: 12px;
}
.pic-up {
  margin: 25px 0 0;
  border: 1px solid #ccc;
}
.pic-up_ttl {
  position: relative;
  display: flex;
  align-items: center;
  height: 27px;
  padding: 0 12px;
  background-color: #ffecec;
  font-size: 13px;
  font-weight: bold;
  /*---cursor: pointer;---*/
}

.pic-up_ttl.is-open {
  border-bottom: 1px solid #ccc;
}
/*---
.pic-up_ttl::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  right: 12px;
  display: inline-block;
  width: 8px;
  height: 13px;
  margin: auto 0;
  background: url(/sp/img/common/icon_next-lightred.svg) left top no-repeat;
  background-size: contain;
  transform: rotate(90deg);
}
.pic-up_ttl.is-open::after {
  transform: rotate(270deg);
}
.pic-up-body {
  display: none;
}
---*/
.pic-up_ttl.is-open .pic-up-body {
  display: block;
}
.pic-up_list {
  padding: 10px 10px 0;
}
.left .pic-up_list li {
  margin-bottom: 10px;
}
.pic-up_list a {
  display: block;
  font-size: 11px;
}
.pic-up_list a::before {
  content: "";
  display: inline-block;
  margin-right: 8px;
  border: 4px solid transparent;
  border-left: 8px solid #ccc;
  border-right: none;
  vertical-align: middle;
}
/*------------------------------
  メインカラム
------------------------------*/
.main {
  float: right;
  width: 713px;
}
/* 共通訴求ボタン */
.bottom_contacts {
  clear: both;
  width: 713px;
  margin: auto;
  margin-top: 87px;
}
.bottom_contacts ul {
  display: table;
}
.bottom_contacts .h_txt {
  display: block;
  width: 100%;
  margin-bottom: 8px;
  color: #555;
  font-size: 13px;
  text-align: center;
}
.bottom_contacts .h_txt::before {/* ▼アイコン */
  content: '';
  display: inline-block;
  width: 0;
  height: 0;
  margin-right: 7px;
  border-top: 9px solid #ccc;
  border-right:  5px solid transparent;
  border-left:  5px solid transparent;
  vertical-align: middle;
}
.bnr_list li a , .block_inner_contacts li a{
  overflow: hidden;
  display: block;
  border-radius: 4px;
  -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
  box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
}
.bottom_contacts .bnr_list {
  margin-top: 25px;
}
.bottom_contacts .bnr_list li {
  margin-bottom: 20px;
}
.bottom_contacts .bnr_list li:last-of-type {
  margin-bottom: 0;
}
/*--------------------------------
  シミュレーション類のボタン
--------------------------------*/
.bottom_contacts .block_inner_sims {
  margin-bottom: 20px;
}
.bottom_contacts .sims {
  display: flex;
  justify-content: space-between;
}
/*--------------------------------
  申込系のボタン
--------------------------------*/
.bottom_contacts .block_inner_contacts {
}
.bottom_contacts .block_inner_contacts .h_txt {
  margin-bottom: 5px;
  text-align: center;
}
.bottom_contacts .block_inner_contacts .h_txt::before {
  display: none;
}
.bottom_contacts .contacts {
  display: flex;
  justify-content: center;
}
.bottom_contacts .contacts li {
  padding: 0 5px;
}
.bottom_contacts .contacts li a {
  display: block;
}
/*--------------------------------
  ご相談訴求
--------------------------------*/
.bottom_contacts .box_inquiry {
  position: relative;
  margin-bottom: 27px;
  padding-bottom: 30px;
  border-bottom: 1px solid #ddd;
  font-size: 14px;
}
.bottom_contacts .box_inquiry::after {
  content: "";
  position: absolute;
  top: 35px;
  right: 0;
  width: 180px;
  height: 145px;
  background: url("/public/img/common/pic_operator.webp?2025061800") left bottom no-repeat;
  background-size: contain;
}
.bottom_contacts .box_inquiry .h_box_inquiry {
  height: 49px;
  margin-bottom: 15px;
  padding-left: 106px;
  border-radius: 4px;
  background-color: #ffecec;
  font-size: 21px;
  font-weight: bold;
  line-height: 49px;
}
.bottom_contacts .box_inquiry .h_box_inquiry .free {
  display: inline-block;
  height: 27px;
  margin-left: 10px;
  padding: 0 10px 0 10px;
  border: 1px solid #f00;
  border-radius: 3px;
  color: #f00;
  font-size: 20px;
  line-height: 27px;
}
/* ウェブ
--------------------------------*/
.bottom_contacts .box_inquiry .web {
  float: left;
  margin-right: 18px;
}
.bottom_contacts .box_inquiry .web_txt {
  margin-bottom: 20px;
}
.bottom_contacts .box_inquiry .web .btn a {
  border-radius: 4px;
  box-shadow: 1px 1px 4px 0px rgba(0, 0, 0, 0.1);
}
/* TEL
--------------------------------*/
.bottom_contacts .box_inquiry .tel {
  float: left;
}
.bottom_contacts .box_inquiry .tel_txt {
  margin-bottom: 14px;
}
.bottom_contacts .box_inquiry .freedial .num {
  padding-left: 43px;
  background: url("/public/img/common/icon_freedial.svg") left center no-repeat;
  background-size: 35px auto;
  color: #f00000;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 36px;
  font-weight: bold;
  line-height: 1;
}
.bottom_contacts .box_inquiry .freedial .time {
  text-indent: -0.5em;
}
/*--------------------------------
  営業日のお知らせ
--------------------------------*/
.bottom_holiday-notice {
  margin: 20px 0;
  padding: 10px;
  color: #f00;
  border: 1px solid #fbb;
  border-radius: 6px;
  background-color: #fffafa;
}
.bottom_holiday-notice-hd {
  display: block;
  margin: 0 0 7px;
  padding-bottom: 5px;
  border-bottom: 1px dotted #faa;
  text-align: center;
}
/*-----------------------------------
  ページタイトル
-----------------------------------*/
.title {
  position: relative;
  margin: 0 auto 10px;
  padding: 4px 32px 12px 0;
  border-bottom: 1px solid #ddd;
  font-size: 22px;
  font-weight: bold;
}
.title::after {
  content: "";
  position: absolute;
  right: 0;
  width: 60px;
  height: 50px;
  background: url("/public/img/common/ico_paintcan_roller.png")  no-repeat;
}

/*-----------------------------------
  パンくず
-----------------------------------*/
.breadcrumbs {
  color: #555;
  font-size: 13px;
  vertical-align: middle;
}
.breadcrumbs li {
  float: left;
  display: block;
  margin-right: 12px;
  padding-left: 15px;
  background: url("/public/img/common/icon_next-davysgrey.svg") left center no-repeat;
  background-size: 6px auto;
  vertical-align: middle;
}
.breadcrumbs li:first-child {
  padding-left: 0;
  background: none;
}
.breadcrumbs a {
  color: #f93737;
  -ms-word-break: always;
  word-break: always;
  text-decoration: underline;
}
.breadcrumbs a:hover {
  text-decoration: none;
}
.breadcrumbs a span {
  color: #f93737;
  font-size: 14px;
}

/*--------------------------------
  お問い合わせ
--------------------------------*/
.box_contact_link {
  position: relative;
  width: 593px;
  margin: 80px auto 0;
  padding: 14px 0 32px;
  border-radius: 3px;
  background-color: #fff8eb;
}
.box_contact_link::before {
  content: "";
  position: absolute;
  top: -30px;
  right: 0;
  left: 0;
  width: 0;
  height: 0;
  margin: 0 auto;
  border: 49px solid transparent;
  border-top: 19px solid #fff8eb;
  border-bottom: none;
}
.box_contact_link .hd {
  margin-bottom: 16px;
  color: #008e1e;
  font-size: 13px;
  font-weight: bold;
  text-align: center;
}
.box_contact_link .list_contact {
  width: 494px;
  margin: 0 50px;
  font-size: 0; /* inline-blockの隙間対策 */
  text-align: left;
}
.box_contact_link .list_contact li {
  display: inline-block;
  font-size: 16px; /* inline-blockの隙間対策 */
}
.box_contact_link .list_contact li:first-of-type {
  margin-right: 20px;
}
.box_contact_link .list_contact a {
  box-sizing: border-box;
  position: relative;
  display: block;
  width: 237px;
  height: 51px;
  border-radius: 3px;
  background-color: #008e1e;
  box-shadow: 1px 1px 4px 0px rgba(0, 0, 0, 0.3);
  color: #fff;
  font-weight: bold;
  text-align: left;
  text-decoration: none;
  line-height: 51px;
}
.box_contact_link .list_contact a::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 8px;
  width: 6px;
  height: 12px;
  margin: auto;
  background: url("/public/img/common/icon_next-white.svg") left center no-repeat;
  background-size: contain;
}
.box_contact_link .list_contact a::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
.box_contact_link .list_contact a.btn_order {
  padding-left: 50px;
}
.box_contact_link .list_contact a.btn_order::before {
  left: 16px;
  width: 31px;
  height: 24px;
  background: url("/public/img/common/icon_memo-white.svg") left center no-repeat;
  background-size: contain;
}
.box_contact_link .list_contact a.btn_contact {
  padding-left: 55px;
}
.box_contact_link .list_contact a.btn_contact::before {
  left: 18px;
  width: 24px;
  height: 24px;
  background: url("/public/img/common/icon_question-circle.svg") left center no-repeat;
  background-size: contain;
}

/*------------------------------------------
  概算お見積り結果（フォームページ表示）
------------------------------------------*/
.box_approximate {
  display: table;
  width: 400px;
  margin: 20px auto 30px;
  border: 1px solid #ccc;
}
.box_approximate .hd_account {
  height: 30px;
  padding: 0 10px;
  border-bottom: 1px solid #ccc;
  background-color: #ffe2e1;
  font-size: 14px;
  text-align: center;
  line-height: 30px;
}
.box_approximate .inner {
  padding: 5px 14px;
}
.box_approximate table {
  border-collapse: collapse;
  width: 100%;
  margin: 0;
}
.box_approximate th,
.box_approximate td {
  padding: 5px 0;
  border-right: none;
  border-left: none;
  border-bottom: 1px solid #eee;
  font-size: 13px;
}
.box_approximate th {
  padding-right: 0;
  padding-left: 0;
  background-color: #fff;
  font-weight: bold;
  text-align: left;
}
.box_approximate td {
  text-align: right;
}
.box_approximate td:first-child {
  padding-right: 0;
  text-align: left;
}
.box_approximate td + td,
.box_approximate th + td {
  padding-left: 0;
}
.box_approximate th.heading {
  border-top: none;
}
.box_approximate .total th,
.box_approximate .total td {
  border-bottom: none;
  color: #df0024;
  font-weight: bold;
}

/*------------------------------------------
  カラーシミュレーション結果（フォームページ表示）
------------------------------------------*/
.box_colorsim_info {
  width: 70%;
  margin: 20px auto 30px;
}
.box_colorsim_info table {
  width: 100%;
  border-collapse: collapse;
}
.box_colorsim_info {
  border-right: 1px solid #ccc;
}
.box_colorsim_info th,
.box_colorsim_info td {
  padding: 6px 0;
  border: none;
  border-left: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  font-size: 14px;
}
.box_colorsim_info th {
  background-color: #fff;
  text-align: center;
}
.box_colorsim_info th + th {
  min-width: 25px;
}
.box_colorsim_info td {
  padding-left: 1rem;
  text-align: left;
}
.box_colorsim_info th.hd {
  padding-left: 10px;
  border-top: 2px solid #ccc;
  background-color: #ffe2e1;
  font-size: 14px;
  font-weight: bold;
  text-align: left;
}
.box_colorsim_info th.hd.btn {
  padding-right: 7px;
  padding-left: 0;
  border-left: none;
  text-align: right;
}
.box_colorsim_info th.hd.btn a:hover {
  text-decoration: none;
}
.box_colorsim_info th.hd.btn .display {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 2px;
  -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
  box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
  background-color: #0082f0;
  color: #fff;
  font-size: 13px;
  vertical-align: middle;
}
.box_colorsim_info th.h_wall {
  min-width: 45px;
}

/* カラー
--------------------------------*/
.box_colorsim_info .wall,
.box_colorsim_info .roof,
.box_colorsim_info .accessory {
  padding-right: 10px;
  padding-left: 0;
  border-left: none;
}
.box_colorsim_info .color {
  float: right;
  display: inline-block;
  width: 98px;
  height: 14px;
  vertical-align: middle;
}

/*-----------------------------------
  外壁塗装
-----------------------------------*/
.box_colorsim_info .wall .color.s-461 { background-color: #feeecd; }
.box_colorsim_info .wall .color.s-104 { background-color: #faf6d9; }
.box_colorsim_info .wall .color.s-108 { background-color: #f6eddb; }
.box_colorsim_info .wall .color.s-371 { background-color: #dcd8cf; }
.box_colorsim_info .wall .color.s-102 { background-color: #e0e1dc; }
.box_colorsim_info .wall .color.s-105 { background-color: #f6f2e6; }
.box_colorsim_info .wall .color.s-112 { background-color: #fcefcd; }
.box_colorsim_info .wall .color.s-372 { background-color: #cec7b7; }
.box_colorsim_info .wall .color.s-460 { background-color: #ebdac8; }
.box_colorsim_info .wall .color.s-146 { background-color: #dbd8c7; }
.box_colorsim_info .wall .color.s-111 { background-color: #faf6d1; }
.box_colorsim_info .wall .color.s-184 { background-color: #beb29a; }
.box_colorsim_info .wall .color.s-490 { background-color: #fbdbc6; }
.box_colorsim_info .wall .color.s-103 { background-color: #c3c8c4; }
.box_colorsim_info .wall .color.s-109 { background-color: #cec6b1; }
.box_colorsim_info .wall .color.s-250 { background-color: #faeaaf; }
.box_colorsim_info .wall .color.s-281 { background-color: #ffdd95; }
.box_colorsim_info .wall .color.s-491 { background-color: #f5ab86; }
.box_colorsim_info .wall .color.s-500 { background-color: #ede2b5; }
.box_colorsim_info .wall .color.s-282 { background-color: #f2ca84; }
.box_colorsim_info .wall .color.s-430 { background-color: #bdbacb; }
.box_colorsim_info .wall .color.s-320 { background-color: #d7cdc4; }
.box_colorsim_info .wall .color.s-012 { background-color: #9a9da2; }
.box_colorsim_info .wall .color.s-210 { background-color: #cdc7bb; }
.box_colorsim_info .wall .color.s-376 { background-color: #b59e7c; }
.box_colorsim_info .wall .color.s-375 { background-color: #7e7a6e; }
.box_colorsim_info .wall .color.s-370 { background-color: #fefef4; }
.box_colorsim_info .wall .color.s-010 { background-color: #f5f9f8; }
.box_colorsim_info .wall .color.s-503 { background-color: #fefef2; }
.box_colorsim_info .wall .color.s-174 { background-color: #fffdea; }
.box_colorsim_info .wall .color.s-155 { background-color: #f8faed; }
.box_colorsim_info .wall .color.s-110 { background-color: #f5efe3; }
.box_colorsim_info .wall .color.s-280 { background-color: #fef3c6; }
.box_colorsim_info .wall .color.s-501 { background-color: #d9be87; }
.box_colorsim_info .wall .color.s-343 { background-color: #c49d74; }
.box_colorsim_info .wall .color.s-400 { background-color: #e3e6eb; }
.box_colorsim_info .wall .color.s-011 { background-color: #ced1d6; }
.box_colorsim_info .wall .color.s-401 { background-color: #bec1c6; }
.box_colorsim_info .wall .color.s-530 { background-color: #cfd1cc; }
.box_colorsim_info .wall .color.s-218 { background-color: #c6cab3; }
.box_colorsim_info .wall .color.s-373 { background-color: #b6b7b2; }
.box_colorsim_info .wall .color.s-322 { background-color: #b4aba4; }
.box_colorsim_info .wall .color.s-152 { background-color: #b4ab9c; }
.box_colorsim_info .wall .color.s-342 { background-color: #867666; }
.box_colorsim_info .wall .color.s-013 { background-color: #525c5e; }
.box_colorsim_info .wall .color.s-050 { background-color: #668887; }

/*-----------------------------------
  屋根塗装
-----------------------------------*/
.box_colorsim_info .roof .color.brown          { background-color: #6e3a2f; }
.box_colorsim_info .roof .color.torino-brown   { background-color: #302521; }
.box_colorsim_info .roof .color.dark-chocolate { background-color: #291e1c; }
.box_colorsim_info .roof .color.deep-gray      { background-color: #2d2a25; }
.box_colorsim_info .roof .color.bologna-green  { background-color: #424f24; }
.box_colorsim_info .roof .color.nasukon        { background-color: #091426; }
.box_colorsim_info .roof .color.maroon         { background-color: #5c1a0e; }
.box_colorsim_info .roof .color.new-wine       { background-color: #351613; }
.box_colorsim_info .roof .color.dark-gray      { background-color: #373634; }
.box_colorsim_info .roof .color.milano-green   { background-color: #3c5d48; }
.box_colorsim_info .roof .color.moss-green     { background-color: #232b1e; }
.box_colorsim_info .roof .color.black          { background-color: #000000; }
.box_colorsim_info .roof .color.green          { background-color: #424f24; }
.box_colorsim_info .roof .color.gray           { background-color: #c3c8c4; }

/*-----------------------------------
  付帯部塗装
-----------------------------------*/
.box_colorsim_info .accessory .color.white   { border: 1px solid #000; }
.box_colorsim_info .accessory .color.black   { background-color: #000000; }
.box_colorsim_info .accessory .color.brown   { background-color: #291e1c; }
.box_colorsim_info .accessory .color.s_none  { border: 1px solid #ccc; }
.box_colorsim_info .accessory .color.s_white { border: 1px solid #ccc; }
.box_colorsim_info .accessory .color.s_black { background-color: #000000; }
.box_colorsim_info .accessory .color.s_brown { background-color: #291e1c; }

/* ====================================================
  さくら外壁塗装店が選ばれる5つの理由
====================================================*/
#appeal_area {
  width: 711px;
  margin: 50px auto 0;
  border: 1px solid #ccc;
  border-bottom: none;
  z-index: 1;
}
#appeal_area img {
  vertical-align: middle;
}
#appeal_area .bnrs li {
  float: left;
  border-bottom: 1px solid #ccc;
}
#appeal_area .bnrs a {
  text-decoration: none;
}
#appeal_area .bnrs img {
  border-right: 1px solid #ccc;
}
#appeal_area .bnrs li.rightmost img {
  padding-right: 0;
  border-right: none;
}
#appeal_area .bnrs li.shop {
  position: relative;
}
#appeal_area .bnrs li.shop .num {
  position: absolute;
  bottom: 5px;
  left: 5px;
  color: #e60012;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 47.99px;
  font-weight: bold;
  line-height: 1;
}
#appeal_area .bnrs li.shop .num img {
  margin-right: 1px;
}
#appeal_area .bnrs li.showcase {
  position: relative;
}
#appeal_area .bnrs li.showcase .num {
  position: absolute;
  bottom: 6px;
  left: 13px;
  color: #e60012;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 39.99px;
  font-weight: bold;
  line-height: 1;
}
/* ====================================================
  左カラム：お知らせ
====================================================*/
.left-g-announce-box {
  margin: 18px 0;
}
a.left-g-announce {
  display: block;
  padding: 10px;
  border: 1px solid #f9595b;
  border-radius: 5px;
  color: #f9595b;
  box-shadow: 2px 3px 3px 0px rgba(0, 0, 0, 0.1);
  text-decoration: none;
}
.left-g-announce_ttl {
  margin-bottom: 7px;
  color: #f9595b;
  font-size: 14px;
  font-weight: bold;
  letter-spacing: -0.1ex;
  white-space: nowrap;
}
.left-g-announce_txt {
  color: #f9595b;
  font-size: 12px;
  text-align: justify;
  line-height: 1.4;
}
/* ====================================================
  各ページ：お知らせ
====================================================*/
.each-g-announce-box {
  margin: 20px 20px;
}
a.each-g-announce {
  display: block;
  padding: 10px 20px;
  border: 1px solid #f9595b;
  border-radius: 5px;
  color: #f9595b;
  text-decoration: none;
}
.each-g-announce_ttl {
  color: #f9595b;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
}
.each-g-announce_txt {
  color: #f9595b;
  font-size: 14px;
  text-align: justify;
}
/* ====================================================
  サイト内の関連リンク
====================================================*/
.ext-rel-link {
  margin: 40px 0 30px;
}
.ext-rel-link_hd {
  height: 37px;
  margin-bottom: 20px;
  padding: 0 12px;
  border-radius: 3px;
  background-color: #eee;
  font-size: 18px;
  line-height: 37px;
}
.ext-rel-link_list {
  padding: 0 40px;
}
.ext-rel-link_list li {
  margin-bottom: 14px;
}
.ext-rel-link_list a {
  font-size: 16px;
}
.ext-rel-link_list--norm a::before {
  content: "";
  display: inline-block;
  margin: 0 8px 0 5px;
  border: 3px solid transparent;
  border-left: 6px solid #f9595a;
  border-right: none;
  vertical-align: middle;
}
.ext-rel-link_list--faq a::before {
  content: "Q.";
  display: inline-block;
  margin-right: 4px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 16px;
  color: #f9595a;
}
.ext-rel-link-bnr {
  margin: 30px 0 40px;
  text-align: center;
}
/* ====================================================
  スライダー
====================================================*/
.ext-rel-slider-container {
  position: relative;
}
.ext-rel-slider li {
  display: none;
}
.ext-rel-slider a {
  display: block;
  text-decoration: none;
}
.ext-rel-slider_img {
  position: relative;
  margin-bottom: 10px;
  box-shadow: inset 0 0 0px 1px rgba(0,0,0,0.1);
}
.ext-rel-slider_img img {
  box-sizing: border-box;
  position: relative;
  width: 100%;
  height: auto;
  vertical-align: middle;
  z-index: -1;
}
.ext-rel-slider_txt {
  font-family: 'YuGothicM', '游ゴシック Medium', 'Yu Gothic Medium', '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
  font-size: 13px;
  font-weight: bold;
  line-height: 1.4;
}
/* ====================================================
  bxslider
====================================================*/
.bx-viewport .ext-rel-slider li {
  display: block;
}
.ext-rel-slider-container .bx-prev,
.ext-rel-slider-container .bx-next {
  position: absolute;
  top: 160px;
  display: block;
  width: 13px;
  height: 23px;
  background: url(/public/img/common/icon_next-lightbrilliantred.svg) left top no-repeat;
  background-size: contain;
  text-indent: 100%;
  overflow: hidden;
  white-space: nowrap;
  z-index: 50;
}
.ext-rel-slider-container .bx-prev.disabled,
.ext-rel-slider-container .bx-next.disabled {
  opacity: 0.3;
}
.ext-rel-slider-container .bx-prev {
  left: 0;
  transform: rotate(180deg);
}
.ext-rel-slider-container .bx-next {
  right: 0;
}
/* ====================================================
  サムネイル
====================================================*/
.ext-rel-thumbs {
  display: flex;
  flex-wrap: wrap;
  margin: 0 40px 45px;
}
.ext-rel-thumbs li {
  width: 300px;
  margin: 0 33px 24px 0;
}
.ext-rel-thumbs li:nth-of-type(2n) {
  margin-right: 0;
}
.ext-rel-thumbs a {
  display: block;
  text-decoration: none !important;
}
.ext-rel-thumbs_img {
  margin-bottom: 9px;
}
.ext-rel-thumbs_img img {
  width: 100%;
  height: auto;
}
.ext-rel-thumbs_txt {
  text-align: center;
  font-size: 16px;
}
/* ====================================================
  静的ページの関連情報
====================================================*/
.acrosspage-links {
  margin: 37px 0;
}
.acrosspage-links-box {
  margin-bottom: 37px;
}
.acrosspage-links-box_ttl {
  height: 37px;
  margin-bottom: 20px;
  padding: 0 12px;
  border-radius: 3px;
  background-color: #eee;
  font-size: 18px;
  line-height: 37px;
}
.acrosspage-links_more {
  margin-right: 40px;
  text-align: right;
}
.acrosspage-links_more a {
  padding-right: 20px;
  background: url(/sp/img/common/icon_next-moderatecobaltblue.svg) right center no-repeat;
  background-size: 8px auto;
  color: #0064ff;
  font-size: 15px;
}
/*--------------------------------
  FAQ
--------------------------------*/
.acrosspage-links-faq-list {
  margin: 0 40px 20px;
}
.acrosspage-links-faq-list li {
  border-bottom: 1px solid #ddd;
}
.acrosspage-links-faq_ttl {
  position: relative;
  display: block;
  padding: 13px 24px;
  font-size: 16px;
  line-height: 1.4;
  text-decoration: none;
  cursor : pointer;
}
.acrosspage-links-faq_ttl:hover {
  text-decoration: none;
}
.acrosspage-links-faq_ttl::before {
  content: "Q";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 22px;
  height: 22px;
  margin: auto 0;
  color: #f9595a;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 22px;
  line-height: 1;
}
.acrosspage-links-faq_ttl::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 3px;
  width: 9px;
  height: 16px;
  margin: auto 0;
  background: url("/public/img/common/icon_next-mediumgray.svg") left top no-repeat;
  background-size: contain;
  transform: rotate(90deg);
}
.acrosspage-links-faq_ttl.open::after {
  transform: rotate(270deg);
}
.acrosspage-links-faq-txt {
  display: none;
  position: relative;
  padding: 0 24px 13px;
  font-size: 16px;
}
.acrosspage-links-faq-txt::before {
  content: "A";
  position: absolute;
  top: 0;
  left: 0;
  width: 22px;
  height: 22px;
  color: #66bd44;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 22px;
  line-height: 1;
}
/*--------------------------------
  ブログ
--------------------------------*/
.acrosspage-links-blog-list {
  display: flex;
  justify-content: space-between;
  margin-bottom: 15px;
}
.acrosspage-links-blog-list li {
  margin-right: 7px;
}
.acrosspage-links-blog-list li:last-of-type {
  margin-right: 0;
}
.acrosspage-links-blog-list a {
  display: block;
  width: 206px;
  padding: 5px 6px 13px;
  border: 1px solid #ccc;
  text-decoration: none;
}
.acrosspage-links-blog-list_img {
  margin-bottom: 5px;
}
.acrosspage-links-blog-list_img img {
  width: 206px;
  height: auto;
}
.acrosspage-links-blog-info {
  display: flex;
  margin-bottom: 8px;
}
.acrosspage-links-blog_date {
  font-size: 11px;
}
.acrosspage-links-blog_tag {
  display: inline-flex;
  align-items: center;
  height: 16px;
  padding: 0 11px;
  margin-left: auto;
  background-color: #ffeced;
  font-size: 11px;
}
.acrosspage-links-blog-list_txt {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  font-size: 14px;
  font-weight: bold;
}
/*--------------------------------
  関連する施工例
--------------------------------*/
.acrosspage-links-const-related {
  position: relative;
}
/* ====================================================
  bxslider
====================================================*/
.acrosspage-links-const-related-list li {
  display: none;
  width: 202px;
}
.bx-viewport .acrosspage-links-const-related-list li {
  display: block;
}
.acrosspage-links-const-related-list img {
  width: 100%;
  height: auto;
}
.acrosspage-links-const-related .bx-prev,
.acrosspage-links-const-related .bx-next {
  position: absolute;
  top: 126px;
  display: block;
  width: 13px;
  height: 23px;
  background: url(/public/img/common/icon_next-lightbrilliantred.svg) left top no-repeat;
  background-size: contain;
  text-indent: 100%;
  overflow: hidden;
  white-space: nowrap;
  z-index: 50;
}
.acrosspage-links-const-related .bx-prev.disabled,
.acrosspage-links-const-related .bx-next.disabled {
  opacity: 0.3;
}
.acrosspage-links-const-related .bx-prev {
  left: 0;
  transform: rotate(180deg);
}
.acrosspage-links-const-related .bx-next {
  right: 0;
}
/*///////////////////////////////////////////////////////
  ブログ左カラム
//////////////////////////////////////////////////////*/
.left-blog {
  margin-bottom: 30px;
}
.left-blog_hd {
  margin-bottom: 16px;
  padding-bottom: 4px;
  border-bottom: 1px solid #000;
  font-family: "YuGothicM", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 16px;
  font-weight: bold;
}
/* ====================================================
  記事カテゴリー
====================================================*/
.left-blog-cate-list li {
  margin-bottom: 16px;
}
.left-blog-cate-list li:last-of-type {
  margin-bottom: 0;
}
.left-blog-cate-list a {
  display: block;
  background: url("/sp/img/common/icon_next-davysgrey.svg") right center no-repeat;
  background-size: 5px auto;
  color: #111;
  font-size: 13px;
}
/* ====================================================
  注目キーワード
====================================================*/
.left-blog-trend {
  margin-bottom: 40px;
}
.left-blog-trend .left-blog_hd {
  margin-bottom: 7px;
}
.left-blog-trend_hd {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 35px;
  font-size: 13px;
  border-bottom: 1px solid #bbb;
  cursor: pointer;
}
.left-blog-trend_hd::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: 6px;
  height: 10px;
  margin: auto 0;
  background: url(/sp/img/common/icon_next-davysgrey.svg) left top no-repeat;
  background-size: contain;
  transform: rotate(90deg);
}
.left-blog-trend_hd.is-open::after {
  transform: rotate(270deg);
}
.left-blog-trend-list-wrap {
  display: none;
  padding-left: 20px;
}
.left-blog-trend-list li {
  border-bottom: 1px dotted #bbb;
}
.left-blog-trend-list a {
  display: flex;
  align-items: center;
  min-height: 35px;
  padding-right: 10px;
  background: url(/sp/img/common/icon_next-davysgrey.svg) right center no-repeat;
  background-size: 5px auto;
  font-size: 13px;
}
/* ====================================================
  注目キーワード
====================================================*/
.left-blog-keyword-list {
  display: flex;
  flex-wrap: wrap;
}
.left-blog-keyword-list li {
  margin: 0 5px 5px 0;
}
.left-blog-keyword-list a {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 0 7px;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 12px;
  text-decoration: none;
}
/* ====================================================
  記事検索
====================================================*/
.left-blog-search_hd {
  margin-bottom: 5px;
  font-family: "YuGothicM", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 16px;
  font-weight: bold;
}
.left-blog-search-holder {
  display: flex;
}
input[type="text"].left-blog-search_input {
  box-sizing: border-box;
  flex: none;
  width: 183px;
  height: 33px;
  margin: 0;
  border: 1px solid #333;
  border-radius: 4px 0 0 4px;
  box-shadow: none;
}
.left-blog-search_btn {
  width: 37px;
  height: 33px;
  border-radius: 0 4px 4px 0;
  background: url("/sp/img/common/icon_magnifying_glass.svg") center center no-repeat #333;
  background-size: 18px auto;
  cursor: pointer;
  text-indent: 100%;
  overflow: hidden;
}
/* ====================================================
  人気の記事
====================================================*/
.left-blog-rank {
  margin-bottom: 40px;
  counter-reset: number 0;
}
a.left-blog-rank-box {
  display: flex;
  text-decoration: none;
}
.left-blog-rank_num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 21px;
  height: 21px;
  background-color: #333;
  color: #fff;
  font-family: "YuGothicM", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 15px;
  font-weight: bold;
}
.left-blog-rank_num::before {
  counter-increment: number 1;
  content: counter(number);
}
.left-blog-rank-list {
  margin-bottom: 31px;
}
.left-blog-rank-list li {
  margin-bottom: 30px;
}
.left-blog-rank-body {
  width: 188px;
  margin-left: auto;
}
.left-blog-rank_txt {
  margin-bottom: 9px;
  font-size: 13px;
  font-weight: bold;
  line-height: 1.4;
}
.left-blog-rank_img img {
  width: 175px;
  height: auto;
}
.left-blog-article_read {
  text-align: right;
  padding-right: 12px;
  background: url(/public/img/common/icon_next-brilliantred.svg) right center no-repeat;
  background-size: 6px auto;
  color: #f9595a;
  font-size: 13px;
  margin-right: 10px;
}
.left-blog-article_read a {
  color: #f9595a;
}
/* ====================================================
  コンテンツ間導線
====================================================*/
.cont-click-path {
  margin-top: 45px;
  padding-top: 40px;
  border-top: 1px solid #bbb;
}
.cont-click-path--modified {
  margin-top: 0;
  padding-top: 25px;
  border-top: none;
}
.cont-click-path-inner {
  margin: 0 0 0 30px;
}
.cont-click-path_hd {
  margin: 0 0 10px;
  font-size: 16px;
  font-weight: bold;
}
.cont-click-path_hd::before {
  content: "";
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-right: 13px;
  background-color: #333;
  vertical-align: middle;
}
.cont-click-path-chain {
  display: flex;
  flex-wrap: wrap;
  margin: 0 0 30px 15px;
}
.cont-click-path-chain li {
  display: inline-block;
  margin: 0 20px 20px 0;
}
.cont-click-path-chain li:nth-of-type(3n) {
  margin-right: 0;
}
.cont-click-path-chain a {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  width: 195px;
  min-height: 36px;
  box-sizing: border-box;
  padding-left: 15px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.07);
  color: #2f7300;
  font-size: 13px;
  text-align: left;
  text-decoration: none;
}
.cont-click-path-chain a::before {
  content: "";
  display: inline-block;
  margin-right: 7px;
  border: 3px solid transparent;
  border-left: 6px solid #2f7300;
  border-right: none;
  vertical-align: middle;
}
.cont-click-path-chain a:hover {
  background-color: #f0f9e5;
}
/* ====================================================
  塗装事例
====================================================*/
.mut-paint-case {
  margin: 25px 0 30px;
}
.mut-paint-case_ttl {
  margin-bottom: 20px;
  padding-bottom: 7px;
  border-bottom: 1px solid #ccc;
  font-size: 18px;
  font-weight: bold;
}
.mut-paint-case-list a {
  display: block;
  border: 1px solid #ccc;
  text-decoration: none;
}
.mut-paint-case_img {
  margin-bottom: 10px;
}
.mut-paint-case_img img {
  width: 100%;
  height: auto;
}
.mut-paint-case_txt {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  margin: 0 10px 10px;
  font-size: 13px;
}
.mut-paint-case_show {
  margin-top: 20px;
  text-align: center;
}
.mut-paint-case_show a {
  display: inline-block;
  padding: 10px 35px 10px 30px;
  border-radius: 4px;
  border: 1px solid #61c13c;
  -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.1);
  box-shadow: 1px 1px 2px rgba(0,0,0,0.1);
  background:  url(/public/img/common/ico_arrow_green.png) 95% center no-repeat;
  color: #61c13c;
  font-size: 18px;
  font-weight: bold;
}
.mut-paint-case_show a:hover {
  background-color: rgba(97, 193, 60,0.05);
  text-decoration: none;
  box-shadow: 0 0 4px rgba(97, 193, 60,0.2);
}
/*--------------------------------
  bxslider
--------------------------------*/
.mut-paint-case .bx-wrapper {
  position: relative;
  overflow: hidden;
  padding: 0 4px;
}
.mut-paint-case-list li {
  display: none;
}
.bx-viewport .mut-paint-case-list li {
  display: block;
}
.mut-paint-case .bx-controls .bx-prev,
.mut-paint-case .bx-controls .bx-next {
  position: absolute;
  top: 64px;
  display: block;
  width: 32px;
  height: 92px;
  border-radius: 5px 0 0 5px;
  background: url(/sp/img/common/icon_txt_gt-mediumgray.svg) 13px center no-repeat #fff;
  background-size: 11px auto;
  box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.3);
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}
.mut-paint-case .bx-controls .bx-prev:hover,
.mut-paint-case .bx-controls .bx-next:hover {
  opacity: 0.7;
  box-shadow: none;
}
.mut-paint-case .bx-controls .bx-prev.disabled,
.mut-paint-case .bx-controls .bx-next.disabled {
  opacity: 0;
}
.mut-paint-case .bx-controls .bx-prev.disabled:hover,
.mut-paint-case .bx-controls .bx-next.disabled:hover {
  opacity: 0;
}
.mut-paint-case .bx-controls .bx-prev {
  left: 0;
  transform: rotate(180deg);
}
.mut-paint-case .bx-controls .bx-next {
  right: 0;
}
/* ====================================================
  絞り込み塗装事例
====================================================*/
.mut-case-filter {
  margin-bottom: 25px;
}
.mut-case-filter_ttl {
  display: flex;
  align-items: center;
  min-height: 37px;
  margin-bottom: 10px;
  padding: 0 12px;
  border-radius: 3px;
  background-color: #eee;
  font-size: 18px;
}
/*--------------------------------
  絞り込み条件
--------------------------------*/
.mut-case-filter-condition-wrap {
  padding: 0 20px;
}
.mut-case-filter-condition {
  border-collapse: collapse;
  width: 100%;
}
.mut-case-filter-condition td,
.mut-case-filter-condition th {
  padding: 8px 0 5px;
}
.mut-case-filter-condition th {
  width: 87px;
  border-bottom: 1px solid #eee;
  color: #ff4041;
  font-size: 12px;
  font-weight: normal;
  text-align: left;
}
.mut-case-filter-condition td {
  border-bottom: 1px solid #eee;
}
.mut-case-filter-condition tr:last-of-type th,
.mut-case-filter-condition tr:last-of-type td {
  border-bottom: none;
}
.mut-case-filter-condition-list {
  display: flex;
  flex-wrap: wrap;
}
.mut-case-filter-condition-list li {
  margin: 0 40px 3px 0;
}
.mut-case-filter_no-fit {
  color: #ccc;
  font-size: 13px;
}
.mut-case-filter-condition-list a {
  color: #333;
  font-size: 13px;
}
.mut-case-filter-condition-list a:hover {
  color: #ff4041;
  text-decoration: none;
}
/* ====================================================
  外壁塗装の色やデザインに関するブログ
====================================================*/
.paint-blog {
  margin-bottom: 25px;
}
.paint-blog_ttl {
  display: flex;
  align-items: center;
  min-height: 37px;
  margin-bottom: 20px;
  padding: 0 12px;
  border-radius: 3px;
  background-color: #eee;
  font-size: 18px;
}
.paint-blog-list {
  display: flex;
  justify-content: center;
  margin-bottom: 15px;
}
.paint-blog-list li {
  margin-right: 7px;
}
.paint-blog-list li:last-of-type {
  margin-right: 0;
}
.paint-blog-list a {
  display: block;
  width: 206px;
  padding: 5px 6px 13px;
  border: 1px solid #ccc;
  text-decoration: none;
  min-height: 260px;
}
.paint-blog_img {
  margin-bottom: 5px;
  min-height: 190px;
  align-items: center;
  display: flex;
}
.paint-blog_img img {
  width: 206px;
  height: auto;
}
.paint-blog-info {
  display: flex;
  margin-bottom: 8px;
}
.paint-blog_date {
  font-size: 11px;
}
.paint-blog_tag {
  display: inline-flex;
  align-items: center;
  height: 16px;
  padding: 0 11px;
  margin-left: auto;
  background-color: #ffeced;
  font-size: 11px;
}
.paint-blog_txt {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  font-size: 14px;
  font-weight: bold;
}
.paint-blog_link {
  margin-right: 20px;
  text-align: right;
}
.paint-blog_link a {
  color: #ff4f4f;
  font-size: 14px;
  text-decoration: underline;
}
/* ====================================================
  外壁塗装相場
====================================================*/
.shared-prefmarket {
  margin: 0 0 60px;
  padding: 5px;
  background-image: repeating-linear-gradient(45deg, #ccc 25%, transparent 25%, transparent 75%, #ccc 75%, #ccc), repeating-linear-gradient(45deg, #ccc 25%, transparent 25%, transparent 75%, #ccc 75%, #ccc);
  background-position: 0 0,2px 2px;
  background-size: calc(2 * 1px) calc(2 * 2px);
}
.shared-prefmarket-inner {
  padding: 50px 35px 28px;
  background-color: #fff;
}
.shared-prefmarket_ttl {
  margin-bottom: 23px;
  font-size: 20px;
  text-align: center;
}
/*--------------------------------
  ボタン
--------------------------------*/
.shared-prefmarket-btn {
  text-align: center;
}
.shared-prefmarket-btn a {
  box-sizing: border-box;
  position: relative;
  display: inline-flex;
  align-items: center;
  min-width: 321px;
  min-height: 60px;
  margin-bottom: 10px;
  padding: 0 30px 0 52px;
  border: 1px solid #ddd;
  border-radius: 2px;
  background-color: #fcfcfc;
  text-decoration: none;
}
.shared-prefmarket-btn a::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 22px;
  height: 100%;
  background: url(/sp/img/common/icon_next-white.svg) center center no-repeat #c9c9c9;
  background-size: 10px auto;
}
.shared-prefmarket-btn-price {
  font-size: 18px;
  font-weight: bold;
}
.shared-prefmarket-btn-price_num {
  color: #a40000;
  font-family: Arial, sans-serif;
  font-size: 30px;
}
.shared-prefmarket-btn-lead {
  margin-bottom: 45px;
  text-align: center;
}
.shared-prefmarket-btn-lead_txt {
  display: inline-block;
  padding-right: 17px;
  background: url(/sp/img/common/icon_next-lightbrilliantred.svg) right center no-repeat;
  background-size: 7px;
  font-size: 15px;
  color: #ff4041;
}
.shared-prefmarket-btn-lead_txt:hover {
  text-decoration: underline;
}
.shared-prefmarket-btn-lead_deco {
  color: #a40000;
}
/*--------------------------------
  市別
--------------------------------*/
.shared-prefmarket-city_ttl {
  margin-bottom: 13px;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
}
.shared-prefmarket-city-list {
  table-layout: fixed;
  border-collapse: collapse;
}
.shared-prefmarket-city-list th,
.shared-prefmarket-city-list td {
  padding: 10px 20px;
  font-size: 15px;
}
.shared-prefmarket-city-list th {
  background-color: #f4ede7;
  font-weight: bold;
}
.shared-prefmarket-city-list th:nth-of-type(1) {
  width: 153px;
  text-align: left;
}
.shared-prefmarket-city-list th:nth-of-type(2) {
  width: 200px;
}
.shared-prefmarket-city-list th:nth-of-type(3) {
  width: 275px;
}
.shared-prefmarket-city-list td.shared-prefmarket-city-price {
  text-align: right;
}
.shared-prefmarket-city-list tbody tr:nth-of-type(2n) td {
  background-color: #f2f2f2;
}
.shared-prefmarket-city-list tbody td:nth-of-type(2) {
  font-family: Arial, sans-serif;
  text-align: center;
}
.shared-prefmarket-city-list tbody tr:nth-of-type(n+6) {
  display: none;
}
.shared-prefmarket-city-list a {
  color: #f9595a;
  text-decoration: underline;
}
.shared-prefmarket-city-list a:hover {
  text-decoration: none;
}
.shared-prefmarket-city_num {
  margin-right: 4px;
  font-family: Arial, sans-serif;
}
.shared-prefmarket-city_range {
  margin: 0 15px;
}
.shared-prefmarket-city-more {
  position: relative;
  top: -20px;
  padding: 30px 0 0;
  background-color: #fff;
  text-align: center;
}
.shared-prefmarket-city-more a {
  position: relative;
  display: inline-flex;
  align-items: center;
  height: 40px;
  padding: 0 52px 0 33px;
  background-color: #f4ede7;
  box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.15);
  color: #7e6b5a;
  font-size: 18px;
  background: url(/sp/img/common/icon_down-darkgrayishbrown.svg) right 10px center no-repeat #f4ede7;
  background-size: 19px auto;
  text-decoration: none;
}
/* ====================================================
  都道府県の施工エリア一覧
====================================================*/
.g-const-area {
  margin-bottom: 20px;
  padding: 1px;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 4px;
}
.g-const-area_ttl {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 35px;
  margin-bottom: 4px;
  border-bottom: 1px solid #ccc;
  border-radius: 3px 3px 0 0;
  background-color: #ff7171;
  color: #fff;
  font-size: 15px;
  font-weight: bold;
}
.g-const-area-city {
  display: flex;
  flex-wrap: wrap;
}
.g-const-area-city.is-open {
  padding-bottom: 40px;
}
.g-const-area-city-wrap {
  position: relative;
  padding: 0 2px;
}
.g-const-area-city > li {
  margin: 0 4px 4px 0;
}
.g-const-area-city > li:nth-of-type(2n) {
  margin-right: 0;
}
.g-const-area-city > li:nth-of-type(n+9) {
  display: none;
}
.g-const-area-city_name {
  box-sizing: border-box;
  width: 104px;
  min-height: 24px;
  border: 1px solid #bbb;
  border-radius: 2px;
  font-size: 13px;
  text-align: center;
  cursor: pointer;
}
.g-const-area-city_name::before {
  content: "";
  display: inline-block;
  margin-right: 5px;
  border: 3px solid transparent;
  border-left: 6px solid #ef5353;
  border-right: none;
  vertical-align: middle;
}
.g-const-area-city_name.is-selected {
  background-color: #ffecec;
}
.g-const-area-city_name.is-selected::before {
  border: 3px solid transparent;
  border-top: 6px solid #ef5353;
  border-bottom: none;
}
.g-const-area-city-link {
  box-sizing: border-box;
  position: absolute;
  left: 2px;
  width: 212px;
  margin: 8px 0 4px;
  border: 1px solid #bbb;
  border-radius: 2px;
  background-color: #fff;
}
.g-const-area-city-link-wrap {
  display: none;
}
.g-const-area-city-link::before, .g-const-area-city-link::after {
  content: "";
  position: absolute;
  top: -8px;
  right: 48px;
  width: 0;
  height: 0;
  margin: auto 0;
  border: 5px solid transparent;
  border-bottom: 8px solid #bbb;
  border-top: none;
}
.g-const-area-city-link::after {
  top: -7px;
  border-bottom: 8px solid #fff;
}
.g-const-area-city-link a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 25px;
  border-bottom: 1px dotted #bbb;
  color: #ef5353;
  font-size: 14px;
  text-decoration: none;
}
.g-const-area-city-link li:last-of-type a {
  border-bottom: none;
}
.g-const-area-city_no-fit {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 25px;
  border-bottom: 1px dotted #bbb;
  color: #ccc;
  font-size: 14px;
}
.g-const-area-city-link li:last-of-type.g-const-area-city_no-fit {
  border-bottom: none;
}
.g-const-area-city li:nth-of-type(2n-1) .g-const-area-city-link::before,
.g-const-area-city li:nth-of-type(2n-1) .g-const-area-city-link::after {
  left: 48px;
  right: auto;
}
.g-const-area_more {
  text-align: center;
  position: absolute;
  bottom: 3px;
  width: 212px;
  padding: 20px 0 5px;
  background: linear-gradient(to bottom, #fff0 0%, #fff 36%);
}
.g-const-area_more a {
  display: inline-block;
  color: #333;
  font-size: 14px;
  font-weight: bold;
}
.g-const-area_more a::before {
  content: "";
  display: inline-block;
  margin-right: 5px;
  border: 4px solid transparent;
  border-top: 8px solid #ff7171;
  border-bottom: none;
  vertical-align: middle;
}
.g-const-area_more a.is-open::before {
  transform: rotate(180deg);
}
/* ====================================================
  外壁塗装のエリア別情報
====================================================*/
.g-area-info {
  margin-bottom: 20px;
  padding: 1px;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 4px;
}
.g-area-info_ttl {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 35px;
  margin-bottom: 1px;
  border-bottom: 1px solid #ccc;
  border-radius: 3px 3px 0 0;
  background-color: #ffecec;
  font-size: 15px;
}
.g-area-info_hd {
  position: relative;
  display: flex;
  align-items: center;
  height: 29px;
  margin-bottom: 1px;
  padding: 0 10px;
  background-color: #fff;
  border-bottom: 1px dotted #ccc;
  font-size: 14px;
  cursor: pointer;
}
.g-area-info_hd.is-open {
  margin-bottom: 4px;
  border-bottom: none;
}
.g-area-info_hd::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 10px;
  width: 7px;
  height: 13px;
  margin: auto 0;
  background: url(/sp/img/common/icon_next-mediumgray.svg) left top no-repeat;
  background-size: contain;
  transform: rotate(90deg);
}
.g-area-info_hd.is-open::after {
  transform: rotate(270deg);
}
.g-area-info-list {
  margin-bottom: 5px;
}
.g-area-info-pref {
  display: flex;
  flex-wrap: wrap;
}
.g-area-info-pref-wrap {
  display: none;
  position: relative;
  padding: 0 2px;
}
.g-area-info-pref > li {
  margin: 0 4px 4px 0;
}
.g-area-info-pref > li:nth-of-type(2n) {
  margin-right: 0;
}
.g-area-info-pref_name {
  box-sizing: border-box;
  width: 104px;
  height: 24px;
  border: 1px solid #bbb;
  border-radius: 2px;
  font-size: 13px;
  text-align: center;
  line-height: 24px;
  cursor: pointer;
}
.g-area-info-pref_name::before {
  content: "";
  display: inline-block;
  margin-right: 5px;
  border: 3px solid transparent;
  border-left: 6px solid #ef5353;
  border-right: none;
  vertical-align: middle;
}
.g-area-info-pref_name.is-selected {
  background-color: #ffecec;
}
.g-area-info-pref_name.is-selected::before {
  border: 3px solid transparent;
  border-top: 6px solid #ef5353;
  border-bottom: none;
}
.g-area-info-pref-link {
  box-sizing: border-box;
  position: absolute;
  left: 2px;
  width: 212px;
  margin: 8px 0 4px;
  border: 1px solid #bbb;
  border-radius: 2px;
}
.g-area-info-pref-link-wrap {
  display: none;
}
.g-area-info-pref-link::before, .g-area-info-pref-link::after {
  content: "";
  position: absolute;
  top: -8px;
  right: 48px;
  width: 0;
  height: 0;
  margin: auto 0;
  border: 5px solid transparent;
  border-bottom: 8px solid #bbb;
  border-top: none;
}
.g-area-info-pref-link::after {
  top: -7px;
  border-bottom: 8px solid #fff;
}
.g-area-info-pref-link a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 25px;
  border-bottom: 1px dotted #bbb;
  color: #ef5353;
  font-size: 14px;
  text-decoration: none;
}
.g-area-info-pref-link li:last-of-type a {
  border-bottom: none;
}
.g-area-info-pref_no-fit {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 25px;
  border-bottom: 1px dotted #bbb;
  color: #ccc;
  font-size: 14px;
}
.g-area-info-pref-link li:last-of-type.g-area-info-pref_no-fit {
  border-bottom: none;
}
.g-area-info-pref li:nth-of-type(2n-1) .g-area-info-pref-link::before,
.g-area-info-pref li:nth-of-type(2n-1) .g-area-info-pref-link::after {
  left: 48px;
  right: auto;
}
/* ====================================================
  塗装事例 詳細検索
====================================================*/
.g-search-detail {
  margin-bottom: 15px;
  border: 2px solid #ff7171;
}
.g-search-detail_ttl {
  text-align: center;
  background-color: #ffecec;
  font-size: 19px;
  font-weight: bold;
  line-height: 36px;
  color: #ff7171;
}
.g-search-detail-wrap {
  padding: 8px 8px 3px;
  font-size: 14px;
}
.g-search-detail-search {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #ccc;
}
.g-search-detail-search_hd {
  padding: 0 0 8px 0;
  font-weight: bold;
  color: #ff7171;
}
.g-search-detail-search_hd::before {
  content: "";
  display: inline-block;
  width: 25px;
  height: 22px;
  font-weight: bold;
  color: #ff7171;
  background: url("/public/img/common/icon_search-pink.svg") 0 0 no-repeat;
  background-size: 21px auto;
  vertical-align: middle;
}
/* リセットボタン */
.g-search-detail_reset a {
  padding: 3px 7px;
  background-color: #ffecec;
  border: 1px solid #ff7171;
  border-radius: 5px;
  box-sizing: border-box;
  color: #ff7171;
  font-size: 11px;
}
.g-search-detail_reset a:hover {
  text-decoration: none;
  opacity: 0.8;
}

/*--------------------------------
  詳細検索
--------------------------------*/
.g-search-detail_hd {
  position: relative;
  padding: 7px 0 7px 6px;
  font-weight: bold;
  border-bottom: 1px solid #ccc;
  cursor: pointer;
}
.g-search-detail_hd--last{
  border-bottom: none;
}
.g-search-detail_hd.is-open {
  border-bottom: none;
}
.g-search-detail_hd::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 10px;
  width: 7px;
  height: 13px;
  margin: auto 0;
  background: url("/sp/img/common/icon_next-mediumgray.svg") left top no-repeat;
  background-size: contain;
  transform: rotate(90deg);
}
.g-search-detail_hd.is-open::after {
  transform: rotate(270deg);
}
.g-search-detail_hd:hover {
  opacity: 0.8;
}
.g-search-detail-list {
  display: none;
  padding: 7px 6px 0;
  border-bottom: 1px solid #ccc;
}
.g-search-detail-list--last {
  margin-bottom: 14px;
  border-bottom: none;
}
.g-search-detail-list li {
  margin-bottom: 10px;
}

/* チェックボックス */
.g-search-detail_checkbox {
  position: relative;
  padding-left: 20px;
  vertical-align: middle;
}
.g-search-detail_checkbox:hover {
  text-decoration: none;
  opacity: 0.8;
}
.g-search-detail_checkbox:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 14px;
  height: 14px;
  border: 1px solid #ccc;
  box-sizing: border-box;
}
.g-search-detail_checkbox.checked::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  background: url("/public/img/common/icon_checked.svg") 0 0 no-repeat;
  border: none;
}

/* ====================================================
  都道府県の対応店舗一覧
====================================================*/
.g-pref-shops {
  margin-bottom: 20px;
  border: 1px solid #ef5353;
}
.g-pref-shops_ttl {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 35px;
  border-bottom: 1px solid #ef5353;
  background-color: #ffecec;
  font-size: 15px;
}
.g-pref-shops-body {
  position: relative;
  padding: 10px;
}
.g-pref-shops-body.is-open {
  padding-bottom: 10px;
}
.g-pref-shops-list {
  display: flex;
  flex-wrap: wrap;
}
.g-pref-shops-list li {
  width: 105px;
  margin-bottom: 4px;
}
.g-pref-shops-list li:nth-of-type(2n) {
  width: 93px;
}
.g-pref-shops-list li:nth-of-type(n+13) {
  display: none;
}
.g-pref-shops-list a {
  color: #333;
  font-size: 13px;
}
.g-pref-shops-list a::before {
  content: "";
  display: inline-block;
  margin-right: 4px;
  border: 3px solid transparent;
  border-left: 6px solid #ef5353;
  border-right: none;
  vertical-align: middle;
}
.g-pref-shops_more {
  text-align: center;
  position: absolute;
  bottom: 5px;
  width: 198px;
  padding-top: 20px;
  background: linear-gradient(to bottom, #fff0 0%, #fff 40%);
}
.g-pref-shops_more a {
  display: inline-block;
  color: #333;
  font-size: 14px;
  font-weight: bold;
}
.g-pref-shops_more a::before {
  content: "";
  display: inline-block;
  margin-right: 5px;
  border: 4px solid transparent;
  border-top: 8px solid #ff7171;
  border-bottom: none;
  vertical-align: middle;
}
/* ====================================================
  都道府県リンク
====================================================*/
.g-pref-corr {
  margin-bottom: 20px;
  border-top: 1px solid #ccc;
}
.g-pref-corr-list li {
  border-bottom: 1px solid #ccc;
}
.g-pref-corr-list a {
  display: flex;
  align-items: center;
  min-height: 35px;
  color: #333;
  font-size: 13px;
  text-decoration: none;
}
.g-pref-corr-list a::before {
  content: "";
  display: inline-block;
  margin-right: 5px;
  border: 3px solid transparent;
  border-left: 6px solid #ef5353;
  border-right: none;
  vertical-align: middle;
}
/* ====================================================
  デザイン集
====================================================*/
.gl-design {
  position: relative;
  margin-bottom: 30px;
}
.gl-design .shop_hd {
  font-size: 17px;
}
.gl-design-item {
  width: 202px;
}
.gl-design-item a {
  display: block;
  text-decoration: none;
}
.gl-design-item_addr {
	display: flex;
  margin-bottom: 3px;
  font-size: 11px;
}
.gl-design-item_addr a {
	margin-right: 10px;
}
.gl-design-item_img {
  height: 142px;
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset;
  overflow: hidden;
}
.gl-design-item_img img {
  position: relative;
  width: 100%;
  height: auto;
  z-index: -1;
}
.gl-design-item-spec {
  table-layout: fixed;
  border-collapse: collapse;
  width: 100%;
  margin-bottom: 6px;
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
}
.gl-design-item-spec th,
.gl-design-item-spec td {
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  font-size: 12px;
}
.gl-design-item-spec th {
  width: 59px;
  background-color: #fafafa;
  text-align: center;
}
.gl-design-item-spec td {
  padding: 3px 6px;
}
.gl-design-item-spec tr:nth-of-type(1) th,
.gl-design-item-spec tr:nth-of-type(1) td {
  color: #ff4041;
  font-weight: bold;
}
.gl-design-item_txt {
  font-size: 12px;
  font-weight: bold;
}
.gl-design_more {
  margin-top: 26px;
  text-align: right;
}
.gl-design_more a {
  padding-right: 17px;
  background: url(/sp/img/common/icon_next-lightbrilliantred.svg) right center no-repeat;
  background-size: contain;
  color: #ff4041;
  font-size: 14px;
}
/* ====================================================
  bxslider
====================================================*/
.gl-design-item {
  display: none;
}
.bx-viewport .gl-design-item {
  display: block;
}
.gl-design .bx-prev,
.gl-design .bx-next {
  position: absolute;
  top: 188px;
  display: block;
  width: 13px;
  height: 23px;
  background: url(/public/img/common/icon_next-lightbrilliantred.svg) left top no-repeat;
  background-size: contain;
  text-indent: 100%;
  overflow: hidden;
  white-space: nowrap;
  z-index: 50;
}
.gl-design .bx-prev.disabled,
.gl-design .bx-next.disabled {
  opacity: 0.3;
}
.gl-design .bx-prev {
  left: 0;
  transform: rotate(180deg);
}
.gl-design .bx-next {
  right: 0;
}
/* ====================================================
  事例集
====================================================*/
.gl-plan {
  position: relative;
  margin-bottom: 40px;
}
.gl-plan .shop_hd {
  margin-bottom: 38px;
  font-size: 17px;
}
.gl-plan-case {
  width: 310px;
}
.gl-plan-case_ttl {
  display: flex;
  align-items: center;
  min-height: 30px;
  margin-bottom: 7px;
  padding-left: 11px;
  border-left: 3px solid #ccc;
  font-size: 12px;
}
.gl-plan-case-media {
  display: flex;
  margin-bottom: 10px;
}
.gl-plan-case-media-body {
  width: 160px;
  margin-left: auto;
}
.gl-plan-case_img {
  position: relative;
}
.gl-plan-case_img img {
  width: 140px;
  height: auto;
}
.gl-plan-case_img .roof,
.gl-plan-case_img .accessory,
.gl-plan-case_img .f2,
.gl-plan-case_img .f1 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
/* イメージレイヤー
---------------------------------------*/
.gl-plan-case_img .roof {
  z-index: 4;
}
.gl-plan-case_img .accessory {
  z-index: 3;
}
.gl-plan-case_img .f2 {
  z-index: 2;
}
.gl-plan-case_img .f1 {
  z-index: 1;
}
/* ====================================================
  物件ステータス
====================================================*/
.gl-plan-case-state {
  padding: 0 10px 4px;
  border: 1px solid #007fe5;
  border-radius: 3px;
  background-color: #fafdff;
}
.gl-plan-case_addr {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 19px;
  margin: 0 -10px;
  border-radius: 2px 2px 0 0;
  background-color: #eaf6fd;
  font-size: 11px;
  text-align: center;
}
.gl-plan-case-state-list li {
  display: flex;
  align-items: center;
  min-height: 16px;
  border-bottom: 1px dotted #007fe5;
  font-size: 11px;
}
.gl-plan-case-state-list li:last-of-type {
  border-bottom: none;
}
.gl-plan-case-state_hd {
  flex: none;
  color: #007fe5;
}
.gl-plan-case-state-txt {
  margin-left: auto;
}
/* ====================================================
  塗装プラン
====================================================*/
.gl-plan-case-paint {
  margin-bottom: 12px;
  padding: 2px 10px;
  border: 1px solid #ff4041;
  border-radius: 3px;
  background-color: #fffcfb;
}
.gl-plan-case-paint-list-wrap {
  display: flex;
}
.gl-plan-case-paint-list-wrap ul:nth-of-type(2) {
  margin-left: auto;
}
.gl-plan-case-paint-list {
  width: 48.6%;
}
.gl-plan-case-paint-list li {
  display: flex;
  align-items: center;
  min-height: 17px;
  border-bottom: 1px dotted #ff4041;
  font-size: 11px;
}
.gl-plan-case-paint-list li:last-of-type {
  border-bottom: none;
}
.gl-plan-case-paint_hd {
  flex: none;
  color: #ff4041;
}
.gl-plan-case-paint-txt {
  margin-left: auto;
}
/* ====================================================
  詳細を見る
====================================================*/
.gl-plan-case-show {
  text-align: center;
}
.gl-plan-case-show a {
  display: inline-flex;
  align-items: center;
  min-height: 35px;
  padding: 0 39px 0 33px;
  border-radius: 3px;
  background: url(/sp/img/common/icon_next-white.svg) right 8px center no-repeat #f9595a;
  background-size: 6px auto;
  color: #fff;
  box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, 0.19);
  font-size: 15px;
  font-weight: bold;
  text-decoration: none;
}
.gl-plan_more {
  margin-top: 26px;
  text-align: right;
}
.gl-plan_more a {
  padding-right: 17px;
  background: url(/sp/img/common/icon_next-lightbrilliantred.svg) right center no-repeat;
  background-size: contain;
  color: #ff4041;
  font-size: 14px;
}
/* ====================================================
  bxslider
====================================================*/
.gl-plan-case {
  display: none;
}
.bx-viewport .gl-plan-case {
  display: block;
}
.gl-plan .bx-prev,
.gl-plan .bx-next {
  position: absolute;
  top: 200px;
  display: block;
  width: 13px;
  height: 23px;
  background: url(/public/img/common/icon_next-lightbrilliantred.svg) left top no-repeat;
  background-size: contain;
  text-indent: 100%;
  overflow: hidden;
  white-space: nowrap;
  z-index: 50;
}
.gl-plan .bx-prev.disabled,
.gl-plan .bx-next.disabled {
  opacity: 0.3;
}
.gl-plan .bx-prev {
  left: 0;
  transform: rotate(180deg);
}
.gl-plan .bx-next {
  right: 0;
}
/* ====================================================
  外構工事例
====================================================*/
.gl-ext-case {
  position: relative;
  margin-bottom: 30px;
}
.gl-ext-case .shop_hd {
  font-size: 17px;
}
.gl-ext-case-item {
  width: 202px;
}
.gl-ext-case-item a {
  display: block;
  text-decoration: none;
}
.gl-ext-case-item_addr {
  margin-bottom: 3px;
  font-size: 11px;
}
.gl-ext-case-item_img {
  height: 142px;
  margin-bottom: 7px;
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset;
  overflow: hidden;
}
.gl-ext-case-item_img img {
  position: relative;
  width: 100%;
  height: auto;
  z-index: -1;
}
.gl-ext-case-item_txt {
  font-size: 12px;
  font-weight: bold;
}
.gl-ext-case_more {
  margin-top: 26px;
  text-align: right;
}
.gl-ext-case_more a {
  padding-right: 17px;
  background: url(/sp/img/common/icon_next-lightbrilliantred.svg) right center no-repeat;
  background-size: contain;
  color: #ff4041;
  font-size: 14px;
}
/* ====================================================
  bxslider
====================================================*/
.gl-ext-case-item {
  display: none;
}
.bx-viewport .gl-ext-case-item {
  display: block;
}
.gl-ext-case .bx-prev,
.gl-ext-case .bx-next {
  position: absolute;
  top: 188px;
  display: block;
  width: 13px;
  height: 23px;
  background: url(/public/img/common/icon_next-lightbrilliantred.svg) left top no-repeat;
  background-size: contain;
  text-indent: 100%;
  overflow: hidden;
  white-space: nowrap;
  z-index: 50;
}
.gl-ext-case .bx-prev.disabled,
.gl-ext-case .bx-next.disabled {
  opacity: 0.3;
}
.gl-ext-case .bx-prev {
  left: 0;
  transform: rotate(180deg);
}
.gl-ext-case .bx-next {
  right: 0;
}
/* ====================================================
  コラムメニュー
====================================================*/
.gleft-column-menu {
  margin-bottom: 25px;
}
.gleft-column-menu_ttl {
  margin-bottom: 10px;
  color: #ff4f4f;
  font-family: "游ゴシック", "Yu Gothic", "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 15px;
  font-weight: bold;
  line-height: 30px;
}
.gleft-column-menu-list li {
  margin-bottom: 0;
}
.gleft-column-menu_ttl::before {
  content: "";
  display: inline-block;
  background: url("/public/img/common/icon_column.svg?2022032800") left center no-repeat ;
  width: 25px;
  height: 25px;
  margin-right: 8px;
  background-size: 25px auto;
  vertical-align: middle;
}
.gleft-column-menu_hd:not(.is-open):hover {
  color: #ff4f4f;
}
.gleft-column-menu_hd {
  position: relative;
  font-family: "游ゴシック", "Yu Gothic", "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 13px;
  font-weight: bold;
  line-height: 2.3;
  cursor: pointer;
  background-size: 10px;
  border-bottom: 1px solid #ddd;
}
/* bt_close */
.gleft-column-menu_hd::before {
  opacity: 0;
  content: "";
  display: inline-block;
  width: 15px;
  height: 13px;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  background: url("/public/img/common/icon_ng.svg") right center no-repeat ;
  background-size: contain;
  transition: .5s cubic-bezier(0.25, 1, 0.5, 1);
}
.gleft-column-menu_hd.is-open::before {
  opacity: 1;
}

/* bt_open */
.gleft-column-menu_hd::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: 6px;
  height: 10px;
  margin: auto 0;
  background: url(/sp/img/common/icon_next-mediumgray.svg) left top no-repeat;
  background-size: contain;
  transform: rotate(90deg);
}
.gleft-column-menu_hd.is-open {
  border-bottom: none;
}

.gleft-column-menu_hd.is-open::after {
  opacity: 0;
}

/* fukidashi
---------------------------------------- */
.gleft-column-menu-link::before {
  content: "";
  position: absolute;
  top: -10px;
  left: 22px;
  margin: auto 0;
  border: 11px solid transparent;
  border-bottom: 12px solid #f5f5f5;
  border-top: none;
}
.gleft-column-menu-link {
  opacity: 0;
  visibility: hidden;
  overflow: hidden;
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 15px;
  height: 0;
  margin: 0;
  padding: 0 15px;
  border-radius: 5px;
  background-color: #f5f5f5;
  transition: .3s cubic-bezier(0.25, 1, 0.5, 1);
}
.gleft-column-menu_hd.is-open + .gleft-column-menu-link {
  opacity: 1;
  visibility: visible;
  overflow: visible;
  height: auto;
  margin: 5px 0;
  padding: 10px 15px;
}
.gleft-column-menu-link li a {
  display: inline-flex;
  padding-right: 10px;
  background: url("/sp/img/common/icon_next-brilliantred.svg") right center no-repeat;
  background-size: 5px auto;
  color: #333;
  font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 13px;
  vertical-align: top;
}
.gleft-column-menu-link li a:hover {
  color: #ff4f4f;
  text-decoration: none;
}
/* ====================================================
  #23806 外壁リフォームブログ
====================================================*/
.reform-blog {
  position: relative;
}
.sitetop_hd {
  height: 47px;
  padding: 0;
  border-bottom: solid 1px #e3e3e3;
  background: url(/public/img/common/ico_paintcan_roller.png) right 10px top 5px no-repeat #f2f2f2;
  font-family: 'YuGothicM', '游ゴシック Medium', 'Yu Gothic Medium', '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
  font-size: 22px;
  font-weight: bold;
  text-align: center;
  line-height: 47px;
  margin: 30px auto 20px;
}
.reform-blog-list li {
  display: none;
}
.reform-blog-list a {
  display: block;
  text-decoration: none;
}
.reform-blog_img {
  margin-bottom: 10px;
  box-shadow: inset 0 0 0px 1px rgba(0,0,0,0.1);
  max-height: 140px;
  overflow: hidden;
  display: flex;
}
.reform-blog_img img {
  position: relative;
  align-items: center;
  width: 100%;
  height: auto;
  z-index: -1;
}
.reform-blog_txt {
  font-family: 'YuGothicM', '游ゴシック Medium', 'Yu Gothic Medium', '游ゴシック', 'Yu Gothic', 'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
  font-size: 13px;
  font-weight: bold;
  line-height: 1.4;
}
/* ====================================================
  bxslider
====================================================*/
.bx-viewport .reform-blog-list li {
  display: block;
}
.reform-blog .bx-prev,
.reform-blog .bx-next {
  position: absolute;
  top: 160px;
  display: block;
  width: 13px;
  height: 23px;
  background: url(/public/img/common/icon_next-lightbrilliantred.svg) left top no-repeat;
  background-size: contain;
  text-indent: 100%;
  overflow: hidden;
  white-space: nowrap;
  z-index: 50;
}
.reform-blog .bx-prev.disabled,
.reform-blog .bx-next.disabled {
  opacity: 0.3;
}
.reform-blog .bx-prev {
  left: 0;
  transform: rotate(180deg);
}
.reform-blog .bx-next {
  right: 0;
}