        <style>
/* ===== SMARTUI 機能紹介 LP BASE ===== */
#fn-lp{font-family:'YuGothic','Yu Gothic',sans-serif;color:#1B1C1E;overflow-x:hidden}
#fn-lp *{box-sizing:border-box;margin:0;padding:0}
#fn-lp a{text-decoration:none;color:inherit}
#fn-lp sup{vertical-align:super;font-size:.6em;line-height:1;font-family:'Roboto','Arial',sans-serif;font-feature-settings:normal;letter-spacing:0}
.fn-inner{max-width:1280px;margin:0 auto!important;padding:0 100px!important}
/* ===== BUTTON ===== */
.fn-btn{display:inline-flex!important;align-items:center;justify-content:center;position:relative;isolation:isolate;overflow:hidden;border-radius:9999px;font-weight:700;color:#fff!important;text-decoration:none!important;cursor:pointer;white-space:nowrap;border-style:solid;flex-grow:0;flex-shrink:0;width:auto!important}
.fn-btn-blue::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(103deg,#0E87BB 0%,#65C9D4 100%);transition:opacity .35s}
.fn-btn-blue::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(107deg,#0C1D83 0%,#2678B2 60%,#2ECAA5 100%);opacity:0;transition:opacity .35s}
.fn-btn-blue:hover::after{opacity:1}
.fn-btn-blue{border-color:#65C9D4}
.fn-btn-green::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(167deg,#0CCAB7 0%,#3EBF98 105%);transition:opacity .35s}
.fn-btn-green::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(107deg,#0C1D83 0%,#2678B2 60%,#2ECAA5 100%);opacity:0;transition:opacity .35s}
.fn-btn-green:hover::after{opacity:1}
.fn-btn-green{border-color:#3BDEB0}
.fn-btn-navy::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(104.44deg,#0C1D83 0%,#2678B2 60%,#2ECAA5 100%);transition:opacity .35s}
.fn-btn-navy::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(104.44deg,#2ECAA5 0%,#2678B2 40%,#0C1D83 100%);opacity:0;transition:opacity .35s}
.fn-btn-navy:hover::after{opacity:1}
.fn-btn-navy{border-color:#0C1D83}
.fn-btn-sm{height:40px;min-width:151px;padding:0 20px!important;font-size:16px;line-height:1.5;letter-spacing:.8px;font-feature-settings:'palt' 1;border-width:.672px}
.fn-btn-lg{width:256px;min-width:224px;padding:20px 40px!important;font-size:18px;line-height:1;border-width:1px}
.fn-btn-hd{min-width:144px;padding:14px 32px!important;font-size:14px;line-height:1;border-width:0}
/* ===== FLOAT ===== */
#fn-float{position:fixed;right:24px;bottom:24px;z-index:999;transition:opacity .25s}
#fn-float.is-hidden{opacity:0;pointer-events:none}
.fn-float-btn{display:block!important;position:relative;width:148px;height:100px;border-radius:12px;background:linear-gradient(94.65deg,#0E87BB 0%,#65C9D4 100%);box-shadow:0 0 5px rgba(0,0,0,.05);overflow:visible;text-decoration:none}
.fn-float-btn::after{content:'';position:absolute;inset:0;border-radius:12px;background:linear-gradient(96.17deg,#0C1D83 0%,#2678B2 60%,#2ECAA5 100%);opacity:0;transition:opacity .3s;z-index:1}
.fn-float-btn:hover::after{opacity:1}
.fn-float-doc{position:absolute;left:13px;top:-21px;width:123px;height:91px;pointer-events:none;display:block!important;z-index:2}
.fn-float-doc-sp{display:none!important;pointer-events:none;z-index:2}
.fn-float-badge{position:absolute;left:22px;top:74px;width:28px;height:14px;display:block!important;z-index:2}
.fn-float-label{position:absolute;left:54px;top:71px;font-size:18px;font-weight:700;color:#fff;white-space:nowrap;line-height:1;z-index:2}
/* ===== STICKY HEADER ===== */
#fn-sticky{position:fixed;top:0;left:0;right:0;z-index:1001;height:80px;background:#fff;border-top:3px solid #0068B7;opacity:0;pointer-events:none;transition:opacity .25s}
#fn-sticky.is-visible{opacity:1;pointer-events:auto}
.fn-sticky-inner{max-width:1280px;height:100%;margin:0 auto!important;display:flex;align-items:center;justify-content:space-between;padding:0 40px!important}
.fn-sticky-logo{display:block;flex-shrink:0}
.fn-sticky-nav{display:flex;align-items:center;gap:36px}
.fn-sticky-nav-item{font-size:16px;font-weight:500;color:#1B1C1E!important;white-space:nowrap;text-decoration:none!important;display:flex;align-items:center;gap:4px;padding-bottom:3px;box-shadow:0 3px 0 transparent;transition:box-shadow .15s,color .15s}
.fn-sticky-nav-item:hover,.fn-sticky-nav-item.is-active{box-shadow:0 3px 0 #0074D3;color:#0074D3!important}
.fn-sticky-fn-wrap{position:relative;display:flex;align-items:center}
.fn-sticky-fn-sub{position:absolute;top:calc(100% + 16px);left:0;background:#fff;border-radius:12px;padding-top:8px!important;padding-right:24px!important;padding-bottom:24px!important;padding-left:24px!important;display:flex;flex-direction:column;align-items:flex-start;gap:8px!important;white-space:nowrap;z-index:10;opacity:0;pointer-events:none;transition:opacity .2s}
.fn-sticky-fn-sub::before{content:'';position:absolute;top:-16px;left:0;right:0;height:16px}
.fn-sticky-fn-wrap:hover .fn-sticky-fn-sub,.fn-sticky-fn-wrap:focus-within .fn-sticky-fn-sub{opacity:1;pointer-events:auto}
.fn-sticky-fn-wrap:hover .fn-sticky-nav-item,.fn-sticky-fn-wrap:focus-within .fn-sticky-nav-item{box-shadow:0 3px 0 #0074D3;color:#0074D3!important}
.fn-sticky-fn-wrap:hover .fn-sticky-nav-item path,.fn-sticky-fn-wrap:focus-within .fn-sticky-nav-item path{stroke:#0074D3}
.fn-sticky-fn-sub-item{font-size:16px;font-weight:500;color:#1B1C1E!important;text-decoration:none!important;line-height:1.8;display:flex;align-items:center;justify-content:center;width:100%;padding-top:0!important;padding-bottom:3px!important;box-shadow:0 3px 0 transparent;transition:box-shadow .15s,color .15s}
.fn-sticky-fn-sub-item:hover{box-shadow:0 3px 0 #0074D3;color:#0074D3!important}
/* === Hamburger / Drawer === */
.fn-hbg{display:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:40px;height:40px;cursor:pointer;background:none;border:none;padding:0!important;flex-shrink:0}
.fn-hbg span{display:block;width:22px;height:2px;background:#1B1C1E;border-radius:2px;transition:transform .3s,opacity .3s}
.fn-hbg.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.fn-hbg.is-open span:nth-child(2){opacity:0}
.fn-hbg.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.fn-drawer{position:fixed;top:80px;left:0;right:0;bottom:0;background:#fff;z-index:1000;opacity:0;pointer-events:none;transition:opacity .3s;display:none;overflow-y:auto}
.fn-drawer.is-open{opacity:1;pointer-events:auto}
.fn-drawer-panel{min-height:100%;display:flex;flex-direction:column}
.fn-drawer-nav{display:flex;flex-direction:column;align-items:flex-start;gap:28px!important;padding-top:40px!important;padding-left:60px!important;padding-right:20px!important;flex:1}
.fn-drawer-item{font-size:20px;font-weight:700;color:#1B1C1E!important;text-decoration:none!important;letter-spacing:1px;font-feature-settings:'palt' 1;line-height:1.5;display:block}
.fn-drawer-fn-wrap{display:flex;flex-direction:column;gap:16px!important}
.fn-drawer-fn-trigger{display:flex;align-items:center;gap:4px;background:none;border:none;cursor:pointer;padding:0!important;font-size:20px;font-weight:700;color:#1B1C1E!important;letter-spacing:1px;font-feature-settings:'palt' 1;line-height:1.5;font-family:inherit;align-self:flex-start}
.fn-drawer-fn-trigger.is-open{border-bottom:3px solid #0074D3;padding-bottom:4px!important}
.fn-drawer-nav .fn-btn{min-width:144px;padding:14px 32px!important;font-size:16px;line-height:1;border-width:0}
.fn-drawer-arr{display:block;flex-shrink:0;transition:transform .2s}
.fn-drawer-fn-trigger.is-open .fn-drawer-arr{transform:rotate(180deg)}
.fn-drawer-fn-sub{display:none;flex-direction:column;gap:16px!important}
.fn-drawer-fn-sub.is-open{display:flex}
.fn-drawer-sub-item{font-size:16px;font-weight:500;color:#1B1C1E!important;text-decoration:none!important;line-height:1.8}
.fn-drawer-footer{height:59px;border-top:3px solid #0068B7;border-bottom:3px solid #0068B7;display:flex;align-items:center;padding-left:20px!important;font-size:8.5px;color:#1B1C1E;flex-shrink:0}
/* ===== FV ===== */
#fn-fv{position:relative;height:186px;overflow:hidden}
.fn-fv-bg{position:absolute;inset:0;background:url(/products/bizfront/sui/features/img/fn-fv-bg.jpg) center/cover no-repeat}
.fn-fv-canvas{position:relative;max-width:1280px;height:186px;margin:0 auto!important;padding:0 100px!important}
.fn-fv-h1{position:absolute;left:100px;top:62px;font-size:36px;font-weight:700;color:#fff;line-height:1.5;letter-spacing:1.8px;font-feature-settings:'palt' 1;font-style:normal}
/* ===== SV ===== */
#fn-sv{background:#fff;padding:60px 0 72px}
.fn-sv-layout{display:flex!important;align-items:flex-start;gap:32px}
.fn-sv-text{flex:1;max-width:699px}
.fn-sv-h2{font-size:36px;font-weight:700;color:#0C1266;line-height:1.5;letter-spacing:1.8px;font-feature-settings:'palt' 1;margin-bottom:16px!important}
.fn-sp-br{display:none}
.fn-sv-body{font-size:16px;font-weight:500;color:#1B1C1E;line-height:1.8}
.fn-sv-link{color:#0099C0!important;text-decoration:underline!important;display:inline!important}
.fn-sv-link:hover{text-decoration:none!important}
.fn-sv-illust{width:346px;flex-shrink:0}
.fn-sv-illust img{display:block!important;width:100%;height:auto}
/* ===== FEATURE SECTION ===== */
#fn-features{background:#F5FAFF;padding:100px 0}
/* ===== NAVI BOX ===== */
.fn-navi-box{background:#fff;border-radius:24px;padding:48px 94px 64px!important;max-width:960px;margin:0 auto 100px!important;display:flex;flex-direction:column;align-items:center;gap:48px}
.fn-navi-group{width:100%}
.fn-navi-group-label{font-size:18px;font-weight:700;color:#0C1266;letter-spacing:.9px;font-feature-settings:'palt' 1;line-height:1.5;text-align:center;margin-bottom:16px!important}
.fn-navi-tags{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.fn-navi-group:first-child .fn-navi-tags{flex-wrap:nowrap}
.fn-navi-tag{display:inline-flex!important;align-items:center;gap:6px;background:#D1E8FF;border-radius:9999px;padding:6px 16px 6px 6px!important;text-decoration:none!important;color:#0C1266!important;font-size:16px;font-weight:700;letter-spacing:.8px;font-feature-settings:'palt' 1;line-height:1.5;white-space:nowrap;transition:background .2s}
.fn-navi-tag:hover{background:#B3D8FF}
.fn-navi-tag-icon{width:32px;height:32px;background:#fff;border-radius:9999px;display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}
.fn-navi-tag-icon img{display:block!important;width:25.6px;height:25.6px;object-fit:contain}
/* ===== FEATURE GROUP ===== */
.fn-group{margin-bottom:80px!important}
.fn-group:last-child{margin-bottom:0!important}
.fn-features-inner .fn-group{max-width:960px!important;margin-left:auto!important;margin-right:auto!important}
.fn-group-h2{font-size:28px;font-weight:700;color:#0C1266;text-align:center;letter-spacing:1.4px;font-feature-settings:'palt' 1;line-height:1.5;margin-bottom:80px!important}
/* ===== FEATURE ITEM ===== */
.fn-feature{display:flex!important;gap:48px;align-items:flex-start}
.fn-feature+.fn-feature{margin-top:80px!important}
.fn-feature-text{flex:1;min-width:0}
.fn-feature-media{flex-shrink:0}
.fn-feature-icon{display:block!important;width:70px;height:70px;flex-shrink:0;object-fit:contain;mix-blend-mode:multiply}
.fn-feature-head{display:flex!important;align-items:center;gap:20px;margin-bottom:20px!important}
.fn-feature-titles{flex:1}
.fn-feature-sub{font-size:28px;font-weight:700;color:#0C1266;letter-spacing:1.4px;font-feature-settings:'palt' 1;line-height:1.5}
.fn-feature-h{font-size:28px;font-weight:700;color:#0C1266;letter-spacing:1.4px;font-feature-settings:'palt' 1;line-height:1.5}
.fn-feature-body{font-size:16px;font-weight:500;color:#1B1C1E;line-height:1.8;text-align:justify}
.fn-feature-cap{font-size:12px;font-weight:500;color:#5F6269;line-height:1.5;margin-top:8px!important}
.fn-feature-img{display:block!important;width:440px;height:auto}
.fn-feature-img>img{display:block;width:100%;height:auto;border-radius:8px}
.fn-feature-img img,.fn-feature-img video{display:block!important;width:100%;height:auto}
/* Layout: stacked (text top, images below) */
.fn-feature-stacked{display:block!important}
.fn-feature-stacked .fn-feature-top{display:flex!important;align-items:center;gap:20px;margin-bottom:20px!important}
.fn-feature-stacked .fn-feature-top-text{flex:1}
.fn-feature-stacked .fn-feature-h{margin-bottom:0!important}
.fn-feature-stacked .fn-feature-body{max-width:960px}
.fn-feature-stacked .fn-feature-imgs{display:flex!important;gap:40px;margin-top:24px!important}
.fn-feature-stacked .fn-feature-img-item{flex:1}
.fn-feature-stacked .fn-feature-img-item img,.fn-feature-stacked .fn-feature-img-item video{display:block!important;width:100%;height:auto}
.fn-feature-stacked .fn-feature-img-item img{border-radius:8px}
.fn-vid-wrap{position:relative;line-height:0}
.fn-feature-stacked .fn-vid-wrap{overflow:hidden}
.fn-vid-wrap video{display:block!important;width:100%;height:auto;aspect-ratio:442/282}
.fn-vid-poster{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;pointer-events:none;display:block}
.fn-play-btn{position:absolute!important;top:50%;left:50%;transform:translate(-50%,-50%);width:50px;height:50px;border:none;background:none;cursor:pointer;padding:0;display:block!important;z-index:2}
.fn-play-btn[hidden]{display:none!important}
.fn-play-btn svg{display:block;pointer-events:none}
.fn-play-btn .fn-play-bg{transition:fill-opacity .2s}
.fn-play-btn:hover .fn-play-bg{fill-opacity:0.5}
/* Layout: single wide screenshot */
.fn-feature-single{display:block!important}
.fn-feature-single .fn-feature-top{display:flex!important;align-items:center;gap:20px;margin-bottom:20px!important}
.fn-feature-single .fn-feature-top-text{flex:1;display:flex;align-items:center;gap:16px}
.fn-feature-single .fn-feature-h{margin-bottom:0!important}
.fn-feature-single .fn-feature-body{}
.fn-feature-single .fn-feature-img-wide{margin-top:40px!important}
.fn-feature-single .fn-feature-img-wide img{display:block!important;width:100%;height:auto;border-radius:8px}
.fn-feature-note{font-size:16px;font-weight:500;color:#5F6269;line-height:1.8;text-align:right;margin-top:8px!important}
.fn-feature-single .fn-feature-note{margin-top:0!important;flex-shrink:0;white-space:nowrap}
/* ===== POINT SECTION ===== */
#fn-point{background:#fff;padding:100px 0}
.fn-point-layout{display:flex!important;align-items:flex-start;gap:100px}
.fn-point-text{flex:0 0 480px}
.fn-point-h2{font-size:28px;font-weight:700;color:#0C1D83;letter-spacing:1.4px;font-feature-settings:'palt' 1;line-height:1.5;margin-bottom:20px!important}
.fn-point-body{font-size:16px;font-weight:500;color:#1B1C1E;line-height:1.8;text-align:justify;margin-bottom:40px!important}
.fn-point-steps{display:flex;flex-direction:column;gap:12px}
.fn-point-step{display:flex;align-items:center;gap:8px;background:#F5FAFF;border-radius:8px;padding:9px 16px!important}
.fn-point-num{font-size:20px;font-weight:700;line-height:1.3;flex-shrink:0;width:27px;background:linear-gradient(140deg,#1B2E9F 0.69%,#225FE4 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-family:'Roboto',sans-serif}
.fn-point-step-text{font-size:16px;font-weight:700;color:#1B1C1E;letter-spacing:.8px;font-feature-settings:'palt' 1;line-height:1.5;white-space:nowrap}
.fn-point-visual{flex:0 0 440px}
.fn-point-visual img{display:block!important;width:100%;height:auto}
/* ===== ENVIRONMENT ===== */
#fn-env{background:#F7F8FA;padding:100px 0}
.fn-env-h2{font-size:28px;font-weight:700;color:#0C1266;letter-spacing:1.4px;font-feature-settings:'palt' 1;line-height:1.5;text-align:center;margin-bottom:28px!important}
.fn-env-rows{display:flex;flex-direction:column;gap:20px;max-width:725px;margin:0 auto!important}
.fn-env-row{display:flex;align-items:baseline;gap:20px}
.fn-env-label{font-size:16px;font-weight:700;color:#0099C0;letter-spacing:.8px;font-feature-settings:'palt' 1;line-height:1.5;white-space:nowrap;flex-shrink:0}
.fn-env-value{font-size:16px;font-weight:500;color:#1B1C1E;line-height:1.8}
.fn-env-note{font-size:14px;font-weight:500;color:#5F6269;line-height:1.8;max-width:725px;margin:0 auto!important;margin-top:4px!important}
/* ===== CTA BANNERS ===== */
#fn-cta{background:#fff}
.fn-cta-wrap{display:flex!important}
.fn-cta-item{flex:1;overflow:hidden;position:relative;height:208px;text-decoration:none!important;display:block!important}
.fn-cta-dl{background:radial-gradient(ellipse 77% 130% at 43% 80%,rgba(12,29,131,1) 0%,rgba(12,29,131,0) 57%),radial-gradient(400px circle at -79px 56px,#2EE1B6 0%,#17ABC5 31%,#0C8FCC 46%,#0074D3 62%,#0649AB 81%,#093397 90%,#0C1D83 100%)}
.fn-cta-ct{background:radial-gradient(130% 254% at 118% -43%,rgba(0,116,211,1) 8%,rgba(12,143,204,.75) 26%,rgba(23,171,197,.5) 43%,rgba(46,225,182,0) 78%),radial-gradient(140% 366% at 67% 50%,#2EE1B6 0%,#17ABC5 50%,#0C8FCC 75%,#0074D3 100%)}
.fn-cta-item::after{content:'';position:absolute;inset:0;z-index:1;opacity:0;transition:opacity .25s;pointer-events:none}
.fn-cta-dl::after{background:#0074D3}
.fn-cta-ct::after{background:#2EE1B6}
.fn-cta-item:hover::after{opacity:1}
.fn-cta-icon{position:absolute;pointer-events:none;mix-blend-mode:plus-lighter;width:240px;height:240px;opacity:.08;z-index:2}
.fn-cta-dl .fn-cta-icon{left:344px;top:24px}
.fn-cta-ct .fn-cta-icon{left:352px;top:20px;opacity:.05}
.fn-cta-en{position:absolute;font-family:'Roboto',sans-serif;font-size:16px;font-weight:700;line-height:1.6;margin:0!important;z-index:2}
.fn-cta-dl .fn-cta-en{color:#D1E8FF;left:80px;top:104px}
.fn-cta-ct .fn-cta-en{color:#CFF5E8;left:77px;top:110px}
.fn-cta-ja{position:absolute;font-size:30px;font-weight:700;color:#fff;line-height:1.5;letter-spacing:1.5px;font-feature-settings:'palt' 1;display:flex;align-items:center;white-space:nowrap;margin:0!important;z-index:2}
.fn-cta-dl .fn-cta-ja{left:78px;top:130px}
.fn-cta-ct .fn-cta-ja{left:75px;top:136px}
.fn-cta-sub{font-size:24px;letter-spacing:1.2px}
.fn-cta-arr{display:inline-flex;align-items:center;flex-shrink:0;width:16px;height:16px;margin-left:8px!important}
/* ===== PC FOOTER ===== */
#fn-pc-foot{background:#fff;min-height:240px;position:relative;overflow:hidden}
.fn-pc-foot-inner{max-width:1280px;margin:0 auto!important;position:relative;height:240px}
.fn-pc-foot-top{position:absolute;right:56px;top:50px;width:60px;height:60px;border-radius:50%;background:#D1E8FF;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center}
.fn-pc-foot-notes{position:absolute;left:56px;top:125px}
.fn-pc-foot-note{font-size:14px;font-weight:500;color:#5F6269;line-height:1.8;margin:0}
.fn-pc-foot-privacy{position:absolute;right:56px;top:175px;font-size:14px;font-weight:500;color:#5F6269;line-height:1.8;text-decoration:none;border-bottom:1px solid #5F6269;transition:border-color .2s}
.fn-pc-foot-privacy:hover{border-bottom-color:transparent}
.fn-pc-foot-copy{position:absolute;right:56px;bottom:30px;font-size:14px;font-weight:500;color:#5F6269;line-height:1.8;margin:0}
/* ===== SP ACCORDION ===== */
#fn-acc{display:none}
/* ===== ACCORDION BASE (tablet + SP) ===== */
.fn-acc-groups{display:flex;flex-direction:column;gap:64px}
.fn-acc-group-h{font-size:24px;font-weight:700;color:#0C1266;text-align:center;letter-spacing:1.2px;font-feature-settings:'palt' 1;line-height:1.5;margin-bottom:40px!important}
.fn-acc-cards{display:flex;flex-direction:column;gap:20px}
.fn-acc-card{background:#fff;border-radius:16px;overflow:hidden}
.fn-acc-title{display:flex;align-items:center;gap:16px;padding:20px!important;cursor:pointer;user-select:none}
.fn-acc-title-left{display:flex;flex:1 0 0;align-items:center;gap:10px;min-width:0}
.fn-acc-icon{width:70px;height:70px;flex-shrink:0;display:block!important;object-fit:contain;mix-blend-mode:multiply}
.fn-acc-text{flex:1 0 0;font-size:24px;font-weight:700;color:#0C1266;letter-spacing:1.2px;font-feature-settings:'palt' 1;line-height:1.5;min-width:0}
.fn-acc-toggle{width:16px;height:16px;flex-shrink:0;position:relative}
.fn-acc-toggle::before,.fn-acc-toggle::after{content:'';position:absolute;background:#0C1D83;border-radius:1px;transition:transform .25s,opacity .25s}
.fn-acc-toggle::before{top:50%;left:1px;right:1px;height:1.5px;transform:translateY(-50%)}
.fn-acc-toggle::after{left:50%;top:1px;bottom:1px;width:1.5px;transform:translateX(-50%)}
.fn-acc-card.is-open .fn-acc-toggle::after{transform:translateX(-50%) rotate(90deg);opacity:0}
.fn-acc-body{display:none;padding:0 20px 20px!important}
.fn-acc-card.is-open .fn-acc-body{display:block}
.fn-acc-body-imgs{display:flex;flex-direction:column;gap:16px;margin-bottom:12px!important}
.fn-acc-body-img{display:block!important;width:100%;height:auto;border-radius:8px}
.fn-acc-body .fn-vid-wrap{overflow:hidden}
.fn-acc-body-text{font-size:16px;font-weight:500;color:#1B1C1E;line-height:1.8;text-align:justify}
.fn-acc-body-cap{font-size:12px;font-weight:500;color:#5F6269;line-height:1.5;margin-top:8px!important}
.fn-acc-body-note{font-size:16px;font-weight:500;color:#5F6269;line-height:1.8;text-align:right;margin-top:8px!important}
.fn-acc-title-note{font-size:16px;font-weight:500;color:#5F6269;line-height:1.5;white-space:nowrap;flex-shrink:0}
.fn-acc-title-left:has(.fn-acc-title-note) .fn-acc-text{flex:0 0 auto}
/* ===== SP FOOTER ===== */
#fn-foot{display:none}
/* ===== SP RESPONSIVE ===== */
@media(min-width:768px) and (max-width:1100px){
  /* Inner */
  .fn-inner{padding:0 40px!important}
  /* Sticky */
  .fn-sticky-inner{padding:0 24px!important}
  .fn-sticky-nav{display:none}
  .fn-hbg{display:flex}
  .fn-drawer{display:block}
  /* Navi */
  .fn-navi-box{padding:40px 48px 48px!important;margin-bottom:80px!important}
  .fn-navi-group:first-child .fn-navi-tags{flex-wrap:wrap}
  /* Features */
  .fn-feature{flex-direction:column;gap:32px}
  .fn-feature+.fn-feature{margin-top:60px!important}
  .fn-feature-media{width:100%!important}
  .fn-feature-img{width:100%!important}
  .fn-feature-stacked .fn-feature-imgs{gap:24px}
  /* Point */
  .fn-point-layout{gap:48px}
  .fn-point-text{flex:1 1 auto}
  .fn-point-visual{flex:0 0 320px}
  .fn-point-visual img{width:100%}
  /* Environment */
  .fn-env-row{flex-wrap:wrap}
  .fn-env-label{width:100%}
  /* Accordion (tablet: replace features) */
  #fn-features{display:none!important}
  #fn-acc{display:block;background:#F5FAFF;padding:60px 40px}
  .fn-acc-body{padding:0 40px 40px!important}
}
@media(min-width:768px) and (max-width:960px){
  /* Footer: prevent notes/privacy overlap at narrow PC widths */
  /* Stage 1: privacy moves below notes; Stage 2: notes width adapts to viewport */
  .fn-pc-foot-inner{height:auto;padding:125px 56px 40px!important;box-sizing:border-box}
  .fn-pc-foot-notes{position:static;max-width:calc(100% - 60px)}
  .fn-pc-foot-privacy{position:static;display:inline-block;margin-top:12px!important}
}
@media(max-width:767px){
  /* Global */
  .fn-inner{padding:0!important}
  /* Float */
  #fn-float{right:0;bottom:24px}
  .fn-float-btn{width:80px;height:78px;border-radius:12px 0 0 12px}
  .fn-float-btn::after{border-radius:12px 0 0 12px}
  .fn-float-doc{display:none!important}
  .fn-float-doc-sp{display:block!important;position:absolute;left:8px;top:-21px;width:72px;height:auto}
  .fn-float-badge{left:25px;top:39px}
  .fn-float-label{left:13px;top:56px;font-size:14px;font-weight:500}
  /* Sticky */
  #fn-sticky{height:60px}
  .fn-drawer{display:block;top:60px}
  .fn-sticky-inner{padding:0 16px!important;height:60px}
  .fn-sticky-logo{width:140px!important;height:auto!important}
  .fn-sticky-nav{display:none}
  .fn-hbg{display:flex}
  /* FV */
  #fn-fv{height:140px}
  .fn-fv-canvas{height:140px!important;padding:0 20px!important}
  .fn-fv-h1{left:20px;top:44px;font-size:26px;letter-spacing:1.3px}
  /* SV */
  #fn-sv{padding:48px 0}
  .fn-sv-layout{padding:0 20px!important;flex-direction:column;gap:32px}
  .fn-sv-h2{font-size:26px;letter-spacing:1.3px}
  .fn-sv-illust{width:100%;max-width:320px;align-self:center}
  /* Features */
  #fn-features{padding:60px 0}
  .fn-inner.fn-features-inner{padding:0 20px!important}
  .fn-navi-box{padding:32px 20px!important;margin-bottom:60px!important;border-radius:16px}
  .fn-navi-group-label{font-size:16px}
  .fn-navi-tags{gap:8px}
  .fn-navi-group:first-child .fn-navi-tags{flex-wrap:wrap}
  .fn-navi-tag{font-size:14px;padding:4px 12px 4px 4px!important}
  .fn-navi-tag-icon{width:28px;height:28px}
  .fn-navi-tag-icon img{width:22px;height:22px}
  .fn-group-h2{font-size:24px;letter-spacing:1.2px;margin-bottom:48px!important}
  .fn-feature{flex-direction:column;gap:24px}
  .fn-feature+.fn-feature{margin-top:60px!important}
  .fn-feature-icon{width:56px;height:56px}
  .fn-feature-sub,.fn-feature-h{font-size:24px;letter-spacing:1.2px}
  .fn-feature-media{width:100%!important}
  .fn-feature-img{width:100%!important}
  .fn-feature-stacked .fn-feature-imgs{flex-direction:column;gap:20px}
  /* Point */
  #fn-point{padding:60px 0}
  .fn-inner.fn-point-inner{padding:0 20px!important}
  .fn-point-layout{flex-direction:column;gap:32px}
  .fn-point-text{flex:none;width:100%}
  .fn-point-h2{font-size:24px;letter-spacing:1.2px}
  .fn-point-step-text{white-space:normal}
  /* Environment */
  #fn-env{padding:60px 0}
  .fn-inner.fn-env-inner{padding:0 20px!important}
  .fn-env-h2{font-size:24px;letter-spacing:1.2px}
  .fn-env-row{flex-wrap:wrap}
  .fn-env-label{width:100%}
  /* CTA */
  .fn-cta-wrap{flex-direction:column}
  .fn-cta-item{height:208px;flex:none;width:100%}
  .fn-cta-dl .fn-cta-icon{left:141px;top:24px}
  .fn-cta-ct .fn-cta-icon{left:149px;top:20px}
  .fn-cta-dl .fn-cta-en{left:22px}
  .fn-cta-ct .fn-cta-en{left:20px}
  .fn-cta-dl .fn-cta-ja{left:20px}
  .fn-cta-ct .fn-cta-ja{left:18px}
  /* Features: hide on SP/tablet */
  #fn-features{display:none!important}
  /* FV: match Figma SP */
  #fn-fv{height:186px}
  .fn-fv-bg{background-image:url(/products/bizfront/sui/features/img/fn-fv-bg-sp.jpg)}
  .fn-fv-canvas{height:186px!important}
  .fn-fv-h1{top:68px;font-size:30px;letter-spacing:1.5px;left:50%;transform:translateX(-50%);white-space:nowrap}
  /* SV */
  .fn-sv-h2{font-size:30px;letter-spacing:1.5px}
  /* Accordion (SP: narrower padding override) */
  #fn-acc{display:block;background:#F5FAFF;padding:60px 20px}
  .fn-acc-body{padding:0 20px 20px!important}
  /* SP: 説明文→画像の順序 */
  .fn-acc-card.is-open .fn-acc-body{display:flex!important;flex-direction:column}
  .fn-acc-body>.fn-vid-wrap,.fn-acc-body>.fn-acc-body-imgs,.fn-acc-body>img.fn-acc-body-img{order:1}
  .fn-acc-body>.fn-acc-body-text{order:0}
  .fn-acc-body>.fn-acc-body-cap{order:2}
  /* SP: カード10 画像フル幅 */
  .fn-acc-body-wide{padding-left:0!important;padding-right:0!important}
  .fn-acc-body-wide .fn-acc-body-img{border-radius:0;width:100%}
  .fn-acc-body-img{border-radius:0!important}
  .fn-acc-body-img.fn-ui-img{border:1px solid #DCDFE5;border-radius:5px!important}
  .fn-acc-body>.fn-acc-body-text{margin-bottom:16px!important}
  .fn-acc-title-note{display:none}
  .fn-acc-title-left:has(.fn-acc-title-note) .fn-acc-text{flex:1 1 auto;min-width:0}
  /* PC Footer: hide on SP */
  #fn-pc-foot{display:none}
  /* SP Footer */
  #fn-foot{display:block;position:relative;background:#fff;min-height:231px}
  .fn-foot-top{position:absolute;right:20px;top:20px;width:60px;height:60px;border-radius:50%;background:#D1E8FF;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0!important}
  .fn-foot-notes{position:absolute;left:20px;top:98px;right:20px}
  .fn-foot-note{font-size:12px;font-weight:500;color:#5F6269;line-height:1.5;margin:0!important}
  .fn-foot-privacy{display:inline-block;font-size:12px;font-weight:500;color:#5F6269;line-height:1.5;text-decoration:none!important;border-bottom:1px solid #5F6269;margin-top:15px!important}
  .fn-sp-br{display:inline}
}
/* ===== IMAGE SWITCHER ===== */

.fn-img-sw-main{position:relative;width:100%;border-radius:8px;overflow:hidden;line-height:0}
.fn-img-sw-slide{display:block!important;width:100%;height:auto;position:absolute;top:0;left:0;opacity:0;transition:opacity .25s}
.fn-img-sw-slide:first-child{position:relative}
.fn-img-sw-slide.is-active{opacity:1}





/* === Focus === */
:focus:not(:focus-visible){outline:none}
.fn-sticky-nav-item:focus-visible,.fn-sticky-fn-sub-item:focus-visible,.fn-drawer-item:focus-visible,.fn-sv-link:focus-visible,.fn-foot-privacy:focus-visible,.fn-pc-foot-privacy:focus-visible{outline:2px solid #0074D3;outline-offset:2px;border-radius:2px}
.fn-btn:focus-visible,.fn-cta-item:focus-visible{outline:2px solid #0074D3;outline-offset:3px;border-radius:9999px}
.fn-float-btn:focus-visible{outline:2px solid #0074D3;outline-offset:4px;border-radius:12px}
.fn-hbg:focus-visible{outline:2px solid #0074D3;outline-offset:4px;border-radius:4px}
.fn-play-btn:focus-visible{outline:2px solid #0074D3;outline-offset:4px;border-radius:50%}
.fn-foot-top:focus-visible,.fn-pc-foot-top:focus-visible{outline:2px solid #0074D3;outline-offset:3px;border-radius:9999px}
/* === Safari: YuGothic font-weight 700→600 === */
@supports (hanging-punctuation: first) {
  .fn-acc-group-h,.fn-acc-text,.fn-btn,.fn-cta-ja,
  .fn-drawer-fn-trigger,.fn-drawer-item,
  .fn-env-h2,.fn-env-label,.fn-feature-h,.fn-feature-sub,
  .fn-float-label,.fn-fv-h1,.fn-group-h2,
  .fn-navi-group-label,.fn-navi-tag,
  .fn-point-h2,.fn-point-step-text,.fn-sv-h2{font-weight:600}
  .fn-sticky-nav-item,.fn-sticky-fn-sub-item,.fn-drawer-sub-item,
  .fn-sv-body,.fn-feature-body,.fn-feature-cap,.fn-feature-note,
  .fn-point-body,.fn-env-value,.fn-env-note,
  .fn-pc-foot-note,.fn-pc-foot-privacy,.fn-pc-foot-copy,
  .fn-acc-body-text,.fn-acc-body-cap,.fn-acc-body-note,.fn-acc-title-note{font-weight:400}
  @media(max-width:767px){
    .fn-float-label,.fn-foot-note,.fn-foot-privacy{font-weight:400}
  }
}
        </style>