/* Y'S GEAR | Y'S GEAR CLUB WEB : layout.css */

#article section b{
	color:#003282;
	margin:15px 0 0;
	display:inline-block;
	font-size:150%; }
#article div h5 {
	font-size:110%;
	padding:8px;
	color:#fff;
	margin:0 0 25px;}
#article div h5 span{
	display:block;
	font-size:80%;
	font-weight:normal; }
#article div h6{
	font-size:90%;
	margin:0 0 5px; }
#article div.brown h5{ background:#bf9c47; }
#article div.brown h6{ color:#bf9c47; }
#article div.orange h5{ background:#f29300; }
#article div.orange h6{ color:#f29300; }
#article div.green h5{ background:#7cbe35; }
#article div.green h6{ color:#7cbe35; }
#article div.blue h5{ background:#00aae7; }
#article div.blue h6{ color:#00aae7; }
#article div.gray h5{ background:#999; }
#article div.gray h6{ color:#999; }

#article section ul { margin: 0 0 20px 0; }
#article section li {
	line-height: 140%;
	list-style-type: none;
	margin: 0 0 5px 0;
	padding: 0 0 0 1em;
	text-indent: -1em; }

#article .column2 div{ margin-bottom:60px; }
#article .column2 div.last{ margin-bottom:0px!important; word-break: break-all; word-wrap:break-word; }
#article .column2 div > img{
	float:left;
	margin:0 15px 15px 0; }
#article .column2 h6,#article .column2 ul,#article .column2 div a img,#article .column2 aside{ margin-left:115px; display:block;}
#article .column2 p{
	font-size:90%;
	line-height: 120%;
	margin:12px 0 0 0;}
#article .column2 ul{ margin-bottom:10px;}
#article .column2 ul li{
	font-size:90%;
	line-height: 160%; }
	
#article section li span{
	display:inline-block;
	padding:2px 0.5em 2px 1.5em; }

#article .main .detail img{
	float:right;
	margin:0 0 1.5em 1.5em; }
#article .boxred{
	color:#fff;
	background:#f00; }
#article .boxorange{
	color:#fff;
	background:#f29300; }
#article .boxyellow{
	color:#fff;
	background:#fb0; }
#article .txtred{
	color:#f00; }

#article section aside{
	font-size:77%;
	line-height: 140%;
	margin-bottom:10px; }
#article .attention{
	margin:0 0 40px;
	color:#f00; }
#article .attention img{ margin:0 5px 0 0; }

#article .link{ margin:0 0 40px 0; }

/*======================================================================*
 *  [ Media Queries 568 ] 
 *======================================================================*/

@media screen and (max-width: 568px) {

#article .column2 div > img{
	display:block;
	float:none;
	margin:0 auto 15px; }
#article div ul{ margin: 0 0 15px 0; }
#article .column2 h6,#article .column2 ul,#article .column2 div a img,#article .column2 aside{ margin-left:0; display:block;}
}


/*======================================================================*
 *  [ Media Queries 480 ] 
 *======================================================================*/

@media screen and (max-width: 480px) {

#article .main .detail img{
	float: none;
	display:block;
	margin:0 auto 20px;
	text-align:center; }
}


/*======================================================================*
 *  [ Media Queries 320 ] 
 *======================================================================*/

@media screen and (max-width: 320px) {

}