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

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

#contents ul, #contents ul li, #contents ol, #contents ol li, #contents dl, #contents dl dt, #contents dl dd {
	margin: 0;
	padding: 0;
}

#contents div.listArea{
	overflow:hidden;
	margin-left:1em;
	padding-bottom:1em;
	width:100%;
	height:1110px;
}

#contents div.left_img{
	display:inline-table;
	width:46%;
	float:left;
}

#contents div.textArea{
	display:inline-table;
	width:44%;

}

#contents div.textArea ul{
	list-style:none;
	position:relative;
}

#contents ul.btn_area li, #contents a.btn_area {
	border: 1px solid #bcbcbc;
	border-radius: 3px;
	background: url(/support/headphone/share/images/bg_mod-linkButton.jpg) repeat-x scroll left center;
}

#contents ul.btn_area li a span, #contents a.btn_area span {
	background: url(/support/share/images/arrow_underline.gif) no-repeat 0 0.5em;
	padding: 0 0 0 13px;
	margin: 0 0.5em 0 1em;
	display: inline-block;
}

#contents div.textArea ul li.abslt{
	position:absolute;
}

#contents div.textArea ul li a.btn_area{
	display: inline-block;
	width: 18em;
	padding: 0.5em;
	margin:0.2em 0 1em 0;
	color:#000;
}

#contents div.textArea ul li img,
#contents div.textArea ul li p img{
	display:none;
}

#list1{
	top:10px;
}

#list2{
	top:136px;
}
#list3{
	top:228px;
}

#list4{
	top:315px;
}
#list5{
	top:420px;
}
#list6{
	top:550px;
}

#list7{
	top:640px;
}
#list8{
	top:685px;
	
}
#list9{
	top:755px;
}
#list10{
	top:825px;
}

#list11{
	top:900px;
}

#list12{
	top:970px;
}



#contents div.textArea ul li p,
#contents div.textArea ul li > ul{
	margin-left:0 !important;
}

#contents div.textArea ul li p{
	margin-bottom:0.3em;
}


#contents div.pictArea {
	margin-left:2em;
	margin-bottom:3em;
}

#contents ul.imageList{
	margin:2.5em 0.5em 2em 2em;
}

#contents ul.imageList li{
	display:inline-block;
	margin-right:0.5em;
}

#contents ul.imageList li:last-child{
	margin-right:0;
}
#contents ul.imageList li:nth-child(4),
#contents ul.imageList li:nth-child(5){
	margin-top:2em;
}

#contents figure figcaption{
	font-weight:700;
	text-align:center;
	margin-bottom:0.5em;
}

#contents .row-line img {
	vertical-align: middle;
}

#contents div.pictArea img.pc_arrow1{
	margin-left:5px;
	display:inline-block;
}
	
#contents div.pictArea span.mq_arrow{
	display: none;
	background-image: url(/support/headphone/howto/images/mq_arrow2.png);
	height: auto;
	width: 51px;
	overflow: hidden;
	background-repeat: no-repeat;
	position: absolute;
	top: 46px;
	clear: both;
	left: 0;
	z-index: -1;
}

#contents div.pictArea img.pc_arrow2 {
	margin-left: 5px;
	display: inline-block;
	vertical-align: top;
	margin-top: 40px;
}

#contents div.pictArea .right_img {
	display: inline-block;
	text-align: center;
}

#contents div.pictArea .hpc_arrow {
	display: block;
}

#contents div.pctright {
	overflow: hidden;
}
#contents div.pctright img {
	float: right;
}

@media (max-width: 640px){

	#contents div.listArea{
		height:auto;
		margin-left:0;
	}

	#contents div.left_img{
		width:100%;
		float:none;
		margin: 1em 0 2em 0;
		text-align:center;
	}

	#contents div.textArea{
		width:100%;
	}

	#contents div.textArea ul{
		display: inline-block;
		margin-left:1em;
	}


	#contents div.textArea > ul > li{
		margin-bottom:2em;
	}

	#contents div.textArea ul li p{
		display: inline-block;
		width: 80%;
		margin: 0 0.5em 1em 0 !important;
	}

	#contents div.textArea ul li.abslt{
		position:static;
	}

	#contents div.textArea ul li img{
		display: inline;
		float: left;
		padding-right: 1em;
	}


	#contents div.textArea ul li a.btn_area{
		width: 70%;
		margin-left:2.8em;
	}

	#contents div.pictArea {
		margin: 2em 0 3em 0;
		text-align:center;
	}


	#contents div.pictArea img.pc_arrow,
	#contents div.pictArea img.pc_arrow1,
	#contents div.pictArea img.pc_arrow2 {
		display:none;
	}

	#contents div.pictArea span.mq_arrow{
		display:block;
		position:static;
		height:35px;
		margin:0 auto;
	}

	#contents ul.imageList{
		margin:2.5em 0 2em 0;
		text-align:center;
	}


	#contents ul.imageList li{
		margin:0 0 1em 0;
	}

	#contents ul.imageList li:nth-child(4),
	#contents ul.imageList li:nth-child(5){
		margin-top:unset;
	}

	#contents p.annotation{

		margin-left: 0.5em;
	}

	#contents p.annotation.ml_0{
		margin-left:0;
	}
	
	#contents div.pctright img {
		float: none;
	}
}