@charset "UTF-8";
/**
 * 初期化
----------------------------------------------------------------------------------------------------*/
table{ width:100%; }
p{ text-align:justify; }
img{ display:block; max-width:100%; }
iframe{ display:block; }
.midbox{
	max-width:768px;
	margin:0 auto;
}
.midbox > section{ margin:20px 0; }
.yt {
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}
.yt > iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
}
#feedbox{
	width:1200px;
	clear:both;
	margin:0 auto;
	padding:20px 0 40px;
	overflow:hidden;
}
#feedbox ul{
	padding:18px 18px 14px;
	margin:0 auto;
	display:block;
	overflow:hidden;
	border:2px solid #824600;
}
#feedbox li{
	border-bottom:1px dotted #824600;
	width:49%;
	float:left;
	padding:0 0 5px;
	word-wrap: break-word;
}
#feedbox li:nth-child(even){
	float:right;
}
#feedbox li:nth-last-child(2),
#feedbox li:last-child{
	border:none;
	padding:0;
}
#feedbox li > article > a{
	display:block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	height:1.5em;
}

/**
 * 全体
----------------------------------------------------------------------------------------------------*/
body{
	background:#fff;
	color:#000;
	font-size:14px;
	line-height:150%;
	letter-spacing:.1em;
	width:100%;
	height:100%;
	top:0;
	left:0;
	overflow-x:hidden;
	color:#824600;
}
a{
	color:#824600;
}
a:hover{
	color:#ffb400;
}
body,input,textarea,h1,h2,h3,h4,h5,h6,p,ul,ol,li,table,caption,th,td,menu,button,option,select{ font-family:"Roboto"; }

/**
 * プロトタイプ
----------------------------------------------------------------------------------------------------*/
table,th,td{
	border: 1px solid #888;
	color:#000;
}
th,td{ padding:15px 8px; }
th{
	font-weight:normal;
	background:rgba(0,0,0,.1)
}
td a{
	color:#000;
	background:#ddd;
	padding:4px 10px;
	border:1px solid #888;
	border-radius:1em;
}
td > a:hover{
	background:skyblue;
	color:#000;
}
.gm > iframe{ height:400px; }
.big{
	font-size:20px;
	line-height:40px;
}
#loading{
	position:fixed;
	z-index:20000;
	top:0;
	bottom:0;
	right:0;
	left:0;
	width:100%;
	height:100%;
	background:rgba(255,255,255,.9) url("./../image/ui_loading.gif") scroll no-repeat center center;
}
.loading:before{
	content:'';
	display:block;
	width:100%;
	height:100%;
	background:#fff url("./../image/ui_loading.gif") scroll no-repeat center center;
}

/**
 * レイアウト
----------------------------------------------------------------------------------------------------*/
body > *{
	width:1200px;
	margin:0 auto;
}
body > main{
	min-height:500px;
}
#mnav:before,
#cr:before{
	content:'';
	display:block;
	position:absolute;
	left:0;
	right:0;
	z-index:-1;
	margin-top:-20px;
	background:#ededed;
}
#mnav:before{ height:400px; }
#cr:before{ height:140px; }

/**
 * Gナビ
----------------------------------------------------------------------------------------------------*/
#gnav{
	background:url("./../image/gnav_bg.png") scroll repeat center center;
}
#gnav > ul > li > a{
	display:block;
	float:left;
	width:16.6665%;
	height:40px;
	padding-top:50px;
	line-height:40px;
	text-align:center;
	color:#fff;
	text-indent:-2000px;
	overflow:hidden;
}
	#gnav > ul > li[name="index"] > a{ background:url("./../image/gnav_index.png") scroll no-repeat center center; }
	#gnav > ul > li[name="index"] > a.hover,
	#gnav > ul > li[name="index"].active > a{ background:url("./../image/gnav_index_ov.png") scroll no-repeat center center; }
	#gnav > ul > li[name="concept"] > a{ background:url("./../image/gnav_concept.png") scroll no-repeat center center; }
	#gnav > ul > li[name="concept"] > a.hover,
	#gnav > ul > li[name="concept"].active > a{ background:url("./../image/gnav_concept_ov.png") scroll no-repeat center center; }
	#gnav > ul > li[name="process"] > a{ background:url("./../image/gnav_process.png") scroll no-repeat center center; }
	#gnav > ul > li[name="process"] > a.hover,
	#gnav > ul > li[name="process"].active > a{ background:url("./../image/gnav_process_ov.png") scroll no-repeat center center; }
	#gnav > ul > li[name="works"] > a{ background:url("./../image/gnav_works.png") scroll no-repeat center center; }
	#gnav > ul > li[name="works"] > a.hover,
	#gnav > ul > li[name="works"].active > a{ background:url("./../image/gnav_works_ov.png") scroll no-repeat center center; }
	#gnav > ul > li[name="wb"] > a{ background:url("./../image/gnav_wb.png") scroll no-repeat center center; }
	#gnav > ul > li[name="wb"] > a.hover,
	#gnav > ul > li[name="wb"].active > a{ background:url("./../image/gnav_wb_ov.png") scroll no-repeat center center; }
	#gnav > ul > li[name="aboutus"] > a{ background:url("./../image/gnav_aboutus.png") scroll no-repeat center center; }
	#gnav > ul > li[name="aboutus"] > a.hover,
	#gnav > ul > li[name="aboutus"].active > a{ background:url("./../image/gnav_aboutus_ov.png") scroll no-repeat center center; }

/**
 * Sナビ
----------------------------------------------------------------------------------------------------*/
#snav{
	position:fixed;
	top:10px;
	right:0;
	z-index:1000;
}
#snav > ul > li > a{
	display:block;
	width:40px;
	height:150px;
	text-indent:-2000px;
	overflow:hidden;
}
	#snav > ul > li[name="contact"] > a{ background:url("./../image/snav_contact.png") scroll no-repeat left top; }
	#snav > ul > li[name="facebook"] > a{ background:url("./../image/snav_facebook.png") scroll no-repeat left top; }
	#snav > ul > li[name="simulation"] > a{ background:url("./../image/snav_simulation.png") scroll no-repeat left top; }
#snav > ul > li > a.hover{ background-position:right top;}

#home, #menu{
	display:none;
}

/**
 * Mナビ
----------------------------------------------------------------------------------------------------*/
#mnav{
	padding:20px;
	background:#ededed;
}
#mnav > section{
	float:left;
	width:50%;
}
#mnav > section > h1{
	font-size:18px;
	line-height:24px;
	font-weight:bold;
	border-bottom:3px solid #824600;
	padding:0 10px 10px 10px;
	margin-bottom:10px;
}
#mnav > section:first-child > ul{
	float:left;
	width:50%;
}
#mnav > section > ul > li > a{
	display:block;
	line-height:32px;
	padding:0 10px;
}

/**
 * 電話番号
----------------------------------------------------------------------------------------------------*/
#tel > a{
	display:block;
	margin-bottom:20px;
	cursor:default;
}
#tel > a > img{
	margin:0 auto;
	-width:90%;
}

/**
 * 著作権表記
----------------------------------------------------------------------------------------------------*/
#cr{
	background:#ededed;
	text-align:center;
	padding:10px 10px 100px;
}

/**
 * トップへ戻るボタン
----------------------------------------------------------------------------------------------------*/
#totop{
	position:fixed;
	right:10px;
	bottom:30px;
	margin:0;
	padding:0;
	background:#bea078 url("./../image/ui_totop.png") scroll no-repeat center center;
	border-radius:8px;
	border:none;
	width:50px;
	height:50px;
}
#totop.hover{
	opacity:.8
}

/**
 * パネルレイアウト
----------------------------------------------------------------------------------------------------*/
/* 基本デザイン */
#index #cont{
	margin:30px -15px 0 -15px;
}
.panel{
	margin-bottom:30px;
	float:left;
}
.panel > div{
	height:100%;
	margin:0 15px;
	border-radius:10px;
	border:1px solid #824600;
	overflow:hidden;
}
.panel > div > a{
	display:block;
	height:100%;
}
.panel > div > a.hover{
	background:rgba(0,0,0,.2);
}
.panel > div > a.hover > img:not(.tit){
	opacity:.8;
}

/* オプションデザイン */
.unit1{ width: 33.33%; }
.unit2{ width: 66.66%; }
.unit3{ width:100.00%; }
.panel > div > a{ position:relative; }
.panel .tit{ position:absolute; }
.panel .tit{ top:5px; left:5px; }
.rtit > div > a > img{ right:5px; left:auto;  }
.btit > div > a > img{ bottom:5px; top:auto; }
.fi{ width:100%; }
.panel .tit{ width:200px; }

/* 縦幅 */
#panel_cmyt					{ height: 440px; }
#panel_logo					{ height: 440px;  }
#panel_mainvis				{ height: auto; }
#panel_greetings			{ height: 719px; }
#panel_information			{ height: 225px; }
#panel_blog					{ height: 225px; }
#panel_concept				{ height: 210px; }
#panel_pv					{ height: auto; }
#panel_process				{ height: 446px; }
#panel_idea					{ height: 224px; }
#panel_wb					{ height: 224px; }
#panel_works				{ height: 380px; }
#panel_access				{ height: 175px; }
#panel_contact				{ height: 175px; }
#panel_facebook				{ height: 225px; }
#panel_cm					{ height: 225px; }

/* 背景 */
#panel_logo > div			{ }
#panel_mainvis > div		{ }
#panel_greetings > div		{ background:url("./../image/panel_bg_greetings.png") scroll no-repeat center center / cover; }
#panel_information > div	{ background:url("./../image/panel_bg_information.png") scroll no-repeat center center / cover; }
#panel_blog > div			{ background:url("./../image/panel_bg_blog.png") scroll no-repeat center center / cover; }
#panel_concept > div		{ background:url("./../image/panel_bg_concept.png") scroll no-repeat right bottom / cover; }
#panel_pv > div				{ }
#panel_process > div		{ background:#f2e6cf url("./../image/panel_bg_process.png") scroll no-repeat left bottom / cover; }
#panel_idea > div			{ background:url("./../image/panel_bg_idea.png") scroll no-repeat left bottom / cover; }
#panel_wb > div				{ background:#f5f5f5; }
#panel_works > div			{ background:url("./../image/panel_bg_works.png") scroll no-repeat center bottom / cover; }
#panel_access > div			{ background:#fff url("./../image/panel_bg_access.png") scroll no-repeat right bottom / 75%; }
#panel_contact > div		{ background:#fff url("./../image/panel_bg_contact.png") scroll no-repeat right bottom / 90% }
#panel_facebook > div		{ background:#3278b4 url("./../image/panel_bg_facebook.png") scroll no-repeat left bottom / 100%; }
#panel_cm > div				{ background:url("./../image/panel_bg_cm.png") scroll no-repeat center center / cover; }

/**
 * パネルデザイン
----------------------------------------------------------------------------------------------------*/
/* ロゴ */
#panel_logo{ overflow:hidden; }
/* #panel_logo > div{ width:86%; } */

/* 挨拶 */
#panel_greetings > div{
	color:#fff;
	position:relative;
}
#panel_greetings > div > h1{
	margin:30px;
	letter-spacing:0;
	font-size:18px;
	line-height:28px;
	border-top:2px solid #fff;
	border-bottom:2px solid #fff;
	padding:20px 0;
	margin-bottom:20px;
}
#panel_greetings > div > p{
	margin:0 30px 30px 30px;
}
#panel_greetings > div > img{
	position:absolute;
	right:20px;
	bottom:20px;
}

/* ロゴ */
#panel_logo > div{
	border:none;
}

/* Facebook */
#panel_facebook > div{
	border-color:#3278b4;
}

/**
 * 記事
----------------------------------------------------------------------------------------------------*/
.format_standard #cont{
	background:url("./../image/bg_contact.png") scroll repeat left top;
	padding:50px 0;
}
body#idea.format_standard #cont{ background:#faf5f0; }
.format_standard #cont > h1{
	background:#f2e6cf url("./../image/bg_title.png") scroll no-repeat right bottom;
	padding:30px 20px 10px;
	font-size:36px;
	line-height:70px;
	margin-bottom:20px;
}
.format_standard #cont > h1 > span{
	font-size:20px;
	margin-left:10px;
}
.format_standard #cont > .layout > section{
	float:left;
	width:50%;
}
.format_standard #cont > .layout > section > div{ margin:20px; }
.format_standard #cont > .layout > section > div > p{
	color:#000;
	margin-bottom:20px;
}
.format_standard #cont > section{ margin:20px 20px 40px; }
.format_standard #cont > section.layout > div{
	float:left;
	width:70%;
}
.format_standard #cont > section.layout > ul{
	float:right;
	margin-left:3%;
	width:27%;
}
.format_standard #cont > section > ul > li > img{
	width:100%;
	margin-bottom:20px;
}
.format_standard h1.tit{
	font-size:20px;
	line-height:40px;
	margin-bottom:20px;
	margin-top:20px;
	border-bottom:3px dotted #824600;
}
.format_standard #cont > section > div >p{
	margin:10px 0;
	color:#000;
}
.format_standard #cont > section > div > ul.layout > li{ float:left; width:49%; }
.format_standard #cont > section > div > ul.layout > li:first-child{ margin-right:2%; }
.format_standard #cont > section > div > ul.layout > li > img{ width:100%; }

/**
 * スライダー
----------------------------------------------------------------------------------------------------*/
.format_slider > main{
	position:absolute;
	bottom:0;
	left:0;
	right:0;
	width:auto;
	height:780px;
	overflow:hidden;
}
.format_slider #cont > h1{
	margin:30px 50px;
	font-size:20px;
	color:#555;
	border-bottom:1px solid #ccc;
	padding:0 0 10px;
}
#slideboard{
	position:relative;
}
#slider{
	overflow-y:hidden;
	overflow-x:scroll;
	-webkit-overflow-scrolling: touch;
	background:#fff;
}
#slider > ul{
	height:550px;
	padding:0 50px;
	overflow:hidden;
}
#slider > ul > li{ float:left; }
#slider > ul > li > a.hover{ opacity:.8; }
#slider > ul > li.manager{
	position:absolute;
	background:rgba(0,0,0,.5);
	display:none;
}
#slider > [name]{
	position:absolute;
	height:10px;
	z-index:100;
}
#slider > [name="top"]{
	top:0;
	background:url("./../image/ui_slide_border_top.png") scroll repeat-x center center;
}
#slider > [name="bottom"]{
	margin-top:-10px;
	top:550px;
	background:url("./../image/ui_slide_border_bottom.png") scroll repeat-x center center;
}
				body#concept #slider > ul{ width: 4480px; }
		#slider > [name]{ width: 4480px; }
				body#process #slider > ul{ width: 6080px; }
		#slider > [name]{ width: 6080px; }
				body#wb #slider > ul{ width: 8960px; }
		#slider > [name]{ width: 8960px; }
										#controller{ margin:10px 50px 0 10px; }
#controller > [name]{
	width:60px;
	height:60px;
	background:#000;
	float:right;
	margin-left:4px;
	touch-callout:none;
	user-select:none;
	-webkit-touch-callout:none;
	-webkit-user-select:none;
	-moz-touch-callout:none;
	-moz-user-select:none;
}
	#controller > [name="tostart"]{ background:url("./../image/ui_slide_tostart.png") scroll no-repeat left top; }
	#controller > [name="toend"]{ background:url("./../image/ui_slide_toend.png") scroll no-repeat left top; }
	#controller > [name="next"]{ background:url("./../image/ui_slide_next.png") scroll no-repeat left top; }
	#controller > [name="prev"]{ background:url("./../image/ui_slide_prev.png") scroll no-repeat left top; }
#controller > [name].hover{ background-position:left bottom; }
#tohome{
	text-align:right;
}
#tohome > a{
	margin:0 50px 10px 10px;
	line-height:30px;
	color:#555;
}
#tohome > a.hover{
	color:#ffb400;
}

/**
 * 施工事例
----------------------------------------------------------------------------------------------------*/
.format_gallery #cont > h1{
	margin:30px 0;
	font-size:20px;
	color:#555;
	border-bottom:1px solid #ccc;
	padding:0 0 10px;
}
.format_gallery #cont > .layout{
	background:#c3d2b4;
	position:relative;
}
#worksviewer > div,
#worksmore > h1,
#worksother > h1{
	font-size:40px;
	line-height:40px;
	font-family:"Wire One";
}
#worksviewer{
	padding:20px;
	color:#000;
	letter-spacing:0;
	min-height:800px;
	margin-left:400px;
}
#worksviewer > h1{
	font-size:30px;
	line-height:40px;
	margin-bottom:10px;
}
#worksviewer > p{
	font-size:16px;
	line-height:30px;
	min-height:80px;
}
#worksviewer > ul > li{
	border:20px solid #fff;
}
#worksviewer > ul > li > img{ width:100%; }
#worksviewer > ul > li > img.loading:before{
	height:100px;
}
#worksviewer > ul > li:not(.active){
	display:none;
}
#worksviewer > div{
	display:block;
	margin-top:40px;
	float:right;
	padding-left:50px;
	background:url("./../image/ui_logo.png") scroll no-repeat left 0;
	line-height:50px;
}
#worksmore{
	background:#dee6d6;
	position:absolute;
	width:400px;
	min-height:840px;
	top:0;
}
#worksmore > h1{
	color:#000;
	height:70px;
	padding:50px 10px 20px;
	text-indent:40px;
	background:url("./../image/ui_icon_camera.png") scroll no-repeat 10px center;
}
#worksmore > ul > li{
	width:50%;
	float:Left;
}
#worksmore > ul > li > a{
	display:block;
	border:5px solid #fff;
	height:129px;
	margin:10px;
	text-indent:-1000px;
	overflow:hidden;
}
#worksmore > ul > li > a:hover{
	opacity:.8;
}
#worksother{
	position:fixed;
	bottom:-162px;
	left:0;
	right:0;
	height:212px;
	width:100%;
	overflow-y:hidden;
	overflow-x:scroll;
	-webkit-overflow-scrolling: touch;
}
#worksother > h1{
	position:fixed;
	left:50px;
	line-height:50px;
	color:#fff;
	margin-bottom:162px;
	bottom:-162px;
	z-index:100;
}
#worksui{
	position:fixed;
	margin-bottom:162px;
	bottom:-162px;
	background:rgba(0,0,0,.8);
	height:50px;
	width:100%;
}
#worksui > li:not([name="show"]){ opacity:0; }
#worksother:not(.active) > #worksui > li:not([name="show"]){ cursor:default; }
#worksui > [name]{
	position:absolute;
	top:0;
	width:26px;
	height:26px;
	margin:12px;
	z-index:100;
	cursor:pointer;
}
#worksui > [name="show"]{ left:0; background: url("./../image/ui_works_top.png") scroll no-repeat center top; }
#worksother.active > #worksui > [name="show"]{ left:0; background: url("./../image/ui_works_bottom.png") scroll no-repeat center top; }
#worksui > [name="tostart"]{ left:200px; background: url("./../image/ui_works_tostart.png") scroll no-repeat center top; }
#worksui > [name="prev"]{ left:240px; background: url("./../image/ui_works_prev.png") scroll no-repeat center top; }
#worksui > [name="next"]{ left:280px; background: url("./../image/ui_works_next.png") scroll no-repeat center top; }
#worksui > [name="toend"]{ left:320px; background: url("./../image/ui_works_toend.png") scroll no-repeat center top; }
#worksui > [name].hover{ background-position:center bottom; }
#worksotherlist{
		width:1920px;
	position:absolute;
	top:50px;
	padding:5px 47px 5px 5px;
	background:rgba(0,0,0,.8);
}
#worksotherlist > li{
	float:left;
	width:172px;
	margin:0 10px;
}
#worksotherlist > li > a{
	display:block;
	height:129px;
	border:5px solid #fff;
	text-indent:-1000px;
	overflow:hidden;
}
#worksotherlist > li > a:hover{
	opacity:.8;
}
	.works_000_thumb000 > a{ background:url('./../image/works/works_000_thumb000.jpg') scroll no-repeat center center / cover; }
	.works_000_thumb001 > a{ background:url('./../image/works/works_000_thumb001.jpg') scroll no-repeat center center / cover; }
	.works_000_thumb002 > a{ background:url('./../image/works/works_000_thumb002.jpg') scroll no-repeat center center / cover; }
	.works_000_thumb003 > a{ background:url('./../image/works/works_000_thumb003.jpg') scroll no-repeat center center / cover; }
	.works_000_thumb004 > a{ background:url('./../image/works/works_000_thumb004.jpg') scroll no-repeat center center / cover; }
	.works_000_thumb005 > a{ background:url('./../image/works/works_000_thumb005.jpg') scroll no-repeat center center / cover; }
	.works_000_thumb006 > a{ background:url('./../image/works/works_000_thumb006.jpg') scroll no-repeat center center / cover; }
	.works_000_thumb007 > a{ background:url('./../image/works/works_000_thumb007.jpg') scroll no-repeat center center / cover; }
	.works_001_thumb000 > a{ background:url('./../image/works/works_001_thumb000.jpg') scroll no-repeat center center / cover; }
	.works_001_thumb001 > a{ background:url('./../image/works/works_001_thumb001.jpg') scroll no-repeat center center / cover; }
	.works_001_thumb002 > a{ background:url('./../image/works/works_001_thumb002.jpg') scroll no-repeat center center / cover; }
	.works_001_thumb003 > a{ background:url('./../image/works/works_001_thumb003.jpg') scroll no-repeat center center / cover; }
	.works_001_thumb004 > a{ background:url('./../image/works/works_001_thumb004.jpg') scroll no-repeat center center / cover; }
	.works_001_thumb005 > a{ background:url('./../image/works/works_001_thumb005.jpg') scroll no-repeat center center / cover; }
	.works_001_thumb006 > a{ background:url('./../image/works/works_001_thumb006.jpg') scroll no-repeat center center / cover; }
	.works_001_thumb007 > a{ background:url('./../image/works/works_001_thumb007.jpg') scroll no-repeat center center / cover; }
	.works_002_thumb000 > a{ background:url('./../image/works/works_002_thumb000.jpg') scroll no-repeat center center / cover; }
	.works_002_thumb001 > a{ background:url('./../image/works/works_002_thumb001.jpg') scroll no-repeat center center / cover; }
	.works_002_thumb002 > a{ background:url('./../image/works/works_002_thumb002.jpg') scroll no-repeat center center / cover; }
	.works_002_thumb003 > a{ background:url('./../image/works/works_002_thumb003.jpg') scroll no-repeat center center / cover; }
	.works_002_thumb004 > a{ background:url('./../image/works/works_002_thumb004.jpg') scroll no-repeat center center / cover; }
	.works_002_thumb005 > a{ background:url('./../image/works/works_002_thumb005.jpg') scroll no-repeat center center / cover; }
	.works_002_thumb006 > a{ background:url('./../image/works/works_002_thumb006.jpg') scroll no-repeat center center / cover; }
	.works_002_thumb007 > a{ background:url('./../image/works/works_002_thumb007.jpg') scroll no-repeat center center / cover; }
	.works_003_thumb000 > a{ background:url('./../image/works/works_003_thumb000.jpg') scroll no-repeat center center / cover; }
	.works_003_thumb001 > a{ background:url('./../image/works/works_003_thumb001.jpg') scroll no-repeat center center / cover; }
	.works_003_thumb002 > a{ background:url('./../image/works/works_003_thumb002.jpg') scroll no-repeat center center / cover; }
	.works_003_thumb003 > a{ background:url('./../image/works/works_003_thumb003.jpg') scroll no-repeat center center / cover; }
	.works_003_thumb004 > a{ background:url('./../image/works/works_003_thumb004.jpg') scroll no-repeat center center / cover; }
	.works_003_thumb005 > a{ background:url('./../image/works/works_003_thumb005.jpg') scroll no-repeat center center / cover; }
	.works_003_thumb006 > a{ background:url('./../image/works/works_003_thumb006.jpg') scroll no-repeat center center / cover; }
	.works_003_thumb007 > a{ background:url('./../image/works/works_003_thumb007.jpg') scroll no-repeat center center / cover; }
	.works_004_thumb000 > a{ background:url('./../image/works/works_004_thumb000.jpg') scroll no-repeat center center / cover; }
	.works_004_thumb001 > a{ background:url('./../image/works/works_004_thumb001.jpg') scroll no-repeat center center / cover; }
	.works_004_thumb002 > a{ background:url('./../image/works/works_004_thumb002.jpg') scroll no-repeat center center / cover; }
	.works_004_thumb003 > a{ background:url('./../image/works/works_004_thumb003.jpg') scroll no-repeat center center / cover; }
	.works_004_thumb004 > a{ background:url('./../image/works/works_004_thumb004.jpg') scroll no-repeat center center / cover; }
	.works_004_thumb005 > a{ background:url('./../image/works/works_004_thumb005.jpg') scroll no-repeat center center / cover; }
	.works_004_thumb006 > a{ background:url('./../image/works/works_004_thumb006.jpg') scroll no-repeat center center / cover; }
	.works_004_thumb007 > a{ background:url('./../image/works/works_004_thumb007.jpg') scroll no-repeat center center / cover; }
	.works_005_thumb000 > a{ background:url('./../image/works/works_005_thumb000.jpg') scroll no-repeat center center / cover; }
	.works_005_thumb001 > a{ background:url('./../image/works/works_005_thumb001.jpg') scroll no-repeat center center / cover; }
	.works_005_thumb002 > a{ background:url('./../image/works/works_005_thumb002.jpg') scroll no-repeat center center / cover; }
	.works_005_thumb003 > a{ background:url('./../image/works/works_005_thumb003.jpg') scroll no-repeat center center / cover; }
	.works_005_thumb004 > a{ background:url('./../image/works/works_005_thumb004.jpg') scroll no-repeat center center / cover; }
	.works_005_thumb005 > a{ background:url('./../image/works/works_005_thumb005.jpg') scroll no-repeat center center / cover; }
	.works_005_thumb006 > a{ background:url('./../image/works/works_005_thumb006.jpg') scroll no-repeat center center / cover; }
	.works_005_thumb007 > a{ background:url('./../image/works/works_005_thumb007.jpg') scroll no-repeat center center / cover; }
	.works_006_thumb000 > a{ background:url('./../image/works/works_006_thumb000.jpg') scroll no-repeat center center / cover; }
	.works_006_thumb001 > a{ background:url('./../image/works/works_006_thumb001.jpg') scroll no-repeat center center / cover; }
	.works_006_thumb002 > a{ background:url('./../image/works/works_006_thumb002.jpg') scroll no-repeat center center / cover; }
	.works_006_thumb003 > a{ background:url('./../image/works/works_006_thumb003.jpg') scroll no-repeat center center / cover; }
	.works_006_thumb004 > a{ background:url('./../image/works/works_006_thumb004.jpg') scroll no-repeat center center / cover; }
	.works_006_thumb005 > a{ background:url('./../image/works/works_006_thumb005.jpg') scroll no-repeat center center / cover; }
	.works_006_thumb006 > a{ background:url('./../image/works/works_006_thumb006.jpg') scroll no-repeat center center / cover; }
	.works_006_thumb007 > a{ background:url('./../image/works/works_006_thumb007.jpg') scroll no-repeat center center / cover; }
	.works_007_thumb000 > a{ background:url('./../image/works/works_007_thumb000.jpg') scroll no-repeat center center / cover; }
	.works_007_thumb001 > a{ background:url('./../image/works/works_007_thumb001.jpg') scroll no-repeat center center / cover; }
	.works_007_thumb002 > a{ background:url('./../image/works/works_007_thumb002.jpg') scroll no-repeat center center / cover; }
	.works_007_thumb003 > a{ background:url('./../image/works/works_007_thumb003.jpg') scroll no-repeat center center / cover; }
	.works_007_thumb004 > a{ background:url('./../image/works/works_007_thumb004.jpg') scroll no-repeat center center / cover; }
	.works_007_thumb005 > a{ background:url('./../image/works/works_007_thumb005.jpg') scroll no-repeat center center / cover; }
	.works_007_thumb006 > a{ background:url('./../image/works/works_007_thumb006.jpg') scroll no-repeat center center / cover; }
	.works_007_thumb007 > a{ background:url('./../image/works/works_007_thumb007.jpg') scroll no-repeat center center / cover; }
	.works_008_thumb000 > a{ background:url('./../image/works/works_008_thumb000.jpg') scroll no-repeat center center / cover; }
	.works_008_thumb001 > a{ background:url('./../image/works/works_008_thumb001.jpg') scroll no-repeat center center / cover; }
	.works_008_thumb002 > a{ background:url('./../image/works/works_008_thumb002.jpg') scroll no-repeat center center / cover; }
	.works_008_thumb003 > a{ background:url('./../image/works/works_008_thumb003.jpg') scroll no-repeat center center / cover; }
	.works_008_thumb004 > a{ background:url('./../image/works/works_008_thumb004.jpg') scroll no-repeat center center / cover; }
	.works_008_thumb005 > a{ background:url('./../image/works/works_008_thumb005.jpg') scroll no-repeat center center / cover; }
	.works_008_thumb006 > a{ background:url('./../image/works/works_008_thumb006.jpg') scroll no-repeat center center / cover; }
	.works_008_thumb007 > a{ background:url('./../image/works/works_008_thumb007.jpg') scroll no-repeat center center / cover; }
	.works_009_thumb000 > a{ background:url('./../image/works/works_009_thumb000.jpg') scroll no-repeat center center / cover; }
	.works_009_thumb001 > a{ background:url('./../image/works/works_009_thumb001.jpg') scroll no-repeat center center / cover; }
	.works_009_thumb002 > a{ background:url('./../image/works/works_009_thumb002.jpg') scroll no-repeat center center / cover; }
	.works_009_thumb003 > a{ background:url('./../image/works/works_009_thumb003.jpg') scroll no-repeat center center / cover; }
	.works_009_thumb004 > a{ background:url('./../image/works/works_009_thumb004.jpg') scroll no-repeat center center / cover; }
	.works_009_thumb005 > a{ background:url('./../image/works/works_009_thumb005.jpg') scroll no-repeat center center / cover; }
	.works_009_thumb006 > a{ background:url('./../image/works/works_009_thumb006.jpg') scroll no-repeat center center / cover; }
	.works_009_thumb007 > a{ background:url('./../image/works/works_009_thumb007.jpg') scroll no-repeat center center / cover; }

/**
 * フォーム
----------------------------------------------------------------------------------------------------*/
.form .r,
.form .r > input{ text-align:right; }
.form > table p{
	background:rgba(0,150,100,.2);
	font-size:11px;
	line-height:20px;
	padding:0 4px;
	margin:0 4px -10px;
	border-radius:6px;
}
.req{
	color:red;
	font-size:70%;
	margin-left:1em;
}
.form .label{
	border:1px solid #888;
	padding:4px;
	background:#fff;
	display:block;
}
.form .label:not(:last-child){
	margin-bottom:4px;
}
input[type="text"],
input[type="email"],
textarea{
	border:none;
	width:auto;
	font-weight:bold;
}
textarea{
	height:6em;
	width:100%;
}
.form dialog{
	display:block;
	position:fixed;
	background:rgba(255,255,255,.9);
	color:#000;
	top:50%;
	left:50%;
	width:400px;
	height:300px;
	margin-left:-200px;
	margin-top:-150px;
	border-radius:10px;
	border:5px solid #000;
}
.form dialog > header{
	background:#000;
	line-height:40px;
	text-align:center;
	color:#fff;
}
.form dialog > article,
.form dialog > footer{ padding:20px; }
.form dialog.success{ border:5px solid cornflowerblue; }
.form dialog.success > header{ background:cornflowerblue; }
.form dialog.error{ border:5px solid palevioletred; }
.form dialog.error > header{ background:palevioletred; }
.form input[type="submit"]{
	background:url("./../image/ui_submit.png") scroll no-repeat center center;
	padding:0;
	width:180px;
	border:none;
	color:#fff;
	height:40px;
	line-height:40px;
	text-indent:-1000px;
	-webkit-appearance: none;
}
.form input[type="submit"].hover{
	opacity:.8;
}
.form label .error{
	color:red;
}

/**
 * インページナビ
----------------------------------------------------------------------------------------------------*/
#inav{ display:none; }

/**
 * シミュレーターフォーム
----------------------------------------------------------------------------------------------------*/
.simform{ color:black; }
.simform input[type="text"]{
	ime-mode:disabled;
}
.simform .box{
	border:1px solid #888;
	background:rgba(0,0,0,.1);
	padding:10px;
	margin:10px 0;
}
.simform .tit{
	font-size:20px;
	line-height:40px;
}
.simform label > input[type="text"]{
	font-size:30px;
	line-height:50px;
}
.simform > input[type="submit"]{ background:url("./../image/ui_calc.png") scroll no-repeat center center !important; }
.simform dialog input[type="submit"]{ background:url("./../image/ui_close.png") scroll no-repeat center center !important; }
.simform dialog{
	padding:0;
	width:auto;
	margin:0;
	top:10%;
	left:10%;
	right:10%;
	bottom:10%;
	width:80%;
	height:80%;
}
.simform dialog table{
	width:auto;
	margin:0 auto;
}
.simform dialog > article{
	overflow-y:scroll;
	-webkit-overflow-scrolling: touch;
	position:absolute;
	top:40px;
	bottom:60px;
	left:0;
	right:0;
}
.simform dialog > footer{
	padding:0;
	position:absolute;
	bottom:0;
	width:100%;
	height:60px;
}
.simform dialog > footer > input{
	margin:10px auto;
}
.simans{
	border:1px solid #888;
	padding:20px;
	margin-bottom:20px;
}
.simans > div{
	height:40px;
	font-size:30px;
	padding:0 10px;
	line-height:40px;
	margin-top:20px;
	float:left;
}
.whitebox{
	float:left;
}
.whitebox > .tit{
	font-size:13px;
	line-height:20px;
}
.whitebox > .cont{
	font-size:30px;
	padding:0 10px;
	padding-top:4px;
	line-height:28px;
	border:1px solid #888;
	background:#fff;
	font-weight:bold;
}
.whitebox > .cont > span{
	font-size:14px;
	margin-left:4px;
}

/**
 * タブ
----------------------------------------------------------------------------------------------------*/
.tab > *{ background:rgba(255,255,255,.5); }
.tab > ul > li{
	float:left;
	width:50%;
	text-align:center;
	cursor:pointer;
}
.tab > ul > li > div{
	border-left:1px solid #888;
	border-top:1px solid #888;
	padding:10px;
}
.tab > ul > li:last-child > div{ border-right:1px solid #888; }
.tab > ul > li:not(.active) > div{
	border-bottom:1px solid #888;
	background:rgba(0,0,0,.1);
}
.tab > section{
	border-bottom:1px solid #888;
	border-left:1px solid #888;
	border-right:1px solid #888;
	padding:10px;
}
.tab > section:not(.active){ display:none; }

/**
 * レイアウト：スマホ
----------------------------------------------------------------------------------------------------*/
@media screen and (max-height: 540px){
	#snav{ position:absolute; }
	#totop{ right:50px; }
}

@media screen and (max-height: 880px), screen and (max-width: 1050px) and (max-height: 1000px){
	.format_slider > main{
		bottom:auto;
	}
}
@media screen and (max-width: 1300px){
	body > *{ width:1000px; }
	#index #cont{ margin: 10px -10px 0 -10px; }
	.panel{ margin-bottom:20px; }
	.panel > div{ margin:0 10px; }
	.panel .tit{ width:160px; }
	#gnav > ul > li > a{ background-size:95% !important; height:20px; }
	#panel_cmyt					{ height:360px; }
	#panel_logo					{ height:360px; }
	#panel_mainvis				{ }
	#panel_greetings			{ height:633px; }
	#panel_information			{ height:191.5px; }
	#panel_blog					{ height:191.5px; }
	#panel_cm					{ height:191.5px; }
	#panel_concept				{ }
	#panel_pv					{ }
	#panel_process				{ height:373px; }
	#panel_idea					{ height:186px; }
	#panel_wb					{ height:186px; }
	#panel_works				{ height:300px; }
	#panel_access				{ height:150px; }
	#panel_contact				{ height:150px; }
	#panel_facebook				{ height:191.5px; }
	#worksviewer{
		margin-left:199px;
		min-height:1320px;
	}
	#worksmore{
		width:199px;
		min-height:1360px;
	}
	#worksmore > ul > li{
		float:none;
		width:100%;
	}
	#feedbox{
		max-width:98%;
		clear:both;
		margin:0 auto;
		padding:20px 0 40px;
		overflow:hidden;
	}
}
@media screen and (max-width: 1050px){
	body > *{
		width:auto;
		margin:0 15px;
	}
	.format_slider > main{ margin:0; }
	#panel_cmyt					{ width:100%; height: auto; }
	#panel_logo					{ display:none; }
	#panel_mainvis				{ }
	#panel_greetings			{ width:100%; height: 350px; }
	#panel_concept				{ width:100%;}
	#panel_pv					{ width:100%; height:auto; }
	#panel_process				{ width:50%; height: 200px; }
	#panel_idea					{ width:50%; height:200px; }
	#panel_wb					{ width:100%; height: auto; }
	#panel_works				{ height:240px; }
	#panel_access				{ height:120px; }
	#panel_contact				{ height:120px; }
	#panel_information			{ width:50%; height:250px; }
	#panel_blog					{ width:50%; height:250px; }
	#panel_cm					{ width:50%; height:250px; }
	#panel_facebook				{ width:50%; height:250px; }
	#panel_process > div		{ background-size:60%; }
	#panel_access > div			{ background-size:70%; }
	#panel_contact > div		{ background-size:70%; }
	#panel_facebook > div		{ background-size:70%; }
	#panel_blog > div			{ background-position:-10px center; }
	.format_slider #cont > h1{
		margin:30px 60px 30px 15px;
	}
	.format_standard #cont > h1{
		padding:20px 10px;
		font-size:24px;
		line-height:30px;
		margin-bottom:20px;
	}
	.format_standard #cont > h1 > span{
		display:block;
		font-size:14px;
		line-height:24px;
		margin:0;
	}
}

@media screen and (max-width: 960px){
	#gnav > ul > li > a{ width:33.333%; height:50px; }
	#mnav > section:first-child > ul{
		float:none;
		width:auto;
	}
	#worksviewer{ margin:0; }
	#worksmore{ display:none; }
	#worksviewer > ul > li{ margin-bottom:20px; }
	#worksviewer > ul > li:not(.active) { display:block; }
	#worksviewer > ul > li > img{ width:100%; }
	.format_standard #cont > section.layout > div,
	.format_standard #cont > section.layout > ul{
		float:none;
		width:auto;
		margin:0;
	}
	.format_standard #cont > .layout > section{
		float:none;
		width:auto;
		margin-bottom:40px;
	}
	#inav{
		margin:20px;
		background:#824600;
		display:block;
		padding:20px;
	}
	#inav > ul > li > a{
		display:block;
		color:#fff;
		font-size:18px;
		line-height:30px;
	}
	#inav > ul > li > a:hover{
		color:#ffb400;
	}
	#inav > ul > li > a:before{
		content:'>> ';
		color:#bea078;
	}
}
@media screen and (max-height: 880px), screen and (max-width: 960px){
	.simform dialog{
		top:2%;
		left:2%;
		right:2%;
		bottom:2%;
		width:92%;
		height:92%;
	}
	.format_slider > main{ height:auto; }
	.format_slider #cont > h1{ display:none; }
	.format_slider > main{ bottom:auto; }
	#slider > ul > li > img,
	#slider > ul > li > a > img,
	#slider > ul{ height:390px !important; }
	#slider > [name="bottom"]{ top:390px; }
									body#concept #slider > ul{ width: 3178px; }
			#slider > [name]{ width: 3178px; }
								body#process #slider > ul{ width: 4313px; }
			#slider > [name]{ width: 4313px; }
								body#wb #slider > ul{ width: 6356px; }
			#slider > [name]{ width: 6356px; }
																														}
@media screen and (max-height: 660px), screen and (max-width: 960px){
	#controller, #tohome{ display:none; }
}
@media screen and (max-width: 640px){
	body > *{ margin:0; }
	body > main{ padding:5px; }
	.format_slider > main{ padding:0; }
	.panel > div{ border-radius:4px; }
	#gnav:not(.active){ display:none; }
	#gnav{
		position:absolute;
		top:70px;
		left:0;
		right:0;
		z-index:1000;
		background:rgba(0,0,0,.8);
		box-shadow:0 0 20px rgba(0,0,0,.8);
	}
	#gnav > ul > li > a{
		float:none;
		width:auto;
		height:auto;
		text-align:left;
		padding:16px 20px;
		border-bottom:1px solid rgba(255,255,255,.2);
		background:none !important;
		text-indent:0;
		overflow:visible;
		line-height:24px;
		font-size:18px;
	}
	#gnav > ul > li > a.hover{
		background:rgba(255,255,255,.1) !important;
		box-shadow:0 0 8px rgba(255,255,255,.6);
	}
	#home, #menu{ display:block; }
	#snav{ position:static !important; }
	#snav > ul{ background:url("./../image/gnav_bg.png") scroll repeat center center; }
	#snav > ul > li > a{
		width:20%;
		height:70px;
		float:left;
	}
	#home > a{ background:url("./../image/smp_home.png") scroll no-repeat center center; }
	#menu > a{ background:url("./../image/smp_menu.png") scroll no-repeat center center; }
			#snav > ul > li[name="contact"] > a{ background:url("./../image/smp_contact.png") scroll no-repeat center center; }
			#snav > ul > li[name="facebook"] > a{ background:url("./../image/smp_facebook.png") scroll no-repeat center center; }
			#snav > ul > li[name="simulation"] > a{ background:url("./../image/smp_simulation.png") scroll no-repeat center center; }
		#snav > ul > li > a.hover{ background-position:center center; background-color:rgba(255,0,0,.5); }
	#mnav{ padding:20px 0 0; }
	#mnav > section{
		float:none;
		width:auto;
		padding:10px 0;
	}
	#mnav > section > h1{ margin:0; }
	#mnav li > a{
		border-bottom:1px solid #bea078;
		background:rgba(255,255,255,.9);
	}
	#mnav li > a.hover{ background:rgba(0,0,0,.1); }
	#index #cont{ margin: 3px -3px 0 -3px; }
	.panel{ margin-bottom:6px; }
	.panel > div{ margin:0 3px; }
	.panel .tit{ width:120px; }
	#panel_logo				{ }
	#panel_mainvis			{ }
	#panel_greetings		{ height:460px; }
	#panel_concept			{ height:100px; }
	#panel_pv				{ }
	#panel_process			{ height:100px; }
	#panel_idea				{ height:100px; }
	#panel_wb				{ }
	#panel_works			{ height:140px; }
	#panel_access			{ height:90px; }
	#panel_contact			{ height:90px; }
	#panel_information		{ height:170px; }
	#panel_blog				{ height:170px; }
	#panel_cm				{ height:170px; }
	#panel_facebook			{ height:170px; }
	#panel_mainvis > div{ background:url("./../image/panel_image_mainvis_smp.png") scroll no-repeat center center / contain; border:none; }
	#panel_mainvis > div > img{ opacity:0; }
	#panel_greetings > div > h1{ margin:30px 10px; }
	#panel_greetings > div > p{ margin:20px 10px; }
	#panel_access > div > a > .tit,
	#panel_contact > div > a > .tit{ width:100px; }
	#panel_facebook > div{ background-size:80%; }
	#totop{ right:10px !important; }
	body.smp #totop{ bottom:40px; }
	#worksviewer{ padding:10px; }
	#worksviewer > ul > li{ border:0; }
	#worksviewer > ul > li{ margin-bottom:10px; }
	#worksui > li:not([name="show"]){ display:none; }
	#worksother.active{
		top:0;
		bottom:0;
		height:auto;
		overflow-y:scroll;
		overflow-x:hidden;
		background:rgba(0,0,0,.8);
	}
	#worksother.active h1,
	#worksother.active #worksui{
		position:absolute;
		top:0;
		background:none;
	}
	#worksother.active #worksotherlist{
		top:50px;
		margin:0;
		width:100% !important;
		background:none;
		padding:0;
	}
	#worksother.active #worksotherlist > li{
		width:50%;
		margin:0;
	}
	#worksother.active #worksotherlist > li > a{
		border:none;
		border:2px solid #fff;
	}
	.simform label > input[type="text"]{ max-width:200px; }
	#feedbox{
		max-width:98%;
		clear:both;
		margin:0 auto;
		padding:20px 0 40px;
		overflow:hidden;
	}
	#feedbox ul{
		padding:10px 18px 14px;
		margin:0 auto;
		display:block;
		overflow:hidden;
		border:2px solid #824600;
	}
	#feedbox li:nth-child(9),
	#feedbox li{
		border-bottom:1px dotted #824600;
		width:100%;
		float:left;
		padding:5px 0 5px;
	}
	#feedbox li a{
		display:block;
		width:100%;
	}
	#feedbox li a:after{
		content:">";
		display:block;
		float:right;
		font-size:8px;
	}
	#feedbox li:last-child{
		border:none;
		padding:0;
	}
}
@media screen and (max-width: 480px){
	#panel_information		{ height:100px; }
	#panel_blog				{ height:100px; }
	#panel_cm				{ height:100px; }
	#panel_facebook			{ height:100px; }
}