/* service page */
.service-page .sub-visual{
  background:linear-gradient(135deg, #fff5f7 0%, #ffffff 58%, #f7f7f7 100%);
}

.service-detail-section{
  background:#fff;
}

.service-detail-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:30px;
}

.service-detail-card-wrap{
  position:relative;
  min-height:420px;
  padding:38px 32px;
  border-radius:24px;
  background:#fff;
  border:1px solid rgba(0,0,0,.05);
  box-shadow:0 12px 35px rgba(0,0,0,.07);
  overflow:hidden;
  transition:.35s;
}
.service-detail-card-wrap::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:5px;
  background:#E7113B;
}

.service-detail-card-wrap::after{
  content:"";
  position:absolute;
  right:-45px;
  bottom:-45px;
  width:150px;
  height:150px;
  border-radius:50%;
  background:rgba(231,17,59,.06);
}

.service-detail-card-wrap:hover{
  transform:translateY(-10px);
  box-shadow:0 22px 50px rgba(0,0,0,.12);
}

.service-detail-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:64px;
  height:64px;
  margin-bottom:26px;
  border-radius:18px;
  background:#fff1f4;
  color:#E7113B;
  font-size:34px;
}

.service-detail-card-wrap > span{
  position:absolute;
  top:36px;
  right:32px;
  color:rgba(231,17,59,.18);
  font-size:48px;
  font-weight:800;
  line-height:1;
}

.service-detail-card h3{
  margin-bottom:16px;
  font-size:26px;
  font-weight:800;
  color:#222;
}

.service-detail-card p{
  margin-bottom:24px;
  color:#666;
  font-size:16px;
  line-height:1.8;
}

.service-detail-card ul{
  position:relative;
  z-index:1;
}

.service-detail-card li{
  position:relative;
  padding-left:16px;
  color:#333;
  font-size:15px;
  line-height:2;
}

.service-detail-card li::before{
  content:"";
  position:absolute;
  top:14px;
  left:0;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#E7113B;
}

.service-scope-section{
  background:#fafafa;
}

.scope-list{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:20px;
}

.scope-item-wrap{
  padding:32px 24px;
  border-radius:22px;
  background:#fff;
  border:1px solid rgba(0,0,0,.04);
  box-shadow:0 10px 30px rgba(0,0,0,.05);
  transition:.3s;
}

.scope-item-wrap:hover{
  transform:translateY(-8px);
  box-shadow:0 18px 42px rgba(0,0,0,.1);
}

.scope-item-wrap i{
  display:block;
  margin-bottom:20px;
  color:#E7113B;
  font-size:36px;
}

.scope-item-wrap strong{
  display:block;
  margin-bottom:12px;
  color:#222;
  font-size:20px;
}

.scope-item-wrap p{
  color:#666;
  font-size:15px;
  line-height:1.7;
}

.service-process-section{
  background:#fff;
}

.service-process-list{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:20px;
  counter-reset:process;
}

.service-process-list li{
  position:relative;
  padding:34px 26px;
  border-radius:22px;
  background:#fff;
  border:1px solid rgba(231,17,59,.14);
  box-shadow:0 10px 30px rgba(0,0,0,.05);
}

.service-process-list li::after{
  content:"";
  position:absolute;
  top:50%;
  right:-22px;
  width:22px;
  height:1px;
  background:rgba(231,17,59,.35);
}

.service-process-list li:last-child::after{
  display:none;
}

.service-process-list span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:52px;
  height:52px;
  margin-bottom:24px;
  border-radius:16px;
  background:#E7113B;
  color:#fff;
  font-weight:800;
}

.service-process-list strong{
  display:block;
  margin-bottom:12px;
  color:#222;
  font-size:21px;
  font-weight:800;
}

.service-process-list p{
  color:#666;
  font-size:15px;
  line-height:1.7;
}

.service-contact{
  background:#B71C3B;
}

.service-contact a{
  color:#E7113B;
}

@media(max-width:1024px){
  .service-detail-grid,
  .scope-list,
  .service-process-list{
    grid-template-columns:repeat(2, 1fr);
  }

  .service-process-list li::after{
    display:none;
  }
}

@media(max-width:768px){
  .service-detail-grid,
  .scope-list,
  .service-process-list{
    grid-template-columns:1fr;
  }

  .service-detail-card-wrap{
    min-height:auto;
    padding:32px 24px;
  }

  .service-detail-card-wrap > span{
    font-size:40px;
    top:30px;
    right:24px;
  }

  .service-detail-card-wrap h3{
    font-size:23px;
  }

  .scope-item-wrap,
  .service-process-list li{
    padding:28px 22px;
  }
}