body{
        font-family:sans-serif;color:#222;background:#f6f8fa;font-size:1.5rem;line-height:2.0;
      }
      a{
        text-decoration:none;position:relative;-webkit-transition:all .1s ease;transition:all .1s ease;
      }
      a:hover{
        text-decoration:none;
      }
      p{
        margin-bottom:1.8em;
      }
      .article-column{
        background: #fff;
        max-width: 980px;
        margin: 0 auto;
      }
      .article-head{
        overflow: hidden;
      }
      .article-head .post-img{
        margin:0 auto;
        padding:0;
        position: relative;
      }
      .article-head .post-img img{
        width: 100%;
      }
      .article-head .post-title_box{
        border-bottom:#e4e4e4 solid 1px;
        padding:15px 10px;
      }
      .article-head .post-title_box .post-title{
        font-size:2.0rem;
        letter-spacing: 2px;
        font-weight: bold;
        line-height: 1.5;
        font-feature-settings: "palt";
      }
      .article-contents{
        padding:20px;
      }
      .article-contents img{
        max-width: 100%;
        height: auto;
        margin: 20px auto;
        display: block;
      }
      .article-contents hr{
        border: none;
        border-top: #ccc solid 1px;
        border-bottom:#eee solid 3px;
        margin: 30px 0 20px;
      }
      .article-contents strong.marker{
          background: linear-gradient(transparent 50%, #e5fcf6 50%);
      }
      .article-contents .note{
        font-size: 1.3rem;
        color: #666;
        line-height: 1.6;
      }
      .article-contents .post-content__heading{
        margin:40px 0 30px -20px;
        padding:0 0 0 40px;
        font-size:1.9rem;
        font-weight: bold;
        line-height: 1.5;
        letter-spacing: 1px;
        position: relative;
      }
      .article-contents .post-content__heading:before{
        content:"";
        position: absolute;
        top:0.7em;
        left:0;
        display: inline-block;
        width:30px;
        height: 3px;
        margin:0 10px 0 0;
        vertical-align: middle;
        background: #58b1bb;
        opacity: .8;
      }
      .article-contents .bg-gray {
        background: #f6f6f6;
        padding: 10px;
        margin: 0 -10px;
      }
      .article-contents .gray-box {
        background: #f6f6f6;
        padding: 15px;
        margin: 0;
        border:#2b865b solid 1px;
        border-radius:20px;
      }
      .article-contents .bg-col {
        background-color: #e5f6f6;
        border-radius: 5px;
        padding: 12px 15px;
        position: relative;
        margin: 20px 0;
      }
      .article-contents .bg-col .image {
        margin: 0 auto;
      }
      .article-contents .bg-col .bg-col-balloon {
        margin: 0 0 10px;
      }
      .article-contents .bg-col .bg-col-balloon .bg-col-balloon_heading {
        display: flex;
        align-items: center;
      }
      .article-contents .bg-col .bg-col-balloon .bg-col-balloon_heading .name {
        color: #0cb2ba;
        font-size: 1.2rem;
        line-height: 1.3;
        font-weight: 700;
        padding: 0;
        margin:0;
      }
      .article-contents .bg-col .bg-col-balloon .bg-col-balloon_heading .image {
        width: 50px;
        height: 50px;
        border-radius: 50%;
        object-fit: cover;
        margin: 0 8px 0 0;
      }
      .article-contents .bg-col .bg-col-balloon .bg-col-balloon_content {
        flex: 1;
        position: relative;
        background: #fff;
        border-radius: 8px;
        padding: 15px;
        position: relative;
        margin: 16px 0 0;
      }
      .article-contents .bg-col .bg-col-balloon .bg-col-balloon_content:before {
        content: "";
        position: absolute;
        top: -12px;
        left: 15px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 10px 12px 10px;
        border-color: transparent transparent #fff transparent;
      }
      .article-contents .bg-col .bg-col-balloon .bg-col-balloon_content *:nth-last-child(1){
        margin-bottom:0;
      }
      .article-contents .bg-col .bg-col-balloon .bg-col-balloon_content .balloon-q {
        font-size: 1.7rem;
        display: block;
        line-height: 1.5;
      }
      .article-contents .bg-col .bg-col-balloon .bg-col-balloon_content strong {
        background: linear-gradient(transparent 50%, #e5fcf6 50%);
      }
      .article-contents .column-profile {
        margin: 10px 0 30px;
        padding: 0 0 25px;
        border-bottom: #ccc solid 1px;
      }
      .article-contents .column-profile .profile_img {
        margin: 0 auto 10px;
        text-align: center;
      }
      .article-contents .column-profile .profile_img img {
        max-width: 160px;
        max-height: 160px;
        object-fit: cover;
        margin: auto;
        border-radius: 50%;
      }
      .article-contents .column-profile .profile_text dt {
        line-height: 1.4;
        font-weight: bold;
        text-align: center;
        margin: 0 0 15px;
      }
      .article-contents .column-profile .profile_text dd {
        font-size: 1.3rem;
        line-height: 1.6;
      }
      .article-contents blockquote{
        background: #f6f6f6;
        border-radius: 10px;
        position: relative;
        padding: 30px 30px 28px;
      }
      .article-contents blockquote::before{
        content: "";
        display: block;
        background: url('data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_2%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2040%2040%22%20style%3D%22enable-background%3Anew%200%200%2040%2040%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%23cccccc%3B%7D%3C%2Fstyle%3E%3Cg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1-2%22%3E%20%3Cpath%20class%3D%22st0%22%20d%3D%22M7.9%2C34.9c-5.1%2C0-7.9-4.3-7.9-8.8c0-10.4%2C9.8-19.2%2C12.9-22l2.6%2C2.8c-3.4%2C2.9-7.4%2C6.5-7.4%2C10.1%20c0%2C1.2%2C0.5%2C2.2%2C1.7%2C2.6c5.3%2C1.6%2C5.9%2C6%2C5.9%2C7.6C15.7%2C31.1%2C12.6%2C34.9%2C7.9%2C34.9L7.9%2C34.9z%20M32.2%2C34.9c-5.1%2C0-7.8-4.3-7.8-8.8%20c0-10.4%2C9.3-18.9%2C12.7-22l2.6%2C2.8c-3.4%2C3.1-7.3%2C6.5-7.3%2C10.1c0%2C2.2%2C0.9%2C2.5%2C1.6%2C2.6c5.1%2C1.4%2C5.9%2C5.7%2C5.9%2C7.6%20C40%2C31.2%2C36.7%2C34.9%2C32.2%2C34.9L32.2%2C34.9z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E') no-repeat;
        background-size: cover;
        width: 32px;
        height: 32px;
        position: absolute;
        top: -8px;
        left: 10px;
      }
      .article-contents blockquote::after{
        content: "";
        display: block;
        background: url('data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_2%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2040%2040%22%20style%3D%22enable-background%3Anew%200%200%2040%2040%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%23cccccc%3B%7D%3C%2Fstyle%3E%3Cg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1-2%22%3E%20%3Cpath%20class%3D%22st0%22%20d%3D%22M7.9%2C34.9c-5.1%2C0-7.9-4.3-7.9-8.8c0-10.4%2C9.8-19.2%2C12.9-22l2.6%2C2.8c-3.4%2C2.9-7.4%2C6.5-7.4%2C10.1%20c0%2C1.2%2C0.5%2C2.2%2C1.7%2C2.6c5.3%2C1.6%2C5.9%2C6%2C5.9%2C7.6C15.7%2C31.1%2C12.6%2C34.9%2C7.9%2C34.9L7.9%2C34.9z%20M32.2%2C34.9c-5.1%2C0-7.8-4.3-7.8-8.8%20c0-10.4%2C9.3-18.9%2C12.7-22l2.6%2C2.8c-3.4%2C3.1-7.3%2C6.5-7.3%2C10.1c0%2C2.2%2C0.9%2C2.5%2C1.6%2C2.6c5.1%2C1.4%2C5.9%2C5.7%2C5.9%2C7.6%20C40%2C31.2%2C36.7%2C34.9%2C32.2%2C34.9L32.2%2C34.9z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E') no-repeat;
        background-size: cover;
        width: 32px;
        height: 32px;
        position: absolute;
        bottom: -8px;
        right: 10px;
        transform: rotate(180deg);
      }
      .article-contents blockquote p:nth-last-child(1){
        margin:0;
      }
      .article-contents figure{
        max-width: 640px;
        margin:  20px auto;
        text-align: center;
      }
      .article-contents figure img{
        margin: 0 auto;
      }
      .article-contents figure figcaption{
        color: #58b1bb;
        margin: 5px 0 0;
      }
      .article-contents .btn-green{
        display: block;
        text-align: center;
        line-height: 1.4;
        cursor: pointer;
        position: relative;
        background:#65a740;
        border-radius:15px;
        margin: 20px auto 0;
        padding:12px 30px 12px 6px;
        width:100%;
        border:none;
        color:#fff;
        font-size:1.6rem;
        top:0;
        box-shadow:0px 4px 0px #467f27;
        transition:all .1s ease;
        position:relative;
        top:0;
      }
      .article-contents .btn-green:after{
        content:"";
        background-image:url(../img/tieup/btn-arrow.png);
        background-repeat:no-repeat;
        background-size:cover;
        position:absolute;
        width:20px;
        height:20px;
        top:50%;
        right:10px;
        transform:translateY(-50%);
      }
      .article-contents .btn-green:hover{
        filter:brightness(120%);
        color:#fff;
        border:none;
        top:0;
        box-shadow:0px 0px 0px #467f27;
        top:4px;
      }

      .c_publisher-area {
        display: flex;
        justify-content: flex-end;
      }

      .c_publisher-area__note {
        width: auto;
        font-size: 1.3rem;
        color: #666;
        line-height: 1.6;
        margin-left: auto;
        margin-right: 0;
        text-align: right;
      }

@media screen and (min-width: 768px) {
        .article-head {
          position: relative;
        }
        .article-head .post-title_box {
          background: rgba(255, 255, 255, 0.9);
          padding: 40px 25px 40px 35px;
          border: none;
          box-shadow: 1px 1px 7px rgba(0, 0, 0, 0.1);
          position: absolute;
          right: 50px;
          bottom: 40px;
          z-index: 2;
        }
        .article-head .post-title_box .post-title {
          font-size: 2.4rem;
          font-weight: bold;
          letter-spacing: 2px;
          width: 16em;
        }
        .article-head .post-img {
          margin: 50px auto 0 50px;
          padding: 0;
        }
        .article-head .post-img img {
          max-width: 680px;
          max-height: 320px;
          object-fit: cover;
        }
        .article-head .post-img .caption {
          margin: 8px auto 0;
          max-width: 680px;
          position: absolute;
          bottom: 0;
          right: 50px;
        }
        .article-contents{
          padding:50px 110px 50px;
        }
        .article-contents hr{
          margin: 50px 0 40px;
        }
        .article-contents img {
          margin: 30px auto;
        }
        .article-contents figure{
          margin:  30px auto;
        }
        .article-contents .bg-gray{
          padding: 20px;
          margin: 0;
        }
        .article-contents .gray-box{
          padding: 20px;
        }
        .article-contents .bg-col {
          padding: 30px 25px;
          margin: 30px 0;
        }
        .article-contents .bg-col .bg-col-balloon {
          margin: 0 0 20px;
          display: flex;
        }
        .article-contents .bg-col .bg-col-balloon .bg-col-balloon_heading {
          display: block;
          position: relative;
          width: 80px;
          left: -10px;
          text-align: center;
        }
        .article-contents .bg-col .bg-col-balloon .bg-col-balloon_heading .name {
          padding: 8px 0 0;
        }
        .article-contents .bg-col .bg-col-balloon .bg-col-balloon_heading .image {
          width: 60px;
          height: 60px;
          margin: 0 auto;
        }
        .article-contents .bg-col .bg-col-balloon .bg-col-balloon_content {
          padding: 25px;
          margin: 0;
        }
        .article-contents .bg-col .bg-col-balloon .bg-col-balloon_content:before {
          top: 20px;
          left: -12px;
          border-width: 10px 12px 10px 0;
          border-color: transparent #fff transparent transparent;
        }
        .article-contents .column-profile {
          padding: 0 0 30px;
          overflow: hidden;
          display: block;
        }
        .article-contents .column-profile .profile_img {
          float: left;
          margin: 0 20px 0 0;
          text-align: left;
        }
        .article-contents .column-profile .profile_img img {
          max-width: 120px;
          max-height: 200px;
        }
        .article-contents .column-profile .profile_text {
          overflow: hidden;
        }
        .article-contents .column-profile .profile_text dt {
          text-align: left;
          margin: 0 0 5px;
        }
        .article-contents .post-content__heading{
          margin:60px 0 40px;
          padding: 0;
          font-size:2.4rem;
          letter-spacing: 2px;
          font-weight: bold;
        }
        .article-contents .post-content__heading:before{
          left:-110px;
          width:100px;
        }
        .article-contents .btn-green{
          padding:18px;
          width:80%;
          font-size:2rem;
        }
        .article-contents .btn-green:after{
          width:30px;
          height:30px;
          right:20px;
        }
        .c_publisher-area{margin: 10px;}
      }
@media screen and (min-width: 768px) {
	.c_publisher-area{
		margin: 30px auto 0 50px;
	}


}
@media screen and (max-width: 768px) {
	.c_publisher-area{
		margin: 20px 20px 0 20px;
	}

  .c_publisher-area__note {
    text-align: left;
  }
}
.profile_text .note{
	margin-top: 1em;
}