@charset "UTF-8";

/* Scss Document */

/*max-width:1280px*/

/*max-width:1024px*/

@media (max-width: 768px) {

  .training_menu {

    margin: 0 auto 0; } }

/*max-width:768px*/

@media (max-width: 480px) {

  .training_menu {

    margin: 0 auto 0; } }

/*max-width:480px*/

/***************************************************/

.training_head {

  position: relative;

  min-height: 480px;

  display: -webkit-box;

  display: -ms-flexbox;

  display: -webkit-flex;

  display: flex;

  flex-direction: column;

  flex-wrap: wrap;

  -webkit-box-pack: justify;

  -ms-flex-pack: justify;

  -webkit-justify-content: center;

  justify-content: center;

  margin: 0 auto 50px; }

  .training_head .txt {

    max-width: 1000px;

    width: calc(100% - 80px);

    margin: 0 auto;

    display: -webkit-box;

    display: -ms-flexbox;

    display: -webkit-flex;

    display: flex;

    flex-direction: column;

    flex-wrap: wrap;

    -webkit-box-pack: justify;

    -ms-flex-pack: justify;

    -webkit-justify-content: center;

    justify-content: center;

    align-items: flex-start; }

    .training_head .txt .big {

      font: 45px/1.4em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

      font-weight: 500;

      color: #20325f; }

    .training_head .txt .small {

      margin: 40px 0 0;

      display: inline-block;

      background-color: #20325f;

      color: #fff;

      font: 18px/1.4em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

      font-weight: 400;

      padding: 8px 18px; }

  .training_head .pic {

    max-width: 1000px;

    width: 100%;

    margin: 0 auto;

    position: absolute;

    top: 50%;

    left: 50%;

    -webkit-transform: translate(-50%, -50%);

    /* Safari用 */

    transform: translate(-50%, -50%);

    text-align: right;

    z-index: -1;

    padding: 0 0 0 0; }

    .training_head .pic:before {

      position: absolute;

      content: "";

      width: 160px;

      height: 160px;

      background-color: #f4b3c2;

      display: block;

      bottom: -85px;

      right: -85px;

      z-index: -1; }

    .training_head .pic:after {

      position: absolute;

      content: "";

      width: 100vw;

      height: 380px;

      background-color: #ebf1fa;

      display: block;

      bottom: -60px;

      right: -75vw;

      z-index: -5; }

    .training_head .pic img {

      width: 445px;

      height: auto; }



/*max-width:1280px*/

@media (max-width: 1024px) {

  .training_head {

    position: relative;

    min-height: auto; }

    .training_head .txt {

      max-width: 1080px;

      width: calc(100% - 40px);

      margin: 0 auto; }

    .training_head .pic:before, .training_head .pic:after {

      display: none; }

    .training_head .pic img {

      width: 540px;

      height: auto; } }

/*max-width:1024px*/

@media (max-width: 768px) {

  .training_head {

    position: relative;

    min-height: auto;

    margin: -30px auto 100px; }

    .training_head .txt {

      order: 2;

      max-width: 1080px;

      width: calc(100% - 50px);

      margin: 10px auto 0; }

      .training_head .txt .big {

        font: 50px/1.4em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

        font-weight: 500;

        color: #20325f; }

      .training_head .txt .small {

        margin: 30px 0 0;

        display: inline-block;

        background-color: #20325f;

        color: #fff;

        font: 18px/1.4em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

        font-weight: 400;

        padding: 10px 20px; }

    .training_head .pic {

      order: 1;

      position: relative;

      top: auto;

      left: auto;

      -webkit-transform: translate(0%, 0%);

      transform: translate(0%, 0%); }

      .training_head .pic:before, .training_head .pic:after {

        display: none; }

      .training_head .pic img {

        max-width: 100%;

        width: 100%;

        height: auto; } }

/*max-width:768px*/

@media (max-width: 480px) {

  .training_head {

    position: relative;

    min-height: auto;

    margin: -30px auto 80px; }

    .training_head .txt {

      order: 2;

      max-width: 1080px;

      width: calc(100% - 50px);

      margin: 10px auto 0; }

      .training_head .txt .big {

        font: 40px/1.4em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

        font-weight: 500; }

      .training_head .txt .small {

        margin: 20px 0 0;

        font: 16px/1.4em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

        font-weight: 400;

        padding: 8px 10px; } }

/*max-width:480px*/

/***************************************************/

.message {

  max-width: 1000px;

  width: calc(100% - 80px);

  margin: 0 auto 120px; }

  .message h2 {

    position: relative;

    margin: 0 0 70px; }

    .message h2 span {

      font: 70px/1.0em 'Barlow', sans-serif;

      font-weight: 300;

      font-style: italic;

      color: #47527c;

      position: relative;

      padding: 0 0 20px; }

      .message h2 span:before {

        position: absolute;

        content: "";

        height: 3px;

        width: 100%;

        background-color: #f4b3c2;

        bottom: 0;

        left: 0; }

    .message h2 small {

      font: 20px/1.0em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

      font-weight: 700;

      margin: 0 0 0 20px;

      color: #20325f; }

  .message p {

    font: 16px/2.2em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

    font-weight: 400;

    margin: 0 0 30px;

    color: #20325f;

    text-align: justify;

    text-justify: inter-ideograph; }



@media (max-width: 1280px) {

  .message h2 span {

    font: 70px/1.0em 'Barlow', sans-serif;

    font-weight: 300;

    font-style: italic; } }

/*max-width:1280px*/

@media (max-width: 1024px) {

  .message h2 span {

    font: 8vw/1.0em 'Barlow', sans-serif;

    font-weight: 300;

    font-style: italic; }

  .message h2 small {

    font: 24px/1.0em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

    font-weight: 700;

    margin: 0 0 0 15px;

    color: #20325f; } }

/*max-width:1024px*/

@media (max-width: 768px) {

  .message {

    width: calc(100% - 60px); }

    .message h2 span {

      font: 8vw/1.0em 'Barlow', sans-serif;

      font-weight: 300;

      font-style: italic; }

    .message h2 small {

      font: 18px/1.0em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

      font-weight: 700;

      margin: 0 0 0 15px;

      color: #20325f; } }

/*max-width:768px*/

@media (max-width: 480px) {

  .message {

    width: calc(100% - 40px);

    margin: 0 auto 80px; }

    .message h2 {

      margin: 0 0 60px; }

      .message h2 span {

        font: 40px/1.0em 'Barlow', sans-serif;

        font-weight: 300;

        font-style: italic;

        padding: 0 0 15px; }

      .message h2 small {

        font: 18px/1.0em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

        font-weight: 700; }

    .message p {

      font: 15px/2.0em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

      font-weight: 400;

      margin: 0 0 30px;

      color: #20325f; } }

/*max-width:480px*/

/***************************************************/

.features {

  text-align: center;

  position: relative;

  padding: 0 0 100px; }

  .features:before {

    position: absolute;

    content: "";

    bottom: 0;

    width: 100%;

    height: 230px;

    background-color: #f1f6fc;

    left: 0; }

  .features h2 {

    margin: 0 0 120px; }

    .features h2 span {

      font: 70px/1.0em 'Barlow', sans-serif;

      font-weight: 300;

      font-style: italic;

      color: #20325f;

      padding: 0 0 15px;

      position: relative; }

      .features h2 span:before {

        position: absolute;

        content: "";

        width: 100%;

        height: 3px;

        background-color: #f4b3c2;

        bottom: 0;

        left: 50%;

        -webkit-transform: translate(-50%, 0%);

        transform: translate(-50%, 0%); }

    .features h2 small {

      color: #20325f;

      font: 20px/1.0em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

      font-weight: 700;

      margin: 45px 0 0;

      display: block; }

  .features ul {

    max-width: 1280px;

    margin: 0 auto;

    width: calc(100% - 80px);

    display: -webkit-box;

    display: -ms-flexbox;

    display: -webkit-flex;

    display: flex;

    flex-direction: row;

    flex-wrap: wrap;

    -webkit-box-pack: justify;

    -ms-flex-pack: justify;

    -webkit-justify-content: space-between;

    justify-content: space-between;

    counter-reset: number 0; }

  .features li {

    width: calc((100% - 60px)/3);

    max-width: 380px;

    border: 2px solid #20325f;

    border-radius: 15px;

    position: relative;

    padding: 50px 35px 35px;

    background-color: #FFF;

    color: #20325f;

    text-align: left;

    font: 18px/1.8em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

    font-weight: 500;

    text-align: justify;

    text-justify: inter-ideograph; }

    .features li:before {

      position: absolute;

      counter-increment: number 1;

      content: "0" counter(number);

      top: -40px;

      left: 50%;

      -webkit-transform: translate(-50%, 0%);

      /* Safari用 */

      transform: translate(-50%, 0%);

      color: #20325f;

      font: 65px/1.0em  'Barlow', sans-serif;

      font-weight: 300;

      font-style: italic;

      background-color: #fff;

      padding: 0 12px 0 15px; }



@media (max-width: 1280px) {

  .features h2 span {

    font: 70px/1.0em 'Barlow', sans-serif;

    font-weight: 300;

    font-style: italic; } }

/*max-width:1280px*/

@media (max-width: 1024px) {

  .features {

    text-align: center;

    position: relative;

    padding: 0 0 100px; }

    .features:before {

      position: absolute;

      content: "";

      bottom: 0;

      width: 100%;

      height: 70%;

      background-color: #f1f6fc;

      left: 0; }

    .features h2 {

      margin: 0 0 100px; }

      .features h2 span {

        font: 8vw/1.0em 'Barlow', sans-serif;

        font-weight: 300;

        font-style: italic;

        color: #20325f;

        padding: 0 0 15px;

        position: relative; }

      .features h2 small {

        color: #20325f;

        font: 24px/1.0em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

        font-weight: 700;

        margin: 50px 0 0;

        display: block; }

    .features ul {

      max-width: 1280px;

      margin: 0 auto;

      width: calc(100% - 80px);

      display: -webkit-box;

      display: -ms-flexbox;

      display: -webkit-flex;

      display: flex;

      flex-direction: column;

      flex-wrap: wrap;

      -webkit-box-pack: justify;

      -ms-flex-pack: justify;

      -webkit-justify-content: space-between;

      justify-content: space-between;

      counter-reset: number 0; }

    .features li {

      width: 100%;

      max-width: 480px;

      border: 2px solid #20325f;

      border-radius: 15px;

      position: relative;

      padding: 50px 35px 35px;

      background-color: #FFF;

      margin: 0 auto 60px;

      color: #20325f;

      text-align: left;

      font: 18px/1.8em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

      font-weight: 500;

      text-align: justify;

      text-justify: inter-ideograph; }

      .features li:before {

        position: absolute;

        counter-increment: number 1;

        content: "0" counter(number);

        top: -35px;

        left: 50%;

        -webkit-transform: translate(-50%, 0%);

        /* Safari用 */

        transform: translate(-50%, 0%);

        color: #20325f;

        font: 65px/1.0em  'Barlow', sans-serif;

        font-weight: 300;

        font-style: italic;

        background-color: transparent;

        padding: 0 10px 0 0;

        z-index: 3; }

      .features li:after {

        position: absolute;

        content: "";

        display: block;

        width: 120px;

        height: 10px;

        background-color: #fff;

        top: -2px;

        left: 49%;

        -webkit-transform: translate(-50%, 0%);

        /* Safari用 */

        transform: translate(-50%, 0%);

        z-index: 1; } }

/*max-width:1024px*/

@media (max-width: 480px) {

  .features {

    text-align: center;

    position: relative;

    padding: 0 0 20px; }

    .features:before {

      position: absolute;

      content: "";

      bottom: 0;

      width: 100%;

      height: 70%;

      background-color: #f1f6fc;

      left: 0; }

    .features h2 {

      margin: 0 0 80px; }

      .features h2 span {

        font: 40px/1.0em 'Barlow', sans-serif;

        font-weight: 300;

        font-style: italic;

        color: #20325f;

        padding: 0 0 10px;

        position: relative; }

        .features h2 span:before {

          position: absolute;

          content: "";

          width: 100%;

          height: 2px;

          background-color: #f4b3c2;

          bottom: 0;

          left: 50%;

          -webkit-transform: translate(-50%, 0%);

          transform: translate(-50%, 0%); }

      .features h2 small {

        color: #20325f;

        font: 18px/1.0em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

        font-weight: 700;

        margin: 30px 0 0;

        display: block; }

    .features ul {

      max-width: 1280px;

      margin: 0 auto;

      width: calc(100% - 40px);

      display: -webkit-box;

      display: -ms-flexbox;

      display: -webkit-flex;

      display: flex;

      flex-direction: column;

      flex-wrap: wrap;

      -webkit-box-pack: justify;

      -ms-flex-pack: justify;

      -webkit-justify-content: space-between;

      justify-content: space-between;

      counter-reset: number 0; }

    .features li {

      width: 100%;

      max-width: 480px;

      border: 2px solid #20325f;

      border-radius: 15px;

      position: relative;

      padding: 40px 25px 30px;

      background-color: #FFF;

      margin: 0 auto 60px;

      font: 16px/1.8em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

      font-weight: 500;

      text-align: justify;

      text-justify: inter-ideograph; }

      .features li:before {

        top: -30px;

        color: #20325f;

        font: 55px/1.0em  'Barlow', sans-serif;

        font-weight: 300;

        font-style: italic; }

      .features li:after {

        width: 100px;

        top: -2px; } }

/*max-width:480px*/

/***************************************************/

.example {

  text-align: center;

  padding: 100px 0 130px; }

  .example h2 {

    margin: 0 0 80px; }

    .example h2 span {

      font: 70px/1.0em 'Barlow', sans-serif;

      font-weight: 300;

      font-style: italic;

      color: #20325f;

      padding: 0 0 20px;

      position: relative; }

      .example h2 span:before {

        position: absolute;

        content: "";

        width: 100%;

        height: 3px;

        background-color: #f4b3c2;

        bottom: 0;

        left: 50%;

        -webkit-transform: translate(-50%, 0%);

        transform: translate(-50%, 0%); }

    .example h2 small {

      color: #20325f;

      font: 20px/1.0em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

      font-weight: 700;

      margin: 50px 0 0;

      display: block; }

  .example p {

    display: block;

    max-width: 950px;

    width: 100%;

    margin: 0 auto 15px;

    text-align: left;

    font: 14px/1.0em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

    font-weight: 400; }

  .example dl {

    margin: 0 auto;

    border: 1px solid #b3b6cc;

    max-width: 950px;

    width: 100%;

    padding: 40px 40px 40px;

    text-align: center; }

  .example dt {

    color: #20325f;

    font: 22px/1.0em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

    font-weight: 400;

    margin: 0 auto 40px;

    background: linear-gradient(transparent 70%, #d4e1f3 0%);

    display: inline; }

  .example dd {

    display: block;

    margin: 30px 0 0;

    text-align: justify;

    text-justify: inter-ideograph;

    font: 16px/2.2em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

    font-weight: 400; }

  .example img {

    max-width: 100%;

    display: block;

    margin: 0 auto 40px; }



@media (max-width: 1280px) {

  .example {

    text-align: center;

    padding: 130px 40px; }

    .example h2 {

      margin: 0 0 80px; }

      .example h2 span {

        font: 70px/1.0em 'Barlow', sans-serif;

        font-weight: 300;

        font-style: italic;

        color: #20325f;

        padding: 0 0 20px;

        position: relative; } }

/*max-width:1280px*/

@media (max-width: 1024px) {

  .example {

    text-align: center;

    padding: 130px 40px; }

    .example h2 {

      margin: 0 0 80px; }

      .example h2 span {

        font: 8vw/1.0em 'Barlow', sans-serif;

        font-weight: 300;

        font-style: italic;

        color: #20325f;

        padding: 0 0 20px;

        position: relative; }

        .example h2 span:before {

          position: absolute;

          content: "";

          width: 100%;

          height: 2px;

          background-color: #f4b3c2;

          bottom: 0;

          left: 50%;

          -webkit-transform: translate(-50%, 0%);

          transform: translate(-50%, 0%); }

      .example h2 small {

        color: #20325f;

        font: 20px/1.0em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

        font-weight: 700;

        margin: 50px 0 0;

        display: block; } }

/*max-width:1024px*/

@media (max-width: 768px) {

  .example {

    text-align: center;

    padding: 130px 30px; }

    .example h2 {

      margin: 0 0 50px; }

      .example h2 span {

        font: 8vw/1.0em 'Barlow', sans-serif;

        font-weight: 300;

        font-style: italic;

        padding: 0 0 20px; }

      .example h2 small {

        font: 18px/1.0em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

        font-weight: 700; } }

/*max-width:768px*/

@media (max-width: 480px) {

  .example {

    text-align: center;

    padding: 80px 0px 130px; }

    .example h2 {

      margin: 0 0 50px; }

      .example h2 span {

        font: 40px/1.0em 'Barlow', sans-serif;

        font-weight: 300;

        font-style: italic;

        padding: 0 0 10px; }

      .example h2 small {

        margin: 30px 0 0;

        font: 18px/1.0em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

        font-weight: 700; }

    .example dl {

      padding: 30px;

      width: calc(100% - 30px); }

    .example dd {

      display: block;

      margin: 25px 0 0;

      font: 15px/1.8em 'Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";

      font-weight: 400; } }

/*max-width:480px*/