@charset "UTF-8";
/*--- import -------------------------------------*/
/*------------------------------------- import ---*/
.box_in {
  max-width: 960px; }

.mv {
  background: url(../images/business/mv_bg.jpg);
  background-size: cover; }

@media screen and (max-width: 750px) {
  .mv {
    background: url(../images/business/mv_bg.jpg);
    background-size: contain; } }
#company .box_in {
  position: relative; }
  #company .box_in h3 {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    color: #fff;
    font-size: 32px;
    text-align: center;
    z-index: 1;
    letter-spacing: 0.25rem;
    width: 100%;
    text-shadow: 1px 1px 10px #000; }
    @media screen and (max-width: 960px) {
      #company .box_in h3 {
        top: 35%; } }
  #company .box_in ul {
    margin-top: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap; }
    #company .box_in ul li {
      position: relative;
      width: 20%; }
      @media screen and (max-width: 960px) {
        #company .box_in ul li {
          width: 25%; } }
      #company .box_in ul li img {
        width: 100%; }
      #company .box_in ul li:nth-child(even) {
        top: 20px; }
      #company .box_in ul li:nth-child(odd) {
        top: -20px; }
  #company .box_in .txt_area {
    margin-top: 60px; }
    #company .box_in .txt_area h4 .h_txt {
      text-align: left;
      font-size: 29px;
      text-indent: -1.3em;
      padding-left: 1.3em; }
      #company .box_in .txt_area h4 .h_txt:before {
        content: '■';
        color: #e6000f; }
      #company .box_in .txt_area h4 .h_txt:nth-child(2) {
        margin-top: 10px; }
    #company .box_in .txt_area .txt {
      margin-top: 40px;
      text-align: left; }

@media screen and (max-width: 750px) {
  #company .box_in h3 {
    font-size: 28px; }
  #company .box_in ul {
    margin-top: 60px; }
    #company .box_in ul li {
      position: relative; }
      #company .box_in ul li img {
        width: 100%; }
      #company .box_in ul li:nth-child(even) {
        top: 20px; }
      #company .box_in ul li:nth-child(odd) {
        top: -20px; }
  #company .box_in .txt_area {
    margin-top: 70px; }
    #company .box_in .txt_area h4 .h_txt {
      text-align: left;
      font-size: 21px;
      text-indent: -1.3em;
      padding-left: 1.3em; }
    #company .box_in .txt_area .txt {
      margin-top: 20px; } }
.images_area {
  margin: 0 auto;
  margin-top: 180px;
  max-width: 1200px;
  width: 100%; }
  @media screen and (max-width: 960px) {
    .images_area {
      margin-top: 18.75vw; } }
  .images_area .box {
    padding: 40px 30px;
    width: 45%; }
  .images_area .top_area {
    position: relative;
    display: flex;
    justify-content: space-around; }
    .images_area .top_area .box {
      background: rgba(139, 195, 234, 0.6);
      border-radius: 15px; }
      .images_area .top_area .box img {
        max-width: 336px;
        width: 100%; }
    .images_area .top_area .arrow1 {
      display: block;
      position: absolute;
      top: -140px;
      left: 50%;
      transform: translateX(-50%); }
      @media screen and (max-width: 960px) {
        .images_area .top_area .arrow1 {
          top: -14.5833333333vw;
          width: 37.7083333333vw; } }
    .images_area .top_area .arrow1_sp {
      display: none; }
  .images_area .arrow2_sp {
    display: none; }
  .images_area .bottom_area {
    padding: 40px 30px;
    position: relative;
    margin: 240px 20px 0 20px;
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    background: rgba(139, 195, 234, 0.6);
    border-radius: 15px; }
    @media screen and (max-width: 960px) {
      .images_area .bottom_area {
        margin: 25vw 20px 0 20px; } }
    .images_area .bottom_area .arrow2 {
      display: block;
      position: absolute;
      top: -337px;
      left: 54%;
      transform: translateX(-50%); }
      @media screen and (max-width: 960px) {
        .images_area .bottom_area .arrow2 {
          top: -35.1041666667vw;
          width: 31.0416666667vw; } }
    .images_area .bottom_area .box {
      padding: 0; }
    .images_area .bottom_area .bottom {
      margin-top: 40px; }

@media screen and (max-width: 750px) {
  .images_area {
    margin-top: 5.3333333333vw; }
    .images_area .box {
      padding: 4vw; }
    .images_area .top_area {
      display: block; }
      .images_area .top_area .box {
        max-width: 550px;
        width: 100%;
        margin: 0 auto; } }
      @media screen and (max-width: 750px) and (max-width: 480px) {
        .images_area .top_area .box {
          width: 80%;
          margin: 0 auto; } }
@media screen and (max-width: 750px) {
      .images_area .top_area .arrow1 {
        display: none; }
      .images_area .top_area .arrow1_sp {
        display: flex;
        justify-content: center;
        align-items: flex-start; }
        .images_area .top_area .arrow1_sp img {
          position: relative;
          left: 25px;
          width: 47.666667vw; }
    .images_area .arrow2_sp {
      display: flex;
      justify-content: center;
      align-items: flex-start; }
      .images_area .arrow2_sp img {
        position: relative;
        left: 25px;
        width: 47.666667vw; }
    .images_area .bottom_area {
      padding: 4vw;
      position: relative;
      margin: 0px 20px 0 20px;
      display: block; }
      .images_area .bottom_area .arrow2 {
        display: none; }
      .images_area .bottom_area .box {
        margin: 0 auto;
        max-width: 550px;
        width: 100%;
        padding: 0; }
      .images_area .bottom_area .right {
        margin-top: 40px !important; }
      .images_area .bottom_area .bottom {
        margin-top: 40px; } }
#business {
  padding-bottom: 0; }
  #business .business_area {
    margin-top: 40px; }
    #business .business_area .common_area {
      padding: 100px 0; }
      #business .business_area .common_area a {
        display: inline-block; }
        #business .business_area .common_area a .box_in {
          display: flex;
          align-items: center;
          justify-content: center; }
          #business .business_area .common_area a .box_in .txt_area {
            position: relative;
            width: 50%;
            text-align: left; }
            #business .business_area .common_area a .box_in .txt_area h3 {
              font-size: 29px;
              line-height: 1.6;
              font-weight: normal;
              letter-spacing: 0.3rem;
              position: relative;
              display: inline-block; }
              #business .business_area .common_area a .box_in .txt_area h3:before {
                transition: 0.5s;
                content: '';
                display: inline-block;
                background: #4d4d4d;
                width: 305px;
                height: 1px;
                position: absolute;
                right: -350px;
                top: 26px; }
            #business .business_area .common_area a .box_in .txt_area .txt {
              margin-top: 30px;
              font-size: 16px;
              font-weight: normal;
              line-height: 2.2;
              letter-spacing: 0.2rem; }
          #business .business_area .common_area a .box_in .images {
            width: 50%;
            display: flex;
            position: relative; }
            #business .business_area .common_area a .box_in .images h3 {
              position: absolute;
              top: 50%;
              left: 50%;
              transform: translateX(-50%) translateY(-50%);
              z-index: 3; }
            #business .business_area .common_area a .box_in .images .left {
              transform: rotate(45deg);
              overflow: hidden;
              position: relative;
              left: 20px;
              z-index: 2; }
            #business .business_area .common_area a .box_in .images .right {
              transform: rotate(45deg);
              overflow: hidden;
              position: relative;
              right: 20px;
              z-index: 1; }
        #business .business_area .common_area a:hover .txt_area h3:before {
          transition: 0.5s;
          right: -370px; }
      #business .business_area .common_area:nth-child(odd) {
        background: #f2f2f2; }
      #business .business_area .common_area:nth-child(even) a .box_in {
        flex-flow: row-reverse; }
        #business .business_area .common_area:nth-child(even) a .box_in .txt_area {
          left: 200px; }
          #business .business_area .common_area:nth-child(even) a .box_in .txt_area h3 {
            width: 360px; }
            #business .business_area .common_area:nth-child(even) a .box_in .txt_area h3:before {
              right: 400px; }
      #business .business_area .common_area:nth-child(even) a:hover .txt_area h3:before {
        right: 420px; }
    #business .business_area .more_area {
      display: none; }

.img_wrap {
  margin: 0 auto;
  overflow: hidden;
  cursor: pointer; }

.img_wrap img {
  width: 100%;
  transition-duration: 0.5s; }

.common_area a:hover .img_wrap img {
  transform: scale(1.2);
  transition-duration: 0.5s; }

@media screen and (max-width: 1180px) {
  #business .business_area .common_area a {
    pointer-events: none; }
    #business .business_area .common_area a .box_in {
      display: block; }
      #business .business_area .common_area a .box_in .txt_area {
        width: 100%;
        text-align: center;
        left: 0px;
        position: relative; }
        #business .business_area .common_area a .box_in .txt_area h3:before {
          content: none; }
        #business .business_area .common_area a .box_in .txt_area .txt {
          margin-top: 30px;
          font-size: 16px;
          font-weight: normal;
          line-height: 2.2;
          letter-spacing: 0.2rem; }
      #business .business_area .common_area a .box_in .images {
        width: 100%;
        display: flex;
        position: relative;
        margin-top: 100px; }
        #business .business_area .common_area a .box_in .images h3 {
          max-width: 450px;
          width: 100%;
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translateX(-50%) translateY(-50%);
          z-index: 3; }
        #business .business_area .common_area a .box_in .images .left {
          max-width: 270px; }
        #business .business_area .common_area a .box_in .images .right {
          max-width: 270px; }
  #business .business_area .common_area:nth-child(odd) {
    background: #f2f2f2; }
  #business .business_area .common_area:nth-child(even) a .box_in .txt_area {
    left: 0px; }
    #business .business_area .common_area:nth-child(even) a .box_in .txt_area h3 {
      max-width: 360px;
      width: 100%; }
  #business .business_area .more_area {
    display: block;
    margin-top: 90px; }
    #business .business_area .more_area a {
      pointer-events: all; } }
@media screen and (max-width: 750px) {
  #business .business_area {
    margin-top: 40px; }
    #business .business_area .common_area {
      padding: 60px 0; }
      #business .business_area .common_area a .box_in .txt_area h3 {
        font-size: 29px;
        line-height: 1.6;
        letter-spacing: 0.3rem; }
      #business .business_area .common_area a .box_in .txt_area .txt {
        margin-top: 30px;
        font-size: 16px;
        line-height: 1.8;
        letter-spacing: 0.2rem; }
      #business .business_area .common_area a .box_in .images {
        margin-top: 60px; }
        #business .business_area .common_area a .box_in .images h3 {
          width: 100%; }
    #business .business_area .more_area {
      margin-top: 70px; } }
