@charset "shift_jis";
/* CSS Document */

/*===========================================
	wf-1000xm3 water.css
=============================================*/


div.attentionArea {
	border: 1px #999 solid;
	background: #FFFFCC;
	margin: 15px auto 20px auto;
	padding: 15px 15px 10px 15px;
	clear: both;
}

div.attentionArea div.attentionBox {
	background: url(/support/walkman/share3/images/ico_attention.png) no-repeat;
	margin: 0px;
	padding: 3px 0px 0px 35px;
}

div.attentionArea div.attentionBox span.attention_title {
	margin-left: 0;
	margin-bottom: 0;
	font-weight: bold;
}

#contents div.attentionArea div.attentionBox p {
	margin-left: 0;
	margin-bottom: 1em;
}


/*===========================================
	pregArea
=============================================*/

div.pregBox {
	margin: 20px 0 0 0;
	padding: 0px 10px 20px 0px;
	background: url(/support/headphone/share/images/dot_line.gif) repeat-x bottom;
	clear: both;
}

div.pregBox.no_bg {
	background: none !important;
}

#contents div.pregBox ul.caseArea {
	width: 720px;
	margin: 0 auto 2em;
	padding: 0px;
	list-style: none;
	clear: both;
}

#contents ul.caseArea li {
	width: 230px;
	padding: 0px;
	float: left;
	list-style: none;
}

#contents ul.numArea {
	width: 230px;
	margin: 10px 0px 0px 0px;
	padding: 0px;
	list-style: none;
}

#contents ul.numArea li.num {
	width: 31px;
	margin: 0px;
	padding: 0px;
	float: left;
}

#contents ul.numArea li.txt {
	width: 190px;
	margin: 0px;
	padding: 0px;
	float: right;
}

#contents div.pregBox p.list_number {
	margin-bottom: 10px !important;
	padding: 5px 0px 5px 45px;
	font-weight: bold;
	font-size: 1.25em;
}

div.pregBox p.no01 {
	background: url(/support/headphone/share/images/bar_no01.gif) no-repeat;
}

div.pregBox p.no02 {
	background: url(/support/headphone/share/images/bar_no02.gif) no-repeat;
}
div.pregBox p.no03 {
	background: url(/support/headphone/share/images/bar_no03.gif) no-repeat;
}

div.pregBox div.list_body_pct {
	margin-left: 47px;
}

div.pregBox div.leftArea_img550 {
	float: left;
	width: 550px;
}

div.pregBox div.mod-pageTop {
	margin-top: 2em;
}

/*===========================================
	lineArea 
=============================================*/

div.lineArea {
	background: #EBEBEB;
	margin: 15px 0px 0px 45px;
	padding: 15px;
	border: 1px solid #999;
	clear: both;
}

div.lineArea div.leftArea {
	width: 445px;
	margin: 0px;
	padding: 0px;
	float: left;
}

div.lineArea div.rightArea {
	width: 180px;
	margin: 0px;
	padding: 0px;
	float: right;

}

@media (max-width: 640px) {
	/*===========================================
		pregArea_
	=============================================*/

	div.attentionBox div.leftArea {
		width: auto;
		float: none;
	}
	div.attentionBox div.rightArea {
		width: auto;
		float: none;
		text-align: center;
		margin-top: 5px;
	}
	ul.caseArea {
		display: none;
	}
	div.pregBox div.rightArea {
		float: none;
		margin-left: 45px;
	}
	div.img {
		text-align: center;
	}
	div.img01 {
		text-align: center;
	}
	div.pregBox div.leftArea_img550 {
		float: none;
		width: auto;
	}
	div.pregArea_01 ul.pregBox li.imgArea img, div.img img {
		width: 96%;
		height: auto;
	}
	
	div.lineArea {
		margin-left: 40px;
	}

	/*===========================================
		lineArea 
	=============================================*/
	div.lineArea div.leftArea {
		width: auto;
		float: none;
	}
	div.lineArea div.rightArea {
		width: auto;
		float: none;
		text-align:center;
		margin-top:5px;
	}

	#contents div.attentionArea img{
		max-width: 100% !important;
		height:auto;
		margin: 1em 0;
		padding-left:10px;
	}

	div.attentionArea div.attentionBox + div {
		margin-left:0;
	}

}