/* 価格比較用css */

/*===============================================
● 画面の横幅が481px以上
===============================================*/
@media screen and (min-width: 481px){

.price{font-size:20pt;color:orangered;}

.raku-box,.amazon-box,.yahoo-box{
	font-size:small;
	background:#ffffee;
	height: 225px;
	width: 136px;
	margin: 2px;
	text-align: center;
	float: left;
}

.raku-box{
	border: 2px solid orangered;
}
.yahoo-box{
	border: 2px solid dodgerblue;
}
.amazon-box{
	border: 2px solid #00cc99;
}

.raku-img-box {
	background:#ffffee;
	height: 100px;
	width: 100px;
	margin: 0px;
	margin-top: 10px;
	margin-bottom: 10px;
	border: 0;
}


.price {font-size:large;font-weight:bold;}
.ranking{font-size:large;color:deeppink;font-weight:bold;]


.osusume{
	display:block;
	border: 2px solid orangered;
	text-align: center;
	margin-top: 10px;
}
.osu-content span:before {
    content: "\A";
    white-space: pre;
  }
}
}
/*===============================================
● 画面の横幅が480pxまで
===============================================*/

/* 表示領域が480px以下の場合に適用するスタイル */

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

.price{font-size:x-large;color:orangered;}

.raku-box,.amazon-box,.yahoo-box{
	font-size:small;
	background:#ffffee;
	height: 150px;
	width: 245px;
	margin: 2px;
	text-align: center;
}

.raku-box{
	border: 1px solid pink;
}
.yahoo-box{
	border: 1px solid dodgerblue;
}
.amazon-box{
	border: 1px solid #00cc99;
}


.raku-img-box {
	background:#ffffee;
	height: 100px;
	width: 100px;
	margin: 0px;
	margin-top: 1px;
	margin-bottom: 1px;
	border: 0;
}


.osu-img {
	background:#ffffee;
	height: 105px;
	width: 105px;
	margin: 0px;
	margin-top: 2px;
	margin-bottom: 2px;
	border: 0;
	float:left;
}

.osu-content{
	width: 130px;
	margin: 4px;
	float:left;
}

.osusume{text-align:left;
}

}