main article .top-image {
  width: 100%;
  height: 260px;
  background: url(../../images/top_img.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat; }
  main article .top-image h1 {
    font-size: 30px;
    line-height: 1.5;
    font-weight: bold;
    color: #fff;
    text-align: center;
    padding-top: 110px; }
main article .main-contents {
  padding: 30px 20px; }
  main article .main-contents h2 {
    font-size: 34px;
    font-weight: bold;
    margin-bottom: 30px; }
    main article .main-contents h2 span {
      color: #BFBFBF;
      font-size: 20px;
      display: block;
      margin-top: 20px; }
  main article .main-contents .about {
    margin-bottom: 100px; }
    main article .main-contents .about p {
      font-size: 16px;
      line-height: 1.6;
      margin-bottom: 20px; }
  main article .main-contents .services {
    margin-bottom: 100px; }
    main article .main-contents .services ul {
      margin-bottom: 100px; }
      main article .main-contents .services ul li {
        width: 100%;
        margin-bottom: 50px; }
        main article .main-contents .services ul li h3 {
          font-size: 24px;
          margin-bottom: 10px; }
        main article .main-contents .services ul li .box {
          width: 100%; }
          main article .main-contents .services ul li .box img {
            width: 100%;
            height: 200px;
            object-fit: cover; }
          main article .main-contents .services ul li .box .portforio-contents {
            width: 100%; }
            main article .main-contents .services ul li .box .portforio-contents p {
              width: 100%;
              font-size: 16px;
              line-height: 1.6;
              margin-bottom: 20px; }
            main article .main-contents .services ul li .box .portforio-contents .link-box {
              display: flex;
              justify-content: space-between; }
              main article .main-contents .services ul li .box .portforio-contents .link-box a {
                display: block;
                box-sizing: border-box;
                width: 30%;
                text-align: center;
                margin: 0 auto;
                padding: 15px 20px;
                font-weight: bold;
                color: #fff;
                border-radius: 25px; }
              main article .main-contents .services ul li .box .portforio-contents .link-box .twitter {
                background: #41a1f1; }
              main article .main-contents .services ul li .box .portforio-contents .link-box .instagram {
                background: url(../../images/instagram.jpeg);
                background-size: cover;
                background-position: center;
                background-repeat: no-repeat; }
              main article .main-contents .services ul li .box .portforio-contents .link-box .youtube {
                background: #fb0101; }
  main article .main-contents .company {
    margin-bottom: 100px; }
    main article .main-contents .company table {
      width: 100%; }
      main article .main-contents .company table tr td {
        border-bottom: 1px solid #000;
        padding: 20px; }
      main article .main-contents .company table tr .title {
        font-weight: bold;
        width: 30%; }
  main article .main-contents .contact {
    margin-bottom: 100px; }
    main article .main-contents .contact a {
      display: inline-block;
      width: 100%;
      box-sizing: border-box;
      text-align: center;
      padding: 20px;
      border: 2px solid #000;
      color: #000;
      font-weight: bold; }

@media screen and (min-width: 576px) {
  main article .top-image {
    width: 100%;
    height: 700px;
    background: url(../../images/top_img.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat; }
    main article .top-image h1 {
      font-size: 70px;
      font-weight: bold;
      color: #fff;
      text-align: center;
      padding-top: 250px; }
  main article .main-contents {
    width: 900px;
    margin: 80px auto; }
    main article .main-contents h2 {
      font-size: 50px;
      font-weight: bold;
      margin-bottom: 30px; }
      main article .main-contents h2 span {
        color: #BFBFBF;
        font-size: 20px;
        display: block;
        margin-top: 20px; }
    main article .main-contents .about {
      margin-bottom: 100px; }
      main article .main-contents .about p {
        font-size: 16px;
        line-height: 1.6;
        margin-bottom: 30px; }
    main article .main-contents .services {
      margin-bottom: 100px; }
      main article .main-contents .services ul {
        display: flex;
        flex-wrap: wrap; }
        main article .main-contents .services ul li {
          width: 48%;
          margin-right: 2%;
          margin-bottom: 40px; }
          main article .main-contents .services ul li h3 {
            font-size: 26px;
            margin-bottom: 15px; }
          main article .main-contents .services ul li .services-img {
            height: 250px;
            margin-bottom: 15px; }
            main article .main-contents .services ul li .services-img img {
              width: 100%;
              height: 100%;
              object-fit: cover; }
          main article .main-contents .services ul li p {
            font-size: 16px;
            line-height: 1.6; }
      main article .main-contents .services p {
        font-size: 16px;
        line-height: 1.6; }
    main article .main-contents .services {
      margin-bottom: 100px; }
      main article .main-contents .services ul li {
        width: 100%;
        margin-bottom: 50px; }
        main article .main-contents .services ul li h3 {
          font-size: 26px;
          margin-bottom: 20px; }
        main article .main-contents .services ul li .box {
          width: 100%;
          height: 100%;
          display: flex;
          justify-content: space-between;
          align-items: top; }
          main article .main-contents .services ul li .box img {
            width: 400px;
            height: 80%;
            object-fit: cover; }
          main article .main-contents .services ul li .box .portforio-contents {
            width: calc(100% - 420px); }
            main article .main-contents .services ul li .box .portforio-contents p {
              width: 100%;
              font-size: 16px;
              line-height: 1.6;
              margin-bottom: 20px; }
            main article .main-contents .services ul li .box .portforio-contents .link-box {
              display: flex;
              justify-content: space-between; }
              main article .main-contents .services ul li .box .portforio-contents .link-box a {
                display: block;
                box-sizing: border-box;
                width: 30%;
                text-align: center;
                margin: 0 auto;
                padding: 15px 20px;
                font-weight: bold;
                color: #fff;
                border-radius: 25px; }
              main article .main-contents .services ul li .box .portforio-contents .link-box .twitter {
                background: #41a1f1; }
              main article .main-contents .services ul li .box .portforio-contents .link-box .instagram {
                background: url(../../images/instagram.jpeg);
                background-size: cover;
                background-position: center;
                background-repeat: no-repeat; }
              main article .main-contents .services ul li .box .portforio-contents .link-box .youtube {
                background: #fb0101; }
    main article .main-contents .company {
      margin-bottom: 100px; }
      main article .main-contents .company table {
        width: 100%; }
        main article .main-contents .company table tr td {
          border-bottom: 1px solid #000;
          padding: 20px; }
        main article .main-contents .company table tr .title {
          font-weight: bold; }
    main article .main-contents .contact {
      margin-bottom: 100px; }
      main article .main-contents .contact a {
        display: inline-block;
        width: 300px;
        text-align: center;
        padding: 20px;
        border: 2px solid #000;
        color: #000;
        font-weight: bold; } }

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