@charset "utf-8";

/*---------------------------------------------
	body
  ---------------------------------------------*/
html { scroll-behavior: smooth; font-size: 62.5%;} /* 10px */
body { font-size: 1.6rem; color: #525261;line-height: 1.9;text-align: left;-webkit-text-size-adjust: 100%; } /* 16px */
p    { font-size: 1.6rem;} /* 16px */
img { width: 100%; height: auto; }

/*---------------------------------------------
 **  フォント
---------------------------------------------*/
.mincho{font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "Hiragino Mincho Pro", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", Georgia, serif;}


/*---------------------------------------------
 **  フッターナビ
---------------------------------------------*/
#footer #nav ul li ul{ display: none; }
/*---------------------------------------------
 **  メイン画像
---------------------------------------------*/

/*---------------------------------------------
	Anchor
---------------------------------------------*/
a {	outline: none;}
a:link {text-decoration: none;color: #0059B2; text-decoration: underline;}
a:visited {text-decoration: none;color: #0059B2;}
a:hover {	color: color-mod(#0059B2 shade(50%)); text-decoration: none;}
a:active {	text-decoration: none;	color: #0059B2;}
a { -webkit-transition: all 0.3s;  transition: all 0.3s; }

/*---------------------------------------------
 ** common div
---------------------------------------------*/
#content	{ width:100%; clear:both;}



/*---------------------------------------------
	title
---------------------------------------------*/


/*---------------------------------------------
	p
---------------------------------------------*/
p {margin-bottom: 1em; }
p+a {margin-top: 1em !important ; }
p+div {margin-top: 1.5em !important ; }

/*---------------------------------------------
 ** padding
---------------------------------------------*/
.pLR_1em { padding-left: 1em; padding-right: 1em;}
.pptna{ padding:30px 45px 25px 45px  ;}

/*---------------------------------------------
 ** margin
---------------------------------------------*/
.mt30{margin-top: 20px !important;}
.m0a { margin: 0 auto; }
.mb0 { margin-bottom: 0 !important; }


/*---------------------------------------------
 ** float
---------------------------------------------*/

.fwb { font-weight: bold;}

/*---------------------------------------------
 **  色関係
---------------------------------------------*/
.btn_col_blue { background:#0059B2; }
.btn_col_red { background:#FF4D4D !important; }

.font_col_red  { color: #FF4C4C; }
.font_col_blue   { color: #0059B2; }
.font_col_black   { color: #000!important; }

.bgc_gray {background: #F6F6F6;padding: 50px 0 24px !important;margin-bottom: 30px;}

.bg_gray { background: #F6F6F6; }
/*---------------------------------------------
 ** ON OFF hover
---------------------------------------------*/
.hover {-webkit-transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; -o-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out;}
.hover:hover{ opacity:0.6; filter:alpha(opacity=60); -ms-filter: "alpha( opacity=60 )"; }

/*---------------------------------------------
 **  画像角丸
---------------------------------------------*/
/* img{-moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px;} */

/*---------------------------------------------
 **  ページトップ
---------------------------------------------*/
#pageTop {
  position: fixed;
  bottom: 20px;
  right: 20px;
    z-index: 999;
}
 
#pageTop a {
  display: block;
  padding: 5px 3px 0px 3px;
  border-radius: 30px;
  background-color: #02529C;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
  background: url(../img/common/page_top.png) no-repeat;
  background-size:100%;
  -moz-border-radius:0px;
  -webkit-border-radius:0px;
  border-radius:0px;
}
 
#pageTop a:hover {
  text-decoration: none;
  opacity: 0.7;
}

/*---------------------------------------------
 **   text-align
---------------------------------------------*/
.ter{ text-align:right;}
.tac{ text-align: center;}

/*---------------------------------------------


 **  position
---------------------------------------------*/
.por{position: relative;}

/*---------------------------------------------
 ** display
---------------------------------------------*/
.db{ display: block !important; }

/*---------------------------------------------
 ** パンくずリスト
---------------------------------------------*/
nav#breadcrumbs ol{ 
   padding:0;
}
nav#breadcrumbs ol li {
  display: inline;
  list-style-type: none;
  font-size:80%;
}
nav#breadcrumbs ol li:before {
  content: " > ";
}
nav#breadcrumbs ol li:first-child:before {
  content:"";
}

/*---------------------------------------------
 **  見出し色
---------------------------------------------*/
.h2_cblue{ color:#4C8BBF;}
.c_lblue { background-color: #00D9D9;}
.c_orabge { background-color: #FF9326;}
.c_gray { background-color: #535362;}
.c_lgreen { background-color: #A3D900;}

/*---------------------------------------------
 **  ボタン
---------------------------------------------*/
.bt_01_ful_w{width:100%;padding-left: 0 !important;padding-right: 0 !important;}

/*=================================================================================================================================*/
/**  共通部分	*/
/*=================================================================================================================================*/

/*---------------------------------------------
 ** 見出し
---------------------------------------------*/
h2,h3 { font-family:"Mplus 1p"; }
/*---------------------------------------------
 ** h2
---------------------------------------------*/
h2       {font-size: 3.4rem; line-height: 1.5;  margin-bottom :1.8rem;}
h2 span  {font-size: 1.2rem; color:#858585;  display:block; letter-spacing:5px; font-family: 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', '游ゴシック Medium', 'Yu Gothic Medium', '游ゴシック', YuGothic, 'メイリオ', Meiryo, sans-serif;}
/* テキストスプライトのベース */
.ts_bace {  text-indent:100%; white-space:nowrap; overflow:hidden; margin-right: auto; margin-left: auto; }

.top_p_01          { background: url(../img/titile/h2_top_01.jpg) 0 0 no-repeat; background-size: 100%;}
.top_h2_01         { background: url(../img/titile/h2_top_coating_01.jpg) 0 0 no-repeat; background-size: 100%;}
.top_h2_02         { background: url(../img/titile/h2_top_repair_01.jpg) 0 0 no-repeat; background-size: 100%;}
.h2_top_works_01   { background: url( ../img/titile/h2_top_orners_01.jpg) 0 0 no-repeat; background-size: 100%; }

.nbr_bace:before{ display:inline-block; padding:0px 12px; text-shadow:none; color:#FFF; font-size:30px;margin-right:0.6em; } 
.nbr_col_red:before { background: #FF4C4C; }
.nbr_col_blue:before { background: #0059B2; }
.nbr_1:before {content: '01';}
.nbr_2:before {content: '02';}
.nbr_3:before {content: '03';}
.nbr_4:before {content: '04';}
.nbr_5:before {content: '05';}
.nbr_6:before {content: '06';}
.nbr_7:before {content: '07';}
.nbr_8:before {content: '08';}
.nbr_9:before {content: '09';}
.nbr_10:before {content: '10';}
.nbr_11:before {content: '11';}
.nbr_12:before {content: '12';}
.nbr_13:before {content: '13';}

.repair_item ruby rt { display:none;  }



/*---------------------------------------------
 ** h3
---------------------------------------------*/
h3{ margin-bottom:1.5rem; }


/*---------------------------------------------
 ** コンテンツ全体
---------------------------------------------*/
#content{
   width:100%;
}
#main{ 
   width:100%;
   margin:0 auto;
   padding:inherit;
}   

/*---------------------------------------------
 ** ヘッダー記述
---------------------------------------------*/
#header{width: 100%; }



/* ロゴ */
#logo a{
	width: 100%;
	height: 100%;
	display: block;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
	background: url(../img/common/logo.png) no-repeat;
	background-size: 100%;
	z-index: 9;
	position: relative;
}
/* メインイメージ */

.main_img {width:100%; position:relative; text-indent:100%; white-space:nowrap; overflow:hidden;}
#top .main_img {background: url( ../img/main_img/top_main.jpg) top center no-repeat; background-size: cover;}
#coating .main_img {background: url( ../img/main_img/coating.jpg) top center no-repeat;}
#repair .main_img {background: url( ../img/main_img/repair.jpg) top center no-repeat;}
#works .main_img {background: url( ../img/main_img/works.jpg) top center no-repeat;}
#company .main_img {background: url( ../img/main_img/company.jpg) top center no-repeat;}
#contact .main_img {background: url( ../img/main_img/contact.jpg) top center no-repeat;}
#recruit .main_img {background: url( ../img/main_img/recruit.jpg) top center no-repeat;}
#news .main_img {background: url( ../img/main_img/news.jpg) top center no-repeat;}



/* メイン画像見出し */
#top .main_h1 { display: none; }

/*---------------------------------------------
 ** フッター記述
---------------------------------------------*/
#footer{
	clear:both;
   position: relative;
}
/* footerロゴ */
#footer #logo {
   margin: 0 auto 25px;
   position:relative;
   top:0;
}
.footer_wrapper{
	padding: 0 0 0px;
	padding: 40px 0 80px 0;
}
/* フッターインナー */
.footer_inner{
   width: 100%;
   margin: 0 auto;
   position:relative;
   padding: 0 0 0 0;
}

/* フッター左 */
.footer_add_wrapper { border-top: 1px solid #CDCDCD; }
.footer_add { width: 100%;  border-bottom: 1px solid #CDCDCD;  padding:12px 0; }
.footer_add dt { font-size:2.0rem; position:relative; color:#0059B2;  }
.footer_add dt:after{width: 100px; height: 6px; position: absolute; bottom: 3px; left: 0px; right: 0px; margin:0 auto; background: #0059B2; content: ''; }
.footer_add dd span {font-size: 1.9rem;}


/* コピーライト */
#copyright	{
   font-size: 0.8em;
   width: 100%;
   text-align:center;
   letter-spacing: 3px;
   padding: 15px 0 18px;
}

/* キャンピングカー　バナー復活したらけす。 */
.footer_inner_R { display: none; }

/*---------------------------------------------
 ** TOPコンテンツ
---------------------------------------------*/
/* 施工事例 */
.slider_box { margin-bottom: 20px; text-align:center;}
.slider_box dd { padding:1em 0 0 0; } 
.slider_box a { text-decoration:none ; } 
.slider_box dd h4 { text-decoration:underline ; } 
.slider_box dd p { color:#666666; } 

.slick-dots { display: none !important;  }/* カルーセルの ● ● ● ● 消す */
.works_new { position: relative;}
.works_new:after{width: 73px; height: 65px; position: absolute; top: 0px; right: 0px; background: url( ../img/top/new.png) no-repeat; background-size: 100%; content: ''; }

/* 30年の特殊塗装技術で、皆さまの暮らしをサポート */
.bg_top_company { width: 100%; height: 250px; margin-bottom: 40px; background: url( ../img/top/img_top_company_01.jpg) 0 0 no-repeat; }

/* お知らせ */
.news_wrapper  {background: #F7F7F7;display:flex;flex-wrap:wrap;justify-content: space-between;padding: 11px 0 24px;}
.news_wrapper dl  {margin: 0 60px; position:relative; }
.news_wrapper dl dt {background: #02857A;color: #FFF;display: inline-block;padding:0.1em 1em;margin: 0 0 0.8em;}
.news_wrapper dl dd a { color: #02857A; }

/* footer_お問い合わせ */
.footer_contact  {border: 2px solid #0059B2;display:table;width: 100%;padding: 30px 30px 33px;box-sizing: border-box;}
.footer_contact li{width: 50%;text-align: center;display:table-cell;vertical-align: middle;font-size: 21px;font-family: "Mplus 1p";font-weight: bold;}
.footer_contact li img{width: 290px; height: 75px;  }



/*---------------------------------------------
 **  内部
---------------------------------------------*/


/*---------------------------------------------
 **  補修部ページ
---------------------------------------------*/
.tokucho_title_h3{background: #0059B2;display:inline-block;margin: 0 auto 1.4em;color: #FFF;padding: 2px 15px 1px;font-size: 20px;}
.tokucho_title dt{ text-align: center; }

.title_pattern_1 {margin-bottom:30px !important;}
.title_pattern_1 dt{ width: 100%; background:  #0059B2;color: #FFF;}
.title_pattern_1 dt h3{margin:0; }

#repair .flex_wrapper h4 { color: #0059B2; font-size: 18px; padding: 15px 0 12px; text-align: center; font-weight: bold; }

.bdb_repair {border-bottom:1px dashed #CDCDCD;margin-bottom: 50px !important;}


/*---------------------------------------------
 **  会社概要
---------------------------------------------*/
.company_table { width:100%; }
.company_table tr {border-top: 1px solid #eee;}
.company_table tr:last-of-type { border-bottom:1px solid #eee;}
.company_table th { width: 100%; padding:20px; color:#0059B2; vertical-align:top;  position:relative; font-family: "Mplus 1p";}

.company_table th,.company_table td{padding:20px ;}
.company_table td span {  color:#0059B2; }


/*---------------------------------------------
 **  お問い合わせ
---------------------------------------------*/

/*---------------------------------------------
 **  施工事例
---------------------------------------------*/
.works_item {  -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; padding-bottom:25px; _zoom: 1; overflow: hidden;

  box-shadow: 0 0px 20px rgba(0,0,0,0.06);
  margin:10px;
 }
 
 

/*---------------------------------------------
 **  アコーディオン共通CSS 保留
---------------------------------------------*/

div.accordion dl dd {display:none;}

/* プラスアイコン */
div.accordion dl dt {
	width:calc((100% - 60px));
	-webkit-transition: all 0.3s;  transition: all 0.3s; 
	background:url(/img/common/open.png) 95% 50% no-repeat #09613e !important ; 
	background-size:6% !important;
	padding: 0.5em 30px;
   -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px;
}
/* マイナスアイコン */
div.accordion dl dt.open {
	-webkit-transition: all 0.3s;  transition: all 0.3s; 
	background:url(/img/common/close.png) 95% 50% no-repeat #09613e !important ;
	background-size:6% !important;
}


/* 始めの要素のみマイナスアイコン */
div.first dl:nth-of-type(1) dt {
	-webkit-transition: all 0.3s;  transition: all 0.3s; 
	background:url(/img/common/close.png) 95% 50% no-repeat #09613e !important ;
	background-size:6% !important;
}
/* 始めの要素のみプラスアイコン */
div.first dl:nth-of-type(1) dt.open {
	-webkit-transition: all 0.3s;  transition: all 0.3s; 
	background:url(/img/common/open.png) 95% 50% no-repeat #09613e !important ;
	background-size:6% !important;
}
/* 始めの要素のみ表示 */
div.first dl:nth-of-type(1) dd {display:block;}



/*---------------------------------------------
 **  ガラス塗装
---------------------------------------------*/
/* お家のサイディングや外壁など */
.coating_bg_01 { width: 100%;  background: url( ../img/coating/bg_01.jpg) 0 0 no-repeat; }

/* キラキラBOX */
.coating_bace {border: 3px solid;box-shadow: 4px 4px #F0F0F0; font-size:20px; font-weight:bold; color: #000; text-align: center;padding: 18px 10px 15px; position:relative; margin-bottom:30px;}
.bdred { border-color: #FF4D4D; }
.bdgray { border-color: #A4A4A4; }
.coating_bace strong { font-weight:bold; color: #FF4D4D; }



/* キラキラ */
.kira_b:before{width: 67px;height: 79px;position: absolute;top: -26px;left: 10px;background: url( ../img/coating/kirakira.png) no-repeat;content: '';}
.kira_a:after{width: 67px;height: 79px;position: absolute;bottom: -28px;right: 10px;background: url( ../img/coating/kirakira.png) no-repeat;content: '';}

.kira_size_s:after {width: 40px;height: 47px;background-size:100%;bottom: 19px;right: -12px;}

.coating_wrapper_mini .coating_bace {padding: 6px 5px 3px;color: #000;font-size: 23px;}
.coating_wrapper_mini dd {position:relative; }
.coating_wrapper_mini dd h4 {text-align: center;padding: 15px 0 50px;font-weight:bold;}
.coating_wrapper_mini dd h4:after{position: absolute;top: 58px;left: 0px;margin:0 auto;right:0;content: '';width: 0;height: 0;border-style: solid;border-width: 22px 32px 0 32px;border-color: #000 transparent transparent transparent;}
.kira_mb { margin-bottom: 27px; }


.bg_coating_01 { width: 100%; background: url( ../img/coating/img_coating_07.jpg) 0 0 no-repeat;  position: relative; }
.bg_coating_02 { width: 100%; background: url( ../img/coating/img_coating_11.jpg) 0 0 no-repeat;  position: relative; }
.bg_coating_03 { width: 100%; background: url( ../img/coating/img_coating_15.jpg) 0 0 no-repeat;  position: relative; }

.bg_coating_red { background: url( ../img/coating/bg_coating_red.jpg) 0 0 no-repeat #FF4D4D !important; background-size:100%; position: relative; }
.bg_coating_red h3:before{width: 40px; height: 47px; position:absolute; left:50px;background: url( ../img/coating/kira_s_white.png) no-repeat; content: ''; } 




.bg_coating_01 h3{  background: url( ../img/coating/h3_coating_01.png) 0 0 no-repeat; text-indent:100%; white-space:nowrap; overflow:hidden; }
.bg_coating_02 h3{  background: url( ../img/coating/h3_coating_02.png) 0 0 no-repeat; text-indent:100%; white-space:nowrap; overflow:hidden; }
.bg_coating_03 h3{  background: url( ../img/coating/h3_coating_03.png) 0 0 no-repeat; text-indent:100%; white-space:nowrap; overflow:hidden; }




/* 料金表 */
table.table01 {
	border-spacing: 4px !important;
	width:100%;
	border-collapse: separate;
}
table.table01 thead th {
	background: #61C5B9;
	color:#FFF;
	padding:10px 15px;
	border-right:#FFF solid 1px;
	border-bottom:#FFF solid 1px;
}
table.table01 thead th:last-child {
	border-right:#3EB1C6 solid 1px;
}
table.table01 tbody th {
	background: #F0F0F0;
	padding:10px 15px;
	border: #61C5B9 solid 1px;
	vertical-align:top;
}
table.table01 tbody tr:last-child th {
	border-bottom:#3EB1C6 solid 1px;
}
table.table01 tbody td {
	background:#FFF;
	padding:10px 15px;
	border:#3EB1C6 solid 1px;
	vertical-align:top;
}


.price dl {width:100%;border-top:1px dashed;display:table; padding:  20px 0;}
.price dl:last-of-type {border-bottom:1px dashed;  margin:0 0 25px;}
.price dl dt {width:30%;vertical-align:middle;font-size:2rem;display:table-cell;border-right:1px solid;padding:  0 2em;}
.price dl dd {display:table-cell;padding:  0 2em;vertical-align:middle;}
.price dl dd p{font-size:2rem; margin:0;}
.price dl dd span {display:inline-block; float:right; background:#F0F0F0; padding:8px 0 5px; min-width:199px; text-align:center; }
.price dl dd p {display:inline-block;}


/*---------------------------------------------
 **  ガラス塗装とは
---------------------------------------------*/
.glass_list { margin-bottom:50px;  }
.glass_list li { position: relative; padding:0 0 0 1.3em; }
.glass_list li:after{width: ■; height: ■; position: absolute; top: 0px; left: 0px; content: '●'; }
.list_red li:after { color:#FF4C4C ; }

.table_02 { border:1px solid #CDCDCD;}
.table_02 th{background:#D3F5FE;}
.table_02 th span{font-size:16px;}
.table_02 td{ background:#FFF;  }
.table_02 th,
.table_02 td{ text-align: center; padding:6px 5px 3px; border:1px solid #CDCDCD;}

table.table01.glass_table {  border-spacing: 0px !important; border-collapse: collapse; border: #D3D3D3 solid 1px; font-size:14px;}
table.table01.glass_table thead th {
	background: #EDEDED;
	color:#000;
	border-right:#D3D3D3 solid 1px;
	border-bottom:#D3D3D3 solid 1px;
}

table.table01.glass_table tbody th {
	border: #D3D3D3 solid 1px;
	padding: 5px 15px;
}
table.table01.glass_table tbody tr:last-child th {
	border-bottom:#D3D3D3 solid 1px;

}
table.table01.glass_table tbody td {
	border:#D3D3D3 solid 1px;
	padding: 5px 15px;
}


/*---------------------------------------------
 **  液体ガラスとは
---------------------------------------------*/
.btn_col_yellow { background:#FEAE4E; }
.rikid_glass_about {  padding:0 5%; }

.rikid_glass_about > .glass_list { margin-bottom:30px;  }
.rikid_glass_about >.glass_list h3 { position: relative; padding:0 0 0 1.3em; margin:0 0 5px; }
.glass_list h3:after{ position: absolute; top: 0px; left: 0px; content: '●'; }
.list_yellow h3:after { color:#FEAD4D ; }

.glass_jikken_h { padding:10px 10px; margin-bottom:30px; font-weight: bold; }

.glass_jikken_wrapper .flex_wrapper_3_item dt {margin-bottom:20px; }
.glass_jikken_wrapper .flex_wrapper_3_item dd { padding:0 1em; }
.glass_jikken_wrapper_02 dd { padding:5px 10px;}


.rinen{ border:2px solid #3D7AC5; margin-bottom:20px; }
.rinen dl{background:#EEF3FA; }
.rinen dl:nth-of-type(2n){background:#FFF; }


.rental_bt{ 
	display:block;
	border:1px solid #3D7AC5;
	font-size:12px;
	text-align:center;
	text-decoration:none !important;
	margin:5px 0 3px;
	}
	.rental_bt:hover{
	background:#3D7AC5;	
	color:#FFF;
	}

#company .rental_bt{
	max-width:320px;
	padding:5px;
} 

/* 施工事例 */
.works_item a { text-decoration: none !important;}
.works_item img{
  width: 50% !important;
  height: 200px;
  object-fit: cover;
  float:left;
}



/* 施工事例 */
#wp_gallery_wrap{ width: 100%; display: block; overflow: hidden;}
#wp_gallery_wrap .gallery_img{ display: flex; }
#wp_gallery_wrap .gallery_img div{ width: 48%; position: relative;}
#wp_gallery_wrap .gallery_img div:first-child{ margin-right: 2%;}
#wp_gallery_wrap .gallery_img div img { width: 100%; }
#wp_gallery_wrap .gallery_img div span{display: block;position: absolute;top:0;left:0;background:#0059B2;color: #fff;padding: 0px 7px 0px;font-size: 1.4rem;font-weight: bold;}

#wp_gallery_wrap .gallery_info{ display: block; overflow: hidden;}
#wp_gallery_wrap .gallery_info ul{width: 80%;margin: 30px auto 40px;border: 2px solid #3D7AC5;}
#wp_gallery_wrap .gallery_info ul li {padding: 0px 0px;margin-bottom: 0px;}
#wp_gallery_wrap .gallery_info ul li span{display: inline-block;   background: #EEF3FA; padding: 15px 35px;font-weight: bold;margin-right: 35px;letter-spacing: 0.1em;}

.list_back{ text-align: center; margin: 0 auto; }

.tokucho_wrapper h2{ margin-bottom: 15px;}

.gallery_img div { position: relative;}
.gallery_img div span{display: block;position: absolute;top:0;left:0;background:#0059B2;color: #fff;padding: 9px 13px;font-size: 2.1rem;font-weight: bold;}

.gallery_img div:nth-of-type(2) span{ left: 50%; }
.list_span{  padding: 0px 11px !important;   font-size: 1.4rem !important;}



#top .works_item {-moz-border-radius:0px;-webkit-border-radius:0px;border-radius:0px;padding-bottom:0;
  _zoom: 1;
  overflow: hidden;
  box-shadow:none;margin:0;
}