@charset "UTF-8";
/* CSS Document */

/* ショートハンド  http://web-100.jp/sample/043.shtml-----*/

#container {
	text-align: left;
	margin: 0 auto;
	padding:0;
	height:auto;
}
/* h-wrap----------------------------------*/
#h-wrap {
	height:auto;
	padding:0;
	width:840px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}

/* main-cts---h2-------------------------------------------*/
#main-cts h1,#main-cts div h2{
	text-indent: -2000em;
	display: block;
	font-size:1px;
	line-height:1px;
	overflow: hidden;
}
#main-cts h1{
	background-image: url(images/title_material.gif);
	height: 67px;
	width: 630px;
}
#main-cts h2{
	margin-bottom: 10px;
	height: 14px;
}
#main-cts #change h2{
	background-image: url(images/p1_title.gif);
	width: 195px;
	height: 33px;
}
#main-cts #material h2{
	background-image: url(images/p2_title.gif);
	width: 281px;
}
#main-cts #organic h2{
	background-image: url(images/p3_title.gif);
	width: 157px;
}
/* main-cts---ul-li-a---------------------------------------*/
#main-cts #tab{
	border-bottom:1px dotted #FF9410;
	width: 630px;
	padding-bottom: 10px;
	overflow: hidden;
	margin-top: 10px;
	margin-bottom: 20px;
}
#main-cts #others ul li{
	margin-top: 15px;
}
#main-cts ul li{
	float: left;
	margin-right: 20px;
}
#main-cts #tab li a{
	height: 13px;
	text-indent: -2000em;
	display: block;
	font-size:1px;
	line-height:1px;
	overflow: hidden;
}
#main-cts ul li a:hover,
#main-cts ul li a:active,
#main-cts ul li.thispage a{ background-position: 0px 13px; }
#main-cts ul li a.change{
	background-image: url(images/change.gif);
	width: 182px;
}
#main-cts ul li a.material{
	background-image: url(images/material.gif);
	width: 109px;
}
#main-cts ul li a.organic{
	background-image: url(images/organic.gif);
	width: 111px;
}
/* main-cts---.text-box--img----------------------------------*/
#main-cts #change{
	float: left;
	overflow: hidden;
}
#main-cts .text-box,#main-cts img{
	float: left;
	height: auto;
}
#main-cts #change img,#main-cts .material-box,#main-cts #organic img{
	margin-right: 15px;
}
#main-cts #change p {width: 310px;}
#main-cts #material p {width: px;}
#main-cts #organic p {width: px;}
#main-cts #farm p {width: 370px;}
/* main-cts---material----------------------------------*/
#main-cts #material{
	float: left;
	overflow: hidden;
}
#main-cts #material .material-box h3{
	height: 45px;
	text-indent: -2000em;
	display: block;
	font-size:1px;
	line-height:1px;
	overflow: hidden;
	width: 300px;
}
#main-cts #material .material-box1 h3{background-image: url(images/p2_komugi.gif);}
#main-cts #material .material-box2 h3{background-image: url(images/p2_koubo.gif);}
#main-cts #material .material-box3 h3{background-image: url(images/p2_toubun.gif);}
#main-cts #material .material-box4 h3{background-image: url(images/p2_margarine.gif);}
#main-cts #material .material-box5 h3{background-image: url(images/p2_olive.gif);}
#main-cts #material .material-box,#main-cts #material img{
	float: left;
	width: 305px;
	margin-bottom: 15px;
}
#main-cts #material .material-box1,#main-cts #material img{
	height: 270px;
}
#main-cts #material .material-box2,#main-cts #material .material-box3,#main-cts #material .material-box4,#main-cts #material .material-box5{
	height: 210px;
}
/* main-cts---organic----------------------------------*/
#organic .text-box .organic-box{
	float: left;
	height: 190px;
	width: 190px;
	padding-right: 25px;
}
#organic .text-box .organic-box_r{
	float: left;
	height: 190px;
	width: 190px;
	padding: 0;
}
#organic .komugi-box h3{
	background-image: url(images/p3_komugi.gif);
	height: 20px;
	width: 100%;
}
#organic .yuuki-box h3{
	background-image: url(images/p3_yuuki.gif);
	height: 30px;
	width: 630px;
}
