.menu{
    display: flex;
    justify-content:space-around;
    text-align: center;
}
.font-c{
    font-size: 18px;
    width: 40%;
}
.menu-title{
    color: #fff;
    background-color: #F05E58;
}
.link-box{
    display: flex;
    justify-content: stretch;
}
.css-box a{
    text-decoration: none;
    color: #fff;
}
.menu .beginner{
    background-color: #35B2C4;
    width: 33%;
    color: #fff;
    font-size: 70%;
}
.menu .standard{
    background-color: #37A582;
    width: 34%;
    color: #fff;
    font-size: 70%;
}
.menu .advance{
    background-color: #F6AB00;
    width: 33%;
    color: #fff;
    font-size: 70%;
}
.TOKYO,.well-question{
    color: #F05E58;
    background-color: #fff;
    border-width: 5px;
    border-style: solid;
    border-color: #F05E58;
}
.box{
    margin-top: 5%;
    margin-bottom: 8%;
}
.w{
    width: 41.7%;
}
.announce{
    color: #fff;
    background: #F05E58;
}
.page-link a:link {
    color: #F05E58;
    /* text-decoration: underline; */
   }
   
   .page-link a:visited {
    color: #F05E58;
    text-decoration: underline;
}
   
.page-link a:active {
    color: #F05E58;
    text-decoration: underline;
}
.page-link .intlo-c{
    background-color: #F05E58;
}
h2{
    color: #37A582;
}
span{
    color:red;
}
.description{
    display: flex;
}
.III{
    display: flex;
}
a:hover {
    text-decoration: underline;
}
@media screen and (max-width: 800px){
    .menu{
        display: block;
        text-align: center;
    }    
    .logo{
        text-align: center;
        width: 100%;
    }
    .menu img{
       width:  100%;
       justify-content: center;
    }
    .font-c{
        font-size: 20px;
        width: 100%;
    }
}