

/*** for PC Browser ***/
@media (min-width:401px)
{
.nav {
display: flex;
background: linear-gradient(#4a488e,#dbd0e6);
}
.a1{
width: 25%;

text-align: center;
color: white;
font-weight: bold;
padding: 8px 0;
}
.a1 a{
color: white !important;
}
.a1 a:hover{
color: red !important;
}
.keitai{
display: none;
}
.pict{
display: flex;
}
.big{
display: flex;
margin-left: 10%;
margin-right: 10%;
}
.hidari{
margin-right: 5%;
}
}


/*** for Smart Phone ***/
@media (max-width:400px)
{
.nav {
display: flex;
background: linear-gradient(#4a488e,#dbd0e6);
display: none;
}
.a1{
width: 25%;
font-size: 0.8em;
text-align: center;
color: white;
font-weight: bold;
padding: 8px 0;
}
.a2 a{
color: white !important;
}
.a2 a:hover{
color: red !important;
}
.keitai {
display: flex;
background: linear-gradient(#4a488e,#dbd0e6);
}
.a2{
width: 25%;
font-size: 0.8em;
text-align: center;
color: white;
font-weight: bold;
padding: 8px 0;
}
.pict{
margin-left: 8%;
margin-right: 8%;
}
.pict img{
width: 40%;
margin-left: 5%;
margin-right: 5%;
}
.big{
display: flex;
}
.migi{
width: 50%;
}
.hidari{
width: 50%;
}
.migi img{
width: 80%;
margin-left: 10%;
margin-right: 10%;
}
.hidari img{
width: 80%;
margin-left: 10%;
margin-right: 10%;
}
}
