* {
  box-sizing: border-box; }

a {
  transition: 0.3s ease-in-out; }

a:hover {
  opacity: 0.6;
  transition: 0.3s ease-in-out; }

.campaignSurface {
  text-align: center;
  font-size: 122%;
  font-weight: 500;
  color: #333333; }
  .campaignSurface .bigH2 {
    color: #006cc2;
    font-weight: 200;
    font-size: 36px;
    margin-top: 50px;
    padding-bottom: 10px;
    border-bottom: 3px solid #006cc2;
    display: inline-block;
    margin-bottom: 50px;
    position: relative; }
  .campaignSurface .txt_read {
    margin-bottom: 50px; }
  .campaignSurface .wrapCol02 {
    overflow: hidden;
    margin-bottom: 50px; }
    .campaignSurface .wrapCol02 dl {
      width: 440px; }
      .campaignSurface .wrapCol02 dl dt {
        color: #FFF;
        font-weight: bold;
        font-size: 150%;
        padding: 5px; }
      .campaignSurface .wrapCol02 dl dd {
        padding: 15px; }
        .campaignSurface .wrapCol02 dl dd .txt01 {
          font-weight: bold;
          padding-top: 20px; }
          .campaignSurface .wrapCol02 dl dd .txt01 span {
            color: #cf0040;
            font-size: 120%; }
        .campaignSurface .wrapCol02 dl dd .package {
          display: table;
          margin: 30px auto; }
          .campaignSurface .wrapCol02 dl dd .package .cloud {
            padding-left: 20px; }
          .campaignSurface .wrapCol02 dl dd .package p {
            display: table-cell; }
            .campaignSurface .wrapCol02 dl dd .package p span {
              display: block;
              font-size: 83%; }
            .campaignSurface .wrapCol02 dl dd .package p .office365 {
              padding-top: 13px; }
        .campaignSurface .wrapCol02 dl dd .dlPrice {
          width: 100%; }
          .campaignSurface .wrapCol02 dl dd .dlPrice dt {
            font-size: 93%;
            padding: 5px 0; }
          .campaignSurface .wrapCol02 dl dd .dlPrice dd {
            background: #FFF;
            height: 210px; }
            .campaignSurface .wrapCol02 dl dd .dlPrice dd .wrapper {
              overflow: hidden;
              display: block;
              width: 90%;
              margin: 0 auto; }
              .campaignSurface .wrapCol02 dl dd .dlPrice dd .wrapper .originalPrice {
                float: left;
                vertical-align: middle;
                text-align: left;
                font-weight: 400;
                position: relative;
                margin-right: 0; }
                .campaignSurface .wrapCol02 dl dd .dlPrice dd .wrapper .originalPrice .price {
                  font-weight: bold;
                  font-size: 122%; }
                  .campaignSurface .wrapCol02 dl dd .dlPrice dd .wrapper .originalPrice .price span {
                    font-size: 70%; }
                    .campaignSurface .wrapCol02 dl dd .dlPrice dd .wrapper .originalPrice .price span.label {
                      background: #a7a7a7;
                      color: #FFF;
                      border-radius: 5px;
                      padding: 3px 10px;
                      margin-right: 10px; }
              .campaignSurface .wrapCol02 dl dd .dlPrice dd .wrapper .campPrice {
                float: right;
                color: #cf0040;
                font-weight: bold;
                font-size: 130%;
                position: relative; }
                .campaignSurface .wrapCol02 dl dd .dlPrice dd .wrapper .campPrice:before {
                  content: '';
                  display: block;
                  width: 18px;
                  height: 27px;
                  background: url(/svcsol/campaign/images/surface_201803/ic_tri.png) no-repeat;
                  position: absolute;
                  left: -50px;
                  top: 30px; }
      .campaignSurface .wrapCol02 dl.pac01 {
        float: left; }
        .campaignSurface .wrapCol02 dl.pac01 dt {
          background-color: #4e9bcc; }
        .campaignSurface .wrapCol02 dl.pac01 dd {
          background-color: #dcebf5;
          border: 2px solid #4e9bcc; }
          .campaignSurface .wrapCol02 dl.pac01 dd .package p:nth-child(2) {
            padding: 0 10px; }
          .campaignSurface .wrapCol02 dl.pac01 dd .dlPrice dd {
            padding-top: 60px; }
      .campaignSurface .wrapCol02 dl.pac02 {
        float: right; }
        .campaignSurface .wrapCol02 dl.pac02 dt {
          background-color: #e9755e; }
        .campaignSurface .wrapCol02 dl.pac02 dd {
          background-color: #f9e1dc;
          border: 2px solid #e9755e; }
          .campaignSurface .wrapCol02 dl.pac02 dd .dlPrice .wrapper:first-child {
            margin-bottom: 20px; }
  .campaignSurface .cvArea .upper {
    background: url(/svcsol/campaign/images/surface_201803/cv_bg.jpg) no-repeat;
    width: 913px;
    height: 158px;
    text-align: left;
    padding: 25px 30px;
    position: relative; }
    .campaignSurface .cvArea .upper .campTerm {
      background: #FFF;
      width: 46%;
      border-radius: 10px;
      line-height: 1.3;
      text-align: center;
      margin-top: 5px;
      padding: 10px 0 5px 0;
      color: #cf0040;
      font-weight: bold; }
    .campaignSurface .cvArea .upper .cvBtn {
      position: absolute;
      top: 42px;
      right: 27px; }
  .campaignSurface .cvArea .bottom {
    background: #7a7a7a;
    color: #FFF;
    padding: 3px;
    font-size: 90%; }
    .campaignSurface .cvArea .bottom img {
      width: 15px;
      margin: 0 5px; }
  .campaignSurface .h3Service {
    background: #006cc2;
    color: #fff;
    font-weight: bold;
    text-align: left;
    padding: 10px 15px;
    font-size: 115%;
    margin-bottom: 30px; }
  .campaignSurface .mobileSp ul {
    overflow: hidden; }
    .campaignSurface .mobileSp ul li {
      float: left;
      width: 270px;
      height: 280px;
      border: 1px solid #006cc2;
      padding: 20px;
      margin-right: 50px; }
      .campaignSurface .mobileSp ul li:last-child {
        float: right;
        margin-right: 0; }
      .campaignSurface .mobileSp ul li .imagespace {
        border-bottom: 1px solid #dddddd;
        height: 150px; }
      .campaignSurface .mobileSp ul li.mstype01 .imagespace p:first-child {
        text-align: left;
        padding-bottom: 5px; }
      .campaignSurface .mobileSp ul li.mstype01 .imagespace p:nth-child(2) {
        font-size: 130%;
        color: #006cc2; }
      .campaignSurface .mobileSp ul li.mstype01 .imagespace p:last-child {
        text-align: right;
        color: #006cc2; }
      .campaignSurface .mobileSp ul li.mstype02 .imagespace {
        padding-top: 30px; }
      .campaignSurface .mobileSp ul li dt {
        color: #006cc2;
        font-weight: bold;
        font-size: 122%;
        padding: 5px 0; }
      .campaignSurface .mobileSp ul li dd {
        font-size: 82%; }
  .campaignSurface .mobileSp .seivice01 {
    width: 100%;
    margin: 50px 0 5px 0; }
    .campaignSurface .mobileSp .seivice01 th, .campaignSurface .mobileSp .seivice01 td {
      padding: 15px; }
    .campaignSurface .mobileSp .seivice01 thead th.content {
      background: #f1f3f3;
      text-align: center !important;
      border: 1px solid #dddddd;
      font-weight: bold; }
      .campaignSurface .mobileSp .seivice01 thead th.content p {
        font-weight: 300;
        font-size: 88%;
        line-height: 1.2;
        padding-top: 10px; }
    .campaignSurface .mobileSp .seivice01 tbody th {
      border: 1px solid #dddddd;
      text-align: center; }
      .campaignSurface .mobileSp .seivice01 tbody th.typeMobile {
        background: #dcebf5;
        color: #006cc2; }
      .campaignSurface .mobileSp .seivice01 tbody th.typeCloud {
        background: #f9e1dc;
        color: #e9755e; }
    .campaignSurface .mobileSp .seivice01 tbody td {
      border: 1px solid #dddddd; }
      .campaignSurface .mobileSp .seivice01 tbody td span {
        display: block;
        color: #cf0040; }
  .campaignSurface .mobileSp .attention {
    text-align: right;
    font-size: 80%; }
  .campaignSurface .service02Wrapper {
    display: table;
    width: 100%;
    margin-top: 30px; }
    .campaignSurface .service02Wrapper .imgbox {
      display: table-cell;
      vertical-align: top;
      width: 345px;
      padding-right: 50px; }
    .campaignSurface .service02Wrapper .service02 {
      display: table-cell;
      vertical-align: top;
      text-align: center;
      width: 100%; }
      .campaignSurface .service02Wrapper .service02 th, .campaignSurface .service02Wrapper .service02 td {
        border: 1px solid #dddddd;
        padding: 15px 20px;
        font-size: 88%; }
      .campaignSurface .service02Wrapper .service02 th {
        text-align: center;
        background: #f1f3f3; }
  .campaignSurface .serviceUnit {
    margin-bottom: 60px; }
    .campaignSurface .serviceUnit .copy {
      text-align: left;
      font-size: 90%;
      margin-bottom: 20px; }
    .campaignSurface .serviceUnit .service03 li {
      text-align: left;
      font-size: 70%; }
  .campaignSurface .ulLink {
    overflow: hidden;
    margin: 20px 0 50px 0; }
    .campaignSurface .ulLink li {
      float: left;
      width: 270px;
      height: 90px;
      margin-right: 50px;
      border: 1px solid #ddd;
      border-radius: 5px; }
      .campaignSurface .ulLink li:last-child {
        float: right;
        margin-right: 0; }
      .campaignSurface .ulLink li a {
        display: block;
        height: 100%;
        width: 100%;
        text-align: center;
        color: #515151;
        background: linear-gradient(#f4f4f4, #dddddd);
        transition: 0.3s ease-in-out;
        padding-top: 30px; }
        .campaignSurface .ulLink li a img {
          margin-left: 5px; }
        .campaignSurface .ulLink li a span {
          display: block;
          font-size: 80%; }
        .campaignSurface .ulLink li a:hover {
          background: linear-gradient(#006cc2, #4e9bcc);
          opacity: 1;
          color: #FFF; }
          .campaignSurface .ulLink li a:hover img {
            fill: #FFF; }
      .campaignSurface .ulLink li.twoLine p:after {
        background: url(/svcsol/campaign/images/surface_201803/ic_window.svg) no-repeat 0 3px;
        content: '';
        display: inline-block;
        width: 20px;
        height: 20px;
        margin-left: 10px;
        transition: 0.3s ease-in-out; }
      .campaignSurface .ulLink li.twoLine:hover p:after {
        background: url(/svcsol/campaign/images/surface_201803/ic_window_w.svg) no-repeat 0 3px; }
      .campaignSurface .ulLink li.twoLine a {
        padding-top: 20px; }
  .campaignSurface .boxStyle_inline01 {
    text-align: left;
    font-size: 80%;
    margin-bottom: 50px; }
  .campaignSurface .solutionTtl {
    padding-top: 35px; }
    .campaignSurface .solutionTtl .ic_solution {
      position: absolute;
      top: 0;
      left: 0; }
  .campaignSurface .solutionH3 {
    text-align: left;
    font-weight: bold;
    margin-bottom: 20px;
    padding: 5px 0 5px 20px; }
    .campaignSurface .solutionH3.type01 {
      border-left: 10px solid #b3a9d3; }
    .campaignSurface .solutionH3.type02 {
      border-left: 10px solid #a7bc5b; }
    .campaignSurface .solutionH3.type03 {
      border-left: 10px solid #df9bab; }

@media only screen and (max-width: 768px) {
  .campaignSurface .bigH2 {
    font-size: 8vw;
    margin-top: 20px; }
  .campaignSurface .txt_read {
    margin-bottom: 20px; }
  .campaignSurface section .wrapCol02 {
    margin-bottom: 0; }
    .campaignSurface section .wrapCol02 dl {
      width: 100%;
      margin-bottom: 20px; }
      .campaignSurface section .wrapCol02 dl dd {
        padding: 10px; }
        .campaignSurface section .wrapCol02 dl dd .txt01 {
          padding-top: 0; }
        .campaignSurface section .wrapCol02 dl dd .dlPrice {
          margin-bottom: 0; }
          .campaignSurface section .wrapCol02 dl dd .dlPrice dd {
            height: auto; }
            .campaignSurface section .wrapCol02 dl dd .dlPrice dd .wrapper {
              width: 100%; }
              .campaignSurface section .wrapCol02 dl dd .dlPrice dd .wrapper .campPrice:before {
                left: -30px; }
      .campaignSurface section .wrapCol02 dl.pac01 dd .dlPrice dd {
        padding-top: 10px; }
  .campaignSurface .mobileSp ul li {
    float: none;
    margin-right: 0;
    width: 100%;
    height: auto;
    margin-bottom: 10px;
    padding: 10px; }
    .campaignSurface .mobileSp ul li dl dd {
      font-size: 100%; }
  .campaignSurface .mobileSp .seivice01 {
    width: 100% !important; }
  .campaignSurface .mobileSp .attention {
    text-align: left; }
  .campaignSurface .cvArea .upper {
    width: 100%;
    height: auto;
    background: url(/svcsol/campaign/images/surface_201803/cv_bg_sp.png) no-repeat;
    background-size: 100% auto;
    text-align: center;
    padding: 15px 0 10px 10px; }
    .campaignSurface .cvArea .upper .campTerm {
      width: 70%;
      margin: 0 auto;
      border-radius: 5px;
      padding: 5px 10px;
      font-size: 80%; }
    .campaignSurface .cvArea .upper .cvBtn {
      position: static;
      margin-top: 30px; }
  .campaignSurface .cvArea .bottom span {
    display: block; }
  .campaignSurface .service02Wrapper .imgbox {
    display: block;
    width: 100%; }
    .campaignSurface .service02Wrapper .imgbox img {
      width: 100%; }
  .campaignSurface .service02Wrapper .service02 {
    width: 100% !important;
    display: block; }
    .campaignSurface .service02Wrapper .service02 th, .campaignSurface .service02Wrapper .service02 td {
      padding: 5px; }
  .campaignSurface .serviceUnit {
    margin-bottom: 20px; }
  .campaignSurface .productLink {
    text-indent: -9999px;
    display: block;
    background: url(/svcsol/campaign/images/surface_201803/txt_ttl_link_sp01.png) no-repeat;
    background-size: 100% auto;
    width: 100%;
    height: calc(100vw*0.078); }
  .campaignSurface .ulLink {
    margin: 10px 0 20px 0; }
    .campaignSurface .ulLink li {
      float: none;
      width: 100%;
      height: auto;
      margin-right: 0;
      margin-bottom: 10px; }
      .campaignSurface .ulLink li a {
        padding: 10px; }
      .campaignSurface .ulLink li.twoLine a {
        padding-top: 10px; } }

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