/*ーーーーーーーーーーーーーーーーーーーー
PCとスマホの画像サイズを同じにする割合
ーーーーーーーーーーーーーーーーーーーーー*/
.pcm100 {
	width: 100%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.pcm90 {
	width: 90%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.pcm80 {
	width: 80%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.pcm70 {
	width: 70%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.pcm60 {
	width: 60%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.pcm50 {
	width: 50%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.pcm40 {
	width: 40%;
	margin-right: auto;
	margin-left: auto;
	display: block;
	background-color: #0FF;
}
.pcm30 {
	width: 30%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.pcm20 {
	width: 20%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.pcm10 {
	width: 10%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}

/*ーーーーーーーーーーーーーーーーーーーー
PCが任意の大きさでスマホの画像サイズが100%にする場合
ーーーーーーーーーーーーーーーーーーーーー*/
.photo100,.photo90,.photo80,.photo70,.photo60,.photo50,.photo40,.photo30,.photo20,.photo10 {
	width: 100%;
	display: block;
	margin-right: auto;
	margin-left: auto;
}
@media screen and (min-width: 760px)  { 
.photo100 {
	width: 100%;
	display: block;
	margin-right: auto;
	margin-left: auto;
}
.photo90 {
	width: 90%;
	display: block;
	margin-right: auto;
	margin-left: auto;
}
.photo80 {
	width: 80%;
	display: block;
	margin-right: auto;
	margin-left: auto;
}
.photo70 {
	width: 70%;
	display: block;
	margin-right: auto;
	margin-left: auto;
}
.photo60 {
	width: 60%;
	display: block;
	margin-right: auto;
	margin-left: auto;
}
.photo50 {
	width: 50%;
	display: block;
	margin-right: auto;
	margin-left: auto;
}
.photo40 {
	width: 40%;
	display: block;
	margin-right: auto;
	margin-left: auto;
}
.photo30 {
	width: 30%;
	display: block;
	margin-right: auto;
	margin-left: auto;
}
.photo20 {
	width: 20%;
	display: block;
	margin-right: auto;
	margin-left: auto;
}
.photo10 {
	width: 10%;
	display: block;
	margin-right: auto;
	margin-left: auto;
}
}


/*ーーーーーーーーーーーーーーーーーーーー
PCとスマホの画像サイズを各々に設定する場合
ーーーーーーーーーーーーーーーーーーーーー*/
/*スマホの画像サイズ*/
.sp_img100 {
	width: 100%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.sp_img90 {
	width: 90%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.sp_img80 {
	width: 80%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.sp_img70 {
	width: 70%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.sp_img60 {
	width: 60%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.sp_img50 {
	width: 50%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.sp_img40 {
	width: 40%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.sp_img30 {
	width: 30%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.sp_img20 {
	width: 20%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.sp_img10 {
	width: 10%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}

/*PCの画像サイズ*/
@media screen and (min-width: 760px)  { 
.pc_img100 {
	width: 100%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.pc_img90 {
	width: 90%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.pc_img80 {
	width: 80%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.pc_img70 {
	width: 70%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.pc_img60 {
	width: 60%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.pc_img50 {
	width: 50%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.pc_img40 {
	width: 40%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.pc_img30 {
	width: 30%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.pc_img20 {
	width: 20%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.pc_img10 {
	width: 10%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
}











.but100,.but90,.but80,.but70,.but60,.but50,.but40,.but30,.but20,.but10 {
	width: 90%;	
	margin-right: auto;
	margin-left: auto;
}
.but100 a,.but90 a,.but80 a,.but70 a,.but60 a,.but50 a,.but40 a,.but30 a,.but20 a,.but10 a {
	border-radius: 10px;
	box-shadow:0 1px 3px rgba(0,0,0,0.5);
	padding-top: 1em;
	padding-right: 2em;
	padding-bottom: 1em;
	padding-left: 2em;
	text-decoration: none;
	display: block;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
	background-color: #FF0;
}
.but100 a:hover,.but90 a:hover,.but80 a:hover,.but70 a:hover,.but60 a:hover,.but50 a:hover,.but40 a:hover,.but30 a:hover,.but20 a:hover,.but10 a:hover {
background-color: #0FF;
}


.but100 {
	width: 100%;
}
.but90 {
	width: 90%;
}
.but80 {
	width: 80%;
}
.but70 {
	width: 70%;
}
.but60 {
	width: 60%;
}
.but50 {
	width: 50%;
}
.but40 {
	width: 40%;
}
.but30 {
	width: 30%;
}
.but20 {
	width: 20%;
}
.but10 {
	width: 10%;
}
}
