@charset "UTF-8";
@font-face {
  font-family: noto-sans-cjk-jp, sans-serif;
  font-weight: 200;
  font-style: normal; }

@font-face {
  font-family: noto-sans-cjk-jp, sans-serif;
  font-weight: 300;
  font-style: normal; }

@font-face {
  font-family: noto-sans-cjk-jp, sans-serif;
  font-weight: 400;
  font-style: normal; }

@font-face {
  font-family: noto-sans-cjk-jp, sans-serif;
  font-weight: 500;
  font-style: normal; }

@font-face {
  font-family: noto-sans-cjk-jp, sans-serif;
  font-weight: 700;
  font-style: normal; }

/**
 * Fontサイズのプロパティ設定用 mixin。
*/
/**
 * radiusサイズのプロパティ設定用 mixin。
*/
/**
 * コンテンツのプロパティ設定用 mixin。
 *
 * @param {String} property margin か padding　デフォルトは padding
 * @param {String} Large の指定
 * @param {String} Midium の指定
 * @param {String} Small の指定
 * @param {String} Extra small の指定
*/
/*
  text drop shadow
*/
.single > div > header.single-header {
  margin-top: 32px;
  margin-bottom: 32px; }
  .single > div > header.single-header h2 {
    font-size: 28px;
    font-size: 400;
    display: inline-block; }
    @media all and (max-width: 991px) {
      .single > div > header.single-header h2 {
        font-size: 18px; } }
  .single > div > header.single-header .post-cat {
    background: #7cbfce;
    color: white;
    padding: 6px 10px;
    display: inline-block;
    border-radius: 8px;
    margin-left: 20px;
    font-size: 14px; }
    .single > div > header.single-header .post-cat.event {
      background: #6ee0dc; }
    @media all and (max-width: 991px) {
      .single > div > header.single-header .post-cat {
        margin-left: 0;
        margin-top: 10px; } }
  .single > div > header.single-header .label {
    padding-top: 8px;
    padding-bottom: 8px;
    border-radius: 8px;
    border: 1px solid rgba(120, 120, 120, 0.5);
    padding-left: 17px;
    padding-right: 17px; }

.single .img-area {
  background: #f6faff; }
  .single .img-area figure {
    width: 60.9%;
    margin-left: auto;
    margin-right: auto; }
    @media all and (max-width: 991px) {
      .single .img-area figure {
        width: 95%; } }
    .single .img-area figure img {
      max-width: 100%;
      margin-left: auto;
      margin-right: auto;
      display: inherit;
      height: 400px; }
      @media all and (max-width: 991px) {
        .single .img-area figure img {
          height: auto; } }

.single .post-style {
  margin-top: 74px;
  margin-bottom: 120px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap; }
  @media all and (max-width: 991px) {
    .single .post-style {
      margin-top: 21px;
      margin-bottom: 30px; } }
  .single .post-style .post-details {
    width: 64.7%;
    padding-bottom: 50px;
    position: relative; }
    @media all and (max-width: 991px) {
      .single .post-style .post-details {
        width: 100%;
        margin-bottom: 0px;
        padding-bottom: 40px; } }
    @media all and (max-width: 991px) {
      .single .post-style .post-details .post-content {
        padding-bottom: 40px; } }
    .single .post-style .post-details .post-content .date {
      display: inline-block;
      background: #7cbfce;
      color: white;
      font-size: 16px;
      padding: 9px 12px;
      border-radius: 8px;
      margin-bottom: 41px; }
      @media all and (max-width: 991px) {
        .single .post-style .post-details .post-content .date {
          padding: 6px 9px;
          font-size: 12px;
          margin-bottom: 21px; } }
    .single .post-style .post-details .post-content .content {
      line-height: 1.87;
      text-align: justify; }
      @media all and (max-width: 991px) {
        .single .post-style .post-details .post-content .content {
          font-size: 16px; } }
  .single .post-style .post-cat {
    width: 21.9%; }
    .single .post-style .post-cat h3 {
      margin-bottom: 20px;
      position: relative;
      font-size: 33px;
      padding-left: 28px; }
      .single .post-style .post-cat h3:before {
        content: "";
        width: 17px;
        height: 60px;
        position: absolute;
        left: 0;
        top: -5px;
        background: #7cbfce; }
      .single .post-style .post-cat h3:nth-of-type(n+2) {
        margin-top: 50px; }
    .single .post-style .post-cat ul {
      margin-left: 40px;
      margin-top: 12px; }
      .single .post-style .post-cat ul li {
        list-style: disc;
        font-size: 16px;
        margin-bottom: 12px;
        line-height: 1.6; }
        .single .post-style .post-cat ul li a:hover {
          text-decoration: underline; }
    @media all and (max-width: 991px) {
      .single .post-style .post-cat {
        width: 100%;
        margin-bottom: 60px; }
        .single .post-style .post-cat h3 {
          font-size: 21px; }
          .single .post-style .post-cat h3:before {
            width: 14px;
            height: 40px; }
        .single .post-style .post-cat ul {
          margin-left: 24px; }
          .single .post-style .post-cat ul li {
            font-size: 14px; } }
  .single .post-style .page-navi ul {
    position: absolute;
    bottom: 0;
    text-align: center;
    display: flex;
    justify-content: space-between;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0; }
    @media all and (max-width: 991px) {
      .single .post-style .page-navi ul {
        width: 100%;
        position: inherit;
        display: block;
        display: inline-block; } }
    .single .post-style .page-navi ul li {
      width: 50%; }
      @media all and (max-width: 991px) {
        .single .post-style .page-navi ul li {
          width: 100%;
          font-size: 13px;
          margin-bottom: 20px; } }
    .single .post-style .page-navi ul .prev-btn, .single .post-style .page-navi ul .next-btn {
      display: block; }
    .single .post-style .page-navi ul .prev-btn {
      position: relative;
      text-align: left;
      padding-left: 20px; }
      .single .post-style .page-navi ul .prev-btn:before {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        content: "«";
        margin-right: 8px;
        left: 0; }
    .single .post-style .page-navi ul .next-btn {
      position: relative;
      text-align: right;
      padding-right: 20px; }
      .single .post-style .page-navi ul .next-btn:after {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        content: "»";
        margin-left: 8px; }

.single.nagara-event .single-header {
  display: flex;
  align-items: center; }
  .single.nagara-event .single-header .date {
    display: inline-block;
    background: #7cbfce;
    color: white;
    font-size: 16px;
    padding: 9px 12px;
    border-radius: 8px;
    margin-right: 2rem; }
    @media all and (max-width: 991px) {
      .single.nagara-event .single-header .date {
        padding: 6px 9px;
        font-size: 12px;
        margin-bottom: 21px; } }

.single.nagara-event .post-style .post-content figure img {
  max-width: 100%; }

.single.nagara-event .post-style .post-content .form-btn {
  margin-top: 44px;
  padding-bottom: 128px; }
  @media all and (max-width: 991px) {
    .single.nagara-event .post-style .post-content .form-btn {
      padding-bottom: 64px; } }
  .single.nagara-event .post-style .post-content .form-btn > a {
    width: 80%;
    max-width: 360px;
    margin-left: auto;
    margin-right: auto;
    background: #7cbfce;
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding-top: 18px;
    padding-bottom: 18px;
    text-align: center;
    border-radius: 8px; }
    .single.nagara-event .post-style .post-content .form-btn > a span {
      color: white;
      font-size: 20px;
      font-weight: 400; }
      @media all and (max-width: 991px) {
        .single.nagara-event .post-style .post-content .form-btn > a span {
          font-size: 16px; } }
    .single.nagara-event .post-style .post-content .form-btn > a:hover {
      background: #88d2e3; }