html {
  font-size: 62.5%;
}
body {
  background: #fff;
  color: #333;
  font: 1.6em Arial,"游ゴシック",YuGothic,"ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,sans-serif;
  font-weight: 300;
  line-height: 1.6;
  margin: 0;
}
.wrap {
  margin: auto;
  width: 100%;
}
.clearfix:after {
  content: "";
  clear: both;
  display: block
}
img {
  max-width: 100%;
  vertical-align: bottom;
}

/* list */
ul {
  list-style: none;
  padding: 0;
}

/* link */
a:link,a:visited,a:hover,a:active {
  color: #333;
  text-decoration: none;
}
a img:hover {
  filter: alpha(opacity=70);
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

/* pagetop */
.pagetop {
  position: fixed;
  right: 20px;
  bottom: 20px;
  width: 60px;
  height: 60px;
  background: bottom / cover no-repeat url(../img/pagetop.svg);
  display: block;
  opacity: 0.8;
}
.pagetop a {
  display: block;
  height: 60px;
  width: 60px;
}
.pagetop:hover {
  filter: alpha(opacity=70);
  -webkit-transition: 0.3s;
  opacity: 0.7;
  transition: 0.3s;
}

/* font */
.serif {
  font-family: "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
}
.hiragino {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Meiryo, "メイリオ", sans-serif;
}

/* tips */
.underline {
  background: linear-gradient(transparent 70%, #ff0 0%);
}