@charset "utf-8";


/*
	1 : commonArea
	2 : mainVisualArea
	3 : troubleArea
	4 : solveArea
	5 : movieArea
	5 : productArea
	6 : featureArea
	7 : voiceArea
	8 : productArea


 */

/* -----------------------------
	1 : commonArea
----------------------------- */
.l-content .clockwise { float: right; }
.l-content .anticlockwise { float: left; }

.l-content .buttonArea li a {
	clear: both;
	display: block;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	margin: 0 auto;
}
.l-content .productArea .buttonArea li.productBtn a {
	width: 206px;
	height: 35px;
	background: url(/maker/ifield/products/swingswivel/images/btn_product206x35.png) no-repeat;
	margin: 0 auto 10px;
}
.l-content .productArea .buttonArea li.feature a {
	width: 206px;
	height: 35px;
	background: url(/maker/ifield/products/swingswivel/images/btn_feature206x35.png) no-repeat;
	margin: 0 auto;
}
.l-content .solveArea .buttonArea li.productBtn a,
.l-content .movieArea li.productBtn a,
.l-content .featureArea li.productBtn a,
.l-content .voiceArea li.productBtn a {
	clear: both;
	width: 215px;
	height: 37px;
	background: url(/maker/ifield/products/swingswivel/images/btn_product215x37.png) no-repeat;
	margin: 0 auto;
}

.l-content .contactArea dl.contactBox {
	position: relative;
	width: 950px;
	height: 187px;
	background: url(/maker/ifield/products/swingswivel/images/contact_bg.png) no-repeat;
}
.l-content .contactArea dl.contactBox dt,
.l-content .contactArea dl.contactBox dd,
.l-content .contactArea p.lead {
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}

.l-content .buttonArea li.contactBtn a {
	position: absolute;
	top: 100px;
	left: 595px;
	width: 260px;
	height: 52px;
	background: url(/maker/ifield/products/swingswivel/images/contact_btn.png) no-repeat;
}
/* -----------------------------
	2 : mainVisualArea
----------------------------- */
.l-content .mainVisualArea { 
	position: relative;
	width: 950px;
	height: 190px;
	background: url(/maker/ifield/products/swingswivel/images/mainVisual.png) no-repeat;
 }
.l-content .mainVisualArea h1.mainVisual,
.l-content .mainVisualArea p.mainLead {
	height: 0;
	overflow: hidden;
}


/* -----------------------------
	3 : troubleArea
----------------------------- */
.l-content .troubleArea .troubleBox {
	width: 850px;
	height: 300px;
	background: url(/maker/ifield/products/swingswivel/images/trouble_bg.png) no-repeat;
	margin: 0 auto;
}
.l-content .troubleArea .troubleBox dt,
.l-content .troubleArea .troubleBox dd {
	height: 0;
	overflow: hidden;
}

/* -----------------------------
	4 : solveArea
----------------------------- */
.l-content .solveArea {
	width: 844px;
	border: 3px solid #f1a746;
	margin: 0 auto;
}
.l-content .solveArea .titleBlock {
	width: 844px;
	height: 65px;
	background: url(/maker/ifield/products/swingswivel/images/solve_ttl.png) no-repeat;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	border: none;
}
.l-content .solveContent {
	margin: 10px auto;
	width: 710px;
	height: 190px;
	background: url(/maker/ifield/products/swingswivel/images/solve_lead.png) no-repeat;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}

.l-content .solveContent dt,
.l-content .solveContent dd {
	height: 0;
	overflow: hidden;
}



/* -----------------------------
	5 : movieArea
----------------------------- */
.l-content .movieArea .movieContent { padding: 0 15px; }
.l-content .movieArea .movieContent h3 { clear: both; }
.l-content .movieArea .movieBox{
	width:920px;
	margin:0 auto;
}

.l-content .movieArea .movieBox dl.clockwise {
	width: 425px;
}
.l-content .movieArea .movieBox dl.anticlockwise {
	width: 445px;
}

.l-content .movieArea .movieBox dd {
	padding:20px 0 10px;
}

/* -----------------------------
	6 : featureArea
----------------------------- */
.l-content .featureArea .featureContent { padding: 0 15px; }
.l-content .featureArea .featureContent h3 { clear: both; }

.l-content .featureArea .featureContent .featureBox{
	width:920px;
	margin:0 auto;
}
.l-content .featureArea .featureContent .featureBox dt{
	padding:10px 0;
}


.l-content .featureArea .featureContent .featureBox dd{
	padding:10px 0;
}
.l-content .featureArea .featureBox p.featureMovTtl,
.l-content .featureArea .featureBox p.featureMovImg {
	font-size: 13px;
	text-align: center;
	width: 292px;
}
.l-content .featureArea .featureBox dt.featureTitle {
	font-size: 16px;
	line-height:22px;
	font-weight:bold;
	color:#0086ab;
	padding:20px 0 10px;
}
.l-content .featureArea .featureBox dd.featureImg {
	text-align: center;
	padding:10px 0;

}
/* -----------------------------
	7 : voiceArea
----------------------------- */
.l-content .voiceArea .voiceContent { padding: 0 10px; }
.l-content .voiceArea dl.voiceBox {
	position: relative;
	float: left;
	width: 433px;
	height: 90px;
	border: solid 1px #c1c1c1;
	padding: 10px;
}
.l-content .voiceArea dl.voiceBox dt {
	float: left;
	width: 320px;
}
.l-content .voiceArea dl.voiceBox dd .voiceImg {
	position: absolute;
	right: 10px;
	bottom: 10px;
	
}

/* -----------------------------
	8 : productArea
----------------------------- */
.l-content .productArea .productContent {
	width: 920px; 
	margin: 0 auto;
}

.l-content .productArea dl.productBox {
	width: 290px;
	border: solid 1px #d2d2d2;
	padding: 8px 0;
	text-align:center;
	margin-bottom:20px;
}

.l-content .productArea dl.anticlockwise {
	margin-right:22px;
}
.l-content .productArea dl.productBox:first-child {
}
.l-content .productArea dl.productBox p { text-align: center; }
.l-content .productArea dl.productBox dt {
	font-size: 14px; 
	margin-bottom: 10px;
	font-weight:bold;
	padding:5px;
}
.l-content .productArea dl.productBox dt a {
  text-decoration: none;
}
.l-content .productArea dl.productBox dd.productImg {
	text-align:center;
	padding:5px 0;
}
.l-content .productArea dl.productBox dd.productName {
	font-size: 13px;
}
.l-content .productArea dl.productBox p.productPrice {
	color: #dd0000;
}


/* -----------------------------
	9 : secretArea
----------------------------- */
.l-content .secretArea .secretContent { padding: 0 10px; }
.l-content .secretArea .secretBox dt.anticlockwise {
	width: 650px;
	padding-left: 5px;
}
.l-content .secretArea .secretBox dd.clockwise {
	width: 255px;
	padding-right: 15px;
}
.l-content .secretArea .secretBox p.featureInfo {
	font-size: 13px;
	line-height: 20px;
}
