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

/*===========================================
	wf-1000xm4_hpc.css  
=============================================*/

#contents section h2 {
    border-top: none;
}

#contents span.circle {
    background: #3159BF;
    padding: 0 7px;
    margin: 0 4px;
    color: #fff;
    font-weight: bold;
    vertical-align: middle;
    border-radius: 50%;
	font-size: 130%;
}

#contents span.circle.nn{
	padding: 2px 3px;
	font-size: 110%;
}

#contents .capArea{
	margin-left: 1em;
}

#contents .capArea ul{
	list-style-type: none;
	margin-left: 2em;
	margin-top: 0.5em;
}

#contents .capArea ul.right_text{
	margin-top: 0;
}

#contents .capArea ul.right_text > li{
	margin-bottom: 1.5em;
	padding-left: 2.5em;
    text-indent: -2.5em;
}

#contents .capArea ul.right_text > li span.annotation{
	display: inline-block;
	margin-top: 10px;
	margin-left: 0;
	text-indent: 0;
}

#contents ul.btnlist.flex{
	list-style: none;
	padding: 0;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -ms-flex-wrap: wrap;
  	flex-wrap: wrap;
    margin-left: 0;
    -webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

#contents ul.btnlist.flex > li{
    width: calc(50% - 5px);
    margin: 5px 0;
    padding: 0;
}

#contents ul.btnlist.flex > li > a{
	width: 100%;
}

#contents ul.btnlist.inner li span.textLink{
    background: url(/support/share/images/arrow_underline.gif) no-repeat 0 0.5em;
    padding: 0 0 0 13px;
}

#contents section .capArea.flex > ul{
	list-style-type: none;
}

@media all and (-ms-high-contrast:none) {
	#contents section .capArea.flex > ul {
		width: 50%\9;
	}
}


#contents section .capArea.flex{
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
	-ms-flex:0 1 auto
}

#contents .capArea ul > li > p{
	margin: 0;
}

#contents .capArea > ul > li > p + p{
	margin-left: 8px;
}

#contents section .capArea dl dt{
	font-weight: 400;
	margin-bottom: 0;
}

#contents section .capArea dl dd{
	margin-bottom: 0;
}

#contents .singleBtn {
    width: calc(100% - 1em);
    margin: 0.5em 0;
}

@media all and (-ms-high-contrast:none) {
	#contents .singleBtn {
		width: 96%\9;
	}
}

#contents .singleBtn.inner{
	width: 18em;
	padding: 0;
}

#contents .singleBtn a{
	padding: 0.5em 1em;
}

#contents section#a .capArea > ul{
	margin-top: 2.5em;
}

#contents section#adaptive .capArea > ul{
	margin-top: 6.5em;
}

#contents section#behavior .capArea > ul{
	margin-top: 0.8em;
}

#contents section#b .capArea > ul{
	margin-top: 2.5em;
}

#contents section#c .capArea > ul{
	margin-top: 2.5em;
}

#contents section .capArea > li{
	margin-bottom: 0;
}

#contents section .capArea.flex ul li span.circle{
	display: none;
}

#l4{
	margin-top: 5em;
}

#l5{
	margin-top: 4.8em;
}

#l6{
	margin-top: 11em;
}

#l7{
	margin-top: 10em;
}

#l8{
	margin-top: 2em;
}

#l9{
	margin-top: 7em;
}

#l11{
	margin-top: 10em;
}

#l13{
	margin-top: 5em;
}

#l14{
	margin-top: 3em;
}

#l15{
	margin-top: 10em;
}

#l16{
	margin-top: 9em;
}

#l17{
	margin-top: 2.5em;
}

#l19{
	margin-top: 5em;
}

#l20{
	margin-top: 10em;
}

#l21{
	margin-top: 4em;
}

#l22{
	margin-top: 2em;
}

#l23{
	margin-top: 3.5em;
}

#l24{
	margin-top: 3em;
}

#l25{
	margin-top: 4em;
}

#l26{
	margin-top: 2.5em;
}

@media (max-width: 640px){
	#contents .flex{
		flex-direction: column;
		margin:0 auto;
	}
	
	#contents ul.btnlist.flex{
		margin-top: 3em;
	}
	#contents ul.btnlist.flex > li {
		width: 100%;
	}
	
	#contents .capArea > ul {
		margin-left: 0;
		margin-bottom: 0;
	}
	
	#contents .capArea{
		margin-left: 0;
	}
	
	#contents section .capArea.flex ul li span.circle{
		display: inline;
	}
	
	#contents section .capArea > ul,
	#contents section .capArea > ul > li{
		margin-top: 1em !important;
	}
	
	#contents section .capArea > ul > li{
		margin-bottom: 2em;
	}
	
	#contents section .capArea > ul > li:last-child{
		margin-bottom: 0;
	}

	#contents section .capArea > ul > li > dl dt,
	#contents section .capArea > ul > li > p:first-child{
		text-indent: -3em;
		padding-left: 3em;
	}	
	
	#contents .capArea ul > li > ul.disc {
		margin-left: 4.5em;
	}

	#contents section .capArea > ul > li > dl dd,
	#contents section .capArea > ul > li > p.annotation,
	#contents section .capArea > ul > li > .singleBtn{
		margin-left: 3em;
	}
	
	#contents section .capArea > ul > li > .singleBtn{
		width: calc(100% - 3em) !important;
	}
	#contents section .capArea > ul > li > dl dd .singleBtn{
		width: 100%;
	}
    #contents figure img{
        max-width: 100%;
        width: 100%;
        height: auto;    
    }
}

@media (max-width: 380px){
	#contents figure{
		max-width: 300px;
	}

}