@charset "utf-8";

/*CSSのリセット*/
*{
margin: 0;
padding: 0;
}
a{
text-decoration:none;
}

#contents1 li{
margin-left:15px;
}
#contents2 li{
margin-left:15px;
}

img{
vertical-align:middle;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { 
display: block;
}

html{
line-height : 140%;
font-size:14px;
}

img{
max-width:100%;
width: auto\9; /* ie8 */
border:0px;
}

header{
text-align:center;
margin-top:10px;
}

hgroup{
border-top-left-radius: 10px 10px;
border-top-right-radius: 10px 10px;
background-color:#3DB0F3;
padding-top:20px;
padding-bottom:20px;
border-bottom: 5px solid #F89E47;
}

nav ul li a{
display:block;
}

nav{
background-color:#312324;
color:#fff;
}
nav ul{
overflow:hidden;
border-bottom: 10px solid #F89E47;
margin-bottom:10px;
}
nav li{
border-left: 50px solid #E61414;  
font-size:16px;
text-align:left;
border-bottom: 1px solid #F89E47;
}
nav ul li a{
padding-top:3px;
padding-left:10px;
padding-bottom:3px;
display:block;
color : white;
}
nav ul li a:hover{
color:#fff;
background-color:#E61414;
}
.eng{
font-size:14px;
}
.eng_comments{
font-size:12px;
color:#666;
}
#contents{
width:93.75%;
margin : 0 auto;
text-align : center;
}
#contents p{ 
margin-bottom:12px;
text-align:left;
}
#contents img{ 
}

h3{
border-top-left-radius: 5px 5px;
border-top-right-radius: 5px 5px;
border-bottom-left-radius: 5px 5px;
border-bottom-right-radius: 5px 5px;
height:39px;
background-color:#3DB0F3;
padding-left:110px;
color:#fff;
margin-bottom:10px;
margin-top:10px;
padding-top:10px;
background-image : url(img/mini-logo.png);
background-repeat : no-repeat;
}

.eng_sub{
font-size:18px;
font-weight:normal;
}

h4{
border-top-left-radius: 5px 5px;
border-top-right-radius: 5px 5px;
border-bottom-left-radius: 5px 5px;
border-bottom-right-radius: 5px 5px;
font-size:16px;
background-color:#312324;
color:#fff;
margin-bottom:10px;
padding:3px;
line-height:200%;
}

/*番号つきリストにしたいのでolはマージンを取る*/
ol{
margin-left:20px;
text-align:left;
}
table.specsheet{
border: 1px #3DB0F3 solid;
border-collapse: collapse;
border-spacing: 0;
}
table.specsheet th{
padding: 5px;
border: #fff solid;
border-width: 0 0 1px 1px;
background: #3DB0F3;
font-weight: bold;
line-height: 120%;
text-align: center;
color:#fff;
}
table.specsheet td{
padding: 5px;
border: 1px #3DB0F3 solid;
border-width: 0 0 1px 1px;
}

#contents1{
text-align: left;
}
#contents2{
text-align: left;
}

footer {
margin-top:10px;
width:100%;
padding : 12px 0;
color : white;
text-align : center;
background-color:#3DB0F3;
overflow: auto;
}
.corp{
font-weight:bold;
font-size:16px;
}

.price{
font-size:24px;
font-weight:bold;
}
.price2{
border-bottom: 3px solid #3DB0F3;
}
.product_name{
font-weight:bold;
}

#notice{
font-size:12px;
margin:15px;
border:1px solid #666;
padding:10px;
text-align : left;
}

.copy{
font-size:28px;
margin-bottom:30px;
text-align:right;
}

#slideshow IMG {
    position:absolute;
    top:0;
    left:0;
    z-index:8;
}

#slideshow IMG.active {
    z-index:10;
}

#slideshow IMG.last-active {
    z-index:9;
}

	#slideshow {
	    position:relative;
	    height:230px;
	}

@media screen and (min-width:360px){

	#slideshow {
	    position:relative;
	    height:350px;
	}

}
@media screen and (min-width:500px){

	#slideshow {
	    position:relative;
	    height:400px;
	}

}
@media screen and (min-width:640px){

	#slideshow {
	    position:relative;
	    height:550px;
	}

}
@media screen and (min-width:740px){

	#slideshow {
	    position:relative;
	    height:480px;
	}

}

@media screen and (min-width:900px){
	body{
	background-color:#312324;
	}
	header{
	background-color:#fff;
	width:960px;
	margin:0 auto;
	text-align:center;
	overflow:hidden;
	}
	header #menu{
	width:25%;
	float : left;
	margin-top:10px;
	margin-left:10px;
	margin-right:10px;
	}
	header #slideshow{
	margin-top:10px;
	width:71%;
	float : left;
	}
	
	.jCarousel{
	cursor:w-resize;
	}
	
	#feature{
	background-color:#fff;
	width:940px;
	margin:0 auto;
	text-align:left;
	overflow:hidden;
	}
	#contents{
	background-color:#fff;
	width:960px;
	margin:0 auto;
	text-align:left;
	overflow:hidden;
	}
	#contents #main{
	margin-left:10px;
	width:65%;
	float : left;
	margin-right:10px;
	}
	#contents #sub{
	width:31%;
	float : left;
	}
	#contents #logo{
	margin-left:10px;
	width:40%;
	float : left;
	margin-right:20px;
	}
	#contents #logo_about{
	width:56%;
	float : left;
	}

	#contents #contents1{
	margin-left:10px;
	width:58%;
	float : left;
	margin-right:10px;
	}
	#contents #contents2{
	width:38%;
	float : left;
	}
	#contents #hydrus{
	margin-left:10px;
	width:48%;
	float : left;
	margin-right:10px;
	}
	#contents #izar{
	width:48%;
	float : left;
	}

	footer #footer1{
	width:48%;
	float : left;
	}
	footer #footer2{
	width:48%;
	float : left;
	}

	#contents2{
	background-color:#fff;
	width:960px;
	margin:0 auto;
	text-align:left;
	overflow:hidden;
	}
	#contents #main2{
	margin-left:10px;
	width:65%;
	float : left;
	margin-right:10px;
	}
	#contents #sub2{
	width:31%;
	float : left;
	}
	footer{
	width:960px;
	margin:0 auto;
	}
#slideshow {
    position:relative;
    height:490px;
}

}