@charset "utf-8";

/*
  HERO
 */

.layout_hero {
  background: url(../images/top_main-visual.png) no-repeat top center / cover;
  padding: 5.6rem 0;
}

.hero-label {
  color: #d1d5e0;
  display: flex;
  margin-bottom: 2.4rem;
  order: -1;
}

.hero-label .label-item {
  font-size: 1.3rem;
  margin-right: 1rem;
  padding: 0.5rem 1rem;
  position: relative;
  z-index: 0;
}

.hero-label .label-item::before {
  background-color: #002f9b;
  content: '';
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  transform: skewX(-20deg);
  width: 100%;
  z-index: -1;
}

.hero-head {
  line-height: 1.4;
  margin-bottom: 2.4rem;
}

.hero-head .em {
  color: #ffc000;
}

@media (min-width: 600px) {
  .layout_hero {
    height: 29rem;
  }

  .layout_hero .cb {
    width: 87rem;
  }

  .hero-head {
    font-size: 3.4rem;
    margin-bottom: 0.6rem;
  }

  .hero-description {
    font-size: 1.6rem;
  }

  .hero-label {
    margin-bottom: 2.6rem;
  }

  .hero-label .label-item {
    font-size: 1.6rem;
    padding: 0.4rem 2.5rem;
  }
}

.lead-block {
  margin-bottom: 4rem;
}

/*
  - 改ざんのリスク
  - 改ざん検知サービスなら安心
*/

.section-risk .headline,
.section-service-summary .headline {
  color: #002f9b;
  text-align: left;
}

/* 改ざんのリスク */

.section-risk {
  background: linear-gradient(#e7eefc, #fafcff);
}

/* 改ざん検知サービスなら安心 */

.section-service-summary {
  background: url(../images/bg_service-summary.png) no-repeat top right / cover;
}

@media (max-width: 599px) {
  /*
    - 改ざんのリスク
    - 改ざん検知サービスなら安心
  */
  .section-risk .column-item:first-child,
  .section-service-summary .column-item:first-child {
    margin-bottom: 4rem;
  }
}

@media (min-width: 600px) {
  /*
    - 改ざんのリスク
    - 改ざん検知サービスなら安心
  */

  .section-risk .headline,
  .section-service-summary .headline {
    margin-bottom: 2.4rem;
  }

  .section-risk .column-pc,
  .section-service-summary .column-pc {
    width: 80rem;
  }

  .section-risk .column-item {
    width: 36rem;
  }

  .section-service-summary .column-item {
    width: 38rem;
  }

  /* 改ざん検知サービスなら安心 */

  .section-service-summary {
    padding: 3.2rem 0;
  }
}

/*
  Webサイト改ざんの影響
 */

.section-influence .headlint {
  margin-bottom: 3.2rem;
}

.influence-column {
  align-items: stretch;
}

.influence-item-link {
  display: flex;
  flex-direction: column;
}

.influence-item-link .img-wrap {
  order: -1;
}

.influence-item-head {
  color: #384042;
  font-size: 1.6rem;
  line-height: 1.5;
  margin: 2.4rem;
}

.influence-item-description {
  color: #061013;
  margin: 0 2.4rem 2.4rem;
}

.influence-item-link .look-details {
  margin: auto 2.4rem 2.4rem;
}

@media (max-width: 599px) {
  .influence-item-link + .influence-item-link {
    margin-top: 2.4rem;
  }
}

@media (min-width: 600px) {
  .influence-item-link {
    width: 30.4rem;
  }

  .influence-item-head {
    margin-top: 2rem;
  }
}

/*
  改ざん検知から修復までの流れ
 */

.section-flow {
  background-color: #d9e3fb;
}

.flow-detection {
  color: #002f9b;
}

.flow-repair {
  color: #384042;
}

.flow-detection-head,
.flow-repair-head {
  font-size: 1.8rem;
  margin-bottom: 1.6rem;
  text-align: center;
}

.flow-column {
  display: flex;
  background-color: #fff;
}

.flow-column-item {
  align-items: center;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  font-size: 1.4rem;
  text-align: center;
  padding: 3.2rem 0;
  width: calc(100% / 3);
}

.flow-detection .flow-column-item + .flow-column-item {
  border-left: 1px solid #d1d9ed;
}

.flow-repair .flow-column-item + .flow-column-item {
  border-left: 1px solid #cdcfd0;
}

.flow-column-item-img {
  align-items: center;
  display: flex;
  order: -1;
}

.analysis-report {
  background-color: #fff;
  box-sizing: border-box;
  font-size: 1.6rem;
  padding: 2.4rem 1.6rem;
}

.analysis-report-head {
  color: #002f9b;
  font-size: 2rem;
  margin-bottom: 2.4rem;
}

.flow-notes {
  margin: 1.7rem auto 4rem;
}

@media (max-width: 599px) {
  .flow-column-item-img {
    height: 7.2rem;
  }

  .flow-arrow {
    margin: 1rem auto;
    width: 3rem;
  }

  .flow-arrow .img {
    transform: rotateZ(90deg);
  }

  .section-flow .analysis-report {
    margin: 0 1.4rem;
    width: calc(100% - 2.8rem);
  }

  .analysis-report-list {
    margin-bottom: 3.2rem;
  }
}

@media (min-width: 600px) {
  .flow-from-detection-to-repair {
    align-items: center;
    display: flex;
    justify-content: space-between;
  }

  .flow-detection,
  .flow-repair {
    width: 46rem;
  }

  .flow-detection-head,
  .flow-repair-head {
    margin-bottom: 2.4rem;
  }

  .flow-column-item {
    font-size: 1.6rem;
    height: 20rem;
    justify-content: space-around;
    padding: 3rem 0 1.5rem;
  }

  .flow-arrow {
    padding-top: 3rem;
    width: 2.7rem;
  }

  .analysis-report-head {
    font-size: 2.6rem;
  }

  .analysis-report {
    padding: 5rem 8rem;
  }
}

/*
  特長
 */

.features-head {
  color: #384042;
  font-size: 1.8rem;
  margin-bottom: 1.8rem;
}

.features-item {
  align-items: center;
  display: flex;
  flex-direction: column;
}

.features-img {
  margin-bottom: 2.4rem;
  order: -1;
}

@media (max-width: 599px) {
  .features-item + .features-item {
    margin-top: 4rem;
  }
}

@media (min-width: 600px) {
  .section-features .column-pc {
    align-items: flex-start;
    justify-content: space-around;
  }

  .features-item {
    width: 26rem;
  }
}

/*
  料金
 */

.section-price {
  background: url(../images/bg_plans.png) repeat-x bottom right #d9e3fb;
}

.plan-price-wrap {
  margin-bottom: 1.6rem;
}

.plan-price-item.has-recommend {
  position: relative;
}

.plan-price-item.has-recommend .recommend {
  background-color: #e7eefc;
  border-radius: 2px;
  color: #002f9b;
  font-size: 1.6rem;
  font-weight: bold;
  left: 0;
  line-height: 1;
  margin: auto;
  padding: 1.2rem 0;
  position: absolute;
  right: 0;
  text-align: center;
  top: -2.2rem;
  width: 20rem;
}

.price-top-box {
  background-color: #fff;
  display: block;
  padding: 4rem 0 2.4rem;
  text-align: center;
}

.price-top-box_annual-fee {
  font-size: 1.2rem;
  line-height: 1;
  margin-bottom: 2rem;
  color:#8e8e98;
}

.price-top-label-price {
  font-size: 1.8rem;
  vertical-align: bottom;
}

.price-top-price {
  line-height: 1;
  margin-bottom: 2.4rem;
}

.price-top-price .large {
  font-size: 2.8rem;
}

.price-top-label-page {
  font-size: 1.2rem;
  line-height: 1;
  margin-bottom: 0.8rem;
  width: 100%;
}

.price-top-page {
  color: #0046e8;
  line-height: 1;
}

.price-top-page .large {
  font-size: 2.2rem;
}

.price-bottom-box {
  background-color: #002e9a;
  color: #e8ecf6;
  padding: 2.4rem 2.8rem;
  min-height: 185px;
}

.price-bottom-info {
  align-items: baseline;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  line-height: 1;
  margin-bottom: 1.6rem;
}

.price-bottom-info:last-child {
  margin-bottom: 0;
}

.price-bottom-label {
  font-size: 1.2rem;
  margin-right: 0.5rem;
  width: 10rem;
}

.price-bottom-data {
  font-size: 1.6rem;
  width: 5rem;
}

.price-bottom-data .small {
  font-size: 1.4rem;
}

.application-button-wrap {
  height: 5.2rem;
  margin: 2.4rem auto 0;
  width: 18.4rem;
}

.application-button-wrap .application-button {
  font-size: 1.6rem;
}

.price-bottom-attention {
  padding-top: 1rem;
  font-size: 1.1rem;
}

.price-bottom-attention a {
  color: #fff;
}

.wrap-list-notes {
background-color:rgba(255,255,255,0.5);
padding: 2.5rem;
max-width: 910px;
margin: 1.8rem auto;
}

.wrap-list-notes .list-notes .list-item .small{
  font-size: 1.2rem;
}

.wrap-list-notes .list-notes .list-item {
  font-size: 1.3rem;
}

.price-bottom-subtitle {
margin-bottom: 1rem;
font-weight: bold;
font-size: 1.5rem;

}

.price-caption {
  font-size: 1.3rem;
}

@media (max-width: 599px) {

  .price-bottom-box {
    min-height:150px;
  }

  .plan-price-item {
    box-shadow: 2px 4px 8px rgba(0, 47, 155, 0.24); /* #002F9B */
  }

  .plan-price-item + .plan-price-item {
    margin-top: 2rem;
  }

  .plan-price-item.has-recommend {
    margin-top: 4.6rem;
  }
}

@media (min-width: 600px) {
  .plan-price-wrap {
    box-shadow: 2px 4px 8px rgba(0, 47, 155, 0.24); /* #002F9B */
  }

  .plan-price-item {
    box-sizing: border-box;
    width: calc(100% / 4);
  }

  .price-top-box {
    padding: 4rem 0 2.4rem;
  }

  .plan-price-item + .plan-price-item .price-top-box {
    border-left: 1px solid #d1d9ed;
  }

  .plan-price-item + .plan-price-item .price-bottom-box {
    border-left: 1px solid #2a5bc2;
  }

  .price-bottom-info {
    margin-bottom: 1.3rem;
  }

  .application-button-wrap {
    margin-top: 2.8rem;
  }
}

/*
  お申し込みに必要なもの
 */

.section-necessary {
  background-color: #fafcff;
}

.necessary-wrap {
  background-color: #fff;
  box-sizing: border-box;
  padding: 2.4rem;
}

.necessary-item + .necessary-item {
  border-top: 1px solid #d1d9ed;
  margin-top: 2.4rem;
  padding-top: 2.4rem;
}

.necessary-item-head {
  color: #384042;
  font-weight: bold;
  margin-bottom: 2.4rem;
}

.necessary-wrap .small{
  font-size:1.2rem;
}

@media (min-width: 600px) {
  .necessary-wrap {
    margin: 0 auto;
    padding: 4rem;
    width: 75rem;
  }

  .necessary-item {
    display: flex;
  }

  .necessary-item + .necessary-item {
    margin-top: 3.2rem;
    padding-top: 3.2rem;
  }

  .necessary-item-head {
    margin-bottom: 0;
    width: 13em;
  }

  .necessary-item-description {
    width: calc(100% - 8em - 1rem);
  }

  .necessary-item-description .list-disc {
    margin-top: 1em;
  }
}

/*
  よくある質問
 */

.faq.cb {
  padding: 0;
}

.faq-q,
.faq-a {
  padding: 1.6rem 4.7rem;
  position: relative;
}

.faq-q {
  background-color: #e6edfd;
  color: #002f9b;
  font-weight: bold;
}

.faq-a {
  background-color: #fff;
  border-bottom: 1px solid #d1d9ed;
}

.faq-q::before,
.faq-a::before {
  display: block;
  font-size: 2rem;
  font-weight: bold;
  left: 1.5rem;
  position: absolute;
  top: 1rem;
}

.faq-q::before {
  content: 'Q';
}

.faq-a::before {
  color: #748dc7;
  content: 'A';
}

.faq-a .list-notes {
  margin: 1.6rem 0;
}

.faq-a .list-notes:last-child {
  margin-bottom: 0;
}

@media (min-width: 600px) {
  .faq {
    width: 75rem;
  }

  .faq-q {
    padding: 1.7rem 4.7rem;
  }

  .faq-a {
    padding: 2rem 4.7rem;
  }

  .faq-q::before {
    top: 1.1rem;
  }

  .faq-a::before {
    top: 1.4rem;
  }
}

/*
  ご利用方法
 */

.section-target-service {
  background: linear-gradient(#e7eefc, #fafcff);
}

.section-target-service .lead-block {
  margin-bottom: 2.4rem;
}

.target-service-list-wrap {
  background-color: #fff;
  padding: 4rem;
  margin-bottom: 1.6rem;
}

.target-service-list {
  margin-bottom: 1.6rem;
}

.target-service-list-item {
  border-bottom: 1px solid #d1d9ed;
  padding: 1rem 0;
}

.target-service-sub-head {
  color: #384042;
  font-size: 1.8rem;
  margin-bottom: 2.4rem;
}

@media (max-width: 599px) {
  .target-service-list-item .sub {
    display: block;
  }

  .target-service-list-item:first-child {
    padding-top: 0;
  }
}

@media (min-width: 600px) {
  .section-target-service .cb {
    width: 75rem;
  }

  .target-service-list {
    display: flex;
    flex-flow: column wrap;
    height: 14.7rem;
  }

  .target-service-list-item {
    width: 50%;
  }

  .target-service-list-item:nth-child(4n + 1) {
    padding-top: 0;
  }

  .target-service-list-item:nth-child(4n) {
    padding-bottom: 0;
    border-bottom: none;
  }
}

/* --------------------
  最小SP表示調整
-------------------- */

@media (max-width: 374px) {
  .hero-label .label-item {
    font-size: 1.1rem;
    padding: 0.5rem 0.8rem;
  }

  .hero-head .only-sph {
    display: none;
  }

  .flow-column-item {
    font-size: 1.3rem;
  }
}

/* --------------------
  IE11 hack
-------------------- */
@media all and (-ms-high-contrast: none) {
  .hero-label .label-item {
    padding-bottom: 0;
  }

  .plan-price-item.has-recommend .recommend {
    padding: 1.7rem 0 0.8rem;
  }
}