.br{
  display: inline-block;
}
/* button */
.cc-main {
  .btn {
    transition: all 0.3s;

    &.btn-sm {
      padding: 1.15rem 4.8rem !important;
    }

    &.btn-gray-light {
      background-color: #aaa !important;
      border-color: #aaa !important;

      &:hover {
        border-color: #ccc !important;
        color: #fff !important;
        background-color: #ccc !important;
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 5.08'%3e%3cpath fill='%23fff' d='M12,5.08H0.864C0.387,5.08,0,4.693,0,4.216s0.387-0.864,0.864-0.864h7.871L7.372,1.35c-0.268-0.395-0.166-0.932,0.228-1.2c0.395-0.268,0.932-0.166,1.2,0.228L12,5.08z'/%3e%3c/svg%3e") !important;
      }
    }
  }
}

/* mv */
.mv {
  background: url(/lp/awsmanagedservice/img/mv-bg.png) no-repeat;
  background-size: cover;
  background-position: center;
  min-height: 530px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 25px;
  @media screen and (max-width:767px) {
    padding: 60px 30px;
  }

  .mv-inner {
    width: 100%;
    max-width: 1100px;
    display: flex;
    flex-direction: column;
    row-gap: 24px;

    .mv-text {
      color: #fff;
      margin-bottom: 0;

      .mv-title {
        font-size: 3.2rem;
        line-height: 1;

        span {
          font-size: 5.4rem;
          display: block;
          margin-top: 8px;
          font-weight: bold;
        }
      }

      @media screen and (max-width:767px) {
        .mv-title {
          span {
            font-size: 4rem;
            line-height: 1.2;
          }
        }
      }

      .mv-list {
        display: flex;
        gap: 16px;
        margin-top: 24px;
        padding-left: 0;
        flex-wrap: wrap;

        li {
          border: 1px solid #fff;
          padding: 8px 16px;
          line-height: 1;
        }
      }

      .mv-subTitle {
        font-size: 2rem;
        line-height: 1.4;
        margin-bottom: 0;
        letter-spacing: 0;
      }

      .mv-subTitle.addLogo {
        display: flex;
        align-items: center;
        column-gap: 16px;

        img {
          display: inline;
          max-width: 198px;
          height: auto;
        }

        @media screen and (max-width:767px) {
          flex-wrap: wrap;
        }
      }
    }

    .mv-bottom {
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 16px;

      .mv-btn {
        display: flex;
        gap: 24px;
        margin-bottom: 0;
        flex-wrap: wrap;

        .btn {
          box-shadow: 0px 0px 10px 0px #00000033 !important;
          border-radius: 70px !important;
          height: 79px;
          display: grid;
          place-content: center;
          font-size: 2.2rem;
          letter-spacing: 1.2px;
          line-height: 1.3;
          background-position: 92% 50%;

          &:hover {
            background-position: 95% 50%;
          }

          span {
            padding: 0 2rem;
          }

          @media screen and (max-width:767px) {
            font-size: 1.8rem;
            height: 67px;
            width: 100%;

            span {
              padding: 0 1.5rem;
              font-size: 1.6rem;
              letter-spacing: 0.97px;
            }
          }
        }
      }
      @media screen and (max-width:767px) {
        justify-content: center;
        gap: 24px;
      }
    }
  }
}

.badge {
  background-color: #fff;
  padding: 7px;
  border-radius: 4px;

  img {
    max-width: 120px;
    height: auto;

    @media screen and (max-width:767px) {
      max-width: 100px;
    }
  }

}

/* リード */
.assessment_about_list_sp {
  justify-content: center;

  .assessment_list_sp {
    @media screen and (min-width:767px) {
      width: 222.5px;
      margin-bottom: 50px;
    }

    .assessment_list_sp_left p {
      width: 100%;

      img {
        width: 100%;
      }
    }
  }
}

.border-box {
  padding: 50px 1rem;
  width: 100%;
}

/* AWS監視・運用代行サービスの概要 */
.table-2col {
  display: flex;
  column-gap: 10px;

  @media screen and (max-width:768px) {
    flex-direction: column;
  }
}

/* プレミアムサポート */
.bg_gray_btn a {
  background-color: #aaa;

  &:hover {
    background-color: #ccc !important;
  }
}

/* AWS監視・運用スタイルで選べる4プラン */
.check-list {
  li {
    display: flex;
    column-gap: 10px;

    i:before {
      position: relative;
      top: 4px;
    }
  }
}

.fa-solid {
  font-weight: 900;
  font-family: "Font Awesome 6 Free";
}

.fa-check:before {
  content: "\f00c";
}

/* よくある質問 */
.qa-accs .q-tab h3 {
  margin-bottom: 0;
}

/* cv */
.cv {
  padding: 50px 0;
  .cv-inner{
    gap: 30px;
    display: flex;
    justify-content: center;
    @media screen and (max-width:767px) {
      flex-direction: column;
      align-items: center;
    }
  }
  .btn{
    height: 80px;
    line-height: 1;
    font-size: 2.2rem;
    display: grid;
    place-content: center;
    min-width: 360px;
    span{
      display: block;
      line-height: 1.5;
    }
    @media screen and (max-width:767px) {
      width: 100%;
      min-width: initial;
      font-size: 1.8rem;
    }
  }
}

.case_list .case_tag{
  position: absolute;
  top: 0;
  left: 0;
  background-color: #545454;
  padding: 6px 24px;
  font-size: 1.2rem;
  color: #fff;
  line-height: 1.75;
}