@charset "utf-8";


/******************************
        1. setting
*******************************/

	/*** 1-1. base ***/
html,body {
	height:100%;
}
body {
	background-color: #fff;
	font-size: 14px;
	font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS P Gothic", "Osaka", Verdana, Arial, Helvetica, sans-serif;
    color: #555;
	text-align: center;
}
input, textarea, select, option {
	font-size: 14px;
	font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS P Gothic", "Osaka", Verdana, Arial, Helvetica, sans-serif;
}
.clearfix:after {
	content: "";
	display: block;
	clear: both;
}

	/*** 1-2. link ***/
a {
	color: #00a0e9;
	text-decoration: underline;
}
a:visited {
	color: #00a0e9;
	text-decoration: underline;
}
a:hover {
	color: #0071ba;
}
a:active {
	color: #0071ba;
}
/*a.linkimg:hover {
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
}*/
.fade {
	-webkit-transition: 0.5s ease-in-out;
	-moz-transition: 0.5s ease-in-out;
	-o-transition: 0.5s ease-in-out;
	transition: 0.5s ease-in-out;
}
.fade:hover {
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
}

	/*** 1-2. img ***/
img {
	max-width: 100%;
	height: auto;
	width /***/:auto;
}

	/*** 1-3. list ***/
ol, ul {
	list-style: none;
}

	/*** 1-4. margin ***/
.mb20 {margin-bottom: 20px;}
.mb40 {margin-bottom: 40px;}
.pb30 {padding-bottom: 30px;}
.pb50 {padding-bottom: 50px;}
.pb100 {padding-bottom: 100px;}
.pb200 {padding-bottom: 200px;}
.pb80 {padding-bottom: 80px;}
.ptb50 {
	padding-top: 50px;
	padding-bottom: 50px;
}

	/*** 1-5. text ***/
h1, h2, h3 {
	font-weight: normal;
	letter-spacing: 0.1em;
}
p {
	line-height: 2em;
	letter-spacing: 0.1em;
}

	/*** 1-6. position ***/
.text_r {
	text-align: right;
}
.text_l {
	text-align: left;
}
.text_c {
	text-align: center;
}
.blk_l {
	float: left;
	display: block;
}
.blk_r {
	float: right;
	display: block;
}


/******************************
        2. wrapper 
*******************************/
#wrapper {
	position: relative;
	width: 100%;
	min-height: 100%;
	margin: 0px auto;
	text-align: center;
	padding-bottom: 253px;
}


/******************************
        3. header 
*******************************/

	/*** 3-1. base ***/
#header_box {
	background: #dfded5 url(../images/common/bg_header.jpg) repeat top center;
}
header {
	background: url(../images/common/line_header.png) repeat-x top center;
	text-align: left;
	font-size: 11px;
	padding: 41px 0 18px 0;
}

	/*** 3-2. page ***/
.header_img {
	color: #fff;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: top center;
	background-attachment: fixed;
	text-align: center;
	height: 200px;
	margin-bottom: 60px;
}
.header_img h1 {
	width: 880px;
	margin: 0px auto;
	text-align: left;
	font-size: 33px;
	padding-top: 37px;
}
#header_common {
	background: #444444 url(../images/common/header_common.png) no-repeat top center;
}
#header_aisatsu {
	background: #444444 url(../images/aisatsu/header_aisatsu.png) no-repeat top center;
}
#header_gaiyo {
	background: #444444 url(../images/gaiyo/header_gaiyo.png) no-repeat top center;
}
#header_works {
	background: #444444 url(../images/works/header_works.png) no-repeat top center;
}
#header_flow {
	background: #444444 url(../images/flow/header_flow.png) no-repeat top center;
}
#header_faq {
	background: #444444 url(../images/faq/header_faq.png) no-repeat top center;
}
#header_privacy {
	background: #444444 url(../images/privacy/header_privacy.png) no-repeat top center;
}
#header_contact {
	background: #444444 url(../images/contact/header_contact.png) no-repeat top center;
}


/******************************
        4. nav 
*******************************/
#menu {
	display: block;
	float: left;
	width: 880px;
	height: 30px;
	clear: both;
	padding: 12px 0 32px 0;
}
.p_top #menu {
	padding: 37px 0 32px 0;
}

#menu li {
	display: block;
	float: left;
	width: auto;
	height: 30px;
	text-align: center;
}


/******************************
        5. cnts 
*******************************/

	/*** 5-1. base ***/

/* box */
.cnts_box {
	position: relative;
	width: 880px;
	margin: 0px auto;
	text-align: center;
}
.cnts_box2 {
	position: relative;
	width: 880px;
	margin: 0px auto;
	text-align: left;
}
.box_area, .text_box p, .text_box dl {
	margin: 20px 50px;
}

/* bg */
.bg_orange {
	background: #f1e7da url(../images/common/bg_orange.png) repeat top center;;
}
.bg_blue {
	background: #dae9ef url(../images/common/bg_blue.png) repeat top center;;
}
.bg_beige {
	background: #dae9ef url(../images/common/bg_beige.png) repeat top center;;
}

/* text */
.ttl {
	font-size: 20px;
}


	/*** 5-1. top ***/
/* base */
.btn_more a {
	background: #979797;
	color: #fff;
	width: 100px;
	padding: 10px 10px;
	text-align: center;
	display: block;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	text-decoration: none;
	font-size: 10px;
	letter-spacing: 1px;
	
	-webkit-transition: 0.5s ease-in-out;
	-moz-transition: 0.5s ease-in-out;
	-o-transition: 0.5s ease-in-out;
	transition: 0.5s ease-in-out;
}
.btn_more a:hover {
	background: #666666;
}

/* mainbnr */
#mainbnr {
	width: 880px;
	padding: 50px 0;
}
/* news */
#news {
	float: left;
	display: block;
	width: 505px;
	height: auto;
	text-align: left;
}
#news ul {
	display: block;
	width: 505px;
}
#news ul li {
	line-height: 1.6em;
	padding-left: 10.5em;
	padding-right: 2em;
	position: relative;
}
#news ul li span {
	display: block;
	position: absolute;
	top: 0;
	left: 1em;
}
.scrollarea {
	width: 505px;
	height: 200px;
}
#testimonials .scrollarea {
	height: 300px;
}
.scrollarea .jspContainer {
	overflow: hidden;
	position:relative;
}
.scrollarea .jspPane {
	position: absolute;
}
.scrollarea .jspVerticalBar {
	position: absolute;
	top: 0;
	right: 0;
	width: 10px;
	height: 100%;
}
.scrollarea .jspHorizontalBar {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height:10px;
}
.scrollarea .jspTrack {
	background: #e5e4db;
	position:relative;
}
.scrollarea .jspDrag {
	background: #432e1f;
	position: relative;
	top: 0;
	left: 0;
	cursor: pointer;
}
.scrollarea .jspHorizontalBar .jspTrack, .jspHorizontalBar .jspDrag {
	float: left;
	height: 100%;
}
#information {
	margin-bottom: 30px;
}
#testimonials {
	border: none;
	background: url(../images/index/bg_testimonials.gif) repeat left top;
}
#testimonials ul li {
	padding-bottom: 2em;
}
#testimonials ul li p {
	min-height: 53px;
	height: auto !important;
	height: 53px;
	padding: 20px 20px 10px 90px;
	position: relative;
}
#testimonials ul li .note1 {
	background: #fff url(../images/index/bg_note1.png) no-repeat left top;
}
#testimonials ul li .note2 {
	background: #fff url(../images/index/bg_note2.png) no-repeat left top;
}
#testimonials ul li .note3 {
	background: #fff url(../images/index/bg_note3.png) no-repeat left top;
}
#testimonials ul li p .shop1 {
	position: absolute;
	top: 64px;
	left: 30px;
	width: 55px;
	height: 18px;
	background: url(../images/index/ribbon1.png) no-repeat left top;
}
#testimonials ul li p .shop2 {
	position: absolute;
	top: 64px;
	left: 30px;
	width: 55px;
	height: 18px;
	background: url(../images/index/ribbon2.png) no-repeat left top;
}
#testimonials ul li p .shop1 em {
	background: #ed1e79;
	color: #fff;
	line-height: 1em;
	font-size: 10px;
	position: absolute;
	top: 4px;
	left: 10px;
}
#testimonials ul li p .shop2 em {
	background: #00a0e9;
	color: #fff;
	line-height: 1em;
	font-size: 10px;
	position: absolute;
	top: 4px;
	left: 10px;
}

/* sidebnr */
#sidebnr {
	float: right;
	display: block;
	width: 308px;
	height: auto;
	position: relative;
	text-align: left;
}
#sidebnr ul {
	position: absolute;
	top: 0;
	right: 5px;
}
#sidebnr ul li {
	padding-bottom: 5px;
}
#sidebnr ul .bar {
	border-top: 2px solid #e2e0da;
	padding-top: 10px;
}

/* product */
.p_top #product ul {
	width: 728px;
	margin: 30px auto 15px auto;
}
.p_top #product ul li {
	display: block;
	float: left;
	width: 122px;
	height: 122px;
	text-align: center;
	margin: 0 30px;
}
.p_top #product .text_b {
	font-size: 26px;
}

/* machiing */
#machiing ul {
	width: 880px;
	margin: 30px auto;
}
#machiing ul li {
	display: block;
	float: left;
	width: 285px;
	height: 200px;
	text-align: center;
	margin: 0 4px;
}

/* about */
#about {
	position: relative;
	height: 750px;
}
.google_maps {
	position: absolute;
	top: 400px;
	width: 100%;
	height: 290px;
	overflow: hidden;
	margin-top: 30px;
}


	/*** 5-2. aisatsu ***/
#welcome {
	background: url(../images/aisatsu/takayama.png) no-repeat top left;
	padding-top: 190px;
}
#welcome span {
	background: url(../images/aisatsu/welcome.png) no-repeat top right;
	padding: 20px 60px 20px 0;
}
#philosophy .cnts_box2 {
	background: url(../images/aisatsu/bg_philosophy.png) no-repeat bottom center;
}


	/*** 5-3. gaiyo ***/
#gaiyo_text dt {
	clear: both;
	float: left;
	width: 10em;
}
#gaiyo_text dd {
	margin-left: 8em;
	margin-bottom: 2em;
}
#access {
}
#train {
	background: url(../images/gaiyo/i_train.png) no-repeat top left;
	padding: 14px 0 30px 70px;
}
#car {
	background: url(../images/gaiyo/i_car.png) no-repeat top left;
	padding: 14px 0 0 70px;
}
.chronology {
	padding-top: 96px;
	background: url(../images/gaiyo/plant_t.png) no-repeat top center;
}
.chronology ul {
	margin: 0 50px;
	background: url(../images/gaiyo/plant_m.png) repeat-y top center;
}
.chronology li {
	width: 500px;
	text-align: center;
	border: 1px solid #432e1f;
	background-color: #fff;
}
.chronology .blk_l {
	margin: 0 400px 30px 0;
}
.chronology .blk_r {
	margin: 0 0 30px 400px;
}
.chronology li h2 {
	font-size: 46px;
	color: #ddd;
	padding-top: 25px;
}
.chronology li p {
	margin: 10px 0 15px 0;
}


	/*** 5-4. works ***/
#productinfo ul li {
	float: left;
	display: block;
	width: 100%;
	padding-bottom: 60px;
}
#productinfo ul img {
	float: left;
}
#productinfo ul div {
	float: right;
	width: 500px;
	padding-top: 3px;
}
#productinfo ul h2 {
	background-color: #432e1f;
	color: #fff;
	display: inline;
	padding: 0 20px;
	font-weight: bold;
	letter-spacing: 2px;
}
#productinfo ul li p {
	margin-top: 20px;
}

#works ul li {
	display: block;
	float: left;
	width: 233px;
	height: auto;
	text-align: center;
	margin: 0 30px;
	position: relative;
	padding-top: 280px;
}
#works ul img {
	position: absolute;
	width: 233px;
	top: 0;
	left: 0;
}
#works ul .year {
	position: absolute;
	width: 233px;
	top: 250px;
	left: 0;
	text-align: center;
	font-size: 11px;
}
#works ul h2 {
	padding-bottom: 10px;
}
#works ul .item {
	background-color: #432e1f;
	color: #fff;
	display: inline;
	padding: 0 20px;
	letter-spacing: 2px;
	font-size: 10px;
}
#works ul .detail {
	padding-top: 20px;
}


	/*** 5-5. flow ***/
#flow h1 {
	font-size: 20px;
	float: left;
	display: block;
	width: 280px;
	line-height: 1.8em;
	margin: 0 50px;
}
#flow h1 span {
	display: block;
	float: left;
}
#flow h1 .num {
	font-size: 66px;
	color: #bbb;
	padding-top: 20px;
	height: 100px;
}
#flowblk01 {background: url(../images/flow/i_flow01.png) no-repeat bottom center;}
#flowblk02 {background: url(../images/flow/i_flow02.png) no-repeat bottom center;}
#flowblk03 {background: url(../images/flow/i_flow03.png) no-repeat bottom center;}
#flowblk04 {background: url(../images/flow/i_flow04.png) no-repeat bottom center;}
#flowblk05 {background: url(../images/flow/i_flow05.png) no-repeat bottom center;}
#flowblk06 {background: url(../images/flow/i_flow06.png) no-repeat bottom center;}
#flowblk07 {background: url(../images/flow/i_flow07.png) no-repeat bottom center;}
#flow h1 .flowttl {
	padding: 20px 0 0 40px;
}
#flow .detail {
	float: right;
	display: block;
	width: 400px;
}
.flow_blk {
	padding: 40px 0;
	position: relative;
}
.flow_blk .arrow_t {
	position: absolute;
	left: 110px;
	top: 0px;
}
.flow_blk .arrow_b {
	position: absolute;
	left: 110px;
	bottom: -30px;
}


	/*** 5-6. faq ***/
#faq h2 {
	line-height: 1.8em;
}
.question, .answer {
	min-height: 40px;
	padding-left: 100px;
	position: relative;
}
.question span {
	font-size: 46px;
	color: #bbb;
	position: absolute;
	left: 0;
	top: 0;
	line-height: 1em;
}
.answer {
	padding-bottom: 50px;
}
.answer span {
	font-size: 46px;
	color: #ffca7e;
	position: absolute;
	left: 0;
	top: 0;
	line-height: 1em;
}

	/*** 5-7. contact ***/
#contact table {
	letter-spacing: 0.1em;
	margin: 0 auto 30px auto;
}
#contact table th {
	text-align: right;
	padding: 20px 10px 10px 10px;
}
#contact table td {
	text-align: left;
	padding: 10px;
}
#contact table th, #contact table td {
	font-weight: normal;
	vertical-align: top;
}
#contact table .req {
	background: #ef5a24;
	color: #fff;
	font-size: 11px;
	padding: 0 7px;
	margin-right: 10px;
}
#contact table .at {
	background: #999;
	color: #fff;
	font-size: 11px;
	padding: 0 7px;
}
#contact table .err {
	color: #ef5a24;
}
.inptext {
	padding: 5px;
	border: solid 1px #999;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
}
.textarea {
	padding: 5px;
	border: solid 1px #999;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
}
.btnsubmit {
	background: #00a0e9;
	color: #fff;
	width: 290px;
	padding: 10px 15px;
	text-align: center;
	display: inline;
	border: solid 1px #00a0e9;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	text-decoration: none;
	letter-spacing: 1em;
	
	-webkit-transition: 0.5s ease-in-out;
	-moz-transition: 0.5s ease-in-out;
	-o-transition: 0.5s ease-in-out;
	transition: 0.5s ease-in-out;
}
.btnsubmit:hover {
	background: #432e1f;
	border: solid 1px #432e1f;
}
#complete table {
	letter-spacing: 0.1em;
	margin: 0 auto 30px auto;
}
#complete table th {
	text-align: right;
}
#complete table td {
	text-align: left;
}
#complete table th, #complete table td {
	font-weight: normal;
	vertical-align: top;
	padding: 10px;
	border: 1px solid #ccc;
}


	/*** 5-8. privacy ***/
#privacy h1 {
	font-weight: bold;
}
#privacy h1, #privacy h2 {
	margin: 20px 50px;
}


	/*** 5-9. site-map ***/

#site-map ul {
	background: url(../images/common/building.png) no-repeat bottom right;
}
#site-map ul li{
	margin-bottom: 30px;
	list-style-type: disc;
}
#site-map ul li a, #site-map ul li a:visited {
	color: #555;
	text-decoration: none;
}
#site-map ul li a:hover, #site-map ul li a:active {
	color: #0071ba;
	text-decoration: underline;
}



/******************************
        6. footer 
*******************************/
footer {
	background: #402b1c url(../images/common/bg_footer.png) repeat top center;
	color: #fff;
	width: 100%;
	height: auto;
	margin: 0 auto;
	padding: 60px 0;
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 100;
}

#page-top {
	position: fixed;
	bottom: 25px;
	right: 20px;
	font-size: 10px;
	z-index: 50;
}
#page-top a {
	background: #ffa626;
	color: #fff;
	width: auto;
	padding: 10px 15px;
	text-align: center;
	display: block;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	text-decoration: none;
	font-size: 11px;
	letter-spacing: 1px;
	
	-webkit-transition: 0.5s ease-in-out;
	-moz-transition: 0.5s ease-in-out;
	-o-transition: 0.5s ease-in-out;
	transition: 0.5s ease-in-out;
}
#page-top a:hover {
	background: #432e1f;
}

#footer_info {
	position: relative;
	text-align: left;
}

footer address {
	font-style: normal;
	line-height: 1.6;
	padding-bottom: 2em;
}
footer address span {
	font-size: 16px;
	font-weight: bold;
}

footer small {
	font-size: 9pt;
}

#subnav {
	position: absolute;
	bottom: 0;
	right: 0;
}
#subnav li {
	display: inline;
	margin-left: 1em;
}
#subnav li a {
	color: #fff;
	font-size: 10px;
}