body{
    background-image: url(img/greenback.jpg);
    background-size:cover;
    font-family: "Helvetica Neue",
    Arial,
    "Hiragino maru Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
    margin-right: 5%;
    margin-left: 5%;
    margin-bottom: 5%;
}

.wrap{
    max-width: 768px;
    margin: 0 auto;
}

.logo img {
width: 70%;
height: 70%;
margin-top: 5%;
margin-bottom: 5%;
margin-right: 15%;
margin-left: 15%;}
.kochira{
  text-align: center;
}
.kochira img{
  width: 50%;
}

.time{
    text-align: center;
    margin-top: -5%;
    margin-right: 5%;
    margin-left: 5%;
    }
.time h1{
    position: relative;
    z-index: 10000;
    font-size: 20px;
    font-weight: 900;
    padding: 1.5em;/*文字周りの余白*/
    color: #ff962a;/*文字色*/
    background: #fffbd2;/*背景色*/
    border-top: solid 2px #79422b/*上線*/;
    border-bottom: solid 2px #79422b;/*下線*/;
    border-right: solid 2px #79422b/*上線*/;
    border-left: solid 2px #79422b/*上線*/;
    border-radius:  10px;
    padding-top: 5%;
    padding-bottom: 5%;
}
.what{
    color: #fffbd2;
    text-align: center;
margin-right: 25%;
margin-left: 25%;}

.what h2{
    font-size: 20px;
    font-weight: bold;
    color: #fffbd2/*文字色*/;
    padding: 10px;
    padding-right: 10px;
    margin-bottom: 10px;
    border: 1px;
    border-radius: 10px;
    background-color: #5196d1;
}
.content{
    color: #fffbd2;
    text-align: center;
margin-right: 5%;
margin-left: 5%;}
.content p{
    font-size: 15px;
    font-weight: bold;
    padding: 3em;/*文字周りの余白*/
    color: #fffbd2;/*文字色*/
    background: #ff962a;/*背景色*/
    border-radius:  80%;
}

.topic1{
    display: flex;
}
.topic1 img{
    width: 50%;
    height: 50%;}

.topic2{
    display: flex;
}
.topic2 img{
    width: 50%;
    height: 50%;}

    .topic3{
        display: flex;
    }
    .topic3 img{
        width: 50%;
        height: 50%;}
.rights{
    font-size: 15px;
    color: #fffbd2;/*文字色*/
    text-align: center;
    margin-top: 5%;
}

@media (min-width:1px) and (max-width:767px){
    body{
    background-image: url(img/greenback.jpg);
    background-size:cover;
    font-family: "Helvetica Neue",
    Arial,
    "Hiragino maru Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
    margin-right: 5%;
    margin-left: 5%;
    margin-bottom: 5%;
}

.wrap{
    max-width: 768px;
    margin: 0 auto;
}

.logo img {
width: 70%;
height: 70%;
margin-top: 5%;
margin-bottom: 5%;
margin-right: 15%;
margin-left: 15%;}
.kochira{
  text-align: center;
}
.kochira img{
  width: 55%;
}

.time{
    text-align: center;
    margin-top: -5%;
    margin-right: 5%;
    margin-left: 5%;
    }
.time h1{
    position: relative;
    z-index: 10000;
    font-size:15px;
    font-weight: 900;
    padding: 1.5em;/*文字周りの余白*/
    color: #ff962a;/*文字色*/
    background: #fffbd2;/*背景色*/
    border-top: solid 2px #79422b/*上線*/;
    border-bottom: solid 2px #79422b;/*下線*/;
    border-right: solid 2px #79422b/*上線*/;
    border-left: solid 2px #79422b/*上線*/;
    border-radius:  10px;
    padding-top: 5%;
    padding-bottom: 5%;
}
.what{
    color: #fffbd2;
    text-align: center;
margin-right: 25%;
margin-left: 25%;
margin-top: 10%;}

.what h2{
    font-size: 15px;
    font-weight: bold;
    color: #fffbd2/*文字色*/;
    padding: 10px;
    padding-right: 10px;
    margin-bottom: 10px;
    border: 1px;
    border-radius: 10px;
    background-color: #5196d1;
}
.content{
    color: #fffbd2;
    text-align: center;
margin-right: 5%;
margin-left: 5%;}
.content p{
    font-size: 11px;
    font-weight: bold;
    padding: 3em;/*文字周りの余白*/
    color: #fffbd2;/*文字色*/
    background: #ff962a;/*背景色*/
    border-radius:  80%;
}

.topic1{
    display: flex;
}
.topic1 img{
    width: 50%;
    height: 50%;}

.topic2{
    display: flex;
}
.topic2 img{
    width: 50%;
    height: 50%;}

    .topic3{
        display: flex;
    }
    .topic3 img{
        width: 50%;
        height: 50%;}
.rights{
    font-size: 10px;
    color: #fffbd2;/*文字色*/
    text-align: center;
    margin-top: 5%;
}
}

@media  (min-width: 768px) and (max-width: 1000px) {
    body{
    background-image: url(img/greenback.jpg);
    background-size:cover;
    font-family: "Helvetica Neue",
    Arial,
    "Hiragino maru Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
    margin-right: 5%;
    margin-left: 5%;
    margin-bottom: 5%;
}

.wrap{
    max-width: 768px;
    margin: 0 auto;
}

.logo img {
width: 70%;
height: 70%;
margin-top: 5%;
margin-bottom: 5%;
margin-right: 15%;
margin-left: 15%;}
.kochira{
  text-align: center;
}
.kochira img{
  width: 50%;
}

.time{
    text-align: center;
    margin-top: -5%;
    margin-right: 5%;
    margin-left: 5%;
    }
.time h1{
    position: relative;
    z-index: 10000;
    font-size: 20px;
    font-weight: 900;
    padding: 1.5em;/*文字周りの余白*/
    color: #ff962a;/*文字色*/
    background: #fffbd2;/*背景色*/
    border-top: solid 2px #79422b/*上線*/;
    border-bottom: solid 2px #79422b;/*下線*/;
    border-right: solid 2px #79422b/*上線*/;
    border-left: solid 2px #79422b/*上線*/;
    border-radius:  10px;
    padding-top: 5%;
    padding-bottom: 5%;
}
.what{
    color: #fffbd2;
    text-align: center;
margin-right: 25%;
margin-left: 25%;}

.what h2{
    font-size: 20px;
    font-weight: bold;
    color: #fffbd2/*文字色*/;
    padding: 10px;
    padding-right: 10px;
    margin-bottom: 10px;
    border: 1px;
    border-radius: 10px;
    background-color: #5196d1;
}
.content{
    color: #fffbd2;
    text-align: center;
margin-right: 5%;
margin-left: 5%;}
.content p{
    font-size: 15px;
    font-weight: bold;
    padding: 3em;/*文字周りの余白*/
    color: #fffbd2;/*文字色*/
    background: #ff962a;/*背景色*/
    border-radius:  80%;
}

.topic1{
    display: flex;
}
.topic1 img{
    width: 50%;
    height: 50%;}

.topic2{
    display: flex;
}
.topic2 img{
    width: 50%;
    height: 50%;}

    .topic3{
        display: flex;
    }
    .topic3 img{
        width: 50%;
        height: 50%;}
.rights{
    font-size: 15px;
    color: #fffbd2;/*文字色*/
    text-align: center;
    margin-top: 5%;
}
}