@charset "UTF-8";
@media (min-width: 768px) {
  .sp {
    display: none; } }
@media (max-width: 767.98px) {
  .pc {
    display: none; } }
.c1 {
  color: #293B85; }

.c2 {
  color: #F2FAFE; }

.c3 {
  color: #F2F2EC; }

.c4 {
  color: #000; }

.c5 {
  color: #000; }

.bs1 {
  box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.2); }

.ts1 {
  text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1); }

.container {
  position: relative;
  text-align: left; }
.style--page_title {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 240px;
  background: url(../image/layout/page_title_back.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover; }
  @media (max-width: 767.98px) {
    .style--page_title {
      height: 160px; } }
  .style--page_title .title {
    display: flex;
    flex-direction: column;
    line-height: 1.5; }
    .style--page_title .title span, .style--page_title .title strong {
      display: block;
      color: #293B85; }
    .style--page_title .title span {
      font-size: 4rem;
      font-weight: bold; }
      @media (max-width: 767.98px) {
        .style--page_title .title span {
          font-size: 3rem; } }
    .style--page_title .title strong {
      font-size: 2.2rem; }
      @media (max-width: 767.98px) {
        .style--page_title .title strong {
          font-size: 1.8rem; } }
.anc {
  position: relative; }
  .anc > a {
    position: absolute;
    left: 0;
    top: 0; }
    .anc > a.-anc_3 {
      top: -150px; }
      @media (max-width: 767.98px) {
        .anc > a.-anc_3 {
          top: -50px; } }
.style--top_mainvisual {
  position: relative;
  width: 100%;
  /*@media (min-width:768px){ height: 100vh; }*/
  overflow: hidden;
  margin-top: -150px; }
  @media (max-width: 767.98px) {
    .style--top_mainvisual {
      margin-top: -100px; } }
  .style--top_mainvisual img {
    position: absolute;
    left: calc(50% - 1px);
    top: 50%;
    width: calc(100% + 1px);
    transform: translate(-50%, -50%); }
  .style--top_mainvisual:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: # ;
    opacity: 0.19; }
  .style--top_mainvisual:before {
    content: "";
    display: block;
    padding-top: 55%; }
.style--top_concept {
  padding: 100px 0 200px;
  background-image: url("../image/content/top/concept_back.jpg");
  background-size: 100% 100%; }
  @media (max-width: 767.98px) {
    .style--top_concept {
      padding: 50px 0 95px;
      overflow: hidden; } }
  @media (max-width: 767.98px) {
    .style--top_concept {
      background-image: url("../image/content/top/concept_back-sp.jpg");
      background-size: auto 100%; } }
  .style--top_concept .flex {
    display: flex; }
    @media (min-width: 768px) {
      .style--top_concept .flex {
        justify-content: space-between;
        align-items: center; } }
    @media (max-width: 767.98px) {
      .style--top_concept .flex {
        flex-direction: column-reverse; } }
    .style--top_concept .flex .text {
      color: #FFF;
      font-weight: bold;
      text-shadow: 1px 1px 10px rgba(0, 0, 0, 0.3); }
      @media (min-width: 768px) {
        .style--top_concept .flex .text {
          width: calc(100% - 550px); } }
      .style--top_concept .flex .text .hl {
        position: relative;
        margin-bottom: 30px;
        font-size: 4.8rem;
        font-weight: bold;
        text-align: center; }
        @media (max-width: 767.98px) {
          .style--top_concept .flex .text .hl {
            font-size: 4.2rem;
            line-height: 1.3; } }
        .style--top_concept .flex .text .hl span {
          display: block;
          position: absolute;
          left: 50%;
          top: calc(50% - 15px);
          width: 90%;
          transform: translate(-50%, -50%); }
          @media (max-width: 767.98px) {
            .style--top_concept .flex .text .hl span {
              width: 100%; } }
      .style--top_concept .flex .text .comment {
        font-size: 1.7rem;
        line-height: 2; }
    @media (min-width: 768px) {
      .style--top_concept .flex .image {
        width: 500px; } }
    @media (max-width: 767.98px) {
      .style--top_concept .flex .image {
        margin-bottom: 30px;
        text-align: center; } }
    .style--top_concept .flex .image img {
      width: 100%; }
      @media (max-width: 767.98px) {
        .style--top_concept .flex .image img {
          width: 260px; } }
.style--top_description {
  padding: 60px 0 100px;
  background-image: url("../image/content/top/description_back.jpg");
  background-repeat: no-repeat;
  background-position: center bottom; }
  @media (max-width: 767.98px) {
    .style--top_description {
      padding: 60px 0 40px;
      overflow: hidden; } }
  .style--top_description .hs, .style--top_description .hl {
    color: #293B85;
    font-weight: bold;
    text-align: center; }
  .style--top_description .hs {
    font-size: 3rem; }
    @media (max-width: 767.98px) {
      .style--top_description .hs {
        font-size: 1.8rem; } }
  .style--top_description .hl {
    margin-bottom: 30px;
    font-size: 3.5rem; }
    @media (max-width: 767.98px) {
      .style--top_description .hl {
        font-size: 2.8rem;
        line-height: 1.4; } }
  .style--top_description .comment {
    margin-bottom: 70px; }
    @media (max-width: 767.98px) {
      .style--top_description .comment {
        margin-bottom: 50px; } }
  .style--top_description .alert_box {
    margin-bottom: 100px;
    border: 3px solid #DB0000; }
    @media (min-width: 768px) {
      .style--top_description .alert_box {
        display: flex; } }
    @media (max-width: 767.98px) {
      .style--top_description .alert_box {
        margin-bottom: 75px; } }
    .style--top_description .alert_box .box_image {
      padding: 25px 30px;
      background: #DB0000;
      font-weight: bold;
      color: #FFF;
      text-align: center;
      font-size: 2.2rem; }
      .style--top_description .alert_box .box_image img {
        width: 200px;
        margin-bottom: 10px; }
    .style--top_description .alert_box .box_text {
      padding: 40px;
      display: flex;
      align-items: center; }
      @media (max-width: 767.98px) {
        .style--top_description .alert_box .box_text {
          padding: 30px; } }
      .style--top_description .alert_box .box_text .box_title {
        font-size: 3rem;
        font-weight: bold;
        color: #DB0000; }
        @media (max-width: 767.98px) {
          .style--top_description .alert_box .box_text .box_title {
            font-size: 2.2rem; } }
  .style--top_description .list ul {
    display: flex; }
    @media (max-width: 767.98px) {
      .style--top_description .list ul {
        flex-wrap: wrap; } }
    @media (min-width: 768px) {
      .style--top_description .list ul {
        margin-left: -15px;
        margin-right: -60px; } }
    @media (max-width: 767.98px) {
      .style--top_description .list ul {
        margin-right: -20px; } }
    .style--top_description .list ul li {
      padding: 0 0;
      text-align: center;
      font-weight: bold; }
      @media (max-width: 767.98px) {
        .style--top_description .list ul li {
          width: 50%;
          margin-bottom: 30px; } }
      .style--top_description .list ul li img {
        margin-bottom: 15px;
        transition: 0.3s; }
        @media (min-width: 768px) {
          .style--top_description .list ul li img:hover {
            transform: translateY(-8px); } }
      .style--top_description .list ul li strong {
        display: block;
        margin-top: -35px;
        padding-right: 40px;
        font-size: 1.8rem; }
        @media (max-width: 767.98px) {
          .style--top_description .list ul li strong {
            font-size: 1.6rem;
            margin-top: -25px;
            padding-right: 20px; } }
.style--top_media {
  background: url("../image/content/top/media_back.jpg") repeat center center; }
  .style--top_media .hl {
    padding: 35px 0;
    background: #F4F5F9;
    font-weight: bold;
    color: #293B85;
    line-height: 1.2; }
    .style--top_media .hl strong, .style--top_media .hl span {
      display: block; }
    .style--top_media .hl span {
      font-size: 3rem; }
  .style--top_media .flex {
    padding: 100px 0 250px; }
    @media (min-width: 768px) {
      .style--top_media .flex {
        display: flex;
        align-items: center; } }
    @media (max-width: 767.98px) {
      .style--top_media .flex {
        padding: 50px 0 100px; } }
    @media (min-width: 768px) {
      .style--top_media .flex .image {
        margin-right: 50px; } }
    @media (max-width: 767.98px) {
      .style--top_media .flex .image {
        text-align: center;
        padding: 0 40px;
        margin-bottom: 30px; } }
    .style--top_media .flex .text .title {
      margin-bottom: 25px;
      padding-bottom: 25px;
      border-bottom: 1px solid #CCC;
      font-weight: bold;
      font-size: 2.4rem;
      text-indent: -0.5em; }
      @media (max-width: 767.98px) {
        .style--top_media .flex .text .title {
          font-size: 2rem; } }
    .style--top_media .flex .text .comment {
      line-height: 2; }
    .style--top_media .flex + .flex {
      margin-top: -200px;
      padding: 0px 0 250px; }
      @media (max-width: 767.98px) {
        .style--top_media .flex + .flex {
          margin-top: 0;
          padding: 0px 0 100px; } }
.style--top_style {
  position: relative; }
  @media (min-width: 768px) {
    .style--top_style {
      margin-top: -30px;
      background: url(../image/content/top/style_back.png) no-repeat center top;
      background-size: 100% 1054px; } }
  .style--top_style .hl {
    margin-bottom: 0px; }
    @media (max-width: 767.98px) {
      .style--top_style .hl {
        position: absolute;
        top: -5px;
        left: 50%;
        z-index: 100;
        transform: translate(-50%, -50%);
        width: 100%;
        padding-right: 10%; } }
    .style--top_style .hl img {
      margin-top: -130px; }
      @media (max-width: 767.98px) {
        .style--top_style .hl img {
          margin-top: 0px; } }
  @media (min-width: 768px) {
    .style--top_style .flex {
      display: flex;
      padding: 100px 0; } }
  .style--top_style .flex .unit {
    padding: 0 0px; }
    @media (min-width: 768px) {
      .style--top_style .flex .unit {
        width: 50%; } }
    @media (max-width: 767.98px) {
      .style--top_style .flex .unit {
        margin-left: -15px;
        margin-right: -15px;
        padding: 60px 30px; } }
    .style--top_style .flex .unit .image {
      position: relative;
      margin-bottom: 30px;
      text-align: center; }
      @media (max-width: 767.98px) {
        .style--top_style .flex .unit .image {
          width: 250px;
          margin-left: auto;
          margin-right: auto;
          margin-bottom: 15px; } }
      .style--top_style .flex .unit .image:before {
        content: "";
        position: absolute;
        left: -20px;
        top: 0;
        display: block;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover; }
        @media (max-width: 767.98px) {
          .style--top_style .flex .unit .image:before {
            left: 0px;
            top: 5px; } }
      .style--top_style .flex .unit .image img {
        width: 400px; }
        @media (max-width: 767.98px) {
          .style--top_style .flex .unit .image img {
            width: 250px; } }
    .style--top_style .flex .unit .text {
      color: #FFF; }
      .style--top_style .flex .unit .text .title {
        text-align: center;
        font-size: 3rem;
        font-weight: bold;
        text-shadow: 1px 1px 6px rgba(0, 0, 0, 0.2); }
      .style--top_style .flex .unit .text .comment {
        text-shadow: 1px 1px 6px rgba(0, 0, 0, 0.2); }
      .style--top_style .flex .unit .text .more {
        margin-top: 30px;
        text-align: center; }
        .style--top_style .flex .unit .text .more a {
          display: inline-block;
          padding: 10px 20px;
          border: 2px solid #FFF;
          text-decoration: none;
          color: #FFF;
          font-weight: bold;
          transition: 0.2s; }
          .style--top_style .flex .unit .text .more a i {
            margin-right: 5px;
            vertical-align: middle; }
          .style--top_style .flex .unit .text .more a:hover {
            background: #293B85;
            border-color: #293B85; }
  @media (min-width: 768px) {
    .style--top_style .flex .-unit_1 {
      padding-right: 180px; } }
  @media (max-width: 767.98px) {
    .style--top_style .flex .-unit_1 {
      padding-top: 85px;
      background: #97CEE9; } }
  .style--top_style .flex .-unit_1 .image:before {
    width: 134px;
    height: 113px;
    background-image: url("../image/content/top/style_num_1.png"); }
    @media (max-width: 767.98px) {
      .style--top_style .flex .-unit_1 .image:before {
        width: 67px;
        height: 56px; } }
  @media (min-width: 768px) {
    .style--top_style .flex .-unit_2 {
      padding-left: 180px; } }
  @media (max-width: 767.98px) {
    .style--top_style .flex .-unit_2 {
      background: #8BB2E3; } }
  .style--top_style .flex .-unit_2 .image:before {
    width: 144px;
    height: 113px;
    background-image: url("../image/content/top/style_num_2.png"); }
    @media (max-width: 767.98px) {
      .style--top_style .flex .-unit_2 .image:before {
        width: 72px;
        height: 56px; } }
.style--top_item .list .unit {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url("../image/content/top/item_back_1.jpg");
  color: #FFF; }
  @media (max-width: 767.98px) {
    .style--top_item .list .unit {
      padding: 60px 0; } }
  .style--top_item .list .unit .flex {
    display: flex; }
    @media (min-width: 768px) {
      .style--top_item .list .unit .flex {
        align-items: center;
        justify-content: space-between; } }
    @media (max-width: 767.98px) {
      .style--top_item .list .unit .flex {
        flex-direction: column-reverse; } }
    @media (min-width: 768px) {
      .style--top_item .list .unit .flex .text {
        width: calc(100% - 450px);
        max-width: 500px; } }
    @media (max-width: 767.98px) {
      .style--top_item .list .unit .flex .text {
        text-align: center; } }
    .style--top_item .list .unit .flex .text .title, .style--top_item .list .unit .flex .text .comment {
      text-shadow: 1px 1px 6px rgba(0, 0, 0, 0.2);
      text-align: left; }
    .style--top_item .list .unit .flex .text .title {
      margin-bottom: 25px;
      font-weight: bold;
      line-height: 1.3; }
      @media (max-width: 767.98px) {
        .style--top_item .list .unit .flex .text .title {
          margin-bottom: 15px;
          display: inline-block;
          text-align: left; } }
      .style--top_item .list .unit .flex .text .title span, .style--top_item .list .unit .flex .text .title strong {
        display: block; }
      .style--top_item .list .unit .flex .text .title span {
        font-size: 3rem; }
        @media (max-width: 767.98px) {
          .style--top_item .list .unit .flex .text .title span {
            padding-bottom: 7px;
            font-size: 1.8rem; } }
      .style--top_item .list .unit .flex .text .title strong {
        font-size: 5rem; }
        @media (max-width: 767.98px) {
          .style--top_item .list .unit .flex .text .title strong {
            font-size: 3.5rem; } }
    .style--top_item .list .unit .flex .text .more {
      margin-top: 35px; }
      .style--top_item .list .unit .flex .text .more a {
        display: inline-block;
        padding: 10px 20px;
        border: 2px solid #FFF;
        text-decoration: none;
        color: #FFF;
        font-weight: bold;
        transition: 0.2s; }
        .style--top_item .list .unit .flex .text .more a i {
          margin-right: 5px;
          vertical-align: middle; }
        .style--top_item .list .unit .flex .text .more a:hover {
          background: #293B85;
          border-color: #293B85; }
    @media (min-width: 768px) {
      .style--top_item .list .unit .flex .image {
        width: 400px;
        padding: 70px 0; } }
    @media (max-width: 767.98px) {
      .style--top_item .list .unit .flex .image {
        text-align: center; } }
    @media (min-width: 768px) {
      .style--top_item .list .unit .flex .image img {
        width: 480px;
        max-width: none;
        margin-top: 50px; } }
    @media (max-width: 767.98px) {
      .style--top_item .list .unit .flex .image img {
        max-width: 280px;
        margin-right: -30px; } }
  .style--top_item .list .unit.-unit_1 {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url("../image/content/top/item_back_1.jpg"); }
    @media (max-width: 767.98px) {
      .style--top_item .list .unit.-unit_1 {
        background-image: url("../image/content/top/item_back_1-sp.jpg"); } }
  .style--top_item .list .unit.-unit_2 {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url("../image/content/top/item_back_2.jpg"); }
    @media (max-width: 767.98px) {
      .style--top_item .list .unit.-unit_2 {
        background-image: url("../image/content/top/item_back_2-sp.jpg"); } }
  .style--top_item .list .unit.-unit_3 {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url("../image/content/top/item_back_3.jpg"); }
    @media (max-width: 767.98px) {
      .style--top_item .list .unit.-unit_3 {
        background-image: url("../image/content/top/item_back_3-sp.jpg"); } }
  .style--top_item .list .unit.-unit_4 {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url("../image/content/top/item_back_4.jpg"); }
    @media (max-width: 767.98px) {
      .style--top_item .list .unit.-unit_4 {
        background-image: url("../image/content/top/item_back_4-sp.jpg"); } }
  .style--top_item .list .unit.-unit_5 {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url("../image/content/top/item_back_4.jpg"); }
    @media (max-width: 767.98px) {
      .style--top_item .list .unit.-unit_5 {
        background-image: url("../image/content/top/item_back_4-sp.jpg"); } }		
.style--top_scene .hl {
  padding: 35px 0;
  background: #293B85;
  font-weight: bold;
  color: #FFF;
  line-height: 1.2; }
  .style--top_scene .hl strong, .style--top_scene .hl span {
    display: block; }
  .style--top_scene .hl span {
    font-size: 3rem; }
.style--top_scene ul {
  display: flex;
  flex-wrap: wrap; }
  .style--top_scene ul .unit {
    position: relative;
    width: 20%;
    color: #FFF;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.8rem;
    white-space: nowrap; }
    @media (max-width: 767.98px) {
      .style--top_scene ul .unit {
        width: 50%; } }
    @media (max-width: 767.98px) {
      .style--top_scene ul .unit {
        font-size: 1.8rem; } }
    .style--top_scene ul .unit:after {
      content: "";
      display: block;
      padding-top: 60%; }
    .style--top_scene ul .unit:before {
      content: "";
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      background: rgba(0, 0, 0, 0.1); }
    .style--top_scene ul .unit.-unit_1 {
      background-position: center center;
      background-repeat: no-repeat;
      background-size: cover;
      background-image: url("../image/content/top/scene_1.jpg"); }
    .style--top_scene ul .unit.-unit_2 {
      background-position: center center;
      background-repeat: no-repeat;
      background-size: cover;
      background-image: url("../image/content/top/scene_2.jpg"); }
    .style--top_scene ul .unit.-unit_3 {
      background-position: center center;
      background-repeat: no-repeat;
      background-size: cover;
      background-image: url("../image/content/top/scene_3.jpg"); }
    .style--top_scene ul .unit.-unit_4 {
      background-position: center center;
      background-repeat: no-repeat;
      background-size: cover;
      background-image: url("../image/content/top/scene_4.jpg"); }
    .style--top_scene ul .unit.-unit_5 {
      background-position: center center;
      background-repeat: no-repeat;
      background-size: cover;
      background-image: url("../image/content/top/scene_5.jpg"); }
    .style--top_scene ul .unit.-unit_6 {
      background-position: center center;
      background-repeat: no-repeat;
      background-size: cover;
      background-image: url("../image/content/top/scene_6.jpg"); }
    .style--top_scene ul .unit.-unit_7 {
      background-position: center center;
      background-repeat: no-repeat;
      background-size: cover;
      background-image: url("../image/content/top/scene_7.jpg"); }
    .style--top_scene ul .unit.-unit_8 {
      background-position: center center;
      background-repeat: no-repeat;
      background-size: cover;
      background-image: url("../image/content/top/scene_8.jpg"); }
    .style--top_scene ul .unit.-unit_9 {
      background-position: center center;
      background-repeat: no-repeat;
      background-size: cover;
      background-image: url("../image/content/top/scene_9.jpg"); }
    .style--top_scene ul .unit.-unit_10 {
      background-position: center center;
      background-repeat: no-repeat;
      background-size: cover;
      background-image: url("../image/content/top/scene_10.jpg"); }
.style--top_comparison {
  padding: 100px 0; }
  @media (max-width: 767.98px) {
    .style--top_comparison {
      padding: 60px 0; } }
  .style--top_comparison .hl {
    margin-bottom: 30px;
    text-align: center;
    font-size: 3.5rem;
    font-weight: bold;
    color: #293B85; }
    @media (max-width: 767.98px) {
      .style--top_comparison .hl {
        font-size: 2.8rem; } }
  .style--top_comparison .table {
    width: 871px;
    margin-left: auto;
    margin-right: auto;
    max-width: 100%; }
  .style--top_comparison .more {
    margin-top: 30px;
    text-align: center; }
    .style--top_comparison .more a {
      display: inline-block;
      padding: 10px 20px;
      border: 2px solid #293B85;
      text-decoration: none;
      color: #293B85;
      font-weight: bold;
      transition: 0.2s; }
      .style--top_comparison .more a i {
        margin-right: 5px;
        vertical-align: middle; }
      .style--top_comparison .more a:hover {
        background: #293B85;
        border-color: #293B85;
        color: #FFF; }
.style--faq_list {
  padding: 0 0 100px; }
  @media (max-width: 767.98px) {
    .style--faq_list {
      padding: 0 0 75px; } }
  .style--faq_list .hl {
    margin-bottom: 30px;
    text-align: center;
    font-size: 3.5rem;
    font-weight: bold;
    color: #293B85; }
    @media (max-width: 767.98px) {
      .style--faq_list .hl {
        font-size: 2.8rem; } }
  .style--faq_list dl {
    margin-bottom: 40px; }
    .style--faq_list dl dt {
      position: relative;
      display: flex;
      align-items: center;
      background: #F6F6F5;
      border-radius: 10px;
      font-size: 1.8rem; }
      @media (min-width: 768px) {
        .style--faq_list dl dt {
          min-height: 90px; } }
      @media (max-width: 767.98px) {
        .style--faq_list dl dt {
          font-size: 1.5rem; } }
      .style--faq_list dl dt.-active + dd {
        display: block;
        padding: 30px; }
        @media (max-width: 767.98px) {
          .style--faq_list dl dt.-active + dd {
            padding-bottom: 0;
            padding-top: 20px; } }
      .style--faq_list dl dt.-active a {
        color: #293B85; }
        .style--faq_list dl dt.-active a:after {
          content: "\e15b"; }
      .style--faq_list dl dt a {
        position: relative;
        display: block;
        width: 100%;
        padding: 15px;
        padding-right: 40px;
        padding-left: 70px;
        color: #515151;
        text-decoration: none;
        font-weight: bold; }
        @media (max-width: 767.98px) {
          .style--faq_list dl dt a {
            padding-left: 50px; } }
        .style--faq_list dl dt a:after {
          content: "\e145";
          position: absolute;
          right: 25px;
          top: 50%;
          transform: translateY(-50%);
          color: #293B85;
          font-size: 3.2rem;
          font-weight: bold;
          font-family: 'Material Icons'; }
          @media (max-width: 767.98px) {
            .style--faq_list dl dt a:after {
              font-size: 2.4rem;
              right: 10px; } }
        .style--faq_list dl dt a:before {
          content: "Q";
          position: absolute;
          left: 25px;
          top: -7px;
          font-weight: bold;
          font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", sans-serif;
          font-size: 4rem;
          color: #293B85; }
          @media (max-width: 767.98px) {
            .style--faq_list dl dt a:before {
              left: 15px;
              top: 50%;
              transform: translateY(-55%);
              font-size: 3rem; } }
    .style--faq_list dl dd {
      display: none; }
      @media (max-width: 767.98px) {
        .style--faq_list dl dd {
          font-size: 1.5rem; } }
    .style--faq_list dl dd + dt {
      margin-top: 35px; }
@media (min-width: 768px) {
  .style--howto_movie {
    padding-top: 100px;
    padding-bottom: 100px; } }
@media (max-width: 767.98px) {
  .style--howto_movie {
    padding-top: 50px;
    padding-bottom: 50px; } }
.style--howto_movie .hl {
  margin-bottom: 50px;
  font-size: 3rem;
  text-align: center;
  font-weight: bold;
  color: #293B85; }
  @media (max-width: 767.98px) {
    .style--howto_movie .hl {
      font-size: 2.6rem;
      margin-bottom: 25px; } }
@media (min-width: 768px) {
  .style--howto_movie .list {
    display: flex;
    margin-left: -30px;
    margin-right: -30px; } }
@media (min-width: 768px) {
  .style--howto_movie .list .unit {
    width: 50%;
    padding-left: 30px;
    padding-right: 30px; } }
.style--howto_movie .list .unit a {
  display: block;
  text-decoration: none; }
.style--howto_movie .list .unit .movie {
  position: relative;
  width: 100%;
  margin-bottom: 15px;
  border-radius: 20px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover; }
  @media (max-width: 767.98px) {
    .style--howto_movie .list .unit .movie {
      border-radius: 10px; } }
  .style--howto_movie .list .unit .movie:after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    display: block;
    width: 77px;
    height: 55px;
    background: url(../image/layout/icon_play.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    transform: translate(-50%, -50%); }
    @media (max-width: 767.98px) {
      .style--howto_movie .list .unit .movie:after {
        width: 50px;
        height: 35px; } }
  .style--howto_movie .list .unit .movie:before {
    content: "";
    display: block;
    padding-top: 60%; }
.style--howto_movie .list .unit .caption {
  text-align: center;
  color: #666; }
@media (max-width: 767.98px) {
  .style--howto_movie .list .unit + .unit {
    margin-top: 30px; } }
.style--howto_flow {
  background: #F2FAFE; }
  @media (min-width: 768px) {
    .style--howto_flow {
      padding-top: 100px;
      padding-bottom: 100px; } }
  @media (max-width: 767.98px) {
    .style--howto_flow {
      padding-top: 50px;
      padding-bottom: 50px; } }
  .style--howto_flow .hl {
    margin-bottom: 50px;
    font-size: 3rem;
    text-align: center;
    font-weight: bold;
    color: #293B85; }
    @media (max-width: 767.98px) {
      .style--howto_flow .hl {
        font-size: 2.6rem;
        margin-bottom: 25px; } }
  .style--howto_flow .list {
    position: relative; }
    .style--howto_flow .list .unit {
      margin-bottom: 100px; }
      @media (min-width: 768px) {
        .style--howto_flow .list .unit {
          display: flex; } }
      @media (max-width: 767.98px) {
        .style--howto_flow .list .unit {
          margin-bottom: 75px; } }
      .style--howto_flow .list .unit .image {
        border-radius: 20px; }
        @media (min-width: 768px) {
          .style--howto_flow .list .unit .image {
            width: 300px; } }
        @media (max-width: 767.98px) {
          .style--howto_flow .list .unit .image {
            position: relative;
            z-index: 100; } }
        @media (max-width: 767.98px) {
          .style--howto_flow .list .unit .image {
            text-align: center; } }
      .style--howto_flow .list .unit .text {
        position: relative;
        padding-left: 100px;
        padding-top: 50px; }
        @media (max-width: 767.98px) {
          .style--howto_flow .list .unit .text {
            padding-left: 50px;
            padding-top: 35px; } }
        .style--howto_flow .list .unit .text .title {
          position: relative;
          margin-bottom: 15px;
          font-size: 2.2rem;
          font-weight: bold; }
          @media (max-width: 767.98px) {
            .style--howto_flow .list .unit .text .title {
              font-size: 2rem; } }
          .style--howto_flow .list .unit .text .title .after {
            display: block;
            position: absolute;
            left: -45px;
            top: 5px;
            z-index: 100;
            width: 30px;
            height: 30px;
            background: #293B85;
            border: 5px solid #293B85;
            border-radius: 100px; }
            @media (max-width: 767.98px) {
              .style--howto_flow .list .unit .text .title .after {
                width: 25px;
                height: 25px;
                left: -35px; } }
            .style--howto_flow .list .unit .text .title .after:after {
              content: "";
              width: 10px;
              height: 5px;
              position: absolute;
              left: 50%;
              top: -10px;
              background: #F2FAFE;
              transform: translateX(-50%); }
            .style--howto_flow .list .unit .text .title .after:before {
              content: "";
              width: 10px;
              height: 5px;
              position: absolute;
              left: 50%;
              bottom: -10px;
              background: #F2FAFE;
              transform: translateX(-50%); }
        @media (min-width: 768px) {
          .style--howto_flow .list .unit .text p {
            font-size: 1.8rem;
            line-height: 2; } }
        .style--howto_flow .list .unit .text p span {
          position: relative;
          display: inline-block;
          font-weight: bold;
          background: linear-gradient(transparent 60%, #ff6 60%, #ff6 90%, #fff 100%); }
      .style--howto_flow .list .unit .sub {
        margin-top: 40px;
        margin-bottom: 15px;
        padding: 3px 20px 7px;
        background: #293B85;
        font-weight: bold;
        color: #FFF;
        text-align: center;
        font-size: 2rem; }
        @media (min-width: 768px) {
          .style--howto_flow .list .unit .sub {
            display: inline-block;
            min-width: 300px; } }
        @media (max-width: 767.98px) {
          .style--howto_flow .list .unit .sub {
            display: block; } }
      .style--howto_flow .list .unit:last-child {
        position: relative; }
        .style--howto_flow .list .unit:last-child .text .title .after {
          background: #FFF; }
        @media (max-width: 767.98px) {
          .style--howto_flow .list .unit:last-child .text:before {
            content: "";
            display: block;
            position: absolute;
            left: 368px;
            top: 60px;
            z-index: 15;
            width: 4px;
            height: calc(100% - 60px);
            background: #F2FAFE; } }
  @media (max-width: 767.98px) and (max-width: 767.98px) {
    .style--howto_flow .list .unit:last-child .text:before {
      left: 25px; } }

        @media (min-width: 768px) {
          .style--howto_flow .list .unit:last-child:before {
            content: "";
            display: block;
            position: absolute;
            left: 368px;
            top: 80px;
            z-index: 15;
            width: 4px;
            height: calc(100% - 60px);
            background: #F2FAFE; } }
  @media (min-width: 768px) and (max-width: 767.98px) {
    .style--howto_flow .list .unit:last-child:before {
      left: 25px; } }

    .style--howto_flow .list:after {
      content: "";
      display: block;
      position: absolute;
      left: 368px;
      top: 60px;
      z-index: 10;
      width: 4px;
      height: calc(100% - 60px);
      background: #D4DDEC; }
      @media (max-width: 767.98px) {
        .style--howto_flow .list:after {
          left: 25px; } }
@media (min-width: 768px) {
  .style--howto_lineup {
    padding-top: 100px;
    padding-bottom: 100px; } }
@media (max-width: 767.98px) {
  .style--howto_lineup {
    padding-top: 50px;
    padding-bottom: 50px; } }
.style--howto_lineup .hl {
  margin-bottom: 50px;
  font-size: 3rem;
  text-align: center;
  font-weight: bold;
  color: #293B85; }
  @media (max-width: 767.98px) {
    .style--howto_lineup .hl {
      font-size: 2.6rem;
      margin-bottom: 25px; } }
.style--howto_lineup .list {
  display: flex; }
  @media (max-width: 767.98px) {
    .style--howto_lineup .list {
      flex-wrap: wrap; } }
  @media (max-width: 767.98px) {
    .style--howto_lineup .list .unit {
      width: 50%;
      margin-bottom: 25px; } }
  .style--howto_lineup .list .unit .image img {
    width: 100%; }
  .style--howto_lineup .list .unit .name {
    text-align: center;
    font-weight: bold;
    padding-right: 40px;
    margin-top: -15px;
    font-size: 1.8rem; }
    @media (max-width: 767.98px) {
      .style--howto_lineup .list .unit .name {
        padding-right: 25px;
        margin-top: -10px;
        font-size: 1.6rem; } }