@charset "UTF-8";
/*******************************
course
*******************************/
#pageCourse #container {
  padding-top: 4em;
  background: #fff; }
  @media screen and (max-width: 599px) {
    #pageCourse #container {
      padding-top: 2.5em; } }
  #pageCourse #container .sec01 {
    padding-bottom: 4em; }
    @media screen and (max-width: 599px) {
      #pageCourse #container .sec01 {
        padding-bottom: 3em; } }
  #pageCourse #container .title01 {
    color: #00559d;
    display: flex;
    align-items: flex-start;
    position: relative;
    width: 100%;
    padding-bottom: 0.15em;
    margin-bottom: 1em;
    line-height: 1.4;
    font-size: 175%;
    text-align: left; }
    @media screen and (max-width: 599px) {
      #pageCourse #container .title01 {
        font-size: 137.5%; } }
    #pageCourse #container .title01 .line {
      display: block;
      background: #006EAF;
      background: -webkit-linear-gradient(left, #006eaf 0%, #00a64e 56%, #f6af00 100%);
      background: -o-linear-gradient(left, #006eaf 0%, #00a64e 56%, #f6af00 100%);
      background: linear-gradient(to right, #006eaf 0%, #00a64e 56%, #f6af00 100%);
      top: 100%;
      width: 100%;
      height: 0.2em;
      position: absolute;
      top: 100%;
      right: 0; }
  #pageCourse #container .wrap_common_01 {
    display: flex;
    justify-content: space-between;
    align-items: flex-start; }
    @media screen and (max-width: 599px) {
      #pageCourse #container .wrap_common_01 {
        display: block; } }
    #pageCourse #container .wrap_common_01 h2 {
      width: 25%; }
      @media screen and (max-width: 599px) {
        #pageCourse #container .wrap_common_01 h2 {
          width: 100%; } }
    #pageCourse #container .wrap_common_01 .txt_area {
      width: 73%; }
      @media screen and (max-width: 599px) {
        #pageCourse #container .wrap_common_01 .txt_area {
          width: 100%; } }
  @media screen and (max-width: 599px) {
    #pageCourse #container .scroll {
      width: 100%;
      overflow-y: scroll; } }
  #pageCourse #container .scroll .scroll_txt {
    display: none; }
    @media screen and (max-width: 599px) {
      #pageCourse #container .scroll .scroll_txt {
        display: block;
        background: rgba(87, 102, 123, 0.5);
        color: #fff;
        text-align: center;
        padding: 0.15em;
        border-radius: 500px;
        margin-bottom: 1em;
        animation: blinking 1.5s ease-in-out infinite alternate; }
      @keyframes blinking {
        0% {
          opacity: 1; }
        50% {
          opacity: 0; }
        100% {
          opacity: 1; } } }
  @media screen and (max-width: 599px) {
    #pageCourse #container .scroll .scroll_target {
      width: 200vw;
      max-width: 200vw; } }
  #pageCourse #container #target .wrap01 {
    display: flex;
    justify-content: space-between; }
    @media screen and (max-width: 599px) {
      #pageCourse #container #target .wrap01 {
        display: block; } }
    #pageCourse #container #target .wrap01 section {
      width: 47%; }
      @media screen and (max-width: 599px) {
        #pageCourse #container #target .wrap01 section {
          width: 100%; } }
      @media screen and (max-width: 599px) {
        #pageCourse #container #target .wrap01 section:nth-child(1) {
          margin-bottom: 2em; } }
      #pageCourse #container #target .wrap01 section h3 {
        font-size: 150%;
        font-weight: 700;
        color: #000;
        text-align: center; }
      #pageCourse #container #target .wrap01 section p {
        margin-top: 1.25em;
        text-align: center; }
        @media screen and (max-width: 599px) {
          #pageCourse #container #target .wrap01 section p {
            margin-top: 0.5em; } }
      #pageCourse #container #target .wrap01 section .lead {
        background: #00559d;
        border-radius: 500px;
        color: #fff;
        padding: 0.15em 0;
        font-weight: 500;
        margin: 0; }
      #pageCourse #container #target .wrap01 section .tc {
        text-align: center; }
      #pageCourse #container #target .wrap01 section strong {
        color: #00559d; }
      #pageCourse #container #target .wrap01 section .li01, #pageCourse #container #target .wrap01 section .li02 {
        padding: 1.5em 0 0.5em; }
        @media screen and (max-width: 599px) {
          #pageCourse #container #target .wrap01 section .li01, #pageCourse #container #target .wrap01 section .li02 {
            padding: 0.5em 0 0; } }
        #pageCourse #container #target .wrap01 section .li01 li, #pageCourse #container #target .wrap01 section .li02 li {
          border: 3px solid #00559d;
          font-size: 125%;
          background: #fff;
          color: #00559d;
          text-align: center;
          font-weight: 700;
          line-height: 1.3; }
          @media screen and (max-width: 599px) {
            #pageCourse #container #target .wrap01 section .li01 li, #pageCourse #container #target .wrap01 section .li02 li {
              font-size: 112.5%; } }
          #pageCourse #container #target .wrap01 section .li01 li:not(:last-child), #pageCourse #container #target .wrap01 section .li02 li:not(:last-child) {
            margin-bottom: 1.25em; }
      #pageCourse #container #target .wrap01 section .li01 li {
        padding: 0.15em 0.5em;
        border-radius: 0.5em; }
      #pageCourse #container #target .wrap01 section .li02 li {
        padding: 0.65em 0.5em;
        border-radius: 500px; }
  #pageCourse #container #schedule .chart01 .each {
    display: flex;
    border-bottom: 1px solid #000;
    font-size: 1.125em; }
    @media screen and (max-width: 599px) {
      #pageCourse #container #schedule .chart01 .each {
        font-size: 0.875em; } }
    #pageCourse #container #schedule .chart01 .each .month {
      padding: 0.25em 0;
      width: 15%;
      font-weight: 700; }
      @media screen and (max-width: 599px) {
        #pageCourse #container #schedule .chart01 .each .month {
          width: 2.5em; } }
    #pageCourse #container #schedule .chart01 .each .box01 {
      width: 85%; }
      #pageCourse #container #schedule .chart01 .each .box01 .inner01 {
        display: flex;
        padding: 0.25em 0;
        font-weight: 500; }
        #pageCourse #container #schedule .chart01 .each .box01 .inner01:not(:last-child) {
          border-bottom: 1px solid #000; }
        #pageCourse #container #schedule .chart01 .each .box01 .inner01 .day {
          text-align: right;
          width: 26%;
          white-space: nowrap; }
          @media screen and (max-width: 599px) {
            #pageCourse #container #schedule .chart01 .each .box01 .inner01 .day {
              width: 35%; } }
          #pageCourse #container #schedule .chart01 .each .box01 .inner01 .day.w01 {
            width: 47.5%; }
            @media screen and (max-width: 599px) {
              #pageCourse #container #schedule .chart01 .each .box01 .inner01 .day.w01 {
                width: auto; } }
        #pageCourse #container #schedule .chart01 .each .box01 .inner01 .event01 {
          padding-left: 1.5em;
          width: 25%;
          white-space: nowrap;
          display: flex;
          align-items: flex-start; }
          @media screen and (max-width: 599px) {
            #pageCourse #container #schedule .chart01 .each .box01 .inner01 .event01 {
              width: auto;
              padding-left: 1em; } }
          #pageCourse #container #schedule .chart01 .each .box01 .inner01 .event01 .number {
            background: #000;
            color: #fff;
            display: flex;
            justify-content: center;
            align-items: center;
            text-align: center;
            border-radius: 100%;
            font-size: 75%;
            width: 2em;
            height: 2em;
            margin-top: 0.15em;
            margin-left: 0.25em; }
        #pageCourse #container #schedule .chart01 .each .box01 .inner01 .event02 {
          white-space: nowrap; }
          @media screen and (max-width: 599px) {
            #pageCourse #container #schedule .chart01 .each .box01 .inner01 .event02 {
              padding-left: 1em; } }
  #pageCourse #container #schedule .note01 {
    margin-top: 0.5em;
    margin-left: 1em;
    text-indent: -1em;
    font-size: 87.5%;
    text-align: right; }
  #pageCourse #container #message .wrap01 {
    display: flex;
    justify-content: space-between; }
    @media screen and (max-width: 599px) {
      #pageCourse #container #message .wrap01 {
        display: block; } }
    #pageCourse #container #message .wrap01 .sec02 {
      width: 47%; }
      @media screen and (max-width: 599px) {
        #pageCourse #container #message .wrap01 .sec02 {
          width: 100%;
          margin-bottom: 1.5em; } }
      #pageCourse #container #message .wrap01 .sec02 .wrap02 {
        display: flex;
        justify-content: space-between;
        align-items: flex-start; }
        #pageCourse #container #message .wrap01 .sec02 .wrap02 .img01 {
          width: 30%; }
        #pageCourse #container #message .wrap01 .sec02 .wrap02 .txt_area {
          width: 67%; }
          #pageCourse #container #message .wrap01 .sec02 .wrap02 .txt_area .profile {
            margin-top: 1.5em; }
            @media screen and (max-width: 599px) {
              #pageCourse #container #message .wrap01 .sec02 .wrap02 .txt_area .profile {
                width: 94.75vw;
                margin-left: -49%;
                margin-top: 0.75em; } }
            #pageCourse #container #message .wrap01 .sec02 .wrap02 .txt_area .profile dt {
              font-size: 1.25em;
              font-weight: 500; }
              #pageCourse #container #message .wrap01 .sec02 .wrap02 .txt_area .profile dt span {
                font-size: 80%; }
            #pageCourse #container #message .wrap01 .sec02 .wrap02 .txt_area .profile dd {
              font-size: 87.5%; }
    #pageCourse #container #message .wrap01 .sec03 {
      width: 47%;
      border: 2px solid rgba(87, 102, 123, 0.5);
      border-radius: 0.5em;
      padding: 1em 1em 0.5em; }
      @media screen and (max-width: 599px) {
        #pageCourse #container #message .wrap01 .sec03 {
          width: 100%; } }
      #pageCourse #container #message .wrap01 .sec03 h2 {
        text-align: left;
        font-size: 150%;
        font-weight: 500;
        border-bottom: 2px solid rgba(87, 102, 123, 0.5);
        padding-bottom: 0.35em;
        margin-bottom: 0.5em; }
      #pageCourse #container #message .wrap01 .sec03 dl {
        margin: 0.5em 0;
        display: flex; }
        @media screen and (max-width: 599px) {
          #pageCourse #container #message .wrap01 .sec03 dl {
            display: block; } }
        #pageCourse #container #message .wrap01 .sec03 dl dt {
          white-space: nowrap; }
        #pageCourse #container #message .wrap01 .sec03 dl dd {
          margin-left: 0.75em;
          font-weight: 700; }
          #pageCourse #container #message .wrap01 .sec03 dl dd ul li::before {
            content: "●";
            text-indent: -1em;
            margin-left: 1em; }
      #pageCourse #container #message .wrap01 .sec03 .note01 {
        margin-top: 1em;
        margin-left: 1em;
        text-indent: -1em;
        font-size: 87.5%;
        text-align: right; }
  #pageCourse #container #contact .sec02 {
    border: 4px solid #00559d;
    overflow: hidden;
    border-radius: 0.5em;
    padding: 0 0 1.5em;
    background: url("/assets/img/bg01.png") no-repeat 0 0 #fff;
    background-size: cover; }
  #pageCourse #container #contact h2 {
    background: #00559d;
    color: #fff;
    text-align: center;
    font-size: 200%;
    padding: 0.15em 0 0.35em;
    margin-bottom: 0.75em; }
    @media screen and (max-width: 599px) {
      #pageCourse #container #contact h2 {
        font-size: 165%; } }
  #pageCourse #container #contact .wrap01 {
    display: flex;
    justify-content: space-between;
    padding: 0 2.5% 2.5em; }
    @media screen and (max-width: 599px) {
      #pageCourse #container #contact .wrap01 {
        display: block; } }
    #pageCourse #container #contact .wrap01 .sec03 {
      width: 47%; }
      @media screen and (max-width: 599px) {
        #pageCourse #container #contact .wrap01 .sec03 {
          width: 100%; } }
      @media screen and (max-width: 599px) {
        #pageCourse #container #contact .wrap01 .sec03:nth-child(1) {
          margin-bottom: 1em; } }
      #pageCourse #container #contact .wrap01 .sec03 h3 {
        text-align: center;
        color: #00559d;
        font-weight: 700;
        font-size: 175%;
        position: relative;
        margin-bottom: 0.5em; }
        @media screen and (max-width: 599px) {
          #pageCourse #container #contact .wrap01 .sec03 h3 {
            font-size: 150%; } }
        #pageCourse #container #contact .wrap01 .sec03 h3 span {
          font-size: 80%; }
        #pageCourse #container #contact .wrap01 .sec03 h3 .line {
          display: block;
          background: #006EAF;
          background: -webkit-linear-gradient(left, #006eaf 0%, #00a64e 56%, #f6af00 100%);
          background: -o-linear-gradient(left, #006eaf 0%, #00a64e 56%, #f6af00 100%);
          background: linear-gradient(to right, #006eaf 0%, #00a64e 56%, #f6af00 100%);
          top: 100%;
          width: 100%;
          height: 2px;
          position: absolute;
          top: 100%;
          right: 0; }
      #pageCourse #container #contact .wrap01 .sec03 p {
        font-size: 112.5%; }
        @media screen and (max-width: 599px) {
          #pageCourse #container #contact .wrap01 .sec03 p {
            font-size: 100%; } }
      #pageCourse #container #contact .wrap01 .sec03 .txt01 {
        margin-left: 0.25em; }
        @media screen and (max-width: 599px) {
          #pageCourse #container #contact .wrap01 .sec03 .txt01 {
            display: block;
            margin-left: 0; } }
        #pageCourse #container #contact .wrap01 .sec03 .txt01::before {
          content: "●"; }
      #pageCourse #container #contact .wrap01 .sec03 .txt02 {
        color: #00559d; }
      #pageCourse #container #contact .wrap01 .sec03 .li01 {
        font-size: 112.5%; }
        @media screen and (max-width: 599px) {
          #pageCourse #container #contact .wrap01 .sec03 .li01 {
            font-size: 100%; } }
        #pageCourse #container #contact .wrap01 .sec03 .li01 li {
          text-indent: -1em;
          margin-left: 1em;
          font-weight: 700; }
          #pageCourse #container #contact .wrap01 .sec03 .li01 li::before {
            content: "●"; }
  #pageCourse #container #contact .txt03 {
    color: #00559d;
    font-weight: 500;
    font-size: 175%;
    line-height: 1.4;
    text-align: center; }
    @media screen and (max-width: 599px) {
      #pageCourse #container #contact .txt03 {
        font-size: 137.5%; } }
  #pageCourse #container #contact .wrap02 {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 1.5em; }
    @media screen and (max-width: 599px) {
      #pageCourse #container #contact .wrap02 {
        display: block; } }
    #pageCourse #container #contact .wrap02 .line {
      display: block;
      width: 9em;
      margin-right: 1em; }
      @media screen and (max-width: 599px) {
        #pageCourse #container #contact .wrap02 .line {
          width: 6em;
          margin: 0 auto; } }
    #pageCourse #container #contact .wrap02 .box01 {
      width: 30em; }
      @media screen and (max-width: 599px) {
        #pageCourse #container #contact .wrap02 .box01 {
          width: 100%;
          margin-top: 1em; } }
      #pageCourse #container #contact .wrap02 .box01 .tel {
        display: flex;
        text-align: center;
        justify-content: center;
        font-weight: 500;
        font-size: 2em;
        margin-top: 0.25em;
        width: 100%; }
        @media screen and (max-width: 599px) {
          #pageCourse #container #contact .wrap02 .box01 .tel {
            font-size: 1.375em;
            margin-top: 0.75em; } }
      #pageCourse #container #contact .wrap02 .box01 .btn {
        width: 100%; }
        @media screen and (max-width: 599px) {
          #pageCourse #container #contact .wrap02 .box01 .btn {
            width: 95%;
            margin: 0 auto; } }
        #pageCourse #container #contact .wrap02 .box01 .btn a {
          display: block;
          background: #006EAF;
          background: -webkit-linear-gradient(left, #006eaf 0%, #00a64e 56%, #f6af00 100%);
          background: -o-linear-gradient(left, #006eaf 0%, #00a64e 56%, #f6af00 100%);
          background: linear-gradient(to right, #006eaf 0%, #00a64e 56%, #f6af00 100%);
          color: #fff;
          font-weight: 700;
          font-size: 150%;
          padding: 0.75em;
          text-align: center;
          border-radius: 500px; }
          @media screen and (max-width: 599px) {
            #pageCourse #container #contact .wrap02 .box01 .btn a {
              font-size: 1.25em; } }
