/*article.html*/

.category-label {
  position: absolute;
  top: 0;
  left: 8em;
  display: inline-block;
  background-color: #595757;
  color: #fff;
  font-size: 12px;
  line-height: 1em;
  line-height: 20px;
  width: 100px;
  height: 20px;
  text-align: center
}

.category-media {
  background-color: #9fa0a0
}

.category-product {
  background-color: #134989
}

.information-list {
  width: 100%;
  margin: auto;
  margin-bottom: 80px;
}

.information-list .information-heading {
  position: relative;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.2em;
  padding-left: .8em;
  margin-bottom: 25px
}

.information-list .information-heading:before {
  position: absolute;
  left: 0;
  content: '';
  display: inline-block;
  width: 2px;
  height: 1.2em;
  border-left: solid 4px #bb2026
}
.gsp-green .information-list .information-heading:before {
  border-left: solid 4px #13C99F
}
.gsp-sky .information-list .information-heading:before {
  border-left: solid 4px #59c1d9
}
.gsp-red .information-list .information-heading:before {
  border-left: solid 4px #801931
}
.gsp-yellow .information-list .information-heading:before {
  border-left: solid 4px #f39800
}
.gsp-darkblue .information-list .information-heading:before {
  border-left: solid 4px #181C27
}

.information-list .information-heading:after {
  position: absolute;
  left: 0;
  bottom: -.5em;
  content: '';
  display: block;
  width: 100%;
  height: 1px;
  border-bottom: solid 1px #c9caca
}

.information-list dt {
  display: block;
  position: relative;
  vertical-align: middle;
  font-size: 16px;
  line-height: 1em;
  line-height: 20px;
  margin-bottom: 6px
}

.information-list dd {
  margin-bottom: 18px
}

.information-list dd a {
  font-size: 16px;
  line-height: 1.8em;
  text-decoration: underline
}

.p-information-detail .article-header {
  padding-bottom: 30px;
  margin: 30px 0;
  border-bottom: solid 1px #c9caca
}

.p-information-detail .information-heading {
  font-size: 18px;
  font-weight: bold;
  line-height: 1.8em;
  margin-bottom: 15px
}

.p-information-detail .article-date {
  position: relative;
  height: 20px;
  line-height: 20px
}

.p-information-detail .article-container {
  width: 90%;
  margin: auto;
  margin-bottom: 80px;
}

.p-information-detail .article-wrap {
  margin-bottom: 32px
}

.p-information-detail .article {
  margin-bottom: 2em
}

.p-information-detail a {
  color: #007ee4;
  text-decoration: underline
}

.p-information-detail .back-to-information {
  display: block;
  border: 1px solid #000;
  color: #000;
  text-decoration: none;
  width: 225px;
  height: 40px;
  line-height: 40px;
  text-align: center
}



@media only screen and (min-width:900px) {
  .information-list {
    width: 850px;
  }
  .information-list .information-heading {
    font-size: 18px;
    line-height: 1em;
    margin-bottom: 30px;
    margin-left: -30px
  }
  .information-list .information-heading:after {
    bottom: -.8em
  }
  .information-list dl {
    padding-left: 30px
  }
  .information-list dt {
    position: absolute;
    padding-top: .3em
  }
  .information-list dd {
    padding-left: 14em;
    margin-bottom: 10px
  }
  .p-information-detail .article-container {
    width: 850px;
  }
  .p-information-detail .information-heading {
    font-size: 18px;
    line-height: 1.5em;
  }
  .p-information-detail .article-date .category-label {
    top: .1em
  }
  .p-information-detail .article-wrap {
    margin-bottom: 40px
  }
  .p-information-detail .article, .p-information-detail a {
    font-size: 16px;
    line-height: 1.8em
  }
  .category-label {
    top: .4em;
    font-weight: 400
  }
}