@charset "UTF-8";
/* CSS Document */

/** ================================================================================
		レスポンシブ　ベース
		sp (max-width: 768px)
================================================================================ **/
@media screen and (max-width: 768px) {
  /** ================================================================================
        02.common
================================================================================ **/
  body {
    min-width: auto;
  }

  /**PC電話ボタン無効を有効に**/
  a[href^="tel"] {
    pointer-events: auto;
  }

  /** ================================================================================
    03.template
================================================================================ **/
  .sp {
    display: block;
  }
  .pc {
    display: none;
  }
  article {
    margin-top: 56px;
  }
  section {
    width: 100%; /*980px*/
    margin: 34px auto; /*70px auto*/
    padding-left: 5%;
    padding-right: 5%;
  }
  section.bg {
    padding: 30px 5%; /*50px 0*/
  }
  h2 {
    margin-bottom: 20px; /*0 auto 40px*/
    font-size: 26px; /*34px*/
  }
  h2 span {
    font-size: 22px;
  }
  section > * + h2 {
    margin-top: 40px;
  }
  h2 + .sub {
    margin: -10px auto 30px; /*-36px auto 40px*/
  }
  h3 {
    margin: 40px auto 20px; /*50px auto 20px*/
    font-size: 20px; /*24px*/
  }
  h3 + p {
    font-size: 16px;
  }
  .w980 {
    width: 90%;
  }
  section > .w980 {
    width: 100%;
  }

  /**　btn
    -----------------------**/
  .btn {
    width: 100%; /*334px*/
    margin-top: 14px; /*30px auto 0*/
    line-height: 40px; /*40px*/
    border-radius: 20px; /*20px*/
  }
  .btn:not([href^="tel"])::after {
    right: 10px; /*20px*/
  }
  .bg > .btn {
    width: 90%;
  }

  /**　pdf
    -----------------------**/
  .pdf {
    width: 100%; /*334px*/
    margin-top: 14px; /*30px auto 0*/
  }
  .pdf::after {
    right: 20px; /*20px*/
  }
  .bg > .pdf {
    width: 90%;
  }

  /**　お知らせ
    -----------------------**/
  ul.newsList li {
    display: block; /*flex*/
  }
  ul.newsList li time,
  ul.newsList li .newsTxt {
    display: block;
    width: 100%; /*130px*/
  }
  .news a.btn {
    width: 90%;
    margin-top: 26px;
  }

  /** pagination **/
  ol.pagination {
    margin-top: 40px;
  }
  ol.pagination li {
    font-size: 14px;
  }
  ol.pagination li.prev a,
  ol.pagination li.next a {
    width: 80px;
  }
  ol.pagination li.prev {
    margin-right: 4px; /*50px*/
  }
  ol.pagination li.next {
    margin-left: 4px; /*50px*/
  }

  /**　ヘッダー
    -----------------------**/
  /** ヘッダーロゴ **/
  header {
    width: 100%;
    margin: 0;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
  }
  header .inner {
    display: block;
    width: 70%;
    height: 56px;
    margin: 0;
    padding: 0 10px;
    background: #2957c6;
    z-index: 200;
  }
  header .inner h1 {
    line-height: 1;
  }
  header .inner h1.logo img {
    height: 56px;
  }
  header .inner h1.logo span {
    padding: 6px 0 0 14px; /*40px 0 0 14px*/
    font-size: 24px; /*40px*/
  }
  header .inner h1.logo span em {
    font-size: 12px; /*15px*/
  }
  header .inner p,
  header .inner dl {
    display: none;
  }

  /** メニューボタン **/
  header label,
  header .toggleBox {
    display: block;
  }
  header > label {
    width: 30%;
    padding-left: 1.6em;
    font-size: 14px;
    font-weight: bold;
    color: #2957c6;
    text-align: center;
    line-height: 54px;
    border: 1px solid #fff;
    border-bottom-color: #2957c6;
    background: #fff;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 200;
  }
  header > label::before {
    font-family: FontAwesome;
    content: " \f0c9";
    font-size: 20px;
    position: absolute;
    top: 0;
    left: calc(50% - 2em);
  }
  header > input.toggle:checked + label {
    border-bottom-color: #fff;
  }
  header > input.toggle:checked + label::before {
    content: " \f00d";
  }
  header > input.toggle + label + nav {
    max-height: 0;
    overflow: scroll;
    -webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
  }
  header > input.toggle:checked + label + nav {
    max-height: calc(100vh - 54px);
    -webkit-transition: all 0.3s ease-in;
    transition: all 0.3s ease-in;
  }

  /** ヘッダーnav **/
  header nav {
    width: 100%; /*10px 0*/
    margin: 0 auto;
    padding: 0;
    -webkit-box-shadow: 0 6px 6px -4px rgba(41, 87, 198, 0.5);
    box-shadow: 0 6px 6px -4px rgba(41, 87, 198, 0.5);
    position: fixed;
    top: 56px;
    left: 0;
    z-index: 99999;
  }
  header nav ul {
    display: block;
    width: 100%;
    padding: 0;
    text-align: left;
    border-left: none;
  }
  header nav ul li {
    width: 100%; /*25%*/
    height: auto; /*100%*/
    padding: 0 20px;
    font-size: 16px; /*20px*/
    line-height: 2; /*46px*/
    border-right: none; /*1px solid #b3b3b3*/
  }
  header nav ul li.pc ~ li {
    display: block;
  }
  header nav ul li .sp {
    display: inline;
  }
  header nav ul li label {
    display: block;
    position: relative;
  }
  header nav ul li label,
  header nav ul li a:not(.pc) {
    display: block;
    padding: 10px;
    color: #2957c6;
    font-weight: bold;
    border-bottom: 1px dotted #2957c6;
  }
  header nav ul li:last-child a {
    border-bottom: none;
  }
  header nav ul li label::after {
    font-family: FontAwesome;
    content: " \f067";
    position: absolute;
    top: 10px;
    right: 10px;
  }
  header nav ul li input.toggle:checked + label::after {
    content: " \f068";
  }
  header nav ul li input.toggle + label + .toggleBox {
    max-height: 0;
    overflow: hidden;
    -webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
  }
  header nav ul li input.toggle:checked + label + .toggleBox {
    max-height: calc(100vh - 54px);
    max-height: 9999px;
    -webkit-transition: all 0.3s ease-in;
    transition: all 0.3s ease-in;
  }
  header nav ul li input.toggle + label + .toggleBox a,
  header nav ul li input.toggle:checked + label + .toggleBox a {
    padding: 10px 2.5em;
    border-bottom: 1px dotted rgba(41, 87, 198, 0.5);
    position: relative;
  }
  header nav ul li input.toggle + label + .toggleBox a::before,
  header nav ul li input.toggle:checked + label + .toggleBox a::before {
    content: "-";
    margin-right: 4px;
    position: absolute;
    top: 10px;
    left: 1.5em;
  }

  header nav ul li a,
  header nav ul li a:hover,
  #about header nav ul li:first-child a,
  #info header nav ul li:nth-child(2) a,
  #flow header nav ul li:nth-child(3) a {
    color: #2957c6; /*#464646*/
  }

  /**　フッター
    -----------------------**/
  /** contact **/
  footer .contact {
    padding: 30px 0; /*40px 0*/
  }
  footer .contact > * {
    width: 90%; /*700px*/
  }
  footer .contact a.btn.mailBtn {
    width: 90%; /*700px*/
    margin: 10px auto 20px; /*20px auto 40px*/
    font-size: 18px; /*20px*/
    line-height: 60px; /*60px*/
    border-radius: 30px; /*30px*/
  }
  footer .contact p {
    margin-bottom: 10px;
    font-size: 16px; /*18px*/
  }
  footer .contact p a.btn.telBtn {
    display: block; /*inline-block*/
    margin-top: 10px;
  }
  footer .contact p a.btn.telBtn + a.btn.telBtn {
    margin-left: 0; /*32px*/
  }

  /** inner **/
  footer .inner {
    width: 100%; /*980px*/
    margin: 10px auto 0; /*26px auto 40px*/
    position: relative;
    display: block; /*flex*/
  }
  footer .inner .footerInfo {
    display: none;
  }

  /** フッターnav **/
  footer .inner ul.footerNav {
    width: 90%;
    margin: 0 auto;
  }
  footer .inner ul.footerNav > li,
  footer .inner ul.footerNav:first-of-type > li + li {
    margin-top: 0; /*0.4em/1.2em*/
  }
  footer .inner ul.footerNav li a {
    padding: 10px;
    border-bottom: 1px dotted #b3b3b3;
  }
  footer .inner ul.footerNav li a:hover {
    text-decoration: none; /*underline*/
  }
  footer .inner ul.footerNav li a.pc {
    display: none;
  }
  footer .inner ul.footerNav:first-of-type li ol {
    display: block; /*inline-block*/
    margin: 0; /*0 0.5em 0 10px*/
  }

  footer .inner ul.footerNav:first-of-type li ol li {
    margin: 0; /*2px 0*/
    font-size: 16px; /*14px*/
  }

  footer .inner ul.footerNav li label {
    display: block;
    padding: 10px;
    border-bottom: 1px dotted #b3b3b3;
    position: relative;
  }
  footer .inner ul.footerNav li label::after {
    font-family: FontAwesome;
    content: " \f067";
    color: #2957c6;
    position: absolute;
    top: 12px;
    right: 6px;
  }
  footer .inner ul.footerNav li input.toggle:checked + label::after {
    content: " \f068";
  }

  footer .inner ul.footerNav li ol.toggleBox {
    display: block; /*inline-block*/
    margin: 0;
  }
  footer .inner ul.footerNav li input.toggle ~ ol.toggleBox {
    max-height: 0;
    overflow: hidden;
    -webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
  }
  footer .inner ul.footerNav li input.toggle:checked ~ .toggleBox {
    max-height: 9999px;
    -webkit-transition: all 0.3s ease-in;
    transition: all 0.3s ease-in;
  }

  footer p small {
    font-size: 12px;
    border-top: none;
  }

  /*200326追加*/
  footer .bnr {
    width: 80%;
    margin: 30px auto 20px;
    text-align: center;
  }
  footer .bnr img {
    width: 100%;
    max-width: 380px;
  }
}