@media screen and (max-width: 768px) {
  section {
    padding: 0 3.5%; } }
section.top {
  padding: 50px 0 70px;
  background-color: #8fcbd1; }
  @media screen and (max-width: 768px) {
    section.top {
      padding: 90px 0 6%; } }
  section.top .inner .slideWrap {
    overflow: hidden; }
  section.top .inner img.copy {
    position: absolute;
    bottom: -25px;
    right: -30px; }
    @media screen and (max-width: 768px) {
      section.top .inner img.copy {
        width: 60%;
        bottom: 0;
        right: 2%;
        transform: translateY(50%); } }
section.news {
  padding: 90px 0 115px; }
  @media screen and (max-width: 768px) {
    section.news {
      padding: 40px 0; } }
  section.news h2 {
    margin-bottom: 55px; }
    @media screen and (max-width: 768px) {
      section.news h2 {
        margin-bottom: 24px; } }
  section.news ul {
    max-width: 800px;
    width: 100%;
    margin: 0 auto; }
    @media screen and (max-width: 768px) {
      section.news ul {
        padding-left: 45px; } }
    section.news ul li {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      padding: 15px 0; }
      @media screen and (max-width: 768px) {
        section.news ul li {
          padding: 8px 0; } }
      section.news ul li:first-child {
        position: relative; }
        section.news ul li:first-child::before {
          content: '';
          width: 52px;
          height: 20px;
          background: url(/index/img/news_new.png) no-repeat center center/contain;
          position: absolute;
          top: 50%;
          left: -70px;
          transform: translateY(-50%); }
          @media screen and (max-width: 768px) {
            section.news ul li:first-child::before {
              width: 40px;
              top: 17px;
              left: -45px; } }
      section.news ul li:not(:nth-last-of-type(1)) {
        border-bottom: 1px dashed #b3b3b3; }
      section.news ul li b {
        width: 120px; }
        @media screen and (max-width: 768px) {
          section.news ul li b {
            width: 100px; } }
      section.news ul li span {
        width: 65px;
        height: 25px;
        margin-right: 30px; }
        @media screen and (max-width: 768px) {
          section.news ul li span {
            margin-right: auto; } }
      @media screen and (max-width: 768px) {
        section.news ul li p {
          width: 100%;
          padding-top: 5px;
          line-height: 1.4; } }
      section.news ul li p a {
        text-decoration: underline; }
        section.news ul li p a:hover {
          text-decoration: none; }
      section.news ul li.blog span {
        background: url(/index/img/news_label_blog.gif) no-repeat center center/contain; }
      section.news ul li.news span {
        background: url(/index/img/news_label_news.gif) no-repeat center center/contain; }
section.about {
  padding: 150px 0 60px;
  background: url(/index/img/about_bg.gif) repeat center center; }
  @media screen and (max-width: 768px) {
    section.about {
      padding: 40px 0; } }
  @media screen and (max-width: 768px) {
    section.about h2 {
      margin-bottom: 24px; } }
  section.about .cntWrap {
    margin: -110px auto 50px;
    padding: 0 50px;
    position: relative; }
    @media screen and (max-width: 768px) {
      section.about .cntWrap {
        margin: 0;
        padding: 0; } }
    section.about .cntWrap::before {
      content: '';
      display: block;
      width: 700px;
      height: 450px;
      background-color: #9a9590;
      position: absolute;
      top: 10px;
      right: 100px;
      z-index: 0; }
      @media screen and (max-width: 768px) {
        section.about .cntWrap::before {
          width: 100%;
          height: auto;
          padding-top: 64.3%;
          right: auto;
          left: 10px; } }
    section.about .cntWrap > img {
      display: block;
      margin: 0 60px 0 auto;
      position: relative;
      z-index: 2; }
    section.about .cntWrap .cntBox {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      width: 700px;
      height: 320px;
      margin: -30px 0 30px;
      padding: 50px;
      background-color: #8fcbd1;
      position: relative;
      left: 100px;
      z-index: 1; }
      @media screen and (max-width: 768px) {
        section.about .cntWrap .cntBox {
          width: 100%;
          height: auto;
          margin: -10px 0 18px;
          padding: 30px 7.5% 50px;
          left: 0; } }
      section.about .cntWrap .cntBox h3 {
        width: 100%;
        margin-bottom: 15px;
        color: #fff;
        font-size: 30px; }
        @media screen and (max-width: 768px) {
          section.about .cntWrap .cntBox h3 {
            margin-bottom: 8px;
            font-size: 22px; } }
      section.about .cntWrap .cntBox p {
        line-height: 1.8; }
        @media screen and (max-width: 768px) {
          section.about .cntWrap .cntBox p {
            line-height: 1.6; } }
      section.about .cntWrap .cntBox img {
        position: absolute; }
        section.about .cntWrap .cntBox img:nth-of-type(1) {
          top: -100px;
          left: 30px; }
        section.about .cntWrap .cntBox img:nth-of-type(2) {
          right: -40px;
          bottom: 60px; }
          @media screen and (max-width: 768px) {
            section.about .cntWrap .cntBox img:nth-of-type(2) {
              width: 50px;
              right: 3.5%;
              bottom: 10px; } }
section.works {
  padding: 100px 0; }
  @media screen and (max-width: 768px) {
    section.works {
      padding: 40px 0; } }
  section.works h2 {
    margin-bottom: 70px; }
    @media screen and (max-width: 768px) {
      section.works h2 {
        margin-bottom: 24px; } }
  section.works .inner .cntWrap {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    max-width: 1000px;
    width: 100%;
    margin: 0 auto; }
    section.works .inner .cntWrap.before_after {
      margin-bottom: 35px;
      position: relative; }
      @media screen and (max-width: 768px) {
        section.works .inner .cntWrap.before_after {
          flex-wrap: wrap;
          margin-bottom: 10px; } }
      section.works .inner .cntWrap.before_after::after {
        content: '';
        border-top: 20px solid transparent;
        border-left: 20px solid #8fcbd1;
        border-bottom: 20px solid transparent;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%); }
        @media screen and (max-width: 768px) {
          section.works .inner .cntWrap.before_after::after {
            border-top: 20px solid #8fcbd1;
            border-left: 20px solid transparent;
            border-right: 20px solid transparent;
            border-bottom: none;
            transform: translate(-50%, -150%); } }
      section.works .inner .cntWrap.before_after > img {
        position: absolute;
        top: -45px;
        right: -45px; }
        @media screen and (max-width: 768px) {
          section.works .inner .cntWrap.before_after > img {
            width: 40px;
            top: -50px;
            right: 0; } }
      @media screen and (max-width: 768px) {
        section.works .inner .cntWrap.before_after .cntBox {
          max-width: 475px;
          width: 100%;
          margin: 0 auto;
          margin-bottom: 20px; } }
      section.works .inner .cntWrap.before_after .cntBox.before > img {
        box-shadow: 5px 5px 0px 0px #9a9590; }
      section.works .inner .cntWrap.before_after .cntBox.after > img {
        box-shadow: 5px 5px 0px 0px #8fcbd1; }
      section.works .inner .cntWrap.before_after .cntBox > img {
        margin-bottom: 15px; }
    section.works .inner .cntWrap.ex {
      margin-bottom: 45px;
      position: relative; }
      @media screen and (max-width: 768px) {
        section.works .inner .cntWrap.ex {
          margin-bottom: 25px; } }
      section.works .inner .cntWrap.ex > img {
        position: absolute;
        top: -60px;
        left: -50px; }
        @media screen and (max-width: 768px) {
          section.works .inner .cntWrap.ex > img {
            width: 34px;
            top: -40px;
            left: 10px; } }
      @media screen and (max-width: 768px) {
        section.works .inner .cntWrap.ex .cntBox {
          width: 30%; } }
  section.works .inner p.lead {
    margin-bottom: 60px;
    text-align: center;
    font-size: 20px; }
    @media screen and (max-width: 768px) {
      section.works .inner p.lead {
        font-size: 18px; } }
section p.more {
  display: flex;
  justify-content: flex-end; }
  section p.more a {
    padding: 0 50px 10px 0;
    font-size: 20px;
    font-weight: bold;
    position: relative; }
    @media screen and (max-width: 768px) {
      section p.more a {
        padding: 0 30px 5px 0;
        font-size: 16px; } }
    section p.more a:hover::after {
      right: 0; }
    section p.more a::after {
      content: '';
      width: 100%;
      height: 25px;
      border-right: 2px solid #000;
      border-bottom: 2px solid #000;
      position: absolute;
      bottom: 0;
      right: 10px;
      transform: skew(45deg);
      -moz-transition: all 0.3s;
      -webkit-transition: all 0.3s;
      -o-transition: all 0.3s;
      -ms-transition: all 0.3s;
      transition: all 0.3s; }
      @media screen and (max-width: 768px) {
        section p.more a::after {
          height: 15px; } }
section.sns {
  padding: 70px 0;
  background-color: #8fcbd1; }
  @media screen and (max-width: 768px) {
    section.sns {
      padding: 40px 0; } }
  section.sns .cntWrap {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    max-width: 1000px;
    width: 100%;
    margin: 0 auto; }
    @media screen and (max-width: 768px) {
      section.sns .cntWrap {
        justify-content: center; } }
    section.sns .cntWrap .cntBox .frame {
      position: relative; }
    @media screen and (max-width: 768px) {
      section.sns .cntWrap .cntBox.fb {
        width: 100%;
        margin-bottom: 42px; } }
    section.sns .cntWrap .cntBox.fb .frame {
      width: 360px;
      border: 1px solid #b3b3b3; }
      @media screen and (max-width: 768px) {
        section.sns .cntWrap .cntBox.fb .frame {
          max-width: 500px;
          width: 100%;
          margin: 0 auto; } }
      section.sns .cntWrap .cntBox.fb .frame > img {
        position: absolute;
        top: -75px;
        left: -50px; }
        @media screen and (max-width: 768px) {
          section.sns .cntWrap .cntBox.fb .frame > img {
            width: 30px;
            top: -60px;
            left: 10px; } }
      section.sns .cntWrap .cntBox.fb .frame .fb-page {
        width: 100%; }
    section.sns .cntWrap .cntBox.ig {
      width: 600px; }
      @media screen and (max-width: 768px) {
        section.sns .cntWrap .cntBox.ig {
          width: 100%; } }
      section.sns .cntWrap .cntBox.ig .frame > img {
        position: absolute;
        top: -90px;
        right: -50px; }
        @media screen and (max-width: 768px) {
          section.sns .cntWrap .cntBox.ig .frame > img {
            max-width: 40%;
            top: -70px;
            right: 10px; } }
      section.sns .cntWrap .cntBox.ig #insta-window {
        height: 500px;
        border-radius: 0 !important;
        overflow-y: scroll; }
        section.sns .cntWrap .cntBox.ig #insta-window img.iswd-icon {
          max-width: 150px; }
    section.sns .cntWrap .cntBox > p {
      margin-bottom: 30px;
      text-align: center; }
      @media screen and (max-width: 768px) {
        section.sns .cntWrap .cntBox > p {
          margin-bottom: 16px; } }
    section.sns .cntWrap .cntBox .frame {
      display: block;
      width: 100%; }
section.company {
  padding: 90px 0;
  background-color: #f9f6f2; }
  @media screen and (max-width: 768px) {
    section.company {
      padding: 40px 0; } }
  section.company .inner h2 {
    margin-bottom: 60px; }
    @media screen and (max-width: 768px) {
      section.company .inner h2 {
        margin-bottom: 24px; } }
  section.company .inner .cntWrap {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    max-width: 800px;
    width: 100%;
    margin: 0 auto 50px;
    padding: 0 55px; }
    @media screen and (max-width: 768px) {
      section.company .inner .cntWrap {
        padding: 0; } }
    @media screen and (max-width: 768px) {
      section.company .inner .cntWrap .logo {
        width: 100%;
        padding: 0 10px 20px;
        text-align: center; } }
    section.company .inner .cntWrap .txt {
      width: 510px; }
      @media screen and (max-width: 768px) {
        section.company .inner .cntWrap .txt {
          width: 100%; } }
      section.company .inner .cntWrap .txt dl {
        display: flex; }
        section.company .inner .cntWrap .txt dl dt {
          width: 29%;
          padding: 16px 0;
          border-bottom: 1px solid #b3b3b3;
          text-align: center;
          font-weight: bold; }
          @media screen and (max-width: 768px) {
            section.company .inner .cntWrap .txt dl dt {
              padding: 8px 0; } }
        section.company .inner .cntWrap .txt dl dd {
          width: 71%;
          padding: 16px 0 16px 7%;
          border-bottom: 1px dashed #b3b3b3; }
          @media screen and (max-width: 768px) {
            section.company .inner .cntWrap .txt dl dd {
              padding: 8px 0 8px 5%; } }
  section.company .inner .map {
    max-width: 800px;
    width: 100%;
    margin: 0 auto; }
    section.company .inner .map iframe {
      display: block;
      width: 100%;
      height: 440px; }
section.btm {
  padding: 100px 0 150px; }
  @media screen and (max-width: 768px) {
    section.btm {
      padding: 40px 0; } }
  section.btm .cntWrap {
    max-width: 1200px;
    width: 100%;
    margin: auto; }
    section.btm .cntWrap .cntBox {
      display: flex;
      flex-wrap: wrap;
      position: relative; }
      @media screen and (max-width: 768px) {
        section.btm .cntWrap .cntBox {
          align-items: flex-start; } }
      section.btm .cntWrap .cntBox img.ttl {
        width: 50%; }
        @media screen and (max-width: 768px) {
          section.btm .cntWrap .cntBox img.ttl {
            width: 100%; } }
      section.btm .cntWrap .cntBox .txt {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 50%;
        padding-bottom: 30px;
        position: relative; }
        @media screen and (max-width: 768px) {
          section.btm .cntWrap .cntBox .txt {
            width: 100%;
            padding: 60px 3.5%; } }
        section.btm .cntWrap .cntBox .txt img {
          position: absolute; }
        section.btm .cntWrap .cntBox .txt p.more {
          width: 100%;
          padding: 0 50px 30px 0;
          position: absolute;
          bottom: 0;
          right: 0; }
          @media screen and (max-width: 768px) {
            section.btm .cntWrap .cntBox .txt p.more {
              padding: 0 3.5% 15px 0; } }
      section.btm .cntWrap .cntBox.recruit {
        margin-bottom: 60px;
        background-color: #8fcbd1; }
        @media screen and (max-width: 768px) {
          section.btm .cntWrap .cntBox.recruit {
            margin-bottom: 32px; } }
        section.btm .cntWrap .cntBox.recruit .txt img:nth-of-type(1) {
          top: -68px;
          right: 50px; }
          @media screen and (max-width: 768px) {
            section.btm .cntWrap .cntBox.recruit .txt img:nth-of-type(1) {
              width: 40px;
              top: 10px;
              right: auto;
              left: 3.5%; } }
        section.btm .cntWrap .cntBox.recruit .txt img:nth-of-type(2) {
          top: 25px;
          right: 60px; }
          @media screen and (max-width: 768px) {
            section.btm .cntWrap .cntBox.recruit .txt img:nth-of-type(2) {
              width: 170px;
              top: 15px;
              right: 3.5%; } }
        section.btm .cntWrap .cntBox.recruit .txt p.more a {
          color: #fff; }
          section.btm .cntWrap .cntBox.recruit .txt p.more a::after {
            border-color: #fff; }
      section.btm .cntWrap .cntBox.contact {
        margin-bottom: 100px;
        background-color: #e9e4dc; }
        @media screen and (max-width: 768px) {
          section.btm .cntWrap .cntBox.contact {
            margin-bottom: 32px; } }
        section.btm .cntWrap .cntBox.contact .txt img {
          top: -15px;
          left: -20px; }
          @media screen and (max-width: 768px) {
            section.btm .cntWrap .cntBox.contact .txt img {
              width: 40px;
              top: 10px;
              left: 3.5%; } }
      section.btm .cntWrap .cntBox.airpay {
        justify-content: center;
        align-items: center;
        padding: 35px 5%;
        border: 2px solid #21aee5; }
        @media screen and (max-width: 768px) {
          section.btm .cntWrap .cntBox.airpay {
            padding: 25px 7%; } }
        section.btm .cntWrap .cntBox.airpay img, section.btm .cntWrap .cntBox.airpay p {
          margin: 0 33px; }
          @media screen and (max-width: 768px) {
            section.btm .cntWrap .cntBox.airpay img, section.btm .cntWrap .cntBox.airpay p {
              margin: 0; } }
        @media screen and (max-width: 768px) {
          section.btm .cntWrap .cntBox.airpay img {
            width: 180px; } }
        section.btm .cntWrap .cntBox.airpay p {
          font-size: 18px;
          font-weight: bold; }
          @media screen and (max-width: 768px) {
            section.btm .cntWrap .cntBox.airpay p {
              margin-top: 20px; } }

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