@charset "UTF-8";
#visual {
  min-width: 1040px;
  position: relative;
  overflow: hidden;
  z-index: 0; }
  @media (max-width: 480px) {
    #visual {
      min-width: 100%; } }
  #visual:before {
    height: 600px;
    width: 1600px;
    background: url(../img/title-bg.png) no-repeat top center;
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    z-index: -1; }
    @media (max-width: 480px) {
      #visual:before {
        content: none; } }
  #visual:after {
    height: 241px;
    width: 50%;
    background: rgba(0, 180, 222, 0.8);
    content: "";
    position: absolute;
    top: 100px;
    left: 0;
    z-index: -2; }
    @media (max-width: 480px) {
      #visual:after {
        content: none; } }
  #visual .visual {
    margin: 0 auto;
    max-width: 1020px; }
    @media (max-width: 480px) {
      #visual .visual {
        max-width: 100%; } }
    #visual .visual img {
      width: 100%;
      display: block; }

.top_concept {
  padding: 387px 0 100px;
  position: relative;
  overflow: hidden;
  z-index: 0; }
  @media (max-width: 480px) {
    .top_concept {
      padding: 52% 3% 40px; } }
  .top_concept:before {
    height: 659px;
    width: 1600px;
    background: url(../img/top-concept-img-pc.png) no-repeat top center;
    content: "";
    position: absolute;
    top: 25px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    z-index: -1; }
    @media (max-width: 480px) {
      .top_concept:before {
        height: 800px;
        width: 100%;
        background: url(../img/top-concept-img-sp.png) no-repeat top center/100%;
        top: 3px; } }
  .top_concept:after {
    height: 545px;
    width: 100%;
    background: #c7e1f5;
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: -2; }
    @media (max-width: 480px) {
      .top_concept:after {
        height: 90%; } }
  .top_concept_inner {
    margin: 0 auto;
    max-width: 1020px; }
    @media (max-width: 480px) {
      .top_concept_inner {
        max-width: 100%;
        background: #c7e1f5; } }
    .top_concept_inner:after {
      content: '';
      display: block;
      clear: both; }
    .top_concept_inner .top_concept_contents {
      box-sizing: border-box;
      padding: 28px 45px 45px;
      width: 510px;
      background: #fff;
      float: right; }
      @media (max-width: 480px) {
        .top_concept_inner .top_concept_contents {
          padding: 15px 30px 30px;
          width: 100%;
          float: none; } }
      .top_concept_inner .top_concept_contents_title {
        font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
        font-size: 5.5rem;
        font-weight: normal;
        letter-spacing: 5px;
        line-height: 1.4;
        border-bottom: 2px solid #00b4de;
        margin-bottom: 20px; }
        @media (max-width: 480px) {
          .top_concept_inner .top_concept_contents_title {
            font-size: 3.5rem;
            line-height: 1.6;
            margin-bottom: 15px; } }
      .top_concept_inner .top_concept_contents_message {
        margin-bottom: 45px; }
        @media (max-width: 480px) {
          .top_concept_inner .top_concept_contents_message {
            margin-bottom: 20px; } }
      .top_concept_inner .top_concept_contents .btn_base {
        margin: 0; }
        @media (max-width: 480px) {
          .top_concept_inner .top_concept_contents .btn_base {
            margin: 0 auto; } }

.top_works {
  padding: 65px 0; }
  @media (max-width: 480px) {
    .top_works {
      padding: 40px 3% 50px; } }
  .top_works_title {
    font-size: 1.3rem;
    font-weight: normal;
    line-height: 1.3;
    text-align: center;
    margin-bottom: 35px;
    padding-bottom: 10px;
    position: relative; }
    @media (max-width: 480px) {
      .top_works_title {
        line-height: 1.4;
        margin-bottom: 25px; } }
    .top_works_title:after {
      height: 2px;
      width: 60px;
      background: #00b4de;
      content: "";
      position: absolute;
      bottom: 0;
      left: 50%;
      transform: translateX(-50%);
      -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%); }
    .top_works_title span {
      font-size: 5.5rem;
      font-family: "Quicksand", sans-serif;
      letter-spacing: 3px;
      display: block; }
      @media (max-width: 480px) {
        .top_works_title span {
          font-size: 3.7rem; } }
  .top_works_inner_image {
    text-align: center;
    margin-bottom: 45px; }
    @media (max-width: 480px) {
      .top_works_inner_image {
        margin-bottom: 20px; } }
    @media (max-width: 480px) {
      .top_works_inner_image img {
        width: 100%; } }

.top_others {
  padding-bottom: 60px;
  background: #dff2fc; }
  @media (max-width: 480px) {
    .top_others {
      padding-bottom: 40px; } }
  .top_others_inner .top_others_title {
    margin: 0 auto;
    max-width: 1020px; }
    @media (max-width: 480px) {
      .top_others_inner .top_others_title {
        margin: 0;
        padding-left: 20px;
        max-width: 40%; } }
    .top_others_inner .top_others_title img {
      display: block; }
      @media (max-width: 480px) {
        .top_others_inner .top_others_title img {
          width: 100%; } }
  .top_others_inner .top_others_contents_set {
    padding: 110px 0 0; }
    @media (max-width: 480px) {
      .top_others_inner .top_others_contents_set {
        padding: 90px 0 0; } }
    .top_others_inner .top_others_contents_set:nth-child(1) {
      margin-bottom: 25px;
      background: url(../img/top-others-img01-pc.png) no-repeat top center; }
      @media (max-width: 480px) {
        .top_others_inner .top_others_contents_set:nth-child(1) {
          margin-bottom: 40px;
          background: url(../img/top-others-img01-sp.png) no-repeat top center/100%; } }
      .top_others_inner .top_others_contents_set:nth-child(1) .top_others_contents_set_inner:after {
        content: '';
        display: block;
        clear: both; }
      .top_others_inner .top_others_contents_set:nth-child(1) .top_others_contents_set_inner_detail {
        float: right; }
        .top_others_inner .top_others_contents_set:nth-child(1) .top_others_contents_set_inner_detail_title {
          letter-spacing: -8px; }
          @media (max-width: 480px) {
            .top_others_inner .top_others_contents_set:nth-child(1) .top_others_contents_set_inner_detail_title {
              letter-spacing: 0; } }
    .top_others_inner .top_others_contents_set:nth-child(2) {
      background: url(../img/top-others-img02-pc.png) no-repeat top center; }
      @media (max-width: 480px) {
        .top_others_inner .top_others_contents_set:nth-child(2) {
          background: url(../img/top-others-img02-sp.png) no-repeat top center/100%; } }
    .top_others_inner .top_others_contents_set_inner {
      margin: 0 auto;
      max-width: 1020px; }
      @media (max-width: 480px) {
        .top_others_inner .top_others_contents_set_inner {
          box-sizing: border-box;
          padding: 0 3%;
          max-width: 100%; } }
      .top_others_inner .top_others_contents_set_inner_detail {
        width: 360px; }
        @media (max-width: 480px) {
          .top_others_inner .top_others_contents_set_inner_detail {
            box-sizing: border-box;
            padding: 15px 30px 30px;
            width: 100%;
            background: #fff; } }
        .top_others_inner .top_others_contents_set_inner_detail_title {
          font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
          font-size: 5.5rem;
          font-weight: normal;
          letter-spacing: 5px;
          line-height: 1.4;
          border-bottom: 2px solid #00b4de;
          margin-bottom: 35px; }
          @media (max-width: 480px) {
            .top_others_inner .top_others_contents_set_inner_detail_title {
              font-size: 3.5rem;
              line-height: 1.6;
              margin-bottom: 15px; } }
        .top_others_inner .top_others_contents_set_inner_detail_message {
          line-height: 2; }
          @media (max-width: 480px) {
            .top_others_inner .top_others_contents_set_inner_detail_message {
              line-height: normal; } }

/*# sourceMappingURL=top.css.map */