/*--- Copyright(c) 2025, nsym@tamba-ya.com ---*/

@charset "utf-8";

* { margin: 0; padding: 0; }

body {
  background: linear-gradient(to right, #cfaf60, #eefff0);
  font-family: Helvetica,Arial,Roboto,Droid Sans,”游ゴシック”,YuGothic,"ヒラギノ角ゴ ProN W3″,Hiragino Kaku Gothic ProN,”メイリオ”,Meiryo,sans-serif;
}

img { vertical-align: middle; }

.subtitle {
  font-size: 1.3em;
  margin-top: -2.5em;
  margin-left: 5em;
  margin-bottom: 1.2em;
  color: #000000;
}
.colbox {
  width: 100%;
}
.footbox {
  margin-top: 1em;
  float: left;
  width: 98%;
  margin-left: 1%;
}

.subject {
  background: linear-gradient(0deg, rgba(0,0,0,0), rgba(0,140,120,0.2), rgba(0,0,0,0), rgba(0,0,0,0));
  font-size: 1.2em;
  font-weight: normal;
}

ul { margin-left: 1.5em; }

/*--- for small device ---*/
@media screen and (max-width:767px) {
  body {
    width: 98%;
    margin-left: 1%;
  }
  header { margin-top: 2px; }
  .image-pic {
    height: 8em;
    width: 100%;
  }
  .subtitle {
    font-size: 1em;
    width: 80%;
    align: center;
    text-align: center;
    margin-top: -3em;
    margin-left: 2em;
    margin-bottom: 2em;
  }
  .subject {
    font-size: 1.1em;
  }
}

/*--- for medium device (1) ---*/
@media screen and (min-width:768px) and (max-width:1024px) {
  body {
    width: 94%;
    margin-left: 3%;
  }
  header { margin-top: 5px; }
  .image-pic { width: 100%; }
}

/*--- for medium device (2) ---*/
@media screen and (min-width:1025px) and (max-width:1359px) {
  body {
    width: 80%;
    margin-left: 10%;
  }
  header { margin-top: 1em; }
  .image-pic { width: 100%; }
  .colbox {
     float: left;
     width: 48.5%;
     margin-left: 1%;
     *clear: right;
  }
}

/*--- for large device (1) ---*/
@media screen and (min-width:1360px) and (max-width:1600px) {
  body {
    width: 70%;
    margin-left: 15%;
  }
  header { margin-top: 1.5em; }
  .image-pic { width: 100%; }
  .colbox {
     float: left;
     width: 47%;
     margin-left: 2%;
     *clear: right;
  }
}

/*--- for large device (2) ---*/
@media screen and (min-width:1601px) {
  body {
    width: 60%;
    margin-left: 20%;
  }
  header { margin-top: 1.5em; }
  .image-pic { width: 100%; }
  .colbox {
     float: left;
     width: 47%;
     margin-left: 2%;
     *clear: right;
  }
}