/*=====各画像ボックス=====*/

.box_base img{
    margin-right: 150px;
    width:80%;
    margin-left: -1px ;
}

.box01{
	float:left;
	position:relative;
	width:15%; height: auto; 
	margin: 0px 8px 55px 0px;
    padding:5px 3px 0 3px;
    background-color: #FFFFFF;
	border: 3px solid #F42D96;
    border-radius: 5%;
    transform-origin: top left;
    transition: transform .3s;
    z-index: 10011;

}

.box01 img{
	width: 100%;
    height: auto;
	border-radius: 5%;
    box-sizing: border-box;
}

.box01:hover {
    transform:  translate(-10%,0%) scale(1.2, 1.2);
    z-index: 100022;
	border: 3px solid #F42D96;
}


.box02{
	float:left;
	position:relative;
	width:15%; height: auto; 
	margin: 0px 8px 55px 0px;
    padding:5px 3px 0 3px;
    background-color: #FFFFFF;
	border: 3px solid #00BE03;
    border-radius: 5%;
    transform-origin: top left;
    transition: transform .3s;
    z-index: 10010;
}

.box02 img{
	width: 100%;
    height: auto;
	border-radius: 5%;
    box-sizing: border-box;
}
.box02:hover {
    transform:  translate(-10%,0%) scale(1.2, 1.2);
    z-index: 100023;
	border: 3px solid #00BE03;
}

.box03{
	float:left;
	position:relative;
	width:15%; height: auto; 
	margin: 0px 8px 55px 0px;
    padding:5px 3px 0 3px;
    background-color: #FFFFFF;
	border: 3px solid #EEB946;
    border-radius: 5%;
    transform-origin: top left;
    transition: transform .3s;
    z-index: 10009;
}

.box03 img{
	width: 100%;
    height: auto;
	border-radius: 5%;
    box-sizing: border-box;
}
.box03:hover {
    transform:  translate(-10%,0%) scale(1.2, 1.2);
    z-index: 100024;
	border: 3px solid #EEB946;
}

.box04{
	float:left;
	position:relative;
	width:15%; height: auto; 
	margin: 0px 8px 55px 0px;
    padding:5px 3px 0 3px;
    background-color: #FFFFFF;
	border: 3px solid #EE5511;
    border-radius: 5%;
    transform-origin: top left;
    transition: transform .3s;
    z-index: 10008;
}

.box04 img{
	width: 100%;
    height: auto;
	border-radius: 5%;
    box-sizing: border-box;
}
.box04:hover {
    transform:  translate(-10%,0%) scale(1.2, 1.2);
    z-index: 100025;
	border: 3px solid #EE5511;
}

.box05{
	float:left;
	position:relative;
	width:15%; height: auto; 
	margin: 0px 8px 55px 0px;
    padding:5px 3px 0 3px;
    background-color: #FFFFFF;
	border: 3px solid #5511DD;
    border-radius: 5%;
    transform-origin: top left;
    transition: transform .3s;
    z-index: 10007;
}

.box05 img{
	width: 100%;
    height: auto;
	border-radius: 5%;
    box-sizing: border-box;
}
.box05:hover {
    transform:  translate(-10%,0%) scale(1.2, 1.2);
    z-index: 100026;
	border: 3px solid #5511DD;
}


/*=====スマホ用=====*/
@media screen and (max-width: 699px) {


.box_base img{
    margin-right: 50px;
    width:100%;
    margin-left: -1px ;
}
.box_base2 img{
    margin-right: 150px;
    width:100%;
    margin-left: -1px ;
}

.box01{
	float:left;
	position:relative;
	width:15%; height: auto;
	margin: 0px 2px 10px 0px;
    padding:5px 3px 5px 3px;
    background-color: #FFFFFF;
	border: 2px solid #F42D96;
	border-radius: 5%;
    transform-origin: top left;
    transition: transform .3s;
    z-index: 10020;
}

.box01 img{
	width: 100%;
    height: auto;
	border-radius: 5%;
    box-sizing: border-box;
    margin-right: 0px
}
.box01:hover {
    transform:  translate(-6%,0%) scale(1.18, 1.18);
    z-index: 100019;
	border: 2px solid #F42D96;
}


.box02{
	float:left;
	position:relative;
	width:15%; height: auto;
	margin: 0px 2px 10px 0px;
    padding:5px 3px 5px 3px;
    background-color: #FFFFFF;
	border: 2px solid #00BE03;
	border-radius: 5%;
    transform-origin: top left;
    transition: transform .3s;
    z-index: 10019;
}

.box02 img{
	width: 100%;
    height: auto;
	border-radius: 5%;
    box-sizing: border-box;
}
.box02:hover {
    transform:  translate(-6%,0%) scale(1.18, 1.18);
    z-index: 100018;
	border: 2px solid #00BE03;
}

.box03{
	float:left;
	position:relative;
	width:15%; height: auto;
	margin: 0px 2px 10px 0px;
    padding:5px 3px 5px 3px;
    background-color: #FFFFFF;
	border: 2px solid #EEB946;
	border-radius: 5%;
    transform-origin: top left;
    transition: transform .3s;
    z-index: 10018;
}

.box03 img{
	width: 100%;
    height: auto;
	border-radius: 5%;
    box-sizing: border-box;
}
.box03:hover {
    transform:  translate(-6%,0%) scale(1.18, 1.18);
    z-index: 100017;
	border: 2px solid #EEB946;
}

.box04{
	float:left;
	position:relative;
	width:15%; height: auto;
	margin: 0px 2px 10px 0px;
    padding:5px 3px 5px 3px;
    background-color: #FFFFFF;
	border: 2px solid #EE5511;
	border-radius: 5%;
    transform-origin: top left;
    transition: transform .3s;
    z-index: 10017;
}

.box04 img{
	width: 100%;
    height: auto;
	border-radius: 5%;
    box-sizing: border-box;
}
.box04:hover {
    transform:  translate(-6%,0%) scale(1.18, 1.18);
    z-index: 100016;
	border: 2px solid #EE5511;

}

.box05{
	float:left;
	position:relative;
	width:15%; height: auto;
	margin: 0px 2px 10px 0px;
    padding:5px 3px 5px 3px;
    background-color: #FFFFFF;
	border: 2px solid #5511DD;
	border-radius: 5%;
    transform-origin: top left;
    transition: transform .3s;
    z-index: 10016;
}

.box05 img{
    width: 100%;
    height: auto;
    border-radius: 5%;
    box-sizing: border-box;
}
.box05:hover {
    transform:  translate(-6%,0%) scale(1.18, 1.18);
    z-index: 100015;
    border: 2px solid #5511DD;
}

}