@charset "UTF-8";
html {
    scroll-behavior: smooth;
}
@media screen and (min-width: 769px) {
  .pc {
    display: inline-block;
  }

  .pc2 {
    display: block;
  }

  .sp,
  .sp2 {
    display: none;
  }

  body {
    color: #383737;
    /* padding-top: 90px; */
    background: #fff;
  }

  h2 {
    font-size: 40px;
    margin: 0 auto 45px;
  }

  h3 {
    font-size: 30px;
    line-height: 1.5;
    margin: 0 auto 50px;
  }

  h4 {
    font-size: 25px;
    line-height: 1.5;
    margin: 0 auto 35px;
  }

  p {
    font-size: 16px;
    line-height: normal;
  }

  p.fs-20 {
    font-size: 20px;
  }

  p.fs-35 {
    font-size: 35px;
  }

  .t-center {
    text-align: center;
  }

  .mb1 {
    margin-bottom: 1em;
  }

  .mb60 {
    margin-bottom: 60px;
  }

  /*見出し*/
  h2,
  h3 {
    text-align: center;
  }

  .emp::before {
    content: "＼";
    font-size: 80%;
    display: inline-block;
    margin-right: 5px;
    font-weight: bold;
  }

  .emp::after {
    content: "／";
    font-size: 80%;
    display: inline-block;
    margin-left: 5px;
    font-weight: bold;
  }

  /* 背景 */
  .bg_black {
    background: #000;
    color: #fff;
  }

  .bg_olive {
    background: #948049;
  }

  .bg_darkolive {
    background: #5b4e28;
  }

  .bg_orange {
    background: #eb5c2b;
  }

  .bg_beige {
    position: relative;
    width: 100%;
    background-color: #feebbe;
    background-image: linear-gradient(#feebbe 80%, #fff 80%);
    z-index: 0;
  }

  .bg_beige::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    width: 100%;
    top: 80%;
    border-bottom: 200px solid transparent;
    border-left: 100vw solid transparent;
    border-top: 200px solid #feebbe;
    border-right: 100vw solid #feebbe;
    z-index: -1;
  }

  .bg_beige2 {
    position: relative;
    width: 100%;
    background-color: #feebbe;
    z-index: 0;
  }

  .bg_beige2::before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    width: 100%;
    top: -400px;
    border-top: 200px solid transparent;
    border-left: 100vw solid transparent;
    border-bottom: 200px solid #feebbe;
    border-right: 100vw solid #feebbe;
    z-index: -1;
  }

  .bg_beige2::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    width: 100%;
    bottom: -400px;
    border-bottom: 200px solid transparent;
    border-left: 100vw solid transparent;
    border-top: 200px solid #feebbe;
    border-right: 100vw solid #feebbe;
    z-index: -1;
  }

  .bg_gray-dot,
  .bg_gray-dot2 {
    /*水玉*/
    background-color: #ffffff;
    background-image: radial-gradient(rgba(225, 225, 225, 0.8) 8%, transparent 10%);
    background-position: 25px 28px;
    background-size: 50px 50px;
    z-index: 0;
    position: relative;
  }

  .bg_gray-dot2::before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    width: 100%;
    top: 0;
    border-bottom: 200px solid transparent;
    border-left: 100vw solid transparent;
    border-top: 200px solid #fff;
    border-right: 100vw solid #fff;
    z-index: -1;
  }

  .bg_nayami {
    position: relative;
    left: 0;
    width: 100%;
    bottom: 0;
    min-height: 835px;
    z-index: -1;
    background: url("https://add.gig.co.jp/wp2/wp-content/themes/gig_works/assets/it-support/images/bg_01.png") center bottom 1.2vw no-repeat;
    background-size: auto 835px;
  }

  .bg_nayami::before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    width: 100%;
    bottom: 0;
    border-top: 200px solid transparent;
    border-left: 100vw solid transparent;
    border-bottom: 200px solid #feebbe;
    border-right: 100vw solid #feebbe;
    z-index: -1;
  }

  .bg_orange-dot {
    /*水玉*/
    background-color: #ffffff;
    position: relative;
    z-index: 0;
    background-image: radial-gradient(#f6b36b 8%, transparent 10%);
    background-position: 0 0;
    background-size: 50px 50px;
  }

  .bg_orange-dot::before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 15%;
    border-bottom: 200px solid transparent;
    border-right: 100vw solid transparent;
    border-top: 200px solid #ffff;
    border-left: 100vw solid #fff;
    z-index: -1;
  }

  .bg_orange-dot::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    width: 100%;
    bottom: 0;
    background-image: radial-gradient(#f6b36b 8%, transparent 10%);
    background-position: 0 0;
    background-size: 50px 50px;
  }

  .bg_check {
    background-color: #fffbf3;
    background-image: -webkit-linear-gradient(45deg, #fff5e0 25%, #fff5e0 25%, transparent 25%, transparent 75%, #fff5e0 75%, #fff5e0 75%), -webkit-linear-gradient(-135deg, #fff5e0 25%, #fff5e0 25%, transparent 25%, transparent 75%, #fff5e0 75%, #fff5e0 75%);
    background-image: linear-gradient(45deg, #fff5e0 25%, #fff5e0 25%, transparent 25%, transparent 75%, #fff5e0 75%, #fff5e0 75%), linear-gradient(-135deg, #fff5e0 25%, #fff5e0 25%, transparent 25%, transparent 75%, #fff5e0 75%, #fff5e0 75%);
    background-size: 10px 10px;
    -webkit-background-size: 10px 10px;
    background-position: 0 0, 5px 5px;
  }

  @media screen and (max-width:1299px) {
    .bg_nayami {
      position: relative;
      left: 0;
      width: 100%;
      bottom: 0;
      min-height: 835px;
      z-index: -1;
      background: url("https://add.gig.co.jp/wp2/wp-content/themes/gig_works/assets/it-support/images/bg_01-2.png") center bottom 170px no-repeat;
      background-size: auto 550px;
    }
  }

  .contact {
    min-width: 200px;
    text-align: center;
    margin-left: auto;
    margin-right: 25px;
    background: #000;
    font-weight: bold;
    border-radius: 25px;
  }

  .contact a {
    color: #fff;
    display: inline-block;
    font-size: 15px;
    line-height: 22px;
    margin: 0;
    padding: 15px 20px;
    transition: 0.1s linear;
    vertical-align: middle;
    text-decoration: none;
  }

  .contact a:hover {
    opacity: 0.7;
    transition: 0.1s linear;
  }

  @media screen and (max-width: 1299px) {
    .mail_to {
      width: 120px;
    }

    .mail_to a {
      display: inline-block;
      font-size: 15px;
      line-height: 22px;
      margin: 0;
      padding: 1em;
    }
  }

  #main {
    padding-top: 90px;
  }

  #kv {
    color: #000;
    width: 100%;
    height: 720px;
    margin: 0 auto;
    overflow: hidden;
    position: relative;
    background-color: transparent;
    background-image: url("https://add.gig.co.jp/wp2/wp-content/themes/gig_works/assets/it-support/images/Top-Kv.png");
    background-position: center top;
    background-repeat: no-repeat;
    background-size: auto 100%;
    padding-bottom: 37.5%;
    z-index: 0;
  }

  #kv::before {
    position: absolute;
    content: "";
    display: block;
    left: 0;
    width: 100%;
    top: -195px;
    height: 0;
    border-bottom: 195px solid transparent;
    border-right: 1720px solid transparent;
    border-top: 195px solid rgba(0, 0, 0, 0.7);
    border-left: 1720px solid rgba(0, 0, 0, 0.7);
  }

  #kv .kv_in {
    max-width: 1300px;
    height: 720px;
    text-align: left;
    margin: 0 auto;
    padding: 25px 0 0 150px;
    position: relative;
  }

  #kv h1 {
    margin: 10px 15px 50px 0;
  }

  #kv .kv-text {
    color: #ec6539;
    background: #fff;
    width: 540px;
    border-radius: 50px;
    padding: 30px 40px 30px;
  }

  #kv .kv-text .price {
    font-size: 55px;
    margin-bottom: 20px;
    line-height: 1;
  }

  #kv .kv-text .price span {
    vertical-align: baseline;
  }

  #kv .kv-text .price span.l {
    font-size: 120px;
  }

  #kv .kv-text .price span.s {
    font-size: 65px;
  }

  #kv .kv-text .info {
    font-weight: bold;
    font-size: 33px;
    line-height: 1.2;
    letter-spacing: 2px;
  }

  #kv .kv-text .info span {
    font-size: 42px;
  }

  #kv .kv-text .attention {
    font-size: 14px;
  }

  @media screen and (max-width:1300px) {
    #kv {
      height: 688px;
      background-image: url("https://add.gig.co.jp/wp2/wp-content/themes/gig_works/assets/it-support/images/Top-Kv2.png");
      padding-bottom: 52.92%;
    }

    #kv .kv_in {
      padding: 25px 0 0 4%;
    }
  }

  /*　コンテンツ　レイアウト*/
  #main {
    width: 100%;
    margin: 0 auto;
    padding: 0;
    padding-top: 90px;
    overflow: hidden;
  }

  #main .box {
    min-width: 1300px;
  }

  .box.box2 {
    min-height: 1190px;
    margin-bottom: 150px;
  }

  .box_in {
    max-width: 1300px;
    padding: 0 25px;
    margin: 0 auto;
  }

  .box_in_s {
    max-width: 1000px;
    margin: 0 auto;
  }

  .col2-box {
    display: flex;
    justify-content: space-between;
  }

  .w-box {
    background: #fff;
    max-width: 1100px;
    padding: 0 75px 45px;
    border-radius: 50px;
    box-shadow: 16px 16px 50px 0 rgba(0, 0, 0, 0.25);
    margin: 100px auto 50px;
  }

  @media screen and (max-width: 1299px) {
    #main .box {
      min-width: 100%;
    }

    .box_in_s {
      padding: 0 25px;
    }

    .w-box {
      background: #fff;
      width: 100%;
      padding: 35px 25px;
    }
  }

  /*　吹き出し　*/
  .fukidashi {
    font-size: 35px;
    font-weight: bold;
    line-height: 1.5;
    width: 425px;
    background: #eb5a2b;
    color: #fff;
    padding: 25px 25px 25px 40px;
    ;
    border-radius: 45px;
    position: relative;
    z-index: 0;
    margin: 40px auto 50px 0;
  }

  .fukidashi::after {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    bottom: -10px;
    left: 50px;
    border-style: solid;
    border-color: #eb5a2b transparent transparent transparent;
    border-width: 25px 40px 0 40px;
    transform: rotate(80deg);
    z-index: -1;
  }

  .fukidashi2 {
    font-size: 40px;
    text-align: center;
    line-height: 1;
    max-width: 950px;
    background: #eb5a2b;
    color: #fff;
    padding: 10px 20px 20px;
    border-radius: 25px;
    position: relative;
    top: -40px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 0;
    margin: -40px auto 30px 0;
  }

  .fukidashi2 span {
    font-size: 60px;
  }

  .fukidashi2::after {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    bottom: -20px;
    left: 50%;
    transform: translateX(-50%);
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-top: 20px solid #eb5a2b;
    z-index: -1;
  }

  .fukidashi3 {
    font-size: 33px;
    font-weight: bold;
    line-height: 1.5;
    width: 600px;
    background: #eb5a2b;
    color: #fff;
    padding: 25px 25px 25px 40px;
    border-radius: 30px;
    position: absolute;
    z-index: 0;
    margin: -160px 50px 30px 280px;
  }

  .fukidashi3::after {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    bottom: -10px;
    right: 100px;
    border-style: solid;
    border-color: #eb5a2b transparent transparent transparent;
    border-width: 30px 40px 0 40px;
    transform: rotate(80deg);
    z-index: -1;
  }

  @media screen and (max-width:1299px) {
    .fukidashi3 {
      margin: -180px auto 30px auto;
      left: 50%;
      transform: translateX(-50%);
    }
  }

  /*サービス*/
  .box1 .nayami {
    max-width: 850px;
    padding: 0 100px 0 120px;
    margin-left: auto;
  }

  .nayami ul {
    margin-bottom: 25px;
  }

  .nayami ul li {
    font-size: 26px;
    font-weight: bold;
    list-style: none;
    line-height: 1.4;
    background: url("https://add.gig.co.jp/wp2/wp-content/themes/gig_works/assets/it-support/images/icon_check.png") left center no-repeat;
    padding-left: 50px;
    background-size: 31px 25px;
    margin-bottom: 20px;
  }

  .box1 .nayami p {
    text-align: left;
    margin-top: 10px;
    line-height: normal;
    padding-left: 30px;
  }

  .box1 .nayami p.com1 {
    font-size: 34.5px;
  }

  .box1 .nayami p.com2 {
    font-size: 51.75px;
  }

  @media screen and (max-width:1299px) {
    .box1 {
      padding-bottom: 50px;
    }

    .box1 .nayami {
      max-width: 850px;
      padding: 0;
      margin: 0 auto;
    }

    .nayami ul {
      margin-bottom: 550px;
    }

    .box1 .nayami p.com2 {
      font-size: 51.75px;
    }
  }

  .box2 .col2-box {
    margin-top: 40px;
    flex-wrap: wrap;
  }

  .box2 .col2-box .inbox {
    width: 450px;
    max-width: 48%;
    text-align: center;
    position: relative;
    z-index: 0;
    margin-bottom: 40px;
  }

  .box2 .col2-box .inbox p.title {
    font-size: 28px;
    font-weight: bold;
    max-width: 350px;
    text-align: center;
    color: #fff;
    padding: 0 1em;
    margin: -22.5px auto 20px;
    border-radius: 22.5px;
    background-image: linear-gradient(90deg, #ea5504 0%, #f39800 100%);
    z-index: 1;
    position: relative;
  }

  .box2 .col2-box .inbox img {
    width: 385px;
    max-width: 95%;
    z-index: -1;
  }

  .box2 .col2-box .inbox p.text {
    padding: 0 1em;
    text-align: left;
  }

  .box3 {
    min-height: 600px;
    padding-bottom: 300px;
    margin-bottom: -200px;
  }

  .box4 {
    margin-bottom: 150px;
    position: relative;
  }

  table.tab01 {
    max-width: 1000px;
    margin: 0 auto;
    display: block;
  }

  table.tab01.sp2 {
    display: none;
  }

  table.tab01 th {
    background: #403733;
    color: #fff;
    text-align: center;
    vertical-align: middle;
    border-right: 1px dotted #a8a6a4;
  }

  table.tab01 th.ser {
    width: 25%;
  }

  table.tab01 th.type {
    width: 42%;
  }

  table.tab01 th.cont {
    width: 33%;
  }

  table.tab01 td {
    font-size: 15px;
    padding: 0.5em 1em;
    vertical-align: middle;
    background: #fbdccd;
    border-right: 1px dotted #a8a6a4;
  }

  table.tab01 tr:nth-child(odd) td {
    background: #fff6e6;
  }

  table.tab01 td.title {
    font-size: 19px;
  }

  table.tab01 td.br-none,
  table.tab01 th.br-none {
    border-right: none;
  }

  /* お問い合わせ　*/
  .contact-box {
    position: relative;
    min-height: 545px;
    background: url("https://add.gig.co.jp/wp2/wp-content/themes/gig_works/assets/it-support/images/bg_contact-box.png") center top no-repeat;
    background-size: cover;
    padding-bottom: 28.385%;
  }

  .box10.contact-box {
    position: relative;
    min-height: 545px;
    background: url("https://add.gig.co.jp/wp2/wp-content/themes/gig_works/assets/it-support/images/bg_contact-box2.png") center top no-repeat;
    background-size: cover;
    padding-bottom: 28.385%;
  }

  .contact-box .contact-box_in {
    position: absolute;
    min-width: 1000px;
    content: "";
    display: block;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

  .arrow {
    width: 250px;
    font-size: 20px;
    line-height: 50px;
    background: #fff;
    font-weight: bold;
    padding: 0 0 0 25px;
    margin: 25px 50px 25px 0;
    position: relative;
  }

  .arrow::after {
    position: absolute;
    content: "";
    display: block;
    top: 0;
    right: -50px;
    border-left: 25px solid #fff;
    border-right: 25px solid transparent;
    border-bottom: 25px solid transparent;
    border-top: 25px solid transparent;
  }

  .tel-con,
  .mail_con {
    display: flex;
    align-items: center;
  }

  .tel-con .tel-box .tel {
    font-weight: bold;
    font-size: 50px;
  }

  .tel-con .tel-box .tel span {
    font-size: 30px;
  }

  .tel-con .tel-box .text {
    padding-left: 30px;
    font-weight: bold;
    font-size: 20px;
    line-height: 1.2;
  }

  .tel-con .tel-box .text span {
    font-size: 16px;
  }

  .mail_con .btn_contact {
    font-size: 20px;
    color: #fff;
    width: 350px;
    height: 75px;
    line-height: 75px;
    background: url("https://add.gig.co.jp/wp2/wp-content/themes/gig_works/assets/it-support/images/icon_mail.png") left 25px center no-repeat #000;
    background-size: 30px 24px;
    text-align: center;
    position: relative;
    z-index: 0;
    border-radius: 37.5px;
  }

  .mail_con .btn_contact a {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    color: #fff;
    font-weight: bold;
    text-decoration: none;
    z-index: 2;
  }

  .mail_con .btn_contact::after {
    content: "\02228";
    display: inline-block;
    font-size: 25px;
    font-weight: normal;
    color: #fff;
    position: absolute;
    right: 25px;
    top: 0;
    z-index: 1;
  }

  @media screen and (max-width:1299px) {
    .contact-box .contact-box_in {
      position: absolute;
      min-width: 100%;
      content: "";
      display: block;
      padding: 0;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
    }
  }

  /* 導入メリット　*/
  .box5 {
    padding: 300px 0;
    margin-top: -400px;
    z-index: -1;
  }

  .merit-wrap {
    max-width: 1100px;
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    margin: 0 auto;
  }

  .merit-wrap .inbox {
    width: 340px;
    border-radius: 25px;
    overflow: hidden;
    margin-bottom: 25px;
  }

  .merit-wrap .inbox .pic img {
    vertical-align: bottom;
  }

  .merit-wrap .inbox .text {
    font-size: 18px;
    background: #feebbe;
    text-align: justify;
    font-weight: bold;
    padding: 25px 15px;
    min-height: 135px;
  }

  .merit-wrap .inbox .text span {
    font-size: 25px;
    color: #e00000;
  }

  /* 導入事例　*/
  h3.case-title {
    color: #403733;
    text-align: left;
    margin-bottom: 0;
  }

  h3.case-title span.case-num {
    margin-right: 20px;
    font-family: Arial, Helvetica, "sans-serif";
    font-style: italic;
    font-size: 50px;
    font-weight: bold;
    border-bottom: 2px solid #403733;
  }

  .box6 {
    padding-bottom: 85px;
  }

  .box6 dl {
    margin-left: 80px;
    margin-bottom: 15px;
    min-height: 35px;
    display: flex;
  }

  .box6 dl dt {
    font-size: 17px;
    color: #fff;
    width: 140px;
    border-radius: 15px 0 0 15px;
    background: #eb5c2b;
    padding: 5px 0 0 10px;
    min-height: 35px;
    position: relative;
  }

  .box6 dl dt p {
    font-size: 17px;
    line-height: 35px;
    position: absolute;
    content: "";
    top: 50%;
    transform: translateY(-50%);
  }

  .box6 dl dd {
    font-size: 18px;
    width: 680px;
    min-height: 35px;
    border-radius: 0 15px 15px 0;
    background: #fff;
    padding: 0 10px;
    position: relative;
  }

  .box6 dl dd p {
    line-height: 35px;
    font-size: 18px;
    padding: 5px 10px;
    position: absolute;
    content: "";
    top: 50%;
    transform: translateY(-50%);
  }

  .image-box {
    background: url("https://add.gig.co.jp/wp2/wp-content/themes/gig_works/assets/it-support/images/bg_02.png") center center no-repeat, linear-gradient(#feebbe 50%, #fff 50%);
    background-size: auto 100%;
    padding-bottom: 43.698%;
    height: 839px;
  }

  @media screen and (max-width:1299px) {
    .box6 dl {
      min-height: 70px;
      margin-left: 0;
    }

    .box6 dl dt {
      width: 20%;
      height: 70px;
      border-radius: 15px 0 0 15px;
      line-height: 70px;
    }

    .box6 dl dd {
      width: 80%;
      height: 70px;
      line-height: 30px;
      padding: 5px 10px;
    }
  }

  /* 料金プラン　*/
  .price1 {
    max-width: 760px;
    margin: 0 auto;
  }

  .price1 table th {
    font-size: 20px;
    font-weight: bold;
    height: 50px;
    vertical-align: middle;
    text-align: center;
    color: #fff;
  }

  .price1 table th.th01 {
    width: 42%;
  }

  .price1 table th.th02,
  .price1 table th.th03 {
    width: 15%;
  }

  .price1 table th.th04 {
    width: 31%;
  }

  .price1 table td {
    font-size: 20px;
    font-weight: bold;
    background: #fdeadf;
    height: 50px;
    vertical-align: middle;
    padding: 0 20px;
  }

  .border-b {
    border-bottom: 2px dotted #a4a4a3;
  }

  .border-r {
    border-right: 2px dotted #a4a4a3;
  }

  .notes {
    margin-bottom: 150px;
  }

  .notes p {
    font-size: 15px;
    line-height: 1.25;
  }

  .sub-title {
    font-size: 20px;
    font-weight: bold;
  }

  .price2 table th {
    background: #eb5c2b;
    font-size: 20px;
    font-weight: bold;
    height: 35px;
    vertical-align: middle;
    text-align: center;
    color: #fff;
  }

  .price2 table th.th01 {
    width: 25%;
    border-right: 2px dotted #685a36;
  }

  .price2 table th.th02 {
    width: 49%;
    border-right: 2px dotted #685a36;

  }

  .price2 table th.th03 {
    width: 13%;
    border-right: 2px dotted #685a36;

  }

  .price2 table th.th04 {
    width: 13%;
  }

  .price2 table td.td01 {
    border-right: 2px dotted #685a36;
  }

  .price2 table td.td02 {
    border-right: 2px dotted #685a36;
  }

  .price2 table td.td03 {
    text-align: center;
    border-right: 2px dotted #685a36;
  }

  .price2 table td.td04 {
    text-align: center;
  }

  .price2 table td {
    font-size: 15px;
    min-height: 70px;
    vertical-align: middle;
    padding: 10px 25px;
    line-height: 1.2;
    background: #fdeadf;
  }

  .price2 table td.title {
    font-size: 19px;
    font-weight: bold;
  }

  .price2 table tr:nth-child(odd) td {
    background: #fff6e6;
  }

  .price2 .notes {
    margin-bottom: 20px;
  }

  /*　サービス開始までの流れ　*/
  .box9 {
    padding: 200px 0 250px;
    margin-bottom: -200px;
  }

  .flow {
    max-width: 850px;
    margin: 0 auto;
  }

  .flow .inbox {
    display: flex;
    justify-content: space-between;
    margin: 0 auto 50px;
    background: #feebbe;
    padding: 50px 35px;
    border-radius: 40px;
    position: relative;
  }

  .flow .inbox .lbox,
  .flow .inbox .rbox {
    width: 200px;
  }

  .flow .inbox .cbox {
    text-align: center;
  }

  .flow .inbox::after {
    position: absolute;
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-left: 25px solid transparent;
    border-right: 25px solid transparent;
    border-top: 30px solid #feebbe;
    left: 50%;
    bottom: -30px;
    transform: translateX(-50%);
  }

  .flow .inbox h3 {
    display: flex;
    margin-bottom: 0;
  }

  .flow .inbox .w-box_s {
    width: 200px;
    height: 145px;
    background: #fff;
    text-align: center;
    border-radius: 15px;
    padding: 15px;
    position: relative;
  }

  .flow .inbox .lbox .w-box_s p.c-title {
    width: 75px;
    font-size: 20px;
    font-weight: bold;
    color: #fff;
    background: #f6ac19;
    border-radius: 15px;
    position: relative;
    content: "";
    display: block;
    left: 50%;
    transform: translateX(-50%);
    top: -35px;
  }

  .flow .inbox .lbox .w-box_s p.text {
    font-size: 17px;
    font-weight: bold;
    text-align: left;
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
  }

  .flow .inbox .rbox .w-box_s p.c-title {
    width: 75px;
    font-size: 20px;
    font-weight: bold;
    color: #fff;
    background: #f29c97;
    border-radius: 15px;
    position: relative;
    content: "";
    display: block;
    left: 50%;
    transform: translateX(-50%);
    top: -35px;
  }

  .flow .inbox .rbox .w-box_s p.text {
    font-size: 17px;
    font-weight: bold;
    text-align: left;
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
  }

  .service-start {
    background: #fff;
    width: 100%;
    height: 230px;
    margin: 0 auto;
    border-radius: 40px;
    border: 5px solid #eb5c2b;
    position: relative;
    z-index: 0;
  }

  .service-start img {
    content: "";
    position: absolute;
    display: block;
    width: 169px;
    height: 254px;
    bottom: -60px;
    z-index: 1;
    left: 22%;
  }

  .service-start p {
    content: "";
    position: absolute;
    display: block;
    font-size: 50px;
    color: #eb5c2b;
    font-weight: bold;
    top: 50%;
    left: 58%;
    transform: translate(-50%, -58%);
  }

  /* よくあるご質問　*/
  .box11 {
    margin-top: -200px;
    padding: 200px 0 100px;
  }

  .box11 h4 {
    border-bottom: 1px solid #403733;
  }

  .question {
    position: relative;
    font-size: 20px;
    font-weight: bold;
    color: #eb5c2b;
    padding: 0 0 25px 100px;
    margin-bottom: 5px;
  }

  .question .icon {
    position: absolute;
    content: "";
    display: block;
    width: 85px;
    height: 74px;
    text-align: center;
    padding: 15px 0 0;
    font-size: 35px;
    font-family: Arial, Helvetica, "sans-serif";
    font-weight: bold;
    top: -25px;
    left: 0;
    color: #fff;
    background: url("https://add.gig.co.jp/wp2/wp-content/themes/gig_works/assets/it-support/images/icon_question.png")no-repeat;
    background-size: 85px 74px;
  }

  .answer {
    position: relative;
    font-size: 20px;
    font-weight: bold;
    padding: 0 0 25px 100px;
    margin-left: 110px;
    margin-bottom: 50px;
  }

  .answer .icon {
    position: absolute;
    content: "";
    display: block;
    width: 85px;
    height: 74px;
    text-align: center;
    padding: 15px 0 0;
    font-size: 35px;
    font-family: Arial, Helvetica, "sans-serif";
    font-weight: bold;
    top: -15px;
    left: 0;
    color: #fff;
    background: url("https://add.gig.co.jp/wp2/wp-content/themes/gig_works/assets/it-support/images/icon_answer.png")no-repeat;
    background-size: contain;
  }

  /*************************
  /*　問い合わせフォーム　
  *************************/
  #form {
    width: 100%;
    max-width: 1300px;
    margin: 0 auto;
    padding: 70px 0 95px;
  }

  .form_top p {
    font-size: 20px;
    font-weight: bold;
    text-align: center;
  }

  .form_top p.small {
    font-size: 15px;
    font-weight: normal;
  }

  .form01 p.com {
    margin: 25px 25px 15px 50px;
    color: #e60000;
  }

  div.form01 div.privcy {
    width: 100%;
    height: 260px;
    margin: 20px auto;
    padding: 10px 30px;
    font-size: 14px;
    line-height: 160%;
    text-align: left;
    border: 1px solid #dddddd;
    background: #fff;
    overflow-y: scroll;
  }

  div.form01 div.privcy p {
    font-size: 15px;
    line-height: normal;
    letter-spacing: 0.5px;
    margin: 0.5em auto 0;
    padding: 0;
  }

  div.form01 select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
  }

  /* CSS（IE10?）*/
  div.form01 select::-ms-expand {
    display: none;
  }

  div.form01 {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0;
  }

  p.form_top2 {
    /*complete.html*/
    max-width: 750px;
    margin: 0 auto;
    padding: 0;
    font-size: 15px;
    line-height: 160%;
    text-align: left;
  }

  @media screen and (max-width: 1099px) {
    #form {
      width: 100%;
      min-width: 100%;
      padding: 70px 3% 95px;
    }

    p.form_top {
      width: 100%;
      display: inline-block;
      margin: 0 auto;
      padding: 0 0 0 210px;
      font-size: 15px;
      line-height: 160%;
      text-align: left;
    }

    p.form_top span {
      color: #d60000;
    }
  }

  /*************************
  /* サイド　お問い合わせボタン
  *************************/
  #contact_to {
    position: fixed;
    background: #eb5c2b;
    writing-mode: vertical-rl;
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    -o-writing-mode: vertical-rl;
    width: 60px;
    height: 300px;
    top: 200px;
    right: 0;
    border-radius: 20px 0 0 20px;
    z-index: 9999;
  }

  #contact_to a {
    display: block;
    font-size: 18px;
    color: #fff;
    line-height: 50px;
    text-align: center;
    text-decoration: none;
    padding-right: 10px;
  }

  #contact_to a:hover {
    transition: 0.2s linear;
    opacity: 0.8;
  }

  /*********************/
  /* 問い合わせ完了ページ
    *********************/
  .kv {
    background: url("https://add.gig.co.jp/wp2/wp-content/themes/gig_works/assets/it-support/images/kv_thanks.jpg");
    padding-bottom: 15.625%;
    background-size: cover;
  }

  /* .box {
    padding: 50px 0 20px;
  } */

  .box h3 {
    margin-bottom: 25px;
  }
}

/*
  headerとfooter専用
*/
.pc-view {
  display: block;
}

.sp-view {
  display: none;
}

.flex-container {
  display: flex;
  flex-wrap: wrap;
}

/*
  headerとfooter専用
*/
header,
footer {
  letter-spacing: 0;
  font-family: 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
}

header {
  position: fixed;
  width: 100%;
  z-index: 10;
  background-color: #fff;
}

header .flex-container {
  align-items: center;
  justify-content: space-between;
}

header .flex-container .logo {
  padding-left: 25px;
  width: 250px;
}

header .flex-container .logo img {
  display: block;
}

header .flex-container nav ul {
  display: flex;
  align-items: center;
  height: 90px;
}

header .flex-container nav li {
  margin-right: 1em;
  margin-left: 1em;
}

header .flex-container nav li a {
  font-size: 15px;
}

header .flex-container nav li.active a {
  border-bottom: 3px solid #eb5c2b;
}

header .flex-container .btn_magazine {
  padding-right: 25px;
}

header .flex-container .btn_magazine a {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 25px;
  width: 200px;
  height: 50px;
  font-size: 18px;
  color: #fff;
  background-color: #000;
}

header .flex-container .btn_magazine a:hover,
header .flex-container .btn_magazine a:focus {
  opacity: 1;
  background: linear-gradient(90deg, #ec5703, #f39a07);
}

header .flex-container .sp-nav {
  display: none;
}

header .flex-container .btn_hamburger {
  display: none;
}

@media screen and (max-width:1170px) {
  header .flex-container nav li {
    margin-right: 0.75em;
    margin-left: 0.75em;
  }
}

@media screen and (max-width:1060px) {
  header .flex-container .logo {
    padding-left: 10px;
    width: auto;
  }

  header .flex-container .logo img {
    height: 40px;
  }

  header .flex-container nav li {
    margin-right: 0.5em;
    margin-left: 0.5em;
  }

  header .flex-container nav li a {
    font-size: 13px;
  }

  header .flex-container .btn_magazine {
    padding-right: 10px;
  }

  header .flex-container .btn_magazine a {
    width: 145px;
    height: 40px;
    font-size: 14px;
  }
}

@media screen and (max-width:826px) {
  header .flex-container .logo img {
    height: 25px;
  }

  header .flex-container nav {
    display: none;
  }

  header .flex-container .btn_magazine {
    display: none;
  }

  header .flex-container .sp-nav {
    display: block;
    position: fixed;
    top: 0;
    right: -100%;
    width: 100%;
    height: 100vh;
    transition: all .6s;
    z-index: 15;
    overflow-y: auto;
    transition: all .6s;
    background-color: rgba(0, 0, 0, 0.9)
  }

  header .flex-container .sp-nav .sp-nav_list {
    padding: 80px 0 80px 50px;
  }

  header .flex-container .sp-nav .sp-nav_item:not(:first-of-type) {
    margin-top: 1em;
  }

  header .flex-container .sp-nav .sp-nav_item a {
    font-size: 17px;
    color: #fff;
  }

  header .flex-container .sp-nav .sp-nav_item a.active {
    color: #eb5c2b;
  }

  header .flex-container .sp-nav .sp-nav_item a:hover,
  header .flex-container .sp-nav .sp-nav_item a:active {
    opacity: 1;
    color: #eb5c2b;
  }

  header .flex-container .sp-nav .sp-nav_item>a {
    font-weight: bold;
  }

  header .flex-container .sp-nav .sp-nav_child {
    padding-left: 1em;
  }

  header .flex-container .sp-nav .sp-nav_child_list a {
    font-size: 15px;
  }

  header .flex-container.active .sp-nav {
    right: 0;
  }

  header .flex-container .btn_hamburger {
    display: inline-block;
    position: relative;
    width: 40px;
    height: 40px;
    cursor: pointer;
    transition: all .6s;
    z-index: 20;
    background-color: #eb5c2b;
  }

  header .flex-container .btn_hamburger span {
    display: inline-block;
    position: absolute;
    left: 10px;
    width: 20px;
    height: 2px;
    background-color: #fff;
    transition: all .6s;
  }

  header .flex-container .btn_hamburger span:nth-of-type(1) {
    top: 13px;
  }

  header .flex-container .btn_hamburger span:nth-of-type(2) {
    top: 20px;
  }

  header .flex-container .btn_hamburger span:nth-of-type(3) {
    top: 27px;
  }

  header .flex-container.active .btn_hamburger span:nth-of-type(1) {
    -webkit-transform: translateY(7px) rotate(-45deg);
    transform: translateY(7px) rotate(-45deg);
  }

  header .flex-container.active .btn_hamburger span:nth-of-type(2) {
    opacity: 0;
  }

  header .flex-container.active .btn_hamburger span:nth-of-type(3) {
    -webkit-transform: translateY(-7px) rotate(45deg);
    transform: translateY(-7px) rotate(45deg);
  }
}

footer .footer-sns {
  background-color: #f1f1f1;
}

footer .footer-sns ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  margin-right: auto;
  margin-left: auto;
  max-width: 1060px;
  height: 100px;
}

footer .footer-sns li {
  margin-right: 15px;
  margin-left: 15px;
}

footer .footer-sns li a {
  display: block;
}

footer .totop {
  display: none;
  position: fixed;
  left: 50%;
  bottom: 82px;
  padding: 0 10px;
  max-width: 1200px;
  width: 85%;
  pointer-events: none;
  transform: translate(-50%, 0);
}

footer .totop.stop {
  position: relative;
  bottom: 74px;
}

footer .totop a {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  right: 0;
  border-radius: 50%;
  width: 52px;
  height: 52px;
  pointer-events: auto;
  background-color: #484848;
  transform: translate(50%, 0);
}

footer .footer-menu {
  background-color: #eb5c2b;
}

footer .footer-menu * {
  font-size: 15px;
  color: #fff;
}

footer .footer-menu .footer-menu-container {
  margin-right: auto;
  margin-left: auto;
  padding: 50px 0 3px 95px;
  width: 1200px;
}

footer .footer-menu .footer-menu-container .logo img {
  height: 50px;
}

footer .footer-menu .footer-menu-container nav {
  padding-left: 120px;
}

footer .footer-menu .footer-menu-container nav li:not(:first-of-type) {
  margin-top: 1em;
}

footer .footer-menu .footer-menu-container nav a {
  font-weight: bold;
}

footer .footer-menu .footer-menu-container .left-container {
  display: flex;
  flex-wrap: wrap;
}

footer .footer-menu .footer-menu-container .right-container {
  padding-left: 95px;
}

footer .footer-menu .footer-menu-container .service_menu .flex-item-container:nth-of-type(2) {
  margin-left: 50px;
}

footer .footer-menu .footer-menu-container .service_menu .flex-item {
  margin-top: 1em;
}

footer .footer-menu .footer-menu-container .service_menu .flex-item p {
  font-weight: bold;
}

footer .footer-menu .footer-menu-container .service_menu .flex-item li::before {
  content: "-";
  display: inline-block;
  text-indent: 1em;
}

footer .footer-menu .footer-menu-container .service_menu .flex-item li.child-service {
  padding-left: 1em;
}

footer .footer-menu .footer-menu-container .service_menu .flex-item li.child-service::before {
  content: "\025b6";
  text-indent: 0.5em;
}

footer .footer-menu .copyright {
  padding: 20px 0;
}

footer .footer-menu .copyright small {
  display: block;
  width: 100%;
  text-align: center;
}

@media screen and (max-width:1170px) {
  footer .footer-menu .footer-menu-container {
    margin-right: auto;
    margin-left: auto;
    padding-left: 0;
    width: 1060px;
  }

  footer .footer-menu .footer-menu-container nav {
    padding-left: 110px;
  }
}

@media screen and (max-width:1060px) {
  footer .footer-menu .footer-menu-container {
    justify-content: center;
    padding-left: 0;
    padding-bottom: 0;
    width: 100%;
  }

  footer .footer-menu .footer-menu-container .left-container {
    width: 565px;
  }

  footer .footer-menu .footer-menu-container nav {
    padding-left: 120px;
  }

  footer .footer-menu .footer-menu-container .right-container {
    margin-top: 30px;
    padding-left: 0;
    width: 565px;
  }

  footer .footer-menu .footer-menu-container .service_menu .flex-item-container:nth-of-type(1) {
    width: 225px;
  }

  footer .footer-menu .footer-menu-container .service_menu .flex-item-container:nth-of-type(2) {
    margin-left: 25px;
    width: 315px;
  }

  footer .footer-menu .footer-menu-container .service_menu .flex-item-container .flex-item a {
    font-size: 14px;
  }
}

@media screen and (max-width:750px) {
  footer .footer-sns ul {
    height: 50px;
  }

  footer .footer-sns li {
    margin-right: 7.5px;
    margin-left: 7.5px;
  }

  footer .footer-sns li img {
    width: 23px;
  }

  footer .totop {
    bottom: 46px;
    width: calc(100% - 55px);
  }

  footer .totop.stop {
    bottom: 37px;
  }

  footer .totop a {
    width: 26px;
    height: 26px;
  }

  footer .totop img {
    width: 15px;
  }

  footer .footer-menu .footer-menu-container .left-container {
    display: block;
    width: 100%;
  }

  footer .footer-menu .footer-menu-container .logo img {
    display: block;
    margin: 0 auto;
    height: 58px;
  }

  footer .footer-menu .footer-menu-container nav {
    margin-top: 55px;
    padding-left: 0;
  }

  footer .footer-menu .footer-menu-container nav li {
    text-align: center;
  }

  footer .footer-menu .footer-menu-container nav li:not(:first-of-type) {
    margin-top: 0.5em;
  }

  footer .footer-menu .footer-menu-container nav a {
    font-size: 16px;
    font-weight: normal;
  }

  footer .footer-menu .footer-menu-container .right-container {
    display: none;
  }

  footer .footer-menu .copyright small {
    font-size: 13px;
  }

  footer .footer-menu .copyright {
    margin-top: 75px;
    padding-top: 0;
    padding-bottom: 30px;
  }
}