@charset 'utf-8';
/*---CSS 前方一致、後方一致、部分一致で作るボタン---*/

/*------button要素・基本スタイル------*/
button { 
	border: 1px solid #c0c0c0;
	background: #efefef;
	color: #222;
	cursor:pointer;
	border-radius: 5px;
	}
button:hover {
	opacity:0.7;
	}
	
/*------前方一致（ボタンサイズ）------*/
button[class^="ssbtn"] {
	padding:1px 3px 0 3px;
	font-size:13px;
	}	
button[class^="sbtn"] {
	padding:2px 6px;
	font-size:14px;
	}	
button[class^="btn"] {
	padding:3px 10px;
	font-size:15px;
	}
button[class^="lbtn"] {
	padding:4px 12px;
	font-size:16px;
	}
button[class^="llbtn"] {
	padding:5px 15px;
	font-size:17px;
	}
button[class^="lllbtn"] {
	padding:6px 18px;
	font-size:18px;
	}
	
/*------後方一致（ボタン色）------*/
button[class$="pink"] {
	background:#fce;
	}
button[class$="redp"] {
	background:#e9c;
	}
button[class$="red"] {
	background:crimson;
	color:#fff;
	}
button[class$="redd"] {
	background:#b00505;
	color:#fff;
	}
button[class$="bluep"] {
	background:dodgerblue;
	color:#fff;
	}
button[class$="blue"] {
	background:royalblue;
	color:#fff;
	}
button[class$="blued"] {
	background:#233e75;
	color:#fff;
	}
button[class$="greenp"] {
	background:#5f6;
	}
button[class$="green"] {
	background:#093;
	color:#fff;
	}
button[class$="greend"] {
	background:#262;
	color:#fff;
	}
button[class$="violetp"] {
	background:#abf;
	}
button[class$="violet"] {
	background:#76e;
	color:#fff;
	}
button[class$="violetd"] {
	background:#439;
	color:#fff;
	}
button[class$="yellowp"] {
	background:#fe7;
	}
button[class$="yellow"] {
	background:#fc1;
	}
button[class$="yellowd"] {
	background:#b72;
	color:#fff;
	}	
button[class$="orange"] {
	background:orangered;/*--#e90;__*/
	color:#fff;
	}	
button[class$="gray"] {
	background:gray;
	color:#fff;
	}	
button[class$="grayd"] {
	background:#444;
	color:#fff;
	}	
/*------部分一致（角丸）------*/
button[class*="rad0"] {
	border-radius: 0;
	}
button[class*="rad1"] {
	border-radius: 1px;
	}
button[class*="rad2"] {
	border-radius: 2px;
	}
button[class*="rad3"] { 
	border-radius: 3px;
	}
button[class*="rad4"] {
	border-radius: 4px;
	}
button[class*="rad5"] {/*---デフォルト値---*/
	border-radius: 5px;
	}
button[class*="rad6"] {
	border-radius: 6px;
	}
button[class*="rad8"] {
	border-radius: 8px;
	}
button[class*="rad10"] {
	border-radius: 10px;
	}
button[class*="rad12"] {
	border-radius: 12px;
	}
button[class*="rad14"] {
	border-radius: 14px;
	}	
button[class*="rad16"] {
	border-radius: 16px;
	}	
/*-----shadow付き\-----*/
button[class*="rad0s"] {
	border-radius: 0;
	box-shadow: 3px 3px 3px rgba(0,0,0,0.3);
	}
button[class*="rad1s"] {
	border-radius: 1px;
	box-shadow: 3px 3px 3px rgba(0,0,0,0.3);
	}
button[class*="rad2s"] {
	border-radius: 2px;
	box-shadow: 3px 3px 3px rgba(0,0,0,0.3);
	}
button[class*="rad3s"] { 
	border-radius: 3px;
	box-shadow: 3px 3px 3px rgba(0,0,0,0.3);
	}
button[class*="rad4s"] {
	border-radius: 4px;
	box-shadow: 3px 3px 3px rgba(0,0,0,0.3);
	}
button[class*="rad5s"] {
	border-radius: 5px;
	box-shadow: 3px 3px 3px rgba(0,0,0,0.3);
	}
button[class*="rad6s"] {
	border-radius: 6px;
	box-shadow: 3px 3px 3px rgba(0,0,0,0.3);
	}
button[class*="rad8s"] {
	border-radius: 8px;
	}
button[class*="rad10s"] {
	border-radius: 10px;
	box-shadow: 3px 3px 3px rgba(0,0,0,0.3);
	}
button[class*="rad12s"] {
	border-radius: 12px;
	box-shadow: 3px 3px 3px rgba(0,0,0,0.3);
	}
button[class*="rad14s"] {
	border-radius: 14px;
	box-shadow: 3px 3px 3px rgba(0,0,0,0.3);
	}	
button[class*="rad16s"] {
	border-radius: 16px;
	box-shadow: 3px 3px 3px rgba(0,0,0,0.3);
	}