﻿@charset "utf-8";
.btnClass{padding:30px;}
.btnClass.btncenter{text-align: center;}
.btnClass.btnleft{text-align: left;}
.btnClass.btnright{text-align: right;}
.btnClass>ul{display: inline-block;}
.btnClass>ul>li{min-width:40px;height: 40px;font-size:16px;line-height: 40px;float:left;border-left:1px solid #cccccc;border-top:1px solid #cccccc;border-bottom:1px solid #cccccc;text-align: center;overflow: hidden;}
.btnClass>ul>li:first-child{border-bottom-left-radius: 4px;border-top-left-radius: 4px;}
.btnClass>ul>li:last-child{border-bottom-right-radius: 4px;border-top-right-radius: 4px;border-right: 1px solid #cccccc;}
.btnClass>ul>li>a{width:40px;height: 40px;display: block;line-height: 40px;color:#000000;font-size: 16px;}
.btnClass>ul>li>a:hover{width:40px;height: 40px;display: block;background-color: #5a5a5a;color:#ffffff;text-decoration: none;}
.btnClass>ul>li.thisbtn{background-color:#5a5a5a;color:#ffffff;}

@media screen and (max-width:799px){
	.btnClass>ul>li.pc{display: none;}
	.btnClass>ul>li:nth-child(2){border-bottom-left-radius: 4px;border-top-left-radius: 4px;}
}
@media screen and (min-width:800px) {
	.btnClass>ul>li.pc{display:;}
	.btnClass>ul>li::nth-child(2){border-bottom-left-radius: 0px;border-top-left-radius: 0px;}
}

/* .topbtnClass{} */
.topbtnClass.btncenter{text-align: center;}
.topbtnClass.btnleft{text-align: left;}
.topbtnClass.btnright{text-align: right;}
.topbtnClass>ul{display: inline-block;}
.topbtnClass>ul>li{min-width:40px;height: 40px;font-size:16px;line-height: 40px;float:left;text-align: center;overflow: hidden;}
.topbtnClass>ul>li>a{width:40px;height: 40px;display: block;line-height: 40px;color:#000000;font-size: 16px;}
.topbtnClass>ul>li>a:hover{width:40px;height: 40px;display: block;color:#ffffff;text-decoration: none;}


