@charset "utf-8";
/*-----------------------------------------------
kit
-----------------------------------------------*/

#kit {
  width: 100%;
  margin:2em auto 5em;
}



#kit h2.kitttl {font-size: 3.5em; font-weight: bold;}

#kit h2 { margin-top: 2em;  margin-bottom: 0 !important;}

#kit img { margin-bottom: 1em;}


#kit .pointbox {display:flex;}

#kit .pointboxitem { width: 25%; padding: 1em;}

#kit .pointboxitem h3 { text-align: center; margin-bottom: 1em;}


table.koumoku{
  border-collapse: collapse;
  width: 100%;
    margin: 2em auto;
}
table.koumoku th,
table.koumoku td{
  padding: 10px;
  border: solid 1px #ccc;
  box-sizing:border-box;
}
table.koumoku th {
  background: rgba(118,132,102,0.1);
  color: #768466;
  font-size:1.5em;
  font-weight: bold;
    width: 15%;
    text-align:center;
  
}
table.koumoku td.subcate {width: 15%; text-align: center; background: rgba(118,132,102,0.03);}
table.koumoku p {font-size:0.8em !important;}



/***************************************************************************************************************************

for max-width: 768px

*****************************************************************************************************************************/
@media screen and (max-width: 768px) {
  #kit {
    width: 100%;
    padding-bottom: 3em;
  }
 
    
#kit h2.kitttl {font-size: 2.2em; font-weight: bold;}    
#kit .pointbox {
    display: flex;
    flex-wrap: wrap;
}    
#kit .pointboxitem { width: 50%; padding: 0.5em;}

   
    
table.koumoku {
    width: 100%;
  }
table.koumoku th,
table.koumoku td {
    display: block;
    width: 100%;
    border-bottom:none;
  }
table.koumoku tr:last-child{
    border-bottom: solid 1px #ccc;
  } 
    
table.koumoku td.subcate {width: 100%; text-align: center; background: rgba(118,132,102,0.02);} 
table.koumoku p {font-size:0.75em !important; line-height: 1.5em !important;}    
    
    
    
}