@charset "utf-8";



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







/** announce ************************/
.announce{
	text-align:left; border-top:#333 solid 1px; font-size:12px; padding:10px 0 5px 5px; text-indent:0; background:#EEE;
}




/**************************/
.wrap{
	width:100%;/*1100px;*/
	margin:0 auto 0 auto;
	background:#EEE;
	background:url(../../img/bg.png) repeat;

}


.contents{
	width:100%; 
	margin:0 0 10px 0; 
	font-size:12px; 
	color:#333;
	background:#EEE;
	background:url(../../img/bg.png) repeat;
	
}
.main{
	width:100%; 
	margin:0 0 10px 0; 
	font-size:12px; 
	color:#333;
	float:none;
	
}





/**************************/
.sideMenu{
	width:100%;
	height:2000px;
	margin:0 auto 10px auto; font-size:12px; color:#333;
	border:#CCC solid 0px;
	float:none;
	
}
.sideMenu .adBox{
	margin:0 0 10px 0;	
}
.sideMenu .googleadsence{
	height:250px;
	margin:0 0 10px 0;	
}





/**************************/
.slideDisplay{
	border:#CCC solid 0; 
	margin:0 auto 10px auto; 
	
	width:100%;
	height:100%;
	margin:0 auto 0 auto;
	position:relative;
	padding-bottom:47.6113%;
	padding-top:0;
	height:0;
	overflow:hidden;
	float:none;
	/* width:100%; height:40.6113%; border:#CCC solid 1px; margin:0 auto 10px auto;*/
	
	/*box-shadow:#666 0px 0px 5px ; !important*/
}



.bxslider{
	
	width:100%;
	height:100%;
	margin:0 auto 10px auto;
	position:relative;
	padding-bottom: 40.6113%;
	padding-top:0;
	height:0;
	overflow:hidden;
	float:none;
}

.bx-viewport{
	height:195px !important;
}

.item{
	height:200px;
}




/**************************/
.moreAttentionBtn{
	width:100%;
	height:auto;
	text-align:right;
	cursor:pointer;
	}
	
.moreAttentionTitle{
	width:100%; 
	padding:10px; 
	color:#FFF; 
	margin:0 auto;
	font-size:18px;
	font-weight:light;
	position:relative;
	
	
	background: linear-gradient(#444,#333);
    background: gradient(linear,0 0,0 bottom,from(#444),to(#333));
    background: -webkit-gradient(linear,0 0,0 bottom,from(#444),to(#333));
	background:#01b0a7; 
}

.moreAttentionBox{
	width:100%;
	margin:0 auto 10px auto;
}
.moreAttentionText{
	display:block;
	text-decoration:none;
	width:50%; 
	height:auto; 
	float:left; 
	padding:20px 10px;
	margin:0 0 0 0;
	border:#ccc solid 1px; 
	background:#FFF;
	position:relative;
	/*
	background: linear-gradient(#FEFEFE,#DDD);
    background: gradient(linear,0 0,0 bottom,from(#FEFEFE),to(#DDD));
    background: -webkit-gradient(linear,0 0,0 bottom,from(#FEFEFE),to(#DDD));
	*/
	overflow:hidden;
	font-size:14px;
	line-height:1.5em;
}
.moreAttentionText:hover{color:#333;}
.moreAttentionText:link{color:#333;}
.moreAttentionText:active{color:#333;}
.moreAttentionText:visited{color:#333;}

.moreAttentionArrow{
	display: block;
	position: absolute;
	width: 20px;
	right: 10px;
	top: 15px;
}
.moreAttentionArrow img{
	width:100%;
}






/**************************/
.btn{
	display:block;
	width:95%;
	background:#FFF;
	color:#FFF;
	text-align:center;
	border:#CCC solid 1px;
	border-radius:0 0;
	padding:15px 5px;
	margin:0 auto 20px auto;
	cursor:pointer;
	float:none;
	
	/*グラデボタン*/
	/*
	background: -moz-linear-gradient(top,#FFF 0%,#CCC);
	background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#CCC));
	*/
	color:#111;
	font-size: medium;
	
}
/* iPhoneでのボタンのアピアランス解除 */
input[type="button"],input[type="submit"] {
  border-radius: 0;
}

input[type="button"],input[type="submit"] {
  -webkit-appearance: none;
}




/**************************/
.rankingBox{
	width:100%;
	margin:0 0 30px 0;
	padding:0 0 0 0;
	text-align:left;
	position:relative;
}
.rankingHead{
	width:100%;
	height: 82px;
	margin: 0 0 10px 0;
	padding: 0px;
	border: #CCC solid 0px;
	position:relative;
}
.rankingHeadTitle{
	position: absolute;
	top: 34px;
	left: 111px;
	width: 285px;
	height: 20px;
	font-size: 18px;
	font-weight: bold;
}
.rankingTitle{
	width:55%;
	height:16px;
	text-align:left;
	float:left;
}
.rankingDate{
	width:45%;
	height:16px;
	text-align:right;
	float:right;
	position: absolute;
	right: -1px;
	top: 70px;
}
.rankingBox .rakuten{
	background:url(../../img/midashi_rakuten.png);
	background-size:900px 82px;
}
.rankingBox .yahoo{
	background:url(../../img/midashi_yahoo.png);
	background-size:900px 82px;
}
.rankingBox .noMargin{
	margin:0 0 0 0;
}
.rankingBox ul{
	list-style:none;
	margin:0 0 0 0;
	padding:0 0 0 0;
}

.rankingContentsBox{
	width:144px; 
	height:250px;/*300*/
	float:left; 
	overflow:hidden; 
	margin:0 0 10px 12px;
	padding:2px 2px; 
	border:#CCC solid 1px;
}

.rankingBox ul li{
	display:inline-block;
	width:90%;
	height:20px;
	list-style:none;
	margin:0;
	padding:0 0 0 0;
	overflow:hidden;
}
.toRanking{
	width:100%;
	text-align:right;
	font-size:12px;	
}
.toCampaign{
	width:100%;
	text-align:right;
	font-size:12px;	
}

.partsBox{
	width:100%;
	border:#CCC solid 1px;
	margin:0 0 20px 0; 
	padding:0 0 0 0;
	background:#FFF;
}
.partsTitle{
	background:#999;
	color:#FFF;
	margin:0;
	padding:2px 0;
	text-align:center;
	
}
.motionWidgetBox{
	height:170px;
	text-align:center;
	overflow:hidden;
}
.badgeBox{
	margin:10px auto;
	text-align:center;
}










/**************************/
.appPrBox{
	width:100%;
	margin:0 0 0 0;
	padding:20px 0 0 10px;
	text-align:center;
}

.appBox{
	width:calc(50% - 10px);
	height:90px;
	border-bottom:#CCC dashed 2px;
	margin:0 0 10px 0;
}
.appPrBoxLast{
	width:100%;
	margin:0 0 5px 0;
}
.iconBox{
	margin:0 0 0 5px; width:80px; height:80px; float:left; border-radius:10px 10px; overflow:hidden;
}
.appDescription{
	margin:20px 0 5px 10px; 
	width:calc(100% - 100px);
	height:auto;
	vertical-align:middle;
	float:left; 
	line-height:1.2em; 
	text-align:left; 
	font-size:medium;
}
.appDescription a{
	font-weight:bold;
	text-decoration:none;
}
.appDescription a:link{color:#666;}
.appDescription a:hover{color:#666;}
.appDescription a:active{color:#666;}
.appDescription a:visited{color:#666;}






/**************************/
.pagingBox{
	width:100%;
	border-top:#999 solid 1px;
}
.rev{
	float:left; width:20%; height:25px; line-height:100%; text-align:left; padding:7px 0 5px 0;
}
.fwd{
	float:left; width:20%; height:25px; line-height:100%; text-align:right; padding:7px 0 5px 0;
}
.revBtn{
	margin:0 0 0 5px;
}
.fwdBtn{
	margin:0 5px 0 0;
}
.pagerTitle{
	float:left; width:60%; height:25px; line-height:100%; text-align:center; padding:10px 0 5px 0;
}




















/**************************/
.productBox{
	width:90%;
	margin:10px auto;
	padding:10px 10px; 
	/*border-top:#888 solid 1px;*/
	box-shadow:#666 0px 0px 2px ;
	
}


.productBox2{
	width:90%;
	margin:10px auto;
	padding:10px 10px; 
	/*border-top:#888 solid 1px;*/
	box-shadow:#666 0px 0px 2px ;
	width:140px; height:360px; overflow:hidden; float:left; margin-left:5px;
	
}





.shopName{
font-size:10px; color:#333;
background:#FEA;
padding:5px;
margin:0 0 5px 0;
}

.shopNameRakuten{
font-size:10px; color:#333;
background:#FEA;
padding:5px;
margin:0 0 5px 0;
}

.shopNameRakuten2{
font-size:10px; color:#333;
background:#FEA;
padding:5px;
margin:0 0 5px 0;
width:140px; height:14px; margin:0 0 10px 0; padding:5px 0; overflow:hidden;
}



.shopNameYahoo{
font-size:10px; color:#333;
background:#CEF;
padding:5px;
margin:0 0 5px 0;
}
.shopNameYahoo2{
font-size:10px; color:#333;
background:#CEF;
padding:5px;
margin:0 0 5px 0;
width:140px; height:14px; margin:0 0 10px 0; padding:5px 0; overflow:hidden;
}



.image{
	width: 150px;
	margin: 0px 0 0px 0;
	overflow:hidden;
	width:130px; height:130px; overflow:hidden;
}
.image2{
	width: 150px;
	margin: 0px 0 0 0;
	overflow:hidden;
	text-align:center; width:140px; height:140px; margin:10px 0 0 0; padding:0; overflow:hidden;
}




.productUrl{
	font-size: small;
	line-height:120%;
	margin: 5px 0 0 0;
	width:130px; 
	height:45px; 
	overflow:hidden;
}
.productUrl2{
	font-size: small;
	margin: 5px 0 0 0;
	height:40px;
	overflow:hidden;
}
.productUrl a{
	color:#333 !important;
}
.productUrl2 a{
	color:#333 !important;
}

.pointTag{
	font-size:14px; 
	color:#F00; 
	margin-left:-5px;
	font-weight:bold;
}
.getTag{
	font-size:12px; 
	color:#333; 
	margin-left:-5px;
}
.priceBox{
	text-align: right;
	margin:0 0 5px 0;
}
.priceTag1{
	font-size:12px; 
	color:#333; 
	margin-right:10px;
}
.priceTag2{
	font-size:24px; 
	color:#F00;
}
.tagBox{
	text-align: right;
	padding:0 0 0 0;
	margin:0 0 0 0;
}
.catchcopy{
	font-size:14px;
	border-top:#CCC solid 1px;
	border-bottom:#CCC solid 1px;
	margin:5px 0;
	padding:5px 0 5px 0;
	/*
	box-shadow:#999 0px 0px 2px;*/

}

/**************************/
.snsArea{
	width:140px;
	height:21px;
	margin:10px 0 0 0;
	padding:0 10px 0 0;
	
}
.twBtn{
	width:120px; height:21px; float:left; margin:0 0 5px 0;
}
.fbBtn{
	width:120px; height:21px; float:left; margin:0 0 5px 0;
}









/**************************/
.eventTitle{
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:16px;
	font-weight:bold;
	width:100%;
	height:auto;
	padding:10px;
	margin:0 0 20px 0;
	background:#fff100;
	color:#000;
}
.eventBox{
	width:50%;
	height:auto;
	float:left; 
	margin:0 auto 20px auto;
	text-align:center;
	vertical-align:bottom;
}
.eventBox > a{
	width:100%;
	height:auto;
	vertical-align:bottom;
}
.eventBox > a > img{
	width:95%;
	max-width:95%;
	background:#FFF;
	vertical-align:bottom;
}
.eventCaption{
	width:95%;
	height:52px;
	margin:0 auto;
	padding:5px 5px;
	text-align:center;
	overflow:hidden;
	background:#FFF;
	font-size:x-small;
	
}
.eventBox > a:hover,
.eventBox > a:link,
.eventBox > a:active,
.eventBox > a:visited{
	color:#000;
	text-decoration:underline;
}






}