/* User Insight 機能一覧 (fn-page) — CMS test page */

.fn-page{--fn-blue: #0e7cd5;--fn-purple: #6a4bd6;--fn-text: #16202b;--fn-muted: #5b6b7b;--fn-border: #e3e9ef;--fn-soft: #f4f8fc;--fn-hero: #f4f8fc;--fn-card-border: #e3e9ef;--fn-radius: 12px;--fn-accent: var(--fn-blue);--fn-content-width: 1120px;color:var(--fn-text);background:#fff}

.fn-page .container.container-detail{width:100%;max-width:var(--fn-content-width);margin-right:auto;margin-left:auto;padding-right:20px;padding-left:20px}

@media(min-width: 1160px){.fn-page .container.container-detail{padding-right:0;padding-left:0}}

.fn-page__hero{position:relative;overflow:hidden;padding:72px 0 40px;text-align:center;background:-webkit-gradient(linear, left top, left bottom, from(#f5fbff), to(#e9f4fd));background:-webkit-linear-gradient(top, #f5fbff 0%, #e9f4fd 100%);background:linear-gradient(180deg, #f5fbff 0%, #e9f4fd 100%)}

@media only screen and (max-width: 47.99875em ){.fn-page__hero{padding:48px 0 28px}}

.fn-page__hero-net{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;-webkit-mask-image:-webkit-radial-gradient(50% 45%, ellipse 90% 80%, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.45) 65%, rgba(0, 0, 0, 0.2) 100%);mask-image:radial-gradient(ellipse 90% 80% at 50% 45%, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.45) 65%, rgba(0, 0, 0, 0.2) 100%)}

@media only screen and (max-width: 47.99875em ){.fn-page__hero-net{opacity:.85;-webkit-mask-image:-webkit-radial-gradient(50% 40%, ellipse 120% 100%, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.35) 70%, rgba(0, 0, 0, 0.12) 100%);mask-image:radial-gradient(ellipse 120% 100% at 50% 40%, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.35) 70%, rgba(0, 0, 0, 0.12) 100%)}}

.fn-page__hero-inner{position:relative;z-index:1}

.fn-page__eyebrow{margin:0 0 10px;color:var(--fn-blue);font-size:13px;font-weight:700;letter-spacing:.14em}

.fn-page__title{margin:0 0 18px;color:var(--fn-text);font-size:42px;font-weight:700;line-height:1.25}

@media only screen and (max-width: 47.99875em ){.fn-page__title{font-size:30px}}

.fn-page__lead{margin:0 auto;max-width:720px;color:var(--fn-muted);font-size:16px;line-height:1.9}

@media only screen and (max-width: 47.99875em ){.fn-page__lead{font-size:14px;padding:0 8px}}

.fn-page__nav-wrap{position:-webkit-sticky;position:sticky;top:var(--header-height, 64px);z-index:20000;background:rgba(255,255,255,.96);border-bottom:1px solid transparent;-webkit-transition:border-color .2s ease,-webkit-box-shadow .2s ease;transition:border-color .2s ease,-webkit-box-shadow .2s ease;transition:box-shadow .2s ease,border-color .2s ease;transition:box-shadow .2s ease,border-color .2s ease,-webkit-box-shadow .2s ease}

.fn-page__nav-wrap.stuck{-webkit-box-shadow:0 6px 18px rgba(20,40,70,.08);box-shadow:0 6px 18px rgba(20,40,70,.08);border-bottom-color:var(--fn-border)}

.fn-page__nav{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;gap:12px;padding:14px 0}

@media only screen and (max-width: 47.99875em ){.fn-page__nav{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow-x:auto;gap:8px;padding:12px 0;-webkit-overflow-scrolling:touch}}

.fn-page__nav-link{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;min-height:40px;padding:8px 20px;border:1px solid var(--fn-border);border-radius:999px;background:#fff;color:var(--fn-text);font-size:14px;font-weight:700;line-height:1.2;text-decoration:none;white-space:nowrap;-webkit-transition:background .2s ease,color .2s ease,border-color .2s ease;transition:background .2s ease,color .2s ease,border-color .2s ease}

.fn-page__nav-link:hover,.fn-page__nav-link:focus{color:var(--fn-nav-accent, var(--fn-blue));border-color:var(--fn-nav-accent, #cfe0f0);text-decoration:none}

.fn-page__nav-link.-ai{--fn-nav-accent: var(--fn-purple)}

.fn-page__nav-link.-content,.fn-page__nav-link.-analysis,.fn-page__nav-link.-cs,.fn-page__nav-link.-others{--fn-nav-accent: var(--fn-blue)}

.fn-page__nav-link.is-active{color:var(--fn-nav-accent, var(--fn-blue));border-color:var(--fn-nav-accent, var(--fn-blue));background:#fff}

.fn-section{--fn-accent: var(--fn-blue);padding:64px 0;background:#fff}

@media only screen and (max-width: 47.99875em ){.fn-section{padding:48px 0}}

.fn-section.-ai{--fn-accent: var(--fn-purple)}

.fn-section.-content{--fn-accent: var(--fn-blue);background:var(--fn-soft)}

.fn-section.-analysis{--fn-accent: var(--fn-blue)}

.fn-section.-cs{--fn-accent: var(--fn-blue);background:var(--fn-soft)}

.fn-section.-others{--fn-accent: var(--fn-blue)}

.fn-section__head{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;gap:24px;margin-bottom:28px}

@media only screen and (max-width: 47.99875em ){.fn-section__head{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;gap:12px;margin-bottom:20px}}

.fn-section__head-main{display:-ms-grid;display:grid;-ms-grid-columns:50px 1fr;grid-template-columns:50px 1fr;gap:18px;-webkit-box-align:start;-ms-flex-align:start;align-items:start}

@media only screen and (max-width: 47.99875em ){.fn-section__head-main{-ms-grid-columns:44px 1fr;grid-template-columns:44px 1fr;gap:12px}}

.fn-section__icon{width:50px;height:50px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background:transparent;border:0;border-radius:0;-webkit-box-shadow:none;box-shadow:none;overflow:visible}

.fn-section__icon img{display:block;width:50px;height:50px}

@media only screen and (max-width: 47.99875em ){.fn-section__icon{width:44px;height:44px}.fn-section__icon img{width:44px;height:44px}}

.fn-section__eyebrow{margin:0 0 4px;color:var(--fn-accent);font-size:12px;font-weight:700;letter-spacing:.08em}

.fn-section__title{margin:0;color:var(--fn-text);font-size:28px;font-weight:700;line-height:1.35}

@media only screen and (max-width: 47.99875em ){.fn-section__title{font-size:22px}}

.fn-section__sub{margin:6px 0 0;color:var(--fn-accent);font-size:15px;font-weight:700;line-height:1.5}

@media only screen and (max-width: 47.99875em ){.fn-section__sub{font-size:13px}}

.fn-section__detail{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--fn-blue);font-size:14px;font-weight:700;text-decoration:none;white-space:nowrap;-ms-flex-negative:0;flex-shrink:0}

.fn-section__detail:hover,.fn-section__detail:focus{color:var(--fn-blue);text-decoration:underline}

.fn-cards{display:-ms-grid;display:grid;-ms-grid-columns:(minmax(0, 265px))[4];grid-template-columns:repeat(4, minmax(0, 265px));-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;gap:20px;margin-bottom:24px}

@media(max-width: 1199px){.fn-cards{-ms-grid-columns:(1fr)[4];grid-template-columns:repeat(4, 1fr);-webkit-box-pack:stretch;-ms-flex-pack:stretch;justify-content:stretch}}

@media(max-width: 991px){.fn-cards{-ms-grid-columns:(1fr)[2];grid-template-columns:repeat(2, 1fr)}}

@media only screen and (max-width: 47.99875em ){.fn-cards{-ms-grid-columns:(1fr)[2];grid-template-columns:repeat(2, 1fr);gap:12px}}

.fn-card{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:100%;height:100%;background:#fff;border:1px solid var(--fn-card-border);border-radius:var(--fn-radius);-webkit-box-shadow:none;box-shadow:none;overflow:hidden;color:inherit;text-decoration:none;-webkit-transition:border-color .2s ease,-webkit-transform .2s ease,-webkit-box-shadow .2s ease;transition:border-color .2s ease,-webkit-transform .2s ease,-webkit-box-shadow .2s ease;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease,-webkit-transform .2s ease,-webkit-box-shadow .2s ease}

.fn-card:hover,.fn-card:focus{color:inherit;text-decoration:none;-webkit-transform:translateY(-2px);-ms-transform:translateY(-2px);transform:translateY(-2px);border-color:var(--fn-accent);-webkit-box-shadow:0 8px 20px rgba(22,32,43,.08);box-shadow:0 8px 20px rgba(22,32,43,.08)}

.fn-card__media{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;height:auto;padding:16px 16px 0;background:#fff;overflow:hidden;-webkit-box-sizing:border-box;box-sizing:border-box}

.fn-card__media img{display:block;width:100%;height:auto;aspect-ratio:16/10;-o-object-fit:cover;object-fit:cover;border-radius:8px}

@media only screen and (max-width: 47.99875em ){.fn-card__media{padding:10px 10px 0}.fn-card__media img{border-radius:6px}}

.fn-card__body{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:6px;padding:14px 16px 16px;-webkit-box-flex:1;-ms-flex:1;flex:1;min-height:0}

@media only screen and (max-width: 47.99875em ){.fn-card__body{gap:4px;padding:10px 10px 12px}}

.fn-card__title{margin:0;color:var(--fn-text);font-size:16px;font-weight:700;line-height:1.4}

@media only screen and (max-width: 47.99875em ){.fn-card__title{font-size:14px}}

.fn-card__desc{margin:0;color:var(--fn-muted);font-size:13px;line-height:1.7}

@media only screen and (max-width: 47.99875em ){.fn-card__desc{font-size:12px;line-height:1.5}}

.fn-sub{background:#f4f8fc;border:1px solid #e3e9ef;border-radius:14px;padding:16px 24px 20px;-webkit-box-sizing:border-box;box-sizing:border-box}

.fn-section.-content .fn-sub{background:#fff}

@media only screen and (max-width: 47.99875em ){.fn-sub{padding:14px 16px 16px}}

.fn-sub__title{margin:0 0 16px;padding:0 0 12px;border-bottom:1px solid #e3e9ef;color:#5b6b7b;font-size:13px;font-weight:700;line-height:1.4}

.fn-sub__grid{display:-ms-grid;display:grid;-ms-grid-columns:(1fr)[4];grid-template-columns:repeat(4, 1fr);gap:12px 24px}

.fn-sub__grid.-cols-5{-ms-grid-columns:(1fr)[5];grid-template-columns:repeat(5, 1fr)}

@media(max-width: 1199px){.fn-sub__grid.-cols-5{-ms-grid-columns:(1fr)[3];grid-template-columns:repeat(3, 1fr)}}

@media(max-width: 991px){.fn-sub__grid{-ms-grid-columns:(1fr)[2];grid-template-columns:repeat(2, 1fr)}}

@media only screen and (max-width: 47.99875em ){.fn-sub__grid{-ms-grid-columns:1fr;grid-template-columns:1fr;gap:14px}}

.fn-sub__item{position:relative;padding-left:12px}

.fn-sub__item::before{content:"";position:absolute;top:2px;left:0;width:4px;height:16px;border-radius:2px;background:var(--fn-accent)}

.fn-sub__item-title{margin:0 0 4px;color:var(--fn-text);font-size:14px;font-weight:700;line-height:1.4}

.fn-sub__item-desc{margin:0;color:#5b6b7b;font-size:12px;line-height:1.6}

.fn-others-grid{display:-ms-grid;display:grid;-ms-grid-columns:(1fr)[2];grid-template-columns:repeat(2, 1fr);gap:20px}

@media only screen and (max-width: 47.99875em ){.fn-others-grid{-ms-grid-columns:1fr;grid-template-columns:1fr}}

.fn-others-card{background:#fff;border:1px solid var(--fn-card-border);border-radius:var(--fn-radius);-webkit-box-shadow:none;box-shadow:none;padding:8px 24px}

.fn-others-item{display:-ms-grid;display:grid;-ms-grid-columns:minmax(120px, 160px) 1fr;grid-template-columns:minmax(120px, 160px) 1fr;gap:12px;-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline;padding:14px 0;border-bottom:1px solid #eef4fa}

.fn-others-item:last-child{border-bottom:0}

@media only screen and (max-width: 47.99875em ){.fn-others-item{-ms-grid-columns:1fr;grid-template-columns:1fr;gap:4px;padding:12px 0}}

.fn-others-item__name{margin:0;color:var(--fn-text);font-size:14px;font-weight:700}

.fn-others-item__desc{margin:0;color:var(--fn-muted);font-size:13px;line-height:1.7}

.js-sticky-sentinel{height:1px;position:relative;bottom:var(--header-height)}
@media only screen and (max-width: 47.99875em){.fn-sub__grid.-cols-5{-ms-grid-columns:1fr;grid-template-columns:1fr;gap:14px}}
.fn-section{scroll-margin-top:140px}@media only screen and (max-width: 47.99875em){.fn-section{scroll-margin-top:128px}}
