.bobo_advantage {padding: clamp(30px, 2.604167vw, 50px) 0; background: #f7f5f2;}
.bobo-index-tit {text-align: center;}
.bobo-index-tit h3 {margin-bottom: 20px; font-size: clamp(24px, 1.88vw, 36px); position: relative; padding-bottom: 10px;}
.bobo-index-tit h3::after {content: ""; width: 35px; height: 2px; background: var(--color-primary); position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);}
.bobo-index-tit p {margin: 35px 0 0; font-size: 20px; line-height: 1.8;}
.solutions-grid {position: relative; display: grid; grid-template-columns: repeat(6, 1fr); gap: 0; padding-top: 46px;}
.solutions-grid::before {position: absolute; top: 20px; right: 0; left: 0; height: 1px; background: #c8a96e; content: "";}
.solution-item {position: relative; min-width: 0; padding: 0 0.35rem; text-align: center; transition: transform 0.3s ease;}
.solution-item::before {position: absolute; z-index: 1; top: -33px; left: 50%; width: 15px; height: 15px; background: #c8a96e; content: ""; transform: translateX(-50%) rotate(45deg);}
.solution-item:hover {transform: translateY(-0.2rem);}
.solution-icon {position: relative; display: flex; width: 40px; height: 40px; align-items: center; justify-content: center; border-radius: 50%; margin: 0 auto 0.55rem; background: transparent;}
.solution-icon img {width: 100%; object-fit: contain;}
.solution-item h5 { font-size: clamp(14px, 0.94vw, 17px); font-weight: 500;}
.solution-item p { margin-top: 10px;}

@media screen and (max-width: 992px) {
  .solutions-grid {grid-template-columns: repeat(3, 1fr); row-gap: 50px;}
}

@media (max-width: 575px) {
  .solutions-grid {grid-template-columns: repeat(2, 1fr);}
}