@charset "utf-8";
/* CSS Document */

/* PC and Tablet ////////////////////////*/
@media screen and (min-width: 600px){

/**/
.read{ box-sizing:border-box; width:100%; border-bottom:10px solid #FFF; border-left:10px solid #FFF; border-right:10px solid #FFF; background-color:#FFF; }
.read div.textBox{ float:left; }
.read div.imgBox{ width:33.333%; float:right; }
.read div.imgBox img{ width:100%; }
.read h2{ margin-bottom:15px; font-size:120%; font-weight:bold; }
.read h3{ font-size:100%; margin-bottom:15px; font-weight:bold;  }

/**/
div.subBoxs section{ box-sizing:border-box; float:left; width:33.3333%; height:240px; padding:30px; border-bottom: 10px solid #FFF; }
div.subBoxs section:nth-child(1){ border-left: 10px solid #FFF; border-right: 5px solid #FFF; }
div.subBoxs section:nth-child(2){ border-left: 5px solid #FFF; border-right: 5px solid #FFF; }
div.subBoxs section:nth-child(3){ border-left: 5px solid #FFF; border-right: 10px solid #FFF; }

div.subBoxs section h2{ margin-bottom:10px; font-size:120%; font-weight:bold; }

}

/* SmartPhone  ////////////////////////*/
@media screen and (max-width: 599px){

/**/
.read{ box-sizing:border-box; width:100%; border-bottom:4px solid #FFF; border-left:4px solid #FFF; border-right:4px solid #FFF; background-color:#FFF; }
.read div.textBox{ float:left; }
.read div.imgBox{ width:100%; float:right; }
.read div.imgBox img{ width:100%; }
.read h2{ margin-bottom:15px; font-size:105%; font-weight:bold; }
.read h3{ font-size:85%; margin-top:5px; margin-bottom:15px; font-weight:bold; line-height:1.4em; }

.read p br.spn{ display: none; }

/**/
div.subBoxs section{ box-sizing:border-box; float:left; width:100%; padding:20px 10px;border-left: 4px solid #FFF; border-right: 4px solid #FFF; border-bottom: 4px solid #FFF; }
div.subBoxs section h2{ margin-bottom:5px; font-size:105%; font-weight:bold; }

}
