@charset "utf-8";
/* ================================================================
 株式会社　ソーフィールド
 admin  : Masako Yoshimoto
 Author: Graphics Drive Inc.
 Author URI: http://www.graphics-drive.com/
 update : 2020/05/12
 
 Tablet用css
 break point max-width: 980px, max-width: 768px, min-with: 480px
------------------------------------------------------------------- 

コンテンツ
table
トップページ
施工事例
ショールーム
こだわり仕様

================================================================ */

.pc{ display: none; }
.tb{ display: block; }

#wrapper { width: 100%;margin: 0; padding: 0; overflow: hidden!important;}/* 左右ぐらつき防止 */

#header, .brownbar, #gnav-box, .bnr-contact{ display: none; }

#contents{ width: 95%; padding-top: 50px;}
#contents2{ width: 95%;}
.inner{ width: 95%;}

/* ------------------------------------------------------------
		コンテンツ・見出し・共通
------------------------------------------------------------ */

/* メインタイトル */
#title-box{ padding-top: 50px; }

.center-box h2{
	line-height: 1.6em;
	padding-right: 5px;
	padding-left: 5px;
}

/* 左ボーダー＋下線付きtitle / コンセプト・安心のシステム */
h2.title-lu{ font-size: 2em;}

/* ------------------------------------------------------------
		table
------------------------------------------------------------ */
@media screen and (max-width: 700px) 
.table2{width: 95%; font-size: 1.3em; letter-spacing:0;}
.table2 th{ padding: 2px; }
.table2 td{ padding: 2px;}
}

/* ------------------------------------------------------------
		トップページ
------------------------------------------------------------ */
/* 上メニューが被る分下げる */
#slider{ width: 100%;}

#conceept , #conceept-s{height: auto; padding-top: 50px;}

#conceept .inner , #conceept-s .inner{max-width: 100%;}

#conceept h2 , #conceept-s h2{ 
	font-size: 2.6em; 
	line-height: 1.8em; 
}

#conceept p , #conceept-s p{ 
	font-size: 1.6em; 
	line-height: 1.6em; 
}

.event{ width: 95%;}

.style-box2{ 
	width: 100%; 
	max-width: 980px; 
	margin-right: auto; 
	margin-left: auto; 
	text-align: center; 
	padding-top: 30px;
}

/* ------------------------------------------------------------
　　施工事例
------------------------------------------------------------ */

/* works 中トップ */

#works p{ 
	width: 95%; 
	font-size: 1.7em; 
	line-height: 1.4em; 
	color: #333; 
	font-family: "Sawarabi Mincho"; 
	text-align: left; 
	margin-top: 10px;
	margin-right: auto; 
	margin-left: auto;
}

.layer{ margin-top: 90px; margin-bottom: 100px; height: auto;}

/* --- 文字box ---  */
.lt, .rt{ width: 100%; top: -70px;}
.lt p, .rt p{ color: #FFF!important; text-align: center!important;}

@media(max-width: 768px){ 

/* 3カラム */
ul.col3 li{ width: 48%;}

ul.col3 li:nth-child(3n){ padding-right: 2%; } /* 3の倍数他は余白有 */
ul.col3 li:nth-child(2n){ padding-right: 0; }

/* ページフッターの4つのボタン */
ul.btn4-2 li{width: 48%;}
ul.btn4-2 li:nth-child(2n){ margin-right: 0; }

/* 3カラム */
ul.col3n li{ width: 48%;}

ul.col3n li:nth-child(3n){ padding-right: 2%; } /* 3の倍数他は余白有 */
ul.col3n li:nth-child(2n){ padding-right: 0; }

/* ページフッターの4つのボタン */
ul.btn4-2 li{width: 48%;}
ul.btn4-2 li:nth-child(2n){ margin-right: 0; }


}

/* ------------------------------------------------------------
		ショールーム
------------------------------------------------------------ */
@media(max-width: 768px){ 
/* 新伊勢崎展示場のボタン(2つ) */
.green-box { height: auto; }
.green-box ul.bk-btn li{ width: 95%; margin-bottom: 10px; }

/* 太田展示場のボタン(3つ) */
.bk{ height: auto; }
ul.bk-btn li{ width: 95%; margin-bottom: 10px; }
}

/* ------------------------------------------------------------
	こだわり仕様
------------------------------------------------------------ */
 /* 黄色いサブメニュー */
@media(max-width: 768px){ 

ul.btn4 li{ width: 48%;}
ul.btn4 li:nth-child(2n){ margin-right: 0; } 
}

/* ------------------------------------------------------------
	  Footer
------------------------------------------------------------ */
#pageTop{ bottom: 80px; right: 20px;}