/*--------------------------------------------------
  リセット
--------------------------------------------------*/
#main-contents {
	font-size: 92.3%;
	line-height: 1.6;
	margin-bottom: 30px;
	width: 700px;
}
#main-contents h2 {
	margin: 30px 0 10px;
}
#main-contents img {
	vertical-align: middle;
}
#main-contents a:hover {
	color: #3399cc;
	text-decoration: none;
}
#main-contents a:hover img {
	filter: alpha(opacity=75);
	opacity: 0.75;
}
#main-contents strong {
	font-weight: bold;
}

/**************************************
iFrame
**************************************/

div.toiawase{
	clear:both;
	width:100%;
	text-align:center;
}
div.toiawase iframe{
	width: 610px;
	height: 180px;
	text-align: center;
	overflow:auto;
}

/*--------------------------------------------------
  レイアウト
--------------------------------------------------*/
#key {
	background: #802804;
	padding-bottom: 5px;
}

#key .feature h2 {
	margin: 0;
}
#key .feature p {
	margin: 0 30px;
}
#key .note {
	font-size: 83.3%;
	line-height: 1.3;
}

#key .feature {
	position: relative;
}
	.feature.sec01 {
		background: url(../img/feature01.png) no-repeat;
		height: 485px;
	}
	.feature.sec02 {
		background: url(../img/feature02.png) no-repeat;
		height: 345px;
		position: relative;
	}
	.feature.sec03 {
		background: url(../img/feature03.png) no-repeat;
		height: 365px;
	}

	.feature.sec01 .pic { position: absolute;	bottom: 15px;	left: 28px; }
	.feature.sec02 .pic { position: absolute;	bottom: 15px;	right: 25px; }
	.feature.sec03 .pic { position: absolute;	bottom: 15px;	right: 25px; }

	.feature.sec02 p { margin-top: 10px !important; }
	.feature.sec03 p { margin-top: 10px !important; }

	.feature.sec01 .note {
		margin-top: 7px !important;
	}


/* ラインナップ */
.lineup {
	height: 636px;
	position: relative;
}
	.lineup.sec01 { background: url(../img/lineup01.png) no-repeat; }
	.lineup.sec02 { background: url(../img/lineup02.png) no-repeat; }
	.lineup.sec03 {
		background: url(../img/lineup03.png) no-repeat;
		height: 621px;
	}

	.lineup.sec01 .txt { position: absolute;	bottom: 20px;	left: 230px; }	/* top: 416px; */
	.lineup.sec01 .pic { position: absolute;	top: 416px;	right: 20px; }
	.lineup.sec02 .txt { position: absolute;	bottom: 20px;	left: 230px; }	/* top: 416px; */
	.lineup.sec02 .pic { position: absolute;	top: 416px;	right: 20px; }
	.lineup.sec03 .txt { position: absolute;	bottom: 20px;	left: 230px; }	/* top: 401px; */
	.lineup.sec03 .pic { position: absolute;	top: 401px;	right: 20px; }

.lineup .product { position: absolute;	bottom: 20px;	left: 20px; }
.lineup .note {
	font-size: 83.3%;
	line-height: 1.3;
/*	position: absolute;	top: 100px;	left: 0;	*/
	margin-top: 15px;
	width: 300px;
}
	/*.lineup.sec01 .note { margin-top: 35px; }
	.lineup.sec02 .note { margin-top: 35px; }
	.lineup.sec03 .note { margin-top: 48px; }*/


/* 製品比較表 */
.spec {
	border: 1px solid #000;
}

.spec table {
	border-collapse: separate;
	border-bottom: 1px solid #000;
	border-right: 1px solid #000;
	border-spacing: 0;
	width: 100%;
}
.spec th,
.spec td{
	border-left: 1px solid #000;
	border-top: 1px solid #000;
	font-size: 83.3%;
	font-weight: normal;
	padding: 8px 4px;
	text-align: center;
	vertical-align: middle;
}
.spec th {
	background: #fffccc;
}
	.spec th.n00 { background: url(../img/spec_head00.png) repeat-x; }
	.spec th.n01 { background: url(../img/spec_head01.png) repeat-x; }
	.spec th.n02 { background: url(../img/spec_head02.png) repeat-x; }
	.spec th.n03 { background: url(../img/spec_head03.png) repeat-x; }
	.spec th.n01, .spec th.n02, .spec th.n03 {
		color: #fff;
		height: 32px;
		width: 183px;
	}
	.spec th.n00, .spec th.n01, .spec th.n02, .spec th.n03 {
		font-size: 100%;
		font-weight: bold;
	}
	.spec th.n01 a, .spec th.n02 a, .spec th.n03 a {
		color: #fff !important;
	}
	.spec th.n01 a:hover, .spec th.n02 a:hover, .spec th.n03 a:hover {
		text-decoration: none !important;
	}


/* タブレット */
/* ## Tablet Style  ###################################################################################################### */
@media screen and (min-width: 500px) and (max-width: 799px){
	img.tablet {
		height: auto;
		width: 100%;
	}
	.feature.sec01 { background-size: 100% 485px; }
	.feature.sec02 { background-size: 100% 345px; }
	.feature.sec03 { background-size: 100% 365px; }
	
	.lineup.sec01,
	.lineup.sec02 {
		background-size: 100% 666px;
		height: 666px;
	}
	.lineup.sec03 {
		background-size: 100% 651px;
		height: 651px;
	}
	
	.lineup.sec01 .pic { top: 446px; }
	.lineup.sec02 .pic { top: 446px; }
	.lineup.sec03 .pic { top: 431px; }
}
