@charset "utf-8";

/** margin bottom **/
.mb-1h { margin-bottom:  5px; }
.mb-1  { margin-bottom: 10px; }
.mb-2  { margin-bottom: 20px; }
.mb-3  { margin-bottom: 24px; }
.mb-4  { margin-bottom: 28px; }
.mb-5  { margin-bottom: 32px; }
.mb-6  { margin-bottom: 36px; }
.mb-7  { margin-bottom: 48px; }
.mb-8  { margin-bottom: 52px; }
.mb-9  { margin-bottom: 72px; }

/** help **/
main div.inner {
  word-wrap: break-word;
  margin-bottom: 78px;
  width: 960px;
}
main h1 {
  margin: 28px 0 20px 0;
  width: 100%;
  height: 40px;
  font-size: 18px;
  font-family: 'Roboto',"游ゴシック体","Yu Gothic",YuGothic,HiraKakuProN-W6,HiraKakuPro-W6,'ヒラギノ角ゴ ProN W6','ヒラギノ角ゴ Pro W6','メイリオ',Meiryo,'ＭＳ ゴシック',Arial,HelveticaNeue,Helvetica,'Lucida Grande',sans-serif;
  font-weight: bold;
  line-height: 40px;
  text-align: center;
  background-color: rgb(255,153,153);
}
main h1 span {
  display: block;
  margin: 0 auto;
  width: 960px;
  height: 40px;
  font-size: 22px;
  letter-spacing: 0.2em;
  color: rgb(25,25,25);
  background-color: rgb(255,102,102);
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
}
main h2 {
  margin: 56px 0 20px 0;
  padding: 0;
  width: 100%;
  height: 32px;
  font-size: 19px;
  font-family: 'Roboto',"游ゴシック体","Yu Gothic",YuGothic,HiraKakuProN-W6,HiraKakuPro-W6,'ヒラギノ角ゴ ProN W6','ヒラギノ角ゴ Pro W6','メイリオ',Meiryo,'ＭＳ ゴシック',Arial,HelveticaNeue,Helvetica,'Lucida Grande',sans-serif;
  font-weight: bold;
  line-height: 32px;
  background-color: rgb(204,204,204);
  text-align: center;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
}
main div.inner h2:first-child {
  margin-top: 0;
}
main h3 {
  margin: 20px 120px 12px 120px;
  padding: 0;
  font-size: 16px;
  font-family: 'Roboto',"游ゴシック体","Yu Gothic",YuGothic,HiraKakuProN-W6,HiraKakuPro-W6,'ヒラギノ角ゴ ProN W6','ヒラギノ角ゴ Pro W6','メイリオ',Meiryo,'ＭＳ ゴシック',Arial,HelveticaNeue,Helvetica,'Lucida Grande',sans-serif;
  font-weight: bold;
  line-height: 23px;
}
main p {
  margin: 0 120px;
  padding: 0;
  line-height: 1.7em;
}
main p.annotation {
  padding-left: 1em;
  text-indent: -1em;
}
main p a,
main p a,
main p a:link,
main p a:visited,
main p a:active {
  color: rgb(254,0,0);
}
main p a:hover {
  color: rgb(254,102,102);
}

main dl {
  margin: 0 120px;
  padding: 0;
}
main dl.contact-collect,
main dl.contact-user { text-align: center; }

main dl dt {
  font-family: 'Roboto',"游ゴシック体","Yu Gothic",YuGothic,HiraKakuProN-W6,HiraKakuPro-W6,'ヒラギノ角ゴ ProN W6','ヒラギノ角ゴ Pro W6','メイリオ',Meiryo,'ＭＳ ゴシック',Arial,HelveticaNeue,Helvetica,'Lucida Grande',sans-serif;
  font-weight: bold;
}

main .mail {
  margin: 4px 0 0 0;
  text-align: center;
}
main .mail a {
  font-size: 16px;
  font-family: 'Roboto',"游ゴシック体","Yu Gothic",YuGothic,HiraKakuProN-W6,HiraKakuPro-W6,'ヒラギノ角ゴ ProN W6','ヒラギノ角ゴ Pro W6','メイリオ',Meiryo,'ＭＳ ゴシック',Arial,HelveticaNeue,Helvetica,'Lucida Grande',sans-serif;
  font-weight: bold;
  color: rgb(254,0,0);
}
main .mail a:hover { color: rgb(254,102,102); }

/** responsible breakpoint **/
@media (min-width: 641px) and (max-width: 959px) {
  main h1 span { width:100%; }
  main div.inner { width:100%; }
}

/** responsible breakpoint **/
@media (max-width: 640px) {
  main div.inner { width:100%; }
  main h1 {
    margin: 0 0 10px 0;
    height: 32px;
    line-height: 32px;
  }
  main h1 span {
    height: 32px;
    width: 100%;
    font-size: 20px;
    letter-spacing: 0;
    line-height: 32px;
  }
  main h2 {
    height: auto;
    font-size: 18px;
  }
  main h3 {
    margin-right: 14px;
    margin-left: 14px;
  }
  main p {
    margin-right: 14px;
    margin-left: 14px;
  }
  main dl {
    margin-right: 14px;
    margin-left: 14px;
  }

}