/* cf */
/*--HRSdesignCSS -- 2015,11,10 Rel-ish yuki--*/
/* topics */
.topics {
  max-width: 1000px;
  margin: 0 auto;
  padding: 3%;
  background: #f2f6f9;
  font-size: 87.5%;
}
.topics h1 {
  color: #279898;
  font-size: 112.5%;
  font-weight: normal;
}
.topics dl {
  margin: 3% 0;
}
.topics dt {
  color: #269898;
}
.topics dd {
  margin: 0 0 3%;
}
.topics dd a:link {
  text-decoration: none;
}
.topics dd a:hover {
  text-decoration: underline;
}
.topics p.readMore {
  padding: 5px 0;
  background: #fff;
  text-align: center;
}
.topics p.readMore a {
  display: block;
}
.topics p.readMore a:link {
  text-decoration: none;
}
.topics p.readMore a:hover {
  text-decoration: underline;
}

/* aboutHirose */
.aboutHirose {
  max-width: 1000px;
  margin: 0 auto;
  padding: 3%;
  background: #AFE9E9;
  color: #269898;
}
.aboutHirose ul {
  text-align: center;
}
.aboutHirose li {
  display: inline-block;
  margin: 0 0 3%;
}
.aboutHirose li span {
  display: block;
  font-size: 87.5%;
}

/* hiroseCase */
.hiroseCase {
  max-width: 1000px;
  margin: 0 auto;
  padding: 3%;
  background: #F2F6F9;
}
.hiroseCase h1 {
  font-weight: normal;
}
.hiroseCase ul {
  margin: 3% 0;
  text-align: center;
}
.hiroseCase li {
  display: inline-block;
  margin: 0 0 3%;
}
.hiroseCase li span {
  display: block;
  font-size: 87.5%;
  text-align: left;
}

/* PageTop */
p.readMore {
  padding: 5px 0;
  background: #fff;
  text-align: center;
}
p.readMore a {
  display: block;
}
p.readMore a:link {
  text-decoration: none;
}
p.readMore a:hover {
  text-decoration: underline;
}

/* = MEDIA = */
@media only screen and (min-width: 769px) {
  /* topics */
  .topics {
    max-width: 940px;
    padding: 15px 30px 30px;
    font-size: 100%;
  }
  .topics h1 {
    color: #279898;
    font-size: 125%;
    font-weight: normal;
  }
  .topics dl {
    margin: 20px 0 45px;
    font-size: 87.5%;
  }
  .topics dt {
    float: left;
    width: 110px;
    margin: 0 0 13px 0;
    clear: left;
  }
  .topics dd {
    margin: 0 0 13px 110px;
  }
  .topics dd a:link {
    text-decoration: none;
  }
  .topics dd a:hover {
    text-decoration: underline;
  }

  /* aboutHirose */
  .aboutHirose {
    max-width: 940px;
    padding: 70px 30px 70px;
  }
  .aboutHirose ul {
    margin: 0 -16px 40px;
    text-align: center;
  }
  .aboutHirose li {
    margin: 0 8px;
  }
  .aboutHirose li span {
    text-align: left;
    font-size: 125%;
  }
  .aboutHirose p {
    text-align: center;
    font-size: 112.5%;
  }

  /* hiroseCase */
  .hiroseCase {
    max-width: 940px;
    padding: 40px 30px;
  }
  .hiroseCase h1 {
    text-align: center;
    font-size: 125%;
    line-height: 160%;
  }
  .hiroseCase ul {
    margin: 40px -16px 0;
    text-align: center;
  }
  .hiroseCase li {
    margin: 0 8px 50px;
  }
  .hiroseCase li span {
    display: block;
    font-size: 87.5%;
    text-align: left;
  }

  /* PageTop */
  p.readMore {
    width: 120px;
    padding: 5px 0;
  }
  p.readMore a {
    display: block;
  }
  p.readMore a:link {
    text-decoration: none;
  }
  p.readMore a:hover {
    text-decoration: underline;
  }
}