@charset "UTF-8";
/*
記事ページ CSS
Version: 0.5.0
UPDATE 2019-04-09
*/
#pageTitle {
  background-position: center;
  background-size: cover; }
  #pageTitle .title {
    padding: 110px 0;
    font-size: 0;
    line-height: 1; }
    @media screen and (max-width: 840px) {
      #pageTitle .title {
        padding: 30px 0; }
        #pageTitle .title img {
          width: auto;
          height: 60px; } }

/*
content CSS
Version: 0.5.0
UPDATE 2019-04-09
*/
#information {
  position: relative;
  background-image: url(../img/information/bg.jpg);
  background-position: center; }
  #information .article {
    max-width: 880px;
    margin: auto;
    padding: 50px 0;
    text-align: left;
    background-color: #fff; }
    @media screen and (max-width: 840px) {
      #information .article {
        padding: 15px 15px; } }
    #information .article .title,
    #information .article .photo,
    #information .article .comment {
      max-width: 600px;
      margin: 0 auto; }
    #information .article .title {
      position: relative;
      margin-bottom: 30px;
      padding: 5px 0;
      padding-left: 30px;
      font-size: 150%;
      font-weight: 700;
      line-height: 1.2;
      text-decoration: underline; }
      @media screen and (max-width: 840px) {
        #information .article .title {
          margin-bottom: 15px;
          font-size: 125%; } }
      #information .article .title::after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        width: 8px;
        background-color: #000; }
    #information .article .photo {
      margin-bottom: 30px; }
      @media screen and (max-width: 840px) {
        #information .article .photo {
          margin-bottom: 15px; } }
      #information .article .photo img {
        max-width: 100%;
        height: auto; }
  #information .linkDiv {
    padding-top: 30px;
    text-align: center; }
    #information .linkDiv .pageLink a {
      padding: 10px 40px;
      border: 1px solid #000;
      transition: .3s; }
      #information .linkDiv .pageLink a:hover {
        background-color: #7acc6b;
        border: 1px solid #7acc6b; }
  #information .pageLink.back {
    margin-top: 30px; }
    #information .pageLink.back a {
      position: relative;
      display: inline-block;
      padding: 10px 36px;
      padding-left: 90px;
      font-size: 90%;
      text-align: left;
      text-decoration: none;
      background-color: #7acc6b;
      opacity: 1;
      transition: .3s; }
      #information .pageLink.back a::before {
        content: '';
        position: absolute;
        top: 50%;
        left: 22px;
        margin-top: -1px;
        z-index: 10;
        width: 60px;
        height: 1px;
        background-color: #000;
        transition: .3s; }
      #information .pageLink.back a::after {
        content: '';
        position: absolute;
        top: 50%;
        left: 12px;
        margin-top: -5px;
        z-index: 10;
        border: 8px solid #000;
        border-width: 4px 8px;
        border-color: transparent #000 transparent transparent;
        transition: .3s; }
      #information .pageLink.back a:hover {
        opacity: 0.7; }

#pageTitle {
  background-color: #7acc6b; }
  #pageTitle .title {
    padding: 50px 0; }
    @media screen and (max-width: 840px) {
      #pageTitle .title {
        padding: 30px; } }
