/*
 * RESULTS photo-background variant, 2026-08-19.
 * Keeps the approved copy and generated DOM, but moves the heading above a larger 2x2 card grid.
 */

section[data-sec="07 RESULT 導入成果"].results-reference{
  background-color:#082d58!important;
  background-image:
    linear-gradient(180deg,rgba(4,25,52,.78) 0%,rgba(5,36,72,.58) 34%,rgba(5,31,63,.66) 100%),
    linear-gradient(90deg,rgba(2,28,59,.30),rgba(2,28,59,.08) 58%,rgba(2,28,59,.28)),
    url("results-background-reuse-counter-20260819.png")!important;
  background-position:center center!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
  background-attachment:fixed!important;
}

section[data-sec="07 RESULT 導入成果"].results-reference::before,
section[data-sec="07 RESULT 導入成果"].results-reference::after{
  content:none!important;
  display:none!important;
}

section[data-sec="07 RESULT 導入成果"].results-reference .rr-photo,
section[data-sec="07 RESULT 導入成果"].results-reference .rr-product-logo{
  display:none!important;
}

@media (min-width:769px){
  section[data-sec="07 RESULT 導入成果"].results-reference .rr-shell{
    position:relative;
    left:50%;
    width:1220px;
    max-width:none;
    min-height:0;
    margin:0 0 0 -610px;
    padding:118px 0 112px;
  }

  section[data-sec="07 RESULT 導入成果"].results-reference .rr-main{
    display:block;
    min-height:0;
  }

  section[data-sec="07 RESULT 導入成果"].results-reference .rr-left{
    width:100%;
    max-width:760px;
    margin:0 0 58px;
    padding:0;
  }

  section[data-sec="07 RESULT 導入成果"].results-reference .rr-kicker{
    margin:0 0 18px!important;
    color:#9fddff!important;
    text-shadow:0 2px 18px rgba(0,18,43,.36);
  }

  section[data-sec="07 RESULT 導入成果"].results-reference .rr-kicker::before{
    background:linear-gradient(90deg,#fff,#8ed8ff)!important;
  }

  section[data-sec="07 RESULT 導入成果"].results-reference .rr-title{
    max-width:760px;
    color:#fff!important;
    font-size:58px!important;
    line-height:1.28!important;
    letter-spacing:.03em!important;
    text-shadow:0 3px 24px rgba(0,17,43,.44)!important;
  }

  section[data-sec="07 RESULT 導入成果"].results-reference .rr-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:30px 32px;
  }

  section[data-sec="07 RESULT 導入成果"].results-reference .rr-card{
    min-height:410px;
    padding:30px 42px 36px;
    border-color:#d4e4f1;
    border-radius:15px;
    background:linear-gradient(145deg,#fff 0%,#f5faff 100%)!important;
    box-shadow:0 22px 54px -28px rgba(0,21,52,.52);
    opacity:1;
  }

  section[data-sec="07 RESULT 導入成果"].results-reference .rr-number{
    width:88px;
    height:72px;
    padding:10px 0 0 13px;
    font-size:36px;
  }

  section[data-sec="07 RESULT 導入成果"].results-reference .rr-icon{
    width:92px;
    height:92px;
    margin-bottom:8px;
  }

  section[data-sec="07 RESULT 導入成果"].results-reference .rr-label{
    margin-bottom:17px;
    padding:5px 20px 6px;
    font-size:16px;
  }

  section[data-sec="07 RESULT 導入成果"].results-reference .rr-kick{
    margin-bottom:15px;
    font-size:16px;
    line-height:1.65;
  }

  section[data-sec="07 RESULT 導入成果"].results-reference .rr-card h3{
    margin-bottom:14px;
    font-size:22px;
    line-height:1.55;
  }

  section[data-sec="07 RESULT 導入成果"].results-reference .rr-body{
    font-size:15px;
    line-height:1.8;
  }

  section[data-sec="07 RESULT 導入成果"].results-reference .rr-bottom{
    min-height:214px;
    margin-top:44px;
    background:linear-gradient(100deg,#fff 0%,#edf7ff 100%);
    box-shadow:0 20px 48px -28px rgba(0,21,52,.42);
  }
}

@media (max-width:768px){
  section[data-sec="07 RESULT 導入成果"].results-reference{
    background-color:#082d58!important;
    background-position:64% top!important;
    background-size:auto 760px!important;
    background-repeat:no-repeat!important;
    background-attachment:scroll!important;
  }

  section[data-sec="07 RESULT 導入成果"].results-reference .rr-shell{
    position:relative;
    left:auto;
    width:calc(100% - 40px);
    max-width:none;
    min-height:0;
    margin:0 auto;
    padding:84px 0 76px;
  }

  section[data-sec="07 RESULT 導入成果"].results-reference .rr-main{
    display:block;
    min-height:0;
  }

  section[data-sec="07 RESULT 導入成果"].results-reference .rr-left{
    width:100%;
    margin:0 0 38px;
    padding:0;
  }

  section[data-sec="07 RESULT 導入成果"].results-reference .rr-kicker{
    margin-bottom:16px!important;
    color:#a9e2ff!important;
    font-size:12px!important;
  }

  section[data-sec="07 RESULT 導入成果"].results-reference .rr-kicker::before{
    background:linear-gradient(90deg,#fff,#8ed8ff)!important;
  }

  section[data-sec="07 RESULT 導入成果"].results-reference .rr-title{
    max-width:none;
    color:#fff!important;
    font-size:36px!important;
    line-height:1.35!important;
    text-shadow:0 3px 20px rgba(0,17,43,.48)!important;
  }

  section[data-sec="07 RESULT 導入成果"].results-reference .rr-grid{
    grid-template-columns:1fr;
    gap:18px;
  }

  section[data-sec="07 RESULT 導入成果"].results-reference .rr-card{
    min-height:0;
    padding:28px 24px 31px;
    border-radius:10px;
    background:linear-gradient(145deg,#fff 0%,#f5faff 100%)!important;
    opacity:1;
  }

  section[data-sec="07 RESULT 導入成果"].results-reference .rr-number{font-size:30px}
  section[data-sec="07 RESULT 導入成果"].results-reference .rr-icon{width:82px;height:82px}
  section[data-sec="07 RESULT 導入成果"].results-reference .rr-label{font-size:15px}
  section[data-sec="07 RESULT 導入成果"].results-reference .rr-kick{font-size:15px}
  section[data-sec="07 RESULT 導入成果"].results-reference .rr-card h3{font-size:20px}
  section[data-sec="07 RESULT 導入成果"].results-reference .rr-body{font-size:14.5px;line-height:1.82}

  section[data-sec="07 RESULT 導入成果"].results-reference .rr-bottom{
    margin-top:22px;
    background:linear-gradient(100deg,#fff 0%,#edf7ff 100%);
  }
}

@media (prefers-reduced-motion:reduce){
  section[data-sec="07 RESULT 導入成果"].results-reference{
    background-attachment:scroll!important;
  }
}
