/* ===================================================================
   PC ONLY — Grid items: yellow side bars normally, red side bars & border when active
   =================================================================== */
@media (min-width: 768px){
  /* 모든 항목: 기본 노란 세로줄 */
  html body #profile .about-text .ask-list.grid li {
    position: relative;
    overflow: hidden;
    border: 2px solid #e7e7e7;
    border-radius: 10px;
  }
  html body #profile .about-text .ask-list.grid li::before,
  html body #profile .about-text .ask-list.grid li::after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 4px !important;
    background: #ffcc00 !important;  /* 기본 노란색 */
    pointer-events: none !important;
  }
  html body #profile .about-text .ask-list.grid li::before {
    left: 0 !important;
    border-top-left-radius: 10px !important;
    border-bottom-left-radius: 10px !important;
  }
  html body #profile .about-text .ask-list.grid li::after {
    right: 0 !important;
    border-top-right-radius: 10px !important;
    border-bottom-right-radius: 10px !important;
  }

  /* 활성화 항목: 테두리 + 세로줄 모두 빨간색 */
  html body #profile .about-text .ask-list.grid li.is-active {
    border-color: #e53935 !important;
  }
  html body #profile .about-text .ask-list.grid li.is-active::before,
  html body #profile .about-text .ask-list.grid li.is-active::after {
    background: #e53935 !important;
  }
}