@charset "utf-8";

/* CSS Document */

/*----------------------------------------------------
 reset
----------------------------------------------------*/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-style: normal;
	font-weight: normal;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

html { overflow-y: scroll; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}
input, textarea, {
margin: 0;
padding: 0;
}

a {
	margin: 0;
	padding: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

ol, ul { list-style: none; }

table {
	border-collapse: collapse;
	border-spacing: 0;
}

caption, th { text-align: left; }

a:focus { outline: none; }

img { vertical-align: middle; }

/*----------------------------------------------------
 common
----------------------------------------------------*/

body {
	font-family: 'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	background: #fff;
	border-top: 5px solid #6c3524;
	font-size: 13px;
	line-height: 2.4;
	letter-spacing: 0;
}

a {
	text-decoration: none;
	color: #000;
}

a:hover { color: #be0600; }

/*----------------------------------------------------
 header
----------------------------------------------------*/

header {
	width: 1000px;
	margin: 0 auto;
	position: relative;
	height: 110px;
}

h1, p.logo, p.tel {
	position: absolute;
	top: 20px;
}

h1 {
	left: 90px;
	width: 485px;
}

p.tel { right: 0; }

/*----------------------------------------------------
 navi
----------------------------------------------------*/

nav#main {
	background: url(../img/navi_bg.png) 0 0 repeat-x;
	height: 58px;
	width: 100%;
}

#main ul {
	width: 1000px;
	margin: 0 auto;
}

#main li {
	display: inline-block;
	font-size: 15px;
	color: #ffeb0e;
	padding: 10px 50px 0 0;
}

#main li:before {
	content: url(../img/navi_line.png);
	position: relative;
	top: 5px;
}

#main li:last-child:after {
	content: url(../img/navi_line.png);
	position: relative;
	top: 5px;
	right: -55px;
}

#main li a {
	color: #fff;
	text-decoration: none;
	display: inline-block;
}

#main li a:hover { color: #ffeb0e; }

#main li img { margin: 0 15px 0 50px; }

/*----------------------------------------------------
 pan
----------------------------------------------------*/




#pan {
	text-align: left;
	width: 1000px;
	margin: 0 auto;
}

#pan a {
	display: inline-block;
	margin-right: 10px;
}

/*----------------------------------------------------
 contents
----------------------------------------------------*/

#wrapper {
	width: 1000px;
	margin: 0px auto 20px;
}

/* transition */


li:hover, a:hover, #item li p,
#tabmenu a:hover img,
input:focus,
textarea:focus,
input[type="submit"]:hover,
input[type="reset"]:hover{
	-webkit-transition: all 0.8s ease 0s;
	-moz-transition: all 0.8s ease 0s;
	-ms-transition: all 0.8s ease 0s;
	-o-transition: all 0.8s ease 0s;
	transition: all 0.8s ease 0s;
}

/* gradient */

/* 茶 */
.title h2, .title_02 h2, footer, .tab li:hover,.tab li.select {
	background: #8c442e; /* Old browsers */
	background: -moz-linear-gradient(top, #8c442e 0%, #6c3524 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #8c442e), color-stop(100%, #6c3524)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #8c442e 0%, #6c3524 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #8c442e 0%, #6c3524 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #8c442e 0%, #6c3524 100%); /* IE10+ */
	background: linear-gradient(to bottom, #8c442e 0%, #6c3524 100%); /* W3C */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8c442e', endColorstr='#6c3524', GradientType=0 ); /* IE6-9 */
}
/* グレー */
.tab li , .btn{
	background: #bdbdbd; /* Old browsers */
	background: -moz-linear-gradient(top, #bdbdbd 0%, #838383 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #bdbdbd), color-stop(100%, #838383)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #bdbdbd 0%, #838383 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #bdbdbd 0%, #838383 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #bdbdbd 0%, #838383 100%); /* IE10+ */
	background: linear-gradient(to bottom, #bdbdbd 0%, #838383 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bdbdbd', endColorstr='#838383', GradientType=0 ); /* IE6-9 */
}

.title {
	width: 100%;
	margin: 20px 0;
}

.title h2, .title_02 h2 {
	color: #fff;
	font-size: 16px;
}

.title h2:before, .title_02 h2:before {
	content: url(../img/title_icon.png);
	margin: 0 10px 0 15px;
}

/* list item */
#item { }

#item li {
	background: url(../img/box_bg.gif) repeat;
	margin: 0 15px 20px 0;
	padding: 10px;
	display: inline-block;
	position: relative;
}

#item li:nth-child(4n) {
	margin-right: 0;
	float: right;
}

#item li:hover { background: #6c3524; }

#item li p {
	position: absolute;
	display: block;
	opacity: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	color: #fff;
}

#item li span {
	width: 200px;
	margin: 25% auto 0;
	text-align: center;
	line-height: 1.4;
	display: block;
}

#item li strong {
	font-weight: bold;
	margin-bottom: 10px;
	display: block;
	font-size: 16px;
}

#item li a { display: block; }

#item li a:hover p {
	display: block;
	left: 0;
	height: 50%;
	padding-bottom: 50px;
	opacity: 0.8;
	background: #6c3524;
}

/*----------------------------------------------------
 2col_box
----------------------------------------------------*/

#item_box {
	margin: 30px auto;

	}

#item_box .left {
	width: 350px;
	margin-right: 20px;
	display: inline-block;
}

img.item_bg {
	width: 330px;
	height: 330px;
	padding: 10px;
	background: url(../img/box_bg.gif) repeat;
}

.title_02 {
	float: right;
	width: 620px;
}

.title_02 h2 { margin-bottom: 20px; }

.text_01 {
	border-bottom: 1px dashed #b6b6b6;
	padding-bottom: 20px;
	margin-bottom: 20px;
	line-height:1.8;
}

.text_01 a {
	display: block;
	text-align: right;
}
/*----------------------------------------------------
 sns
----------------------------------------------------*/

.sns {
	text-align: right;
}

.sns li{
	float:right;
	text-align:right;
}

.sns li:last-child{
	width:100px;
}

/*----------------------------------------------------
 タブ切り替え写真
----------------------------------------------------*/


#tabmenu { width: 100%; }

#tabmenu a {
	display: inline-block;
	margin-right: 9px;
}

#tabmenu a:last-child {
	margin-right: 0;
	float: right;
}

#tabmenu a img {
	height: 73px;
	width: 73px;
	border: 2px solid #c3c3c3;
}

#tabmenu a:hover img {
	border:2px solid #6c6c6c;
	}

#tab_contents {
	width: 350px;
	clear: both;
	margin-bottom: 20px;
}

#tab_contents img {
	width: 330px;
	height:330px;
	padding: 10px;
	background: url(../img/box_bg.gif) repeat;
}

/*----------------------------------------------------
 タブ切り替えテキスト
----------------------------------------------------*/


.tab { overflow: hidden; }

.tab li {
	padding: 10px 25px 10px 20px;
	float: left;
	margin-right: 1px;
	cursor: pointer;
	color:#fff;
}
.tab li.select{
	color:#fff;
}
.tab li:before{
	content:url(../img/navi_off.png);
	margin-right:10px;
}
.content li {
	padding: 40px;
	border:10px solid #703725;

}
.content li p{
		border-bottom: 1px dashed #b6b6b6;
		padding-bottom:5px;
		margin-bottom:10px;
		font-size:18px;
		color:#be0600;
}
.hide { display: none; }

.hide img{
	margin-right:10px;
}
.hide span{
	display:inline-block;
	margin:0 15px 10px 0;
	padding:0 5px;
	background:#dcdcdc;
	width:150px;
	text-align:center;
	border-radius:2px;
}

/*----------------------------------------------------
 会社概要
----------------------------------------------------*/
.title_02 dt,
.box_1col dt{
	display:inline-block;
	margin:0 15px 10px 0;
	background:#dcdcdc;
	width:150px;
	text-align:center;
	border-radius:2px;
	vertical-align:top;
}
.title_02 dd,
.box_1col dd{
	display:inline-block;
	width:440px;
}
.map{
	border:1px solid #dcdcdc;
	padding:1px;
	width:100%;
	height:450px;
	margin:40px auto;
}

/*----------------------------------------------------
 お問い合せ
----------------------------------------------------*/
.box_1col{
	background:#ebebed;
	padding:50px 100px;
	margin:0 auto;
}

.box_1col dt,
input,textarea{
	border-radius:2px;
	margin-bottom:10px;
}
.box_1col dt{
	background:#696969;
	color:#fff;
	width:180px;
}

form span{
	color:#ffeb0e;
	font-size:14px;
}

input,textarea{
	border:1px solid #ccc;
	padding:10px;
	color:#696969;
	font-size:13px;
	cursor:pointer;
}

textarea{
	width:580px;
	height:100px;
	max-width:580px;
	border:none;
	line-height:1.6;
}
input{
	background:#fff;
	width:580px;
	text-align:center;
	border:none;
	text-align:left;
}
input:focus,
textarea:focus{
	background:#FFC;
}


.box_1col div{
	margin:20px auto;
	text-align:center;
}
input[type="submit"],
input[type="reset"]{
	padding:10px;
	width:200px;
	background:#6c3524;
	color:#fff;
	text-align:center;
}
input[type="submit"]:hover,
input[type="reset"]:hover{
	background:#be0600;
}

/*----------------------------------------------------
 pagetop
----------------------------------------------------*/

.pagetop {
	position: fixed;
	right: 20px;
	bottom: 350px;
}

.pagetop a {
	display: block;
	width: 51px;
	height: 51px;
}

.pagetop a:hover img { opacity: 0; }

.pagetop a:hover { background: url(../img/pagetop_on.png) 0 0 no-repeat; }

/*----------------------------------------------------
 footer
----------------------------------------------------*/



footer {
	position: relative;
	width: 100%;
	bottom: 0;
	height: 220px;
	clear:both;
	margin-top:100px;
}

footer ul {
	width: 1000px;
	padding: 15px 0 95px;
	margin: 0 auto;
}

footer ul li {
	margin-right: 30px;
	display: inline-block;
}

footer ul li:before {
	content: url(../img/navi_off.png);
	margin-right: 5px;
}

footer ul li a { color: #fff; }

footer ul li a:hover { color: #ffeb0e; }

footer ul li.icon:before {
	content: url(../img/foot_icon_01.png);
	position: relative;
	top: 5px;
}

footer p {
	width: 1000px;
	margin: 0 auto;
	color: #FFF;
	text-align: right;
}

footer p small { display: block; }




/*----------------------------------------------------
 clearfix
----------------------------------------------------*/

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

.clearfix { min-height: 1px; }

* html .clearfix { height: 1px;/*¥*//*/
	height: auto;
	overflow: hidden;
	/**/ }

#item li:hover { }
