@charset "utf-8";

/*=================================================================================================================================*/
/** 個別指定 for スマートフォン
/*=================================================================================================================================*/


/*---------------------------------------------
 ** 320px
---------------------------------------------*/
@media screen and (max-width: 320px) {
  .top_h2_01,.top_h2_02         {height: 86px !important;}
.h2_top_works_01   {height: 80px !important; }

.top_h2_01         {height: 95px !important;}
.top_h2_02         {height: 95px !important;}
}


/*---------------------------------------------
 ** 740px
---------------------------------------------*/
@media screen and (max-width: 740px) {

/*---------------------------------------------
	body
  ---------------------------------------------*/
html { scroll-behavior: smooth; }
html {font-size: 62.5%;} /* 10px */
body { font-size: 15px;  font-family: sans-serif; color:#444; } /* 16px */
p    {font-size: 15px;} /* 16px */

/* コンテンツ全体 */
#content{}
#top #main{margin: 0 auto 24px;}
#top #main{margin: 0 auto 40px;padding: 30px 0 0 0;}
#main{padding: 0 0 0 0;}

/* fook */
.only_sp_none,
.pc_br{display:none!important;}
.sp_br{display: inline;}

/*画像*/
img{max-width:100%; height:auto;}

/*---------------------------------------------
 **  ナビ
---------------------------------------------*/


#nav01 ul{padding: 0 12% 0 7%;background:#F6F6F6;}
#nav01 ul li {border-bottom:1px dashed #CCC ; }
#nav01 ul li:last-of-type { border:none; }
#nav01 ul li a{padding: 0.8em 1em 0.7em 2em;font-size:12px;}
#nav01 ul li a:after{ position: absolute; top: 7px; left: 5px;  content: '≫'; color:#0059B2; }
#nav01 ul li:last-of-type a:after{ content: '≫'; }
#nav01 { border-bottom:none;}

#nav01 ul li a:before {	display:none;}

#nav01 ul {border-top: 1px solid #DCDDDD; border-bottom: 1px solid #DCDDDD;}

header nav ul li a:hover {background:rgba(255,255,255,0) !important; }


/* ヘッダー固定 */
.fix {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 10;
	background: #FFF;
	box-shadow: 1px 3px 10px rgba(0,0,0,0.03);
	}
  #header{
	  height:130px !important;
  }
  
  .main_img {margin: 108px 0 0 0;}
  
  


/*---------------------------------------------
 **  メイン画像
---------------------------------------------*/
.main_img {width:100%;height: 130px;position:relative;background-size: cover; text-align:center;}
.header_inner  {width:100% !important;height: 80px;margin: 0 !important;}

.main_h1{text-align:center;font-size:20px;padding:50px 0 0 0;}

/* メイン画像 */
div.main_img {background-size:cover !important;}

/*---------------------------------------------
 ** ヘッダー記述
---------------------------------------------*/
#header{}
.header_wrapper{}
.btn_header_canp{ width:90% !important; margin:10px auto 15px; font-size:14px !important; display:none !important;}
.tel_nbr {display: none;}

/*---------------------------------------------
 **  ロゴ
---------------------------------------------*/
#logo {
  width: 175px;
  height: 58px;
  bottom: 0px;
  left: 0%;
  right: 0px;
  margin: 28px auto 13px;
}
#footer #logo {width: 224px;height: 77px;bottom:0;left: 0%;right:0;margin: 25px auto 13px;}
.sp_tel {width: 51px;height: 51px;position:absolute;top: 1px;left: 3%;}

/*---------------------------------------------
 **  タイトル
---------------------------------------------*/
h2 {font-size: 2.2rem;margin-bottom: 1.7rem;}
.ts_bace_none {  text-indent:0%;white-space: inherit;overflow: inherit; margin-right: auto; margin-left: auto; }

p.top_p_01          {font-size: 20px;margin-bottom: 10px;background: none;text-indent:0%;white-space: inherit;overflow: inherit;}
.top_h2_01         {width: 100%;height: 118px;background: url( ../img/titile/sp_h2_top_coating_01.jpg) 0 0 no-repeat;background-size: 100%;}
.top_h2_02         {width: 100%;height: 118px;background: url( ../img/titile/sp_h2_top_coating_02.jpg) 0 0 no-repeat;background-size: 100%;}
.h2_top_works_01   {width: 100%;height: 98px;background-size: 100%;}

h3 {font-size: 19px;}
.top_coating_h3  {margin-top: 16px;}
.nbr_bace {margin-right:0em;}
.nbr_bace:before{padding: 5px 10px;font-size: 19px;margin-right: 0.5em;} 
.tokucho_title_h3 { font-size: 16px; margin-bottom:0.5em; }
/*=================================================================================================================================*/
/**  TOP	*/
/*=================================================================================================================================*/

#top .nbr_4 {}

/*=================================================================================================================================*/
/**  TOPメイン	*/
/*=================================================================================================================================*/

/* コーティング部(一般向け)*/
.bg_top_coating {width: 100%;height: 100px;margin-bottom: 0px;background: url( ../img/top/img_top_01.jpg) top center no-repeat;background-size: cover;}
.bg_top_coating img { display:none;}
.img_huro { display:none;}
.bg_top_coating_wrapper{ width:90%; margin:0 auto; }

.repair_item {margin-bottom: 50px !important;}
.repair_item:last-of-type { margin-bottom:0 !important;}
.repair_item dd {width:90%;margin: 16px auto 0;}



/* カルーセル */
.slider_box{width: 86%;margin: 20px auto 0;}
.slick-prev,
.slick-next{width: 55px!important;height: 60px!important;border:none !important;background:#000 !important; top:32% !important; }
.slick-prev {width: 19px !important;background: url( ../img/common/slid_L.png) 0 0 no-repeat !important;background-size: 100%  !important;left: -11% !important;z-index: 999;}
.slick-next {width: 19px !important;background: url( ../img/common/slid_R.png) 0 0 no-repeat !important;background-size: 100%  !important;right: -11% !important;}




.bg_top_company {width: 100%;height: 100px;margin-bottom: 20px;background-size:  cover;}

.clounm_2_top_company {  display:flex;flex-wrap:wrap;justify-content: space-between;}
.clounm_2_top_company>div{width: 45%; margin:0 auto !important; }


/* お知らせ */
.news_wrapper {width: 110%;margin-left: -5%;padding: 25px 0%;}
.news_wrapper dl { width:90%; margin:0 auto 30px;}
.news_wrapper dl:last-of-type { margin-bottom:0;}
.news_wrapper dl dt { width:100%; text-align:center; padding:5px 0 2px 0; -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px;}


/* footer_お問い合わせ */
.footer_contact  {display:inline-block !important;width: 100%;padding: 24px 7% 33px;}
.footer_contact li{width: 100%;display:inline-block;font-size: 18px;}
.footer_contact:after{width: 90%; height: 1px; position: absolute; top: 150px; left: 0px; right:0; margin:0 auto; background:#0059B2; content: ''; }

.footer_contact li br{ display:none;}
.footer_contact li img{width: auto;margin: 44px 0 0 0;height: 60px;}


/*=================================================================================================================================*/
/**  フッター	*/
/*=================================================================================================================================*/
.footer_wrapper{ margin:0 ; padding-bottom:10px; }

/* フッターナビ */
#footer nav ul{ background:#F6F6F6;  display:flex;flex-wrap:wrap;justify-content: space-between; padding:1px 0 1px 0;}
#footer nav li{  width:49.3%;margin:1px;  }
#footer nav a{ width:100%; background:#FFF; font-size:12px;  padding:10px 0; text-align:center; text-decoration:none; display:block; position:relative; }
#footer nav a:after{width: 10px;height: 10px;position: absolute;top: 15px;right: 11px;background: url( ../img/common/bt_icon_blue.png) 0 0 no-repeat;background-size: 100%;content: '';}

#copyright {font-size:10px!important;}

/* ページTOPへ */
#pageTop {right: 6%;bottom:0;}
#pageTop a {width: 40px;height: 57px;}

.footer_add { text-align:center; }
.footer_add dt { padding:0 0 10px !important; margin:0 0 5px !important; font-size:18px; }
.footer_add dd,.footer_add dd span { font-size:16px;  }
.footer_inner_R{ width:90%; margin:0 auto; padding:20px 0 0 ; }
.footer_inner_R img { width:100%;   }

/*=================================================================================================================================*/
/**  内部ページ	*/
/*=================================================================================================================================*/


/*---------------------------------------------
 **  補修部(工務店・メーカーさま向け)ページ
---------------------------------------------*/
.flex_wrapper_2_item { margin-bottom: 40px; }
.flex_wrapper_2_item dt {  text-align:center; }
.flex_wrapper_2_item dd {  width:90%; margin:0 auto; }
.title_pattern_1 dd{padding: 20px 1em;}

.nbr_bace_title:before{width: 32px;display:block;padding: 0px 18px;font-size: 30px;margin: 0 auto 8px; -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px;} 


/*---------------------------------------------
 **  会社概要
---------------------------------------------*/
.company_table th,.company_table td{display:inline-block; padding-right:0; padding-left:0;}
.company_table th { padding:15px 0 10px !important; }
.company_table th,.company_table td{padding: 0 0 15px ;}
.company_table td{ width:100%;}
/*---------------------------------------------
 **  施工事例
---------------------------------------------*/
.works_item { 
  margin-bottom: 30px !important;
 }

 #wp_gallery_wrap .gallery_info ul{width: 100%;
	box-sizing: border-box ; /*通常の記述*/
	-webkit-box-sizing: border-box ;  /*Google ChromeやSafariの機能を利用*/
	-moz-box-sizing: border-box ;  /*Firefoxの機能を利用*/}

	

/*---------------------------------------------
 **  ガラス塗装
---------------------------------------------*/
.coating_bg_01 {height: 250px; background-size:cover;}
.h2_coating_01 { padding: 30px 5%; font-size:16px;}
.h2_coating_01 div { font-size:15px;}


.kira_b:before{width: 30px;height: 40px; top:-13px; background-size:100%;}
.kira_a:after{width: 30px;height: 40px; bottom:-30px;  background-size:100%;}

.kira_big { margin-bottom:30px !important;}
.coating_bace {font-size: 16px; padding: 19px 10px 12px; margin-bottom:18px;}
.coating_bace:last-of-type {margin-bottom:0;}
.h2_coating_big { padding:20px 0 10px;}

.kira_mb{ margin-bottom:20px;}

.coating_btn div {display:block;width: 100%; margin-bottom:35px !important;}
.coating_btn div:last-of-type {margin-bottom:0 !important; }
.coating_btn a {width: calc((90% - 15px)) !important;padding-left:0 !important;padding-right:50px !important;font-size:14px;}


.bg_coating_01,
.bg_coating_02,
.bg_coating_03  {height: 250px;margin-bottom: 23px;background-size:cover;}

.bg_coating_01 h3{width: 250px;height: 66px;background-size:100% !important;position:absolute;top: 50px;right: 0;left:0;margin:0 auto;}
.bg_coating_02 h3{width: 250px;height: 66px;background-size:100% !important;position:absolute;top: 50px;right: 0;left:0;margin:0 auto;}
.bg_coating_03 h3{width: 250px;height: 66px;background-size:100% !important;position:absolute;top: 50px;right: 0;left:0;margin:0 auto;}

.bg_coating_red { padding:20px 0 15px;}
.bg_coating_red h3:before{width: 20px; height: 25px; left:50px; background-size:100% !important; content: ''; } 

.coating_wrapper_mini dl dt{  _zoom: 1; overflow: hidden; text-align:center; }
.coating_wrapper_mini dl dd{margin:0 0 30px;padding:0 0 40px;border-bottom: 1px dashed #000;}
.coating_wrapper_mini img{ width:50%; margin:0 auto;}

.coating_wrapper_mini .coating_bace {font-size: 18px;}

/*---------------------------------------------
 **  料金
---------------------------------------------*/



table.table01{
border-spacing: 0px !important;  border-bottom:1px solid #61C5B9;}

table.table01 thead {
	display:none;


}
table.table01 tbody th { 
text-align:center;
	display:block;
	border-bottom:none;
	background:#61C5B9;
}

table.table01 tbody td {
	display:block;
	border-bottom:none;
	
}
table.table01 tbody td::before {
	content: attr(label);
	float: left;
	clear:both;
	font-weight:bold;
}
table.table01 tbody td p {
	padding-left:6em;
}


table.table01 th,
table.table01 td,
table.table01 p{font-size:12px;}



.price dl {width:100%;border-top:1px dashed;display:block; padding:  0 0;}
.price dl:last-of-type {border-bottom:1px dashed;  margin:0 0 25px;}
.price dl dt {width:100%;font-size:18px;display:block; background:#FFEEEE;border-right:none; text-align:center;padding:  10px 0;}
.price dl dd {padding: 0.9em 2em 1.9em;text-align:center;width: 80%;_zoom: 1;overflow: hidden;}
.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;width: 100%;text-align:center;}
.price dl dd p { width:100%;display:block;}


/*---------------------------------------------
 **  液体ガラスとは
---------------------------------------------*/
.glass_img_01 {padding-bottom: 2.5rem;}
.glass_clounm_L_01 img {width: 79%;height: auto;margin: 0 auto 2rem;display:  block;}

.table_02 { width:100%;  font-size:14px;}
.table_02:nth-of-type(2) {margin-bottom: 2rem; border-top:none;}
.table_02 th,.table_02 td{border-top:none;}
.table_02 th{width: 120px;}
.table_02 th span{font-size: 12px;display:  block;}

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 {
background:#EDEDED;
}
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;
}


.clounm_samazama_L img { width:70%; margin:0 15% 1rem; }

.glass_jikken_wrapper dl { position:relative; margin-bottom:70px !important; }

.glass_jikken_wrapper .flex_wrapper_3_item:after{position: absolute;bottom: -45px;left: 0px;margin:0 auto;right: 0;content: '';width: 0;height: 0;border-style: solid;border-width: 27px 25px 0 25px;border-color: #feaf4e transparent transparent transparent;}
.glass_jikken_wrapper .flex_wrapper_3_item:nth-of-type(3n):after{ display:none;}





.rinen dl { width:100%; }
.rinen dl dt{  text-align:center; font-size:24px; padding:25px 20px 0;}
.rinen dl dd{ font-size:18px; padding:0 20px 20px; }


.rental_bt{
	width: 80%;
	margin: 10px auto;
	padding: 10px;
}


}