@charset "utf-8";

body {
    font-family: "Yu Gothic", "MS PGothic", "Hiragino Kaku Gothic ProN", "Meiryo" ;
    min-width: 320px;
    max-width: 980px;
    margin: 5px;
}

.contents {
     width: 100%;
     max-width: 1200px;
     margin: auto;
 }
 .contents img {
     width: 300px;
 }
 .text-center {
     text-align: center;
 }
 .flexbox {
     display: flex;
 }
 .box1 {
     width: 300px;
     margin-top: 10px;
     margin-left: 10px;
     margin-right: 10px;
 }
 .box2 {
     width: ;
     margin-top: 0;
     margin-right: 10px;
 }

 @media screen and (max-width: 767px) {
     .flexbox {
         display: block;
     }
     .flexbox .box1 {
         width: 300px;
         margin-left: 10px;
         margin-right: 10px;
     }
     .flexbox .box2 {
         width: 100%;
         margin-top: 0;
         margin-left: 10px;
     }
 }