<@charset "UTF-8";>

.contents {
     width: 767%;
     max-width: 740px;
     margin: auto;
 }

 }
 .box3 img {
     width: 100%;
 }
 .box4 img {
     width: 100%;
 }
 
 .text-center {
     text-align: center;
 }
 

 .flexbox2{
     display:flex;
     flex-wrap:wrap;
 }
  .box1{
     margin: 0;
     padding: 10px 5px 10px 5px;
     width: 30%;
 }
 .box3{
     margin: 0;
     padding: 10px 5px 10px 5px;
     width: 18%;
 }
 
 .box4{
     margin: 0;
     padding: 10px 5px 10px 5px;
     width: 18%;
     margin-right: 15px;
 }
   .box5{
     margin: 0;
     padding: 10px 5px 10px 5px;
     width: 16%;
 }
  .box6{
     margin: 0;
     padding: 10px 5px 10px 5px;
     width: 15%;
 }
 
 
 .p1{
     font-size:18px;
     font-weight: bold;
 }
 .p2{
     height:14px;
     text-align: center;
 }
  .p3{
     height:20px;
     text-align: center;
 }
   .p4{
     font-size:16px;
 }
.br-pc { display:block; }
.br-sp { display:none; }

a.popup:hover {
position: relative;
text-decoration: none;
}
a.popup span {
display: none;
position: absolute;
top: 1em;
left: 0;
}
a.popup:hover span {
border: none;
display: block;
width: 0%;
}
  
 @media screen and (max-width: 767px) {
      .flexbox2{
     display:flex;
     flex-wrap:wrap;
 }
     .flexbox2 .box1 {
         width: 60%;
        margin-right: 40%;
     }
     
      .flexbox2 .box3 {
         padding: 5px;
         width: 22%;
     }
     
      .flexbox2 .box4 {
         padding: 5px;
         width: 22%;
         margin-right: 65%;
         
     }
     
      .flexbox2 .box5 {
         padding: 5px;
         width: 18%;
         margin-right: 5%;
     }
     
      .flexbox2 .box6 {
         padding: 2px;
         width: 17%;
     }
      
      .p1{
     font-size:14px;
     font-weight: bold;
 }
      
     .flexbox2 .p2 {
         height: 12px;
         font-size: 8px;
         text-align: center;
     }
     .flexbox2 .p3 {
         height: 25px;
         font-size: 8px;
         text-align: center;
     }
     
     .p4 {
         font-size: 14px;
     }
     
      .img-mid {
     width: 70%;
     }

     .br-pc {
         display:none; 
     }
     .br-sp {
         display:block; 
         }
a.popup:hover {
position: relative;
text-decoration: none;
}
a.popup span {
display: none;
position: absolute;
top: 1em;
left: 0;
}
a.popup:hover span {
border: none;
display: block;
width: 0%;
}


 }