/* CSS Document */
/*---------------
	TOP
---------------*/
#top {
  /*----- cont01 -----*/
  /*----- cont02 -----*/
  /*----- cont03 -----*/
  /*----- cont04 -----*/
  /*----- cont05 -----*/
  /*----- cont06 -----*/ }
  #top .bgsw {
    width: 100%;
    max-height: 860px;
    aspect-ratio: 5 / 2;
    background-position: center center;
    background-size: cover;
    margin: 0 auto;
    position: relative; }
    @media only screen and (max-width: 1199px) {
      #top .bgsw {
        min-height: 300px; } }
    #top .bgsw .catch {
      font-size: 4em;
      font-weight: 500;
      line-height: 2;
      letter-spacing: .5em;
      position: absolute;
      top: calc(50% - 120px);
      left: 15%; }
      @media only screen and (max-width: 1199px) {
        #top .bgsw .catch {
          font-size: 2em;
          top: calc(50% - 60px);
          left: 5%; } }
      #top .bgsw .catch .letter {
        display: inline-block;
        color: transparent;
        background: linear-gradient(to right, #fff 50%, #999 50%) 100%;
        background-clip: text;
        background-size: 200% 100%;
        transition: background-position 0.4s cubic-bezier(0.25, 1, 0.5, 1);
        animation-name: letter;
        animation-duration: 1.5s;
        animation-delay: .5s;
        animation-iteration-count: 1;
        animation-fill-mode: forwards; }
      #top .bgsw .catch .key {
        text-indent: -.5em; }
@keyframes letter {
  0% {
    background-position: 100% 0; }
  100% {
    background-position: 0 0; } }
  #top #follow {
    position: fixed;
    right: 0;
    bottom: 10%;
    z-index: 1; }
    @media only screen and (max-width: 1199px) {
      #top #follow {
        bottom: 5%; } }
    #top #follow .close-btn {
      color: #fff;
      font-size: 2.5em;
      padding: 0 8px;
      border: none;
      background-color: #ccc;
      border-radius: 25px;
      cursor: pointer;
      position: absolute;
      top: -15px;
      left: -15px; }
    #top #follow .follow-btn {
      align-items: center;
      width: 250px;
      margin: 0;
      text-align: center;
      line-height: 1.5;
      border-radius: 10px 0 0 10px;
      border: 2px solid #ccc; }
      @media only screen and (max-width: 1199px) {
        #top #follow .follow-btn {
          width: auto; } }
      #top #follow .follow-btn a {
        display: block;
        background: #fff;
        color: #6185bc;
        font-size: 2.5em;
        padding: 10px 0;
        border-radius: 10px 0 0 10px;
        box-sizing: border-box; }
        @media only screen and (max-width: 1199px) {
          #top #follow .follow-btn a {
            font-size: 1.6em;
            padding: 10px; } }
  #top .cont01 {
    background: #ddf3fc;
    padding: 200px 0 100px; }
    @media only screen and (max-width: 1199px) {
      #top .cont01 {
        padding: 60px 5%; } }
    #top .cont01 .cont01__inner {
      width: 1200px;
      margin: 0 auto; }
      @media only screen and (max-width: 1199px) {
        #top .cont01 .cont01__inner {
          width: auto;
          max-width: 600px; } }
      #top .cont01 .cont01__inner .cont01__ttl {
        text-align: center;
        color: #6185bc;
        font-size: 3em;
        font-weight: 500;
        margin-bottom: 50px; }
        @media only screen and (max-width: 1199px) {
          #top .cont01 .cont01__inner .cont01__ttl {
            font-size: 2.5em;
            line-height: 1.5; } }
        #top .cont01 .cont01__inner .cont01__ttl span {
          color: #61c1be; }
      #top .cont01 .cont01__inner img {
        max-width: 1000px;
        margin: 0 auto; }
        @media only screen and (max-width: 1199px) {
          #top .cont01 .cont01__inner img {
            width: 100%; } }
      #top .cont01 .cont01__inner h3 {
        text-align: center;
        color: #333;
        font-size: 3em;
        margin: 100px 0 40px; }
        @media only screen and (max-width: 1199px) {
          #top .cont01 .cont01__inner h3 {
            font-size: 2.5em;
            line-height: 1.5;
            margin: 60px 0 30px; } }
      #top .cont01 .cont01__inner p {
        text-align: center;
        color: #333;
        font-size: 1.8em;
        line-height: 2.5;
        letter-spacing: .1em; }
        @media only screen and (max-width: 1199px) {
          #top .cont01 .cont01__inner p {
            font-size: 1.6em;
            line-height: 2; } }
  #top .cont02 {
    background: #ddf3fc;
    padding-bottom: 160px; }
    @media only screen and (max-width: 1199px) {
      #top .cont02 {
        padding: 0 5% 60px; } }
    #top .cont02 .cont02__inner {
      width: 1200px;
      background: #fff;
      padding: 100px 80px;
      margin: 0 auto; }
      @media only screen and (max-width: 1199px) {
        #top .cont02 .cont02__inner {
          width: auto;
          max-width: 600px;
          padding: 60px 5% 90px; } }
      #top .cont02 .cont02__inner .cont02__ttl {
        text-align: center;
        color: #6185bc;
        font-size: 3em;
        margin-bottom: 90px;
        position: relative; }
        @media only screen and (max-width: 1199px) {
          #top .cont02 .cont02__inner .cont02__ttl {
            font-size: 2.5em;
            margin-bottom: 60px; } }
        #top .cont02 .cont02__inner .cont02__ttl:after {
          content: '';
          display: block;
          width: 150px;
          height: 1px;
          background: #6185bc;
          position: absolute;
          bottom: -30px;
          left: calc(50% - 75px); }
          @media only screen and (max-width: 1199px) {
            #top .cont02 .cont02__inner .cont02__ttl:after {
              width: 120px;
              left: calc(50% - 60px); } }
      #top .cont02 .cont02__inner .cont02__gridBox {
        display: grid;
        grid-template-columns: 1fr 1fr;
        column-gap: 30px; }
        @media only screen and (max-width: 1199px) {
          #top .cont02 .cont02__inner .cont02__gridBox {
            display: block;
            position: relative; } }
        #top .cont02 .cont02__inner .cont02__gridBox .cont02__content {
          position: relative; }
          @media only screen and (max-width: 1199px) {
            #top .cont02 .cont02__inner .cont02__gridBox .cont02__content {
              position: static; } }
          #top .cont02 .cont02__inner .cont02__gridBox .cont02__content .cont02__arw {
            color: var(--text-color);
            font-size: 3.8em;
            font-weight: 500;
            line-height: 1.5;
            letter-spacing: .1em; }
            @media only screen and (max-width: 1199px) {
              #top .cont02 .cont02__inner .cont02__gridBox .cont02__content .cont02__arw {
                font-size: 2.5em; } }
          #top .cont02 .cont02__inner .cont02__gridBox .cont02__content .cont02__txt {
            font-size: 1.8em;
            line-height: 2;
            letter-spacing: .1em;
            margin: 30px 0; }
            @media only screen and (max-width: 1199px) {
              #top .cont02 .cont02__inner .cont02__gridBox .cont02__content .cont02__txt {
                font-size: 1.6em; } }
          #top .cont02 .cont02__inner .cont02__gridBox .cont02__content .cont02__btn {
            font-size: 2em;
            line-height: 40px;
            font-weight: 500;
            position: absolute;
            bottom: 0; }
            @media only screen and (max-width: 1199px) {
              #top .cont02 .cont02__inner .cont02__gridBox .cont02__content .cont02__btn {
                font-size: 1.8em;
                line-height: 35px;
                bottom: -60px; } }
            #top .cont02 .cont02__inner .cont02__gridBox .cont02__content .cont02__btn a {
              display: flex;
              color: #6185bc; }
              #top .cont02 .cont02__inner .cont02__gridBox .cont02__content .cont02__btn a:hover {
                opacity: .8; }
              #top .cont02 .cont02__inner .cont02__gridBox .cont02__content .cont02__btn a img {
                width: 40px;
                margin-right: 20px; }
                @media only screen and (max-width: 1199px) {
                  #top .cont02 .cont02__inner .cont02__gridBox .cont02__content .cont02__btn a img {
                    width: 35px;
                    object-fit: contain;
                    margin-right: 10px; } }
  #top .cont03 {
    background: #80cdcb;
    padding: 160px 0; }
    @media only screen and (max-width: 1199px) {
      #top .cont03 {
        padding: 60px 5% 90px; } }
    #top .cont03 .cont03__inner {
      width: 1200px;
      margin: 0 auto; }
      @media only screen and (max-width: 1199px) {
        #top .cont03 .cont03__inner {
          max-width: 600px;
          width: auto; } }
      #top .cont03 .cont03__inner .cont03__ttl {
        text-align: center;
        color: #fff;
        font-size: 3em;
        margin-bottom: 100px; }
        @media only screen and (max-width: 1199px) {
          #top .cont03 .cont03__inner .cont03__ttl {
            font-size: 2.5em;
            margin-bottom: 60px; } }
        #top .cont03 .cont03__inner .cont03__ttl:after {
          content: '';
          display: block;
          width: 150px;
          height: 1px;
          background: #fff;
          position: absolute;
          bottom: -30px;
          right: calc(50% - 75px); }
          @media only screen and (max-width: 1199px) {
            #top .cont03 .cont03__inner .cont03__ttl:after {
              width: 120px;
              right: calc(50% - 60px); } }
        #top .cont03 .cont03__inner .cont03__ttl img {
          width: 130px;
          margin: 0 auto 30px; }
      #top .cont03 .cont03__inner .cont03__gridBox {
        display: grid;
        grid-template-columns: 1fr 1fr;
        column-gap: 30px; }
        @media only screen and (max-width: 1199px) {
          #top .cont03 .cont03__inner .cont03__gridBox {
            display: block;
            position: relative; } }
        #top .cont03 .cont03__inner .cont03__gridBox .cont03__content {
          position: relative; }
          @media only screen and (max-width: 1199px) {
            #top .cont03 .cont03__inner .cont03__gridBox .cont03__content {
              position: static; } }
          #top .cont03 .cont03__inner .cont03__gridBox .cont03__content .cont03__arw {
            color: #fff;
            font-size: 3.8em;
            font-weight: 500;
            line-height: 1.5;
            letter-spacing: .1em; }
            @media only screen and (max-width: 1199px) {
              #top .cont03 .cont03__inner .cont03__gridBox .cont03__content .cont03__arw {
                font-size: 2.5em; } }
          #top .cont03 .cont03__inner .cont03__gridBox .cont03__content .cont03__txt {
            color: #fff;
            font-size: 1.8em;
            line-height: 2;
            letter-spacing: .1em;
            margin: 30px 0; }
            @media only screen and (max-width: 1199px) {
              #top .cont03 .cont03__inner .cont03__gridBox .cont03__content .cont03__txt {
                font-size: 1.6em; } }
          #top .cont03 .cont03__inner .cont03__gridBox .cont03__content .cont03__btn {
            font-size: 2em;
            line-height: 40px;
            font-weight: 500;
            position: absolute;
            bottom: 0; }
            @media only screen and (max-width: 1199px) {
              #top .cont03 .cont03__inner .cont03__gridBox .cont03__content .cont03__btn {
                font-size: 1.8em;
                line-height: 35px;
                bottom: -60px; } }
            #top .cont03 .cont03__inner .cont03__gridBox .cont03__content .cont03__btn a {
              display: flex;
              color: #fff; }
              #top .cont03 .cont03__inner .cont03__gridBox .cont03__content .cont03__btn a:hover {
                opacity: .8; }
              #top .cont03 .cont03__inner .cont03__gridBox .cont03__content .cont03__btn a img {
                width: 40px;
                margin-right: 20px; }
                @media only screen and (max-width: 1199px) {
                  #top .cont03 .cont03__inner .cont03__gridBox .cont03__content .cont03__btn a img {
                    width: 35px;
                    object-fit: contain;
                    margin-right: 10px; } }
  #top .cont04 {
    background: #2ea7e0;
    padding: 160px 0; }
    @media only screen and (max-width: 1199px) {
      #top .cont04 {
        padding: 60px 5%; } }
    #top .cont04 .cont04__inner {
      width: 760px;
      margin: 0 auto; }
      @media only screen and (max-width: 1199px) {
        #top .cont04 .cont04__inner {
          width: auto;
          max-width: 600px; } }
      #top .cont04 .cont04__inner .cont04__ttl {
        text-align: center;
        color: #fff;
        font-size: 3em;
        margin-bottom: 100px; }
        @media only screen and (max-width: 1199px) {
          #top .cont04 .cont04__inner .cont04__ttl {
            font-size: 2.5em;
            margin-bottom: 60px; } }
        #top .cont04 .cont04__inner .cont04__ttl:after {
          content: '';
          display: block;
          width: 150px;
          height: 1px;
          background: #fff;
          position: absolute;
          bottom: -30px;
          right: calc(50% - 75px); }
          @media only screen and (max-width: 1199px) {
            #top .cont04 .cont04__inner .cont04__ttl:after {
              width: 120px;
              right: calc(50% - 60px); } }
        #top .cont04 .cont04__inner .cont04__ttl img {
          width: 130px;
          margin: 0 auto 30px; }
      #top .cont04 .cont04__inner ul li {
        position: relative; }
        #top .cont04 .cont04__inner ul li:last-child .icon {
          height: 50px;
          top: 55px;
          left: 190px; }
          @media only screen and (max-width: 1199px) {
            #top .cont04 .cont04__inner ul li:last-child .icon {
              height: 35px;
              top: 25px;
              left: 8%; } }
        #top .cont04 .cont04__inner ul li a {
          display: block;
          background: #fff;
          text-align: center;
          color: #6185bc;
          font-size: 3em;
          line-height: 158px;
          letter-spacing: .1em;
          border: 1px solid #6185bc;
          border-radius: 20px;
          margin: 30px auto 0; }
          @media only screen and (max-width: 1199px) {
            #top .cont04 .cont04__inner ul li a {
              font-size: 2.5em;
              line-height: 90px;
              margin: 15px auto 0; } }
          #top .cont04 .cont04__inner ul li a:hover {
            opacity: .8; }
          #top .cont04 .cont04__inner ul li a .icon {
            height: 70px;
            position: absolute;
            top: 45px;
            left: 200px; }
            @media only screen and (max-width: 1199px) {
              #top .cont04 .cont04__inner ul li a .icon {
                height: 50px;
                top: 20px;
                left: 10%; } }
          #top .cont04 .cont04__inner ul li a .arrow {
            width: 40px;
            position: absolute;
            top: 60px;
            right: 25px; }
            @media only screen and (max-width: 1199px) {
              #top .cont04 .cont04__inner ul li a .arrow {
                width: 30px;
                top: 30px;
                right: 10%; } }
  #top .cont05 {
    background: #ddf3fc;
    padding: 160px 0; }
    @media only screen and (max-width: 1199px) {
      #top .cont05 {
        padding: 60px 5% 90px; } }
    #top .cont05 .cont05__inner {
      width: 1200px;
      margin: 0 auto; }
      @media only screen and (max-width: 1199px) {
        #top .cont05 .cont05__inner {
          width: auto;
          max-width: 600px; } }
      #top .cont05 .cont05__inner .cont05__ttl {
        text-align: center;
        color: #6185bc;
        font-size: 3em;
        margin-bottom: 100px; }
        @media only screen and (max-width: 1199px) {
          #top .cont05 .cont05__inner .cont05__ttl {
            font-size: 2.5em;
            margin-bottom: 60px; } }
        #top .cont05 .cont05__inner .cont05__ttl:after {
          content: '';
          display: block;
          width: 150px;
          height: 1px;
          background: #6185bc;
          position: absolute;
          bottom: -30px;
          right: calc(50% - 75px); }
          @media only screen and (max-width: 1199px) {
            #top .cont05 .cont05__inner .cont05__ttl:after {
              width: 120px;
              right: calc(50% - 60px); } }
        #top .cont05 .cont05__inner .cont05__ttl img {
          width: 130px;
          margin: 0 auto 30px; }
      #top .cont05 .cont05__inner .cont05__gridBox {
        display: grid;
        grid-template-columns: 1fr 1fr;
        column-gap: 30px; }
        @media only screen and (max-width: 1199px) {
          #top .cont05 .cont05__inner .cont05__gridBox {
            display: block;
            position: relative; } }
        #top .cont05 .cont05__inner .cont05__gridBox .cont05__content {
          position: relative; }
          @media only screen and (max-width: 1199px) {
            #top .cont05 .cont05__inner .cont05__gridBox .cont05__content {
              position: static; } }
          #top .cont05 .cont05__inner .cont05__gridBox .cont05__content .cont05__arw {
            color: var(--text-color);
            font-size: 3.8em;
            font-weight: 500;
            line-height: 1.5;
            letter-spacing: .1em; }
            @media only screen and (max-width: 1199px) {
              #top .cont05 .cont05__inner .cont05__gridBox .cont05__content .cont05__arw {
                font-size: 2.5em; } }
          #top .cont05 .cont05__inner .cont05__gridBox .cont05__content .cont05__txt {
            font-size: 1.8em;
            line-height: 2;
            letter-spacing: .1em;
            margin: 30px 0; }
            @media only screen and (max-width: 1199px) {
              #top .cont05 .cont05__inner .cont05__gridBox .cont05__content .cont05__txt {
                font-size: 1.6em; } }
          #top .cont05 .cont05__inner .cont05__gridBox .cont05__content .cont05__btn {
            font-size: 2em;
            line-height: 40px;
            font-weight: 500;
            position: absolute;
            bottom: 0; }
            @media only screen and (max-width: 1199px) {
              #top .cont05 .cont05__inner .cont05__gridBox .cont05__content .cont05__btn {
                font-size: 1.8em;
                line-height: 35px;
                bottom: -60px; } }
            #top .cont05 .cont05__inner .cont05__gridBox .cont05__content .cont05__btn a {
              display: flex;
              color: #6185bc; }
              #top .cont05 .cont05__inner .cont05__gridBox .cont05__content .cont05__btn a:hover {
                opacity: .8; }
              #top .cont05 .cont05__inner .cont05__gridBox .cont05__content .cont05__btn a img {
                width: 40px;
                margin-right: 20px; }
                @media only screen and (max-width: 1199px) {
                  #top .cont05 .cont05__inner .cont05__gridBox .cont05__content .cont05__btn a img {
                    width: 35px;
                    margin-right: 10px; } }
  #top .cont06 {
    margin: 170px 0 40px; }
    @media only screen and (max-width: 1199px) {
      #top .cont06 {
        margin: 60px 5%; } }
    #top .cont06 .rac {
      width: 760px;
      margin: 0 auto; }
      @media only screen and (max-width: 1199px) {
        #top .cont06 .rac {
          width: auto;
          max-width: 600px; } }
      #top .cont06 .rac h2 {
        text-align: center;
        color: #6185bc;
        font-size: 2.5em;
        letter-spacing: .1em;
        margin-bottom: 30px; }
        @media only screen and (max-width: 1199px) {
          #top .cont06 .rac h2 {
            font-size: 2em;
            margin: 60px 0 30px; } }
      #top .cont06 .rac p {
        margin: 0 0 140px; }
        @media only screen and (max-width: 1199px) {
          #top .cont06 .rac p {
            margin: 0 0 60px; } }
        #top .cont06 .rac p a:hover {
          opacity: .8; }
    #top .cont06 .cont06__ttl {
      text-align: center;
      color: #6185bc;
      font-size: 3em; }
      @media only screen and (max-width: 1199px) {
        #top .cont06 .cont06__ttl {
          font-size: 2.5em; } }
    #top .cont06 p {
      text-align: center;
      font-size: 1.8em;
      margin: 20px 0 60px; }
      @media only screen and (max-width: 1199px) {
        #top .cont06 p {
          font-size: 1.6em;
          line-height: 1.5;
          margin: 20px 0 30px; } }
    #top .cont06 ul {
      width: 1200px;
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      column-gap: 25px;
      margin: 0 auto; }
      @media only screen and (max-width: 1199px) {
        #top .cont06 ul {
          width: auto;
          max-width: 600px;
          display: block; } }
      #top .cont06 ul li {
        text-align: center;
        line-height: 2;
        letter-spacing: .1em; }
        @media only screen and (max-width: 1199px) {
          #top .cont06 ul li {
            margin: 15px 0; } }
        #top .cont06 ul li a {
          display: block;
          width: 100%;
          height: 170px;
          background: url("../../img/top/group02.png") no-repeat center center/cover;
          color: #fff;
          font-size: 1.8em;
          font-weight: bold;
          padding: 0;
          position: relative; }
          #top .cont06 ul li a:hover {
            opacity: .8; }
          #top .cont06 ul li a img {
            width: 155px;
            padding: 30px 0 5px;
            margin: 0 auto; }
          #top .cont06 ul li a i {
            font-size: 1.6em;
            position: absolute;
            right: 20px;
            bottom: 20px; }
        #top .cont06 ul li:first-child a {
          height: auto;
          background: url("../../img/top/group01.png") no-repeat center center/cover;
          padding: 49px 0; }
        #top .cont06 ul li:last-child a {
          height: auto;
          background: url("../../img/top/group03.png") no-repeat center center/cover;
          padding: 49px 0; }
