@charset "UTF-8";

/*
	Theme Name: TORIKIME
	Description: TORIKIME
	Theme URI: http://www.sofutemu.co.jp/
	Author: Hisataka Ohtake
	Author URI: http://www.sofutemu.co.jp/
	Version: 1.0.1
	License: GNU General Public License
	License URI: http://www.gnu.org/licenses/gpl-2.0.html
	Tags: white, right-sidebar, two-columns

*/



/****************************************

          Layout

*****************************************/




div.blog_main {
    box-sizing: border-box ;
    margin-right : 150px ;
    float : right ;
    width : 600px ;
    max-width : 100% ;
}

@media screen and (max-width: 768px) {
    div.blog_main {
        margin-right : 0 ;
        float : none ;
        width : 100% ;
    }

    div.sidebar {
        float : none ;
        width : 100% ;
    }
}

p {
    margin : 0px 0px 0px 0px ;
    font-size : 12px ;
    line-height : 28px ;
    text-align : left ;
}


/****************************************

          Main

*****************************************/

div.blog_main h2 {
    margin : 20px 0px 70px 0px ;
    padding : 0px 0px 0px 0px ;
    text-align : center ;
    width : 500px ;
}

div.blog_main h3 {
    margin : 5px 0px 35px 0px ;
    padding : 0px 0px 0px 0px ;
    width : 100% ;
    text-align : left ;
}

div.blog_main h3 a {
    color : #000000 ;
    font-size : 16px ;
    line-height : 16px ;
    font-weight : bold ;
    text-decoration : none ;
}

div.blog_main .post {
    overflow : hidden ;
    margin-bottom : 70px ;
    padding-bottom : 50px ;
}




.post-meta{
    margin : 10px 0px 0px 0px ;
    padding : 0px ;
    color : #777777 ;
    font-size : 12px ;
    line-height : 12px ;
    width : 500px ;
    text-align : left ;
}
	.post-meta .post-date,
	.post-meta .category{
    font-family : 'Special Elite', cursive ;
	}
	.comment-num{ white-space: nowrap; }

p a.more-link {
        line-height : 18px ;
	float : right ;
        color : #363636 ;
        font-weight : bold ;
        text-decoration : none ;
}



.footer-post-meta{
	margin-top: 40px;
	text-align: right;
}
	.post-author{ padding-left: 1em; }

.page-link{
	margin: 3em 0;
}


/****************************************

          Sidebar

*****************************************/

div.sidebar {
    width : 150px ;
    float : left ;
}

div.sidebar a {
    font-size : 12px ;
    text-decoration : none ;
}

div.sidebar p {
    margin : 0px 0px 10px 0px ;
    padding : 0px 0px 0px 0px ;
    font-size : 12px ;
    line-height : 12px ;
    text-align : left ;
}

div.sidebar p a{
    color : ##2c416c ;
    font-weight : bold ;
}


/****************************************

          Common (旧 common.css を統合)

*****************************************/

*{
    margin : 0px ;
    padding : 0px ;
    border : none ;
    color : #000000 ;
    font-family: 'Noto Sans Japanese', sans-serif;
    font-weight : normal ;
    font-style : normal ;
}
html {
    font-size: 100%;
}

body {
    background-color: #ffffff ;
    -webkit-text-size-adjust : none ;
}

a {
    color: #006400 ;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

img {
    max-width: 100% ;
    height: auto ;
}

ul {
    list-style : none ;
}

p {
    margin : 0px auto 30px auto ;
    font-size : clamp(14px, 2vw, 18px);
    line-height: clamp(1.4, 3vw, 1.8);
}



p {
    margin : 0px auto 30px auto ;
    font-size: 16px; /* デフォルトのフォントサイズ */
    line-height: 32px;
}




wrapper {
    margin: 0px;
    width: 100% ;
    height : auto ;
    position : relative ;
}


header {
    margin : 0px auto 0px auto ;
    font-size : 15px ;
    line-height : 28px ;
    width: 100% ;
    position : relative ;
    background-color: #ffffff ;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06);
}

div.hd_bg {
    width: 100% ;
}

div.hd_inner {
    box-sizing: border-box ;
    margin: 0 auto ;
    padding: 14px 20px ;
    max-width: 1200px ;
    width: 100% ;
    display: flex ;
    align-items: center ;
    gap: 24px ;
}

h1 {
    margin : 0px ;
    font-size : 15px ;
    line-height : 1.5 ;
    font-weight: bold ;
    text-align: left ;
    color: #006400 ;
}

header div.hd_bg p.logo {
    flex: 0 0 auto ;
    width : 180px ;
    margin: 0 ;
}

div.hd_txt {
    flex: 1 1 auto ;
    min-width: 0 ;
}

header div.hd_bg p.sub-txt {
    margin: 4px 0px 0px 0px ;
    font-size : clamp(11px, 1.4vw, 13px) ;
    line-height : 1.5 ;
}

.hd_icons {
    flex: 0 0 auto ;
    display: flex ;
    align-items: center ;
    gap: 16px ;
}

header div.hd_bg p.pamph_icon,
header div.hd_bg p.spec_icon,
header div.hd_bg p.contact_icon {
    margin: 0 ;
}

header div.hd_bg p.pamph_icon img { width: 64px ; }
header div.hd_bg p.spec_icon img { width: 44px ; }
header div.hd_bg p.contact_icon img { width: 64px ; }

/* ハンバーガーメニューボタン
-------------------------------------*/
.hamburger {
    flex: 0 0 auto ;
    margin-left: auto ;
    width: 44px ;
    height: 44px ;
    background: none ;
    cursor: pointer ;
    position: relative ;
    z-index: 210 ;
    display: flex ;
    flex-direction: column ;
    align-items: center ;
    justify-content: center ;
    gap: 6px ;
    -webkit-tap-highlight-color: transparent ;
}

.hamburger span {
    display: block ;
    width: 26px ;
    height: 2px ;
    border-radius: 2px ;
    background-color: #006400 ;
    transition: transform 0.25s ease, opacity 0.25s ease ;
}

body.nav-open .hamburger span:nth-child(1) {
    transform: translateY(8px) rotate(45deg) ;
}
body.nav-open .hamburger span:nth-child(2) {
    opacity: 0 ;
}
body.nav-open .hamburger span:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg) ;
}

/* オーバーレイ（モバイルメニュー背景）
-------------------------------------*/
.nav-overlay {
    display: none ;
    position: fixed ;
    inset: 0 ;
    background-color: rgba(0, 0, 0, 0.45) ;
    z-index: 190 ;
    opacity: 0 ;
    visibility: hidden ;
    transition: opacity 0.25s ease ;
}

body.nav-open .nav-overlay {
    display: block ;
    opacity: 1 ;
    visibility: visible ;
}

div.nav_wrap {
    background-color: #ffffff;
    border-bottom: dotted 1px #dddddd;
    overflow : visible;
    z-index: 100 ;
}

nav {
    margin : 0px auto 0px auto ;
    width : 100% ;
    background-color: #006400 ;
    position : relative ;
    top : 0px ;
    right : 0px ;
}

nav ul {
    margin : 0 auto ;
    padding: 0 20px ;
    max-width: 1200px ;
    display: flex ;
    flex-wrap: wrap ;
    justify-content: center ;
}

nav li {
    margin : 0px ;
    padding : 13px 20px ;
}

nav li a {
    color: #ffffff ;
    font-size: 14px ;
    line-height: 14px ;
    white-space: nowrap ;
}

nav ul li a:hover {
    text-decoration: none;
}

/* スマホ表示：オフキャンバス化
-------------------------------------*/
@media screen and (max-width: 768px) {
    div.hd_inner {
        padding: 10px 16px ;
    }

    header div.hd_bg p.logo {
        width: 150px ;
    }

    div.nav_wrap {
        border-bottom: none ;
        position: static ;
    }

    nav {
        position: fixed ;
        top: 0 ;
        right: 0 ;
        height: 100% ;
        width: min(78vw, 320px) ;
        max-width: none ;
        background-color: #ffffff ;
        box-shadow: -4px 0 24px rgba(0, 0, 0, 0.15) ;
        transform: translateX(100%) ;
        transition: transform 0.3s ease ;
        overflow-y: auto ;
        z-index: 200 ;
        padding-top: 70px ;
    }

    body.nav-open nav {
        transform: translateX(0) ;
    }

    nav ul {
        display: block ;
        padding: 0 ;
    }

    nav li {
        padding: 0 ;
        border-bottom: 1px solid rgba(0, 0, 0, 0.08) ;
    }

    nav li a {
        display: block ;
        padding: 16px 24px ;
        color: #006400 ;
        font-size: 15px ;
        font-weight: bold ;
    }

    body.nav-open {
        overflow: hidden ;
    }
}

div.breadcrumbs {
    margin: 5px auto 5px auto;
    padding: 0px;
    width: 90%;
    font-size: 11px;
    line-height: 15px ;
}



p.toptxt {
    margin : 0px auto 50px auto ;
    padding: 0 20px ;
    box-sizing: border-box ;
    font-size : 15px ;
    line-height : 28px ;
    max-width: 800px ;
    width: 100% ;
}

div.head-txt {
    margin : 5px auto 0px auto ;
    width: 100% ;
    background-color: #ffffff ;
}

div.head-txt h1 {
    margin : 0px auto 0px auto ;
    width: 900px ;
    font-size : 14px ;
    line-height : 24px ;
    text-align: left ;
    color: #999999 ;
}

div.header {
    margin : 0px auto 0px auto ;
    width : 900px ;
    height : 115px ;
    position : relative ;
}

div.header h1 {
    width : 203px ;
    height : 75px ;
    top : 20px ;
    left : 0px ;
    position : absolute ;
}

div.header  p.logo {
    width : 203px ;
    height : 75px ;
    top : 20px ;
    left : 0px ;
    position : absolute ;
}
div.header p.h-txt {
    width: 300px ;
    height: 48px ;
    font-size : 12px ;
    line-height : 18px ;
    top: 25px ;
    left: 225px ;
    position: absolute ;
}

div.header p.pamph_icon {
    width : 72px ;
    height : 50px ;
    top : 30px ;
    right : 170px ;
    position : absolute ;
}

div.header p.spec_icon {
    width : 48px ;
    height : 50px ;
    top : 30px ;
    right : 102px ;
    position : absolute ;
}

div.header p.contact_icon {
    width : 72px ;
    height : 50px ;
    top : 30px ;
    right : 10px ;
    position : absolute ;
}

div.header_menu_wrap {
    height : 48px ;
    background-color: #006400 ;
}

div.header_menu,
div.bottom_menu {
    margin : 0px auto 0px auto ;
    padding : 17px 0px 17px 0px ;
    width : 100% ;
    height : 14px ;
    position : relative ;
    overflow : hidden ;
}

div.header_menu ul,
div.bottom_menu ul {
    position : relative ;
    height : 30px ;
    left : 50% ;
    float : left ;
}

div.header_menu ul li,
div.bottom_menu ul li {
    margin : 0px 0px 0px 0px ;
    padding : 0px 20px 0px 20px ;
    border-right: 1px solid #ffffff ;
    position : relative ;
    left : -50% ;
    float : left ;
}

div.header_menu ul li,
div.header_menu ul li a {
    color: #ffffff ;
    font-size: 14px ;
    line-height: 14px ;
}

div.header_menu ul li a:hover {
    text-decoration: none;
}

div.header_menu ul li.end,
div.bottom_menu ul li.end {
    border-right: none ;
}



div.body_wrap {
    margin: 0px 0px 15px 0px ;
    width: 100% ;
    height: 100% ;
}

div.body {
    box-sizing: border-box ;
    margin : 0px auto 100px auto ;
    padding : 0px 20px ;
    max-width : 1000px;
    width : 100% ;
}

div.body h2 {
    margin : 90px auto 50px auto ;
    text-align : center ;
    font-size : 30px ;
    width : 100% ;
}

h3 {
    margin : 0px auto 15px auto ;
    width : 100% ;
    font-size : 18px ;
    line-height : 18px ;
    text-align : center ;
    font-weight : bold ;
}

h3.mt50 { margin-top : 50px ; }

div.body h4 {
    margin : 40px auto 10px auto ;
    color: #006400 ;
    font-size : 18px ;
    line-height : 18px ;
    text-align : center ;
}


/* トップページ本文レイアウト
-------------------------------------*/
.lead-section {
    margin: 0 auto 40px auto ;
    padding: 30px 20px ;
    max-width: 700px ;
    text-align: center ;
}

.lead-tag {
    display: inline-block ;
    margin: 0 auto 16px auto ;
    padding: 6px 18px ;
    background-color: #f0f7f0 ;
    color: #006400 ;
    border-radius: 20px ;
    font-size: 13px ;
    font-weight: bold ;
}

.lead-title {
    margin: 0 auto 20px auto ;
    font-size: clamp(24px, 5vw, 34px) ;
    line-height: 1.4 ;
    font-weight: bold ;
    color: #006400 ;
}

.voice-block {
    box-sizing: border-box ;
    margin: 0 auto 30px auto ;
    padding: 24px 30px ;
    max-width: 600px ;
    background-color: #f5f5f5 ;
    border-left: 4px solid #006400 ;
    text-align: left ;
}

.voice-block p {
    margin: 0 0 8px 0 ;
    font-size: 15px ;
    color: #444444 ;
}

.voice-block p:last-child {
    margin-bottom: 0 ;
}

.spec-highlight {
    box-sizing: border-box ;
    margin: 0 auto 20px auto ;
    padding: 20px 30px ;
    max-width: 500px ;
    background-color: #f0f7f0 ;
    border: 1px solid #006400 ;
    border-radius: 6px ;
    text-align: center ;
}

.spec-highlight p {
    margin: 0 ;
    font-size: 17px ;
    font-weight: bold ;
    color: #006400 ;
    line-height: 1.8 ;
}

.feature-grid {
    display: flex ;
    flex-wrap: wrap ;
    gap: 24px ;
    margin: 30px 0 ;
}

.feature-card {
    box-sizing: border-box ;
    flex: 1 1 260px ;
    padding: 24px ;
    background-color: #f5f5f5 ;
    border-radius: 6px ;
}

.feature-card-icon {
    margin: 0 0 12px 0 ;
    font-size: 32px ;
    line-height: 1 ;
    text-align: left ;
}

.feature-card h3 {
    margin: 0 0 12px 0 ;
    text-align: left ;
    color: #006400 ;
}

.feature-card p {
    margin: 0 ;
    font-size: 14px ;
    line-height: 1.8 ;
    text-align: left ;
}

.check-list {
    margin: 0 ;
    padding: 0 ;
    list-style: none ;
    text-align: left ;
}

.check-list li {
    position: relative ;
    margin: 0 0 8px 0 ;
    padding-left: 24px ;
    font-size: 14px ;
    line-height: 1.7 ;
}

.check-list li:last-child {
    margin-bottom: 0 ;
}

.check-list li::before {
    content: "$2713" ;
    position: absolute ;
    left: 0 ;
    top: 0 ;
    color: #006400 ;
    font-weight: bold ;
}

.feature-grid-3 .feature-card {
    text-align: center ;
}

.feature-grid-3 .feature-card-icon,
.feature-grid-3 .feature-card h3 {
    text-align: center ;
}

.feature-grid-3 .feature-card p {
    text-align: center ;
}

p.note {
    font-size: 13px ;
    color: #777777 ;
    text-align: center ;
}

p.btn-link-wrap {
    text-align: center ;
    margin: 30px auto ;
}

.btn-link {
    display: inline-block ;
    padding: 12px 32px ;
    border: 2px solid #006400 ;
    border-radius: 4px ;
    color: #006400 ;
    font-weight: bold ;
    font-size: 15px ;
    text-decoration: none ;
}

.btn-link:hover {
    background-color: #006400 ;
    color: #ffffff ;
    text-decoration: none ;
}

.btn-primary-lg {
    display: inline-block ;
    padding: 16px 48px ;
    background-color: #006400 ;
    color: #ffffff ;
    border-radius: 4px ;
    font-weight: bold ;
    font-size: 16px ;
    text-decoration: none ;
}

.btn-primary-lg:hover {
    opacity: 0.85 ;
    text-decoration: none ;
}

.cta-buttons {
    display: flex ;
    flex-wrap: wrap ;
    justify-content: center ;
    gap: 16px ;
    margin: 30px auto ;
}

.cta-buttons .btn-primary {
    display: inline-block ;
    padding: 16px 36px ;
    background-color: #006400 ;
    color: #ffffff ;
    border-radius: 4px ;
    font-weight: bold ;
    font-size: 15px ;
    text-decoration: none ;
    text-align: center ;
}

.cta-buttons .btn-primary:hover {
    opacity: 0.85 ;
    text-decoration: none ;
}






@media (max-width: 600px) {
  p {
    font-size: 14px; /* スマートフォンなどの小さなデバイス用 */
    line-height: 28px;
  }

  div.body h2 {
    font-size : 24px ;
  }

  div.body h3 {
    font-size : 16px ;
  }
}

@media (min-width: 601px) and (max-width: 900px) {
  p {
    font-size: 15px; /* タブレットなどの中間サイズのデバイス用 */
    line-height: 30px;
  }

  div.body h2 {
    font-size : 26px ;
  }

  div.body h3 {
    font-size : 18px ;
  }
}









div.screen-bg {
    box-sizing: border-box ;
    margin : 50px auto 50px auto ;
    padding: 50px 20px ;
    background-color: #dddddd ;
    max-width: 1000px ;
    width: 100% ;
}

div.screen-bg div.screen {
    box-sizing: border-box ;
    margin : 0px auto 0px auto ;
    padding: 15px 15px 15px 15px ;
    border: 1px solid #999999 ;
    background-color: #ffffff ;
    max-width: 600px ;
    width: 100% ;
}



p.contact {
    box-sizing: border-box ;
    margin : 40px auto 40px auto;
    padding : 20px clamp(16px, 6vw, 100px);
    border: 5px solid #dddddd;
    font-size: clamp(16px, 4vw, 24px);
    line-height: 1.6;
    text-align: left;
    max-width : 690px ;
    width: 100% ;
}

p.contact > small {
    font-size: 16px;
}

footer {
    border-top: 1px solid #dddddd;
    width : 100% ;
    height: auto ;
    background-color: #f5f5f5 ;
}

.footer-cta {
    box-sizing: border-box ;
    margin: 0 auto ;
    padding: 40px 20px 100px 20px ;
    max-width: 900px ;
    width: 100% ;
    display: flex ;
    justify-content: center ;
}

.footer-cta-inner {
    display: inline-flex ;
    flex-direction: column ;
    align-items: flex-start ;
}

.footer-cta-txt {
    margin: 0 0 16px 0 ;
    font-size: 15px ;
    color: #333333 ;
}

.footer-cta-btn {
    box-sizing: border-box ;
    display: block ;
    width: 100% ;
    padding: 26px 120px ;
    background-color: #ba8961 ;
    color: #ffffff ;
    border-radius: 4px ;
    font-weight: bold ;
    font-size: 15px ;
    text-align: center ;
    text-decoration: none ;
}

.footer-cta-btn:hover {
    opacity: 0.85 ;
    text-decoration: none ;
}

div.bottom-menu {
    box-sizing: border-box ;
    margin : 0px auto 0px auto ;
    padding : 30px 20px 50px 20px ;
    max-width : 900px ;
    width: 100% ;
    display: flex ;
    flex-wrap: wrap ;
    gap: 20px ;
}

div.bottom-menu ul {
    margin : 0px;
    width: 160px ;
    font-size: 0.8em ;
    line-height: 1.8em ;
}

div.bottom-menu ul li,
div.bottom-menu ul li a {
    color: #666666 ;
}

div.bottom-menu ul li.ttl {
    margin: 0px 0px 5px 0px ;
}

div.bottom-menu ul li.ttl,
div.bottom-menu ul li.ttl a {
    color: #000000 ;
}

div.bottom-menu ul li.ttl2 {
    margin : 24px 0px 0px 0px ;
}

div.footer-info-wrap {
    border-top: 1px solid #dddddd;
    width: 100% ;
}

div.footer-info {
    box-sizing: border-box ;
    margin: 30px auto;
    padding: 0 20px ;
    max-width: 900px ;
    width: 100% ;
    display: flex ;
    flex-wrap: wrap ;
    gap: 30px 80px ;
}

div.footer-info > div.co {
    margin-right: 0 ;
}

div.footer-info > div.co > p {
    font-size: 0.8em;
    line-height: 1.6em;
}

div.footer-info > div.co > p > a{
    color: #000000;
}

div.footer-info > div.co > h5 {
    margin : 0px 0px 10px 0px ;
    padding : 0px 0px 0px 0px ;
    font-size: 0.8em;
}


address {
    padding-bottom: 10px;
    width : 100% ;
    font-size: 0.7em;
    text-align: center ;
    background-color: #f5f5f5 ;
}


iframe {
    margin: 25px auto 25px auto ;
}

table {
    margin: 5px auto 0px auto ;
    padding:0px;
    width: 100%;
    font-size: 15px;
    line-height:25px;
    border: 1px #666666 solid;
    border-collapse: collapse;
    border-spacing: 0;
}

table th {
    padding: 5px 15px 5px 15px;
    border: 1px #666666 solid;
    border-width: 0 0 1px 1px;
    background: #dddddd ;
    text-align: center ;
}

table th.id1 {
    width: 40%;
    background: #98fb98 ;
}

table th.id2 {
    width: 40%;
    background: #f0e68c ;
}

table td {
    padding: 5px 15px 5px 15px;
    border: 1px #666666 solid;
    border-width: 0 0 1px 1px;
    text-align: left;
}

.ctr {
    width: 40%;
    text-align: center ;
}

.ctr2 {
    width: 25%;
    text-align: center ;
}

table td.bg {
    background: #f5f5f5;
    text-align : left ;
    width : 120px ;
}

table td.bg2 {
    background: #dddddd;
    text-align : center ;
}

table td.lf {
    text-align : left ;
}

table td small {
    font-size : 11px ;
    line-height : 20px ;
}


.underline {
    background: linear-gradient(transparent 90%, #ff99ab 90%);
}

.mt10 { margin-top : 10px ; }
.mt15 { margin-top : 15px ; }
.mt20 { margin-top : 20px ; }
.mt25 { margin-top : 25px ; }
.mt30 { margin-top : 30px ; }
.mt35 { margin-top : 35px ; }
.mt40 { margin-top : 40px ; }
.mt45 { margin-top : 45px ; }
.mt50 { margin-top : 50px ; }
.mt55 { margin-top : 55px ; }
.mt60 { margin-top : 60px ; }
.mt65 { margin-top : 65px ; }
.mt70 { margin-top : 70px ; }
.mt75 { margin-top : 75px ; }
.mt80 { margin-top : 80px ; }
.mt85 { margin-top : 85px ; }
.mt90 { margin-top : 90px ; }
.mt95 { margin-top : 95px ; }



.sticky {
    position: -webkit-sticky; /* safari対応 */
    position: sticky;
    top: 0px;　/* 上端から0pxのところで固定 */
}



ol {
    list-style-type: none;
}

ol li {
    margin: 0px 0px 30px 0px ;
}

table.flow {
    margin: 0px ;
    padding:0px;
    width: 100% ;
    font-size: 85% ;
    line-height: 180% ;
    border: 1px #000000 solid;
    border-collapse: collapse;
    border-spacing: 0;
}

table.flow th {
    box-sizing: border-box ;
    padding: 15px 25px 15px 25px;
    vertical-align: middle;
    border: 1px #000000 solid ;
    border-width: 0 0 1px 1px ;
    background-color: #000000 ;
    width: 30% ;
    color: #ffffff ;
    text-align: left ;
}

table.flow td {
    padding: 15px 25px 15px 25px;
    vertical-align: top ;
    border: 1px #000000 solid;
    border-width: 0 0 1px 1px;
    text-align: left ;
}





div.screen-wrap {
    box-sizing: border-box ;
    margin: 0 auto ;
    padding: 0 20px ;
    max-width: 900px ;
    width: 100% ;
    display: flex ;
    flex-wrap: wrap ;
}

div.screen-box {
    box-sizing: border-box ;
    padding: 24px 24px 24px 24px ;
    background-color: #ffffff ;
    width: 252px ;
    max-width: 100% ;
    height: auto ;
}

div.screen-box h3 {
    margin : 10px 0px 5px 0px ;
    width: 100% ;
    font-size: 15px ;
}

div.screen-box p a img{
    border: 1px solid #999999 ;
    width: 100% ;
    max-width: 250px ;
}

div.screen-box p {
    width: 100% ;
    font-size: 12px ;
    line-height: 18px ;
}




/* フローティングバナーのラップ要素 */
#fixed_right_banner
{
    /* 右端の上から20pxの位置に固定表示 */
    position: fixed;
    bottom: 200px;
    left: 0;
}

/* 画像の共通設定 */
#fixed_right_banner > *
{
    /* 横幅 */
    width: 250px;
}

/* 2個目以降の画像の上部に余白を作る */
#fixed_right_banner > * ~ * { margin-top: 10px; }

/* リンク要素 */
#fixed_right_banner > a
{
    /* ブロック要素に変更 */
    display: block;

    /* 透過変更をスムーズにする(任意) */
   -webkit-transition: opacity .2s ease;
   transition: opacity .2s ease;
}

/* マウスオーバー時の表現 */
#fixed_right_banner > a:hover
{
    /* 20%透過させる */
    opacity: .8;
}

/* コンテンツに被らないようにするメディアクエリ */
@media (max-width: 1155px)
{
    #fixed_right_banner { display: none; }
}



/* スマホ　767px以下 */
@media only screen and (max-width: 767px) {


	table.flow {
		border: none;
		font-size: 0.8em ;
	}

	table.flow th,
	table.flow td {
		border-width: 1px 1px 1px 1px;
		display: block ;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}

	table.flow th {
		padding: 0px 0x 0px 0px ;
		width: 100%;
		line-height: 0.8em ;
	}

	table.flow td {
		line-height: 1.5em ;
	}
}





/* PC
-------------------------------------*/
@media screen and (min-width: 769px) {
    .cm-spOnly {
        display: none;
    }
}

/* SP
-------------------------------------*/
@media screen and (max-width: 768px) {
    .cm-pcOnly {
        display: none;
    }
}


.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
.clearfix {
    display: inline-block;
}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */


/* Contact Form 7
   全要素リセット(*{border:none})で消えた枠線を復活
-------------------------------------*/
.contact-form .required {
    color: #a81c28 ;
}

/* CF7標準CSSが読み込まれていないため、スクリーンリーダー専用テキストが
   画面上に見えてしまう問題を修正(視覚的には非表示、読み上げには残す) */
.screen-reader-response {
    position: absolute ;
    overflow: hidden ;
    clip: rect(1px, 1px, 1px, 1px) ;
    clip-path: inset(50%) ;
    height: 1px ;
    width: 1px ;
    margin: -1px ;
    padding: 0 ;
    word-wrap: normal !important ;
}

/* 送信結果メッセージ(入力内容に問題があります等)をフォーム先頭に表示 */
.wpcf7-form {
    display: flex ;
    flex-direction: column ;
}

.wpcf7-form .wpcf7-response-output {
    order: -1 ;
    scroll-margin-top: 140px ;
}

.wpcf7-form.invalid .wpcf7-response-output,
.wpcf7-form.failed .wpcf7-response-output,
.wpcf7-form.spam .wpcf7-response-output,
.wpcf7-form.aborted .wpcf7-response-output {
    color: #a81c28 ;
}

.wpcf7-form-control.wpcf7-text,
.wpcf7-form-control.wpcf7-textarea,
.wpcf7-form-control.wpcf7-select {
    box-sizing: border-box ;
    width: 100% ;
    padding: 10px 12px ;
    border: 1px solid #cccccc ;
    border-radius: 4px ;
    font-size: 15px ;
    background-color: #ffffff ;
}

.wpcf7-form-control.wpcf7-textarea {
    resize: vertical ;
}

.wpcf7-form-control.wpcf7-text:focus,
.wpcf7-form-control.wpcf7-textarea:focus,
.wpcf7-form-control.wpcf7-select:focus {
    border-color: #006400 ;
    outline: none ;
}

.wpcf7-form-control.wpcf7-checkbox,
.wpcf7-form-control.wpcf7-radio {
    box-sizing: border-box ;
    display: block ;
    width: 100% ;
    padding: 10px 12px ;
    border: 1px solid #cccccc ;
    border-radius: 4px ;
    background-color: #ffffff ;
}

.wpcf7-list-item {
    margin: 0 16px 4px 0 ;
    display: inline-block ;
}

.wpcf7-list-item input[type="checkbox"],
.wpcf7-list-item input[type="radio"] {
    margin-right: 4px ;
}

.wpcf7-form-control.wpcf7-submit {
    box-sizing: border-box ;
    padding: 12px 40px ;
    border: 1px solid #006400 ;
    border-radius: 4px ;
    background-color: #006400 ;
    color: #ffffff ;
    font-size: 16px ;
    font-weight: bold ;
    cursor: pointer ;
}

.wpcf7-form-control.wpcf7-submit:hover {
    opacity: 0.85 ;
}

.wpcf7-not-valid-tip {
    color: #cc0000 ;
    font-size: 13px ;
    margin: 4px 0 0 0 ;
}


/****************************************

  TOP PAGE RENEWAL 2026
  Scope: .home-renewal

*****************************************/

.home-renewal {
    --tr-green: #16824b;
    --tr-green-dark: #0b5635;
    --tr-green-deep: #08452b;
    --tr-green-soft: #eff8f3;
    --tr-green-pale: #f7fbf8;
    --tr-line: #dcebe2;
    --tr-text: #26352e;
    --tr-muted: #66736c;
    --tr-white: #ffffff;
    --tr-shadow: 0 20px 55px rgba(18, 72, 45, 0.10);
    overflow: hidden;
    background: #ffffff;
    color: var(--tr-text);
}

.home-renewal *,
.home-renewal *::before,
.home-renewal *::after {
    box-sizing: border-box;
}

.home-renewal .tr-container {
    width: min(1160px, calc(100% - 48px));
    margin: 0 auto;
}

.home-renewal p,
.home-renewal li,
.home-renewal a,
.home-renewal span,
.home-renewal strong,
.home-renewal h1,
.home-renewal h2,
.home-renewal h3 {
    font-family: 'Noto Sans Japanese', 'Noto Sans JP', sans-serif;
}

.home-renewal p {
    margin: 0;
    color: var(--tr-text);
    font-size: 16px;
    line-height: 1.9;
}

.home-renewal h1,
.home-renewal h2,
.home-renewal h3 {
    margin: 0;
    width: auto;
    color: var(--tr-text);
    font-weight: 700;
    text-align: left;
    text-wrap: balance;
    line-break: strict;
}

.home-renewal h2 {
    font-size: clamp(30px, 3.6vw, 42px);
    line-height: 1.38;
    letter-spacing: -0.02em;
}

.home-renewal h3 {
    font-size: 22px;
    line-height: 1.55;
}

/* Hero
-------------------------------------*/
.home-renewal .tr-hero {
    position: relative;
    padding: 84px 0 90px;
    background:
        radial-gradient(circle at 86% 12%, rgba(22, 130, 75, 0.13), transparent 31%),
        linear-gradient(135deg, #ffffff 0%, #f7fbf8 58%, #edf8f1 100%);
}

.home-renewal .tr-hero::after {
    content: "";
    position: absolute;
    right: -120px;
    bottom: -180px;
    width: 420px;
    height: 420px;
    border: 80px solid rgba(22, 130, 75, 0.045);
    border-radius: 50%;
    pointer-events: none;
}

.home-renewal .tr-hero-inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(480px, 1.08fr);
    gap: 64px;
    align-items: center;
}

.home-renewal .tr-eyebrow {
    display: inline-flex;
    align-items: center;
    margin-bottom: 22px;
    padding: 8px 16px;
    border: 1px solid #cce5d6;
    border-radius: 999px;
    background: rgba(255,255,255,0.82);
    color: var(--tr-green-dark);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.4;
}

.home-renewal .tr-hero h1 {
    margin-bottom: 26px;
    color: var(--tr-text);
    font-size: clamp(40px, 5.2vw, 64px);
    line-height: 1.27;
    letter-spacing: -0.035em;
}

.home-renewal .tr-hero h1 span {
    color: var(--tr-green);
    font-weight: 700;
}

.home-renewal .tr-hero-lead {
    max-width: 600px;
    color: #425149;
    font-size: 17px;
    line-height: 1.95;
}

.home-renewal .tr-hero-buttons,
.home-renewal .tr-final-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 32px;
}

.home-renewal .tr-btn {
    display: inline-flex;
    min-height: 54px;
    align-items: center;
    justify-content: center;
    padding: 14px 30px;
    border: 2px solid transparent;
    border-radius: 9px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.5;
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease;
}

.home-renewal .tr-btn:hover {
    transform: translateY(-2px);
    text-decoration: none;
}

.home-renewal .tr-btn-primary {
    background: var(--tr-green);
    color: #ffffff;
    box-shadow: 0 10px 24px rgba(22, 130, 75, 0.22);
}

.home-renewal .tr-btn-primary:hover {
    background: #0f7040;
    color: #ffffff;
}

.home-renewal .tr-btn-secondary {
    border-color: #bcd8c8;
    background: #ffffff;
    color: var(--tr-green-dark);
}

.home-renewal .tr-btn-secondary:hover {
    border-color: var(--tr-green);
    color: var(--tr-green-dark);
    box-shadow: 0 10px 24px rgba(18, 72, 45, 0.08);
}

.home-renewal .tr-hero-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin: 24px 0 0;
    padding: 0;
    list-style: none;
}

.home-renewal .tr-hero-tags li {
    position: relative;
    padding-left: 18px;
    color: #59685f;
    font-size: 13px;
    line-height: 1.5;
}

.home-renewal .tr-hero-tags li::before {
    content: "";
    position: absolute;
    top: 6px;
    left: 2px;
    width: 8px;
    height: 5px;
    border-left: 2px solid var(--tr-green);
    border-bottom: 2px solid var(--tr-green);
    transform: rotate(-45deg);
}

.home-renewal .tr-hero-visual {
    position: relative;
    padding: 28px 0 34px 16px;
}

.home-renewal .tr-app-window {
    overflow: hidden;
    border: 1px solid #d8e4dc;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: var(--tr-shadow);
}

.home-renewal .tr-app-window-hero {
    position: relative;
    z-index: 2;
    transform: rotate(0.5deg);
}

.home-renewal .tr-app-bar {
    display: flex;
    align-items: center;
    gap: 7px;
    min-height: 38px;
    padding: 0 13px;
    border-bottom: 1px solid #e7eee9;
    background: #f7f9f8;
}

.home-renewal .tr-app-bar span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #c7d3cc;
}

.home-renewal .tr-app-bar strong {
    margin-left: 6px;
    color: #6b7970;
    font-size: 11px;
    font-weight: 600;
}

.home-renewal .tr-app-window img {
    display: block;
    width: 100%;
    height: auto;
}

.home-renewal .tr-floating-card {
    position: absolute;
    z-index: 3;
    min-width: 150px;
    padding: 13px 17px;
    border: 1px solid #dbe9e0;
    border-radius: 11px;
    background: rgba(255,255,255,0.96);
    box-shadow: 0 15px 35px rgba(18,72,45,0.13);
}

.home-renewal .tr-floating-card span,
.home-renewal .tr-floating-card strong {
    display: block;
}

.home-renewal .tr-floating-card span {
    margin-bottom: 2px;
    color: var(--tr-muted);
    font-size: 11px;
}

.home-renewal .tr-floating-card strong {
    color: var(--tr-green-dark);
    font-size: 15px;
    font-weight: 700;
}

.home-renewal .tr-floating-card-profit {
    top: 4px;
    right: 24px;
}

.home-renewal .tr-floating-card-share {
    left: -16px;
    bottom: 0;
}

/* Target band
-------------------------------------*/
.home-renewal .tr-target {
    padding: 34px 0 38px;
    border-top: 1px solid #edf2ef;
    border-bottom: 1px solid #e6efe9;
    background: #ffffff;
}

.home-renewal .tr-target-heading {
    display: flex;
    align-items: baseline;
    gap: 18px;
    margin-bottom: 23px;
}

.home-renewal .tr-target-heading span {
    color: var(--tr-green);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .13em;
}

.home-renewal .tr-target-heading h2 {
    font-size: 22px;
}

.home-renewal .tr-target-grid {
    display: grid;
    grid-template-columns: .8fr .8fr 1.8fr;
    border: 1px solid var(--tr-line);
    border-radius: 12px;
    overflow: hidden;
}

.home-renewal .tr-target-item {
    min-height: 108px;
    padding: 20px 24px;
    border-right: 1px solid var(--tr-line);
    background: var(--tr-green-pale);
}

.home-renewal .tr-target-item:last-child {
    border-right: 0;
}

.home-renewal .tr-target-label {
    margin-bottom: 6px;
    color: var(--tr-muted);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.5;
}

.home-renewal .tr-target-number {
    color: var(--tr-green-dark);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.45;
}

.home-renewal .tr-target-number strong {
    color: var(--tr-green);
    font-size: 32px;
    font-weight: 800;
}

.home-renewal .tr-target-text {
    color: #39483f;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.8;
}

/* Shared sections
-------------------------------------*/
.home-renewal .tr-section {
    padding: 100px 0;
}

.home-renewal .tr-section-head {
    max-width: 920px;
    margin: 0 auto 52px;
    text-align: center;
}

.home-renewal .tr-section-head h2 {
    text-align: center;
}

.home-renewal .tr-section-head > p:last-child {
    max-width: 690px;
    margin: 20px auto 0;
    color: var(--tr-muted);
}

.home-renewal .tr-section-kicker {
    margin-bottom: 12px;
    color: var(--tr-green);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .05em;
}

.home-renewal .tr-center {
    margin-top: 42px;
    text-align: center;
}

.home-renewal .tr-text-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--tr-green-dark);
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
}

.home-renewal .tr-text-link span {
    color: var(--tr-green);
    font-size: 20px;
    transition: transform .2s ease;
}

.home-renewal .tr-text-link:hover {
    color: var(--tr-green);
    text-decoration: none;
}

.home-renewal .tr-text-link:hover span {
    transform: translateX(4px);
}

/* Problems
-------------------------------------*/
.home-renewal .tr-problems {
    background: #ffffff;
}

.home-renewal .tr-problem-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.home-renewal .tr-problem-card {
    padding: 34px 30px 32px;
    border: 1px solid #e1ebe5;
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 10px 30px rgba(18,72,45,.055);
}

.home-renewal .tr-icon,
.home-renewal .tr-line-icon {
    display: flex;
    width: 52px;
    height: 52px;
    align-items: center;
    justify-content: center;
    margin-bottom: 22px;
    border-radius: 12px;
    background: var(--tr-green-soft);
}

.home-renewal .tr-icon svg,
.home-renewal .tr-line-icon svg {
    width: 30px;
    height: 30px;
    fill: none;
    stroke: var(--tr-green);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.home-renewal .tr-problem-card h3 {
    margin-bottom: 14px;
}

.home-renewal .tr-problem-card p {
    color: var(--tr-muted);
    font-size: 14px;
    line-height: 1.85;
}

.home-renewal .tr-message-panel {
    margin: 46px auto 0;
    padding: 30px 36px;
    border-radius: 14px;
    background: var(--tr-green-soft);
    text-align: center;
}

.home-renewal .tr-message-panel p {
    color: #48584f;
    font-size: 16px;
}

.home-renewal .tr-message-panel strong {
    display: block;
    margin-top: 4px;
    color: var(--tr-green-dark);
    font-size: clamp(20px, 3vw, 28px);
    font-weight: 800;
}

/* Flow
-------------------------------------*/
.home-renewal .tr-flow-section {
    position: relative;
    background: var(--tr-green-dark);
}

.home-renewal .tr-flow-section::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(255,255,255,.08) 1px, transparent 1px);
    background-size: 24px 24px;
    pointer-events: none;
}

.home-renewal .tr-flow-section .tr-container {
    position: relative;
}

.home-renewal .tr-section-head-light h2,
.home-renewal .tr-section-head-light p {
    color: #ffffff;
}

.home-renewal .tr-section-head-light .tr-section-kicker {
    color: #9fddba;
}

.home-renewal .tr-section-head-light > p:last-child {
    color: #d5e8dc;
}

.home-renewal .tr-flow {
    display: grid;
    grid-template-columns: 1fr auto 1fr auto 1fr auto 1.15fr auto 1.15fr;
    align-items: stretch;
    gap: 9px;
}

.home-renewal .tr-flow-item {
    display: flex;
    min-height: 112px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 18px 12px;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 11px;
    background: rgba(255,255,255,.08);
    text-align: center;
}

.home-renewal .tr-flow-item span {
    margin-bottom: 8px;
    color: #9fddba;
    font-size: 11px;
    font-weight: 800;
}

.home-renewal .tr-flow-item strong {
    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.6;
}

.home-renewal .tr-flow-arrow {
    display: flex;
    align-items: center;
    color: #8dcdaa;
    font-size: 21px;
}

.home-renewal .tr-flow-result {
    position: relative;
    max-width: 500px;
    margin: 28px auto 0;
    padding: 18px 26px;
    border-radius: 10px;
    background: #ffffff;
    text-align: center;
    box-shadow: 0 16px 36px rgba(0,0,0,.14);
}

.home-renewal .tr-flow-result::before {
    content: "";
    position: absolute;
    top: -12px;
    left: 50%;
    border-right: 12px solid transparent;
    border-bottom: 12px solid #ffffff;
    border-left: 12px solid transparent;
    transform: translateX(-50%);
}

.home-renewal .tr-flow-result span,
.home-renewal .tr-flow-result strong {
    display: block;
}

.home-renewal .tr-flow-result span {
    margin-bottom: 2px;
    color: var(--tr-muted);
    font-size: 12px;
}

.home-renewal .tr-flow-result strong {
    color: var(--tr-green-dark);
    font-size: 21px;
    font-weight: 800;
}

/* Benefits
-------------------------------------*/
.home-renewal .tr-benefits {
    background: #ffffff;
}

.home-renewal .tr-benefit-row {
    display: grid;
    grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
    gap: 72px;
    align-items: center;
    padding: 56px 0;
    border-bottom: 1px solid #e8efeb;
}

.home-renewal .tr-benefit-row-reverse .tr-benefit-copy {
    order: 2;
}

.home-renewal .tr-benefit-row-reverse .tr-benefit-visual {
    order: 1;
}

.home-renewal .tr-benefit-no {
    display: inline-block;
    margin-bottom: 14px;
    color: var(--tr-green);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .09em;
}

.home-renewal .tr-benefit-copy h3 {
    margin-bottom: 18px;
    font-size: clamp(27px, 3.5vw, 38px);
}

.home-renewal .tr-benefit-copy > p {
    color: var(--tr-muted);
}

.home-renewal .tr-benefit-copy .tr-benefit-point {
    margin-top: 18px;
    padding-left: 18px;
    border-left: 3px solid var(--tr-green);
    color: var(--tr-green-dark);
    font-size: 15px;
    font-weight: 700;
}

.home-renewal .tr-benefit-visual {
    padding: 22px;
    border-radius: 18px;
    background: var(--tr-green-pale);
}

/* Fit
-------------------------------------*/
.home-renewal .tr-fit {
    background: var(--tr-green-pale);
}

.home-renewal .tr-fit-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.home-renewal .tr-fit-card {
    min-height: 270px;
    padding: 30px 25px;
    border: 1px solid var(--tr-line);
    border-radius: 14px;
    background: #ffffff;
}

.home-renewal .tr-fit-card h3 {
    margin-bottom: 13px;
    font-size: 19px;
}

.home-renewal .tr-fit-card p {
    color: var(--tr-muted);
    font-size: 14px;
    line-height: 1.85;
}

.home-renewal .tr-fit-card-accent {
    border-color: #9ed0b4;
    background: #edf8f1;
}

.home-renewal .tr-note {
    margin-top: 24px;
    color: #748078;
    font-size: 12px;
    text-align: center;
}

/* Customize
-------------------------------------*/
.home-renewal .tr-customize {
    background: #ffffff;
}

.home-renewal .tr-customize-inner {
    display: grid;
    grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
    gap: 74px;
    align-items: center;
}

.home-renewal .tr-customize-copy h2 {
    margin-bottom: 22px;
    font-size: clamp(30px, 3.6vw, 42px);
}

.home-renewal .tr-customize-copy > p:not(.tr-section-kicker) {
    margin-bottom: 30px;
    color: var(--tr-muted);
}

.home-renewal .tr-customize-visual {
    display: grid;
    grid-template-columns: 1fr auto 1.35fr;
    gap: 16px;
    align-items: center;
    padding: 40px;
    border: 1px solid var(--tr-line);
    border-radius: 18px;
    background: var(--tr-green-pale);
}

.home-renewal .tr-custom-base {
    padding: 30px 18px;
    border-radius: 12px;
    background: var(--tr-green-dark);
    text-align: center;
}

.home-renewal .tr-custom-base span,
.home-renewal .tr-custom-base strong {
    display: block;
    color: #ffffff;
}

.home-renewal .tr-custom-base span {
    margin-bottom: 5px;
    color: #c7e5d4;
    font-size: 11px;
}

.home-renewal .tr-custom-base strong {
    font-size: 18px;
    font-weight: 800;
}

.home-renewal .tr-custom-plus {
    color: var(--tr-green);
    font-size: 30px;
    font-weight: 300;
}

.home-renewal .tr-custom-options {
    display: grid;
    gap: 8px;
}

.home-renewal .tr-custom-options span {
    display: block;
    padding: 10px 14px;
    border: 1px solid #cfe2d7;
    border-radius: 8px;
    background: #ffffff;
    color: var(--tr-green-dark);
    font-size: 13px;
    font-weight: 700;
    text-align: center;
}

/* Screens
-------------------------------------*/
.home-renewal .tr-screens {
    background: var(--tr-green-pale);
}

.home-renewal .tr-screen-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.home-renewal .tr-screen-card {
    overflow: hidden;
    border: 1px solid var(--tr-line);
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 12px 30px rgba(18,72,45,.055);
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease;
}

.home-renewal .tr-screen-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 40px rgba(18,72,45,.11);
    text-decoration: none;
}

.home-renewal .tr-screen-image {
    overflow: hidden;
    aspect-ratio: 3 / 2;
    border-bottom: 1px solid #e4ece7;
    background: #eef3f0;
}

.home-renewal .tr-screen-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top left;
    transition: transform .25s ease;
}

.home-renewal .tr-screen-card:hover .tr-screen-image img {
    transform: scale(1.018);
}

.home-renewal .tr-screen-body {
    padding: 20px 22px 22px;
}

.home-renewal .tr-screen-body strong,
.home-renewal .tr-screen-body span {
    display: block;
}

.home-renewal .tr-screen-body strong {
    margin-bottom: 4px;
    color: var(--tr-text);
    font-size: 18px;
    font-weight: 800;
}

.home-renewal .tr-screen-body span {
    color: var(--tr-muted);
    font-size: 13px;
}

/* Works
-------------------------------------*/
.home-renewal .tr-works {
    background: #ffffff;
}

.home-renewal .tr-works-inner {
    display: grid;
    grid-template-columns: .9fr 1.1fr;
    gap: 72px;
    align-items: center;
}

.home-renewal .tr-works-copy h2 {
    margin-bottom: 20px;
    font-size: clamp(30px, 3.6vw, 41px);
}

.home-renewal .tr-works-copy > p:not(.tr-section-kicker) {
    margin-bottom: 24px;
    color: var(--tr-muted);
}

.home-renewal .tr-industry-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-content: center;
}

.home-renewal .tr-industry-tags span {
    display: inline-flex;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    padding: 11px 20px;
    border: 1px solid var(--tr-line);
    border-radius: 999px;
    background: var(--tr-green-pale);
    color: var(--tr-green-dark);
    font-size: 14px;
    font-weight: 700;
}

/* Final CTA
-------------------------------------*/
.home-renewal .tr-final-cta {
    position: relative;
    padding: 86px 0 92px;
    background: linear-gradient(135deg, var(--tr-green-deep), #0e7145);
}

.home-renewal .tr-final-cta::before,
.home-renewal .tr-final-cta::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    background: rgba(255,255,255,.05);
}

.home-renewal .tr-final-cta::before {
    top: -100px;
    right: 8%;
    width: 280px;
    height: 280px;
}

.home-renewal .tr-final-cta::after {
    bottom: -130px;
    left: 4%;
    width: 340px;
    height: 340px;
}

.home-renewal .tr-final-cta-inner {
    position: relative;
    z-index: 1;
    max-width: 920px;
    text-align: center;
}

.home-renewal .tr-final-kicker {
    margin-bottom: 13px;
    color: #a9d9bd;
    font-size: 13px;
    font-weight: 800;
}

.home-renewal .tr-final-cta h2 {
    color: #ffffff;
    text-align: center;
}

.home-renewal .tr-final-cta-inner > p:not(.tr-final-kicker) {
    max-width: 690px;
    margin: 20px auto 0;
    color: #d8e9df;
}

.home-renewal .tr-final-buttons {
    justify-content: center;
}

.home-renewal .tr-btn-white {
    background: #ffffff;
    color: var(--tr-green-dark);
}

.home-renewal .tr-btn-white:hover {
    background: #f4faf6;
    color: var(--tr-green-dark);
}

.home-renewal .tr-btn-ghost {
    border-color: rgba(255,255,255,.56);
    background: transparent;
    color: #ffffff;
}

.home-renewal .tr-btn-ghost:hover {
    border-color: #ffffff;
    background: rgba(255,255,255,.08);
    color: #ffffff;
}

/* Tablet
-------------------------------------*/
@media screen and (max-width: 980px) {
    .home-renewal .tr-container {
        width: min(100% - 40px, 900px);
    }

    .home-renewal .tr-hero {
        padding: 68px 0 72px;
    }

    .home-renewal .tr-hero-inner {
        grid-template-columns: 1fr;
        gap: 36px;
    }

    .home-renewal .tr-hero-copy {
        max-width: 720px;
    }

    .home-renewal .tr-hero-visual {
        max-width: 720px;
        margin: 0 auto;
    }

    .home-renewal .tr-target-grid {
        grid-template-columns: 1fr 1fr;
    }

    .home-renewal .tr-target-item:nth-child(2) {
        border-right: 0;
    }

    .home-renewal .tr-target-item-wide {
        grid-column: 1 / -1;
        border-top: 1px solid var(--tr-line);
    }

    .home-renewal .tr-problem-grid {
        grid-template-columns: 1fr;
    }

    .home-renewal .tr-problem-card {
        display: grid;
        grid-template-columns: 62px 1fr;
        column-gap: 18px;
        align-items: start;
    }

    .home-renewal .tr-problem-card .tr-icon {
        grid-row: 1 / span 2;
        margin-bottom: 0;
    }

    .home-renewal .tr-problem-card h3 {
        margin-top: 2px;
    }

    .home-renewal .tr-flow {
        grid-template-columns: repeat(5, 1fr);
        gap: 8px;
    }

    .home-renewal .tr-flow-arrow {
        display: none;
    }

    .home-renewal .tr-benefit-row,
    .home-renewal .tr-customize-inner,
    .home-renewal .tr-works-inner {
        grid-template-columns: 1fr;
        gap: 36px;
    }

    .home-renewal .tr-benefit-row-reverse .tr-benefit-copy,
    .home-renewal .tr-benefit-row-reverse .tr-benefit-visual {
        order: initial;
    }

    .home-renewal .tr-fit-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .home-renewal .tr-screen-grid {
        grid-template-columns: 1fr;
        max-width: 700px;
        margin: 0 auto;
    }

    .home-renewal .tr-screen-image {
        aspect-ratio: 16 / 8.5;
    }
}

/* Smartphone
-------------------------------------*/
@media screen and (max-width: 640px) {
    .home-renewal .tr-container {
        width: calc(100% - 32px);
    }

    .home-renewal p {
        font-size: 14px;
        line-height: 1.85;
    }

    .home-renewal h2 {
        font-size: 27px;
        line-height: 1.42;
    }

    .home-renewal .tr-hero {
        padding: 50px 0 54px;
    }

    .home-renewal .tr-eyebrow {
        margin-bottom: 18px;
        padding: 7px 12px;
        font-size: 11px;
    }

    .home-renewal .tr-hero h1 {
        margin-bottom: 20px;
        font-size: 38px;
        line-height: 1.32;
    }

    .home-renewal .tr-hero-lead {
        font-size: 15px;
    }

    .home-renewal .tr-hero-buttons,
    .home-renewal .tr-final-buttons {
        display: grid;
        grid-template-columns: 1fr;
        gap: 10px;
        margin-top: 26px;
    }

    .home-renewal .tr-btn {
        width: 100%;
    }

    .home-renewal .tr-hero-tags {
        gap: 7px 12px;
    }

    .home-renewal .tr-hero-visual {
        padding: 20px 0 25px;
    }

    .home-renewal .tr-floating-card {
        min-width: 125px;
        padding: 10px 12px;
    }

    .home-renewal .tr-floating-card-profit {
        top: 0;
        right: -5px;
    }

    .home-renewal .tr-floating-card-share {
        left: -5px;
    }

    .home-renewal .tr-floating-card strong {
        font-size: 12px;
    }

    .home-renewal .tr-target {
        padding: 28px 0;
    }

    .home-renewal .tr-target-heading {
        display: block;
        margin-bottom: 18px;
    }

    .home-renewal .tr-target-heading span {
        display: block;
        margin-bottom: 5px;
    }

    .home-renewal .tr-target-heading h2 {
        font-size: 20px;
    }

    .home-renewal .tr-target-grid {
        grid-template-columns: 1fr;
    }

    .home-renewal .tr-target-item,
    .home-renewal .tr-target-item:nth-child(2) {
        min-height: auto;
        border-right: 0;
        border-bottom: 1px solid var(--tr-line);
    }

    .home-renewal .tr-target-item-wide {
        grid-column: auto;
        border-top: 0;
        border-bottom: 0;
    }

    .home-renewal .tr-section {
        padding: 72px 0;
    }

    .home-renewal .tr-section-head {
        margin-bottom: 36px;
    }

    .home-renewal .tr-section-head > p:last-child {
        margin-top: 15px;
    }

    .home-renewal .tr-problem-card {
        display: block;
        padding: 27px 24px;
    }

    .home-renewal .tr-problem-card .tr-icon {
        margin-bottom: 18px;
    }

    .home-renewal .tr-problem-card h3 {
        font-size: 20px;
    }

    .home-renewal .tr-message-panel {
        margin-top: 34px;
        padding: 24px 18px;
    }

    .home-renewal .tr-flow {
        grid-template-columns: 1fr;
    }

    .home-renewal .tr-flow-item {
        min-height: auto;
        flex-direction: row;
        justify-content: flex-start;
        gap: 14px;
        padding: 15px 18px;
        text-align: left;
    }

    .home-renewal .tr-flow-item span {
        margin: 0;
    }

    .home-renewal .tr-flow-result {
        padding: 16px;
    }

    .home-renewal .tr-flow-result strong {
        font-size: 18px;
    }

    .home-renewal .tr-benefit-row {
        gap: 26px;
        padding: 42px 0;
    }

    .home-renewal .tr-benefit-copy h3 {
        font-size: 28px;
    }

    .home-renewal .tr-benefit-visual {
        padding: 10px;
        border-radius: 12px;
    }

    .home-renewal .tr-app-bar {
        min-height: 30px;
    }

    .home-renewal .tr-fit-grid {
        grid-template-columns: 1fr;
    }

    .home-renewal .tr-fit-card {
        min-height: auto;
    }

    .home-renewal .tr-customize-inner,
    .home-renewal .tr-works-inner {
        gap: 32px;
    }

    .home-renewal .tr-customize-copy h2,
    .home-renewal .tr-works-copy h2 {
        font-size: 28px;
    }

    .home-renewal .tr-customize-visual {
        grid-template-columns: 1fr;
        padding: 26px 20px;
    }

    .home-renewal .tr-custom-plus {
        text-align: center;
    }

    .home-renewal .tr-screen-image {
        aspect-ratio: 3 / 2;
    }

    .home-renewal .tr-industry-tags {
        gap: 8px;
    }

    .home-renewal .tr-industry-tags span {
        min-height: 42px;
        padding: 9px 15px;
        font-size: 12px;
    }

    .home-renewal .tr-final-cta {
        padding: 70px 0 74px;
    }
}

/* Renewal palette alignment for the shared header on this theme */
nav {
    background-color: #0b5635;
}

.hamburger span {
    background-color: #16824b;
}

header h1,
header div.hd_bg h1 {
    color: #0b5635;
}

/* The renewed home already has its own final CTA. Avoid the old footer CTA doubling it. */
.home-renewal ~ footer .footer-cta {
    display: none;
}

/****************************************
  FOOTER + CONTACT RENEWAL 2026
*****************************************/

/* -------------------------------------------------
   Shared contact CTA
------------------------------------------------- */
.site-contact-cta {
    position: relative;
    overflow: hidden;
    padding: 82px 24px;
    background:
        radial-gradient(circle at 88% 18%, rgba(255,255,255,.10), transparent 28%),
        linear-gradient(135deg, #0b5635 0%, #08452b 100%);
}

.site-contact-cta::before {
    content: "";
    position: absolute;
    right: -90px;
    bottom: -190px;
    width: 390px;
    height: 390px;
    border: 75px solid rgba(255,255,255,.035);
    border-radius: 50%;
    pointer-events: none;
}

.site-contact-cta__inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 64px;
    align-items: center;
    width: min(1120px, 100%);
    margin: 0 auto;
}

.site-contact-cta__copy p,
.site-contact-cta__copy h2,
.site-contact-cta__copy span,
.site-contact-cta__actions a {
    font-family: 'Noto Sans Japanese', 'Noto Sans JP', sans-serif;
}

.site-contact-cta__eyebrow {
    margin: 0 0 14px;
    color: #9bd5b5;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: .14em;
}

.site-contact-cta__copy h2 {
    margin: 0 0 18px;
    width: auto;
    text-wrap: balance;
    line-break: strict;
    color: #ffffff;
    font-size: clamp(30px, 4vw, 44px);
    font-weight: 700;
    line-height: 1.35;
    text-align: left;
    letter-spacing: -.02em;
}

.site-contact-cta__copy > p:last-child {
    margin: 0;
    color: rgba(255,255,255,.78);
    font-size: 15px;
    line-height: 1.9;
}

.site-contact-cta__actions {
    display: grid;
    gap: 12px;
    min-width: 260px;
}

.site-contact-cta__btn {
    box-sizing: border-box;
    display: flex;
    min-height: 58px;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 15px 22px;
    border: 1px solid rgba(255,255,255,.42);
    border-radius: 9px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.5;
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease, border-color .2s ease;
}

.site-contact-cta__btn:hover {
    transform: translateY(-2px);
    text-decoration: none;
}

.site-contact-cta__btn span {
    font-size: 19px;
    line-height: 1;
}

.site-contact-cta__btn--primary {
    border-color: #ffffff;
    background: #ffffff;
    color: #0b5635;
    box-shadow: 0 12px 30px rgba(0,0,0,.13);
}

.site-contact-cta__btn--primary:hover {
    background: #f4fbf7;
    color: #0b5635;
}

.site-contact-cta__btn--secondary {
    background: transparent;
    color: #ffffff;
}

.site-contact-cta__btn--secondary:hover {
    border-color: rgba(255,255,255,.75);
    background: rgba(255,255,255,.08);
    color: #ffffff;
}

/* -------------------------------------------------
   Main footer
------------------------------------------------- */
.site-footer {
    border: 0;
    background: #073c28;
    color: #ffffff;
}

.site-footer * {
    box-sizing: border-box;
}

.site-footer__inner {
    width: min(1160px, calc(100% - 48px));
    margin: 0 auto;
}

.site-footer__top {
    display: grid;
    grid-template-columns: minmax(240px, .85fr) minmax(0, 2.15fr);
    gap: 80px;
    padding: 72px 0 56px;
}

.site-footer__brand-name {
    margin: 0 0 14px;
    color: #ffffff;
    font-size: 30px;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -.02em;
}

.site-footer__brand-copy {
    margin: 0 0 26px;
    color: rgba(255,255,255,.68);
    font-size: 13px;
    line-height: 1.85;
}

.site-footer__contact-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #a8dfc0;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
}

.site-footer__contact-link:hover {
    color: #ffffff;
    text-decoration: none;
}

.site-footer__nav {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 46px;
}

.site-footer__nav-title {
    margin: 0 0 18px;
    padding: 0 0 12px;
    border-bottom: 1px solid rgba(255,255,255,.13);
    color: #ffffff;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.4;
}

.site-footer__nav ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.site-footer__nav li {
    margin: 0 0 11px;
    padding: 0;
}

.site-footer__nav li:last-child {
    margin-bottom: 0;
}

.site-footer__nav a {
    color: rgba(255,255,255,.67);
    font-size: 13px;
    line-height: 1.55;
    text-decoration: none;
    transition: color .2s ease;
}

.site-footer__nav a:hover {
    color: #ffffff;
    text-decoration: none;
}

.site-footer__company {
    display: flex;
    flex-wrap: wrap;
    gap: 36px 80px;
    padding: 32px 0;
    border-top: 1px solid rgba(255,255,255,.10);
    border-bottom: 1px solid rgba(255,255,255,.10);
}

.site-footer__company-label {
    margin: 0 0 8px;
    color: rgba(255,255,255,.48);
    font-size: 11px;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: .06em;
}

.site-footer__company p:not(.site-footer__company-label) {
    margin: 0;
    color: rgba(255,255,255,.67);
    font-size: 12px;
    line-height: 1.8;
}

.site-footer__company a {
    color: rgba(255,255,255,.82);
    text-decoration: none;
}

.site-footer__company a:hover {
    color: #ffffff;
    text-decoration: underline;
}

.site-footer__bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 22px 0 30px;
}

.site-footer__legal,
.site-footer__copyright {
    margin: 0;
    color: rgba(255,255,255,.42);
    font-size: 11px;
    line-height: 1.6;
}

.site-footer__legal a {
    color: rgba(255,255,255,.54);
    text-decoration: none;
}

.site-footer__legal a:hover {
    color: #ffffff;
    text-decoration: none;
}

/* Old footer elements are replaced by the renewed footer.php */
.site-footer + address {
    display: none;
}

/* -------------------------------------------------
   Contact Form 7 renewal
   Keeps the existing form markup and changes appearance only.
------------------------------------------------- */
.contact-form {
    box-sizing: border-box;
    max-width: 820px;
    margin: 34px auto 90px;
    padding: 44px 52px 52px;
    border: 1px solid #dcebe2;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 18px 48px rgba(18,72,45,.08);
}

.contact-form::before {
    content: "お問い合わせ内容をご入力ください";
    display: block;
    margin: 0 0 30px;
    padding: 0 0 18px;
    border-bottom: 1px solid #e5eee8;
    color: #26352e;
    font-size: 21px;
    font-weight: 700;
    line-height: 1.5;
}

.contact-form p {
    margin: 0 0 25px;
    color: #26352e;
    font-size: 14px;
    line-height: 1.75;
}

.contact-form p:last-child {
    margin-bottom: 0;
}

.contact-form br + .wpcf7-form-control-wrap,
.contact-form .wpcf7-form-control-wrap {
    display: block;
    margin-top: 8px;
}

.contact-form .required {
    display: inline-block;
    margin-left: 6px;
    padding: 2px 7px;
    border-radius: 4px;
    background: #fceceb;
    color: #b34a43;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.5;
    vertical-align: 2px;
}

.contact-form .wpcf7-form-control.wpcf7-text,
.contact-form .wpcf7-form-control.wpcf7-email,
.contact-form .wpcf7-form-control.wpcf7-tel,
.contact-form .wpcf7-form-control.wpcf7-textarea,
.contact-form .wpcf7-form-control.wpcf7-select {
    box-sizing: border-box;
    width: 100%;
    min-height: 50px;
    padding: 12px 14px;
    border: 1px solid #cfded5;
    border-radius: 8px;
    background: #fbfdfc;
    color: #26352e;
    font-size: 15px;
    line-height: 1.6;
    transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}

.contact-form .wpcf7-form-control.wpcf7-textarea {
    min-height: 180px;
    resize: vertical;
}

.contact-form .wpcf7-form-control.wpcf7-text:focus,
.contact-form .wpcf7-form-control.wpcf7-email:focus,
.contact-form .wpcf7-form-control.wpcf7-tel:focus,
.contact-form .wpcf7-form-control.wpcf7-textarea:focus,
.contact-form .wpcf7-form-control.wpcf7-select:focus {
    border-color: #16824b;
    background: #ffffff;
    outline: none;
    box-shadow: 0 0 0 3px rgba(22,130,75,.10);
}

.contact-form .wpcf7-form-control.wpcf7-checkbox,
.contact-form .wpcf7-form-control.wpcf7-radio {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
}

.contact-form .wpcf7-list-item {
    box-sizing: border-box;
    display: block;
    margin: 0;
    padding: 12px 14px;
    border: 1px solid #d7e4dc;
    border-radius: 8px;
    background: #f8fbf9;
    color: #36483e;
    font-size: 13px;
    line-height: 1.5;
}

.contact-form .wpcf7-list-item label {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.contact-form .wpcf7-list-item input[type="checkbox"],
.contact-form .wpcf7-list-item input[type="radio"] {
    width: 17px;
    height: 17px;
    margin: 0;
    accent-color: #16824b;
    flex: 0 0 auto;
}

.contact-form .wpcf7-form-control.wpcf7-submit {
    display: block;
    width: min(360px, 100%);
    min-height: 56px;
    margin: 38px auto 0;
    padding: 14px 30px;
    border: 0;
    border-radius: 9px;
    background: #16824b;
    color: #ffffff;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 10px 24px rgba(22,130,75,.20);
    transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
}

.contact-form .wpcf7-form-control.wpcf7-submit:hover {
    transform: translateY(-2px);
    background: #0f7040;
    box-shadow: 0 14px 30px rgba(22,130,75,.24);
    opacity: 1;
}

.contact-form .wpcf7-not-valid-tip {
    margin: 6px 0 0;
    color: #b34a43;
    font-size: 12px;
}

.contact-form .wpcf7-response-output {
    box-sizing: border-box;
    margin: 0 0 28px !important;
    padding: 14px 16px !important;
    border: 1px solid #dcebe2 !important;
    border-radius: 8px;
    background: #f3faf6;
    color: #315843;
    font-size: 13px;
    line-height: 1.7;
}

.contact-form .wpcf7-form.invalid .wpcf7-response-output,
.contact-form .wpcf7-form.failed .wpcf7-response-output,
.contact-form .wpcf7-form.spam .wpcf7-response-output,
.contact-form .wpcf7-form.aborted .wpcf7-response-output {
    border-color: #efd4d1 !important;
    background: #fff7f6;
    color: #9f413a;
}

.contact-form a {
    color: #0f7040;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* Contact page intro area: apply when the form follows the page intro */
.body > h2:has(+ p + .contact-form),
.body > h2:has(~ .contact-form) {
    margin-bottom: 22px;
    color: #26352e;
    font-size: clamp(30px, 4vw, 42px);
    line-height: 1.4;
}

/* -------------------------------------------------
   Responsive footer / contact
------------------------------------------------- */
@media screen and (max-width: 900px) {
    .site-contact-cta__inner {
        grid-template-columns: 1fr;
        gap: 34px;
    }

    .site-contact-cta__actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        min-width: 0;
    }

    .site-footer__top {
        grid-template-columns: 1fr;
        gap: 46px;
    }

    .site-footer__nav {
        gap: 30px;
    }
}

@media screen and (max-width: 640px) {
    .site-contact-cta {
        padding: 62px 20px;
    }

    .site-contact-cta__copy h2 {
        font-size: 30px;
    }

    .site-contact-cta__copy > p:last-child {
        font-size: 14px;
    }

    .site-contact-cta__actions {
        grid-template-columns: 1fr;
    }

    .site-contact-cta__btn {
        min-height: 54px;
    }

    .site-footer__inner {
        width: calc(100% - 36px);
    }

    .site-footer__top {
        padding: 54px 0 42px;
    }

    .site-footer__brand-name {
        font-size: 27px;
    }

    .site-footer__nav {
        grid-template-columns: 1fr 1fr;
        gap: 34px 26px;
    }

    .site-footer__nav-group:last-child {
        grid-column: 1 / -1;
    }

    .site-footer__company {
        display: block;
        padding: 28px 0;
    }

    .site-footer__company-sub {
        margin-top: 22px;
    }

    .site-footer__bottom {
        display: block;
        padding: 20px 0 26px;
    }

    .site-footer__copyright {
        margin-top: 8px;
    }

    .contact-form {
        margin: 28px auto 70px;
        padding: 30px 20px 34px;
        border-radius: 12px;
    }

    .contact-form::before {
        margin-bottom: 24px;
        font-size: 18px;
    }

    .contact-form .wpcf7-form-control.wpcf7-checkbox,
    .contact-form .wpcf7-form-control.wpcf7-radio {
        grid-template-columns: 1fr;
    }
}

/* ========================================
   フッター：ブラック / チャコール調整
   新フッター(.site-footer)用
======================================== */

.site-footer {
    background: #151917;
    border-top: none;
    color: #ffffff;
}

.site-footer__brand-copy,
.site-footer__nav a,
.site-footer__company p:not(.site-footer__company-label) {
    color: #aeb7b2;
}

.site-footer__nav-title,
.site-footer__brand-name {
    color: #ffffff;
}

.site-footer__contact-link {
    color: #d8dfdb;
}

.site-footer__contact-link:hover,
.site-footer__nav a:hover,
.site-footer__company a:hover,
.site-footer__legal a:hover {
    color: #ffffff;
}

.site-footer__company {
    border-top-color: rgba(255,255,255,.10);
    border-bottom-color: rgba(255,255,255,.10);
}

.site-footer__company-label {
    color: #7f8a84;
}

.site-footer__company a {
    color: #d4dad7;
}

.site-footer__legal,
.site-footer__copyright {
    color: #7f8a84;
}

.site-footer__legal a {
    color: #9aa49f;
}

/* 問い合わせCTAはアクセントとしてグリーンを残す */
.site-contact-cta {
    background: linear-gradient(135deg, #0b5635 0%, #16824b 100%);
}


/* =========================================================
   ABOUT PAGE - LIVE MARKUP MATCHED / STABLE
   Scope: .about-renewal
========================================================= */

.about-renewal {
    --ab-green: #16824b;
    --ab-green-dark: #0b5635;
    --ab-green-deep: #163129;
    --ab-green-soft: #eff8f3;
    --ab-green-pale: #f7fbf8;
    --ab-line: #dcebe2;
    --ab-text: #26352e;
    --ab-muted: #66736c;
    --ab-white: #ffffff;
    --ab-shadow: 0 18px 48px rgba(18,72,45,.10);
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
    color: var(--ab-text);
    background: #fff;
}

.about-renewal,
.about-renewal *,
.about-renewal *::before,
.about-renewal *::after {
    box-sizing: border-box;
}

.about-renewal .ab-container {
    width: calc(100% - 48px);
    max-width: 1160px;
    margin-left: auto;
    margin-right: auto;
}

.about-renewal .ab-hero-copy,
.about-renewal .ab-hero-visual,
.about-renewal .ab-principle-copy,
.about-renewal .ab-principle-list,
.about-renewal .ab-feature-copy,
.about-renewal .ab-feature-visual,
.about-renewal .ab-value-copy,
.about-renewal .ab-value-grid,
.about-renewal .ab-role-card,
.about-renewal .ab-next-card {
    min-width: 0;
}

.about-renewal p,
.about-renewal li,
.about-renewal a,
.about-renewal span,
.about-renewal strong,
.about-renewal h1,
.about-renewal h2,
.about-renewal h3 {
    font-family: 'Noto Sans Japanese', 'Noto Sans JP', sans-serif;
}

.about-renewal p {
    margin: 0;
    color: var(--ab-text);
    font-size: 16px;
    line-height: 1.95;
}

.about-renewal h1,
.about-renewal h2,
.about-renewal h3 {
    width: auto;
    margin: 0;
    color: var(--ab-text);
    font-weight: 700;
    text-align: left;
    word-break: normal;
    overflow-wrap: normal;
    line-break: strict;
    text-wrap: balance;
}

.about-renewal h2 {
    font-size: clamp(30px, 3.5vw, 42px);
    line-height: 1.4;
    letter-spacing: -.02em;
}

.about-renewal h3 {
    font-size: 21px;
    line-height: 1.5;
}

.about-renewal strong {
    font-weight: 700;
}

.about-renewal img {
    display: block;
    max-width: 100%;
    height: auto;
}

.about-renewal .ab-section {
    padding: 96px 0;
}

.about-renewal .ab-section-head {
    max-width: 920px;
    margin: 0 auto 52px;
    text-align: center;
}

.about-renewal .ab-section-head h2,
.about-renewal .ab-section-head > p {
    text-align: center;
}

.about-renewal .ab-section-head > p:last-child {
    max-width: 760px;
    margin: 18px auto 0;
    color: var(--ab-muted);
}

.about-renewal .ab-kicker,
.about-renewal .ab-eyebrow {
    margin: 0 0 14px;
    color: var(--ab-green);
    font-size: 12px;
    line-height: 1.4;
    font-weight: 800;
    letter-spacing: .14em;
}

/* ---------- HERO ---------- */

.about-renewal .ab-hero {
    position: relative;
    padding: 90px 0 96px;
    overflow: hidden;
    background: linear-gradient(135deg, #f7fbf8 0%, #eff8f3 100%);
}

.about-renewal .ab-hero::after {
    content: "";
    position: absolute;
    top: -170px;
    right: -160px;
    width: 480px;
    height: 480px;
    border-radius: 50%;
    background: rgba(22,130,75,.05);
    pointer-events: none;
}

.about-renewal .ab-hero-inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0,.92fr) minmax(0,1.08fr);
    gap: clamp(42px,5vw,66px);
    align-items: center;
}

.about-renewal .ab-hero h1 {
    margin-bottom: 24px;
    font-size: clamp(42px,5vw,60px);
    line-height: 1.24;
    letter-spacing: -.04em;
}

.about-renewal .ab-hero h1 span {
    color: var(--ab-green);
}

.about-renewal .ab-hero-lead {
    margin-bottom: 12px;
    font-size: 18px;
    line-height: 1.85;
    font-weight: 700;
}

.about-renewal .ab-hero-copy > p:not(.ab-eyebrow):not(.ab-hero-lead) {
    color: #4e5d55;
}

.about-renewal .ab-hero-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 30px;
}

.about-renewal .ab-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    padding: 0 28px;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
    text-decoration: none;
    transition: .2s ease;
}

.about-renewal .ab-btn:hover {
    text-decoration: none;
    transform: translateY(-1px);
}

.about-renewal .ab-btn-primary {
    background: var(--ab-green);
    color: #fff;
    box-shadow: 0 10px 26px rgba(22,130,75,.17);
}

.about-renewal .ab-btn-primary:hover {
    background: #117443;
    color: #fff;
}

.about-renewal .ab-btn-secondary {
    border: 1px solid #bfd8ca;
    background: rgba(255,255,255,.94);
    color: var(--ab-green-dark);
}

.about-renewal .ab-hero-visual {
    position: relative;
    padding: 20px 18px 24px;
}

.about-renewal .ab-app-window {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    border: 1px solid #dce8e1;
    border-radius: 14px;
    background: #fff;
    box-shadow: var(--ab-shadow);
}

.about-renewal .ab-app-bar {
    display: flex;
    align-items: center;
    gap: 7px;
    height: 40px;
    padding: 0 14px;
    border-bottom: 1px solid #e7eeea;
    background: #f8faf9;
}

.about-renewal .ab-app-bar > span {
    display: block;
    width: 8px;
    height: 8px;
    flex: 0 0 8px;
    border-radius: 50%;
    background: #cdd7d1;
}

.about-renewal .ab-app-bar strong {
    margin-left: 5px;
    color: #647069;
    font-size: 12px;
}

.about-renewal .ab-app-window img {
    width: 100%;
    margin: 0;
}

.about-renewal .ab-hero-badge {
    position: absolute;
    z-index: 2;
    min-width: 170px;
    padding: 12px 16px;
    border: 1px solid rgba(22,130,75,.14);
    border-radius: 9px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 10px 28px rgba(23,66,43,.11);
}

.about-renewal .ab-hero-badge span,
.about-renewal .ab-hero-badge strong {
    display: block;
}

.about-renewal .ab-hero-badge span {
    margin-bottom: 3px;
    color: var(--ab-muted);
    font-size: 11px;
}

.about-renewal .ab-hero-badge strong {
    color: var(--ab-green-dark);
    font-size: 13px;
}

.about-renewal .ab-hero-badge-top {
    top: 0;
    right: 0;
}

.about-renewal .ab-hero-badge-bottom {
    left: 0;
    bottom: 0;
}

/* ---------- FLOW ---------- */

.about-renewal .ab-concept {
    background: #fff;
}

.about-renewal .ab-flow-card {
    padding: 34px 30px 32px;
    border: 1px solid var(--ab-line);
    border-radius: 16px;
    background: var(--ab-green-pale);
}

.about-renewal .ab-flow-row {
    display: flex;
    align-items: stretch;
    gap: 10px;
}

.about-renewal .ab-flow-item {
    flex: 1 1 0;
    min-width: 0;
    padding: 20px 10px;
    border: 1px solid #d8e7de;
    border-radius: 10px;
    background: #fff;
    text-align: center;
}

.about-renewal .ab-flow-item span,
.about-renewal .ab-flow-item strong {
    display: block;
    text-align: center;
}

.about-renewal .ab-flow-item span {
    margin-bottom: 6px;
    color: var(--ab-green);
    font-size: 11px;
    font-weight: 800;
}

.about-renewal .ab-flow-item strong {
    color: var(--ab-text);
    font-size: 14px;
}

.about-renewal .ab-flow-arrow {
    display: flex;
    flex: 0 0 17px;
    align-items: center;
    justify-content: center;
    color: #8bad99;
    font-size: 18px;
    font-weight: 700;
}

.about-renewal .ab-flow-result {
    position: relative;
    max-width: 650px;
    margin: 26px auto 0;
    padding: 21px 22px;
    border-radius: 10px;
    background: var(--ab-green-dark);
    text-align: center;
}

.about-renewal .ab-flow-result::before {
    content: "";
    position: absolute;
    top: -9px;
    left: 50%;
    width: 18px;
    height: 18px;
    background: var(--ab-green-dark);
    transform: translateX(-50%) rotate(45deg);
}

.about-renewal .ab-flow-result span,
.about-renewal .ab-flow-result strong {
    position: relative;
    z-index: 1;
    display: block;
    color: #fff;
    text-align: center;
}

.about-renewal .ab-flow-result span {
    margin-bottom: 3px;
    font-size: 12px;
    opacity: .8;
}

.about-renewal .ab-flow-result strong {
    font-size: 19px;
}

.about-renewal .ab-concept-note {
    max-width: 760px;
    margin: 26px auto 0;
    color: var(--ab-muted);
    text-align: center;
}

/* ---------- SIMPLE OPERATION ---------- */

.about-renewal .ab-principle {
    background: var(--ab-green-soft);
}

.about-renewal .ab-principle-inner {
    display: grid;
    grid-template-columns: minmax(0,.92fr) minmax(0,1.08fr);
    gap: clamp(42px,6vw,72px);
    align-items: center;
}

.about-renewal .ab-principle-copy h2 {
    margin-bottom: 22px;
}

.about-renewal .ab-principle-copy > p:not(.ab-kicker):not(.ab-highlight-text) {
    margin-top: 11px;
    color: #526158;
}

.about-renewal .ab-highlight-text {
    margin-top: 22px;
    color: var(--ab-green-dark);
    font-size: 18px;
    font-weight: 700;
}

.about-renewal .ab-principle-list {
    display: grid;
    gap: 13px;
}

.about-renewal .ab-principle-item {
    display: grid;
    grid-template-columns: 44px minmax(0,1fr);
    gap: 16px;
    align-items: start;
    padding: 20px 22px;
    border: 1px solid #d9e9df;
    border-radius: 11px;
    background: rgba(255,255,255,.9);
}

.about-renewal .ab-principle-item > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--ab-green);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
}

.about-renewal .ab-principle-item strong {
    display: block;
    margin-bottom: 3px;
    color: var(--ab-text);
    font-size: 16px;
}

.about-renewal .ab-principle-item p {
    color: var(--ab-muted);
    font-size: 14px;
    line-height: 1.75;
}

/* ---------- FEATURES ---------- */

.about-renewal .ab-features-intro {
    padding-bottom: 24px;
}

.about-renewal .ab-feature-row {
    padding: 72px 0;
    background: #fff;
}

.about-renewal .ab-feature-row-soft {
    background: var(--ab-green-pale);
}

.about-renewal .ab-feature-inner {
    display: grid;
    grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr);
    gap: clamp(42px,6vw,66px);
    align-items: center;
}

.about-renewal .ab-feature-inner-reverse .ab-feature-copy {
    order: 2;
}

.about-renewal .ab-feature-inner-reverse .ab-feature-visual {
    order: 1;
}

.about-renewal .ab-feature-visual {
    min-width: 0;
}

.about-renewal .ab-feature-no {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 54px;
    min-height: 30px;
    padding: 0 11px;
    margin-bottom: 13px;
    border-radius: 20px;
    background: var(--ab-green-soft);
    color: var(--ab-green);
    font-size: 12px;
    font-weight: 800;
}

.about-renewal .ab-feature-label {
    margin-bottom: 7px;
    color: var(--ab-green-dark);
    font-size: 13px;
    line-height: 1.5;
    font-weight: 800;
}

.about-renewal .ab-feature-copy h2 {
    margin-bottom: 21px;
}

.about-renewal .ab-feature-copy > p:not(.ab-feature-label) {
    margin-top: 10px;
    color: #526158;
}

.about-renewal .ab-check-list {
    margin: 21px 0 0;
    padding: 0;
    list-style: none;
}

.about-renewal .ab-check-list li {
    position: relative;
    margin: 7px 0;
    padding-left: 25px;
    color: #415148;
    font-size: 14px;
    line-height: 1.7;
}

.about-renewal .ab-check-list li::before {
    content: "";
    position: absolute;
    left: 5px;
    top: 3px;
    width: 6px;
    height: 11px;
    border-right: 2px solid var(--ab-green);
    border-bottom: 2px solid var(--ab-green);
    transform: rotate(45deg);
}

.about-renewal .ab-mini-points {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 23px;
}

.about-renewal .ab-mini-points > div {
    padding: 15px 16px;
    border: 1px solid var(--ab-line);
    border-radius: 9px;
    background: #fff;
}

.about-renewal .ab-mini-points strong,
.about-renewal .ab-mini-points span {
    display: block;
}

.about-renewal .ab-mini-points strong {
    margin-bottom: 3px;
    color: var(--ab-green-dark);
    font-size: 13px;
}

.about-renewal .ab-mini-points span {
    color: var(--ab-muted);
    font-size: 12px;
}

.about-renewal .ab-use-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 22px;
}

.about-renewal .ab-use-tags span {
    padding: 7px 12px;
    border: 1px solid #cfe2d6;
    border-radius: 18px;
    background: var(--ab-green-pale);
    color: var(--ab-green-dark);
    font-size: 12px;
    font-weight: 700;
}

/* ---------- WORK FLOW ---------- */

.about-renewal .ab-workflow {
    background: var(--ab-green-deep);
}

.about-renewal .ab-section-head-light .ab-kicker {
    color: #9bd5b7;
}

.about-renewal .ab-section-head-light h2,
.about-renewal .ab-section-head-light > p:last-child {
    color: #fff;
}

.about-renewal .ab-section-head-light > p:last-child {
    opacity: .78;
}

.about-renewal .ab-role-flow {
    display: grid;
    grid-template-columns: minmax(0,1fr) 38px minmax(0,1fr) 38px minmax(0,1fr);
    align-items: center;
}

.about-renewal .ab-role-card {
    min-height: 172px;
    padding: 24px 20px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 11px;
    background: rgba(255,255,255,.075);
    text-align: center;
}

.about-renewal .ab-role-name,
.about-renewal .ab-role-card strong,
.about-renewal .ab-role-card p {
    display: block;
    color: #fff;
    text-align: center;
}

.about-renewal .ab-role-name {
    margin-bottom: 11px;
    color: #9bd5b7;
    font-size: 12px;
    font-weight: 700;
}

.about-renewal .ab-role-card strong {
    margin-bottom: 7px;
    font-size: 18px;
}

.about-renewal .ab-role-card p {
    font-size: 13px;
    line-height: 1.75;
    opacity: .75;
}

.about-renewal .ab-role-arrow {
    color: #7fc39f;
    font-size: 22px;
    text-align: center;
}

.about-renewal .ab-workflow-result {
    max-width: 700px;
    margin: 30px auto 0;
    padding: 19px 22px;
    border-radius: 10px;
    background: #fff;
    text-align: center;
}

.about-renewal .ab-workflow-result span,
.about-renewal .ab-workflow-result strong {
    display: block;
    text-align: center;
}

.about-renewal .ab-workflow-result span {
    color: var(--ab-muted);
    font-size: 12px;
}

.about-renewal .ab-workflow-result strong {
    margin-top: 3px;
    color: var(--ab-green-dark);
    font-size: 18px;
}

/* ---------- VALUE ---------- */

.about-renewal .ab-value {
    background: #fff;
}

.about-renewal .ab-value-inner {
    display: grid;
    grid-template-columns: minmax(0,1.05fr) minmax(0,.95fr);
    gap: clamp(42px,6vw,70px);
    align-items: center;
}

.about-renewal .ab-value-copy h2 {
    margin-bottom: 22px;
}

.about-renewal .ab-value-copy > p:not(.ab-kicker) {
    margin-top: 11px;
    color: #526158;
}

.about-renewal .ab-value-grid {
    display: grid;
    gap: 11px;
}

.about-renewal .ab-value-card {
    display: grid;
    grid-template-columns: 42px 118px minmax(0,1fr);
    gap: 12px;
    align-items: center;
    padding: 18px 18px;
    border: 1px solid var(--ab-line);
    border-radius: 10px;
    background: var(--ab-green-pale);
}

.about-renewal .ab-value-card > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--ab-green);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
}

.about-renewal .ab-value-card strong {
    color: var(--ab-text);
    font-size: 15px;
}

.about-renewal .ab-value-card p {
    color: var(--ab-muted);
    font-size: 13px;
    line-height: 1.55;
}

/* ---------- NEXT ---------- */

.about-renewal .ab-next {
    background: var(--ab-green-soft);
}

.about-renewal .ab-next-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 20px;
    max-width: 960px;
    margin: 0 auto;
}

.about-renewal .ab-next-card {
    display: block;
    padding: 30px;
    border: 1px solid #d4e5da;
    border-radius: 12px;
    background: #fff;
    color: var(--ab-text);
    text-decoration: none;
    transition: .2s ease;
}

.about-renewal .ab-next-card:hover {
    border-color: #a9cfb8;
    transform: translateY(-2px);
    text-decoration: none;
}

.about-renewal .ab-next-card > span {
    display: block;
    margin-bottom: 8px;
    color: var(--ab-green);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .12em;
}

.about-renewal .ab-next-card h3 {
    margin-bottom: 9px;
}

.about-renewal .ab-next-card p {
    margin-bottom: 15px;
    color: var(--ab-muted);
    font-size: 14px;
    line-height: 1.8;
}

.about-renewal .ab-next-card > strong {
    color: var(--ab-green-dark);
    font-size: 14px;
}

/* ---------- TABLET / SMALL PC ---------- */

@media screen and (max-width: 1040px) {
    .about-renewal .ab-hero-inner,
    .about-renewal .ab-principle-inner,
    .about-renewal .ab-feature-inner,
    .about-renewal .ab-value-inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .about-renewal .ab-hero-copy,
    .about-renewal .ab-principle-copy,
    .about-renewal .ab-feature-copy,
    .about-renewal .ab-value-copy {
        max-width: 780px;
    }

    .about-renewal .ab-hero-visual,
    .about-renewal .ab-feature-visual {
        width: 100%;
        max-width: 780px;
        margin-left: auto;
        margin-right: auto;
    }

    .about-renewal .ab-feature-inner-reverse .ab-feature-copy,
    .about-renewal .ab-feature-inner-reverse .ab-feature-visual {
        order: initial;
    }

    .about-renewal .ab-flow-row {
        display: grid;
        grid-template-columns: repeat(2,minmax(0,1fr));
        gap: 10px;
    }

    .about-renewal .ab-flow-arrow {
        display: none;
    }

    .about-renewal .ab-value-grid {
        max-width: 760px;
    }
}

@media screen and (max-width: 900px) {
    .about-renewal .ab-role-flow {
        grid-template-columns: 1fr;
        gap: 10px;
        max-width: 720px;
        margin: 0 auto;
    }

    .about-renewal .ab-role-arrow {
        line-height: 1;
        transform: rotate(90deg);
    }

    .about-renewal .ab-role-card {
        min-height: 0;
    }
}

/* ---------- SMARTPHONE ---------- */

@media screen and (max-width: 680px) {
    .about-renewal .ab-container {
        width: calc(100% - 30px);
    }

    .about-renewal .ab-section {
        padding: 70px 0;
    }

    .about-renewal .ab-section-head {
        margin-bottom: 36px;
    }

    .about-renewal h2 {
        font-size: 27px;
        line-height: 1.45;
    }

    .about-renewal p {
        font-size: 14px;
        line-height: 1.9;
    }

    .about-renewal .ab-hero {
        padding: 62px 0 68px;
    }

    .about-renewal .ab-hero-inner {
        gap: 34px;
    }

    .about-renewal .ab-hero h1 {
        font-size: 34px;
        line-height: 1.3;
        letter-spacing: -.025em;
    }

    .about-renewal .ab-hero-lead {
        font-size: 16px;
    }

    .about-renewal .ab-hero-buttons {
        display: grid;
        grid-template-columns: 1fr;
    }

    .about-renewal .ab-btn {
        width: 100%;
    }

    .about-renewal .ab-hero-visual {
        padding: 10px 0 0;
    }

    .about-renewal .ab-hero-badge {
        position: static;
        display: inline-block;
        min-width: 0;
        margin: 9px 6px 0 0;
        box-shadow: none;
    }

    .about-renewal .ab-flow-card {
        padding: 20px 14px;
    }

    .about-renewal .ab-flow-row {
        grid-template-columns: 1fr;
    }

    .about-renewal .ab-flow-item {
        padding: 17px 10px;
    }

    .about-renewal .ab-flow-result {
        padding: 19px 14px;
    }

    .about-renewal .ab-flow-result strong {
        font-size: 16px;
    }

    .about-renewal .ab-principle-item {
        grid-template-columns: 38px minmax(0,1fr);
        gap: 13px;
        padding: 18px 16px;
    }

    .about-renewal .ab-principle-item > span {
        width: 35px;
        height: 35px;
    }

    .about-renewal .ab-feature-row {
        padding: 56px 0;
    }

    .about-renewal .ab-mini-points,
    .about-renewal .ab-next-grid {
        grid-template-columns: 1fr;
    }

    .about-renewal .ab-value-card {
        grid-template-columns: 38px minmax(0,1fr);
        gap: 7px 12px;
    }

    .about-renewal .ab-value-card p {
        grid-column: 2;
    }

    .about-renewal .ab-next-card {
        padding: 26px 22px;
    }

    .about-renewal .ab-workflow-result strong {
        font-size: 16px;
    }
}

/* =========================================================
   ABOUT PAGE - 2026-08-15 layout fixes (5 points)
========================================================= */

/* 1. SIMPLE OPERATION: 右側3カードの文字領域を十分に確保 */
.about-renewal .ab-principle-inner {
    grid-template-columns: minmax(0, .84fr) minmax(0, 1.16fr);
}

.about-renewal .ab-principle-list {
    width: 100%;
}

.about-renewal .ab-principle-item {
    display: flex;
    align-items: flex-start;
    gap: 18px;
    width: 100%;
    min-height: 112px;
    padding: 24px 26px;
}

.about-renewal .ab-principle-item > span {
    flex: 0 0 40px;
}

.about-renewal .ab-principle-item > div {
    flex: 1 1 auto;
    min-width: 0;
    width: auto;
}

.about-renewal .ab-principle-item strong {
    width: auto;
    font-size: 17px;
    line-height: 1.55;
    white-space: normal;
}

.about-renewal .ab-principle-item p {
    width: auto;
    margin-top: 5px;
    font-size: 14px;
    line-height: 1.85;
    white-space: normal;
}

/* 2. 02/03 原価・粗利益：文章と画像の上端を揃える */
.about-renewal .ab-feature-inner {
    align-items: start;
}

.about-renewal .ab-feature-inner-cost .ab-feature-copy,
.about-renewal .ab-feature-inner-cost .ab-feature-visual {
    order: initial;
}

.about-renewal .ab-feature-inner-cost .ab-feature-visual {
    padding-top: 2px;
}

/* 3. WORK FLOW：説明文を白く、フローカードを明るく */
.about-renewal .ab-workflow .ab-section-head > p:last-child {
    color: rgba(255,255,255,.84) !important;
    opacity: 1;
}

.about-renewal .ab-workflow .ab-role-card {
    border: 1px solid #d9e9df;
    background: #f7fbf8;
    box-shadow: 0 10px 24px rgba(0,0,0,.08);
}

.about-renewal .ab-workflow .ab-role-name {
    color: #16824b;
}

.about-renewal .ab-workflow .ab-role-card strong {
    color: #26352e;
}

.about-renewal .ab-workflow .ab-role-card p {
    color: #66736c;
    opacity: 1;
}

.about-renewal .ab-workflow .ab-role-arrow {
    color: #9bd5b7;
}

/* 4. FROM DATA TO MANAGEMENT：右側カードを2列構造にして窮屈さを解消 */
.about-renewal .ab-value-inner {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.about-renewal .ab-value-card {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    column-gap: 16px;
    row-gap: 4px;
    align-items: center;
    min-height: 104px;
    padding: 22px 24px;
}

.about-renewal .ab-value-card > span {
    grid-column: 1;
    grid-row: 1 / span 2;
    align-self: start;
}

.about-renewal .ab-value-card strong {
    grid-column: 2;
    grid-row: 1;
    width: auto;
    font-size: 16px;
    line-height: 1.5;
}

.about-renewal .ab-value-card p {
    grid-column: 2;
    grid-row: 2;
    width: auto;
    margin: 0;
    font-size: 14px;
    line-height: 1.7;
}

/* 5. NEXT：2つのカードを独立した固定構造に変更 */
.about-renewal .ab-next-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
    max-width: 960px;
    margin: 0 auto;
}

.about-renewal .ab-next-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
    min-height: 245px;
    padding: 32px;
    border: 1px solid #d4e5da;
    border-radius: 12px;
    background: #fff;
    color: #26352e;
}

.about-renewal .ab-next-card > span {
    display: block;
    margin-bottom: 12px;
    color: #16824b;
    font-size: 11px;
    line-height: 1.4;
    font-weight: 800;
    letter-spacing: .12em;
}

.about-renewal .ab-next-card h3 {
    width: auto;
    margin: 0 0 10px;
    font-size: 21px;
    line-height: 1.5;
}

.about-renewal .ab-next-card p {
    width: auto;
    margin: 0 0 24px;
    color: #66736c;
    font-size: 14px;
    line-height: 1.8;
}

.about-renewal .ab-next-link {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-top: auto;
    color: #0b5635;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 700;
    text-decoration: none;
}

.about-renewal .ab-next-link:hover {
    color: #16824b;
    text-decoration: none;
}

.about-renewal .ab-next-link span {
    color: inherit;
    font-size: 16px;
}

@media screen and (max-width: 1040px) {
    .about-renewal .ab-principle-inner,
    .about-renewal .ab-value-inner {
        grid-template-columns: 1fr;
    }

    .about-renewal .ab-principle-list,
    .about-renewal .ab-value-grid {
        width: 100%;
        max-width: 780px;
        margin-left: auto;
        margin-right: auto;
    }
}

@media screen and (max-width: 680px) {
    .about-renewal .ab-principle-item {
        min-height: 0;
        padding: 20px 18px;
        gap: 14px;
    }

    .about-renewal .ab-value-card {
        min-height: 0;
        padding: 20px 18px;
    }

    .about-renewal .ab-next-grid {
        grid-template-columns: 1fr;
    }

    .about-renewal .ab-next-card {
        min-height: 0;
        padding: 26px 22px;
    }
}


/* =========================================================
   ABOUT FIX 6
   1) Check mark is drawn with CSS (no Unicode character).
   2) WORK FLOW lead paragraph is forced to white.
========================================================= */

.about-renewal .ab-workflow .ab-workflow-lead,
.about-renewal .ab-workflow .ab-section-head .ab-workflow-lead {
    color: #ffffff !important;
    opacity: 0.88 !important;
}

.about-renewal .ab-workflow .ab-section-head .ab-workflow-lead * {
    color: #ffffff !important;
}

.about-renewal .ab-check-list li::before {
    content: "" !important;
    position: absolute !important;
    left: 5px !important;
    top: 3px !important;
    width: 6px !important;
    height: 11px !important;
    border: 0 !important;
    border-right: 2px solid #16824b !important;
    border-bottom: 2px solid #16824b !important;
    background: transparent !important;
    transform: rotate(45deg) !important;
}


/* =========================================================
   FLOW PAGE RENEWAL
   Scope: .flow-renewal
========================================================= */

.flow-renewal {
    --fl-green: #16824b;
    --fl-green-dark: #0b5635;
    --fl-green-deep: #163129;
    --fl-soft: #eff8f3;
    --fl-pale: #f7fbf8;
    --fl-line: #dcebe2;
    --fl-text: #26352e;
    --fl-muted: #66736c;
    --fl-white: #ffffff;
    --fl-shadow: 0 16px 42px rgba(18,72,45,.09);
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
    color: var(--fl-text);
    background: #fff;
}

.flow-renewal,
.flow-renewal *,
.flow-renewal *::before,
.flow-renewal *::after {
    box-sizing: border-box;
}

.flow-renewal .fl-container {
    width: calc(100% - 48px);
    max-width: 1160px;
    margin-left: auto;
    margin-right: auto;
}

.flow-renewal p,
.flow-renewal li,
.flow-renewal a,
.flow-renewal span,
.flow-renewal strong,
.flow-renewal small,
.flow-renewal h1,
.flow-renewal h2,
.flow-renewal h3 {
    font-family: 'Noto Sans Japanese', 'Noto Sans JP', sans-serif;
}

.flow-renewal p {
    margin: 0;
    color: var(--fl-text);
    font-size: 16px;
    line-height: 1.95;
}

.flow-renewal h1,
.flow-renewal h2,
.flow-renewal h3 {
    width: auto;
    margin: 0;
    color: var(--fl-text);
    font-weight: 700;
    text-align: left;
    word-break: normal;
    overflow-wrap: normal;
    line-break: strict;
    text-wrap: balance;
}

.flow-renewal h2 {
    font-size: clamp(30px, 3.5vw, 42px);
    line-height: 1.4;
    letter-spacing: -.02em;
}

.flow-renewal h3 {
    font-size: 21px;
    line-height: 1.5;
}

.flow-renewal strong {
    font-weight: 700;
}

.flow-renewal .fl-section {
    padding: 96px 0;
}

.flow-renewal .fl-section-head {
    max-width: 860px;
    margin: 0 auto 52px;
    text-align: center;
}

.flow-renewal .fl-section-head h2,
.flow-renewal .fl-section-head > p {
    text-align: center;
}

.flow-renewal .fl-section-head > p:last-child {
    max-width: 740px;
    margin: 18px auto 0;
    color: var(--fl-muted);
}

.flow-renewal .fl-eyebrow,
.flow-renewal .fl-kicker,
.flow-renewal .fl-step-label {
    margin: 0 0 13px;
    color: var(--fl-green);
    font-size: 12px;
    line-height: 1.4;
    font-weight: 800;
    letter-spacing: .14em;
}

/* Hero */
.flow-renewal .fl-hero {
    position: relative;
    padding: 90px 0 96px;
    overflow: hidden;
    background: linear-gradient(135deg, #f7fbf8 0%, #eff8f3 100%);
}

.flow-renewal .fl-hero::after {
    content: "";
    position: absolute;
    top: -180px;
    right: -130px;
    width: 470px;
    height: 470px;
    border-radius: 50%;
    background: rgba(22,130,75,.05);
}

.flow-renewal .fl-hero-inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0,.92fr) minmax(0,1.08fr);
    gap: clamp(46px,6vw,76px);
    align-items: center;
}

.flow-renewal .fl-hero-copy,
.flow-renewal .fl-plan-panel,
.flow-renewal .fl-start-copy,
.flow-renewal .fl-start-card {
    min-width: 0;
}

.flow-renewal .fl-hero h1 {
    margin-bottom: 24px;
    font-size: clamp(42px,5vw,60px);
    line-height: 1.24;
    letter-spacing: -.04em;
}

.flow-renewal .fl-hero h1 span,
.flow-renewal .fl-start h2 span {
    color: var(--fl-green);
}

.flow-renewal .fl-hero-lead {
    margin-bottom: 12px !important;
    font-size: 18px !important;
    line-height: 1.85 !important;
    font-weight: 700;
}

.flow-renewal .fl-hero-copy > p:not(.fl-eyebrow):not(.fl-hero-lead) {
    color: #4e5d55;
}

.flow-renewal .fl-hero-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 30px;
}

.flow-renewal .fl-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    padding: 0 28px;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
}

.flow-renewal .fl-btn:hover {
    text-decoration: none;
    transform: translateY(-1px);
}

.flow-renewal .fl-btn-primary {
    background: var(--fl-green);
    color: #fff;
    box-shadow: 0 10px 26px rgba(22,130,75,.17);
}

.flow-renewal .fl-btn-primary:hover {
    color: #fff;
    background: #117443;
}

.flow-renewal .fl-btn-secondary {
    border: 1px solid #bfd8ca;
    background: #fff;
    color: var(--fl-green-dark);
}

.flow-renewal .fl-plan-panel {
    padding: 30px;
    border: 1px solid #d8e8df;
    border-radius: 16px;
    background: rgba(255,255,255,.96);
    box-shadow: var(--fl-shadow);
}

.flow-renewal .fl-plan-kicker {
    margin-bottom: 15px;
    color: var(--fl-muted);
    font-size: 13px;
    font-weight: 700;
}

.flow-renewal .fl-plan-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 14px;
}

.flow-renewal .fl-plan-card {
    min-width: 0;
    padding: 25px 22px;
    border: 1px solid var(--fl-line);
    border-radius: 11px;
    background: var(--fl-pale);
}

.flow-renewal .fl-plan-card-accent {
    background: var(--fl-green-dark);
    border-color: var(--fl-green-dark);
}

.flow-renewal .fl-plan-card > span {
    display: block;
    margin-bottom: 8px;
    color: var(--fl-green);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .12em;
}

.flow-renewal .fl-plan-card h2 {
    margin-bottom: 9px;
    color: var(--fl-green-dark);
    font-size: 31px;
}

.flow-renewal .fl-plan-card p {
    color: var(--fl-muted);
    font-size: 13px;
    line-height: 1.75;
}

.flow-renewal .fl-plan-card-accent > span {
    color: #9bd5b7;
}

.flow-renewal .fl-plan-card-accent h2,
.flow-renewal .fl-plan-card-accent p {
    color: #fff;
}

.flow-renewal .fl-plan-card-accent p {
    opacity: .82;
}

.flow-renewal .fl-plan-note {
    margin-top: 16px;
    color: var(--fl-muted);
    font-size: 12px;
    line-height: 1.65;
}

/* Overview */
.flow-renewal .fl-overview {
    background: #fff;
}

.flow-renewal .fl-overview-flow {
    display: flex;
    align-items: stretch;
    gap: 9px;
    padding: 30px;
    border: 1px solid var(--fl-line);
    border-radius: 16px;
    background: var(--fl-pale);
}

.flow-renewal .fl-overview-item {
    flex: 1 1 0;
    min-width: 0;
    padding: 21px 10px;
    border: 1px solid #d8e7de;
    border-radius: 10px;
    background: #fff;
    text-align: center;
}

.flow-renewal .fl-overview-item span,
.flow-renewal .fl-overview-item strong,
.flow-renewal .fl-overview-item small {
    display: block;
    text-align: center;
}

.flow-renewal .fl-overview-item span {
    margin-bottom: 4px;
    color: var(--fl-green);
    font-size: 11px;
    font-weight: 800;
}

.flow-renewal .fl-overview-item strong {
    color: var(--fl-text);
    font-size: 17px;
}

.flow-renewal .fl-overview-item small {
    margin-top: 3px;
    color: var(--fl-muted);
    font-size: 11px;
}

.flow-renewal .fl-overview-arrow {
    display: flex;
    flex: 0 0 20px;
    align-items: center;
    justify-content: center;
    color: #8bad99;
    font-size: 18px;
}

/* Timeline */
.flow-renewal .fl-steps {
    background: var(--fl-pale);
}

.flow-renewal .fl-timeline {
    position: relative;
    max-width: 940px;
    margin: 0 auto;
}

.flow-renewal .fl-timeline::before {
    content: "";
    position: absolute;
    top: 30px;
    bottom: 30px;
    left: 35px;
    width: 2px;
    background: #cfe2d6;
}

.flow-renewal .fl-step-card {
    position: relative;
    display: grid;
    grid-template-columns: 72px minmax(0,1fr);
    gap: 26px;
    align-items: start;
    margin-bottom: 20px;
}

.flow-renewal .fl-step-number {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    border: 6px solid var(--fl-pale);
    border-radius: 50%;
    background: var(--fl-green);
    color: #fff;
    font-size: 16px;
    font-weight: 800;
}

.flow-renewal .fl-step-body {
    min-width: 0;
    padding: 25px 28px;
    border: 1px solid var(--fl-line);
    border-radius: 12px;
    background: #fff;
}

.flow-renewal .fl-step-body h3 {
    margin-bottom: 10px;
    font-size: 23px;
}

.flow-renewal .fl-step-body > p:not(.fl-step-label) {
    color: #536159;
    font-size: 15px;
    line-height: 1.85;
}

.flow-renewal .fl-step-label {
    margin-bottom: 5px;
    font-size: 10px;
}

.flow-renewal .fl-step-point {
    display: grid;
    grid-template-columns: 140px minmax(0,1fr);
    gap: 12px;
    margin-top: 18px;
    padding: 13px 15px;
    border-radius: 8px;
    background: var(--fl-soft);
}

.flow-renewal .fl-step-point strong {
    color: var(--fl-green-dark);
    font-size: 12px;
}

.flow-renewal .fl-step-point span {
    color: var(--fl-muted);
    font-size: 12px;
}

.flow-renewal .fl-step-point-money {
    background: #f7f5ef;
}

.flow-renewal .fl-step-point-money strong {
    color: #725d30;
}

.flow-renewal .fl-text-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 17px;
    color: var(--fl-green-dark);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
}

.flow-renewal .fl-text-link:hover {
    text-decoration: underline;
}

.flow-renewal .fl-branch {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    max-width: 800px;
    margin: 30px auto 0;
    padding: 20px 24px;
    border: 1px dashed #9cc5ad;
    border-radius: 10px;
    background: #fff;
}

.flow-renewal .fl-branch span,
.flow-renewal .fl-branch strong {
    display: block;
}

.flow-renewal .fl-branch span {
    color: var(--fl-muted);
    font-size: 12px;
}

.flow-renewal .fl-branch strong {
    margin-top: 2px;
    color: var(--fl-green-dark);
    font-size: 16px;
}

.flow-renewal .fl-branch > a {
    flex: 0 0 auto;
    color: var(--fl-green-dark);
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
}

/* Customize */
.flow-renewal .fl-customize {
    background: var(--fl-soft);
}

.flow-renewal .fl-customize-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 18px;
}

.flow-renewal .fl-custom-card {
    position: relative;
    min-width: 0;
    padding: 30px 26px 27px;
    border: 1px solid #d5e7dc;
    border-radius: 12px;
    background: #fff;
}

.flow-renewal .fl-custom-no {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    margin-bottom: 18px;
    border-radius: 50%;
    background: var(--fl-green);
    color: #fff;
    font-size: 12px;
    font-weight: 800;
}

.flow-renewal .fl-custom-card h3 {
    margin-bottom: 10px;
}

.flow-renewal .fl-custom-card > p:not(.fl-step-label) {
    color: var(--fl-muted);
    font-size: 14px;
    line-height: 1.85;
}

.flow-renewal .fl-custom-note {
    max-width: 800px;
    margin: 20px auto 0;
    color: var(--fl-muted);
    font-size: 12px;
    text-align: center;
}

/* Start */
.flow-renewal .fl-start {
    background: #fff;
}

.flow-renewal .fl-start-inner {
    display: grid;
    grid-template-columns: minmax(0,1.05fr) minmax(0,.95fr);
    gap: clamp(44px,6vw,76px);
    align-items: center;
}

.flow-renewal .fl-start-copy h2 {
    margin-bottom: 22px;
}

.flow-renewal .fl-start-copy > p:not(.fl-kicker) {
    color: #526158;
}

.flow-renewal .fl-start-points {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 10px;
    margin-top: 26px;
}

.flow-renewal .fl-start-points > div {
    min-width: 0;
    padding: 16px;
    border: 1px solid var(--fl-line);
    border-radius: 9px;
    background: var(--fl-pale);
}

.flow-renewal .fl-start-points strong,
.flow-renewal .fl-start-points span {
    display: block;
}

.flow-renewal .fl-start-points strong {
    margin-bottom: 3px;
    color: var(--fl-green-dark);
    font-size: 13px;
}

.flow-renewal .fl-start-points span {
    color: var(--fl-muted);
    font-size: 11px;
    line-height: 1.6;
}

.flow-renewal .fl-start-card {
    padding: 42px 38px;
    border-radius: 16px;
    background: var(--fl-green-dark);
    box-shadow: var(--fl-shadow);
}

.flow-renewal .fl-start-card > span {
    display: block;
    margin-bottom: 16px;
    color: #9bd5b7;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .14em;
}

.flow-renewal .fl-start-card > strong {
    display: block;
    margin-bottom: 16px;
    color: #fff;
    font-size: 28px;
    line-height: 1.45;
}

.flow-renewal .fl-start-card p {
    color: rgba(255,255,255,.8);
    font-size: 14px;
    line-height: 1.85;
}

/* Support */
.flow-renewal .fl-support {
    background: var(--fl-green-deep);
}

.flow-renewal .fl-support-inner {
    display: grid;
    grid-template-columns: minmax(0,.76fr) minmax(0,1.24fr);
    gap: clamp(44px,6vw,70px);
    align-items: start;
}

.flow-renewal .fl-support .fl-kicker {
    color: #9bd5b7;
}

.flow-renewal .fl-support h2,
.flow-renewal .fl-support-copy > p:not(.fl-kicker) {
    color: #fff;
}

.flow-renewal .fl-support-copy > p:not(.fl-kicker) {
    margin-top: 18px;
    opacity: .78;
}

.flow-renewal .fl-support-cards {
    display: grid;
    gap: 12px;
}

.flow-renewal .fl-support-card {
    display: grid;
    grid-template-columns: 42px 190px minmax(0,1fr);
    gap: 14px;
    align-items: center;
    min-width: 0;
    padding: 18px 19px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 10px;
    background: rgba(255,255,255,.07);
}

.flow-renewal .fl-support-card > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #fff;
    color: var(--fl-green-dark);
    font-size: 11px;
    font-weight: 800;
}

.flow-renewal .fl-support-card strong {
    color: #fff;
    font-size: 14px;
}

.flow-renewal .fl-support-card p {
    color: rgba(255,255,255,.72);
    font-size: 12px;
    line-height: 1.65;
}

.flow-renewal .fl-support-link-wrap {
    grid-column: 2;
}

.flow-renewal .fl-support .fl-text-link {
    color: #b8ddc7;
}

/* Next */
.flow-renewal .fl-next {
    background: var(--fl-soft);
}

.flow-renewal .fl-next-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 20px;
    max-width: 960px;
    margin: 0 auto;
}

.flow-renewal .fl-next-card {
    min-width: 0;
    padding: 30px;
    border: 1px solid #d4e5da;
    border-radius: 12px;
    background: #fff;
}

.flow-renewal .fl-next-card > span {
    display: block;
    margin-bottom: 8px;
    color: var(--fl-green);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .12em;
}

.flow-renewal .fl-next-card h3 {
    margin-bottom: 9px;
}

.flow-renewal .fl-next-card p {
    margin-bottom: 15px;
    color: var(--fl-muted);
    font-size: 14px;
    line-height: 1.8;
}

.flow-renewal .fl-next-card a {
    color: var(--fl-green-dark);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
}

/* Tablet */
@media screen and (max-width: 1040px) {
    .flow-renewal .fl-hero-inner,
    .flow-renewal .fl-start-inner,
    .flow-renewal .fl-support-inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .flow-renewal .fl-hero-copy,
    .flow-renewal .fl-start-copy,
    .flow-renewal .fl-support-copy {
        max-width: 780px;
    }

    .flow-renewal .fl-plan-panel,
    .flow-renewal .fl-start-card {
        max-width: 780px;
    }

    .flow-renewal .fl-overview-flow {
        display: grid;
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .flow-renewal .fl-overview-arrow {
        display: none;
    }

    .flow-renewal .fl-support-link-wrap {
        grid-column: auto;
    }
}

@media screen and (max-width: 840px) {
    .flow-renewal .fl-customize-grid {
        grid-template-columns: 1fr;
    }

    .flow-renewal .fl-custom-card {
        max-width: 720px;
    }

    .flow-renewal .fl-start-points {
        grid-template-columns: 1fr;
        max-width: 620px;
    }

    .flow-renewal .fl-support-card {
        grid-template-columns: 42px minmax(0,1fr);
        gap: 7px 14px;
    }

    .flow-renewal .fl-support-card p {
        grid-column: 2;
    }
}

/* Smartphone */
@media screen and (max-width: 680px) {
    .flow-renewal .fl-container {
        width: calc(100% - 30px);
    }

    .flow-renewal .fl-section {
        padding: 70px 0;
    }

    .flow-renewal .fl-section-head {
        margin-bottom: 36px;
    }

    .flow-renewal h2 {
        font-size: 27px;
        line-height: 1.45;
    }

    .flow-renewal p {
        font-size: 14px;
        line-height: 1.9;
    }

    .flow-renewal .fl-hero {
        padding: 62px 0 68px;
    }

    .flow-renewal .fl-hero h1 {
        font-size: 34px;
        line-height: 1.3;
        letter-spacing: -.025em;
    }

    .flow-renewal .fl-hero-lead {
        font-size: 16px !important;
    }

    .flow-renewal .fl-hero-buttons {
        display: grid;
        grid-template-columns: 1fr;
    }

    .flow-renewal .fl-btn {
        width: 100%;
    }

    .flow-renewal .fl-plan-panel {
        padding: 22px 16px;
    }

    .flow-renewal .fl-plan-grid,
    .flow-renewal .fl-overview-flow,
    .flow-renewal .fl-next-grid {
        grid-template-columns: 1fr;
    }

    .flow-renewal .fl-timeline::before {
        left: 22px;
    }

    .flow-renewal .fl-step-card {
        grid-template-columns: 46px minmax(0,1fr);
        gap: 12px;
    }

    .flow-renewal .fl-step-number {
        width: 46px;
        height: 46px;
        border-width: 4px;
        font-size: 12px;
    }

    .flow-renewal .fl-step-body {
        padding: 20px 17px;
    }

    .flow-renewal .fl-step-body h3 {
        font-size: 20px;
    }

    .flow-renewal .fl-step-point {
        grid-template-columns: 1fr;
        gap: 3px;
    }

    .flow-renewal .fl-branch {
        align-items: flex-start;
        flex-direction: column;
    }

    .flow-renewal .fl-start-card {
        padding: 30px 24px;
    }

    .flow-renewal .fl-start-card > strong {
        font-size: 24px;
    }

    .flow-renewal .fl-support-card {
        grid-template-columns: 36px minmax(0,1fr);
        padding: 16px;
    }

    .flow-renewal .fl-support-card > span {
        width: 32px;
        height: 32px;
    }
}


/* =========================================================
   FLOW SUPPORT CARD FIX
   番号 + 本文の2列構成に変更
========================================================= */

.flow-renewal .fl-support-card {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    grid-template-areas:
        "number title"
        "number text";
    column-gap: 18px;
    row-gap: 5px;
    align-items: start;
    min-width: 0;
    padding: 22px 24px;
}

.flow-renewal .fl-support-card > span {
    grid-area: number;
    margin-top: 2px;
}

.flow-renewal .fl-support-card > strong {
    grid-area: title;
    display: block;
    margin: 0;
    color: #ffffff;
    font-size: 15px;
    line-height: 1.6;
    text-align: left;
}

.flow-renewal .fl-support-card > p {
    grid-area: text;
    width: auto;
    max-width: none;
    margin: 0;
    color: rgba(255,255,255,.76);
    font-size: 13px;
    line-height: 1.75;
    text-align: left;
}

/* 以前のレスポンシブ指定を上書き */
@media screen and (max-width: 840px) {
    .flow-renewal .fl-support-card {
        grid-template-columns: 42px minmax(0, 1fr);
        grid-template-areas:
            "number title"
            "number text";
        gap: 5px 14px;
    }

    .flow-renewal .fl-support-card p {
        grid-column: auto;
    }
}

@media screen and (max-width: 680px) {
    .flow-renewal .fl-support-card {
        grid-template-columns: 38px minmax(0, 1fr);
        grid-template-areas:
            "number title"
            "number text";
        padding: 18px;
    }
}


/* =========================================================
   CUSTOMIZE PAGE RENEWAL
   Scope: .custom-renewal
========================================================= */

.custom-renewal {
    --cu-green: #16824b;
    --cu-green-dark: #0b5635;
    --cu-green-deep: #163129;
    --cu-soft: #eff8f3;
    --cu-pale: #f7fbf8;
    --cu-line: #dcebe2;
    --cu-text: #26352e;
    --cu-muted: #66736c;
    --cu-white: #ffffff;
    --cu-shadow: 0 16px 44px rgba(18,72,45,.09);
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
    color: var(--cu-text);
    background: #fff;
}

.custom-renewal,
.custom-renewal *,
.custom-renewal *::before,
.custom-renewal *::after {
    box-sizing: border-box;
}

.custom-renewal .cu-container {
    width: calc(100% - 48px);
    max-width: 1160px;
    margin-left: auto;
    margin-right: auto;
}

.custom-renewal p,
.custom-renewal li,
.custom-renewal a,
.custom-renewal span,
.custom-renewal strong,
.custom-renewal small,
.custom-renewal h1,
.custom-renewal h2,
.custom-renewal h3 {
    font-family: 'Noto Sans Japanese', 'Noto Sans JP', sans-serif;
}

.custom-renewal p {
    margin: 0;
    color: var(--cu-text);
    font-size: 16px;
    line-height: 1.95;
}

.custom-renewal h1,
.custom-renewal h2,
.custom-renewal h3 {
    width: auto;
    margin: 0;
    color: var(--cu-text);
    font-weight: 700;
    text-align: left;
    word-break: normal;
    overflow-wrap: normal;
    line-break: strict;
    text-wrap: balance;
}

.custom-renewal h2 {
    font-size: clamp(30px, 3.5vw, 42px);
    line-height: 1.4;
    letter-spacing: -.02em;
}

.custom-renewal h3 {
    font-size: 21px;
    line-height: 1.5;
}

.custom-renewal strong {
    font-weight: 700;
}

.custom-renewal .cu-section {
    padding: 96px 0;
}

.custom-renewal .cu-section-head {
    max-width: 900px;
    margin: 0 auto 52px;
    text-align: center;
}

.custom-renewal .cu-section-head h2,
.custom-renewal .cu-section-head > p {
    text-align: center;
}

.custom-renewal .cu-section-head > p:last-child {
    max-width: 760px;
    margin: 18px auto 0;
    color: var(--cu-muted);
}

.custom-renewal .cu-eyebrow,
.custom-renewal .cu-kicker {
    margin: 0 0 14px;
    color: var(--cu-green);
    font-size: 12px;
    line-height: 1.4;
    font-weight: 800;
    letter-spacing: .14em;
}

/* Hero */
.custom-renewal .cu-hero {
    position: relative;
    padding: 90px 0 96px;
    overflow: hidden;
    background: linear-gradient(135deg, #f7fbf8 0%, #eff8f3 100%);
}

.custom-renewal .cu-hero::after {
    content: "";
    position: absolute;
    top: -180px;
    right: -130px;
    width: 470px;
    height: 470px;
    border-radius: 50%;
    background: rgba(22,130,75,.05);
}

.custom-renewal .cu-hero-inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0,.96fr) minmax(0,1.04fr);
    gap: clamp(46px,6vw,76px);
    align-items: center;
}

.custom-renewal .cu-hero-copy,
.custom-renewal .cu-visual,
.custom-renewal .cu-light-copy,
.custom-renewal .cu-light-list,
.custom-renewal .cu-after-copy,
.custom-renewal .cu-after-card {
    min-width: 0;
}

.custom-renewal .cu-hero h1 {
    margin-bottom: 24px;
    font-size: clamp(40px,4.7vw,58px);
    line-height: 1.26;
    letter-spacing: -.04em;
}

.custom-renewal .cu-hero h1 span {
    color: var(--cu-green);
}

.custom-renewal .cu-hero-lead {
    margin-bottom: 12px !important;
    font-size: 18px !important;
    line-height: 1.85 !important;
    font-weight: 700;
}

.custom-renewal .cu-hero-copy > p:not(.cu-eyebrow):not(.cu-hero-lead) {
    color: #4e5d55;
}

.custom-renewal .cu-hero-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 30px;
}

.custom-renewal .cu-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    padding: 0 28px;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
}

.custom-renewal .cu-btn:hover {
    text-decoration: none;
    transform: translateY(-1px);
}

.custom-renewal .cu-btn-primary {
    background: var(--cu-green);
    color: #fff;
    box-shadow: 0 10px 26px rgba(22,130,75,.17);
}

.custom-renewal .cu-btn-secondary {
    border: 1px solid #bfd8ca;
    background: #fff;
    color: var(--cu-green-dark);
}

/* Visual */
.custom-renewal .cu-visual {
    padding: 28px;
    border: 1px solid #d8e8df;
    border-radius: 16px;
    background: rgba(255,255,255,.95);
    box-shadow: var(--cu-shadow);
}

.custom-renewal .cu-visual-label {
    margin-bottom: 9px;
    color: var(--cu-muted);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .14em;
}

.custom-renewal .cu-visual-label-accent {
    color: var(--cu-green);
}

.custom-renewal .cu-visual-card {
    overflow: hidden;
    border: 1px solid var(--cu-line);
    border-radius: 10px;
    background: var(--cu-pale);
}

.custom-renewal .cu-visual-card-accent {
    border-color: #b9d8c5;
    background: #fff;
}

.custom-renewal .cu-ui-row {
    display: grid;
    grid-template-columns: 120px minmax(0,1fr);
    gap: 15px;
    align-items: center;
    padding: 12px 15px;
    border-bottom: 1px solid #e4ede8;
}

.custom-renewal .cu-ui-row:last-child {
    border-bottom: none;
}

.custom-renewal .cu-ui-row span {
    color: var(--cu-muted);
    font-size: 12px;
}

.custom-renewal .cu-ui-row strong {
    color: var(--cu-text);
    font-size: 13px;
}

.custom-renewal .cu-visual-card-accent .cu-ui-row strong {
    color: var(--cu-green-dark);
}

.custom-renewal .cu-visual-arrow {
    padding: 10px 0;
    color: var(--cu-green);
    font-size: 24px;
    text-align: center;
}

/* Why */
.custom-renewal .cu-why {
    background: #fff;
}

.custom-renewal .cu-three {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 20px;
}

.custom-renewal .cu-point-card {
    min-width: 0;
    padding: 29px 26px;
    border: 1px solid var(--cu-line);
    border-radius: 12px;
    background: #fff;
}

.custom-renewal .cu-no {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    margin-bottom: 16px;
    border-radius: 50%;
    background: var(--cu-green);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
}

.custom-renewal .cu-point-card h3 {
    margin-bottom: 9px;
}

.custom-renewal .cu-point-card p {
    color: var(--cu-muted);
    font-size: 14px;
    line-height: 1.8;
}

.custom-renewal .cu-center-note {
    margin-top: 26px;
    color: var(--cu-green-dark);
    font-size: 14px;
    font-weight: 700;
    text-align: center;
}

/* Examples */
.custom-renewal .cu-examples {
    background: var(--cu-pale);
}

.custom-renewal .cu-example-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 20px;
}

.custom-renewal .cu-example-card {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    gap: 18px;
    min-width: 0;
    padding: 28px 27px;
    border: 1px solid #d6e6dc;
    border-radius: 12px;
    background: #fff;
}

.custom-renewal .cu-example-icon span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 10px;
    background: var(--cu-soft);
    color: var(--cu-green);
    font-size: 11px;
    font-weight: 800;
}

.custom-renewal .cu-example-card h3 {
    margin-bottom: 8px;
}

.custom-renewal .cu-example-card p {
    color: var(--cu-muted);
    font-size: 14px;
    line-height: 1.8;
}

.custom-renewal .cu-checks {
    margin: 18px 0 0;
    padding: 0;
    list-style: none;
}

.custom-renewal .cu-checks li {
    position: relative;
    margin: 6px 0;
    padding-left: 24px;
    color: #44534a;
    font-size: 13px;
    line-height: 1.7;
}

.custom-renewal .cu-checks li::before {
    content: "";
    position: absolute;
    left: 5px;
    top: 3px;
    width: 6px;
    height: 11px;
    border-right: 2px solid var(--cu-green);
    border-bottom: 2px solid var(--cu-green);
    transform: rotate(45deg);
}

/* Small changes */
.custom-renewal .cu-light {
    background: var(--cu-soft);
}

.custom-renewal .cu-light-inner {
    display: grid;
    grid-template-columns: minmax(0,.92fr) minmax(0,1.08fr);
    gap: clamp(44px,6vw,72px);
    align-items: center;
}

.custom-renewal .cu-light-copy h2 {
    margin-bottom: 22px;
}

.custom-renewal .cu-light-copy > p:not(.cu-kicker) {
    margin-top: 10px;
    color: #526158;
}

.custom-renewal .cu-light-list {
    display: grid;
    gap: 12px;
}

.custom-renewal .cu-light-list > div {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    gap: 15px;
    align-items: start;
    min-width: 0;
    padding: 19px 20px;
    border: 1px solid #d7e8dd;
    border-radius: 10px;
    background: #fff;
}

.custom-renewal .cu-light-list > div > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--cu-green);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
}

.custom-renewal .cu-light-list strong,
.custom-renewal .cu-light-list p {
    display: block;
}

.custom-renewal .cu-light-list strong {
    margin-bottom: 3px;
    color: var(--cu-text);
    font-size: 15px;
}

.custom-renewal .cu-light-list p {
    color: var(--cu-muted);
    font-size: 13px;
    line-height: 1.65;
}

/* Price */
.custom-renewal .cu-price {
    background: #fff;
}

.custom-renewal .cu-price-block {
    display: grid;
    grid-template-columns: 290px minmax(0,1fr);
    gap: 34px;
    max-width: 1040px;
    margin: 0 auto 26px;
    padding: 30px;
    border: 1px solid var(--cu-line);
    border-radius: 14px;
    background: var(--cu-pale);
}

.custom-renewal .cu-price-title {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    gap: 14px;
    align-items: start;
}

.custom-renewal .cu-price-title > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: var(--cu-green);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
}

.custom-renewal .cu-price-title p {
    margin-bottom: 4px;
    color: var(--cu-green);
    font-size: 10px;
    line-height: 1.4;
    font-weight: 800;
    letter-spacing: .12em;
}

.custom-renewal .cu-price-title h3 {
    margin-bottom: 6px;
    font-size: 19px;
}

.custom-renewal .cu-price-title small {
    display: block;
    color: var(--cu-muted);
    font-size: 11px;
    line-height: 1.65;
}

.custom-renewal .cu-price-list {
    overflow: hidden;
    border: 1px solid #dce8e1;
    border-radius: 10px;
    background: #fff;
}

.custom-renewal .cu-price-row {
    display: grid;
    grid-template-columns: minmax(0,1fr) 210px;
    gap: 20px;
    align-items: center;
    min-width: 0;
    padding: 16px 18px;
    border-bottom: 1px solid #e7eeea;
}

.custom-renewal .cu-price-row:last-child {
    border-bottom: none;
}

.custom-renewal .cu-price-row strong {
    color: var(--cu-text);
    font-size: 13px;
}

.custom-renewal .cu-price-row > span {
    color: var(--cu-green-dark);
    font-size: 14px;
    font-weight: 800;
    text-align: right;
    white-space: nowrap;
}

.custom-renewal .cu-price-row > div small {
    display: block;
    margin-top: 3px;
    color: var(--cu-muted);
    font-size: 10px;
    line-height: 1.6;
}

.custom-renewal .cu-price-row-free {
    background: #f6fbf8;
}

.custom-renewal .cu-price-row-free > span {
    display: inline-block;
    justify-self: end;
    padding: 5px 10px;
    border-radius: 16px;
    background: var(--cu-green);
    color: #fff;
    font-size: 11px;
}

.custom-renewal .cu-price-notes {
    max-width: 1000px;
    margin: 18px auto 0;
}

.custom-renewal .cu-price-notes p {
    color: var(--cu-muted);
    font-size: 12px;
    line-height: 1.7;
}

/* After */
.custom-renewal .cu-after {
    background: var(--cu-green-deep);
}

.custom-renewal .cu-after-inner {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(0,.85fr);
    gap: clamp(44px,6vw,74px);
    align-items: center;
}

.custom-renewal .cu-after .cu-kicker {
    color: #9bd5b7;
}

.custom-renewal .cu-after h2,
.custom-renewal .cu-after-copy > p:not(.cu-kicker) {
    color: #fff;
}

.custom-renewal .cu-after-copy h2 {
    margin-bottom: 20px;
}

.custom-renewal .cu-after-copy > p:not(.cu-kicker) {
    margin-top: 9px;
    opacity: .8;
}

.custom-renewal .cu-after-card {
    padding: 34px;
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 14px;
    background: rgba(255,255,255,.08);
}

.custom-renewal .cu-after-card > span {
    display: block;
    margin-bottom: 12px;
    color: #9bd5b7;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .14em;
}

.custom-renewal .cu-after-card > strong {
    display: block;
    margin-bottom: 12px;
    color: #fff;
    font-size: 22px;
    line-height: 1.55;
}

.custom-renewal .cu-after-card p {
    color: rgba(255,255,255,.76);
    font-size: 14px;
    line-height: 1.85;
}

/* Next */
.custom-renewal .cu-next {
    background: var(--cu-soft);
}

.custom-renewal .cu-next-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 20px;
    max-width: 960px;
    margin: 0 auto;
}

.custom-renewal .cu-next-card {
    min-width: 0;
    padding: 30px;
    border: 1px solid #d4e5da;
    border-radius: 12px;
    background: #fff;
}

.custom-renewal .cu-next-card-main {
    border-color: #b8d8c4;
}

.custom-renewal .cu-next-card > span {
    display: block;
    margin-bottom: 8px;
    color: var(--cu-green);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .14em;
}

.custom-renewal .cu-next-card h3 {
    margin-bottom: 9px;
}

.custom-renewal .cu-next-card p {
    margin-bottom: 15px;
    color: var(--cu-muted);
    font-size: 14px;
    line-height: 1.8;
}

.custom-renewal .cu-next-card a {
    color: var(--cu-green-dark);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
}

/* Tablet */
@media screen and (max-width: 1040px) {
    .custom-renewal .cu-hero-inner,
    .custom-renewal .cu-light-inner,
    .custom-renewal .cu-after-inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .custom-renewal .cu-hero-copy,
    .custom-renewal .cu-light-copy,
    .custom-renewal .cu-after-copy {
        max-width: 780px;
    }

    .custom-renewal .cu-visual,
    .custom-renewal .cu-light-list,
    .custom-renewal .cu-after-card {
        width: 100%;
        max-width: 780px;
    }

    .custom-renewal .cu-price-block {
        grid-template-columns: 1fr;
        gap: 22px;
    }
}

@media screen and (max-width: 800px) {
    .custom-renewal .cu-three,
    .custom-renewal .cu-example-grid {
        grid-template-columns: 1fr;
    }

    .custom-renewal .cu-point-card,
    .custom-renewal .cu-example-card {
        max-width: 720px;
    }
}

/* Smartphone */
@media screen and (max-width: 680px) {
    .custom-renewal .cu-container {
        width: calc(100% - 30px);
    }

    .custom-renewal .cu-section {
        padding: 70px 0;
    }

    .custom-renewal .cu-section-head {
        margin-bottom: 36px;
    }

    .custom-renewal h2 {
        font-size: 27px;
        line-height: 1.45;
    }

    .custom-renewal p {
        font-size: 14px;
        line-height: 1.9;
    }

    .custom-renewal .cu-hero {
        padding: 62px 0 68px;
    }

    .custom-renewal .cu-hero h1 {
        font-size: 33px;
        line-height: 1.32;
        letter-spacing: -.025em;
    }

    .custom-renewal .cu-hero-lead {
        font-size: 16px !important;
    }

    .custom-renewal .cu-hero-buttons {
        display: grid;
        grid-template-columns: 1fr;
    }

    .custom-renewal .cu-btn {
        width: 100%;
    }

    .custom-renewal .cu-visual {
        padding: 20px 15px;
    }

    .custom-renewal .cu-ui-row {
        grid-template-columns: 95px minmax(0,1fr);
        gap: 10px;
        padding: 11px 12px;
    }

    .custom-renewal .cu-example-card {
        grid-template-columns: 44px minmax(0,1fr);
        gap: 13px;
        padding: 23px 18px;
    }

    .custom-renewal .cu-example-icon span {
        width: 38px;
        height: 38px;
    }

    .custom-renewal .cu-price-block {
        padding: 22px 15px;
    }

    .custom-renewal .cu-price-row {
        grid-template-columns: 1fr;
        gap: 5px;
        padding: 15px;
    }

    .custom-renewal .cu-price-row > span,
    .custom-renewal .cu-price-row-free > span {
        justify-self: start;
        text-align: left;
    }

    .custom-renewal .cu-next-grid {
        grid-template-columns: 1fr;
    }

    .custom-renewal .cu-after-card {
        padding: 26px 22px;
    }

    .custom-renewal .cu-after-card > strong {
        font-size: 19px;
    }
}


/* =========================================================
   CUSTOMIZE PAGE - COLUMN STABILITY FIX
   About / Flowで発生した「内側だけ細くなる」問題を予防
========================================================= */

/* すべての主要カラムで、子要素が内容幅に引っ張られないよう固定 */
.custom-renewal .cu-hero-inner > *,
.custom-renewal .cu-three > *,
.custom-renewal .cu-example-grid > *,
.custom-renewal .cu-example-card > *,
.custom-renewal .cu-light-inner > *,
.custom-renewal .cu-light-list > *,
.custom-renewal .cu-price-block > *,
.custom-renewal .cu-price-title > *,
.custom-renewal .cu-price-row > *,
.custom-renewal .cu-after-inner > *,
.custom-renewal .cu-next-grid > * {
    min-width: 0;
}

/* ヒーロー：右側が左側を圧迫しない比率へ */
.custom-renewal .cu-hero-inner {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

/* カスタマイズ例：アイコン以外はカード幅いっぱい */
.custom-renewal .cu-example-card {
    grid-template-columns: 48px minmax(0, 1fr);
}

.custom-renewal .cu-example-card > div:last-child {
    min-width: 0;
    width: 100%;
}

.custom-renewal .cu-example-card h3,
.custom-renewal .cu-example-card p,
.custom-renewal .cu-example-card li {
    max-width: none;
    width: auto;
}

/* 軽微な変更：番号 + 本文の2カラムを固定 */
.custom-renewal .cu-light-list > div {
    grid-template-columns: 42px minmax(0, 1fr);
}

.custom-renewal .cu-light-list > div > div {
    min-width: 0;
    width: 100%;
}

.custom-renewal .cu-light-list strong,
.custom-renewal .cu-light-list p {
    width: auto;
    max-width: none;
}

/* 料金：外側の左右分割を廃止して上下配置へ
   ここが最もカラム崩れしやすいため、常に安定する構造にする */
.custom-renewal .cu-price-block {
    display: block;
    max-width: 980px;
    padding: 30px;
}

.custom-renewal .cu-price-title {
    max-width: 720px;
    margin-bottom: 22px;
}

.custom-renewal .cu-price-list {
    width: 100%;
}

/* 金額部分は十分な幅があるPCでのみ左右2カラム */
.custom-renewal .cu-price-row {
    grid-template-columns: minmax(0, 1fr) minmax(170px, 220px);
    gap: 24px;
}

.custom-renewal .cu-price-row > div {
    min-width: 0;
}

.custom-renewal .cu-price-row strong,
.custom-renewal .cu-price-row small {
    max-width: none;
    width: auto;
}

/* 導入後セクション：本文とPOINTカードの比率を安定化 */
.custom-renewal .cu-after-inner {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
}

.custom-renewal .cu-after-card {
    width: 100%;
}

.custom-renewal .cu-after-card > strong,
.custom-renewal .cu-after-card > p {
    width: auto;
    max-width: none;
}

/* NEXTカードも内容幅でカラムが押されないようにする */
.custom-renewal .cu-next-card {
    width: 100%;
}

/* 1100px以下では早めに複雑な2カラムを解除 */
@media screen and (max-width: 1100px) {
    .custom-renewal .cu-hero-inner,
    .custom-renewal .cu-light-inner,
    .custom-renewal .cu-after-inner {
        grid-template-columns: 1fr !important;
        gap: 40px;
    }

    .custom-renewal .cu-hero-copy,
    .custom-renewal .cu-visual,
    .custom-renewal .cu-light-copy,
    .custom-renewal .cu-light-list,
    .custom-renewal .cu-after-copy,
    .custom-renewal .cu-after-card {
        width: 100%;
        max-width: 820px;
    }
}

/* 900px以下ではカード類も1列へ */
@media screen and (max-width: 900px) {
    .custom-renewal .cu-three,
    .custom-renewal .cu-example-grid,
    .custom-renewal .cu-next-grid {
        grid-template-columns: 1fr !important;
    }

    .custom-renewal .cu-point-card,
    .custom-renewal .cu-example-card,
    .custom-renewal .cu-next-card {
        width: 100%;
        max-width: 760px;
    }
}

/* 760px以下では料金の「項目 / 金額」も上下にする */
@media screen and (max-width: 760px) {
    .custom-renewal .cu-price-block {
        padding: 24px 18px;
    }

    .custom-renewal .cu-price-row {
        grid-template-columns: 1fr !important;
        gap: 6px;
    }

    .custom-renewal .cu-price-row > span,
    .custom-renewal .cu-price-row-free > span {
        justify-self: start;
        text-align: left;
        white-space: normal;
    }
}

/* スマホ：アイコン・番号部分だけ固定し、本文は残りを全部使う */
@media screen and (max-width: 680px) {
    .custom-renewal .cu-example-card {
        grid-template-columns: 40px minmax(0, 1fr);
    }

    .custom-renewal .cu-light-list > div {
        grid-template-columns: 38px minmax(0, 1fr);
    }

    .custom-renewal .cu-price-title {
        grid-template-columns: 38px minmax(0, 1fr);
    }
}


/* =========================================================
   CUSTOMIZE COLUMN FIX - screenshot verified
   SMALL CHANGES / CUSTOMIZE PRICE
========================================================= */

/* ---------- SMALL CHANGES ----------
   Gridをやめ「番号 + 本文」の単純なFlexに固定。
   既存テーマ側の幅指定があっても本文幅を確保する。
------------------------------------- */
.custom-renewal .cu-light-list {
    width: 100% !important;
}

.custom-renewal .cu-light-list > div {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    width: 100% !important;
    min-width: 0 !important;
    padding: 22px 24px !important;
    gap: 18px !important;
}

.custom-renewal .cu-light-list > div > span {
    flex: 0 0 38px !important;
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    margin: 0 !important;
}

.custom-renewal .cu-light-list > div > div {
    display: block !important;
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.custom-renewal .cu-light-list > div > div > strong {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 0 5px 0 !important;
    padding: 0 !important;
    color: var(--cu-text) !important;
    font-size: 15px !important;
    line-height: 1.55 !important;
    text-align: left !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    writing-mode: horizontal-tb !important;
}

.custom-renewal .cu-light-list > div > div > p {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--cu-muted) !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
    text-align: left !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    writing-mode: horizontal-tb !important;
}


/* ---------- CUSTOMIZE PRICE ----------
   左タイトル＋右表の2カラムを廃止。
   タイトルを上、価格一覧を下に固定して文字つぶれを防ぐ。
------------------------------------- */
.custom-renewal .cu-price-block {
    display: block !important;
    width: 100% !important;
    max-width: 980px !important;
    margin: 0 auto 26px !important;
    padding: 30px !important;
}

.custom-renewal .cu-price-title {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 0 22px 0 !important;
    gap: 15px !important;
}

.custom-renewal .cu-price-title > span {
    flex: 0 0 40px !important;
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    margin: 0 !important;
}

.custom-renewal .cu-price-title > div {
    display: block !important;
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.custom-renewal .cu-price-title > div > p {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 0 5px 0 !important;
    padding: 0 !important;
    color: var(--cu-green) !important;
    font-size: 10px !important;
    line-height: 1.4 !important;
    font-weight: 800 !important;
    letter-spacing: .12em !important;
    text-align: left !important;
    white-space: normal !important;
    word-break: normal !important;
    writing-mode: horizontal-tb !important;
}

.custom-renewal .cu-price-title > div > h3 {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 0 5px 0 !important;
    padding: 0 !important;
    color: var(--cu-text) !important;
    font-size: 20px !important;
    line-height: 1.5 !important;
    text-align: left !important;
    white-space: normal !important;
    word-break: normal !important;
    writing-mode: horizontal-tb !important;
}

.custom-renewal .cu-price-title > div > small {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--cu-muted) !important;
    font-size: 11px !important;
    line-height: 1.65 !important;
    text-align: left !important;
    white-space: normal !important;
    word-break: normal !important;
    writing-mode: horizontal-tb !important;
}

.custom-renewal .cu-price-list {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}

/* 価格一覧内はPCでは「項目 / 金額」の2列を維持 */
.custom-renewal .cu-price-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 220px !important;
    gap: 24px !important;
    width: 100% !important;
    min-width: 0 !important;
}

.custom-renewal .cu-price-row > strong,
.custom-renewal .cu-price-row > div {
    min-width: 0 !important;
    width: auto !important;
    max-width: none !important;
}

.custom-renewal .cu-price-row > span {
    width: auto !important;
    min-width: 0 !important;
}

/* ---------- Responsive ---------- */
@media screen and (max-width: 760px) {
    .custom-renewal .cu-price-block {
        padding: 22px 17px !important;
    }

    .custom-renewal .cu-price-row {
        grid-template-columns: 1fr !important;
        gap: 6px !important;
    }

    .custom-renewal .cu-price-row > span {
        justify-self: start !important;
        text-align: left !important;
        white-space: normal !important;
    }
}

@media screen and (max-width: 680px) {
    .custom-renewal .cu-light-list > div {
        padding: 18px !important;
        gap: 14px !important;
    }

    .custom-renewal .cu-light-list > div > span {
        flex-basis: 34px !important;
        width: 34px !important;
        min-width: 34px !important;
        height: 34px !important;
    }

    .custom-renewal .cu-price-title > span {
        flex-basis: 36px !important;
        width: 36px !important;
        min-width: 36px !important;
        height: 36px !important;
    }
}


/* =========================================================
   CUSTOMIZE SECTION HEADER FIX
   テーマ共通 header の白背景・影を無効化
========================================================= */

.custom-renewal header.cu-section-head {
    width: auto !important;
    height: auto !important;
    max-width: 900px !important;
    margin: 0 auto 52px !important;
    padding: 0 !important;
    position: static !important;
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.custom-renewal header.cu-section-head::before,
.custom-renewal header.cu-section-head::after {
    box-shadow: none !important;
}

@media screen and (max-width: 680px) {
    .custom-renewal header.cu-section-head {
        margin-bottom: 36px !important;
    }
}


/* =========================================================
   PRICE PAGE RENEWAL
   Scope: .price-renewal
========================================================= */

.price-renewal {
    --pr-green: #16824b;
    --pr-green-dark: #0b5635;
    --pr-green-deep: #163129;
    --pr-soft: #eff8f3;
    --pr-pale: #f7fbf8;
    --pr-line: #dcebe2;
    --pr-text: #26352e;
    --pr-muted: #66736c;
    --pr-white: #fff;
    --pr-shadow: 0 16px 44px rgba(18,72,45,.09);
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
    color: var(--pr-text);
    background: #fff;
}

.price-renewal,
.price-renewal *,
.price-renewal *::before,
.price-renewal *::after {
    box-sizing: border-box;
}

.price-renewal .pr-container {
    width: calc(100% - 48px);
    max-width: 1160px;
    margin-left: auto;
    margin-right: auto;
}

.price-renewal p,
.price-renewal a,
.price-renewal span,
.price-renewal small,
.price-renewal em,
.price-renewal strong,
.price-renewal h1,
.price-renewal h2,
.price-renewal h3 {
    font-family: 'Noto Sans Japanese', 'Noto Sans JP', sans-serif;
}

.price-renewal p {
    margin: 0;
    color: var(--pr-text);
    font-size: 16px;
    line-height: 1.95;
}

.price-renewal h1,
.price-renewal h2,
.price-renewal h3 {
    width: auto;
    margin: 0;
    color: var(--pr-text);
    font-weight: 700;
    text-align: left;
    word-break: normal;
    overflow-wrap: normal;
    line-break: strict;
    text-wrap: balance;
}

.price-renewal h2 {
    font-size: clamp(30px,3.5vw,42px);
    line-height: 1.4;
    letter-spacing: -.02em;
}

.price-renewal h3 {
    font-size: 21px;
    line-height: 1.5;
}

.price-renewal strong {
    font-weight: 700;
}

.price-renewal .pr-section {
    padding: 96px 0;
}

.price-renewal .pr-section-head {
    max-width: 900px;
    margin: 0 auto 52px;
    padding: 0;
    text-align: center;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.price-renewal .pr-section-head h2,
.price-renewal .pr-section-head > p {
    text-align: center;
}

.price-renewal .pr-section-head > p:last-child {
    max-width: 760px;
    margin: 18px auto 0;
    color: var(--pr-muted);
}

.price-renewal .pr-eyebrow,
.price-renewal .pr-kicker {
    margin: 0 0 14px;
    color: var(--pr-green);
    font-size: 12px;
    line-height: 1.4;
    font-weight: 800;
    letter-spacing: .14em;
}

/* HERO */
.price-renewal .pr-hero {
    position: relative;
    padding: 90px 0 96px;
    overflow: hidden;
    background: linear-gradient(135deg,#f7fbf8 0%,#eff8f3 100%);
}

.price-renewal .pr-hero::after {
    content: "";
    position: absolute;
    top: -180px;
    right: -130px;
    width: 470px;
    height: 470px;
    border-radius: 50%;
    background: rgba(22,130,75,.05);
}

.price-renewal .pr-hero-inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0,.93fr) minmax(0,1.07fr);
    gap: clamp(46px,6vw,76px);
    align-items: center;
}

.price-renewal .pr-hero-copy,
.price-renewal .pr-hero-price,
.price-renewal .pr-custom-copy,
.price-renewal .pr-custom-list,
.price-renewal .pr-notes-copy,
.price-renewal .pr-note-cards {
    min-width: 0;
}

.price-renewal .pr-hero h1 {
    margin-bottom: 24px;
    font-size: clamp(42px,5vw,60px);
    line-height: 1.24;
    letter-spacing: -.04em;
}

.price-renewal .pr-hero h1 span {
    color: var(--pr-green);
}

.price-renewal .pr-hero-lead {
    margin-bottom: 12px !important;
    font-size: 18px !important;
    line-height: 1.85 !important;
    font-weight: 700;
}

.price-renewal .pr-hero-copy > p:not(.pr-eyebrow):not(.pr-hero-lead) {
    color: #4e5d55;
}

.price-renewal .pr-hero-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 30px;
}

.price-renewal .pr-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    padding: 0 28px;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
}

.price-renewal .pr-btn:hover {
    text-decoration: none;
    transform: translateY(-1px);
}

.price-renewal .pr-btn-primary {
    background: var(--pr-green);
    color: #fff;
    box-shadow: 0 10px 26px rgba(22,130,75,.17);
}

.price-renewal .pr-btn-secondary {
    border: 1px solid #bfd8ca;
    background: #fff;
    color: var(--pr-green-dark);
}

.price-renewal .pr-hero-price {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 14px;
    padding: 28px;
    border: 1px solid #d8e8df;
    border-radius: 16px;
    background: rgba(255,255,255,.96);
    box-shadow: var(--pr-shadow);
}

.price-renewal .pr-mini-plan {
    min-width: 0;
    padding: 26px 22px;
    border: 1px solid var(--pr-line);
    border-radius: 11px;
    background: var(--pr-pale);
}

.price-renewal .pr-mini-plan-accent {
    border-color: var(--pr-green-dark);
    background: var(--pr-green-dark);
}

.price-renewal .pr-mini-plan p {
    margin-bottom: 10px;
    color: var(--pr-green);
    font-size: 10px;
    line-height: 1.4;
    font-weight: 800;
    letter-spacing: .12em;
}

.price-renewal .pr-mini-plan strong {
    display: block;
    color: var(--pr-green-dark);
    font-size: clamp(27px,3vw,36px);
    line-height: 1.15;
    white-space: nowrap;
}

.price-renewal .pr-mini-plan strong span {
    margin-left: 3px;
    font-size: 14px;
}

.price-renewal .pr-mini-plan small {
    display: block;
    margin-top: 4px;
    color: var(--pr-muted);
    font-size: 10px;
}

.price-renewal .pr-mini-plan em {
    display: block;
    margin-top: 18px;
    color: var(--pr-text);
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
}

.price-renewal .pr-mini-plan-accent p,
.price-renewal .pr-mini-plan-accent strong,
.price-renewal .pr-mini-plan-accent strong span,
.price-renewal .pr-mini-plan-accent small,
.price-renewal .pr-mini-plan-accent em {
    color: #fff;
}

.price-renewal .pr-mini-plan-accent p {
    color: #9bd5b7;
}

.price-renewal .pr-license-zero {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 17px 20px;
    border-radius: 10px;
    background: var(--pr-soft);
}

.price-renewal .pr-license-zero span {
    color: var(--pr-muted);
    font-size: 13px;
    font-weight: 700;
}

.price-renewal .pr-license-zero strong {
    color: var(--pr-green-dark);
    font-size: 25px;
}

/* PLAN CARDS */
.price-renewal .pr-plans {
    background: #fff;
}

.price-renewal .pr-plan-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 24px;
    max-width: 1040px;
    margin: 0 auto;
}

.price-renewal .pr-plan-card {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--pr-line);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 10px 30px rgba(18,72,45,.055);
}

.price-renewal .pr-plan-card-accent {
    border-color: #9ecab0;
}

.price-renewal .pr-plan-top {
    padding: 30px 30px 26px;
    background: var(--pr-pale);
}

.price-renewal .pr-plan-card-accent .pr-plan-top {
    background: var(--pr-green-dark);
}

.price-renewal .pr-plan-en {
    margin-bottom: 5px;
    color: var(--pr-green);
    font-size: 10px;
    line-height: 1.4;
    font-weight: 800;
    letter-spacing: .14em;
}

.price-renewal .pr-plan-top h3 {
    margin-bottom: 8px;
    font-size: 26px;
}

.price-renewal .pr-plan-for {
    min-height: 54px;
    color: var(--pr-muted);
    font-size: 13px;
    line-height: 1.75;
}

.price-renewal .pr-plan-price {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin-top: 22px;
}

.price-renewal .pr-plan-price strong {
    color: var(--pr-green-dark);
    font-size: clamp(37px,4vw,49px);
    line-height: 1;
}

.price-renewal .pr-plan-price span {
    color: var(--pr-muted);
    font-size: 12px;
}

.price-renewal .pr-plan-card-accent .pr-plan-en {
    color: #9bd5b7;
}

.price-renewal .pr-plan-card-accent .pr-plan-top h3,
.price-renewal .pr-plan-card-accent .pr-plan-for,
.price-renewal .pr-plan-card-accent .pr-plan-price strong,
.price-renewal .pr-plan-card-accent .pr-plan-price span {
    color: #fff;
}

.price-renewal .pr-plan-card-accent .pr-plan-for {
    opacity: .8;
}

.price-renewal .pr-plan-body {
    padding: 28px 30px 30px;
}

.price-renewal .pr-plan-label {
    margin-bottom: 10px;
    color: var(--pr-muted);
    font-size: 11px;
    line-height: 1.4;
    font-weight: 700;
}

.price-renewal .pr-range {
    display: flex;
    align-items: stretch;
    gap: 7px;
    margin-bottom: 24px;
}

.price-renewal .pr-range span {
    display: flex;
    flex: 1 1 0;
    align-items: center;
    justify-content: center;
    min-width: 0;
    padding: 13px 10px;
    border: 1px solid #cfe2d6;
    border-radius: 8px;
    background: var(--pr-pale);
    color: var(--pr-green-dark);
    font-size: 12px;
    font-weight: 700;
    text-align: center;
}

.price-renewal .pr-range i {
    display: flex;
    align-items: center;
    color: #8bad99;
    font-style: normal;
}

.price-renewal .pr-checks {
    margin: 0;
    padding: 0;
    list-style: none;
}

.price-renewal .pr-checks li {
    position: relative;
    margin: 9px 0;
    padding-left: 25px;
    color: #44534a;
    font-size: 13px;
    line-height: 1.7;
}

.price-renewal .pr-checks li::before {
    content: "";
    position: absolute;
    left: 5px;
    top: 3px;
    width: 6px;
    height: 11px;
    border-right: 2px solid var(--pr-green);
    border-bottom: 2px solid var(--pr-green);
    transform: rotate(45deg);
}

.price-renewal .pr-plan-note {
    margin-top: 23px;
    padding: 15px 16px;
    border-radius: 9px;
    background: #f5f7f6;
}

.price-renewal .pr-plan-note strong,
.price-renewal .pr-plan-note span {
    display: block;
}

.price-renewal .pr-plan-note strong {
    margin-bottom: 4px;
    color: var(--pr-text);
    font-size: 12px;
}

.price-renewal .pr-plan-note span {
    color: var(--pr-muted);
    font-size: 11px;
    line-height: 1.6;
}

.price-renewal .pr-plan-note-accent {
    background: var(--pr-soft);
}

/* COMMON */
.price-renewal .pr-common {
    background: var(--pr-pale);
}

.price-renewal .pr-common-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 18px;
}

.price-renewal .pr-common-card {
    display: flex;
    gap: 17px;
    min-width: 0;
    padding: 27px 24px;
    border: 1px solid #d6e6dc;
    border-radius: 12px;
    background: #fff;
}

.price-renewal .pr-common-card > div {
    flex: 1 1 auto;
    min-width: 0;
}

.price-renewal .pr-no {
    display: flex;
    flex: 0 0 38px;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: var(--pr-green);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
}

.price-renewal .pr-card-en {
    margin-bottom: 3px;
    color: var(--pr-green);
    font-size: 9px;
    line-height: 1.4;
    font-weight: 800;
    letter-spacing: .11em;
}

.price-renewal .pr-common-card h3 {
    margin-bottom: 12px;
    font-size: 18px;
}

.price-renewal .pr-big-value {
    display: block;
    margin-bottom: 10px;
    color: var(--pr-green-dark);
    font-size: 28px;
    line-height: 1.2;
}

.price-renewal .pr-big-value span {
    font-size: 12px;
}

.price-renewal .pr-common-card p:not(.pr-card-en) {
    color: var(--pr-muted);
    font-size: 12px;
    line-height: 1.7;
}

.price-renewal .pr-common-card a {
    display: inline-block;
    margin-top: 11px;
    color: var(--pr-green-dark);
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
}

.price-renewal .pr-setup-price {
    display: grid;
    gap: 8px;
}

.price-renewal .pr-setup-price p {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 7px;
    border-bottom: 1px solid #edf1ef;
}

.price-renewal .pr-setup-price p:last-child {
    border-bottom: none;
}

.price-renewal .pr-setup-price strong {
    color: var(--pr-text);
    font-size: 12px;
}

.price-renewal .pr-setup-price span {
    color: var(--pr-green-dark);
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.price-renewal .pr-tax-note {
    margin-top: 18px;
    color: var(--pr-muted);
    font-size: 11px;
    text-align: center;
}

/* CUSTOMIZE */
.price-renewal .pr-custom {
    background: var(--pr-soft);
}

.price-renewal .pr-custom-inner {
    display: grid;
    grid-template-columns: minmax(0,.92fr) minmax(0,1.08fr);
    gap: clamp(44px,6vw,72px);
    align-items: center;
}

.price-renewal .pr-custom-copy h2 {
    margin-bottom: 22px;
}

.price-renewal .pr-custom-copy > p:not(.pr-kicker) {
    margin-top: 10px;
    color: #526158;
}

.price-renewal .pr-text-link {
    display: inline-block;
    margin-top: 20px;
    color: var(--pr-green-dark);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
}

.price-renewal .pr-custom-list,
.price-renewal .pr-note-cards {
    display: grid;
    gap: 12px;
}

.price-renewal .pr-custom-list > div,
.price-renewal .pr-note-cards > div {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    min-width: 0;
    padding: 20px 22px;
    border: 1px solid #d7e8dd;
    border-radius: 10px;
    background: #fff;
}

.price-renewal .pr-custom-list > div > span,
.price-renewal .pr-note-cards > div > span {
    display: flex;
    flex: 0 0 36px;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--pr-green);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
}

.price-renewal .pr-custom-list > div > div,
.price-renewal .pr-note-cards > div > div {
    flex: 1 1 auto;
    min-width: 0;
}

.price-renewal .pr-custom-list strong,
.price-renewal .pr-note-cards strong {
    display: block;
    margin-bottom: 4px;
    color: var(--pr-text);
    font-size: 15px;
}

.price-renewal .pr-custom-list p,
.price-renewal .pr-note-cards p {
    color: var(--pr-muted);
    font-size: 12px;
    line-height: 1.7;
}

/* OPTIONS */
.price-renewal .pr-options {
    background: #fff;
}

.price-renewal .pr-option-list {
    max-width: 940px;
    margin: 0 auto;
    overflow: hidden;
    border: 1px solid var(--pr-line);
    border-radius: 13px;
    background: #fff;
}

.price-renewal .pr-option-row {
    display: grid;
    grid-template-columns: minmax(0,1fr) 230px;
    gap: 24px;
    align-items: center;
    min-width: 0;
    padding: 20px 24px;
    border-bottom: 1px solid #e7eeea;
}

.price-renewal .pr-option-row:last-child {
    border-bottom: none;
}

.price-renewal .pr-option-row > div {
    min-width: 0;
}

.price-renewal .pr-option-row strong {
    display: block;
    margin-bottom: 3px;
    color: var(--pr-text);
    font-size: 14px;
}

.price-renewal .pr-option-row small {
    display: block;
    color: var(--pr-muted);
    font-size: 11px;
    line-height: 1.6;
}

.price-renewal .pr-option-row > span {
    color: var(--pr-green-dark);
    font-size: 14px;
    font-weight: 800;
    text-align: right;
    white-space: nowrap;
}

/* NOTES */
.price-renewal .pr-notes {
    background: var(--pr-green-deep);
}

.price-renewal .pr-notes-inner {
    display: grid;
    grid-template-columns: minmax(0,.83fr) minmax(0,1.17fr);
    gap: clamp(44px,6vw,70px);
    align-items: center;
}

.price-renewal .pr-notes .pr-kicker {
    color: #9bd5b7;
}

.price-renewal .pr-notes h2,
.price-renewal .pr-notes-copy > p:not(.pr-kicker) {
    color: #fff;
}

.price-renewal .pr-notes-copy h2 {
    margin-bottom: 18px;
}

.price-renewal .pr-notes-copy > p:not(.pr-kicker) {
    opacity: .78;
}

.price-renewal .pr-note-cards > div {
    border-color: rgba(255,255,255,.13);
    background: rgba(255,255,255,.08);
}

.price-renewal .pr-note-cards > div > span {
    background: #fff;
    color: var(--pr-green-dark);
}

.price-renewal .pr-note-cards strong {
    color: #fff;
}

.price-renewal .pr-note-cards p {
    color: rgba(255,255,255,.72);
}

/* NEXT */
.price-renewal .pr-next {
    background: var(--pr-soft);
}

.price-renewal .pr-next-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 20px;
    max-width: 960px;
    margin: 0 auto;
}

.price-renewal .pr-next-card {
    min-width: 0;
    padding: 30px;
    border: 1px solid #d4e5da;
    border-radius: 12px;
    background: #fff;
}

.price-renewal .pr-next-card-main {
    border-color: #b8d8c4;
}

.price-renewal .pr-next-card > span {
    display: block;
    margin-bottom: 8px;
    color: var(--pr-green);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .14em;
}

.price-renewal .pr-next-card h3 {
    margin-bottom: 9px;
}

.price-renewal .pr-next-card p {
    margin-bottom: 15px;
    color: var(--pr-muted);
    font-size: 14px;
    line-height: 1.8;
}

.price-renewal .pr-next-card a {
    color: var(--pr-green-dark);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
}

/* TABLET */
@media screen and (max-width: 1040px) {
    .price-renewal .pr-hero-inner,
    .price-renewal .pr-custom-inner,
    .price-renewal .pr-notes-inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .price-renewal .pr-hero-copy,
    .price-renewal .pr-hero-price,
    .price-renewal .pr-custom-copy,
    .price-renewal .pr-custom-list,
    .price-renewal .pr-notes-copy,
    .price-renewal .pr-note-cards {
        width: 100%;
        max-width: 820px;
    }

    .price-renewal .pr-common-grid {
        grid-template-columns: 1fr;
    }

    .price-renewal .pr-common-card {
        max-width: 820px;
    }
}

@media screen and (max-width: 820px) {
    .price-renewal .pr-plan-grid,
    .price-renewal .pr-next-grid {
        grid-template-columns: 1fr;
    }

    .price-renewal .pr-plan-card,
    .price-renewal .pr-next-card {
        max-width: 760px;
    }
}

/* SMARTPHONE */
@media screen and (max-width: 680px) {
    .price-renewal .pr-container {
        width: calc(100% - 30px);
    }

    .price-renewal .pr-section {
        padding: 70px 0;
    }

    .price-renewal .pr-section-head {
        margin-bottom: 36px;
    }

    .price-renewal h2 {
        font-size: 27px;
        line-height: 1.45;
    }

    .price-renewal p {
        font-size: 14px;
        line-height: 1.9;
    }

    .price-renewal .pr-hero {
        padding: 62px 0 68px;
    }

    .price-renewal .pr-hero h1 {
        font-size: 34px;
        line-height: 1.3;
        letter-spacing: -.025em;
    }

    .price-renewal .pr-hero-lead {
        font-size: 16px !important;
    }

    .price-renewal .pr-hero-buttons {
        display: grid;
        grid-template-columns: 1fr;
    }

    .price-renewal .pr-btn {
        width: 100%;
    }

    .price-renewal .pr-hero-price {
        grid-template-columns: 1fr;
        padding: 20px 15px;
    }

    .price-renewal .pr-license-zero {
        grid-column: auto;
    }

    .price-renewal .pr-plan-top,
    .price-renewal .pr-plan-body {
        padding-left: 21px;
        padding-right: 21px;
    }

    .price-renewal .pr-plan-price strong {
        font-size: 38px;
    }

    .price-renewal .pr-range {
        flex-direction: column;
    }

    .price-renewal .pr-range i {
        justify-content: center;
        transform: rotate(90deg);
    }

    .price-renewal .pr-common-card {
        padding: 22px 18px;
    }

    .price-renewal .pr-option-row {
        grid-template-columns: 1fr;
        gap: 5px;
        padding: 17px 18px;
    }

    .price-renewal .pr-option-row > span {
        text-align: left;
        white-space: normal;
    }

    .price-renewal .pr-custom-list > div,
    .price-renewal .pr-note-cards > div {
        padding: 18px;
    }
}


/* =========================================================
   WORKS PAGE RENEWAL
   Scope: .works-renewal
========================================================= */

.works-renewal {
    --wk-green: #16824b;
    --wk-green-dark: #0b5635;
    --wk-green-deep: #163129;
    --wk-soft: #eff8f3;
    --wk-pale: #f7fbf8;
    --wk-line: #dcebe2;
    --wk-text: #26352e;
    --wk-muted: #66736c;
    --wk-white: #fff;
    --wk-shadow: 0 16px 44px rgba(18,72,45,.09);
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
    color: var(--wk-text);
    background: #fff;
}

.works-renewal,
.works-renewal *,
.works-renewal *::before,
.works-renewal *::after {
    box-sizing: border-box;
}

.works-renewal .wk-container {
    width: calc(100% - 48px);
    max-width: 1160px;
    margin-left: auto;
    margin-right: auto;
}

.works-renewal p,
.works-renewal a,
.works-renewal span,
.works-renewal small,
.works-renewal strong,
.works-renewal h1,
.works-renewal h2,
.works-renewal h3,
.works-renewal td,
.works-renewal th {
    font-family: 'Noto Sans Japanese', 'Noto Sans JP', sans-serif;
}

.works-renewal p {
    margin: 0;
    color: var(--wk-text);
    font-size: 16px;
    line-height: 1.95;
}

.works-renewal h1,
.works-renewal h2,
.works-renewal h3 {
    width: auto;
    margin: 0;
    color: var(--wk-text);
    font-weight: 700;
    text-align: left;
    word-break: normal;
    overflow-wrap: normal;
    line-break: strict;
    text-wrap: balance;
}

.works-renewal h2 {
    font-size: clamp(30px,3.5vw,42px);
    line-height: 1.4;
    letter-spacing: -.02em;
}

.works-renewal h3 {
    font-size: 21px;
    line-height: 1.5;
}

.works-renewal strong {
    font-weight: 700;
}

.works-renewal .wk-section {
    padding: 96px 0;
}

.works-renewal .wk-section-head {
    max-width: 900px;
    margin: 0 auto 52px;
    padding: 0;
    text-align: center;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.works-renewal .wk-section-head h2,
.works-renewal .wk-section-head > p {
    text-align: center;
}

.works-renewal .wk-section-head > p:last-child {
    max-width: 760px;
    margin: 18px auto 0;
    color: var(--wk-muted);
}

.works-renewal .wk-eyebrow,
.works-renewal .wk-kicker {
    margin: 0 0 14px;
    color: var(--wk-green);
    font-size: 12px;
    line-height: 1.4;
    font-weight: 800;
    letter-spacing: .14em;
}

/* HERO */
.works-renewal .wk-hero {
    position: relative;
    padding: 90px 0 96px;
    overflow: hidden;
    background: linear-gradient(135deg,#f7fbf8 0%,#eff8f3 100%);
}

.works-renewal .wk-hero::after {
    content: "";
    position: absolute;
    top: -180px;
    right: -130px;
    width: 470px;
    height: 470px;
    border-radius: 50%;
    background: rgba(22,130,75,.05);
}

.works-renewal .wk-hero-inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0,.95fr) minmax(0,1.05fr);
    gap: clamp(46px,6vw,76px);
    align-items: center;
}

.works-renewal .wk-hero-copy,
.works-renewal .wk-stats,
.works-renewal .wk-environment-copy,
.works-renewal .wk-environment-list,
.works-renewal .wk-other-copy,
.works-renewal .wk-other-card {
    min-width: 0;
}

.works-renewal .wk-hero h1 {
    margin-bottom: 24px;
    font-size: clamp(42px,5vw,60px);
    line-height: 1.24;
    letter-spacing: -.04em;
}

.works-renewal .wk-hero h1 span {
    color: var(--wk-green);
}

.works-renewal .wk-hero-lead {
    margin-bottom: 12px !important;
    font-size: 18px !important;
    line-height: 1.85 !important;
    font-weight: 700;
}

.works-renewal .wk-hero-copy > p:not(.wk-eyebrow):not(.wk-hero-lead) {
    color: #4e5d55;
}

.works-renewal .wk-hero-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 30px;
}

.works-renewal .wk-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    padding: 0 28px;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
}

.works-renewal .wk-btn:hover {
    text-decoration: none;
    transform: translateY(-1px);
}

.works-renewal .wk-btn-primary {
    background: var(--wk-green);
    color: #fff;
    box-shadow: 0 10px 26px rgba(22,130,75,.17);
}

.works-renewal .wk-btn-secondary {
    border: 1px solid #bfd8ca;
    background: #fff;
    color: var(--wk-green-dark);
}

/* Stats */
.works-renewal .wk-stats {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 14px;
    padding: 28px;
    border: 1px solid #d8e8df;
    border-radius: 16px;
    background: rgba(255,255,255,.96);
    box-shadow: var(--wk-shadow);
}

.works-renewal .wk-stat {
    min-width: 0;
    padding: 25px 22px;
    border: 1px solid var(--wk-line);
    border-radius: 11px;
    background: var(--wk-pale);
}

.works-renewal .wk-stat-main {
    grid-row: span 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: var(--wk-green-dark);
    border-color: var(--wk-green-dark);
}

.works-renewal .wk-stat > span {
    display: block;
    margin-bottom: 10px;
    color: var(--wk-green);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .13em;
}

.works-renewal .wk-stat > strong {
    display: block;
    color: var(--wk-green-dark);
    font-size: clamp(32px,4vw,46px);
    line-height: 1.08;
    white-space: nowrap;
}

.works-renewal .wk-stat > strong span {
    margin-left: 3px;
    font-size: 14px;
}

.works-renewal .wk-stat > p {
    margin-top: 9px;
    color: var(--wk-muted);
    font-size: 12px;
    line-height: 1.65;
}

.works-renewal .wk-stat-main > span {
    color: #9bd5b7;
}

.works-renewal .wk-stat-main > strong,
.works-renewal .wk-stat-main > strong span,
.works-renewal .wk-stat-main > p {
    color: #fff;
}

.works-renewal .wk-stat-main > p {
    opacity: .8;
}

/* Industries */
.works-renewal .wk-industries {
    background: #fff;
}

.works-renewal .wk-industry-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 18px;
}

.works-renewal .wk-industry-card {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    min-width: 0;
    padding: 25px 23px;
    border: 1px solid var(--wk-line);
    border-radius: 12px;
    background: #fff;
}

.works-renewal .wk-industry-card > span {
    display: flex;
    flex: 0 0 38px;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: var(--wk-green);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
}

.works-renewal .wk-industry-card > div {
    flex: 1 1 auto;
    min-width: 0;
}

.works-renewal .wk-industry-card strong {
    display: block;
    margin-bottom: 5px;
    color: var(--wk-text);
    font-size: 15px;
    line-height: 1.55;
}

.works-renewal .wk-industry-card p {
    color: var(--wk-muted);
    font-size: 12px;
    line-height: 1.7;
}

/* Environment */
.works-renewal .wk-environment {
    background: var(--wk-soft);
}

.works-renewal .wk-environment-inner {
    display: grid;
    grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr);
    gap: clamp(44px,6vw,72px);
    align-items: center;
}

.works-renewal .wk-environment-copy h2 {
    margin-bottom: 22px;
}

.works-renewal .wk-environment-copy > p:not(.wk-kicker) {
    margin-top: 10px;
    color: #526158;
}

.works-renewal .wk-environment-list {
    display: grid;
    gap: 12px;
}

.works-renewal .wk-environment-list > div {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    min-width: 0;
    padding: 21px 22px;
    border: 1px solid #d7e8dd;
    border-radius: 10px;
    background: #fff;
}

.works-renewal .wk-environment-list > div > span {
    display: flex;
    flex: 0 0 38px;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: var(--wk-green);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
}

.works-renewal .wk-environment-list > div > div {
    flex: 1 1 auto;
    min-width: 0;
}

.works-renewal .wk-environment-list strong {
    display: block;
    margin-bottom: 5px;
    color: var(--wk-text);
    font-size: 15px;
}

.works-renewal .wk-environment-list p {
    color: var(--wk-muted);
    font-size: 12px;
    line-height: 1.7;
}

/* Table */
.works-renewal .wk-list-section {
    background: #fff;
}

.works-renewal .wk-table-wrap {
    max-width: 1040px;
    margin: 0 auto;
    overflow: hidden;
    border: 1px solid var(--wk-line);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 10px 30px rgba(18,72,45,.04);
}

.works-renewal .wk-table {
    width: 100%;
    margin: 0;
    border-collapse: collapse;
    table-layout: fixed;
}

.works-renewal .wk-table th,
.works-renewal .wk-table td {
    width: auto;
    border: 0;
    border-bottom: 1px solid #e7eeea;
    vertical-align: middle;
}

.works-renewal .wk-table thead th {
    padding: 17px 20px;
    background: var(--wk-green-dark);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    text-align: left;
}

.works-renewal .wk-table thead th:nth-child(1) { width: 34%; }
.works-renewal .wk-table thead th:nth-child(2) { width: 29%; }
.works-renewal .wk-table thead th:nth-child(3) { width: 37%; }

.works-renewal .wk-table tbody td {
    padding: 16px 20px;
    color: var(--wk-text);
    font-size: 13px;
    line-height: 1.65;
    text-align: left;
}

.works-renewal .wk-table tbody tr:last-child td {
    border-bottom: 0;
}

.works-renewal .wk-table tbody tr:nth-child(even) td {
    background: #fbfdfc;
}

.works-renewal .wk-env-tag {
    display: inline-block;
    padding: 6px 10px;
    border-radius: 16px;
    background: var(--wk-soft);
    color: var(--wk-green-dark);
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}

.works-renewal .wk-env-standalone {
    background: #f2f4f3;
    color: #56625c;
}

.works-renewal .wk-env-vpn {
    background: #e8f4ed;
    color: #075b34;
}

.works-renewal .wk-table-note {
    max-width: 1040px;
    margin: 15px auto 0;
    color: var(--wk-muted);
    font-size: 11px;
    text-align: right;
}

/* Other industries */
.works-renewal .wk-other {
    background: var(--wk-green-deep);
}

.works-renewal .wk-other-inner {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(0,.9fr);
    gap: clamp(44px,6vw,72px);
    align-items: center;
}

.works-renewal .wk-other .wk-kicker {
    color: #9bd5b7;
}

.works-renewal .wk-other h2,
.works-renewal .wk-other-copy > p:not(.wk-kicker) {
    color: #fff;
}

.works-renewal .wk-other-copy h2 {
    margin-bottom: 20px;
}

.works-renewal .wk-other-copy > p:not(.wk-kicker) {
    margin-top: 9px;
    opacity: .8;
}

.works-renewal .wk-other-card {
    padding: 34px;
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 14px;
    background: rgba(255,255,255,.08);
}

.works-renewal .wk-other-card > span {
    display: block;
    margin-bottom: 12px;
    color: #9bd5b7;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .14em;
}

.works-renewal .wk-other-card > strong {
    display: block;
    margin-bottom: 12px;
    color: #fff;
    font-size: 21px;
    line-height: 1.55;
}

.works-renewal .wk-other-card p {
    color: rgba(255,255,255,.76);
    font-size: 14px;
    line-height: 1.85;
}

/* Next */
.works-renewal .wk-next {
    background: var(--wk-soft);
}

.works-renewal .wk-next-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 20px;
    max-width: 960px;
    margin: 0 auto;
}

.works-renewal .wk-next-card {
    min-width: 0;
    padding: 30px;
    border: 1px solid #d4e5da;
    border-radius: 12px;
    background: #fff;
}

.works-renewal .wk-next-card-main {
    border-color: #b8d8c4;
}

.works-renewal .wk-next-card > span {
    display: block;
    margin-bottom: 8px;
    color: var(--wk-green);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .14em;
}

.works-renewal .wk-next-card h3 {
    margin-bottom: 9px;
}

.works-renewal .wk-next-card p {
    margin-bottom: 15px;
    color: var(--wk-muted);
    font-size: 14px;
    line-height: 1.8;
}

.works-renewal .wk-next-card a {
    color: var(--wk-green-dark);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
}

/* Tablet */
@media screen and (max-width: 1040px) {
    .works-renewal .wk-hero-inner,
    .works-renewal .wk-environment-inner,
    .works-renewal .wk-other-inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .works-renewal .wk-hero-copy,
    .works-renewal .wk-stats,
    .works-renewal .wk-environment-copy,
    .works-renewal .wk-environment-list,
    .works-renewal .wk-other-copy,
    .works-renewal .wk-other-card {
        width: 100%;
        max-width: 820px;
    }

    .works-renewal .wk-industry-grid {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media screen and (max-width: 820px) {
    .works-renewal .wk-next-grid {
        grid-template-columns: 1fr;
    }
}

/* Smartphone */
@media screen and (max-width: 680px) {
    .works-renewal .wk-container {
        width: calc(100% - 30px);
    }

    .works-renewal .wk-section {
        padding: 70px 0;
    }

    .works-renewal .wk-section-head {
        margin-bottom: 36px;
    }

    .works-renewal h2 {
        font-size: 27px;
        line-height: 1.45;
    }

    .works-renewal p {
        font-size: 14px;
        line-height: 1.9;
    }

    .works-renewal .wk-hero {
        padding: 62px 0 68px;
    }

    .works-renewal .wk-hero h1 {
        font-size: 34px;
        line-height: 1.3;
        letter-spacing: -.025em;
    }

    .works-renewal .wk-hero-lead {
        font-size: 16px !important;
    }

    .works-renewal .wk-hero-buttons {
        display: grid;
        grid-template-columns: 1fr;
    }

    .works-renewal .wk-btn {
        width: 100%;
    }

    .works-renewal .wk-stats {
        grid-template-columns: 1fr;
        padding: 20px 15px;
    }

    .works-renewal .wk-stat-main {
        grid-row: auto;
    }

    .works-renewal .wk-industry-grid {
        grid-template-columns: 1fr;
    }

    /* Table -> cards */
    .works-renewal .wk-table-wrap {
        overflow: visible;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }

    .works-renewal .wk-table,
    .works-renewal .wk-table tbody,
    .works-renewal .wk-table tr,
    .works-renewal .wk-table td {
        display: block;
        width: 100%;
    }

    .works-renewal .wk-table thead {
        display: none;
    }

    .works-renewal .wk-table tbody tr {
        margin-bottom: 12px;
        padding: 16px 17px;
        border: 1px solid var(--wk-line);
        border-radius: 10px;
        background: #fff;
    }

    .works-renewal .wk-table tbody td,
    .works-renewal .wk-table tbody tr:nth-child(even) td {
        display: grid;
        grid-template-columns: 88px minmax(0,1fr);
        gap: 10px;
        padding: 6px 0;
        border: 0;
        background: transparent;
        font-size: 12px;
    }

    .works-renewal .wk-table tbody td::before {
        content: attr(data-label);
        color: var(--wk-muted);
        font-size: 11px;
        font-weight: 700;
    }

    .works-renewal .wk-env-tag {
        justify-self: start;
        white-space: normal;
    }

    .works-renewal .wk-table-note {
        text-align: left;
    }

    .works-renewal .wk-other-card {
        padding: 26px 22px;
    }
}


/* =========================================================
   SPEC PAGE RENEWAL
   Scope: .spec-renewal
========================================================= */

.spec-renewal {
    --sp-green: #16824b;
    --sp-green-dark: #0b5635;
    --sp-green-deep: #163129;
    --sp-soft: #eff8f3;
    --sp-pale: #f7fbf8;
    --sp-line: #dcebe2;
    --sp-text: #26352e;
    --sp-muted: #66736c;
    --sp-shadow: 0 16px 44px rgba(18,72,45,.09);
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
    color: var(--sp-text);
    background: #fff;
}

.spec-renewal,
.spec-renewal *,
.spec-renewal *::before,
.spec-renewal *::after {
    box-sizing: border-box;
}

.spec-renewal .sp-container {
    width: calc(100% - 48px);
    max-width: 1160px;
    margin-left: auto;
    margin-right: auto;
}

.spec-renewal p,
.spec-renewal a,
.spec-renewal span,
.spec-renewal small,
.spec-renewal strong,
.spec-renewal h1,
.spec-renewal h2,
.spec-renewal h3 {
    font-family: 'Noto Sans Japanese', 'Noto Sans JP', sans-serif;
}

.spec-renewal p {
    margin: 0;
    color: var(--sp-text);
    font-size: 16px;
    line-height: 1.95;
}

.spec-renewal h1,
.spec-renewal h2,
.spec-renewal h3 {
    width: auto;
    margin: 0;
    color: var(--sp-text);
    font-weight: 700;
    text-align: left;
    word-break: normal;
    overflow-wrap: normal;
    line-break: strict;
    text-wrap: balance;
}

.spec-renewal h2 {
    font-size: clamp(30px,3.5vw,42px);
    line-height: 1.4;
    letter-spacing: -.02em;
}

.spec-renewal h3 {
    font-size: 21px;
    line-height: 1.5;
}

.spec-renewal strong { font-weight: 700; }

.spec-renewal .sp-section {
    padding: 96px 0;
}

.spec-renewal .sp-section-head {
    max-width: 900px;
    margin: 0 auto 52px;
    padding: 0;
    text-align: center;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.spec-renewal .sp-section-head h2,
.spec-renewal .sp-section-head > p {
    text-align: center;
}

.spec-renewal .sp-section-head > p:last-child {
    max-width: 760px;
    margin: 18px auto 0;
    color: var(--sp-muted);
}

.spec-renewal .sp-eyebrow,
.spec-renewal .sp-kicker {
    margin: 0 0 14px;
    color: var(--sp-green);
    font-size: 12px;
    line-height: 1.4;
    font-weight: 800;
    letter-spacing: .14em;
}

/* Hero */
.spec-renewal .sp-hero {
    position: relative;
    padding: 90px 0 96px;
    overflow: hidden;
    background: linear-gradient(135deg,#f7fbf8 0%,#eff8f3 100%);
}

.spec-renewal .sp-hero::after {
    content: "";
    position: absolute;
    top: -180px;
    right: -130px;
    width: 470px;
    height: 470px;
    border-radius: 50%;
    background: rgba(22,130,75,.05);
}

.spec-renewal .sp-hero-inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0,.93fr) minmax(0,1.07fr);
    gap: clamp(46px,6vw,76px);
    align-items: center;
}

.spec-renewal .sp-hero-copy,
.spec-renewal .sp-hero-visual,
.spec-renewal .sp-requirements-copy,
.spec-renewal .sp-spec-list,
.spec-renewal .sp-cloud-copy,
.spec-renewal .sp-cloud-card,
.spec-renewal .sp-detail-copy,
.spec-renewal .sp-detail-card {
    min-width: 0;
}

.spec-renewal .sp-hero h1 {
    margin-bottom: 24px;
    font-size: clamp(42px,5vw,60px);
    line-height: 1.24;
    letter-spacing: -.04em;
}

.spec-renewal .sp-hero h1 span { color: var(--sp-green); }

.spec-renewal .sp-hero-lead {
    margin-bottom: 12px !important;
    font-size: 18px !important;
    line-height: 1.85 !important;
    font-weight: 700;
}

.spec-renewal .sp-hero-copy > p:not(.sp-eyebrow):not(.sp-hero-lead) {
    color: #4e5d55;
}

.spec-renewal .sp-hero-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 30px;
}

.spec-renewal .sp-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    padding: 0 28px;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
}

.spec-renewal .sp-btn-primary {
    background: var(--sp-green);
    color: #fff;
    box-shadow: 0 10px 26px rgba(22,130,75,.17);
}

.spec-renewal .sp-btn-secondary {
    border: 1px solid #bfd8ca;
    background: #fff;
    color: var(--sp-green-dark);
}

.spec-renewal .sp-hero-visual {
    padding: 28px;
    border: 1px solid #d8e8df;
    border-radius: 16px;
    background: rgba(255,255,255,.96);
    box-shadow: var(--sp-shadow);
}

.spec-renewal .sp-device-row {
    display: flex;
    align-items: center;
}

.spec-renewal .sp-device-card {
    flex: 1 1 0;
    min-width: 0;
    padding: 22px 12px;
    border: 1px solid var(--sp-line);
    border-radius: 10px;
    background: var(--sp-pale);
    text-align: center;
}

.spec-renewal .sp-device-card-center {
    background: var(--sp-green-dark);
    border-color: var(--sp-green-dark);
}

.spec-renewal .sp-device-card span,
.spec-renewal .sp-device-card strong,
.spec-renewal .sp-device-card small {
    display: block;
    text-align: center;
}

.spec-renewal .sp-device-card span {
    margin-bottom: 5px;
    color: var(--sp-green);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .12em;
}

.spec-renewal .sp-device-card strong {
    color: var(--sp-text);
    font-size: 14px;
}

.spec-renewal .sp-device-card small {
    margin-top: 4px;
    color: var(--sp-muted);
    font-size: 10px;
    line-height: 1.5;
}

.spec-renewal .sp-device-card-center span { color:#9bd5b7; }
.spec-renewal .sp-device-card-center strong,
.spec-renewal .sp-device-card-center small { color:#fff; }

.spec-renewal .sp-connect {
    flex: 0 0 28px;
    height: 2px;
    background: #a9c9b7;
}

.spec-renewal .sp-cloud-note {
    margin-top: 16px;
    padding: 16px 18px;
    border-radius: 9px;
    background: var(--sp-soft);
}

.spec-renewal .sp-cloud-note span {
    display: block;
    margin-bottom: 4px;
    color: var(--sp-green);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .12em;
}

.spec-renewal .sp-cloud-note strong {
    color: var(--sp-green-dark);
    font-size: 13px;
}

/* Basics */
.spec-renewal .sp-basics { background:#fff; }

.spec-renewal .sp-basic-grid {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 17px;
}

.spec-renewal .sp-basic-card {
    min-width: 0;
    padding: 27px 23px;
    border: 1px solid var(--sp-line);
    border-radius: 12px;
    background: #fff;
}

.spec-renewal .sp-no {
    display:flex;
    align-items:center;
    justify-content:center;
    width:38px;
    height:38px;
    margin-bottom:16px;
    border-radius:50%;
    background:var(--sp-green);
    color:#fff;
    font-size:11px;
    font-weight:800;
}

.spec-renewal .sp-basic-card h3 {
    margin-bottom:8px;
    font-size:17px;
}

.spec-renewal .sp-basic-card p {
    color:var(--sp-muted);
    font-size:13px;
    line-height:1.75;
}

/* Patterns */
.spec-renewal .sp-patterns { background:var(--sp-pale); }

.spec-renewal .sp-pattern-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:20px;
}

.spec-renewal .sp-pattern-card {
    min-width:0;
    padding:28px 25px;
    border:1px solid #d6e6dc;
    border-radius:14px;
    background:#fff;
}

.spec-renewal .sp-pattern-card-accent { border-color:#9ecab0; }

.spec-renewal .sp-pattern-top > span {
    display:flex;
    align-items:center;
    justify-content:center;
    width:38px;
    height:38px;
    margin-bottom:14px;
    border-radius:50%;
    background:var(--sp-green);
    color:#fff;
    font-size:11px;
    font-weight:800;
}

.spec-renewal .sp-pattern-top > p {
    margin-bottom:4px;
    color:var(--sp-green);
    font-size:9px;
    line-height:1.4;
    font-weight:800;
    letter-spacing:.12em;
}

.spec-renewal .sp-pattern-top h3 { font-size:20px; }

.spec-renewal .sp-pattern-diagram {
    min-height:106px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:22px 0;
    padding:17px;
    border-radius:10px;
    background:var(--sp-soft);
}

.spec-renewal .sp-pc-icon,
.spec-renewal .sp-data-icon {
    min-width:70px;
    padding:12px 8px;
    border:1px solid #cfe2d6;
    border-radius:8px;
    background:#fff;
    text-align:center;
}

.spec-renewal .sp-data-icon {
    background:var(--sp-green-dark);
    border-color:var(--sp-green-dark);
}

.spec-renewal .sp-pc-icon b,
.spec-renewal .sp-pc-icon small,
.spec-renewal .sp-data-icon b,
.spec-renewal .sp-data-icon small {
    display:block;
    text-align:center;
}

.spec-renewal .sp-pc-icon b {
    color:var(--sp-green-dark);
    font-size:12px;
}
.spec-renewal .sp-pc-icon small {
    margin-top:3px;
    color:var(--sp-muted);
    font-size:9px;
}
.spec-renewal .sp-data-icon b,
.spec-renewal .sp-data-icon small { color:#fff; }
.spec-renewal .sp-data-icon b { font-size:12px; }
.spec-renewal .sp-data-icon small {
    margin-top:3px;
    font-size:9px;
    opacity:.75;
}

.spec-renewal .sp-pattern-network i {
    width:30px;
    height:2px;
    background:#8fb9a1;
}

.spec-renewal .sp-pattern-text {
    min-height:78px;
    color:var(--sp-muted);
    font-size:13px;
    line-height:1.75;
}

.spec-renewal .sp-checks {
    margin:18px 0 0;
    padding:0;
    list-style:none;
}

.spec-renewal .sp-checks li {
    position:relative;
    margin:7px 0;
    padding-left:24px;
    color:#44534a;
    font-size:12px;
    line-height:1.7;
}

.spec-renewal .sp-checks li::before {
    content:"";
    position:absolute;
    left:5px;
    top:3px;
    width:6px;
    height:11px;
    border-right:2px solid var(--sp-green);
    border-bottom:2px solid var(--sp-green);
    transform:rotate(45deg);
}

/* Requirements */
.spec-renewal .sp-requirements { background:var(--sp-soft); }

.spec-renewal .sp-requirements-inner {
    display:grid;
    grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
    gap:clamp(44px,6vw,72px);
    align-items:center;
}

.spec-renewal .sp-requirements-copy h2 { margin-bottom:22px; }
.spec-renewal .sp-requirements-copy > p:not(.sp-kicker) {
    margin-top:10px;
    color:#526158;
}

.spec-renewal .sp-spec-list {
    display:grid;
    gap:12px;
}

.spec-renewal .sp-spec-list > div,
.spec-renewal .sp-check-card {
    display:flex;
    align-items:flex-start;
    gap:16px;
    min-width:0;
    padding:20px 22px;
    border:1px solid #d7e8dd;
    border-radius:10px;
    background:#fff;
}

.spec-renewal .sp-spec-list > div > span {
    display:flex;
    flex:0 0 36px;
    align-items:center;
    justify-content:center;
    width:36px;
    height:36px;
    border-radius:50%;
    background:var(--sp-green);
    color:#fff;
    font-size:11px;
    font-weight:800;
}

.spec-renewal .sp-spec-list > div > div { flex:1 1 auto; min-width:0; }
.spec-renewal .sp-spec-list strong {
    display:block;
    margin-bottom:4px;
    color:var(--sp-text);
    font-size:15px;
}
.spec-renewal .sp-spec-list p {
    color:var(--sp-muted);
    font-size:12px;
    line-height:1.7;
}

/* Network */
.spec-renewal .sp-network { background:#fff; }

.spec-renewal .sp-network-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
}

.spec-renewal .sp-network-card {
    min-width:0;
    padding:28px 25px;
    border:1px solid var(--sp-line);
    border-radius:12px;
    background:#fff;
}

.spec-renewal .sp-network-card > span {
    display:inline-block;
    margin-bottom:13px;
    padding:5px 9px;
    border-radius:15px;
    background:var(--sp-soft);
    color:var(--sp-green);
    font-size:10px;
    font-weight:800;
    letter-spacing:.1em;
}

.spec-renewal .sp-network-card h3 { margin-bottom:8px; }
.spec-renewal .sp-network-card p {
    color:var(--sp-muted);
    font-size:13px;
    line-height:1.8;
}

/* Cloud */
.spec-renewal .sp-cloud { background:var(--sp-green-deep); }

.spec-renewal .sp-cloud-inner,
.spec-renewal .sp-detail-inner {
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,.9fr);
    gap:clamp(44px,6vw,72px);
    align-items:center;
}

.spec-renewal .sp-cloud .sp-kicker { color:#9bd5b7; }
.spec-renewal .sp-cloud h2,
.spec-renewal .sp-cloud-copy > p:not(.sp-kicker) { color:#fff; }
.spec-renewal .sp-cloud-copy h2 { margin-bottom:20px; }
.spec-renewal .sp-cloud-copy > p:not(.sp-kicker) {
    margin-top:9px;
    opacity:.8;
}

.spec-renewal .sp-cloud-card,
.spec-renewal .sp-detail-card {
    padding:34px;
    border:1px solid rgba(255,255,255,.15);
    border-radius:14px;
    background:rgba(255,255,255,.08);
}

.spec-renewal .sp-cloud-card > span {
    display:block;
    margin-bottom:12px;
    color:#9bd5b7;
    font-size:10px;
    font-weight:800;
    letter-spacing:.14em;
}

.spec-renewal .sp-cloud-card > strong {
    display:block;
    margin-bottom:12px;
    color:#fff;
    font-size:21px;
    line-height:1.55;
}

.spec-renewal .sp-cloud-card p {
    color:rgba(255,255,255,.76);
    font-size:14px;
    line-height:1.85;
}

/* Check */
.spec-renewal .sp-check { background:var(--sp-pale); }

.spec-renewal .sp-check-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
}

.spec-renewal .sp-check-card {
    display:block;
    padding:27px 24px;
}

.spec-renewal .sp-check-card > span {
    display:flex;
    align-items:center;
    justify-content:center;
    width:38px;
    height:38px;
    margin-bottom:16px;
    border-radius:50%;
    background:var(--sp-green);
    color:#fff;
    font-size:11px;
    font-weight:800;
}

.spec-renewal .sp-check-card h3 {
    margin-bottom:8px;
    font-size:17px;
}

.spec-renewal .sp-check-card p {
    color:var(--sp-muted);
    font-size:13px;
    line-height:1.8;
}

/* Detail */
.spec-renewal .sp-detail { background:#fff; }

.spec-renewal .sp-detail-copy h2 { margin-bottom:20px; }
.spec-renewal .sp-detail-copy > p:not(.sp-kicker) { color:#526158; }

.spec-renewal .sp-detail-card {
    border-color:#d7e8dd;
    background:var(--sp-soft);
}

.spec-renewal .sp-detail-card > span {
    display:block;
    margin-bottom:10px;
    color:var(--sp-green);
    font-size:10px;
    font-weight:800;
    letter-spacing:.14em;
}

.spec-renewal .sp-detail-card > strong {
    display:block;
    margin-bottom:10px;
    color:var(--sp-green-dark);
    font-size:20px;
    line-height:1.55;
}

.spec-renewal .sp-detail-card p {
    color:var(--sp-muted);
    font-size:13px;
    line-height:1.8;
}

.spec-renewal .sp-detail-card a {
    display:inline-block;
    margin-top:16px;
    color:var(--sp-green-dark);
    font-size:13px;
    font-weight:700;
    text-decoration:none;
}

/* Next */
.spec-renewal .sp-next { background:var(--sp-soft); }

.spec-renewal .sp-next-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:20px;
    max-width:960px;
    margin:0 auto;
}

.spec-renewal .sp-next-card {
    min-width:0;
    padding:30px;
    border:1px solid #d4e5da;
    border-radius:12px;
    background:#fff;
}

.spec-renewal .sp-next-card > span {
    display:block;
    margin-bottom:8px;
    color:var(--sp-green);
    font-size:10px;
    font-weight:800;
    letter-spacing:.14em;
}

.spec-renewal .sp-next-card h3 { margin-bottom:9px; }
.spec-renewal .sp-next-card p {
    margin-bottom:15px;
    color:var(--sp-muted);
    font-size:14px;
    line-height:1.8;
}
.spec-renewal .sp-next-card a {
    color:var(--sp-green-dark);
    font-size:14px;
    font-weight:700;
    text-decoration:none;
}

/* Tablet */
@media screen and (max-width:1040px) {
    .spec-renewal .sp-hero-inner,
    .spec-renewal .sp-requirements-inner,
    .spec-renewal .sp-cloud-inner,
    .spec-renewal .sp-detail-inner {
        grid-template-columns:1fr;
        gap:40px;
    }

    .spec-renewal .sp-hero-copy,
    .spec-renewal .sp-hero-visual,
    .spec-renewal .sp-requirements-copy,
    .spec-renewal .sp-spec-list,
    .spec-renewal .sp-cloud-copy,
    .spec-renewal .sp-cloud-card,
    .spec-renewal .sp-detail-copy,
    .spec-renewal .sp-detail-card {
        width:100%;
        max-width:820px;
    }

    .spec-renewal .sp-basic-grid {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .spec-renewal .sp-pattern-grid,
    .spec-renewal .sp-network-grid,
    .spec-renewal .sp-check-grid {
        grid-template-columns:1fr;
    }

    .spec-renewal .sp-pattern-card,
    .spec-renewal .sp-network-card,
    .spec-renewal .sp-check-card {
        max-width:820px;
    }

    .spec-renewal .sp-pattern-text { min-height:0; }
}

@media screen and (max-width:820px) {
    .spec-renewal .sp-next-grid { grid-template-columns:1fr; }
}

/* Smartphone */
@media screen and (max-width:680px) {
    .spec-renewal .sp-container { width:calc(100% - 30px); }

    .spec-renewal .sp-section { padding:70px 0; }

    .spec-renewal .sp-section-head { margin-bottom:36px; }

    .spec-renewal h2 {
        font-size:27px;
        line-height:1.45;
    }

    .spec-renewal p {
        font-size:14px;
        line-height:1.9;
    }

    .spec-renewal .sp-hero { padding:62px 0 68px; }

    .spec-renewal .sp-hero h1 {
        font-size:34px;
        line-height:1.3;
        letter-spacing:-.025em;
    }

    .spec-renewal .sp-hero-lead { font-size:16px !important; }

    .spec-renewal .sp-hero-buttons {
        display:grid;
        grid-template-columns:1fr;
    }

    .spec-renewal .sp-btn { width:100%; }

    .spec-renewal .sp-hero-visual { padding:20px 15px; }

    .spec-renewal .sp-device-row {
        flex-direction:column;
        gap:0;
    }

    .spec-renewal .sp-device-card { width:100%; }

    .spec-renewal .sp-connect {
        width:2px;
        height:20px;
        flex:0 0 20px;
    }

    .spec-renewal .sp-basic-grid { grid-template-columns:1fr; }

    .spec-renewal .sp-pattern-diagram {
        padding:14px 8px;
    }

    .spec-renewal .sp-pattern-network i { width:18px; }

    .spec-renewal .sp-cloud-card,
    .spec-renewal .sp-detail-card { padding:26px 22px; }
}


/* =========================================================
   SUPPORT PAGE RENEWAL
   Scope: .support-renewal
========================================================= */

.support-renewal {
    --su-green:#16824b;
    --su-green-dark:#0b5635;
    --su-green-deep:#163129;
    --su-soft:#eff8f3;
    --su-pale:#f7fbf8;
    --su-line:#dcebe2;
    --su-text:#26352e;
    --su-muted:#66736c;
    --su-shadow:0 16px 44px rgba(18,72,45,.09);
    width:100%;
    max-width:100%;
    overflow-x:clip;
    color:var(--su-text);
    background:#fff;
}

.support-renewal,
.support-renewal *,
.support-renewal *::before,
.support-renewal *::after { box-sizing:border-box; }

.support-renewal .su-container {
    width:calc(100% - 48px);
    max-width:1160px;
    margin-left:auto;
    margin-right:auto;
}

.support-renewal p,
.support-renewal li,
.support-renewal a,
.support-renewal span,
.support-renewal small,
.support-renewal em,
.support-renewal strong,
.support-renewal h1,
.support-renewal h2,
.support-renewal h3 {
    font-family:'Noto Sans Japanese','Noto Sans JP',sans-serif;
}

.support-renewal p {
    margin:0;
    color:var(--su-text);
    font-size:16px;
    line-height:1.95;
}

.support-renewal h1,
.support-renewal h2,
.support-renewal h3 {
    width:auto;
    margin:0;
    color:var(--su-text);
    font-weight:700;
    text-align:left;
    word-break:normal;
    overflow-wrap:normal;
    line-break:strict;
    text-wrap:balance;
}

.support-renewal h2 {
    font-size:clamp(30px,3.5vw,42px);
    line-height:1.4;
    letter-spacing:-.02em;
}

.support-renewal h3 { font-size:21px; line-height:1.5; }

.support-renewal strong { font-weight:700; }

.support-renewal .su-section { padding:96px 0; }

.support-renewal .su-section-head {
    max-width:900px;
    margin:0 auto 52px;
    padding:0;
    text-align:center;
    background:transparent;
    border:0;
    box-shadow:none;
}

.support-renewal .su-section-head h2,
.support-renewal .su-section-head > p { text-align:center; }

.support-renewal .su-section-head > p:last-child {
    max-width:780px;
    margin:18px auto 0;
    color:var(--su-muted);
}

.support-renewal .su-eyebrow,
.support-renewal .su-kicker {
    margin:0 0 14px;
    color:var(--su-green);
    font-size:12px;
    line-height:1.4;
    font-weight:800;
    letter-spacing:.14em;
}

/* HERO */
.support-renewal .su-hero {
    position:relative;
    padding:90px 0 96px;
    overflow:hidden;
    background:linear-gradient(135deg,#f7fbf8 0%,#eff8f3 100%);
}

.support-renewal .su-hero::after {
    content:"";
    position:absolute;
    top:-180px;
    right:-130px;
    width:470px;
    height:470px;
    border-radius:50%;
    background:rgba(22,130,75,.05);
}

.support-renewal .su-hero-inner {
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);
    gap:clamp(46px,6vw,76px);
    align-items:center;
}

.support-renewal .su-hero-copy,
.support-renewal .su-hero-panel,
.support-renewal .su-boundary-copy,
.support-renewal .su-scope-cards,
.support-renewal .su-company-copy,
.support-renewal .su-company-card { min-width:0; }

.support-renewal .su-hero h1 {
    margin-bottom:24px;
    font-size:clamp(42px,5vw,60px);
    line-height:1.24;
    letter-spacing:-.04em;
}

.support-renewal .su-hero h1 span { color:var(--su-green); }

.support-renewal .su-hero-lead {
    margin-bottom:12px !important;
    font-size:18px !important;
    line-height:1.85 !important;
    font-weight:700;
}

.support-renewal .su-hero-copy > p:not(.su-eyebrow):not(.su-hero-lead) { color:#4e5d55; }

.support-renewal .su-hero-buttons {
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:30px;
}

.support-renewal .su-btn {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:54px;
    padding:0 28px;
    border-radius:8px;
    font-size:15px;
    font-weight:700;
    text-decoration:none;
}

.support-renewal .su-btn-primary {
    background:var(--su-green);
    color:#fff;
    box-shadow:0 10px 26px rgba(22,130,75,.17);
}

.support-renewal .su-btn-secondary {
    border:1px solid #bfd8ca;
    background:#fff;
    color:var(--su-green-dark);
}

.support-renewal .su-hero-panel {
    padding:30px;
    border:1px solid #d8e8df;
    border-radius:16px;
    background:rgba(255,255,255,.96);
    box-shadow:var(--su-shadow);
}

.support-renewal .su-panel-label {
    margin-bottom:13px;
    color:var(--su-green);
    font-size:10px;
    line-height:1.4;
    font-weight:800;
    letter-spacing:.14em;
}

.support-renewal .su-panel-price {
    padding:23px 22px;
    border-radius:11px;
    background:var(--su-green-dark);
}

.support-renewal .su-panel-price > span,
.support-renewal .su-panel-price > strong,
.support-renewal .su-panel-price > em {
    display:block;
    color:#fff;
}

.support-renewal .su-panel-price > span {
    margin-bottom:6px;
    color:#9bd5b7;
    font-size:12px;
    font-weight:700;
}

.support-renewal .su-panel-price > strong {
    font-size:clamp(34px,4vw,46px);
    line-height:1.1;
    white-space:nowrap;
}

.support-renewal .su-panel-price strong small {
    margin-left:5px;
    font-size:15px;
}

.support-renewal .su-panel-price > em {
    margin-top:5px;
    font-size:10px;
    font-style:normal;
    opacity:.7;
}

.support-renewal .su-panel-list {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px;
    margin-top:13px;
}

.support-renewal .su-panel-list > div {
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
    padding:12px 13px;
    border:1px solid var(--su-line);
    border-radius:8px;
    background:var(--su-pale);
}

.support-renewal .su-panel-list span {
    display:flex;
    flex:0 0 28px;
    align-items:center;
    justify-content:center;
    width:28px;
    height:28px;
    border-radius:50%;
    background:var(--su-green);
    color:#fff;
    font-size:9px;
    font-weight:800;
}

.support-renewal .su-panel-list strong {
    min-width:0;
    color:var(--su-text);
    font-size:11px;
    line-height:1.55;
}

.support-renewal .su-panel-note {
    margin-top:13px;
    color:var(--su-muted);
    font-size:11px;
    line-height:1.65;
}

/* POLICY */
.support-renewal .su-policy { background:#fff; }

.support-renewal .su-policy-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
}

.support-renewal .su-policy-card {
    min-width:0;
    padding:28px 25px;
    border:1px solid var(--su-line);
    border-radius:12px;
    background:#fff;
}

.support-renewal .su-no {
    display:flex;
    align-items:center;
    justify-content:center;
    width:38px;
    height:38px;
    margin-bottom:16px;
    border-radius:50%;
    background:var(--su-green);
    color:#fff;
    font-size:11px;
    font-weight:800;
}

.support-renewal .su-policy-card h3 { margin-bottom:8px; font-size:18px; }

.support-renewal .su-policy-card p {
    color:var(--su-muted);
    font-size:13px;
    line-height:1.8;
}

/* MENU */
.support-renewal .su-menu { background:var(--su-pale); }

.support-renewal .su-menu-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
}

.support-renewal .su-menu-card {
    display:flex;
    align-items:flex-start;
    gap:17px;
    min-width:0;
    padding:25px 24px;
    border:1px solid #d7e7dd;
    border-radius:11px;
    background:#fff;
}

.support-renewal .su-menu-card > span {
    display:flex;
    flex:0 0 38px;
    align-items:center;
    justify-content:center;
    width:38px;
    height:38px;
    border-radius:50%;
    background:var(--su-soft);
    color:var(--su-green);
    font-size:11px;
    font-weight:800;
}

.support-renewal .su-menu-card > div { flex:1 1 auto; min-width:0; }

.support-renewal .su-menu-card h3 { margin-bottom:7px; font-size:17px; }

.support-renewal .su-menu-card p {
    color:var(--su-muted);
    font-size:13px;
    line-height:1.8;
}

/* PRICE */
.support-renewal .su-price { background:var(--su-soft); }

.support-renewal .su-price-wrap {
    display:grid;
    grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);
    gap:18px;
    max-width:900px;
    margin:0 auto;
}

.support-renewal .su-price-main,
.support-renewal .su-price-more {
    min-width:0;
    padding:29px 27px;
    border-radius:13px;
}

.support-renewal .su-price-main { background:var(--su-green-dark); }

.support-renewal .su-price-main p,
.support-renewal .su-price-main strong,
.support-renewal .su-price-main small { display:block; color:#fff; }

.support-renewal .su-price-main p {
    margin-bottom:9px;
    color:#9bd5b7;
    font-size:13px;
    font-weight:700;
}

.support-renewal .su-price-main strong {
    font-size:42px;
    line-height:1.1;
    white-space:nowrap;
}

.support-renewal .su-price-main strong span {
    margin-left:5px;
    font-size:14px;
}

.support-renewal .su-price-main small {
    margin-top:5px;
    font-size:10px;
    opacity:.7;
}

.support-renewal .su-price-more {
    border:1px solid #cee2d5;
    background:#fff;
}

.support-renewal .su-price-more > span {
    display:block;
    margin-bottom:8px;
    color:var(--su-green);
    font-size:11px;
    font-weight:800;
}

.support-renewal .su-price-more > strong {
    display:block;
    margin-bottom:9px;
    color:var(--su-green-dark);
    font-size:20px;
    line-height:1.5;
}

.support-renewal .su-price-more p {
    color:var(--su-muted);
    font-size:13px;
    line-height:1.75;
}

.support-renewal .su-price-more a,
.support-renewal .su-text-link {
    display:inline-block;
    margin-top:15px;
    color:var(--su-green-dark);
    font-size:13px;
    font-weight:700;
    text-decoration:none;
}

.support-renewal .su-price-notes {
    max-width:900px;
    margin:17px auto 0;
}

.support-renewal .su-price-notes p {
    color:var(--su-muted);
    font-size:11px;
    line-height:1.65;
}

/* BOUNDARY */
.support-renewal .su-boundary { background:#fff; }

.support-renewal .su-boundary-inner,
.support-renewal .su-company-inner {
    display:grid;
    grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
    gap:clamp(44px,6vw,72px);
    align-items:center;
}

.support-renewal .su-boundary-copy h2,
.support-renewal .su-company-copy h2 { margin-bottom:20px; }

.support-renewal .su-boundary-copy > p:not(.su-kicker),
.support-renewal .su-company-copy > p:not(.su-kicker) {
    margin-top:9px;
    color:#526158;
}

.support-renewal .su-scope-cards {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:13px;
}

.support-renewal .su-scope-card {
    min-width:0;
    padding:25px 22px;
    border:1px solid var(--su-line);
    border-radius:11px;
    background:var(--su-pale);
}

.support-renewal .su-scope-card-in {
    border-color:#b9d9c6;
    background:var(--su-soft);
}

.support-renewal .su-scope-card > span {
    display:block;
    margin-bottom:8px;
    color:var(--su-green);
    font-size:9px;
    font-weight:800;
    letter-spacing:.12em;
}

.support-renewal .su-scope-card > strong {
    display:block;
    margin-bottom:14px;
    color:var(--su-text);
    font-size:17px;
}

.support-renewal .su-scope-card ul {
    margin:0;
    padding:0;
    list-style:none;
}

.support-renewal .su-scope-card li {
    position:relative;
    margin:7px 0;
    padding-left:22px;
    color:var(--su-muted);
    font-size:12px;
    line-height:1.7;
}

.support-renewal .su-scope-card li::before {
    content:"";
    position:absolute;
    left:5px;
    top:3px;
    width:6px;
    height:11px;
    border-right:2px solid var(--su-green);
    border-bottom:2px solid var(--su-green);
    transform:rotate(45deg);
}

/* NON MEMBER */
.support-renewal .su-nonmember { background:var(--su-pale); }

.support-renewal .su-nonmember-box {
    display:grid;
    grid-template-columns:minmax(0,1fr) 64px minmax(0,1fr);
    align-items:stretch;
    max-width:900px;
    margin:0 auto;
}

.support-renewal .su-nonmember-box > div:not(.su-vs) {
    min-width:0;
    padding:27px 25px;
    border:1px solid var(--su-line);
    border-radius:12px;
    background:#fff;
}

.support-renewal .su-nonmember-box > div:first-child {
    border-color:#aad0b9;
}

.support-renewal .su-nonmember-box > div > span {
    display:block;
    margin-bottom:8px;
    color:var(--su-green);
    font-size:11px;
    font-weight:800;
}

.support-renewal .su-nonmember-box > div > strong {
    display:block;
    margin-bottom:8px;
    color:var(--su-text);
    font-size:18px;
}

.support-renewal .su-nonmember-box > div > p {
    color:var(--su-muted);
    font-size:13px;
    line-height:1.8;
}

.support-renewal .su-vs {
    display:flex;
    align-items:center;
    justify-content:center;
    color:#8ca399;
    font-size:11px;
    font-weight:800;
}

/* COMPANY */
.support-renewal .su-company { background:var(--su-green-deep); }

.support-renewal .su-company .su-kicker { color:#9bd5b7; }

.support-renewal .su-company h2,
.support-renewal .su-company-copy > p:not(.su-kicker) { color:#fff; }

.support-renewal .su-company-copy > p:not(.su-kicker) { opacity:.8; }

.support-renewal .su-company-card {
    padding:32px;
    border:1px solid rgba(255,255,255,.15);
    border-radius:14px;
    background:rgba(255,255,255,.08);
}

.support-renewal .su-company-card > span {
    display:block;
    margin-bottom:9px;
    color:#9bd5b7;
    font-size:9px;
    font-weight:800;
    letter-spacing:.13em;
}

.support-renewal .su-company-card > strong {
    display:block;
    margin-bottom:14px;
    color:#fff;
    font-size:22px;
}

.support-renewal .su-company-card p {
    margin-top:5px;
    color:rgba(255,255,255,.78);
    font-size:13px;
    line-height:1.75;
}

.support-renewal .su-company-card a {
    display:inline-block;
    margin-top:16px;
    color:#b7dfc8;
    font-size:13px;
    font-weight:700;
    text-decoration:none;
}

/* NEXT */
.support-renewal .su-next { background:var(--su-soft); }

.support-renewal .su-next-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:20px;
    max-width:960px;
    margin:0 auto;
}

.support-renewal .su-next-card {
    min-width:0;
    padding:30px;
    border:1px solid #d4e5da;
    border-radius:12px;
    background:#fff;
}

.support-renewal .su-next-card-main { border-color:#b8d8c4; }

.support-renewal .su-next-card > span {
    display:block;
    margin-bottom:8px;
    color:var(--su-green);
    font-size:10px;
    font-weight:800;
    letter-spacing:.14em;
}

.support-renewal .su-next-card h3 { margin-bottom:9px; }

.support-renewal .su-next-card p {
    margin-bottom:15px;
    color:var(--su-muted);
    font-size:14px;
    line-height:1.8;
}

.support-renewal .su-next-card a {
    color:var(--su-green-dark);
    font-size:14px;
    font-weight:700;
    text-decoration:none;
}

/* TABLET */
@media screen and (max-width:1040px) {
    .support-renewal .su-hero-inner,
    .support-renewal .su-boundary-inner,
    .support-renewal .su-company-inner {
        grid-template-columns:1fr;
        gap:40px;
    }

    .support-renewal .su-hero-copy,
    .support-renewal .su-hero-panel,
    .support-renewal .su-boundary-copy,
    .support-renewal .su-scope-cards,
    .support-renewal .su-company-copy,
    .support-renewal .su-company-card {
        width:100%;
        max-width:820px;
    }

    .support-renewal .su-policy-grid { grid-template-columns:1fr; }

    .support-renewal .su-policy-card { max-width:820px; }
}

@media screen and (max-width:820px) {
    .support-renewal .su-menu-grid,
    .support-renewal .su-next-grid {
        grid-template-columns:1fr;
    }

    .support-renewal .su-price-wrap { grid-template-columns:1fr; }

    .support-renewal .su-nonmember-box {
        grid-template-columns:1fr;
        gap:10px;
    }

    .support-renewal .su-vs { min-height:30px; }
}

/* SMARTPHONE */
@media screen and (max-width:680px) {
    .support-renewal .su-container { width:calc(100% - 30px); }

    .support-renewal .su-section { padding:70px 0; }

    .support-renewal .su-section-head { margin-bottom:36px; }

    .support-renewal h2 {
        font-size:27px;
        line-height:1.45;
    }

    .support-renewal p {
        font-size:14px;
        line-height:1.9;
    }

    .support-renewal .su-hero { padding:62px 0 68px; }

    .support-renewal .su-hero h1 {
        font-size:34px;
        line-height:1.3;
        letter-spacing:-.025em;
    }

    .support-renewal .su-hero-lead { font-size:16px !important; }

    .support-renewal .su-hero-buttons {
        display:grid;
        grid-template-columns:1fr;
    }

    .support-renewal .su-btn { width:100%; }

    .support-renewal .su-hero-panel { padding:20px 15px; }

    .support-renewal .su-panel-list { grid-template-columns:1fr; }

    .support-renewal .su-menu-card { padding:21px 18px; }

    .support-renewal .su-scope-cards { grid-template-columns:1fr; }

    .support-renewal .su-price-main strong { font-size:36px; }

    .support-renewal .su-company-card { padding:26px 22px; }
}


/* =========================================================
   SUPPORT FINAL POLICY / PRICING UPDATE
========================================================= */
.support-renewal .su-section-head{
  background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important
}
.support-renewal .su-panel-benefit{
  margin-top:13px;padding:17px 18px;border:1px solid var(--su-line);
  border-radius:9px;background:var(--su-pale)
}
.support-renewal .su-panel-benefit>span{
  display:block;margin-bottom:5px;color:var(--su-green);font-size:9px;font-weight:800;letter-spacing:.12em
}
.support-renewal .su-panel-benefit>strong{
  display:block;margin-bottom:4px;color:var(--su-green-dark);font-size:15px;line-height:1.55
}
.support-renewal .su-panel-benefit p{
  color:var(--su-muted);font-size:11px;line-height:1.6
}

/* fee table */
.support-renewal .su-fee-table-wrap{
  max-width:900px;margin:0 auto;overflow:hidden;border:1px solid #cfe2d6;
  border-radius:14px;background:#fff;box-shadow:0 10px 28px rgba(18,72,45,.04)
}
.support-renewal .su-fee-table{
  width:100%;margin:0;border-collapse:collapse;table-layout:fixed
}
.support-renewal .su-fee-table th,
.support-renewal .su-fee-table td{
  width:auto;border:0;border-bottom:1px solid #e6eee9;vertical-align:middle
}
.support-renewal .su-fee-table thead th{
  padding:17px 20px;background:var(--su-green-dark);color:#fff;font-size:12px;font-weight:700;text-align:left
}
.support-renewal .su-fee-table thead th:nth-child(1){width:34%}
.support-renewal .su-fee-table thead th:nth-child(2){width:25%}
.support-renewal .su-fee-table thead th:nth-child(3){width:41%}
.support-renewal .su-fee-table tbody td{
  padding:18px 20px;background:#fff;color:var(--su-text);font-size:13px;line-height:1.6;text-align:left
}
.support-renewal .su-fee-table tbody tr:nth-child(even) td{background:#fbfdfc}
.support-renewal .su-fee-table tbody tr:last-child td{border-bottom:0}
.support-renewal .su-fee-table td strong{
  display:block;color:var(--su-green-dark);font-size:15px
}
.support-renewal .su-fee-table td span{
  display:inline-block;margin-top:4px;padding:3px 8px;border-radius:12px;
  background:var(--su-soft);color:var(--su-green);font-size:10px;font-weight:700
}

/* included service cards */
.support-renewal .su-included{background:var(--su-pale)}
.support-renewal .su-service-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px
}
.support-renewal .su-service-card{
  display:flex;align-items:flex-start;gap:17px;min-width:0;padding:25px 24px;
  border:1px solid #d7e7dd;border-radius:11px;background:#fff
}
.support-renewal .su-service-card>span{
  display:flex;flex:0 0 38px;align-items:center;justify-content:center;width:38px;height:38px;
  border-radius:50%;background:var(--su-soft);color:var(--su-green);font-size:11px;font-weight:800
}
.support-renewal .su-service-card>div{flex:1 1 auto;min-width:0}
.support-renewal .su-service-card h3{margin-bottom:7px;font-size:17px}
.support-renewal .su-service-card p{color:var(--su-muted);font-size:13px;line-height:1.8}

/* excluded */
.support-renewal .su-excluded{background:#fff}
.support-renewal .su-excluded-inner,
.support-renewal .su-data-inner{
  display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(44px,6vw,72px);align-items:center
}
.support-renewal .su-excluded-copy,.support-renewal .su-excluded-list,
.support-renewal .su-data-copy,.support-renewal .su-data-card{min-width:0}
.support-renewal .su-excluded-copy h2,.support-renewal .su-data-copy h2{margin-bottom:20px}
.support-renewal .su-excluded-copy>p:not(.su-kicker){margin-top:9px;color:#526158}
.support-renewal .su-excluded-list{display:grid;gap:10px}
.support-renewal .su-excluded-list>div{
  display:flex;align-items:flex-start;gap:15px;min-width:0;padding:18px 20px;
  border:1px solid var(--su-line);border-radius:10px;background:var(--su-pale)
}
.support-renewal .su-excluded-list>div>span{
  display:flex;flex:0 0 34px;align-items:center;justify-content:center;width:34px;height:34px;
  border-radius:50%;background:#e6efea;color:#66736c;font-size:10px;font-weight:800
}
.support-renewal .su-excluded-list p{
  flex:1 1 auto;min-width:0;padding-top:4px;color:var(--su-muted);font-size:13px;line-height:1.75
}

/* contract count */
.support-renewal .su-count{background:var(--su-soft)}
.support-renewal .su-count-flow{
  display:grid;grid-template-columns:minmax(0,1fr) 50px minmax(0,1fr) 50px minmax(0,1fr);
  align-items:stretch;max-width:1040px;margin:0 auto
}
.support-renewal .su-count-step{
  min-width:0;padding:25px 22px;border:1px solid #cfe2d6;border-radius:11px;background:#fff
}
.support-renewal .su-count-step>span{
  display:flex;align-items:center;justify-content:center;width:36px;height:36px;margin-bottom:13px;
  border-radius:50%;background:var(--su-green);color:#fff;font-size:10px;font-weight:800
}
.support-renewal .su-count-step strong{
  display:block;margin-bottom:7px;color:var(--su-text);font-size:15px;line-height:1.55
}
.support-renewal .su-count-step p{color:var(--su-muted);font-size:12px;line-height:1.75}
.support-renewal .su-count-arrow{
  display:flex;align-items:center;justify-content:center;color:#8eb09d;font-size:18px
}
.support-renewal .su-count-note{
  margin-top:18px;color:var(--su-muted);font-size:12px;text-align:center
}

/* data backup */
.support-renewal .su-data{background:var(--su-green-deep)}
.support-renewal .su-data .su-kicker{color:#9bd5b7}
.support-renewal .su-data h2,
.support-renewal .su-data-copy>p:not(.su-kicker){color:#fff}
.support-renewal .su-data-copy>p:not(.su-kicker){opacity:.8}
.support-renewal .su-data-card{
  padding:32px;border:1px solid rgba(255,255,255,.15);border-radius:14px;background:rgba(255,255,255,.08)
}
.support-renewal .su-data-card>span{
  display:block;margin-bottom:10px;color:#9bd5b7;font-size:9px;font-weight:800;letter-spacing:.13em
}
.support-renewal .su-data-card>strong{
  display:block;margin-bottom:12px;color:#fff;font-size:21px;line-height:1.55
}
.support-renewal .su-data-card p{
  color:rgba(255,255,255,.76);font-size:13px;line-height:1.85
}

/* customize note */
.support-renewal .su-customize-note{background:#fff}
.support-renewal .su-customize-inner{max-width:900px;text-align:center}
.support-renewal .su-customize-inner>div{
  padding:34px 36px;border:1px solid var(--su-line);border-radius:13px;background:var(--su-pale)
}
.support-renewal .su-customize-inner h2,
.support-renewal .su-customize-inner p{text-align:center}
.support-renewal .su-customize-inner h2{margin-bottom:18px}
.support-renewal .su-customize-inner p{
  max-width:760px;margin:8px auto 0;color:var(--su-muted);font-size:14px;line-height:1.85
}

@media screen and (max-width:1040px){
  .support-renewal .su-excluded-inner,
  .support-renewal .su-data-inner{grid-template-columns:1fr;gap:40px}
  .support-renewal .su-excluded-copy,.support-renewal .su-excluded-list,
  .support-renewal .su-data-copy,.support-renewal .su-data-card{width:100%;max-width:820px}
}
@media screen and (max-width:820px){
  .support-renewal .su-service-grid{grid-template-columns:1fr}
  .support-renewal .su-count-flow{grid-template-columns:1fr;gap:10px}
  .support-renewal .su-count-arrow{min-height:24px;transform:rotate(90deg)}
}
@media screen and (max-width:680px){
  .support-renewal .su-fee-table-wrap{
    overflow:visible;border:0;border-radius:0;background:transparent;box-shadow:none
  }
  .support-renewal .su-fee-table,
  .support-renewal .su-fee-table tbody,
  .support-renewal .su-fee-table tr,
  .support-renewal .su-fee-table td{display:block;width:100%}
  .support-renewal .su-fee-table thead{display:none}
  .support-renewal .su-fee-table tbody tr{
    margin-bottom:12px;padding:15px 17px;border:1px solid var(--su-line);border-radius:10px;background:#fff
  }
  .support-renewal .su-fee-table tbody td,
  .support-renewal .su-fee-table tbody tr:nth-child(even) td{
    display:grid;grid-template-columns:100px minmax(0,1fr);gap:10px;padding:7px 0;border:0;background:transparent
  }
  .support-renewal .su-fee-table tbody td::before{
    content:attr(data-label);color:var(--su-muted);font-size:11px;font-weight:700
  }
  .support-renewal .su-service-card{padding:21px 18px}
  .support-renewal .su-customize-inner>div{padding:27px 20px}
  .support-renewal .su-data-card{padding:26px 22px}
}


/* =========================================================
   FAQ PAGE RENEWAL
   Scope: .faq-renewal
========================================================= */

.faq-renewal {
    --fq-green:#16824b;
    --fq-green-dark:#0b5635;
    --fq-green-deep:#163129;
    --fq-soft:#eff8f3;
    --fq-pale:#f7fbf8;
    --fq-line:#dcebe2;
    --fq-text:#26352e;
    --fq-muted:#66736c;
    --fq-shadow:0 16px 44px rgba(18,72,45,.09);
    width:100%;
    max-width:100%;
    overflow-x:clip;
    color:var(--fq-text);
    background:#fff;
}

.faq-renewal,
.faq-renewal *,
.faq-renewal *::before,
.faq-renewal *::after { box-sizing:border-box; }

.faq-renewal .fq-container {
    width:calc(100% - 48px);
    max-width:1160px;
    margin-left:auto;
    margin-right:auto;
}

.faq-renewal p,
.faq-renewal li,
.faq-renewal a,
.faq-renewal span,
.faq-renewal strong,
.faq-renewal h1,
.faq-renewal h2,
.faq-renewal h3,
.faq-renewal summary,
.faq-renewal td,
.faq-renewal th {
    font-family:'Noto Sans Japanese','Noto Sans JP',sans-serif;
}

.faq-renewal p {
    margin:0;
    color:var(--fq-text);
    font-size:16px;
    line-height:1.95;
}

.faq-renewal h1,
.faq-renewal h2,
.faq-renewal h3 {
    width:auto;
    margin:0;
    color:var(--fq-text);
    font-weight:700;
    text-align:left;
    word-break:normal;
    overflow-wrap:normal;
    line-break:strict;
    text-wrap:balance;
}

.faq-renewal h2 {
    font-size:clamp(30px,3.5vw,42px);
    line-height:1.4;
    letter-spacing:-.02em;
}

.faq-renewal strong { font-weight:700; }

.faq-renewal .fq-section { padding:92px 0; }

.faq-renewal .fq-section-white { background:#fff; }
.faq-renewal .fq-section-soft { background:var(--fq-pale); }

.faq-renewal .fq-section-head {
    max-width:900px;
    margin:0 auto 42px;
    padding:0;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    text-align:center;
}

.faq-renewal .fq-section-head h2,
.faq-renewal .fq-section-head > p { text-align:center; }

.faq-renewal .fq-kicker,
.faq-renewal .fq-eyebrow {
    margin:0 0 13px;
    color:var(--fq-green);
    font-size:12px;
    line-height:1.4;
    font-weight:800;
    letter-spacing:.14em;
}

/* HERO */
.faq-renewal .fq-hero {
    position:relative;
    padding:88px 0 94px;
    overflow:hidden;
    background:linear-gradient(135deg,#f7fbf8 0%,#eff8f3 100%);
}

.faq-renewal .fq-hero::after {
    content:"";
    position:absolute;
    top:-180px;
    right:-130px;
    width:470px;
    height:470px;
    border-radius:50%;
    background:rgba(22,130,75,.05);
}

.faq-renewal .fq-hero-inner {
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);
    gap:clamp(44px,6vw,74px);
    align-items:center;
}

.faq-renewal .fq-hero-copy,
.faq-renewal .fq-hero-panel,
.faq-renewal .fq-other-copy,
.faq-renewal .fq-other-card { min-width:0; }

.faq-renewal .fq-hero h1 {
    margin-bottom:22px;
    font-size:clamp(44px,5vw,60px);
    line-height:1.2;
    letter-spacing:-.04em;
}

.faq-renewal .fq-hero-lead {
    margin-bottom:12px!important;
    font-size:18px!important;
    line-height:1.85!important;
    font-weight:700;
}

.faq-renewal .fq-hero-copy > p:not(.fq-eyebrow):not(.fq-hero-lead) {
    color:#4e5d55;
}

.faq-renewal .fq-hero-buttons {
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:30px;
}

.faq-renewal .fq-btn {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:54px;
    padding:0 28px;
    border-radius:8px;
    font-size:15px;
    font-weight:700;
    text-decoration:none;
}

.faq-renewal .fq-btn-primary {
    background:var(--fq-green);
    color:#fff;
    box-shadow:0 10px 26px rgba(22,130,75,.17);
}

.faq-renewal .fq-btn-secondary {
    border:1px solid #bfd8ca;
    background:#fff;
    color:var(--fq-green-dark);
}

.faq-renewal .fq-hero-panel {
    padding:28px;
    border:1px solid #d8e8df;
    border-radius:16px;
    background:rgba(255,255,255,.96);
    box-shadow:var(--fq-shadow);
}

.faq-renewal .fq-panel-label {
    margin-bottom:13px;
    color:var(--fq-green);
    font-size:10px;
    line-height:1.4;
    font-weight:800;
    letter-spacing:.14em;
}

.faq-renewal .fq-panel-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px;
}

.faq-renewal .fq-panel-grid a {
    display:flex;
    align-items:center;
    gap:11px;
    min-width:0;
    padding:14px 14px;
    border:1px solid var(--fq-line);
    border-radius:9px;
    background:var(--fq-pale);
    color:var(--fq-text);
    text-decoration:none;
}

.faq-renewal .fq-panel-grid a:last-child {
    grid-column:1 / -1;
}

.faq-renewal .fq-panel-grid a span {
    display:flex;
    flex:0 0 30px;
    align-items:center;
    justify-content:center;
    width:30px;
    height:30px;
    border-radius:50%;
    background:var(--fq-green);
    color:#fff;
    font-size:9px;
    font-weight:800;
}

.faq-renewal .fq-panel-grid a strong {
    min-width:0;
    color:var(--fq-text);
    font-size:11px;
    line-height:1.5;
}

/* FAQ LIST */
.faq-renewal .fq-list {
    max-width:960px;
    margin:0 auto;
    display:grid;
    gap:11px;
}

.faq-renewal .fq-item {
    width:100%;
    min-width:0;
    margin:0;
    padding:0;
    overflow:hidden;
    border:1px solid var(--fq-line);
    border-radius:11px;
    background:#fff;
}

.faq-renewal .fq-item summary {
    position:relative;
    display:flex;
    align-items:center;
    min-height:72px;
    padding:18px 64px 18px 58px;
    color:var(--fq-text);
    font-size:15px;
    line-height:1.65;
    font-weight:700;
    cursor:pointer;
    list-style:none;
}

.faq-renewal .fq-item summary::-webkit-details-marker { display:none; }

.faq-renewal .fq-item summary::before {
    content:"Q";
    position:absolute;
    left:20px;
    top:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    width:28px;
    height:28px;
    border-radius:50%;
    background:var(--fq-green);
    color:#fff;
    font-size:12px;
    font-weight:800;
    transform:translateY(-50%);
}

.faq-renewal .fq-item summary::after {
    content:"+";
    position:absolute;
    right:22px;
    top:50%;
    color:var(--fq-green);
    font-size:24px;
    line-height:1;
    font-weight:400;
    transform:translateY(-50%);
}

.faq-renewal .fq-item[open] summary::after { content:"-"; }

.faq-renewal .fq-item[open] summary {
    border-bottom:1px solid #e7eeea;
    background:#fbfdfc;
}

.faq-renewal .fq-answer {
    position:relative;
    padding:22px 28px 24px 58px;
}

.faq-renewal .fq-answer::before {
    content:"A";
    position:absolute;
    left:20px;
    top:24px;
    display:flex;
    align-items:center;
    justify-content:center;
    width:28px;
    height:28px;
    border-radius:50%;
    background:var(--fq-soft);
    color:var(--fq-green-dark);
    font-size:12px;
    font-weight:800;
}

.faq-renewal .fq-answer p {
    margin:0 0 10px;
    color:#526158;
    font-size:14px;
    line-height:1.85;
}

.faq-renewal .fq-answer p:last-child { margin-bottom:0; }

.faq-renewal .fq-answer ul {
    margin:12px 0 14px;
    padding:0;
    list-style:none;
}

.faq-renewal .fq-answer li {
    position:relative;
    margin:7px 0;
    padding-left:24px;
    color:#526158;
    font-size:13px;
    line-height:1.75;
}

.faq-renewal .fq-answer li::before {
    content:"";
    position:absolute;
    left:5px;
    top:3px;
    width:6px;
    height:11px;
    border-right:2px solid var(--fq-green);
    border-bottom:2px solid var(--fq-green);
    transform:rotate(45deg);
}

.faq-renewal .fq-answer a {
    display:inline-block;
    margin-top:5px;
    color:var(--fq-green-dark);
    font-size:13px;
    font-weight:700;
    text-decoration:none;
}

/* SUPPORT SECTION */
.faq-renewal .fq-section-support {
    background:var(--fq-green-deep);
}

.faq-renewal .fq-section-head-light .fq-kicker { color:#9bd5b7; }

.faq-renewal .fq-section-head-light h2,
.faq-renewal .fq-section-head-light > p:last-child {
    color:#fff;
}

.faq-renewal .fq-section-head-light > p:last-child {
    max-width:740px;
    margin:16px auto 0;
    opacity:.78;
}

.faq-renewal .fq-section-support .fq-item {
    border-color:rgba(255,255,255,.12);
}

.faq-renewal .fq-section-support .fq-item summary {
    background:#fff;
}

.faq-renewal .fq-section-support .fq-item[open] summary {
    background:#f8fbf9;
}

/* FAQ PRICE TABLE */
.faq-renewal .fq-price-table-wrap {
    margin:16px 0 18px;
    overflow:hidden;
    border:1px solid var(--fq-line);
    border-radius:9px;
    background:#fff;
}

.faq-renewal .fq-price-table {
    width:100%;
    margin:0;
    border-collapse:collapse;
    table-layout:fixed;
}

.faq-renewal .fq-price-table th,
.faq-renewal .fq-price-table td {
    width:auto;
    padding:11px 14px;
    border:0;
    border-bottom:1px solid #e7eeea;
    text-align:left;
    font-size:12px;
    line-height:1.55;
}

.faq-renewal .fq-price-table th {
    background:var(--fq-green-dark);
    color:#fff;
    font-weight:700;
}

.faq-renewal .fq-price-table tr:last-child td { border-bottom:0; }
.faq-renewal .fq-price-table td { color:var(--fq-text); }

.faq-renewal .fq-small-note {
    color:var(--fq-muted)!important;
    font-size:11px!important;
}

/* OTHER */
.faq-renewal .fq-other {
    background:var(--fq-soft);
}

.faq-renewal .fq-other-inner {
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,.9fr);
    gap:clamp(44px,6vw,72px);
    align-items:center;
}

.faq-renewal .fq-other-copy h2 { margin-bottom:20px; }

.faq-renewal .fq-other-copy > p:not(.fq-kicker) {
    margin-top:9px;
    color:#526158;
}

.faq-renewal .fq-other-card {
    padding:32px;
    border:1px solid #cfe2d6;
    border-radius:14px;
    background:#fff;
}

.faq-renewal .fq-other-card > span {
    display:block;
    margin-bottom:9px;
    color:var(--fq-green);
    font-size:9px;
    font-weight:800;
    letter-spacing:.13em;
}

.faq-renewal .fq-other-card > strong {
    display:block;
    margin-bottom:11px;
    color:var(--fq-green-dark);
    font-size:21px;
    line-height:1.55;
}

.faq-renewal .fq-other-card p {
    color:var(--fq-muted);
    font-size:13px;
    line-height:1.8;
}

.faq-renewal .fq-other-card a {
    display:inline-block;
    margin-top:16px;
    color:var(--fq-green-dark);
    font-size:13px;
    font-weight:700;
    text-decoration:none;
}

/* TABLET */
@media screen and (max-width:1040px) {
    .faq-renewal .fq-hero-inner,
    .faq-renewal .fq-other-inner {
        grid-template-columns:1fr;
        gap:40px;
    }

    .faq-renewal .fq-hero-copy,
    .faq-renewal .fq-hero-panel,
    .faq-renewal .fq-other-copy,
    .faq-renewal .fq-other-card {
        width:100%;
        max-width:820px;
    }
}

/* SMARTPHONE */
@media screen and (max-width:680px) {
    .faq-renewal .fq-container { width:calc(100% - 30px); }
    .faq-renewal .fq-section { padding:68px 0; }
    .faq-renewal .fq-section-head { margin-bottom:32px; }

    .faq-renewal h2 {
        font-size:27px;
        line-height:1.45;
    }

    .faq-renewal p {
        font-size:14px;
        line-height:1.9;
    }

    .faq-renewal .fq-hero { padding:60px 0 66px; }

    .faq-renewal .fq-hero h1 {
        font-size:36px;
        line-height:1.25;
        letter-spacing:-.025em;
    }

    .faq-renewal .fq-hero-lead { font-size:16px!important; }

    .faq-renewal .fq-hero-buttons {
        display:grid;
        grid-template-columns:1fr;
    }

    .faq-renewal .fq-btn { width:100%; }

    .faq-renewal .fq-hero-panel { padding:20px 15px; }

    .faq-renewal .fq-panel-grid { grid-template-columns:1fr; }
    .faq-renewal .fq-panel-grid a:last-child { grid-column:auto; }

    .faq-renewal .fq-item summary {
        min-height:68px;
        padding:16px 52px 16px 50px;
        font-size:14px;
    }

    .faq-renewal .fq-item summary::before {
        left:15px;
        width:26px;
        height:26px;
    }

    .faq-renewal .fq-item summary::after { right:16px; }

    .faq-renewal .fq-answer {
        padding:19px 17px 21px 50px;
    }

    .faq-renewal .fq-answer::before {
        left:15px;
        top:21px;
        width:26px;
        height:26px;
    }

    .faq-renewal .fq-answer p { font-size:13px; }

    .faq-renewal .fq-price-table th,
    .faq-renewal .fq-price-table td {
        padding:9px 8px;
        font-size:10px;
    }

    .faq-renewal .fq-other-card { padding:25px 21px; }
}

/* anchor offset for fixed site header */
.faq-renewal #about,
.faq-renewal #environment,
.faq-renewal #setup,
.faq-renewal #migration,
.faq-renewal #customize,
.faq-renewal #support,
.faq-renewal #backup {
    scroll-margin-top:100px;
}


/* =========================================================
   FAQ HERO CATEGORY WIDTH FIX
   すべてのカテゴリを最下段と同じ全幅に統一
========================================================= */

.faq-renewal .fq-panel-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 9px !important;
}

.faq-renewal .fq-panel-grid a,
.faq-renewal .fq-panel-grid a:last-child {
    grid-column: auto !important;
    width: 100% !important;
    max-width: none !important;
}


/* =========================================================
   FAQ HERO CATEGORY VERTICAL GAP FIX
   メニュー間に入る既存テーマ側のmarginを無効化
========================================================= */

.faq-renewal .fq-panel-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 9px !important;
    row-gap: 9px !important;
    align-content: start !important;
}

.faq-renewal .fq-panel-grid > a,
.faq-renewal .fq-panel-grid > a:last-child {
    grid-column: auto !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    min-height: 54px !important;
}


/* =========================================================
   FAQ HERO CATEGORY ROW HEIGHT FIX
   Gridの自動ストレッチを止め、7行を内容高さで固定
========================================================= */

.faq-renewal .fq-hero-panel {
    height: auto !important;
    min-height: 0 !important;
    align-self: center !important;
}

.faq-renewal .fq-panel-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: repeat(7, 54px) !important;
    grid-auto-rows: 54px !important;
    gap: 9px !important;
    row-gap: 9px !important;
    height: auto !important;
    min-height: 0 !important;
    align-content: start !important;
    justify-content: stretch !important;
    place-content: start stretch !important;
}

.faq-renewal .fq-panel-grid > a,
.faq-renewal .fq-panel-grid > a:last-child {
    display: flex !important;
    grid-column: auto !important;
    align-self: stretch !important;
    justify-self: stretch !important;
    width: 100% !important;
    height: 54px !important;
    min-height: 54px !important;
    max-height: 54px !important;
    margin: 0 !important;
    padding: 0 14px !important;
}

@media screen and (max-width: 680px) {
    .faq-renewal .fq-panel-grid {
        grid-template-rows: repeat(7, 54px) !important;
        grid-auto-rows: 54px !important;
    }
}


/* =========================================================
   FAQ HERO CATEGORY FINAL LAYOUT FIX
   Gridを廃止し、Flex縦並びで間隔を完全固定
========================================================= */

.faq-renewal .fq-hero-panel {
    display: block !important;
    height: fit-content !important;
    min-height: 0 !important;
    align-self: center !important;
}

.faq-renewal .fq-panel-grid {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 8px !important;
    row-gap: 8px !important;
    column-gap: 0 !important;
    justify-content: flex-start !important;
    align-content: flex-start !important;
    align-items: stretch !important;

    /* 以前のGrid指定を完全解除 */
    grid-template-columns: none !important;
    grid-template-rows: none !important;
    grid-auto-rows: auto !important;
}

.faq-renewal .fq-panel-grid > a,
.faq-renewal .fq-panel-grid > a:last-child {
    position: static !important;
    display: flex !important;
    flex: 0 0 54px !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    height: 54px !important;
    min-height: 54px !important;
    max-height: 54px !important;
    margin: 0 !important;
    padding: 0 14px !important;
    inset: auto !important;
    transform: none !important;

    /* 以前のGrid配置指定を完全解除 */
    grid-column: auto !important;
    grid-row: auto !important;
    align-self: auto !important;
    justify-self: auto !important;
}

.faq-renewal .fq-panel-label {
    margin: 0 0 12px 0 !important;
}

@media screen and (max-width: 680px) {
    .faq-renewal .fq-panel-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;
    }
}


/* =========================================================
   FAQ CATEGORY BR FIX
   WordPress等で自動挿入されたbrをFlexアイテムにしない
========================================================= */
.faq-renewal .fq-panel-grid > br {
    display: none !important;
}


/* =========================================================
   CONTACT PAGE RENEWAL
   Surrounding layout only.
   Contact Form 7 internal elements are intentionally untouched.
========================================================= */

.contact-renewal {
    --ct-green:#16824b;
    --ct-green-dark:#0b5635;
    --ct-green-deep:#163129;
    --ct-soft:#eff8f3;
    --ct-pale:#f7fbf8;
    --ct-line:#dcebe2;
    --ct-text:#26352e;
    --ct-muted:#66736c;
    --ct-shadow:0 16px 44px rgba(18,72,45,.09);
    width:100%;
    max-width:100%;
    overflow-x:clip;
    color:var(--ct-text);
    background:#fff;
}

.contact-renewal,
.contact-renewal *::before,
.contact-renewal *::after {
    box-sizing:border-box;
}

.contact-renewal .ct-container {
    width:calc(100% - 48px);
    max-width:1160px;
    margin-left:auto;
    margin-right:auto;
}

.contact-renewal .ct-section {
    padding:96px 0;
}

.contact-renewal .ct-section-head {
    max-width:900px;
    margin:0 auto 48px;
    padding:0;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    text-align:center;
}

.contact-renewal .ct-section-head h2,
.contact-renewal .ct-section-head > p {
    text-align:center;
}

.contact-renewal .ct-section-head > p:last-child {
    max-width:760px;
    margin:16px auto 0;
    color:var(--ct-muted);
}

.contact-renewal .ct-eyebrow,
.contact-renewal .ct-kicker {
    margin:0 0 13px;
    color:var(--ct-green);
    font-size:12px;
    line-height:1.4;
    font-weight:800;
    letter-spacing:.14em;
}

/* HERO */
.contact-renewal .ct-hero {
    position:relative;
    padding:88px 0 94px;
    overflow:hidden;
    background:linear-gradient(135deg,#f7fbf8 0%,#eff8f3 100%);
}

.contact-renewal .ct-hero::after {
    content:"";
    position:absolute;
    top:-190px;
    right:-130px;
    width:470px;
    height:470px;
    border-radius:50%;
    background:rgba(22,130,75,.05);
}

.contact-renewal .ct-hero-inner {
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:minmax(0,.96fr) minmax(0,1.04fr);
    gap:clamp(46px,6vw,76px);
    align-items:center;
}

.contact-renewal .ct-hero-copy,
.contact-renewal .ct-hero-panel,
.contact-renewal .ct-form-wrap,
.contact-renewal .ct-side,
.contact-renewal .ct-privacy-card {
    min-width:0;
}

.contact-renewal .ct-hero h1,
.contact-renewal .ct-section-head h2,
.contact-renewal .ct-hero-panel h2,
.contact-renewal .ct-topic-card h3,
.contact-renewal .ct-side-card h3,
.contact-renewal .ct-privacy-section h2 {
    width:auto;
    margin:0;
    color:var(--ct-text);
    font-family:'Noto Sans Japanese','Noto Sans JP',sans-serif;
    font-weight:700;
}

.contact-renewal .ct-hero h1 {
    margin-bottom:24px;
    font-size:clamp(42px,5vw,60px);
    line-height:1.24;
    letter-spacing:-.04em;
}

.contact-renewal .ct-hero h1 span {
    color:var(--ct-green);
}

.contact-renewal .ct-hero-copy p,
.contact-renewal .ct-hero-panel p,
.contact-renewal .ct-topic-card p,
.contact-renewal .ct-side-card p,
.contact-renewal .ct-privacy-card p,
.contact-renewal .ct-section-head p {
    font-family:'Noto Sans Japanese','Noto Sans JP',sans-serif;
}

.contact-renewal .ct-hero-lead {
    margin-bottom:12px!important;
    font-size:18px!important;
    line-height:1.85!important;
    font-weight:700;
}

.contact-renewal .ct-hero-copy > p:not(.ct-eyebrow):not(.ct-hero-lead) {
    color:#4e5d55;
    font-size:16px;
    line-height:1.95;
}

.contact-renewal .ct-hero-points {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:27px;
}

.contact-renewal .ct-hero-points > div {
    display:flex;
    align-items:center;
    gap:8px;
    padding:9px 12px;
    border:1px solid #cfe2d6;
    border-radius:20px;
    background:#fff;
}

.contact-renewal .ct-hero-points span {
    color:var(--ct-green);
    font-size:9px;
    font-weight:800;
}

.contact-renewal .ct-hero-points strong {
    color:var(--ct-text);
    font-size:11px;
}

.contact-renewal .ct-hero-panel {
    padding:28px;
    border:1px solid #d8e8df;
    border-radius:16px;
    background:rgba(255,255,255,.96);
    box-shadow:var(--ct-shadow);
}

.contact-renewal .ct-panel-label {
    margin-bottom:8px;
    color:var(--ct-green);
    font-size:10px;
    line-height:1.4;
    font-weight:800;
    letter-spacing:.14em;
}

.contact-renewal .ct-hero-panel h2 {
    margin-bottom:20px;
    font-size:24px;
    line-height:1.45;
}

.contact-renewal .ct-panel-list {
    display:grid;
    gap:9px;
}

.contact-renewal .ct-panel-list > div {
    display:flex;
    align-items:flex-start;
    gap:12px;
    min-width:0;
    padding:14px 15px;
    border:1px solid var(--ct-line);
    border-radius:9px;
    background:var(--ct-pale);
}

.contact-renewal .ct-panel-list span {
    display:flex;
    flex:0 0 30px;
    align-items:center;
    justify-content:center;
    width:30px;
    height:30px;
    border-radius:50%;
    background:var(--ct-green);
    color:#fff;
    font-size:9px;
    font-weight:800;
}

.contact-renewal .ct-panel-list p {
    flex:1 1 auto;
    min-width:0;
    margin:0;
    padding-top:3px;
    color:#4f5e56;
    font-size:12px;
    line-height:1.7;
}

.contact-renewal .ct-panel-note {
    margin-top:13px!important;
    color:var(--ct-muted)!important;
    font-size:11px!important;
    line-height:1.65!important;
}

/* CONTACT FORM AREA $2014 wrapper only */
.contact-renewal .ct-form-section {
    background:#fff;
}

.contact-renewal .ct-contact-layout {
    display:grid;
    grid-template-columns:minmax(0,1.45fr) minmax(290px,.55fr);
    gap:28px;
    align-items:start;
    max-width:1080px;
    margin:0 auto;
}

.contact-renewal .ct-form-wrap {
    width:100%;
    padding:34px;
    border:1px solid var(--ct-line);
    border-radius:15px;
    background:#fff;
    box-shadow:0 10px 32px rgba(18,72,45,.045);
}

/*
 * IMPORTANT:
 * No selectors below target .wpcf7, form, input, textarea, select,
 * checkbox, radio, submit, label, or Contact Form 7 internals.
 */

/* SIDE */
.contact-renewal .ct-side {
    display:grid;
    gap:14px;
}

.contact-renewal .ct-side-card {
    min-width:0;
    padding:24px 22px;
    border:1px solid var(--ct-line);
    border-radius:11px;
    background:var(--ct-pale);
}

.contact-renewal .ct-side-card-green {
    background:var(--ct-green-dark);
    border-color:var(--ct-green-dark);
}

.contact-renewal .ct-side-card > span {
    display:block;
    margin-bottom:7px;
    color:var(--ct-green);
    font-size:9px;
    line-height:1.4;
    font-weight:800;
    letter-spacing:.12em;
}

.contact-renewal .ct-side-card h3 {
    margin-bottom:9px;
    font-size:17px;
    line-height:1.55;
}

.contact-renewal .ct-side-card p {
    margin:0;
    color:var(--ct-muted);
    font-size:12px;
    line-height:1.75;
}

.contact-renewal .ct-side-card-green > span {
    color:#9bd5b7;
}

.contact-renewal .ct-side-card-green h3,
.contact-renewal .ct-side-card-green p {
    color:#fff;
}

.contact-renewal .ct-side-card-green p {
    opacity:.78;
}

.contact-renewal .ct-phone {
    display:block;
    margin-bottom:8px;
    color:var(--ct-green-dark);
    font-size:25px;
    line-height:1.2;
    font-weight:800;
    text-decoration:none;
    white-space:nowrap;
}

.contact-renewal .ct-text-link {
    display:inline-block;
    margin-top:13px;
    color:var(--ct-green-dark);
    font-size:12px;
    font-weight:700;
    text-decoration:none;
}

/* TOPICS */
.contact-renewal .ct-topics {
    background:var(--ct-pale);
}

.contact-renewal .ct-topic-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
}

.contact-renewal .ct-topic-card {
    min-width:0;
    padding:27px 24px;
    border:1px solid var(--ct-line);
    border-radius:12px;
    background:#fff;
}

.contact-renewal .ct-topic-card > span {
    display:flex;
    align-items:center;
    justify-content:center;
    width:38px;
    height:38px;
    margin-bottom:15px;
    border-radius:50%;
    background:var(--ct-green);
    color:#fff;
    font-size:11px;
    font-weight:800;
}

.contact-renewal .ct-topic-card h3 {
    margin-bottom:8px;
    font-size:17px;
    line-height:1.55;
}

.contact-renewal .ct-topic-card p {
    margin:0;
    color:var(--ct-muted);
    font-size:13px;
    line-height:1.8;
}

/* PRIVACY */
.contact-renewal .ct-privacy-section {
    background:var(--ct-green-deep);
}

.contact-renewal .ct-privacy-inner {
    display:grid;
    grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
    gap:clamp(44px,6vw,72px);
    align-items:center;
}

.contact-renewal .ct-privacy-section .ct-kicker {
    color:#9bd5b7;
}

.contact-renewal .ct-privacy-section h2 {
    color:#fff;
    font-size:clamp(30px,3.5vw,42px);
    line-height:1.4;
}

.contact-renewal .ct-privacy-card {
    padding:30px;
    border:1px solid rgba(255,255,255,.15);
    border-radius:13px;
    background:rgba(255,255,255,.08);
}

.contact-renewal .ct-privacy-card p {
    margin:0;
    color:rgba(255,255,255,.78);
    font-size:13px;
    line-height:1.85;
}

.contact-renewal .ct-privacy-card a {
    display:inline-block;
    margin-top:14px;
    color:#b7dfc8;
    font-size:13px;
    font-weight:700;
    text-decoration:none;
}

/* TABLET */
@media screen and (max-width:1040px) {
    .contact-renewal .ct-hero-inner,
    .contact-renewal .ct-contact-layout,
    .contact-renewal .ct-privacy-inner {
        grid-template-columns:1fr;
        gap:40px;
    }

    .contact-renewal .ct-hero-copy,
    .contact-renewal .ct-hero-panel,
    .contact-renewal .ct-form-wrap,
    .contact-renewal .ct-side,
    .contact-renewal .ct-privacy-card {
        width:100%;
        max-width:820px;
    }

    .contact-renewal .ct-side {
        grid-template-columns:repeat(3,minmax(0,1fr));
        max-width:none;
    }
}

@media screen and (max-width:820px) {
    .contact-renewal .ct-topic-grid,
    .contact-renewal .ct-side {
        grid-template-columns:1fr;
    }
}

/* SMARTPHONE */
@media screen and (max-width:680px) {
    .contact-renewal .ct-container {
        width:calc(100% - 30px);
    }

    .contact-renewal .ct-section {
        padding:68px 0;
    }

    .contact-renewal .ct-section-head {
        margin-bottom:34px;
    }

    .contact-renewal .ct-section-head h2,
    .contact-renewal .ct-privacy-section h2 {
        font-size:27px;
        line-height:1.45;
    }

    .contact-renewal .ct-hero {
        padding:60px 0 66px;
    }

    .contact-renewal .ct-hero h1 {
        font-size:34px;
        line-height:1.3;
        letter-spacing:-.025em;
    }

    .contact-renewal .ct-hero-lead {
        font-size:16px!important;
    }

    .contact-renewal .ct-hero-points {
        display:grid;
        grid-template-columns:1fr;
    }

    .contact-renewal .ct-hero-points > div {
        border-radius:9px;
    }

    .contact-renewal .ct-hero-panel {
        padding:20px 15px;
    }

    .contact-renewal .ct-form-wrap {
        padding:22px 16px;
    }

    .contact-renewal .ct-phone {
        font-size:22px;
    }

    .contact-renewal .ct-privacy-card {
        padding:25px 21px;
    }
}


/* =========================================================
   CONTACT FORM WRAPPER BORDER FIX
   外側の枠を消し、Contact Form 7 側の既存デザインだけを表示
========================================================= */

.contact-renewal .ct-form-wrap {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
}


/* =========================================================
   CONTACT FORM / SIDE COLUMN ALIGNMENT FIX
   フォーム本体には触れず、外側レイアウトのみ調整
========================================================= */

/* 左フォーム列を実寸に近づけ、右メニューとの空白を縮小 */
.contact-renewal .ct-contact-layout {
    grid-template-columns: minmax(0, 690px) 300px !important;
    gap: 18px !important;
    max-width: 1010px !important;
    justify-content: center !important;
    align-items: start !important;
}

/* Contact Form 7 の見えている枠の上端に右メニューを合わせる */
.contact-renewal .ct-side {
    margin-top: 34px !important;
}

/* タブレット以下は従来どおり縦積み */
@media screen and (max-width:1040px) {
    .contact-renewal .ct-contact-layout {
        grid-template-columns: 1fr !important;
        gap: 28px !important;
        max-width: 820px !important;
        justify-content: stretch !important;
    }

    .contact-renewal .ct-side {
        margin-top: 0 !important;
    }
}


/* =========================================================
   CONTACT FORM 7 RESPONSE MESSAGE
   上部のエラー・送信完了メッセージのみデザイン調整
========================================================= */

/* 共通 */
.contact-renewal .ct-form-wrap .wpcf7-response-output {
    width: 100% !important;
    margin: 0 0 24px 0 !important;
    padding: 15px 18px !important;
    border: 1px solid #dcebe2 !important;
    border-left-width: 4px !important;
    border-radius: 8px !important;
    background: #f7fbf8 !important;
    color: #26352e !important;
    font-size: 13px !important;
    line-height: 1.75 !important;
    font-weight: 700 !important;
    box-shadow: none !important;
}

/* 必須項目未入力・入力内容エラー */
.contact-renewal .ct-form-wrap .wpcf7 form.invalid .wpcf7-response-output,
.contact-renewal .ct-form-wrap .wpcf7 form.unaccepted .wpcf7-response-output,
.contact-renewal .ct-form-wrap .wpcf7 form.payment-required .wpcf7-response-output {
    border-color: #e7caca !important;
    border-left-color: #b85c5c !important;
    background: #fff7f7 !important;
    color: #873f3f !important;
}

/* 送信完了 */
.contact-renewal .ct-form-wrap .wpcf7 form.sent .wpcf7-response-output {
    border-color: #b9d9c6 !important;
    border-left-color: #16824b !important;
    background: #eff8f3 !important;
    color: #0b5635 !important;
}

/* 送信失敗・スパム判定等 */
.contact-renewal .ct-form-wrap .wpcf7 form.failed .wpcf7-response-output,
.contact-renewal .ct-form-wrap .wpcf7 form.aborted .wpcf7-response-output,
.contact-renewal .ct-form-wrap .wpcf7 form.spam .wpcf7-response-output {
    border-color: #ead5bb !important;
    border-left-color: #a86e2d !important;
    background: #fffaf3 !important;
    color: #79501f !important;
}

/* スマートフォン */
@media screen and (max-width: 680px) {
    .contact-renewal .ct-form-wrap .wpcf7-response-output {
        margin-bottom: 18px !important;
        padding: 13px 14px !important;
        font-size: 12px !important;
        line-height: 1.7 !important;
    }
}


/* =========================================================
   CONTACT FORM 7 RESPONSE WIDTH FIX
   通知ボックスをContact Form 7本体の枠幅に合わせる
========================================================= */

.contact-renewal .ct-form-wrap .wpcf7-response-output {
    width: 100% !important;
    max-width: 600px !important;
    margin: 0 auto 24px auto !important;
}

@media screen and (max-width: 680px) {
    .contact-renewal .ct-form-wrap .wpcf7-response-output {
        max-width: 100% !important;
        margin: 0 auto 18px auto !important;
    }
}


/* =========================================================
   SCREEN LIST PAGE RENEWAL
   Scope: .screen-renewal
========================================================= */

.screen-renewal {
    --sc-green:#16824b;
    --sc-green-dark:#0b5635;
    --sc-deep:#163129;
    --sc-soft:#eff8f3;
    --sc-pale:#f7fbf8;
    --sc-line:#dcebe2;
    --sc-text:#26352e;
    --sc-muted:#66736c;
    --sc-shadow:0 18px 46px rgba(18,72,45,.09);
    width:100%;
    max-width:100%;
    overflow-x:clip;
    color:var(--sc-text);
    background:#fff;
}

.screen-renewal,
.screen-renewal *,
.screen-renewal *::before,
.screen-renewal *::after {
    box-sizing:border-box;
}

.screen-renewal .sc-container {
    width:calc(100% - 48px);
    max-width:1160px;
    margin-left:auto;
    margin-right:auto;
}

.screen-renewal p,
.screen-renewal a,
.screen-renewal span,
.screen-renewal strong,
.screen-renewal h1,
.screen-renewal h2,
.screen-renewal h3 {
    font-family:'Noto Sans Japanese','Noto Sans JP',sans-serif;
}

.screen-renewal p {
    margin:0;
    color:var(--sc-text);
    font-size:16px;
    line-height:1.95;
}

.screen-renewal h1,
.screen-renewal h2,
.screen-renewal h3 {
    width:auto;
    margin:0;
    color:var(--sc-text);
    font-weight:700;
    text-align:left;
    word-break:normal;
    overflow-wrap:normal;
    line-break:strict;
    text-wrap:balance;
}

.screen-renewal h2 {
    font-size:clamp(30px,3.5vw,42px);
    line-height:1.4;
    letter-spacing:-.02em;
}

.screen-renewal .sc-section {
    padding:96px 0;
}

.screen-renewal .sc-section-head {
    max-width:900px;
    margin:0 auto 52px;
    padding:0;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    text-align:center;
}

.screen-renewal .sc-section-head h2,
.screen-renewal .sc-section-head > p {
    text-align:center;
}

.screen-renewal .sc-section-head > p:last-child {
    max-width:760px;
    margin:16px auto 0;
    color:var(--sc-muted);
}

.screen-renewal .sc-eyebrow,
.screen-renewal .sc-kicker {
    margin:0 0 13px;
    color:var(--sc-green);
    font-size:12px;
    line-height:1.4;
    font-weight:800;
    letter-spacing:.14em;
}

/* HERO */
.screen-renewal .sc-hero {
    position:relative;
    padding:86px 0 104px;
    overflow:hidden;
    background:linear-gradient(135deg,#f7fbf8 0%,#eff8f3 100%);
}

.screen-renewal .sc-hero::after {
    content:"";
    position:absolute;
    top:-190px;
    right:-130px;
    width:470px;
    height:470px;
    border-radius:50%;
    background:rgba(22,130,75,.05);
}

.screen-renewal .sc-hero-inner {
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
    gap:clamp(42px,6vw,74px);
    align-items:center;
}

.screen-renewal .sc-hero-copy,
.screen-renewal .sc-hero-visual,
.screen-renewal .sc-screen-card,
.screen-renewal .sc-screen-body,
.screen-renewal .sc-customize-copy,
.screen-renewal .sc-customize-panel {
    min-width:0;
}

.screen-renewal .sc-hero h1 {
    margin-bottom:24px;
    font-size:clamp(42px,5vw,60px);
    line-height:1.24;
    letter-spacing:-.04em;
}

.screen-renewal .sc-hero h1 span {
    color:var(--sc-green);
}

.screen-renewal .sc-hero-lead {
    margin-bottom:12px!important;
    font-size:18px!important;
    line-height:1.85!important;
    font-weight:700;
}

.screen-renewal .sc-hero-copy > p:not(.sc-eyebrow):not(.sc-hero-lead) {
    color:#4e5d55;
}

.screen-renewal .sc-hero-buttons {
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:30px;
}

.screen-renewal .sc-btn {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:54px;
    padding:0 28px;
    border-radius:8px;
    font-size:15px;
    font-weight:700;
    text-decoration:none;
}

.screen-renewal .sc-btn-primary {
    background:var(--sc-green);
    color:#fff;
    box-shadow:0 10px 26px rgba(22,130,75,.17);
}

.screen-renewal .sc-btn-secondary {
    border:1px solid #bfd8ca;
    background:#fff;
    color:var(--sc-green-dark);
}

/* HERO VISUAL */
.screen-renewal .sc-hero-visual {
    position:relative;
    min-height:430px;
}

.screen-renewal .sc-hero-screen {
    position:absolute;
    overflow:hidden;
    border:1px solid #cfe2d6;
    border-radius:12px;
    background:#fff;
    box-shadow:var(--sc-shadow);
}

.screen-renewal .sc-hero-screen img {
    display:block;
    width:100%;
    height:auto;
}

.screen-renewal .sc-hero-screen-main {
    top:55px;
    left:5%;
    width:86%;
    z-index:2;
}

.screen-renewal .sc-hero-screen-sub {
    width:49%;
    z-index:1;
}

.screen-renewal .sc-hero-screen-sub01 {
    top:0;
    right:0;
}

.screen-renewal .sc-hero-screen-sub02 {
    bottom:0;
    left:0;
}

/* OVERVIEW */
.screen-renewal .sc-overview {
    background:#fff;
}

.screen-renewal .sc-flow {
    display:grid;
    grid-template-columns:minmax(0,1fr) 36px minmax(0,1fr) 36px minmax(0,1fr) 36px minmax(0,1fr) 36px minmax(0,1fr);
    align-items:center;
    max-width:1100px;
    margin:0 auto;
}

.screen-renewal .sc-flow-item {
    display:block;
    min-width:0;
    padding:21px 18px;
    border:1px solid var(--sc-line);
    border-radius:11px;
    background:var(--sc-pale);
    color:var(--sc-text);
    text-decoration:none;
}

.screen-renewal .sc-flow-item > span {
    display:flex;
    align-items:center;
    justify-content:center;
    width:34px;
    height:34px;
    margin-bottom:12px;
    border-radius:50%;
    background:var(--sc-green);
    color:#fff;
    font-size:10px;
    font-weight:800;
}

.screen-renewal .sc-flow-item strong {
    display:block;
    margin-bottom:5px;
    color:var(--sc-text);
    font-size:14px;
    line-height:1.5;
}

.screen-renewal .sc-flow-item p {
    color:var(--sc-muted);
    font-size:10px;
    line-height:1.55;
}

.screen-renewal .sc-flow-arrow {
    color:#8eb09d;
    font-size:18px;
    text-align:center;
}

/* SCREEN LIST */
.screen-renewal .sc-screen-list {
    background:var(--sc-pale);
}

.screen-renewal .sc-category {
    max-width:1080px;
    margin:0 auto;
    padding:0 0 82px;
    scroll-margin-top:100px;
}

.screen-renewal .sc-category:last-child {
    padding-bottom:0;
}

.screen-renewal .sc-category-head {
    display:flex;
    align-items:center;
    gap:15px;
    margin-bottom:22px;
}

.screen-renewal .sc-category-head > span {
    display:flex;
    flex:0 0 44px;
    align-items:center;
    justify-content:center;
    width:44px;
    height:44px;
    border-radius:50%;
    background:var(--sc-green);
    color:#fff;
    font-size:11px;
    font-weight:800;
}

.screen-renewal .sc-category-head > div {
    min-width:0;
}

.screen-renewal .sc-category-head p {
    margin-bottom:2px;
    color:var(--sc-green);
    font-size:9px;
    line-height:1.4;
    font-weight:800;
    letter-spacing:.12em;
}

.screen-renewal .sc-category-head h3 {
    font-size:22px;
    line-height:1.45;
}

.screen-renewal .sc-screen-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:22px;
}

.screen-renewal .sc-screen-card {
    display:flex;
    flex-direction:column;
    min-width:0;
    overflow:hidden;
    border:1px solid #d4e5da;
    border-radius:14px;
    background:#fff;
    box-shadow:0 8px 26px rgba(18,72,45,.04);
}

.screen-renewal .sc-screen-image {
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    aspect-ratio:16/9;
    overflow:hidden;
    border-bottom:1px solid #e2ece6;
    background:#f2f6f3;
    text-decoration:none;
}

.screen-renewal .sc-screen-image img {
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
    transition:transform .25s ease;
}

.screen-renewal .sc-screen-image:hover img {
    transform:scale(1.018);
}

.screen-renewal .sc-image-more {
    position:absolute;
    right:13px;
    bottom:13px;
    padding:7px 11px;
    border-radius:17px;
    background:rgba(11,86,53,.92);
    color:#fff;
    font-size:10px;
    font-weight:700;
    opacity:0;
    transform:translateY(3px);
    transition:opacity .2s ease,transform .2s ease;
}

.screen-renewal .sc-screen-image:hover .sc-image-more {
    opacity:1;
    transform:translateY(0);
}

.screen-renewal .sc-screen-body {
    display:flex;
    flex:1 1 auto;
    flex-direction:column;
    padding:24px 24px 25px;
}

.screen-renewal .sc-screen-no {
    margin-bottom:6px;
    color:var(--sc-green);
    font-size:9px;
    line-height:1.4;
    font-weight:800;
    letter-spacing:.12em;
}

.screen-renewal .sc-screen-body h3 {
    margin-bottom:9px;
    font-size:21px;
    line-height:1.45;
}

.screen-renewal .sc-screen-body h3 a {
    color:var(--sc-text);
    text-decoration:none;
}

.screen-renewal .sc-screen-body > p:not(.sc-screen-no) {
    margin-bottom:15px;
    color:var(--sc-muted);
    font-size:13px;
    line-height:1.8;
}

.screen-renewal .sc-tags {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-bottom:18px;
}

.screen-renewal .sc-tags span {
    display:inline-block;
    padding:5px 9px;
    border-radius:14px;
    background:var(--sc-soft);
    color:var(--sc-green-dark);
    font-size:9px;
    line-height:1.4;
    font-weight:700;
}

.screen-renewal .sc-screen-link {
    display:inline-block;
    margin-top:auto;
    color:var(--sc-green-dark);
    font-size:12px;
    font-weight:700;
    text-decoration:none;
}

.screen-renewal .sc-screen-grid-single {
    grid-template-columns:minmax(0,1fr);
}

.screen-renewal .sc-screen-card-wide {
    display:grid;
    grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr);
}

.screen-renewal .sc-screen-card-wide .sc-screen-image {
    aspect-ratio:auto;
    min-height:340px;
    border-right:1px solid #e2ece6;
    border-bottom:0;
}

/* CUSTOMIZE */
.screen-renewal .sc-customize {
    background:#fff;
}

.screen-renewal .sc-customize-inner {
    display:grid;
    grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
    gap:clamp(46px,6vw,74px);
    align-items:center;
}

.screen-renewal .sc-customize-copy h2 {
    margin-bottom:20px;
}

.screen-renewal .sc-customize-copy > p:not(.sc-kicker) {
    margin-top:9px;
    color:#526158;
}

.screen-renewal .sc-text-link {
    display:inline-block;
    margin-top:17px;
    color:var(--sc-green-dark);
    font-size:13px;
    font-weight:700;
    text-decoration:none;
}

.screen-renewal .sc-customize-panel {
    padding:30px;
    border:1px solid var(--sc-line);
    border-radius:14px;
    background:var(--sc-pale);
}

.screen-renewal .sc-customize-panel > span {
    display:block;
    margin-bottom:12px;
    color:var(--sc-green);
    font-size:9px;
    font-weight:800;
    letter-spacing:.13em;
}

.screen-renewal .sc-customize-list {
    display:flex;
    flex-direction:column;
    gap:9px;
}

.screen-renewal .sc-customize-list > div {
    display:flex;
    align-items:center;
    gap:13px;
    min-width:0;
    padding:14px 15px;
    border:1px solid #d5e6dc;
    border-radius:9px;
    background:#fff;
}

.screen-renewal .sc-customize-list > div > span {
    display:flex;
    flex:0 0 32px;
    align-items:center;
    justify-content:center;
    width:32px;
    height:32px;
    border-radius:50%;
    background:var(--sc-green);
    color:#fff;
    font-size:9px;
    font-weight:800;
}

.screen-renewal .sc-customize-list strong {
    flex:1 1 auto;
    min-width:0;
    color:var(--sc-text);
    font-size:13px;
    line-height:1.6;
}

/* CTA */
.screen-renewal .sc-cta {
    background:var(--sc-deep);
}

.screen-renewal .sc-cta-inner {
    display:grid;
    grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr);
    gap:50px;
    align-items:center;
}

.screen-renewal .sc-cta .sc-kicker {
    color:#9bd5b7;
}

.screen-renewal .sc-cta h2,
.screen-renewal .sc-cta p {
    color:#fff;
}

.screen-renewal .sc-cta h2 {
    margin-bottom:15px;
}

.screen-renewal .sc-cta p:not(.sc-kicker) {
    max-width:700px;
    opacity:.78;
}

.screen-renewal .sc-cta-actions {
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:14px;
}

.screen-renewal .sc-btn-white {
    background:#fff;
    color:var(--sc-green-dark);
}

.screen-renewal .sc-cta-link {
    color:#b7dfc8;
    font-size:13px;
    font-weight:700;
    text-align:center;
    text-decoration:none;
}

/* RESPONSIVE */
@media screen and (max-width:1040px) {
    .screen-renewal .sc-hero-inner,
    .screen-renewal .sc-customize-inner,
    .screen-renewal .sc-cta-inner {
        grid-template-columns:1fr;
        gap:42px;
    }

    .screen-renewal .sc-hero-copy,
    .screen-renewal .sc-hero-visual,
    .screen-renewal .sc-customize-copy,
    .screen-renewal .sc-customize-panel {
        width:100%;
        max-width:840px;
    }

    .screen-renewal .sc-hero-visual {
        min-height:430px;
    }

    .screen-renewal .sc-flow {
        grid-template-columns:1fr;
        gap:8px;
        max-width:720px;
    }

    .screen-renewal .sc-flow-arrow {
        transform:rotate(90deg);
        min-height:22px;
    }

    .screen-renewal .sc-screen-card-wide {
        grid-template-columns:1fr;
    }

    .screen-renewal .sc-screen-card-wide .sc-screen-image {
        min-height:0;
        aspect-ratio:16/9;
        border-right:0;
        border-bottom:1px solid #e2ece6;
    }

    .screen-renewal .sc-cta-actions {
        max-width:400px;
    }
}

@media screen and (max-width:820px) {
    .screen-renewal .sc-screen-grid {
        grid-template-columns:1fr;
    }
}

@media screen and (max-width:680px) {
    .screen-renewal .sc-container {
        width:calc(100% - 30px);
    }

    .screen-renewal .sc-section {
        padding:68px 0;
    }

    .screen-renewal .sc-section-head {
        margin-bottom:36px;
    }

    .screen-renewal h2 {
        font-size:27px;
        line-height:1.45;
    }

    .screen-renewal p {
        font-size:14px;
        line-height:1.9;
    }

    .screen-renewal .sc-hero {
        padding:60px 0 68px;
    }

    .screen-renewal .sc-hero h1 {
        font-size:34px;
        line-height:1.3;
        letter-spacing:-.025em;
    }

    .screen-renewal .sc-hero-lead {
        font-size:16px!important;
    }

    .screen-renewal .sc-hero-buttons {
        display:grid;
        grid-template-columns:1fr;
    }

    .screen-renewal .sc-btn {
        width:100%;
    }

    .screen-renewal .sc-hero-visual {
        min-height:305px;
    }

    .screen-renewal .sc-hero-screen-main {
        top:42px;
        left:3%;
        width:91%;
    }

    .screen-renewal .sc-hero-screen-sub {
        width:54%;
    }

    .screen-renewal .sc-category {
        padding-bottom:60px;
    }

    .screen-renewal .sc-category-head h3 {
        font-size:19px;
    }

    .screen-renewal .sc-screen-body {
        padding:21px 18px 22px;
    }

    .screen-renewal .sc-screen-body h3 {
        font-size:19px;
    }

    .screen-renewal .sc-image-more {
        display:none;
    }

    .screen-renewal .sc-customize-panel {
        padding:22px 17px;
    }
}


/* =========================================================
   SCREEN FLOW BANNER LAYOUT FIX
   「工事の登録から入金まで」フロー崩れ対策
========================================================= */

.screen-renewal .sc-flow {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: center !important;
    gap: 12px !important;
    max-width: 1120px !important;
    margin: 0 auto !important;
}

.screen-renewal .sc-flow-item {
    display: flex !important;
    flex: 1 1 0 !important;
    min-width: 0 !important;
    min-height: 164px !important;
    padding: 20px 18px !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
}

.screen-renewal .sc-flow-item > span,
.screen-renewal .sc-flow-item strong,
.screen-renewal .sc-flow-item p {
    display: block !important;
    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
    white-space: normal !important;
    word-break: keep-all !important;
}

.screen-renewal .sc-flow-item strong {
    margin-bottom: 6px !important;
    font-size: 18px !important;
    line-height: 1.5 !important;
}

.screen-renewal .sc-flow-item p {
    margin-top: auto !important;
    font-size: 12px !important;
    line-height: 1.6 !important;
}

.screen-renewal .sc-flow-arrow {
    display: flex !important;
    flex: 0 0 28px !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 28px !important;
    color: #8eb09d !important;
    font-size: 22px !important;
    line-height: 1 !important;
}

/* タブレット以下は縦積み */
@media screen and (max-width: 1040px) {
    .screen-renewal .sc-flow {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 10px !important;
        max-width: 720px !important;
    }

    .screen-renewal .sc-flow-item {
        min-height: 0 !important;
    }

    .screen-renewal .sc-flow-arrow {
        transform: rotate(90deg) !important;
        min-height: 22px !important;
        margin: 0 auto !important;
    }
}


/* =========================================================
   SCREEN PROCESS FLOW - REBUILT
   既存テーマとの干渉を避けるため専用クラスで再構築
========================================================= */

.screen-renewal .sc-process-flow {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 54px !important;
    width: 100% !important;
    max-width: 1120px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    align-items: stretch !important;
}

.screen-renewal .sc-process-step {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 166px !important;
    margin: 0 !important;
    padding: 21px 18px 19px !important;
    border: 1px solid #dcebe2 !important;
    border-radius: 11px !important;
    background: #f7fbf8 !important;
    color: #26352e !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

/* 矢印はHTML要素を使わず、カード間にCSSで表示 */
.screen-renewal .sc-process-step:not(:last-child)::after {
    content: "\2192" !important;
    position: absolute !important;
    top: 50% !important;
    right: -39px !important;
    width: 24px !important;
    height: 24px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #8eb09d !important;
    background: transparent !important;
    border: 0 !important;
    font-size: 22px !important;
    line-height: 1 !important;
    font-weight: 400 !important;
    transform: translateY(-50%) !important;
}

.screen-renewal .sc-process-number {
    display: flex !important;
    flex: 0 0 36px !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    margin: 0 0 18px 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: #16824b !important;
    color: #fff !important;
    font-family: 'Noto Sans Japanese','Noto Sans JP',sans-serif !important;
    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    writing-mode: horizontal-tb !important;
}

.screen-renewal .sc-process-title {
    display: block !important;
    width: 100% !important;
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #26352e !important;
    font-family: 'Noto Sans Japanese','Noto Sans JP',sans-serif !important;
    font-size: 17px !important;
    line-height: 1.55 !important;
    font-weight: 700 !important;
    writing-mode: horizontal-tb !important;
    white-space: normal !important;
    word-break: keep-all !important;
}

.screen-renewal .sc-process-desc {
    display: block !important;
    width: 100% !important;
    margin: auto 0 0 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #66736c !important;
    font-family: 'Noto Sans Japanese','Noto Sans JP',sans-serif !important;
    font-size: 11px !important;
    line-height: 1.6 !important;
    font-weight: 400 !important;
    writing-mode: horizontal-tb !important;
    white-space: normal !important;
    word-break: keep-all !important;
}

.screen-renewal .sc-process-step:hover {
    border-color: #b9d9c6 !important;
    background: #eff8f3 !important;
}

/* 1100px付近では少し詰める */
@media screen and (max-width: 1180px) and (min-width: 1041px) {
    .screen-renewal .sc-process-flow {
        gap: 38px !important;
    }

    .screen-renewal .sc-process-step:not(:last-child)::after {
        right: -31px !important;
    }

    .screen-renewal .sc-process-title {
        font-size: 15px !important;
    }

    .screen-renewal .sc-process-desc {
        font-size: 10px !important;
    }
}

/* タブレット以下は縦に並べる */
@media screen and (max-width: 1040px) {
    .screen-renewal .sc-process-flow {
        grid-template-columns: 1fr !important;
        gap: 42px !important;
        max-width: 720px !important;
    }

    .screen-renewal .sc-process-step {
        min-height: 0 !important;
        padding: 20px 20px !important;
    }

    .screen-renewal .sc-process-step:not(:last-child)::after {
        top: auto !important;
        right: auto !important;
        left: 50% !important;
        bottom: -34px !important;
        transform: translateX(-50%) rotate(90deg) !important;
    }

    .screen-renewal .sc-process-number {
        margin-bottom: 12px !important;
    }

    .screen-renewal .sc-process-desc {
        margin-top: 6px !important;
    }
}

@media screen and (max-width: 680px) {
    .screen-renewal .sc-process-flow {
        gap: 38px !important;
    }

    .screen-renewal .sc-process-title {
        font-size: 16px !important;
    }

    .screen-renewal .sc-process-desc {
        font-size: 11px !important;
    }
}


/* =========================================================
   SCREEN PROCESS FLOW BR / EMPTY ELEMENT FIX
   WordPressが自動挿入するbr等をGridアイテムから除外
========================================================= */

.screen-renewal .sc-process-flow > br,
.screen-renewal .sc-process-flow > p:empty {
    display: none !important;
}

/* 5つの工程カードだけをGridアイテムとして扱う */
.screen-renewal .sc-process-flow > .sc-process-step {
    display: flex !important;
}


/* =========================================================
   SCREEN WORKFLOW STRIP - FINAL REBUILD
   OL / LI 専用構造。旧フローCSSとは完全に分離
========================================================= */

.screen-renewal .sc-workflow-strip {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 1120px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    list-style: none !important;
    gap: 48px !important;
}

/* WordPress等が余計な要素を入れても工程以外は表示しない */
.screen-renewal .sc-workflow-strip > br,
.screen-renewal .sc-workflow-strip > p,
.screen-renewal .sc-workflow-strip > div {
    display: none !important;
}

.screen-renewal .sc-workflow-step {
    position: relative !important;
    display: block !important;
    flex: 1 1 0 !important;
    min-width: 0 !important;
    max-width: 190px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    border: 0 !important;
    background: transparent !important;
}

.screen-renewal .sc-workflow-step::marker {
    content: "" !important;
}

.screen-renewal .sc-workflow-step > a {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 166px !important;
    margin: 0 !important;
    padding: 21px 18px 19px !important;
    border: 1px solid #dcebe2 !important;
    border-radius: 11px !important;
    background: #f7fbf8 !important;
    color: #26352e !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

/* カード間の矢印 */
.screen-renewal .sc-workflow-step:not(:last-child)::after {
    content: "\2192" !important;
    position: absolute !important;
    top: 50% !important;
    right: -36px !important;
    display: block !important;
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #8eb09d !important;
    font-size: 22px !important;
    line-height: 24px !important;
    font-weight: 400 !important;
    text-align: center !important;
    transform: translateY(-50%) !important;
}

.screen-renewal .sc-workflow-no {
    display: flex !important;
    flex: 0 0 36px !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    margin: 0 0 18px 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: #16824b !important;
    color: #fff !important;
    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    writing-mode: horizontal-tb !important;
}

.screen-renewal .sc-workflow-step strong {
    display: block !important;
    width: 100% !important;
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #26352e !important;
    font-size: 17px !important;
    line-height: 1.55 !important;
    font-weight: 700 !important;
    writing-mode: horizontal-tb !important;
    white-space: normal !important;
    word-break: keep-all !important;
}

.screen-renewal .sc-workflow-step small {
    display: block !important;
    width: 100% !important;
    margin: auto 0 0 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #66736c !important;
    font-size: 11px !important;
    line-height: 1.6 !important;
    font-weight: 400 !important;
    writing-mode: horizontal-tb !important;
    white-space: normal !important;
    word-break: keep-all !important;
}

.screen-renewal .sc-workflow-step > a:hover {
    border-color: #b9d9c6 !important;
    background: #eff8f3 !important;
}

/* 中間幅 */
@media screen and (max-width: 1180px) and (min-width: 1041px) {
    .screen-renewal .sc-workflow-strip {
        gap: 36px !important;
    }

    .screen-renewal .sc-workflow-step {
        max-width: 180px !important;
    }

    .screen-renewal .sc-workflow-step:not(:last-child)::after {
        right: -30px !important;
    }

    .screen-renewal .sc-workflow-step strong {
        font-size: 15px !important;
    }
}

/* タブレット以下 */
@media screen and (max-width: 1040px) {
    .screen-renewal .sc-workflow-strip {
        flex-direction: column !important;
        gap: 40px !important;
        max-width: 720px !important;
    }

    .screen-renewal .sc-workflow-step {
        flex: none !important;
        width: 100% !important;
        max-width: none !important;
    }

    .screen-renewal .sc-workflow-step > a {
        min-height: 0 !important;
        padding: 20px !important;
    }

    .screen-renewal .sc-workflow-step:not(:last-child)::after {
        top: auto !important;
        right: auto !important;
        left: 50% !important;
        bottom: -33px !important;
        transform: translateX(-50%) rotate(90deg) !important;
    }

    .screen-renewal .sc-workflow-no {
        margin-bottom: 12px !important;
    }

    .screen-renewal .sc-workflow-step small {
        margin-top: 5px !important;
    }
}


/* =========================================================
   SCREEN WORKFLOW SQUARE + HERO HEADING FIX
========================================================= */

/* フロー：ほぼ正方形にして、カード内の文字間を詰める */
.screen-renewal .sc-workflow-step {
    max-width: 188px !important;
}

.screen-renewal .sc-workflow-step > a {
    aspect-ratio: 1 / 1 !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 20px 18px !important;
    justify-content: flex-start !important;
}

.screen-renewal .sc-workflow-no {
    margin-bottom: 14px !important;
}

.screen-renewal .sc-workflow-step strong {
    margin-bottom: 7px !important;
    font-size: 16px !important;
    line-height: 1.5 !important;
}

.screen-renewal .sc-workflow-step small {
    margin: 0 !important;
    font-size: 11px !important;
    line-height: 1.55 !important;
}

/* HERO：PCでは見出しを2行に収める */
.screen-renewal .sc-hero h1 {
    font-size: clamp(36px, 3.7vw, 48px) !important;
    line-height: 1.3 !important;
    letter-spacing: -0.035em !important;
}

/* 中間幅 */
@media screen and (max-width: 1180px) and (min-width: 1041px) {
    .screen-renewal .sc-workflow-step {
        max-width: 176px !important;
    }

    .screen-renewal .sc-workflow-step strong {
        font-size: 15px !important;
    }

    .screen-renewal .sc-hero h1 {
        font-size: 42px !important;
    }
}

/* タブレット以下は正方形固定を解除 */
@media screen and (max-width: 1040px) {
    .screen-renewal .sc-workflow-step {
        max-width: none !important;
    }

    .screen-renewal .sc-workflow-step > a {
        aspect-ratio: auto !important;
        min-height: 0 !important;
    }
}

/* スマートフォン */
@media screen and (max-width: 680px) {
    .screen-renewal .sc-hero h1 {
        font-size: 32px !important;
        line-height: 1.35 !important;
    }
}


/* =========================================================
   SCREEN WORKFLOW TEXT OVERFLOW FIX
   正方形サイズは維持し、カード内テキストを上詰めで安定配置
========================================================= */

.screen-renewal .sc-workflow-step > a {
    overflow: hidden !important;
    justify-content: flex-start !important;
}

.screen-renewal .sc-workflow-step > a > .sc-workflow-no {
    position: static !important;
    inset: auto !important;
    transform: none !important;
    margin: 0 0 14px 0 !important;
}

.screen-renewal .sc-workflow-step > a > strong {
    position: static !important;
    inset: auto !important;
    transform: none !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.5 !important;
}

.screen-renewal .sc-workflow-step > a > small {
    position: static !important;
    inset: auto !important;
    transform: none !important;
    display: block !important;
    flex: 0 0 auto !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 8px 0 0 0 !important;
    padding: 0 !important;
    color: #66736c !important;
    font-size: 11px !important;
    line-height: 1.55 !important;
    white-space: normal !important;
    word-break: keep-all !important;
    overflow: visible !important;
}

@media screen and (max-width: 1180px) and (min-width: 1041px) {
    .screen-renewal .sc-workflow-step > a > small {
        font-size: 10px !important;
        margin-top: 7px !important;
    }
}


/* =========================================================
   ORDER LIST PAGE RENEWAL
   Scope: .order-list-renewal
========================================================= */

.order-list-renewal{
 --ol-green:#16824b;--ol-green-dark:#0b5635;--ol-deep:#163129;
 --ol-soft:#eff8f3;--ol-pale:#f7fbf8;--ol-line:#dcebe2;
 --ol-text:#26352e;--ol-muted:#66736c;--ol-shadow:0 22px 56px rgba(18,72,45,.10);
 width:100%;max-width:100%;overflow-x:clip;color:var(--ol-text);background:#fff
}
.order-list-renewal,.order-list-renewal *,.order-list-renewal *::before,.order-list-renewal *::after{box-sizing:border-box}
.order-list-renewal .ol-container{width:calc(100% - 48px);max-width:1160px;margin-left:auto;margin-right:auto}
.order-list-renewal p,.order-list-renewal a,.order-list-renewal span,.order-list-renewal strong,.order-list-renewal h1,.order-list-renewal h2,.order-list-renewal h3{font-family:'Noto Sans Japanese','Noto Sans JP',sans-serif}
.order-list-renewal p{margin:0;color:var(--ol-text);font-size:16px;line-height:1.95}
.order-list-renewal h1,.order-list-renewal h2,.order-list-renewal h3{width:auto;margin:0;color:var(--ol-text);font-weight:700;word-break:normal;overflow-wrap:normal;line-break:strict}
.order-list-renewal h2{font-size:clamp(30px,3.4vw,42px);line-height:1.4;letter-spacing:-.02em}
.order-list-renewal .ol-section{padding:94px 0}
.order-list-renewal .ol-kicker,.order-list-renewal .ol-eyebrow{margin:0 0 13px;color:var(--ol-green);font-size:11px;line-height:1.4;font-weight:800;letter-spacing:.14em}

/* HERO */
.order-list-renewal .ol-hero{position:relative;padding:82px 0 170px;overflow:hidden;background:linear-gradient(135deg,#f7fbf8 0%,#eff8f3 100%)}
.order-list-renewal .ol-hero::after{content:"";position:absolute;top:-190px;right:-130px;width:470px;height:470px;border-radius:50%;background:rgba(22,130,75,.05)}
.order-list-renewal .ol-hero-copy{position:relative;z-index:1;max-width:850px;margin:0 auto;text-align:center}
.order-list-renewal .ol-eyebrow{text-align:center}
.order-list-renewal .ol-hero h1{margin-bottom:18px;font-size:clamp(46px,5vw,64px);line-height:1.2;letter-spacing:-.045em;text-align:center}
.order-list-renewal .ol-hero-lead{margin-bottom:16px!important;color:var(--ol-green-dark)!important;font-size:clamp(22px,2.5vw,30px)!important;line-height:1.6!important;font-weight:700;text-align:center}
.order-list-renewal .ol-hero-text{max-width:760px;margin:0 auto!important;color:#526158!important;font-size:15px!important;line-height:1.9!important;text-align:center}
.order-list-renewal .ol-hero-tags{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:26px}
.order-list-renewal .ol-hero-tags span{display:inline-block;padding:6px 12px;border:1px solid #c9dfd2;border-radius:16px;background:#fff;color:var(--ol-green-dark);font-size:10px;font-weight:700}

/* SCREEN */
.order-list-renewal .ol-screen-section{position:relative;margin-top:-105px;padding-bottom:76px}
.order-list-renewal .ol-screen-frame{width:100%;max-width:1100px;margin:0 auto;overflow:hidden;border:1px solid #cbded2;border-radius:15px;background:#fff;box-shadow:var(--ol-shadow)}
.order-list-renewal .ol-screen-head{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:46px;padding:0 18px;border-bottom:1px solid #e3ece7;background:#f8fbf9}
.order-list-renewal .ol-screen-label{color:var(--ol-green);font-size:9px;font-weight:800;letter-spacing:.13em}
.order-list-renewal .ol-screen-head strong{color:#526158;font-size:11px}
.order-list-renewal .ol-screen-image{display:flex;align-items:center;justify-content:center;padding:30px;background:#fff}
.order-list-renewal .ol-screen-image img{display:block;width:auto;max-width:100%;height:auto;margin:0 auto}
.order-list-renewal .ol-screen-caption{max-width:900px;margin:17px auto 0!important;color:var(--ol-muted)!important;font-size:12px!important;line-height:1.75!important;text-align:center}

/* ABOUT */
.order-list-renewal .ol-about{background:#fff}
.order-list-renewal .ol-about-inner{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(50px,7vw,88px);align-items:start;max-width:1000px}
.order-list-renewal .ol-about-title,.order-list-renewal .ol-about-text{min-width:0}
.order-list-renewal .ol-about-title h2{font-size:clamp(32px,3.5vw,44px)}
.order-list-renewal .ol-about-text p{margin-bottom:14px;color:#526158}
.order-list-renewal .ol-about-text p:last-child{margin-bottom:0}

/* SECTION HEAD */
.order-list-renewal .ol-section-head{max-width:850px;margin:0 auto 48px;text-align:center}
.order-list-renewal .ol-section-head .ol-kicker,.order-list-renewal .ol-section-head h2,.order-list-renewal .ol-section-head>p{text-align:center}
.order-list-renewal .ol-section-head>p:last-child{max-width:700px;margin:15px auto 0;color:var(--ol-muted);font-size:14px}

/* FEATURES */
.order-list-renewal .ol-features{background:var(--ol-pale)}
.order-list-renewal .ol-feature-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;max-width:1000px;margin:0 auto}
.order-list-renewal .ol-feature-card{display:flex;align-items:flex-start;gap:18px;min-width:0;padding:27px 25px;border:1px solid var(--ol-line);border-radius:12px;background:#fff}
.order-list-renewal .ol-feature-wide{grid-column:1/-1}
.order-list-renewal .ol-feature-no{display:flex;flex:0 0 42px;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;background:var(--ol-green);color:#fff;font-size:10px;font-weight:800}
.order-list-renewal .ol-feature-body{flex:1 1 auto;min-width:0}
.order-list-renewal .ol-feature-en{margin-bottom:5px;color:var(--ol-green);font-size:9px;line-height:1.4;font-weight:800;letter-spacing:.12em}
.order-list-renewal .ol-feature-card h3{margin-bottom:8px;font-size:18px;line-height:1.55}
.order-list-renewal .ol-feature-card p:not(.ol-feature-en):not(.ol-note){color:var(--ol-muted);font-size:13px;line-height:1.8}
.order-list-renewal .ol-note{margin-top:8px;color:#829087;font-size:10px;line-height:1.6}

/* USE CASE */
.order-list-renewal .ol-usecase{background:var(--ol-deep)}
.order-list-renewal .ol-usecase-inner{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(50px,7vw,86px);align-items:center;max-width:1000px}
.order-list-renewal .ol-usecase .ol-kicker{color:#9bd5b7}
.order-list-renewal .ol-usecase h2{color:#fff}
.order-list-renewal .ol-usecase-list{display:grid;gap:9px}
.order-list-renewal .ol-usecase-list>div{display:flex;align-items:center;gap:14px;min-width:0;padding:15px 17px;border:1px solid rgba(255,255,255,.13);border-radius:9px;background:rgba(255,255,255,.07)}
.order-list-renewal .ol-usecase-list span{display:flex;flex:0 0 32px;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:#fff;color:var(--ol-green-dark);font-size:9px;font-weight:800}
.order-list-renewal .ol-usecase-list p{flex:1 1 auto;min-width:0;color:rgba(255,255,255,.84);font-size:13px;line-height:1.7}

/* CUSTOMIZE */
.order-list-renewal .ol-customize{background:#fff}
.order-list-renewal .ol-customize-inner{display:flex;align-items:center;justify-content:space-between;gap:50px;max-width:1000px}
.order-list-renewal .ol-customize-copy{flex:1 1 auto;min-width:0}
.order-list-renewal .ol-customize h2{margin-bottom:14px}
.order-list-renewal .ol-customize p:not(.ol-kicker){max-width:700px;color:#526158}
.order-list-renewal .ol-outline-btn{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;min-height:52px;padding:0 24px;border:1px solid #bad5c5;border-radius:8px;background:var(--ol-pale);color:var(--ol-green-dark);font-size:13px;font-weight:700;text-decoration:none}

/* NEXT */
.order-list-renewal .ol-next{background:var(--ol-soft)}
.order-list-renewal .ol-next-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;max-width:1000px;margin:0 auto}
.order-list-renewal .ol-next-card{display:block;min-width:0;padding:26px 23px;border:1px solid #d0e1d7;border-radius:11px;background:#fff;color:var(--ol-text);text-decoration:none}
.order-list-renewal .ol-next-card>span{display:block;margin-bottom:7px;color:var(--ol-green);font-size:9px;font-weight:800;letter-spacing:.12em}
.order-list-renewal .ol-next-card>strong{display:block;margin-bottom:8px;color:var(--ol-text);font-size:18px;line-height:1.5}
.order-list-renewal .ol-next-card p{color:var(--ol-muted);font-size:12px;line-height:1.75}
.order-list-renewal .ol-next-main{border-color:#b7d7c3}
.order-list-renewal .ol-next-green{border-color:var(--ol-green-dark);background:var(--ol-green-dark)}
.order-list-renewal .ol-next-green>span{color:#9bd5b7}
.order-list-renewal .ol-next-green>strong,.order-list-renewal .ol-next-green p{color:#fff}
.order-list-renewal .ol-next-green p{opacity:.76}

/* RESPONSIVE */
@media screen and (max-width:1040px){
 .order-list-renewal .ol-about-inner,.order-list-renewal .ol-usecase-inner{grid-template-columns:1fr;gap:35px}
 .order-list-renewal .ol-customize-inner{display:block}
 .order-list-renewal .ol-outline-btn{margin-top:24px}
}
@media screen and (max-width:820px){
 .order-list-renewal .ol-feature-grid,.order-list-renewal .ol-next-grid{grid-template-columns:1fr}
 .order-list-renewal .ol-feature-wide{grid-column:auto}
}
@media screen and (max-width:680px){
 .order-list-renewal .ol-container{width:calc(100% - 30px)}
 .order-list-renewal .ol-section{padding:68px 0}
 .order-list-renewal .ol-hero{padding:58px 0 125px}
 .order-list-renewal .ol-hero h1{font-size:40px}
 .order-list-renewal .ol-hero-lead{font-size:20px!important}
 .order-list-renewal .ol-hero-text{font-size:14px!important}
 .order-list-renewal .ol-screen-section{margin-top:-75px;padding-bottom:55px}
 .order-list-renewal .ol-screen-image{padding:12px}
 .order-list-renewal .ol-screen-head{min-height:40px;padding:0 12px}
 .order-list-renewal .ol-about-title h2,.order-list-renewal .ol-section-head h2,.order-list-renewal .ol-usecase h2,.order-list-renewal .ol-customize h2{font-size:27px;line-height:1.45}
 .order-list-renewal .ol-feature-card{padding:21px 18px}
 .order-list-renewal .ol-outline-btn{width:100%}
}


/* =========================================================
   ORDER LIST NEXT CARDS FIX
   WordPressの自動br / p挿入にも耐えるレイアウト
========================================================= */

.order-list-renewal .ol-next-grid {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: center !important;
    gap: 16px !important;
    width: 100% !important;
    max-width: 1000px !important;
    margin: 0 auto !important;
}

/* WordPressの自動改行を無効化 */
.order-list-renewal .ol-next-grid br {
    display: none !important;
}

/* aタグがpで囲まれた場合も、p自体をレイアウトから除外 */
.order-list-renewal .ol-next-grid > p {
    display: contents !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 直接配置・p内配置のどちらにも対応 */
.order-list-renewal .ol-next-grid > .ol-next-card,
.order-list-renewal .ol-next-grid > p > .ol-next-card {
    display: block !important;
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 26px 23px !important;
}

/* タブレット以下では縦並び */
@media screen and (max-width: 820px) {
    .order-list-renewal .ol-next-grid {
        flex-direction: column !important;
        gap: 12px !important;
    }

    .order-list-renewal .ol-next-grid > .ol-next-card,
    .order-list-renewal .ol-next-grid > p > .ol-next-card {
        width: 100% !important;
        flex: none !important;
    }
}


/* =========================================================
   ORDER LIST FINAL TYPOGRAPHY + NEXT LAYOUT FIX
========================================================= */

/* ABOUT見出しを意図した2行で表示 */
.order-list-renewal .ol-about-title {
    min-width: 430px !important;
}

.order-list-renewal .ol-about-title h2 {
    font-size: clamp(32px, 3.25vw, 42px) !important;
    line-height: 1.42 !important;
    letter-spacing: -0.03em !important;
}

.order-list-renewal .ol-about-line {
    display: block !important;
    width: 100% !important;
    white-space: nowrap !important;
}

/* 機能カード内はすべて左寄せ */
.order-list-renewal .ol-feature-card,
.order-list-renewal .ol-feature-body,
.order-list-renewal .ol-feature-body h3,
.order-list-renewal .ol-feature-body p {
    text-align: left !important;
}

.order-list-renewal .ol-feature-card h3 {
    width: 100% !important;
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
    text-align: left !important;
}

/* NEXT
   外側と実レイアウトを分離。
   WordPressが外側にbr/pを挿入しても3カードの並びには影響させない。
*/
.order-list-renewal .ol-next-shell {
    display: block !important;
    width: 100% !important;
    max-width: 1000px !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

.order-list-renewal .ol-next-shell > br,
.order-list-renewal .ol-next-shell > p:empty,
.order-list-renewal .ol-next-row > br,
.order-list-renewal .ol-next-row > p:empty {
    display: none !important;
}

.order-list-renewal .ol-next-row {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: center !important;
    gap: 16px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.order-list-renewal .ol-next-row > .ol-next-card {
    display: flex !important;
    flex: 1 1 0 !important;
    flex-direction: column !important;
    width: 0 !important;
    min-width: 0 !important;
    min-height: 178px !important;
    margin: 0 !important;
    padding: 27px 25px !important;
    border: 1px solid #d0e1d7 !important;
    border-radius: 11px !important;
    background: #fff !important;
    box-shadow: none !important;
    text-decoration: none !important;
}

.order-list-renewal .ol-next-row > .ol-next-main {
    border-color: #b7d7c3 !important;
}

.order-list-renewal .ol-next-row > .ol-next-green {
    border-color: var(--ol-green-dark) !important;
    background: var(--ol-green-dark) !important;
}

.order-list-renewal .ol-next-label {
    display: block !important;
    margin: 0 0 9px 0 !important;
    color: var(--ol-green) !important;
    font-size: 9px !important;
    line-height: 1.4 !important;
    font-weight: 800 !important;
    letter-spacing: .12em !important;
    text-align: left !important;
}

.order-list-renewal .ol-next-row .ol-next-card > strong {
    display: block !important;
    width: 100% !important;
    margin: 0 0 9px 0 !important;
    padding: 0 !important;
    color: var(--ol-text) !important;
    font-size: 19px !important;
    line-height: 1.5 !important;
    font-weight: 700 !important;
    text-align: left !important;
    white-space: normal !important;
    word-break: keep-all !important;
}

.order-list-renewal .ol-next-desc {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--ol-muted) !important;
    font-size: 12px !important;
    line-height: 1.75 !important;
    font-weight: 400 !important;
    text-align: left !important;
    white-space: normal !important;
    word-break: normal !important;
}

.order-list-renewal .ol-next-row > .ol-next-green .ol-next-label {
    color: #9bd5b7 !important;
}

.order-list-renewal .ol-next-row > .ol-next-green > strong,
.order-list-renewal .ol-next-row > .ol-next-green .ol-next-desc {
    color: #fff !important;
}

.order-list-renewal .ol-next-row > .ol-next-green .ol-next-desc {
    opacity: .76 !important;
}

@media screen and (max-width: 1040px) {
    .order-list-renewal .ol-about-title {
        min-width: 0 !important;
    }
}

@media screen and (max-width: 820px) {
    .order-list-renewal .ol-next-row {
        flex-direction: column !important;
        gap: 12px !important;
    }

    .order-list-renewal .ol-next-row > .ol-next-card {
        flex: none !important;
        width: 100% !important;
        min-height: 0 !important;
    }
}

@media screen and (max-width: 680px) {
    .order-list-renewal .ol-about-title h2 {
        font-size: 27px !important;
    }

    .order-list-renewal .ol-about-line {
        white-space: nowrap !important;
    }
}


/* =========================================================
   ORDER LIST OTHER SCREEN PICKER
========================================================= */
.order-list-renewal .ol-next .ol-section-head{margin-bottom:38px!important}
.order-list-renewal .ol-screen-picker{
 display:grid!important;
 grid-template-columns:repeat(5,minmax(0,1fr))!important;
 gap:12px!important;
 width:100%!important;
 max-width:1060px!important;
 margin:0 auto!important;
 padding:0!important
}
.order-list-renewal .ol-screen-picker>br,
.order-list-renewal .ol-screen-picker>p:empty{display:none!important}
.order-list-renewal .ol-screen-choice{
 position:relative!important;
 display:flex!important;
 flex-direction:column!important;
 min-width:0!important;
 min-height:132px!important;
 margin:0!important;
 padding:19px 18px!important;
 border:1px solid #cfe0d6!important;
 border-radius:10px!important;
 background:#fff!important;
 color:var(--ol-text)!important;
 text-decoration:none!important;
 box-shadow:none!important;
 transition:transform .18s ease,border-color .18s ease,background .18s ease!important
}
.order-list-renewal .ol-screen-choice::after{
 content:"\2192"!important;
 position:absolute!important;
 right:16px!important;
 bottom:14px!important;
 color:#8eb09d!important;
 font-size:17px!important;
 line-height:1!important
}
.order-list-renewal .ol-screen-choice>span{
 display:block!important;
 margin:0 0 10px!important;
 color:var(--ol-green)!important;
 font-size:9px!important;
 line-height:1.35!important;
 font-weight:800!important;
 letter-spacing:.11em!important;
 text-align:left!important
}
.order-list-renewal .ol-screen-choice>strong{
 display:block!important;
 width:100%!important;
 margin:0!important;
 padding:0!important;
 color:var(--ol-text)!important;
 font-size:16px!important;
 line-height:1.5!important;
 font-weight:700!important;
 text-align:left!important;
 word-break:keep-all!important
}
.order-list-renewal .ol-screen-choice>em{
 display:block!important;
 margin:auto 0 0!important;
 padding:12px 24px 0 0!important;
 color:#7a8981!important;
 font-size:10px!important;
 line-height:1.4!important;
 font-weight:400!important;
 font-style:normal!important;
 text-align:left!important
}
.order-list-renewal .ol-screen-choice:hover{
 transform:translateY(-2px)!important;
 border-color:#9fc9b0!important;
 background:#f7fbf8!important
}
.order-list-renewal .ol-screen-list-link{margin-top:25px!important;text-align:center!important}
.order-list-renewal .ol-screen-list-link a{
 color:var(--ol-green-dark)!important;
 font-size:12px!important;
 line-height:1.5!important;
 font-weight:700!important;
 text-decoration:none!important
}
@media screen and (max-width:1040px){
 .order-list-renewal .ol-screen-picker{grid-template-columns:repeat(2,minmax(0,1fr))!important;max-width:720px!important}
 .order-list-renewal .ol-screen-choice{min-height:118px!important}
}
@media screen and (max-width:560px){
 .order-list-renewal .ol-screen-picker{grid-template-columns:1fr!important;gap:9px!important}
 .order-list-renewal .ol-screen-choice{min-height:0!important;padding:17px 18px!important}
 .order-list-renewal .ol-screen-choice>span{margin-bottom:6px!important}
 .order-list-renewal .ol-screen-choice>em{margin-top:7px!important;padding-top:0!important}
}

/* =========================================================
   SCREEN DETAIL PAGES RENEWAL
   Scope: .screen-detail-renewal
========================================================= */
.screen-detail-renewal{
 --sd-green:#16824b;--sd-green-dark:#0b5635;--sd-deep:#163129;
 --sd-soft:#eff8f3;--sd-pale:#f7fbf8;--sd-line:#dcebe2;
 --sd-text:#26352e;--sd-muted:#66736c;--sd-shadow:0 22px 56px rgba(18,72,45,.10);
 width:100%;max-width:100%;overflow-x:clip;color:var(--sd-text);background:#fff
}
.screen-detail-renewal,.screen-detail-renewal *,.screen-detail-renewal *::before,.screen-detail-renewal *::after{box-sizing:border-box}
.screen-detail-renewal .sd-container{width:calc(100% - 48px);max-width:1160px;margin-left:auto;margin-right:auto}
.screen-detail-renewal p,.screen-detail-renewal a,.screen-detail-renewal span,.screen-detail-renewal strong,.screen-detail-renewal em,.screen-detail-renewal h1,.screen-detail-renewal h2,.screen-detail-renewal h3{font-family:'Noto Sans Japanese','Noto Sans JP',sans-serif}
.screen-detail-renewal p{margin:0;color:var(--sd-text);font-size:16px;line-height:1.95}
.screen-detail-renewal h1,.screen-detail-renewal h2,.screen-detail-renewal h3{width:auto;margin:0;color:var(--sd-text);font-weight:700;word-break:normal;overflow-wrap:normal;line-break:strict}
.screen-detail-renewal h2{font-size:clamp(30px,3.4vw,42px);line-height:1.4;letter-spacing:-.02em}
.screen-detail-renewal .sd-section{padding:94px 0}
.screen-detail-renewal .sd-kicker,.screen-detail-renewal .sd-eyebrow{margin:0 0 13px;color:var(--sd-green);font-size:11px;line-height:1.4;font-weight:800;letter-spacing:.14em}
.screen-detail-renewal .sd-section-head{max-width:850px;margin:0 auto 48px;text-align:center}
.screen-detail-renewal .sd-section-head .sd-kicker,.screen-detail-renewal .sd-section-head h2,.screen-detail-renewal .sd-section-head>p{text-align:center}
.screen-detail-renewal .sd-section-head>p:last-child{max-width:700px;margin:15px auto 0;color:var(--sd-muted);font-size:14px}

/* HERO */
.screen-detail-renewal .sd-hero{position:relative;padding:82px 0 170px;overflow:hidden;background:linear-gradient(135deg,#f7fbf8 0%,#eff8f3 100%)}
.screen-detail-renewal .sd-hero::after{content:"";position:absolute;top:-190px;right:-130px;width:470px;height:470px;border-radius:50%;background:rgba(22,130,75,.05)}
.screen-detail-renewal .sd-hero-copy{position:relative;z-index:1;max-width:860px;margin:0 auto;text-align:center}
.screen-detail-renewal .sd-eyebrow{text-align:center}
.screen-detail-renewal .sd-hero h1{margin-bottom:18px;font-size:clamp(42px,5vw,60px);line-height:1.2;letter-spacing:-.045em;text-align:center}
.screen-detail-renewal .sd-hero-lead{margin-bottom:16px!important;color:var(--sd-green-dark)!important;font-size:clamp(22px,2.5vw,30px)!important;line-height:1.6!important;font-weight:700;text-align:center}
.screen-detail-renewal .sd-hero-text{max-width:760px;margin:0 auto!important;color:#526158!important;font-size:15px!important;line-height:1.9!important;text-align:center}
.screen-detail-renewal .sd-hero-tags{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:26px}
.screen-detail-renewal .sd-hero-tags span{display:inline-block;padding:6px 12px;border:1px solid #c9dfd2;border-radius:16px;background:#fff;color:var(--sd-green-dark);font-size:10px;font-weight:700}

/* SCREEN */
.screen-detail-renewal .sd-screen-section{position:relative;margin-top:-105px;padding-bottom:76px}
.screen-detail-renewal .sd-screen-frame{width:100%;max-width:1100px;margin:0 auto;overflow:hidden;border:1px solid #cbded2;border-radius:15px;background:#fff;box-shadow:var(--sd-shadow)}
.screen-detail-renewal .sd-screen-head{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:46px;padding:0 18px;border-bottom:1px solid #e3ece7;background:#f8fbf9}
.screen-detail-renewal .sd-screen-label{color:var(--sd-green);font-size:9px;font-weight:800;letter-spacing:.13em}
.screen-detail-renewal .sd-screen-head strong{color:#526158;font-size:11px}
.screen-detail-renewal .sd-screen-image{display:flex;align-items:center;justify-content:center;padding:30px;background:#fff}
.screen-detail-renewal .sd-screen-image img{display:block;width:auto;max-width:100%;height:auto;margin:0 auto}
.screen-detail-renewal .sd-screen-caption{max-width:900px;margin:17px auto 0!important;color:var(--sd-muted)!important;font-size:12px!important;line-height:1.75!important;text-align:center}

/* ABOUT */
.screen-detail-renewal .sd-about-inner{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(50px,7vw,88px);align-items:start;max-width:1000px}
.screen-detail-renewal .sd-about-title,.screen-detail-renewal .sd-about-text{min-width:0}
.screen-detail-renewal .sd-about-title h2{font-size:clamp(32px,3.5vw,44px)}
.screen-detail-renewal .sd-about-text p{margin-bottom:14px;color:#526158}
.screen-detail-renewal .sd-about-text p:last-child{margin-bottom:0}
.screen-detail-renewal .sd-about-line{display:block;width:100%;white-space:nowrap}

/* FEATURES */
.screen-detail-renewal .sd-features{background:var(--sd-pale)}
.screen-detail-renewal .sd-feature-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;max-width:1000px;margin:0 auto}
.screen-detail-renewal .sd-feature-card{display:flex;align-items:flex-start;gap:18px;min-width:0;padding:27px 25px;border:1px solid var(--sd-line);border-radius:12px;background:#fff}
.screen-detail-renewal .sd-feature-no{display:flex;flex:0 0 42px;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;background:var(--sd-green);color:#fff;font-size:10px;font-weight:800}
.screen-detail-renewal .sd-feature-body{flex:1 1 auto;min-width:0}
.screen-detail-renewal .sd-feature-en{margin-bottom:5px;color:var(--sd-green);font-size:9px;line-height:1.4;font-weight:800;letter-spacing:.12em}
.screen-detail-renewal .sd-feature-card h3,
.screen-detail-renewal .sd-feature-card p{text-align:left}
.screen-detail-renewal .sd-feature-card h3{margin-bottom:8px;font-size:18px;line-height:1.55}
.screen-detail-renewal .sd-feature-card p:not(.sd-feature-en){color:var(--sd-muted);font-size:13px;line-height:1.8}

/* CUSTOMIZE */
.screen-detail-renewal .sd-customize{background:#fff}
.screen-detail-renewal .sd-customize-inner{display:flex;align-items:center;justify-content:space-between;gap:50px;max-width:1000px}
.screen-detail-renewal .sd-customize-copy{flex:1 1 auto;min-width:0}
.screen-detail-renewal .sd-customize h2{margin-bottom:14px}
.screen-detail-renewal .sd-customize p:not(.sd-kicker){max-width:700px;color:#526158}
.screen-detail-renewal .sd-outline-btn{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;min-height:52px;padding:0 24px;border:1px solid #bad5c5;border-radius:8px;background:var(--sd-pale);color:var(--sd-green-dark);font-size:13px;font-weight:700;text-decoration:none}

/* OTHER SCREENS */
.screen-detail-renewal .sd-other{background:var(--sd-soft)}
.screen-detail-renewal .sd-other .sd-section-head{margin-bottom:38px!important}
.screen-detail-renewal .sd-screen-picker{
 display:grid!important;
 grid-template-columns:repeat(5,minmax(0,1fr))!important;
 gap:12px!important;
 width:100%!important;
 max-width:1060px!important;
 margin:0 auto!important;
 padding:0!important
}
.screen-detail-renewal .sd-screen-picker>br,
.screen-detail-renewal .sd-screen-picker>p:empty{display:none!important}
.screen-detail-renewal .sd-screen-choice{
 position:relative!important;
 display:flex!important;
 flex-direction:column!important;
 min-width:0!important;
 min-height:132px!important;
 margin:0!important;
 padding:19px 18px!important;
 border:1px solid #cfe0d6!important;
 border-radius:10px!important;
 background:#fff!important;
 color:var(--sd-text)!important;
 text-decoration:none!important;
 box-shadow:none!important;
 transition:transform .18s ease,border-color .18s ease,background .18s ease!important
}
.screen-detail-renewal .sd-screen-choice::after{
 content:"\2192"!important;
 position:absolute!important;
 right:16px!important;
 bottom:14px!important;
 color:#8eb09d!important;
 font-size:17px!important;
 line-height:1!important
}
.screen-detail-renewal .sd-screen-choice>span{
 display:block!important;
 margin:0 0 10px!important;
 color:var(--sd-green)!important;
 font-size:9px!important;
 line-height:1.35!important;
 font-weight:800!important;
 letter-spacing:.11em!important;
 text-align:left!important
}
.screen-detail-renewal .sd-screen-choice>strong{
 display:block!important;
 width:100%!important;
 margin:0!important;
 padding:0!important;
 color:var(--sd-text)!important;
 font-size:16px!important;
 line-height:1.5!important;
 font-weight:700!important;
 text-align:left!important;
 word-break:keep-all!important
}
.screen-detail-renewal .sd-screen-choice>em{
 display:block!important;
 margin:auto 0 0!important;
 padding:12px 24px 0 0!important;
 color:#7a8981!important;
 font-size:10px!important;
 line-height:1.4!important;
 font-weight:400!important;
 font-style:normal!important;
 text-align:left!important
}
.screen-detail-renewal .sd-screen-choice:hover{
 transform:translateY(-2px)!important;
 border-color:#9fc9b0!important;
 background:#f7fbf8!important
}
.screen-detail-renewal .sd-screen-list-link{margin-top:25px!important;text-align:center!important}
.screen-detail-renewal .sd-screen-list-link a{
 color:var(--sd-green-dark)!important;
 font-size:12px!important;
 line-height:1.5!important;
 font-weight:700!important;
 text-decoration:none!important
}

/* CONTACT */
.screen-detail-renewal .sd-contact{background:var(--sd-deep)}
.screen-detail-renewal .sd-contact-inner{display:flex;align-items:center;justify-content:space-between;gap:40px;max-width:1000px}
.screen-detail-renewal .sd-contact-copy{flex:1 1 auto;min-width:0}
.screen-detail-renewal .sd-contact .sd-kicker{color:#9bd5b7}
.screen-detail-renewal .sd-contact h2{color:#fff}
.screen-detail-renewal .sd-contact p:not(.sd-kicker){max-width:650px;color:rgba(255,255,255,.80)}
.screen-detail-renewal .sd-contact-actions{display:flex;flex-wrap:wrap;gap:12px}
.screen-detail-renewal .sd-contact-btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 22px;border-radius:8px;font-size:13px;font-weight:700;text-decoration:none}
.screen-detail-renewal .sd-contact-btn.is-primary{background:#fff;color:var(--sd-green-dark)}
.screen-detail-renewal .sd-contact-btn.is-secondary{border:1px solid rgba(255,255,255,.22);color:#fff;background:rgba(255,255,255,.08)}

/* RESPONSIVE */
@media screen and (max-width:1040px){
 .screen-detail-renewal .sd-about-inner{grid-template-columns:1fr;gap:35px}
 .screen-detail-renewal .sd-customize-inner,.screen-detail-renewal .sd-contact-inner{display:block}
 .screen-detail-renewal .sd-outline-btn,.screen-detail-renewal .sd-contact-actions{margin-top:24px}
 .screen-detail-renewal .sd-screen-picker{grid-template-columns:repeat(2,minmax(0,1fr))!important;max-width:720px!important}
 .screen-detail-renewal .sd-screen-choice{min-height:118px!important}
}
@media screen and (max-width:820px){
 .screen-detail-renewal .sd-feature-grid{grid-template-columns:1fr}
}
@media screen and (max-width:680px){
 .screen-detail-renewal .sd-container{width:calc(100% - 30px)}
 .screen-detail-renewal .sd-section{padding:68px 0}
 .screen-detail-renewal .sd-hero{padding:58px 0 125px}
 .screen-detail-renewal .sd-hero h1{font-size:40px}
 .screen-detail-renewal .sd-hero-lead{font-size:20px!important}
 .screen-detail-renewal .sd-hero-text{font-size:14px!important}
 .screen-detail-renewal .sd-screen-section{margin-top:-75px;padding-bottom:55px}
 .screen-detail-renewal .sd-screen-image{padding:12px}
 .screen-detail-renewal .sd-screen-head{min-height:40px;padding:0 12px}
 .screen-detail-renewal .sd-about-title h2,.screen-detail-renewal .sd-section-head h2,.screen-detail-renewal .sd-customize h2,.screen-detail-renewal .sd-contact h2{font-size:27px;line-height:1.45}
 .screen-detail-renewal .sd-feature-card{padding:21px 18px}
 .screen-detail-renewal .sd-outline-btn{width:100%}
 .screen-detail-renewal .sd-screen-picker{grid-template-columns:1fr!important;gap:9px!important}
 .screen-detail-renewal .sd-screen-choice{min-height:0!important;padding:17px 18px!important}
 .screen-detail-renewal .sd-screen-choice>span{margin-bottom:6px!important}
 .screen-detail-renewal .sd-screen-choice>em{margin-top:7px!important;padding-top:0!important}
}

/* =========================================================
   PRIVACY POLICY
   Scope: .privacy-renewal
========================================================= */
.privacy-renewal{
 --pp-green:#16824b;--pp-green-dark:#0b5635;--pp-soft:#eff8f3;
 --pp-pale:#f7fbf8;--pp-line:#dcebe2;--pp-text:#26352e;--pp-muted:#66736c;
 width:100%;max-width:100%;overflow-x:clip;background:#fff;color:var(--pp-text)
}
.privacy-renewal,.privacy-renewal *,.privacy-renewal *::before,.privacy-renewal *::after{box-sizing:border-box}
.privacy-renewal .pp-container{width:calc(100% - 48px);max-width:1160px;margin-left:auto;margin-right:auto}
.privacy-renewal .pp-narrow{max-width:860px}
.privacy-renewal p,.privacy-renewal li,.privacy-renewal h1,.privacy-renewal h2,.privacy-renewal span,.privacy-renewal strong{font-family:'Noto Sans Japanese','Noto Sans JP',sans-serif}
.privacy-renewal p{margin:0;color:var(--pp-text);font-size:15px;line-height:1.95}
.privacy-renewal h1,.privacy-renewal h2{width:auto;margin:0;color:var(--pp-text);font-weight:700;word-break:normal;overflow-wrap:normal;line-break:strict}

/* HERO */
.privacy-renewal .pp-hero{padding:82px 0 78px;background:linear-gradient(135deg,#f7fbf8 0%,#eff8f3 100%);text-align:center}
.privacy-renewal .pp-kicker{margin:0 0 13px;color:var(--pp-green);font-size:11px;line-height:1.4;font-weight:800;letter-spacing:.14em;text-align:center}
.privacy-renewal .pp-hero h1{font-size:clamp(38px,4.6vw,56px);line-height:1.25;letter-spacing:-.035em;text-align:center}
.privacy-renewal .pp-hero-lead{margin-top:16px;color:#526158;font-size:15px;text-align:center}

/* CONTENT */
.privacy-renewal .pp-content{padding:78px 0 100px;background:#fff}
.privacy-renewal .pp-intro{margin-bottom:56px;padding:0 0 34px;border-bottom:1px solid var(--pp-line)}
.privacy-renewal .pp-intro p{color:#46564d;font-size:16px;line-height:2}

.privacy-renewal .pp-block{padding:0 0 42px;margin:0 0 42px;border-bottom:1px solid var(--pp-line)}
.privacy-renewal .pp-block:last-child{margin-bottom:0}
.privacy-renewal .pp-block h2{display:flex;align-items:center;gap:13px;margin-bottom:20px;font-size:21px;line-height:1.55;text-align:left}
.privacy-renewal .pp-block h2>span{display:inline-flex;flex:0 0 34px;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:var(--pp-soft);color:var(--pp-green);font-size:9px;font-weight:800}
.privacy-renewal .pp-block p{margin-bottom:12px;color:#526158;text-align:left}
.privacy-renewal .pp-block p:last-child{margin-bottom:0}
.privacy-renewal .pp-block ul{margin:15px 0 18px;padding:0;list-style:none}
.privacy-renewal .pp-block li{position:relative;margin:0 0 7px;padding-left:18px;color:#526158;font-size:14px;line-height:1.8;text-align:left}
.privacy-renewal .pp-block li::before{content:"";position:absolute;left:2px;top:.78em;width:5px;height:5px;border-radius:50%;background:var(--pp-green)}

/* CONTACT */
.privacy-renewal .pp-contact{border-bottom:0;padding-bottom:0}
.privacy-renewal .pp-contact-box{padding:25px 27px;border:1px solid var(--pp-line);border-radius:10px;background:var(--pp-pale)}
.privacy-renewal .pp-contact-box strong{display:block;margin-bottom:10px;color:var(--pp-green-dark);font-size:16px}
.privacy-renewal .pp-contact-box p{margin-bottom:7px;font-size:14px;line-height:1.8}

/* WordPress auto formatting safety */
.privacy-renewal>br,
.privacy-renewal section>br,
.privacy-renewal .pp-container>br,
.privacy-renewal .pp-block>br{display:none!important}

@media screen and (max-width:680px){
 .privacy-renewal .pp-container{width:calc(100% - 30px)}
 .privacy-renewal .pp-hero{padding:58px 0 55px}
 .privacy-renewal .pp-hero h1{font-size:34px}
 .privacy-renewal .pp-content{padding:58px 0 74px}
 .privacy-renewal .pp-intro{margin-bottom:42px;padding-bottom:27px}
 .privacy-renewal .pp-intro p{font-size:14px;line-height:1.9}
 .privacy-renewal .pp-block{padding-bottom:32px;margin-bottom:32px}
 .privacy-renewal .pp-block h2{align-items:flex-start;font-size:18px}
 .privacy-renewal .pp-block h2>span{margin-top:1px}
 .privacy-renewal .pp-block p{font-size:14px;line-height:1.9}
 .privacy-renewal .pp-contact-box{padding:21px 19px}
}



/* =========================================================
   MOBILE SLIDE MENU TEXT COLOR FIX
========================================================= */
@media screen and (max-width: 768px) {

    /* スライドメニューは濃いグリーンで統一 */
    body nav,
    body.nav-open nav {
        background-color: #0b5635 !important;
    }

    /* メニュー文字を白に固定 */
    body nav li a,
    body nav li a:link,
    body nav li a:visited,
    body nav li a:hover,
    body nav li a:focus,
    body nav li a:active,
    body nav li.current-menu-item > a,
    body nav li.current_page_item > a,
    body nav li.current-menu-parent > a,
    body nav li.current_page_parent > a {
        color: #ffffff !important;
    }

    /* 区切り線も緑背景向けに調整 */
    body nav li {
        border-bottom-color: rgba(255,255,255,.15) !important;
    }

    /* 開いている時のハンバーガーも白に */
    body.nav-open .hamburger span {
        background-color: #ffffff !important;
    }
}



/* =========================================================
   TOP BENEFIT NUMBER EMPHASIS
   01 / 02 / 03 を「3つのポイント」として大きく演出
========================================================= */
.home-renewal .tr-benefit-no {
    display: block !important;
    margin: 0 0 14px 0 !important;
    color: #a8d7ba !important;
    font-size: clamp(56px, 6vw, 68px) !important;
    line-height: .9 !important;
    font-weight: 800 !important;
    letter-spacing: -0.055em !important;
}

.home-renewal .tr-benefit-copy h3 {
    margin-top: 0 !important;
}

/* モバイルでは少し抑える */
@media screen and (max-width: 680px) {
    .home-renewal .tr-benefit-no {
        margin-bottom: 12px !important;
        font-size: 50px !important;
        line-height: .95 !important;
    }
}

/* =========================================================
   TORIKIME CLOUD SERVER
   Scope: .cloud-renewal
========================================================= */
.cloud-renewal{
 --cl-green:#16824b;--cl-green-dark:#0b5635;--cl-deep:#163129;
 --cl-soft:#eff8f3;--cl-pale:#f7fbf8;--cl-line:#dcebe2;
 --cl-text:#26352e;--cl-muted:#66736c;--cl-shadow:0 22px 56px rgba(18,72,45,.10);
 width:100%;max-width:100%;overflow-x:clip;background:#fff;color:var(--cl-text)
}
.cloud-renewal,.cloud-renewal *,.cloud-renewal *::before,.cloud-renewal *::after{box-sizing:border-box}
.cloud-renewal .cl-container{width:calc(100% - 48px);max-width:1160px;margin-left:auto;margin-right:auto}
.cloud-renewal .cl-narrow{max-width:960px}
.cloud-renewal p,.cloud-renewal a,.cloud-renewal span,.cloud-renewal strong,.cloud-renewal small,.cloud-renewal h1,.cloud-renewal h2,.cloud-renewal h3,.cloud-renewal li{font-family:'Noto Sans Japanese','Noto Sans JP',sans-serif}
.cloud-renewal p{margin:0;color:var(--cl-text);font-size:16px;line-height:1.95}
.cloud-renewal h1,.cloud-renewal h2,.cloud-renewal h3{width:auto;margin:0;color:var(--cl-text);font-weight:700;word-break:normal;overflow-wrap:normal;line-break:strict}
.cloud-renewal h2{font-size:clamp(30px,3.4vw,42px);line-height:1.42;letter-spacing:-.02em}
.cloud-renewal .cl-section{padding:94px 0}
.cloud-renewal .cl-kicker,.cloud-renewal .cl-eyebrow{margin:0 0 13px;color:var(--cl-green);font-size:11px;line-height:1.4;font-weight:800;letter-spacing:.14em}
.cloud-renewal .cl-section-head{max-width:850px;margin:0 auto 48px;text-align:center}
.cloud-renewal .cl-section-head .cl-kicker,.cloud-renewal .cl-section-head h2,.cloud-renewal .cl-section-head>p{text-align:center}
.cloud-renewal .cl-section-head>p:last-child{max-width:720px;margin:15px auto 0;color:var(--cl-muted);font-size:14px}

/* HERO */
.cloud-renewal .cl-hero{position:relative;padding:86px 0 92px;overflow:hidden;background:linear-gradient(135deg,#f7fbf8 0%,#eff8f3 100%)}
.cloud-renewal .cl-hero::after{content:"";position:absolute;top:-210px;right:-120px;width:520px;height:520px;border-radius:50%;background:rgba(22,130,75,.05)}
.cloud-renewal .cl-hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(420px,.9fr);gap:72px;align-items:center}
.cloud-renewal .cl-hero-copy{min-width:0}
.cloud-renewal .cl-hero h1{margin-bottom:20px;font-size:clamp(46px,5vw,64px);line-height:1.2;letter-spacing:-.045em}
.cloud-renewal .cl-hero-lead{margin-bottom:16px!important;color:var(--cl-green-dark)!important;font-size:clamp(21px,2.2vw,28px)!important;line-height:1.65!important;font-weight:700}
.cloud-renewal .cl-hero-text{max-width:700px;color:#526158!important;font-size:15px!important;line-height:1.9!important}
.cloud-renewal .cl-hero-actions{display:flex;flex-wrap:wrap;gap:11px;margin-top:28px}
.cloud-renewal .cl-btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 23px;border-radius:8px;font-size:13px;font-weight:700;text-decoration:none}
.cloud-renewal .cl-btn-primary{border:1px solid var(--cl-green);background:var(--cl-green);color:#fff}
.cloud-renewal .cl-btn-outline{border:1px solid #b7d4c2;background:#fff;color:var(--cl-green-dark)}

/* NETWORK VISUAL */
.cloud-renewal .cl-network-card{padding:32px 28px;border:1px solid #c9ddd1;border-radius:15px;background:#fff;box-shadow:var(--cl-shadow)}
.cloud-renewal .cl-cloud-box{position:relative;padding:23px 20px;border:1px solid #a9cfb8;border-radius:10px;background:var(--cl-soft);text-align:center}
.cloud-renewal .cl-cloud-box>span{display:block;margin-bottom:5px;color:var(--cl-green);font-size:9px;font-weight:800;letter-spacing:.14em}
.cloud-renewal .cl-cloud-box>strong{display:block;color:var(--cl-green-dark);font-size:18px;line-height:1.5}
.cloud-renewal .cl-cloud-box>small{display:block;margin-top:5px;color:var(--cl-muted);font-size:10px}
.cloud-renewal .cl-network-line{width:1px;height:38px;margin:0 auto;background:#a8cbb5}
.cloud-renewal .cl-endpoints{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.cloud-renewal .cl-endpoints>div{padding:15px 8px;border:1px solid var(--cl-line);border-radius:8px;background:#fff;text-align:center}
.cloud-renewal .cl-endpoints span{display:block;margin-bottom:3px;color:#849289;font-size:8px;font-weight:800;letter-spacing:.1em}
.cloud-renewal .cl-endpoints strong{display:block;color:var(--cl-text);font-size:13px}
.cloud-renewal .cl-network-card>p{margin-top:15px;color:var(--cl-green-dark);font-size:10px;font-weight:700;text-align:center}

/* INTRO */
.cloud-renewal .cl-intro{text-align:center}
.cloud-renewal .cl-intro .cl-kicker,.cloud-renewal .cl-intro h2{text-align:center}
.cloud-renewal .cl-intro-lead{max-width:760px;margin:18px auto 38px!important;color:#526158!important;text-align:center}
.cloud-renewal .cl-change-row{display:grid;grid-template-columns:minmax(0,1fr) 42px minmax(0,1fr);gap:18px;align-items:center}
.cloud-renewal .cl-change-card{min-width:0;padding:27px 25px;border:1px solid var(--cl-line);border-radius:11px;background:var(--cl-pale);text-align:left}
.cloud-renewal .cl-change-card.is-after{border-color:#b9d8c5;background:var(--cl-soft)}
.cloud-renewal .cl-change-card>span{display:block;margin-bottom:7px;color:#849289;font-size:9px;font-weight:800;letter-spacing:.12em}
.cloud-renewal .cl-change-card.is-after>span{color:var(--cl-green)}
.cloud-renewal .cl-change-card>strong{display:block;margin-bottom:7px;color:var(--cl-text);font-size:18px}
.cloud-renewal .cl-change-card>p{color:var(--cl-muted);font-size:13px;line-height:1.8}
.cloud-renewal .cl-change-arrow{color:#91b4a0;font-size:24px;text-align:center}

/* FEATURES */
.cloud-renewal .cl-features{background:var(--cl-pale)}
.cloud-renewal .cl-feature-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;max-width:1000px;margin:0 auto}
.cloud-renewal .cl-feature-card{min-width:0;padding:29px 27px;border:1px solid var(--cl-line);border-radius:12px;background:#fff}
.cloud-renewal .cl-feature-no{display:block;margin-bottom:18px;color:#a8d7ba;font-size:46px;line-height:.9;font-weight:800;letter-spacing:-.05em}
.cloud-renewal .cl-feature-card h3{margin-bottom:9px;font-size:19px;line-height:1.55;text-align:left}
.cloud-renewal .cl-feature-card p{color:var(--cl-muted);font-size:13px;line-height:1.85;text-align:left}

/* USE */
.cloud-renewal .cl-use{background:var(--cl-deep)}
.cloud-renewal .cl-use-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(50px,7vw,86px);align-items:center;max-width:1000px}
.cloud-renewal .cl-use .cl-kicker{color:#9bd5b7}
.cloud-renewal .cl-use h2{color:#fff}
.cloud-renewal .cl-use-copy>p:not(.cl-kicker){margin-top:15px;color:rgba(255,255,255,.72)}
.cloud-renewal .cl-use-list{display:grid;gap:9px}
.cloud-renewal .cl-use-list>div{display:flex;align-items:center;gap:14px;min-width:0;padding:15px 17px;border:1px solid rgba(255,255,255,.13);border-radius:9px;background:rgba(255,255,255,.07)}
.cloud-renewal .cl-use-list span{display:flex;flex:0 0 32px;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:#fff;color:var(--cl-green-dark);font-size:9px;font-weight:800}
.cloud-renewal .cl-use-list p{flex:1 1 auto;min-width:0;color:rgba(255,255,255,.84);font-size:13px;line-height:1.7}

/* SECURITY */
.cloud-renewal .cl-security{background:#fff}
.cloud-renewal .cl-security-inner{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:70px;max-width:1000px;align-items:start}
.cloud-renewal .cl-security-copy p{margin-bottom:14px;color:#526158}
.cloud-renewal .cl-security-copy p:last-child{margin-bottom:0}

/* PRICE */
.cloud-renewal .cl-price{background:var(--cl-pale)}
.cloud-renewal .cl-price-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;max-width:940px;margin:0 auto 24px}
.cloud-renewal .cl-plan{position:relative;min-width:0;padding:32px 30px;border:1px solid var(--cl-line);border-radius:12px;background:#fff}
.cloud-renewal .cl-plan-featured{border-color:#9fc9b0}
.cloud-renewal .cl-plan-badge{position:absolute;top:15px;right:15px;padding:5px 9px;border-radius:12px;background:var(--cl-soft);color:var(--cl-green-dark);font-size:9px;font-weight:700}
.cloud-renewal .cl-plan-label{margin-bottom:5px;color:var(--cl-green);font-size:9px;font-weight:800;letter-spacing:.13em}
.cloud-renewal .cl-plan h3{font-size:22px;line-height:1.5}
.cloud-renewal .cl-plan-spec{margin-top:4px;color:var(--cl-muted);font-size:12px}
.cloud-renewal .cl-amount{display:flex;align-items:baseline;gap:7px;margin-top:20px}
.cloud-renewal .cl-amount strong{color:var(--cl-green-dark);font-size:44px;line-height:1;font-weight:800;letter-spacing:-.04em}
.cloud-renewal .cl-amount span{color:#526158;font-size:13px;font-weight:700}
.cloud-renewal .cl-tax{margin-top:5px;color:#87938c;font-size:10px}
.cloud-renewal .cl-plan ul{margin:24px 0 0;padding:20px 0 0;border-top:1px solid var(--cl-line);list-style:none}
.cloud-renewal .cl-plan li{position:relative;margin:0 0 8px;padding-left:18px;color:var(--cl-muted);font-size:12px;line-height:1.7}
.cloud-renewal .cl-plan li:last-child{margin-bottom:0}
.cloud-renewal .cl-plan li::before{content:"";position:absolute;left:3px;top:7px;width:5px;height:9px;border-right:2px solid var(--cl-green);border-bottom:2px solid var(--cl-green);transform:rotate(45deg)}
.cloud-renewal .cl-cost-list{max-width:940px;margin:0 auto;overflow:hidden;border:1px solid var(--cl-line);border-radius:12px;background:#fff}
.cloud-renewal .cl-cost-row{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:21px 25px;border-bottom:1px solid var(--cl-line)}
.cloud-renewal .cl-cost-row:last-child{border-bottom:0}
.cloud-renewal .cl-cost-row>div{min-width:0}
.cloud-renewal .cl-cost-row strong{display:block;color:var(--cl-text);font-size:14px}
.cloud-renewal .cl-cost-row p{margin-top:3px;color:var(--cl-muted);font-size:11px;line-height:1.6}
.cloud-renewal .cl-cost-row>span{flex:0 0 auto;color:var(--cl-green-dark);font-size:18px;font-weight:800;white-space:nowrap}
.cloud-renewal .cl-cost-row small{color:#87938c;font-size:9px;font-weight:500}
.cloud-renewal .cl-price-notes{max-width:940px;margin:18px auto 0}
.cloud-renewal .cl-price-notes p{margin-bottom:5px;color:#7b8981;font-size:11px;line-height:1.7}

/* START */
.cloud-renewal .cl-start{background:#fff}
.cloud-renewal .cl-start-inner{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:70px;align-items:start;max-width:1000px}
.cloud-renewal .cl-start-inner>div:first-child>p:not(.cl-kicker){margin-top:15px;color:#526158}
.cloud-renewal .cl-start-steps{display:grid;gap:10px}
.cloud-renewal .cl-start-steps>div{display:grid;grid-template-columns:36px minmax(0,1fr);grid-template-areas:"no title" "no text";gap:2px 14px;padding:18px 19px;border:1px solid var(--cl-line);border-radius:9px;background:var(--cl-pale)}
.cloud-renewal .cl-start-steps span{grid-area:no;display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:var(--cl-green);color:#fff;font-size:9px;font-weight:800}
.cloud-renewal .cl-start-steps strong{grid-area:title;color:var(--cl-text);font-size:14px}
.cloud-renewal .cl-start-steps p{grid-area:text;color:var(--cl-muted);font-size:12px;line-height:1.7}

/* CONTACT */
.cloud-renewal .cl-contact{background:var(--cl-soft)}
.cloud-renewal .cl-contact-inner{display:flex;align-items:center;justify-content:space-between;gap:50px;max-width:1000px}
.cloud-renewal .cl-contact-inner>div{min-width:0}
.cloud-renewal .cl-contact h2{margin-bottom:14px}
.cloud-renewal .cl-contact p:not(.cl-kicker){max-width:680px;color:#526158}
.cloud-renewal .cl-contact-btn{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;min-height:54px;padding:0 24px;border-radius:8px;background:var(--cl-green-dark);color:#fff;font-size:13px;font-weight:700;text-decoration:none}

/* WP auto formatting safety */
.cloud-renewal .cl-container>br,
.cloud-renewal .cl-hero-grid>br,
.cloud-renewal .cl-feature-grid>br,
.cloud-renewal .cl-price-grid>br,
.cloud-renewal .cl-change-row>br,
.cloud-renewal .cl-cost-list>br,
.cloud-renewal .cl-start-steps>br,
.cloud-renewal .cl-use-list>br{display:none!important}

@media screen and (max-width:1040px){
 .cloud-renewal .cl-hero-grid{grid-template-columns:1fr;gap:42px}
 .cloud-renewal .cl-hero-copy{text-align:center}
 .cloud-renewal .cl-hero .cl-eyebrow,.cloud-renewal .cl-hero h1{text-align:center}
 .cloud-renewal .cl-hero-text{margin-left:auto!important;margin-right:auto!important;text-align:center}
 .cloud-renewal .cl-hero-actions{justify-content:center}
 .cloud-renewal .cl-network-card{max-width:620px;margin:0 auto}
 .cloud-renewal .cl-use-grid,.cloud-renewal .cl-security-inner,.cloud-renewal .cl-start-inner{grid-template-columns:1fr;gap:35px}
 .cloud-renewal .cl-contact-inner{display:block}
 .cloud-renewal .cl-contact-btn{margin-top:24px}
}
@media screen and (max-width:760px){
 .cloud-renewal .cl-change-row{grid-template-columns:1fr;gap:10px}
 .cloud-renewal .cl-change-arrow{transform:rotate(90deg)}
 .cloud-renewal .cl-feature-grid,.cloud-renewal .cl-price-grid{grid-template-columns:1fr}
}
@media screen and (max-width:680px){
 .cloud-renewal .cl-container{width:calc(100% - 30px)}
 .cloud-renewal .cl-section{padding:68px 0}
 .cloud-renewal .cl-hero{padding:58px 0 64px}
 .cloud-renewal .cl-hero h1{font-size:40px}
 .cloud-renewal .cl-hero-lead{font-size:20px!important}
 .cloud-renewal .cl-hero-text{font-size:14px!important}
 .cloud-renewal .cl-network-card{padding:22px 16px}
 .cloud-renewal .cl-endpoints{grid-template-columns:1fr}
 .cloud-renewal .cl-intro h2,.cloud-renewal .cl-section-head h2,.cloud-renewal .cl-use h2,.cloud-renewal .cl-security h2,.cloud-renewal .cl-start h2,.cloud-renewal .cl-contact h2{font-size:27px;line-height:1.45}
 .cloud-renewal .cl-feature-card{padding:24px 20px}
 .cloud-renewal .cl-feature-no{font-size:42px}
 .cloud-renewal .cl-plan{padding:27px 21px}
 .cloud-renewal .cl-amount strong{font-size:38px}
 .cloud-renewal .cl-cost-row{display:block;padding:19px}
 .cloud-renewal .cl-cost-row>span{display:block;margin-top:10px}
 .cloud-renewal .cl-contact-btn{width:100%}
}



/* =========================================================
   CLOUD INTEGRATION LINKS / CROSS PAGE
========================================================= */

/* TOP */
.home-renewal .tr-fit-link {
    display: inline-block !important;
    margin-top: 12px !important;
    color: #0b5635 !important;
    font-size: 12px !important;
    line-height: 1.6 !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}

/* SPEC */
.spec-renewal .sp-cloud-link {
    display: inline-block !important;
    margin-top: 15px !important;
    color: #0b5635 !important;
    font-size: 12px !important;
    line-height: 1.6 !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}
.spec-renewal .sp-cloud-note {
    margin-top: 12px !important;
    color: #66736c !important;
    font-size: 12px !important;
    line-height: 1.8 !important;
}
.spec-renewal .sp-cloud-link-main {
    margin-top: 16px !important;
}

/* PRICE CLOUD OPTION */
.price-renewal .pr-cloud-option {
    background: #eff8f3 !important;
}
.price-renewal .pr-card-note {
    margin-top: 9px !important;
    color: #7b8981 !important;
    font-size: 10px !important;
    line-height: 1.7 !important;
}
.price-renewal .pr-cloud-summary {
    display: grid !important;
    grid-template-columns: minmax(0,1.15fr) minmax(0,.85fr) !important;
    gap: 18px !important;
    max-width: 940px !important;
    margin: 0 auto !important;
}
.price-renewal .pr-cloud-main,
.price-renewal .pr-cloud-costs {
    min-width: 0 !important;
    border: 1px solid #cfe0d6 !important;
    border-radius: 12px !important;
    background: #fff !important;
}
.price-renewal .pr-cloud-main {
    padding: 30px 28px !important;
}
.price-renewal .pr-cloud-main > span {
    display: block !important;
    margin-bottom: 7px !important;
    color: #16824b !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    letter-spacing: .13em !important;
}
.price-renewal .pr-cloud-main h3 {
    margin: 0 0 10px !important;
    color: #0b5635 !important;
    font-size: 28px !important;
    line-height: 1.45 !important;
}
.price-renewal .pr-cloud-main p {
    color: #66736c !important;
    font-size: 13px !important;
    line-height: 1.85 !important;
}
.price-renewal .pr-cloud-main a {
    display: inline-block !important;
    margin-top: 17px !important;
    color: #0b5635 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}
.price-renewal .pr-cloud-costs {
    overflow: hidden !important;
}
.price-renewal .pr-cloud-costs > div {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 18px !important;
    padding: 20px 22px !important;
    border-bottom: 1px solid #dcebe2 !important;
}
.price-renewal .pr-cloud-costs > div:last-child {
    border-bottom: 0 !important;
}
.price-renewal .pr-cloud-costs strong {
    color: #26352e !important;
    font-size: 12px !important;
}
.price-renewal .pr-cloud-costs span {
    flex: 0 0 auto !important;
    color: #0b5635 !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
}

/* SUPPORT BACKUP */
.support-renewal .su-backup-grid {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 16px !important;
    max-width: 1000px !important;
    margin: 0 auto !important;
}
.support-renewal .su-backup-grid .su-data-card {
    min-width: 0 !important;
    height: 100% !important;
}
.support-renewal .su-data-card-cloud {
    border-color: #b9d8c5 !important;
    background: #eff8f3 !important;
}
.support-renewal .su-data-card a {
    display: inline-block !important;
    margin-top: 15px !important;
    color: #0b5635 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}
.support-renewal .su-backup-note {
    max-width: 1000px !important;
    margin: 16px auto 0 !important;
    color: #7b8981 !important;
    font-size: 11px !important;
    line-height: 1.7 !important;
}

/* FLOW */
.flow-renewal .fl-cloud-note {
    margin-top: 13px !important;
    padding: 12px 14px !important;
    border-radius: 7px !important;
    background: #eff8f3 !important;
    color: #0b5635 !important;
    font-size: 12px !important;
    line-height: 1.75 !important;
}

/* WP auto formatting */
.price-renewal .pr-cloud-summary > br,
.support-renewal .su-backup-grid > br {
    display: none !important;
}

@media screen and (max-width: 820px) {
    .price-renewal .pr-cloud-summary,
    .support-renewal .su-backup-grid {
        grid-template-columns: 1fr !important;
    }
}