@media screen and (max-width: 1023px) {
  header {
    border-bottom: none; }

  header .fixed {
    border-bottom: 1px solid #DDDDDD; } }
.main_slide {
  margin-bottom: 124px; }
  .main_slide .slick-initialized {
    list-style: none;
    padding: 0;
    margin: 0; }
    .main_slide .slick-initialized .slick-slide {
      margin: 0 10px; }
      .main_slide .slick-initialized .slick-slide a {
        display: block; }
    .main_slide .slick-initialized .slick-arrow {
      width: 14px;
      height: 14px;
      z-index: 1;
      top: 99%; }
      .main_slide .slick-initialized .slick-arrow::before {
        display: block;
        width: inherit;
        height: inherit;
        content: "";
        border-top: 1px solid #4D779F;
        border-right: 1px solid #4D779F;
        opacity: 1; }
      .main_slide .slick-initialized .slick-arrow.slick-prev {
        left: 40%; }
        .main_slide .slick-initialized .slick-arrow.slick-prev::before {
          transform: rotate(-135deg); }
      .main_slide .slick-initialized .slick-arrow.slick-next {
        right: 40%; }
        .main_slide .slick-initialized .slick-arrow.slick-next::before {
          transform: rotate(45deg); }
  .main_slide .slick-dots {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    position: static;
    margin-top: 17px; }
    .main_slide .slick-dots li {
      width: 10px;
      height: 10px; }
      .main_slide .slick-dots li button {
        padding: 0;
        width: inherit;
        height: inherit; }
        .main_slide .slick-dots li button::before {
          content: "";
          width: inherit;
          height: inherit;
          background: #fff;
          border: 1px solid #4D779F;
          border-radius: 10px;
          opacity: 1; }
      .main_slide .slick-dots li.slick-active button::before {
        background: #4D779F; }
  @media screen and (max-width: 1023px) {
    .main_slide {
      margin-bottom: 90px; } }
  @media screen and (max-width: 767px) {
    .main_slide {
      margin-bottom: 10.6666666667vw; }
      .main_slide .slick-dots {
        margin-top: 4vw; }
        .main_slide .slick-dots li {
          width: 3.4666666667vw;
          height: 3.4666666667vw;
          margin: 0 1.3333333333vw;
          border-radius: 3.4666666667vw; }
      .main_slide .slick-initialized .slick-slide {
        margin: 0 2.6666666667vw; }
      .main_slide .slick-initialized .slick-arrow {
        width: 3.7333333333vw;
        height: 3.7333333333vw;
        top: 97%; }
        .main_slide .slick-initialized .slick-arrow.slick-prev {
          left: 8.66vw; }
        .main_slide .slick-initialized .slick-arrow.slick-next {
          right: 8.66vw; } }

.banner_area {
  width: 94%;
  margin: 0 auto;
  max-width: 1152px;
  margin-bottom: 120px; }
  @media screen and (max-width: 767px) {
    .banner_area {
      width: 90%; } }
  .banner_area .event_banner {
    margin-bottom: 4.3%; }
  .banner_area .permanent {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap; }
    @media screen and (min-width: 768px) {
      .banner_area .permanent li {
        width: 47.8%; }
        .banner_area .permanent li:nth-of-type(odd) {
          margin-right: 4.4%; }
        .banner_area .permanent li:not(:nth-last-of-type(-n + 2)) {
          margin-bottom: 4.4%; } }
  @media screen and (max-width: 1023px) {
    .banner_area {
      margin-bottom: 90px; } }
  @media screen and (max-width: 767px) {
    .banner_area {
      margin-bottom: 13.3333333333vw; }
      .banner_area .event_banner {
        margin-bottom: 4vw; }
      .banner_area .permanent {
        display: block; }
        .banner_area .permanent li:not(:last-of-type) {
          margin-bottom: 4vw; }
        .banner_area .permanent li a img {
          width: 100%; } }

.purchase_flow_area {
  background: #69C3A7;
  padding: 50px 0;
  margin-bottom: 103px; }
  .purchase_flow_area .inner {
    width: 94%;
    margin: 0 auto;
    max-width: 1152px;
    position: relative; }
    @media screen and (max-width: 767px) {
      .purchase_flow_area .inner {
        width: 90%; } }
    .purchase_flow_area .inner .content {
      width: 86%;
      background: #fff;
      border-radius: 15px;
      padding: 50px 0 43px;
      margin: 0 auto; }
      .purchase_flow_area .inner .content .illust {
        position: absolute; }
        .purchase_flow_area .inner .content .illust.right_illust {
          right: 0;
          top: 71px; }
        .purchase_flow_area .inner .content .illust.left_illust {
          left: 181px;
          top: 49px; }
      .purchase_flow_area .inner .content h2 {
        text-align: center;
        font-size: 27px;
        font-weight: 500;
        margin-bottom: 29px; }
        .purchase_flow_area .inner .content h2 span {
          display: block;
          font-size: 20px;
          font-weight: 500;
          margin-bottom: 5px; }
        .purchase_flow_area .inner .content h2 strong {
          font-size: 32px;
          color: #DB5877;
          font-weight: 700; }
      .purchase_flow_area .inner .content .flow_step .step_list {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        align-items: flex-start;
        flex-wrap: wrap;
        justify-content: center;
        position: relative;
        max-width: 460px;
        margin: 0 auto 48px; }
        .purchase_flow_area .inner .content .flow_step .step_list::before {
          content: "";
          width: 84%;
          top: 18px;
          height: 4px;
          background: #EDEDED;
          position: absolute; }
        .purchase_flow_area .inner .content .flow_step .step_list li {
          width: 98px;
          position: relative; }
          @media screen and (min-width: 768px) {
            .purchase_flow_area .inner .content .flow_step .step_list li:not(:last-of-type) {
              margin-right: 82px; } }
          .purchase_flow_area .inner .content .flow_step .step_list li p {
            font-size: 14px;
            font-weight: 500;
            text-align: center; }
            .purchase_flow_area .inner .content .flow_step .step_list li p.num {
              width: 38px;
              line-height: 38px;
              border-radius: 20px;
              font-size: 18px;
              background: #EDEDED;
              margin: 0 auto 10px;
              color: #58A78E;
              font-weight: 500; }
          .purchase_flow_area .inner .content .flow_step .step_list li img {
            margin: 0 auto 8px; }
      .purchase_flow_area .inner .content .flow_step .btn_area {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        align-items: flex-start;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        max-width: 574px;
        width: 80%;
        margin: 0 auto; }
        .purchase_flow_area .inner .content .flow_step .btn_area::before {
          display: none; }
        .purchase_flow_area .inner .content .flow_step .btn_area li {
          width: 48.8%;
          max-width: 280px;
          line-height: 64px;
          border: 3px solid #58A78E;
          border-radius: 50px;
          background: #58A78E;
          transition: .3s; }
          .purchase_flow_area .inner .content .flow_step .btn_area li:hover {
            opacity: .7; }
          .purchase_flow_area .inner .content .flow_step .btn_area li a {
            display: block;
            color: #fff;
            text-align: center;
            position: relative;
            text-decoration: none;
            font-weight: 500; }
            .purchase_flow_area .inner .content .flow_step .btn_area li a:hover {
              opacity: 1; }
            .purchase_flow_area .inner .content .flow_step .btn_area li a::after {
              content: "";
              width: 9px;
              height: 9px;
              border-top: 3px solid #fff;
              border-right: 3px solid #fff;
              transform: rotate(45deg);
              position: absolute;
              right: 20px;
              top: calc(50% - 4.5px); }
          .purchase_flow_area .inner .content .flow_step .btn_area li:first-of-type {
            background: #fff; }
            @media screen and (min-width: 768px) {
              .purchase_flow_area .inner .content .flow_step .btn_area li:first-of-type {
                margin-right: 2.4%; } }
            .purchase_flow_area .inner .content .flow_step .btn_area li:first-of-type a {
              color: #58A78E; }
              .purchase_flow_area .inner .content .flow_step .btn_area li:first-of-type a::after {
                border-color: #58A78E; }
      .purchase_flow_area .inner .content .online_banner {
        max-width: 650px;
        width: 90%;
        margin: 30px auto 0; }
        .purchase_flow_area .inner .content .online_banner p {
          text-align: center;
          font-size: 16px;
          font-weight: 500;
          margin-bottom: 10px; }
        .purchase_flow_area .inner .content .online_banner a {
          display: block; }
        @media screen and (max-width: 767px) {
          .purchase_flow_area .inner .content .online_banner {
            margin-top: 8vw; }
            .purchase_flow_area .inner .content .online_banner p {
              font-size: 3.7333333333vw; } }
  @media screen and (max-width: 1280px) {
    .purchase_flow_area .inner .content .illust.left_illust {
      width: 9.14vw;
      left: 14.14vw; }
    .purchase_flow_area .inner .content .illust.right_illust {
      width: 22.34vw; } }
  @media screen and (max-width: 1023px) {
    .purchase_flow_area {
      margin-bottom: 90px; }
      .purchase_flow_area .inner .content {
        width: 100%;
        padding-top: 0; }
        .purchase_flow_area .inner .content .illust {
          position: relative; }
          .purchase_flow_area .inner .content .illust.left_illust {
            display: none; }
          .purchase_flow_area .inner .content .illust.right_illust {
            width: 286px;
            margin: 0 auto 10px;
            top: -20px; }
        .purchase_flow_area .inner .content .flow_step .btn_area {
          width: 90%; } }
  @media screen and (max-width: 767px) {
    .purchase_flow_area {
      padding: 8vw 0 7.4666666667vw;
      margin-bottom: 16vw; }
      .purchase_flow_area .inner .content {
        border-radius: 4vw;
        padding-bottom: 5.3333333333vw; }
        .purchase_flow_area .inner .content .illust.right_illust {
          width: 45.3333333333vw;
          top: -3.2vw;
          margin-bottom: 1.0666666667vw; }
          .purchase_flow_area .inner .content .illust.right_illust img {
            width: 100%; }
        .purchase_flow_area .inner .content h2 {
          font-size: 4.2666666667vw;
          margin-bottom: 6.6666666667vw; }
          .purchase_flow_area .inner .content h2 span {
            font-size: 4vw; }
          .purchase_flow_area .inner .content h2 strong {
            font-size: 5.0666666667vw; }
        .purchase_flow_area .inner .content .flow_step .step_list {
          width: 88%;
          justify-content: space-between;
          margin-bottom: 7.4666666667vw; }
          .purchase_flow_area .inner .content .flow_step .step_list::before {
            width: 70%;
            left: 0;
            right: 0;
            margin: auto; }
          .purchase_flow_area .inner .content .flow_step .step_list li {
            width: 26%; }
            .purchase_flow_area .inner .content .flow_step .step_list li p {
              font-size: 2.9333333333vw; }
              .purchase_flow_area .inner .content .flow_step .step_list li p.num {
                width: 10.1333333333vw;
                line-height: 10.1333333333vw;
                border-radius: 10.1333333333vw; }
            .purchase_flow_area .inner .content .flow_step .step_list li img {
              width: 10.66vw; }
        .purchase_flow_area .inner .content .flow_step .btn_area {
          width: 84%;
          display: block; }
          .purchase_flow_area .inner .content .flow_step .btn_area li {
            width: 100%;
            max-width: none;
            line-height: 17.0666666667vw;
            border-radius: 17.0666666667vw; }
            .purchase_flow_area .inner .content .flow_step .btn_area li:first-of-type {
              margin-bottom: 4vw; }
            .purchase_flow_area .inner .content .flow_step .btn_area li a {
              font-size: 4.2666666667vw; } }

.lens_type_area {
  margin-bottom: 120px; }
  .lens_type_area .inner {
    width: 94%;
    margin: 0 auto;
    max-width: 910px; }
    @media screen and (max-width: 767px) {
      .lens_type_area .inner {
        width: 90%; } }
    .lens_type_area .inner .section_ttl1 {
      text-align: center;
      font-size: 23px;
      font-weight: 500;
      position: relative;
      color: #262626;
      padding-bottom: 15px;
      margin-bottom: 30px; }
      .lens_type_area .inner .section_ttl1::after {
        content: "";
        width: 44px;
        height: 5px;
        background: #4D779F;
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        border-radius: 2px; }
      @media screen and (max-width: 767px) {
        .lens_type_area .inner .section_ttl1 {
          font-size: 4.8vw;
          padding-bottom: 4.5333333333vw;
          margin-bottom: 7.7333333333vw; }
          .lens_type_area .inner .section_ttl1::after {
            width: 11.7333333333vw;
            height: 1.3333333333vw; } }
    .lens_type_area .inner ul {
      list-style: none;
      padding: 0;
      margin: 0;
      display: flex;
      align-items: flex-start;
      flex-wrap: wrap; }
      .lens_type_area .inner ul li {
        border: 1px solid #7C7C7C;
        border-radius: 5px;
        line-height: 78px;
        width: 30.77%;
        text-align: center; }
        @media screen and (min-width: 768px) {
          .lens_type_area .inner ul li:not(:nth-of-type(3n)) {
            margin-right: calc(7.69% / 2); }
          .lens_type_area .inner ul li:not(:nth-last-of-type(-n + 3)) {
            margin-bottom: calc(7.69% / 2); } }
        .lens_type_area .inner ul li a {
          display: block;
          font-size: 19px;
          font-weight: 500;
          text-decoration: none;
          color: #1C1C1C; }
  @media screen and (max-width: 1023px) {
    .lens_type_area {
      margin-bottom: 90px; } }
  @media screen and (max-width: 767px) {
    .lens_type_area {
      margin-bottom: 16vw; }
      .lens_type_area .inner ul li {
        width: 47%;
        line-height: 16vw; }
        .lens_type_area .inner ul li:nth-of-type(odd) {
          margin-right: 6%; }
        .lens_type_area .inner ul li:not(:nth-last-of-type(-n + 2)) {
          margin-bottom: 6%; }
        .lens_type_area .inner ul li a {
          font-size: 3.2vw; } }

.series_area {
  margin-bottom: 100px; }
  .series_area .inner {
    width: 94%;
    margin: 0 auto;
    max-width: 910px; }
    @media screen and (max-width: 767px) {
      .series_area .inner {
        width: 90%; } }
    .series_area .inner .section_ttl1 {
      text-align: center;
      font-size: 23px;
      font-weight: 500;
      position: relative;
      color: #262626;
      padding-bottom: 15px;
      margin-bottom: 30px; }
      .series_area .inner .section_ttl1::after {
        content: "";
        width: 44px;
        height: 5px;
        background: #4D779F;
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        border-radius: 2px; }
      @media screen and (max-width: 767px) {
        .series_area .inner .section_ttl1 {
          font-size: 4.8vw;
          padding-bottom: 4.5333333333vw;
          margin-bottom: 7.7333333333vw; }
          .series_area .inner .section_ttl1::after {
            width: 11.7333333333vw;
            height: 1.3333333333vw; } }
    .series_area .inner ul {
      list-style: none;
      padding: 0;
      margin: 0;
      display: flex;
      align-items: flex-start;
      flex-wrap: wrap; }
      @media screen and (min-width: 768px) {
        .series_area .inner ul li {
          width: 18.14%;
          margin-bottom: 3.8%; }
          .series_area .inner ul li:not(:nth-of-type(5n)) {
            margin-right: calc(9.3% / 4); } }
      .series_area .inner ul li a {
        display: block;
        text-decoration: none;
        color: #212121; }
        .series_area .inner ul li a img {
          margin-bottom: 4px; }
        .series_area .inner ul li a p {
          line-height: 1.69;
          font-size: 13px;
          text-align: center; }
  @media screen and (max-width: 767px) {
    .series_area {
      margin-bottom: 14.6666666667vw; }
      .series_area .inner ul li {
        width: calc(96.44% / 3);
        margin-bottom: 5vw; }
        .series_area .inner ul li:not(:nth-of-type(3n)) {
          margin-right: 1.78%; }
        .series_area .inner ul li a img {
          margin-bottom: 1.3333333333vw;
          width: 100%; }
        .series_area .inner ul li a p {
          font-size: 2.9333333333vw; } }

.topics_area {
  margin-bottom: 120px; }
  .topics_area .inner {
    width: 94%;
    margin: 0 auto;
    max-width: 1152px; }
    @media screen and (max-width: 767px) {
      .topics_area .inner {
        width: 90%; } }
    .topics_area .inner .section_ttl2 {
      text-align: center;
      font-size: 16px;
      margin-bottom: 50px; }
      .topics_area .inner .section_ttl2 span {
        font-family: forma-djr-micro,sans-serif;
        font-weight: 400;
        font-style: normal;
        display: block;
        font-size: 34px;
        font-weight: 700; }
      @media screen and (max-width: 767px) {
        .topics_area .inner .section_ttl2 {
          font-size: 2.6666666667vw;
          margin-bottom: 9.0666666667vw; }
          .topics_area .inner .section_ttl2 span {
            font-size: 7.4666666667vw; } }
    .topics_area .inner .topics_list {
      display: flex;
      align-items: flex-start;
      flex-wrap: wrap; }
      .topics_area .inner .topics_list .single {
        width: 21.71%;
        margin-bottom: 4.35%; }
        .topics_area .inner .topics_list .single:nth-child(n + 9) {
          display: none; }
        @media screen and (min-width: 768px) {
          .topics_area .inner .topics_list .single:not(:nth-of-type(4n)) {
            margin-right: 4.35%; } }
        .topics_area .inner .topics_list .single a {
          display: block;
          text-decoration: none; }
          .topics_area .inner .topics_list .single a img {
            margin-bottom: 8px; }
          .topics_area .inner .topics_list .single a p {
            font-size: 15px;
            line-height: 1.8;
            color: #262626; }
    .topics_area .inner .link_btn {
      width: 80%;
      max-width: 280px;
      margin: 0 auto;
      background: #7EB0D9;
      position: relative;
      border-radius: 50px;
      margin-top: 10px;
      cursor: pointer; }
      .topics_area .inner .link_btn::after {
        content: "";
        width: 9px;
        height: 9px;
        border-top: 2px solid #fff;
        border-right: 2px solid #fff;
        transform: rotate(45deg);
        right: 22px;
        top: calc(50% - 4.5px);
        position: absolute; }
      .topics_area .inner .link_btn a {
        display: block;
        line-height: 70px;
        color: #fff;
        font-size: 18px;
        font-weight: 500;
        text-align: center;
        text-decoration: none; }
      @media screen and (max-width: 767px) {
        .topics_area .inner .link_btn {
          width: 83%; }
          .topics_area .inner .link_btn a {
            font-size: 4.2666666667vw; } }
      .topics_area .inner .link_btn::after {
        transform: rotate(135deg);
        transition: .3s; }
      .topics_area .inner .link_btn.view::after {
        transform: rotate(315deg); }
  @media screen and (max-width: 767px) {
    .topics_area {
      margin-bottom: 15.4666666667vw; }
      .topics_area .inner .topics_list .single {
        width: 47%; }
        .topics_area .inner .topics_list .single:nth-of-type(odd) {
          margin-right: 6%; }
        .topics_area .inner .topics_list .single:not(:nth-last-of-type(-n + 2)) {
          margin-bottom: 8vw; }
        .topics_area .inner .topics_list .single a img {
          margin-bottom: 2.1333333333vw;
          width: 100%; }
        .topics_area .inner .topics_list .single a p {
          font-size: 2.9333333333vw; } }

.news_area {
  margin-bottom: 120px; }
  .news_area .inner {
    width: 94%;
    margin: 0 auto;
    max-width: 910px;
    border: 1px solid #7C7C7C;
    border-radius: 15px;
    padding: 50px 82px; }
    @media screen and (max-width: 767px) {
      .news_area .inner {
        width: 90%; } }
    .news_area .inner .section_ttl2 {
      text-align: center;
      font-size: 16px;
      margin-bottom: 50px; }
      .news_area .inner .section_ttl2 span {
        font-family: forma-djr-micro,sans-serif;
        font-weight: 400;
        font-style: normal;
        display: block;
        font-size: 34px;
        font-weight: 700; }
      @media screen and (max-width: 767px) {
        .news_area .inner .section_ttl2 {
          font-size: 2.6666666667vw;
          margin-bottom: 9.0666666667vw; }
          .news_area .inner .section_ttl2 span {
            font-size: 7.4666666667vw; } }
    .news_area .inner .news_list {
      margin-bottom: 38px;
      border-bottom: 1px solid #B9B9B9; }
      .news_area .inner .news_list .news_single {
        display: flex;
        align-items: flex-start;
        flex-wrap: wrap;
        flex-wrap: nowrap;
        align-items: flex-start;
        padding: 26px;
        border-top: 1px solid #B9B9B9; }
        .news_area .inner .news_list .news_single .post_data {
          font-size: 18px;
          margin-right: 66px; }
        .news_area .inner .news_list .news_single h3 {
          width: 100%; }
          .news_area .inner .news_list .news_single h3 a {
            display: block;
            text-decoration: none;
            color: #262626;
            font-size: 15px;
            line-height: 1.6;
            position: relative;
            padding-right: 45px; }
            .news_area .inner .news_list .news_single h3 a::after {
              content: "";
              width: 9px;
              height: 9px;
              border-top: 3px solid #4D779F;
              border-right: 3px solid #4D779F;
              transform: rotate(45deg);
              position: absolute;
              right: 0;
              top: calc(50% - 4.5px); }
    .news_area .inner .link_btn {
      width: 80%;
      max-width: 280px;
      margin: 0 auto;
      background: #7EB0D9;
      position: relative;
      border-radius: 50px; }
      .news_area .inner .link_btn::after {
        content: "";
        width: 9px;
        height: 9px;
        border-top: 2px solid #fff;
        border-right: 2px solid #fff;
        transform: rotate(45deg);
        right: 22px;
        top: calc(50% - 4.5px);
        position: absolute; }
      .news_area .inner .link_btn a {
        display: block;
        line-height: 70px;
        color: #fff;
        font-size: 18px;
        font-weight: 500;
        text-align: center;
        text-decoration: none; }
      @media screen and (max-width: 767px) {
        .news_area .inner .link_btn {
          width: 83%; }
          .news_area .inner .link_btn a {
            font-size: 4.2666666667vw; } }
  @media screen and (max-width: 1023px) {
    .news_area .inner {
      padding: 50px; } }
  @media screen and (max-width: 767px) {
    .news_area {
      margin-bottom: 14.4vw; }
      .news_area .inner {
        padding: 9.8666666667vw 4.5333333333vw 8vw; }
        .news_area .inner .news_list {
          margin-bottom: 8.2666666667vw; }
          .news_area .inner .news_list .news_single {
            display: block;
            padding: 5.8666666667vw 1.6vw;
            position: relative; }
            .news_area .inner .news_list .news_single::after {
              content: "";
              width: 2.1333333333vw;
              height: 2.1333333333vw;
              border-top: 2px solid #4D779F;
              border-right: 2px solid #4D779F;
              transform: rotate(45deg);
              position: absolute;
              right: 0;
              top: calc(50% - 1.07vw); }
            .news_area .inner .news_list .news_single .post_data {
              width: 100%;
              margin: 0 0 1.6vw;
              font-size: 3.4666666667vw; }
            .news_area .inner .news_list .news_single h3 a {
              font-size: 4vw; }
              .news_area .inner .news_list .news_single h3 a::after {
                display: none; }
        .news_area .inner .link_btn {
          width: 95%; } }