/* 後読み */
.arrow h3:after,
.arrow h4:after {
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    right: 5%;
    width: 5px;
    height: 5px;
    margin: -4px 0 0 0;
    border-top: solid 2px #05A;
    border-right: solid 2px #05A;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
}
.arrow h3.open:after,
.arrow h4.open:after{
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.arrow a:after {
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    right: 5%;
    width: 5px;
    height: 5px;
    margin: -4px 0 0 0;
    border-top: solid 2px #05A;
    border-right: solid 2px #05A;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.guide h2{background:#C33;color:#FFF;padding:10px;margin-top:20px;margin-bottom:10px;font-size:1.6rem}
.guide li{position:relative}
.guide li a{padding:10px;display:block;border:1px solid #DDD;font-size:1.4rem;width:95%;margin:6px auto;}

.news h2{color:#000;font-size:1.6rem;padding:10px 0;text-align:center;background-image:url(data:image/gif;base64,R0lGODlhMwAzAJEAAP////v5+aqqqgAAACH5BAAHAP8ALAAAAAAzADMAAAKDFCKBmusNmXwzumNz3bTr9YWc6EnkOaadipau1sbsJr+ze9e6ze+UD+Tkhj0aMVhCKhXHZnFZTDqhjalVGqWarlCuF/QNarOTsHe8QzvN5B87/V631WpyvRaf6/ewPJ5vdjckGOXXRIiCeGNox5jouAgomaBoU0kC+ZQpcqmyOdNZUgAAOw==);}
.news h2 small{font-size:1rem;display:block;line-height:0.5rem;}

.ranking h2,
.searvice h2,
.news h3{background:#05A;color:#FFF;padding:10px;margin-bottom:10px;font-size:1.6rem}

.scrolltop{position:relative;height:50px;}
.scrolltop a{display:block;width:50px;height:50px;border-radius:50%;background:rgba(0, 0, 0, 0.5);position:absolute;right:5%;box-shadow:0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	-moz-transition:opacity 0.6s ease;
	-o-transition:opacity 0.6s ease;
	-webkit-transition:opacity 0.6s ease;
	transition:opacity 0.6s ease;
	opacity:0;
	cursor:pointer;
}
.scrolltop a:after{position:absolute;right:0;left:0;top:50%;margin:auto;margin-top:-10px;width:20px;content:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAK6wAACusBgosNWgAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNui8sowAAAAWdEVYdENyZWF0aW9uIFRpbWUAMTAvMjEvMTbgc0ePAAAAeElEQVQ4je2UwQ7AIAhDkfj/v8xuxrECdeM4bmJ5UUoYZiadoa00EZmkbv/GyITMC31P0h5VwKg4hGbAyi14HwFZ6x86BDydo5veAxHMu4pcXnWKkkVxCtX9QMJSaGRKBQt1CMjCoH6i5ItY9e3L4Qd+D3bB0lNwAYA3FChFQJQqAAAAAElFTkSuQmCC)}
.scrolltop a:hover{
	-moz-transform:translate3d(0, -2px, 0);
	-ms-transform:translate3d(0, -2px, 0);
	-webkit-transform:translate3d(0, -2px, 0);
	transform:translate3d(0, -2px, 0);
	box-shadow:0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15);
	-moz-transition:-moz-transform 0.2s ease-in, box-shadow 0.2s;
	-o-transition:-o-transform 0.2s ease-in, box-shadow 0.2s;
	-webkit-transition:-webkit-transform 0.2s ease-in, box-shadow 0.2s;
	transition:transform 0.2s ease-in, box-shadow 0.2s;}
.scrolltop a.fixed{position:fixed;bottom:50px;opacity:1;z-index:1}
.scrolltop a.stopfix{position:absolute;opacity:1}


@media screen and (min-width: 769px){
    
	.search:after{content:"";display:block;clear:both;}
	.search .makersearch li a{height:74px}
	.search .pricesearch li a{padding: 10px 0;min-height:85px}
	.search .bodytypesearch li img{width:69%;margin-bottom:10px}
	.search .bodytypesearch li a{min-height:83px}
	.footer h2:after,
	.footer h3:after,
	.arrow h3:after,
	.arrow h4:after{display:none}
	.arrow a:after{display:none}
	.search section:nth-of-type(3) h3:after,
	.search section:nth-of-type(4) h3:after{display:none}
	
	.kyoten h4{display:inline-block;width:100px;text-align:right;border-right:1px solid #555;padding-right:10px;margin:8px 0;color:#05A}
	.kyoten>li>ul{display:inline-block;}
	.kyoten>li>ul>li{display:inline-block;width:100px}
	.kyoten>li>ul>li+li{border-left:1px solid #AAA}
	.kyoten>li>ul a{padding-left:10px;}
	.kyoten>li>ul a>span{margin-left:0.5em;font-size:1.2rem}
	
	.prbox{display:none}
	.sell{display:none}
	.news h2{width:960px;margin:auto}
	
	.guide{width:960px;margin:auto;margin-bottom:15px}
	.guide ul:after{content:"";display:block;clear:both}
	.guide li{width:33.33%;float:left;}
	.guide .arrow a:after{display:block}
	.guide .youtube li{width:50%}
	
	.news{width:960px;margin:auto;margin-bottom:15px}
	.news:after{content:"";display:block;clear:both}
	.news div{width:50%;float:left;padding:5px 15px}
	.news div li{padding:5px 30px 5px 10px;position:relative}
	.news div li+li{border-top:1px solid #DDD}
	.news div a time{display:block}
	.news .arrow a:after{display:block}
	
	.searvice{width:960px;margin:auto}
	.searvice:after{content:"";display:block;clear:both}
	.searvice div{width:50%;float:left;padding:5px 0}
	.searvice div:nth-child(1){padding-right:10px}
	.searvice div:nth-child(2){padding-left:10px}
	.searvice div span{display:block;font-weight:bold}
	.searvice .arrow a{position:relative;display:block;padding-right:30px}
	.searvice .arrow a:after{display:block}
	
	.ranking{width:960px;margin:auto}
	.ranking>ul>li>ul>li{display:inline-block;padding:2px 5px;border:1px solid #DDD;border-radius:5px;background:#EEE;margin-bottom:3px;}
	.ranking>ul>li{width:calc(100%/2);float:left;padding:0 5px;}
	.ranking>ul:after{content:"";display:block;clear:both}
	.ranking>ul>li>ul>li a{font-size:1.2rem}
	.ranking>ul>li>ul>li+li{margin-left:5px}
	.ranking h3{margin-top:10px;font-size:1.4rem}

	.footerbanner{width:960px;margin:20px auto;}
	.footerbanner:after{content:"";display:block;clear:both}
	.footerbanner li{width:33.33%;float:left;padding:10px}

}
@media screen and (max-width: 768px){
	.menu_pc{background:#FFF}
	.menu.open span{background:rgba(255, 255, 255, 0);}
	.menu.open span:before {
	    top: 0px;
	    -webkit-transform: rotate(135deg);
	    -moz-transform: rotate(135deg);
	    transform: rotate(135deg);
	}
	.menu.open span:after {
	    bottom: 0;
	    -webkit-transform: rotate(-135deg);
	    -moz-transform: rotate(-135deg);
	    transform: rotate(-135deg);
	}
	nav.menu_pc.open{right:0;width:100%;}
	
	.search section:nth-of-type(3) ul{display:none}
	.search section:nth-of-type(4) ul{/*display:none*/}
	.search .pricesearch li a{font-size:1.2rem;min-height:86px;}
	
	.kyoten li{position:relative}
	.kyoten>li>ul{display:none}
	.kyoten>li>ul>li{position:relative}
	.kyoten>li>ul a{display:block;padding:15px 15px 15px 30px;}
	.kyoten{border-bottom: 1px solid #DDD;border-top: 1px solid #DDD;}
	.kyoten ul{border-top: 1px solid #DDD;}
	.kyoten h4{padding:15px;position:relative}
	.kyoten li+li{border-top: 1px solid #DDD;}
	.kyoten>li>ul a>span{margin-left:0.5em;font-size:1.2rem}
	
	.prbox{margin-top:15px;border-bottom:1px solid #DDD;}
	.prbox h2{border-top:3px solid #05A;border-bottom:1px solid #05A;text-align:center;color:#05A;padding:10px;background:#EEE}
	.prbox h2 small{font-size:1.2rem;color:#000;display:block}
	.prbox h3{padding:10px;border-top:1px solid #DDD;position:relative}
	.prbox ul div{margin:10px;padding:10px;border:1px solid #AAA;background:#EEE;font-size:1.2rem;display:none;}
	.prbox ul div p{margin-bottom:5px}
	.prbox ul div p.big{font-size:1.4rem}
	.prbox ul div p small{line-height:1.2em;display:block;}
	.prbox ul div img{background:#FFF;margin:10px 0}
	.prbox i{color:#F00;font-style:normal;}
	
	.sell h2{color:#000;font-size:1.6rem;padding:10px 0;text-align:center;background-image:url(data:image/gif;base64,R0lGODlhMwAzAJEAAP/////8/P9/fwAAACH5BAAHAP8ALAAAAAAzADMAAAKDFCARucrvYpuQSnaz3bVr6HHfKFrhSaJlypYq2L5xJrvzauc1ut99r/MphMFiAohkJY0t4pLnjJqkTwn12qgyRdrucOudgrFHstQ8zqKTYe062oa/t3N2fRZP35l5ezq89xOoNJhTKNMnlEj3Z7Yo2Bh5SBhZ9XgzaXMZtFmTCVUZVQAAOw==);}
	.sell h2 small{font-size:1rem;display:block;line-height:0.5rem;}
	.sell{text-align:center;margin-bottom:15px}
	.sell p{font-size:1.2rem;margin:10px 0}
	.sell a{display:block;padding:10px;border-radius:5px;color:#FFF;width:90%;margin:auto;font-size:2rem;font-weight:bold}
	.sell a small{font-size:1.2rem;display:block;color:#FFF}
	.sell a+a{margin-top:10px}
	.sell a.bg_red{background:#F00}
	.sell a.bg_orange{background:#F80}
	
	.news{margin-bottom:15px}
	.news li a{display:block;padding:5px 30px 5px 10px}
	.news li{border-bottom:1px solid #DDD;position:relative}
	.news li time{font-size:1.2rem;display:block}
	
	.guide{margin-bottom:15px}
	
	.ranking li{position:relative}
	.ranking h3{padding:15px;position:relative;font-size:1.4rem}
	.ranking li+li{border-top: 1px solid #DDD;}
	.ranking li a{display:block;padding:15px 15px 15px 30px;}
	.ranking>ul{border-top: 1px solid #DDD;border-bottom: 1px solid #DDD;}
	.ranking>ul>li>ul{border-top: 1px solid #DDD;display:none}
	
	.searvice div a{padding:5px 30px 5px 10px;display:block;position:relative}
	.searvice div span{display:block;font-weight:bold}
	
	.footerbanner{text-align:center;}
	.footerbanner li{padding:5px 30px}

}
@media screen and (max-width: 768px){
.tab_item {
  width: calc(100%/2);
  border-bottom: 3px solid #05A;
  background-color: #DDD;
  font-size: 1.6rem;
  text-align: center;
  color: #555;
  display: block;
  float: left;
  font-weight: bold;
  padding:15px 0;
  transition: all 0.2s ease;
  border-radius:5px 5px 0 0;
}
.menu-item{
	margin-bottom:15px;
}
.menu-item:after{
	content:"";
	display:block;
	clear:both;
}
.search input:checked + .tab_item,
.news input:checked + .tab_item {
  background-color: #05A;
  color: #fff;
}
.news h2{
	margin-bottom:15px;
}
.news h3{
	background:#FFF!important;
	border-bottom:3px solid #05A;
	color:#05A!important;
	text-align:center;
}
.price,
.body,
.maker-japan,
.maker-import{
	display:none;
}
#news-content,
#media-content{
	display:none;
	width:94%;
	margin:auto;
	border-radius:5px;
	border:1px solid #DDD;
	margin-top:85px;
}
#price-item:checked ~ .price,
#body-item:checked ~ .body,
#japan-item:checked ~ .maker-japan,
#import-item:checked ~ .maker-import,
#news-item:checked ~ #news-content,
#media-item:checked ~ #media-content {
  display: block;
}
}

