@charset "utf-8";

/*********************
* base tags
*********************/

* {
	margin: 0;
	padding: 0;
}

html, body {
	margin: 0 auto;
}

body {
	font-size: 95%;
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	line-height: 135%;
	text-align: center;
	background-color:#f5eee4;
}

/*********************
* main structure
*********************/

#container {
	margin: 0 auto;
	width: 1050px;
	height:910px;
	text-align: left;
}

#header {
	width: 1050px;
	height:155px;
	background:url(images/concept/concept.jpg) no-repeat;
	position:relative;
}

#contents {
	width: 1050px;
	position:relative;
}

#footer {
	width: 1050px;
	height:87px;
	background:url(images/footer.jpg) no-repeat;
}

/*********************
* common tags
*********************/
.align_left {
	text-align: left;
}

.align_center {
	text-align: center;
}

.align_right {
	text-align: right;
}

.clearfix {
	display: inline-block;
}

.clearfix:after {
	content: ".";
	display: block;
	visibility: hidden;
	height: 0.1px;
	clear: both;
}

html>/**/body .clearfix { display /*\**/: block\9 }

.float_left {
	float: left;
}

.float_right {
	float: right;
}

img {
	border: 0;
}

p {
	padding-bottom: 10px;
}
.padding_top10{
	padding-top:10px;
}
.padding_top20{
	padding-top:20px;
}

.padding_top30{
	padding-top:30px;
}
.padding_top50{
  padding-top:50px;
}
* html .padding_top50{
  padding-top:30px;
}
.kouji{
	margin-left:180px;
	padding-top:160px;
	font-size:24px;
	font-weight:800;
}
/*********************
* main contents
*********************/
ul.navi{
	position:absolute;
	margin-left:300px;
	width:528px;
	height:71px;
	top:78px;
	left:170px;

	
}

ul.navi li a{
	display: block;
	height:71px;
	margin:0px;
	background-image: url(images/histoire_navi.jpg);
	background-repeat:no-repeat;
	text-indent:-9999px;
}

ul.navi li{
	display:inline;
	list-style-type: none;
	float:left;
	
}

li.list1 a { width: 57px; background-position:  0px  0px; }
li.list2 a { width: 64px; background-position:  -57px  0px; }
li.list3 a { width: 72px; background-position:  -121px  0px; }
li.list4 a { width: 63px; background-position:  -193px  0px; }
li.list5 a { width: 60px; background-position:  -256px  0px; }
li.list6 a { width: 54px; background-position:  -316px  0px; }
li.list7 a { width: 70px; background-position:  -370px  0px; }
li.list8 a { width: 88px; background-position:  -440px  0px; }

li.list1 a:hover { background-position: 0px  -72px ;  }
li.list2 a:hover { background-position: -57px  -72px ;  }
li.list3 a:hover { background-position: -121px  -72px ;  }
li.list4 a:hover { background-position: -193px  -72px ;  }
li.list5 a:hover { background-position: -256px  -72px ;  }
li.list6 a:hover { background-position: -316px  -72px ;  }
li.list7 a:hover { background-position: -370px  -72px ;  }
li.list8 a:hover { background-position: -440px  -72px ;  }

.header_link{
	width:120px;
	height:100px;
	position:absolute;
	top:55px;
	left:80px;
}

#concept{
	width:1050px;
	height:665px;
	background: url(images/concept/Concept_03.jpg) no-repeat;
}
#news{
	width:1050px;
	height:665px;
	background: url(images/news/news_back_img.jpg);
}
#product{
	width:1050px;
	height:665px;
	background: url(images/product/product_background.jpg) no-repeat;
}
#kouji{
	width:1050px;
	height:665px;
	background: url(images/karbackground.jpg) no-repeat;
}

#gallery {
	width:1050px;
	height:665px;
	background: url(images/gallery/background.jpg) no-repeat;
}

.link_box{
	padding-top:197px;
	/*margin-left:240px;
	width:115px;*/
	margin-left:160px;
	width: 255px;
}
* html .link_box{
	padding-top:195px;
	margin-left:167px;
	width: 255px;
}
.link_box ul.navi1 li a{
	display: block;
	width:57px;
	height:25px;
	margin:0px;
	background-image:url(images/menu_1.png);
	background-repeat:no-repeat;
	text-indent:-9999px;
}

ul.navi1 {
	float: left;
	width:115px;
}

ul.navi1 li{
	display:inline;
	list-style-type: none;
	float:left;
	padding-bottom:5px;	
}
* html #product ul.navi1 li{
	display:inline;
	list-style-type: none;
	float:left;
	padding-bottom:3px;	
}
* html #concept ul.navi1 li{
	display:inline;
	list-style-type: none;
	float:left;
	padding-bottom:3px;	
}



.link_box ul.navi2{
	float: left;
	width: 115px;
	margin-left: 23px;
	/*padding-top:26px;*/
	}

* html #product .link_box ul.navi2{
	float: left;
	width: 115px;
	/*padding-top:29px;*/
	}
* html #concept .link_box ul.navi2{
	float: left;
	width: 115px;
	/*padding-top:29px;*/
	}
.link_box ul.navi2 li a{
	display: block;
	width:57px;
	height:25px;
	margin:0px;
	background-image: url(images/menu_2.png);
	background-repeat:no-repeat;
	text-indent:-9999px;
}

ul.navi2 li{
	display:inline;
	list-style-type: none;
	float:left;
	padding-bottom:5px;
	
}
* html #product ul.navi2 li{
	display:inline;
	list-style-type: none;
	float:left;
	padding-bottom:5px;
	
}
* html #concept ul.navi2 li{
	display:inline;
	list-style-type: none;
	float:left;
	padding-bottom:5px;
	
}

.link_box ul.navi3{
	float: left;
	width: 115px;
	padding-top: 47px;
	}

* html #product .link_box ul.navi3{
	padding-top: 43px;
	}
* html #concept .link_box ul.navi3{
	padding-top: 43px;
	}

.link_box ul.navi3 li a{
	display: block;
	width:57px;
	height:25px;
	margin:0px;
	background-image: url(images/menu_3.png);
	background-repeat:no-repeat;
	text-indent:-9999px;
}

ul.navi3 li{
	display:inline;
	list-style-type: none;
	float:left;
	padding-bottom:5px;
	
}
* html #product ul.navi3 li{
	display:inline;
	list-style-type: none;
	float:left;
	padding-bottom:6px;
}

.link_box ul.navi4{
	float: left;
	width: 115px;
	margin-left: 25px;
	padding-top: 47px;
	}

* html #product .link_box ul.navi4{
	float: left;
	width: 115px;
	padding-top: 47px;
	}
* html #concept .link_box ul.navi4{
	float: left;
	width: 115px;
	padding-top: 47px;
	}
.link_box ul.navi4 li a{
	display: block;
	width:57px;
	height:25px;
	margin:0px;
	background-image: url(images/menu_4.png);
	background-repeat:no-repeat;
	text-indent:-9999px;
}

ul.navi4 li{
	display:inline;
	list-style-type: none;
	float:left;
	padding-bottom:6px;
	/*padding-left: 5px;*/
	
}
* html #product ul.navi4 li{
	display:inline;
	list-style-type: none;
	float:left;
	padding-bottom:6px;
	
}
* html #concept ul.navi4 li{
	display:inline;
	list-style-type: none;
	float:left;
	padding-bottom:6px;
}

.link_box ul li.link1 a { background-position:  0px  0px; }
.link_box ul li.link2 a { background-position:  -57px  0px; }
.link_box ul li.link3 a { background-position:  0px  -25px; }
.link_box ul li.link4 a { background-position:  -57px  -25px; }
.link_box ul li.link5 a { background-position:  0px  -50px; }
.link_box ul li.link6 a { background-position:  -57px  -50px; }
.link_box ul li.link7 a { background-position:  0px  -75px; }
.link_box ul li.link8 a { background-position:  -57px  -75px; }
.link_box ul li.link9 a { background-position:  0px  -100px; }

.link_box ul li.link1 a:hover, .link_box ul li.link1 a.hovered { background-position: -113px 0px ; }
.link_box ul li.link2 a:hover, .link_box ul li.link2 a.hovered { background-position: -170px 0px ; }
.link_box ul li.link3 a:hover, .link_box ul li.link3 a.hovered { background-position: -113px -25px ; }
.link_box ul li.link4 a:hover, .link_box ul li.link4 a.hovered { background-position: -170px -25px ; }
.link_box ul li.link5 a:hover, .link_box ul li.link5 a.hovered { background-position: -113px -50px ; }
.link_box ul li.link6 a:hover, .link_box ul li.link6 a.hovered { background-position: -170px -50px ; }
.link_box ul li.link7 a:hover, .link_box ul li.link7 a.hovered { background-position: -113px -75px ; }
.link_box ul li.link8 a:hover, .link_box ul li.link8 a.hovered { background-position: -170px -75px ; }
.link_box ul li.link9 a:hover, .link_box ul li.link9 a.hovered { background-position: -113px -100px ; }

/*li.link1 a { background-position:  0px  0px; }
li.link1 a:hover, li.link1 a.hovered { background-position: -113px 0px ;  }

li.link2 a { background-position:  -57px  0px; }
li.link2 a:hover, li.link2 a.hovered { background-position: -170px 0px ;  }

.link_box ul li.link3 a { background-position:  0px  -26px; height: 22px; }
.link_box ul li.link3 a:hover, .link_box ul li.link3 a.hovered { background-position: -113px  -26px ;  }

.link_box ul li.link4 a { background-position:  -57px  -26px; height: 22px; }
.link_box ul li.link4 a:hover, .link_box ul li.link4 a.hovered { background-position: -170px  -26px ;  }

li.link5 a { background-position:  0px  -48px; }
li.link5 a:hover, li.link5 a.hovered { background-position: -113px  -48px ;  }

li.link6 a { background-position:  -57px  -48px; }
li.link6 a:hover, li.link6 a.hovered { background-position: -170px  -48px ;  }

li.link7 a { background-position:  0px  -72px; }
li.link7 a:hover, li.link7 a.hovered { background-position: -113px  -72px ;  }

li.link8 a { background-position:  -57px  -72px; }
li.link8 a:hover, li.link8 a.hovered { background-position: -170px  -72px ;  }

li.link9 a { background-position:  0px  -96px; }
li.link9 a:hover, li.link9 a.hovered { background-position: -113px  -96px ;  }

ul.navi4 li.link1 a { background-position:  0px  0px; }
ul.navi4 li.link1 a:hover, ul.navi4 li.link1 a.hovered { background-position: -106px 0px ;  }

ul.navi4 li.link2 a { background-position:  -54px  0px; }
ul.navi4 li.link2 a:hover, ul.navi4 li.link2 a.hovered { background-position: -160px 0px ; }

ul.navi4 li.link3 a { background-position: 0px  -26px; }
ul.navi4 li.link3 a:hover, ul.navi4 li.link3 a.hovered { background-position: -106px  -26px ; }

ul.navi4 li.link4 a { background-position:  -54px  -26px; }
ul.navi4 li.link4 a:hover, ul.navi4 li.link4 a.hovered { background-position: -160px  -26px ;  }*/

/*********************
* top
*********************/
body.nobg {
	background-color: #FFF;
}

#container.top {
	width: 770px;
	height: 500px;
    position:absolute;
	left: 50%;
    top: 50%;
	margin-top: -250px;
	margin-left: -385px;
}

.top a {
	background-image:url(images/top/skip.jpg);
	width: 60px;
	height: 30px;
	text-indent:-9999px;
	display:block;
	margin-left: 355px;
}

.top a:hover {
	background-position: 0 -30px;
}

/*********************
* product
*********************/
.right{
	position:absolute;
	top:73px;
	left:530px;
	width:410px;
	height:508px;
	background-image:url(images/product/Contact.jpg);
}
.right_conf{
	position:absolute;
	top:73px;
	left:530px;
	width:410px;
	height:465px;
	background-image:url(images/product/contact_conf.jpg);
}
.right_comp{
	position:absolute;
	top:73px;
	left:530px;
	width:410px;
	height:508px;	
	background: url(images/product/contact_end.jpg) no-repeat;
}
.right_inner{
	position:relative;
	
}

.right .prev{
	position:absolute;
	top:480px;
	left:20px;
	display:inline;
	list-style-type: none;
}

.prev a{
	width:70px;
	height:30px;
	background-image:url(images/prev.gif);
	background-repeat:no-repeat;
	text-indent:-9999px;
	display:block;
	background-position:  0px  0px;
}
.prev a:hover{
	
	background-position: 0px  -30px ;
}

.right .next{
	position:absolute;
	top:480px;
	left:320px;
	display:inline;
	list-style-type: none;
}

.next a{
	width:70px;
	height:30px;
	background-image:url(images/next.gif);
	background-repeat:no-repeat;
	text-indent:-9999px;
	display:block;
	background-position:  0px  0px;
}
.next a:hover{
	
	background-position: 0px  -30px ;
}
/*********************
* meil
*********************/
input,select,textarea{
/*	border:#bcab80 1px solid;*/
	border: 1px solid #FFF;
}

.contact{
	position:absolute;
	top:88px;
	left:130px;
	
}
.contact_err{
	position:absolute;
	top:75px;
	left:130px;
}
.namae{
	position:absolute;
	top:132px;
	left:130px;
	
}
.namae_err{
	position:absolute;
	top:119px;
	left:130px;
}
.tel{
	position:absolute;
	top:174px;
	left:130px;
	
}
.mail{
	position:absolute;
	top:217px;
	left:130px;
	
}
.mail_err{
	position:absolute;
	top:204px;
	left:130px;
}
.mail2{
	position:absolute;
	top:259px;
	left:130px;
	
}
.address{
	position:absolute;
	top:302px;
	left:130px;
	
}
.address_err{
	position:absolute;
	top:289px;
	left:130px;
}
.note{
	position:absolute;
	top:343px;
	left:130px;
	
}
.note_err{
	position:absolute;
	top:330px;
	left:130px;
}
.submit_margin{
	position:absolute;
	top:463px;
	left:160px;
}
.contact_comp_txt{
	width:300px;
	position:absolute;
	top:100px;
	left:50px;
}
.contact_in{
	width:180px;
}
.note_in{
	width:250px;
	height:94px;
}
.namae_in{
	width:120px;
}
.tel_in{
	width:150px;
}
.mail_in{
	width:220px;
}
.address_in{
	width:250px;
}
.alert{
	color:red;
	font-weight:700;
	font-size:85%;
}
/*********************
* mail_conf
*********************/
.contact_conf{
	position:absolute;
	top:91px;
	left:133px;
}
.namae_conf{
	position:absolute;
	top:134px;
	left:133px;
}

.tel_conf{
	position:absolute;
	top:176px;
	left:133px;
}
.mail_conf{
	position:absolute;
	top:218px;
	left:133px;
}


.address_conf{
	position:absolute;
	top:260px;
	left:133px;
}

.note_conf{
	position:absolute;
	top:300px;
	left:133px;
}
.note_conf_in{
	width:245px;
	height:94px;
	overflow-y:scroll;
}
.submit_margin_conf{
	position:absolute;
	top:480px;
	left:160px;
}

/*********************
* Gallery
*********************/
#gallery .gallery_inner {
	width: 900px;
	height: 500px;
	margin: 0 75px 0 75px;
	padding-top: 50px;
}

#gallery #slideshow {
	position: relative;
	width: 900px;
}
#gallery #controls {
	z-index: 1000;
	position: absolute;
	top: 255px;
	left: 0;
	display: none;
    width: 900px;
}

#gallery #slideshow ul li {
	list-style: none;
}

/*********************
* News
*********************/
#news .right {
	padding-top: 80px;
	font-size: small;
	color: #787468;
}


/*********************
* dream weaver対策（本番で消すこと）
*********************/

.clearfix {
	overflow:hidden;
}
