.sian_tab {width:100%; display:flex; text-align:center;   height:55px;  }
.sian_tab li  {width:50%; display:inline-block; line-height:55px;  text-align:center;  font-size:1.3rem;   background-color:#f5f5f5; letter-spacing:-2px; transition: all 0.3s ease-out;}
.sian_tab li a {color:#333  ; width:100%; display:inline-block }
.sian_tab li.ov {background-color:#00a5b5}
.sian_tab li.ov a {color:#fff  }

 
        html { scroll-behavior: smooth; }

        body {
             
            background: #222;
            line-height: 1.65;
            word-break: keep-all;
            letter-spacing: -0.025em;
        }

        a { color: inherit; text-decoration: none; }
        ul, li { list-style: none; }
        .inner { width: min(1200px, calc(100% - 40px)); margin: 0 auto; color:#fff }

        .sub-visual {
            position: relative;
            overflow: hidden;
            height: 360px;
            
            background:
                linear-gradient(115deg, rgba(5, 23, 49, .94) 0%, rgba(8, 45, 89, .9) 52%, rgba(7, 13, 22, .96) 100%),
                radial-gradient(circle at 78% 28%, rgba(230, 0, 18, .55), transparent 30%);
        }

        .sub-visual:before {
            content: "";
            position: absolute;
            inset: 0;
            opacity: .22;
            background-image:
                linear-gradient(rgba(255,255,255,.15) 1px, transparent 1px),
                linear-gradient(90deg, rgba(255,255,255,.13) 1px, transparent 1px);
            background-size: 46px 46px;
            mask-image: linear-gradient(to bottom, #000, transparent 92%);
        }

        .sub-visual:after {
            content: "FIREWALL";
            position: absolute;
            right: -20px;
            bottom: -35px;
            color: rgba(255,255,255,.055);
            font-size: clamp(74px, 13vw, 170px);
            font-weight: 900;
            letter-spacing: 1px;
            line-height: .8;
        }

        .visual-inner {
            position: relative;
            z-index: 2;
            height: 100%;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 60px;
        }

        .visual-copy .eyebrow {
            display: inline-flex;
            align-items: center;
            gap: 10px;
			
            margin-bottom: 18px;
            color: #fff;
            font-size: 13px;
            font-weight: 600;
            letter-spacing: 2px;
            text-transform: uppercase;
        }

      

        .visual-copy h1 {
            font-size: clamp(38px, 5vw, 58px);
            line-height: 1.18;
            font-weight: 800;
            letter-spacing: -0.055em;
        }

        .visual-copy p {
            margin-top: 18px;
            max-width: 640px;
            color: rgba(255,255,255,.76);
            font-size: 17px;
            line-height: 1.8;
        }

        .visual-icon {
            flex: 0 0 230px;
            height: 230px;
            position: relative;
            border-radius: 50%;
            border: 1px solid rgba(255,255,255,.2);
            background: rgba(255,255,255,.055);
            box-shadow: inset 0 0 60px rgba(255,255,255,.05), 0 24px 70px rgba(0,0,0,.24);
        }

        .visual-icon:before,
        .visual-icon:after {
            content: "";
            position: absolute;
            border-radius: 50%;
        }

        .visual-icon:before {
            inset: 34px;
            border: 1px dashed rgba(255,255,255,.26);
        }

        .visual-icon:after {
            left: 50%;
            top: 50%;
            width: 86px;
            height: 106px;
            transform: translate(-50%, -50%);
            clip-path: polygon(50% 0, 92% 18%, 84% 74%, 50% 100%, 16% 74%, 8% 18%);
            background: linear-gradient(135deg, #e60012, #ff5a64);
            box-shadow: 0 18px 44px rgba(230,0,18,.34);
        }

        .breadcrumb {
            border-bottom: 1px solid rgba(255,255,255,.3)
          
        }

        .breadcrumb .inner {
            height: 58px;
            display: flex;
            align-items: center;
            gap: 10px;
            color:rgba(255,255,255,.9); 
            font-size: 15px;
        }

        .breadcrumb b {  font-weight: 700; }
        .breadcrumb i { color: #b6bdc8; font-style: normal; }

        .page-layout {
            
        }

        .lnb {
		margin-bottom:90px;
		margin-top:50px;
		 display:flex; 
            align-self: start;
           
            top: 28px;
            
        }

        .lnb-title {
            padding: 24px 20px;
            
            background: #102d52;
        }

        .lnb-title span {
            display: block;
            margin-bottom: 4px;
            color: rgba(255,255,255,.58);
            font-size: 12px;
            font-weight: 800;
            letter-spacing: .12em;
            text-transform: uppercase;
        }

        .lnb-title strong {
            display: block;
            font-size: 22px;
            line-height: 1.25;
            font-weight: 800;
            letter-spacing: -0.045em;
        }

        .lnb a {
		 width:100%; 
            display: flex;
            align-items: center;
            justify-content: space-between;
            min-height: 54px;
            padding: 0 18px;
            border: 1px solid rgba(255,255,255,.2);
            
            margin-right:-1px;
            font-size: 17px;
            font-weight: 400;
            transition: .2s;
        }

    

        .lnb a:hover,
        .lnb a.active {
            color: #e60012;
            background: #fafbfc;
			font-weight:600

        }

        .lnb a.active:after { color: #e60012;  }

        .content-head {
            margin-bottom: 42px;
            padding-bottom: 28px;
            border-bottom: 1px solid #dfe4eb;
        }

        .content-head .cat {
            display: inline-block;
            margin-bottom: 14px;
            color: #e60012;
            font-size: 14px;
            font-weight: 800;
            letter-spacing: .08em;
            text-transform: uppercase;
        }
 
        .intro-box {
            position: relative;
            overflow: hidden;
            margin-bottom: 62px;
            padding: 50px 42px;
            border: 1px solid rgba(255,255,255,.3);
            border-left: 5px solid #e60012;
            
        }

        .intro-box:after {
            content: "NGF";
            position: absolute;
            right: 26px;
            bottom: -35px;
            color:#fff;
			opacity:.05;
            font-size: 112px;
            line-height: 1;
            font-weight: 900;
            letter-spacing:1px;
        }

        .intro-box h3 {
            position: relative;
            z-index: 2;
            margin-bottom: 15px;
            color:#fff; 
            font-size: 25px;
            line-height: 1.35;
            font-weight: 800;
            letter-spacing: -0.045em;
        }

      
 
        .section-title {
            display: flex;
            align-items: center;
            gap: 16px;
            margin-bottom: 28px;
			color:#fff; 
        }

        .section-title b {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 42px;
            height: 42px;
            border-radius:10px;

            font-size: 17px;
            font-weight: 600;
            
        }

        .section-title h3 {
            
            font-size: 30px;
            line-height: 1.25;
            font-weight: 800;
            letter-spacing: -0.05em;
        }

        .feature-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 20px;
        }

        .feature-card {
            position: relative;
            min-height: 218px;
            padding: 30px 30px 28px;
            border: 1px solid rgba(255,255,255,.3);
           
            box-shadow: 0 14px 34px rgba(14, 32, 54, .06);
            transition: .24s;
        }

        .feature-card:before {
            content: "";
            position: absolute;
            left: -1px;
            top: 0;
            width: 4px;
            height: 100%;
            background: #e60012;
            transform: scaleY(0);
            transform-origin: top;
            transition: .24s;
        }

        .feature-card:hover {
            transform: translateY(-5px);
            border-color: #ced7e3;
            box-shadow: 0 22px 50px rgba(14, 32, 54, .1);
        }

        .feature-card:hover:before { transform: scaleY(1); }

        .feature-card .num {
            display: block;
            margin-bottom: 20px;
            
            font-size: 34px;
            line-height: 1;
            font-weight: 700;
            
        }

        .feature-card h4 {
            margin-bottom: 12px;
            color:#fff; 
            font-size: 21px;
            line-height: 1.35;
            font-weight: 800;
            letter-spacing: -0.04em;
        }
 

        .function-list {
            border-top: 1px solid #fff;
        }

        .function-item {
            display: flex;
			align-items:center; 
             gap: 32px;
            padding: 26px 0;
            border-bottom: 1px solid rgba(255,255,255,.3);
        }

        .function-name {
            display: flex;
            align-items: center;
            gap: 12px;
        }

        .function-name em {
            flex: 0 0 auto;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width:50px;
			
            height: 50px;
            
             border-radius:50%;
            font-style: normal;
            font-size: 16px;
            font-weight: 600;
            background: #e60012;
        }

        .function-name strong {
            padding-top: 2px;
             font-size: 20px;
            line-height: 1.35;
            font-weight: 600;
			color:#fff; 
            letter-spacing: -0.04em;
			width:200px; flex-shrink:0; 
        }

      
        .summary-band {
            margin-top: 70px;
            padding: 36px 40px;
            
            background:
                linear-gradient(115deg, rgba(16,45,82,.96), rgba(6,23,43,.96)),
                radial-gradient(circle at 86% 22%, rgba(230,0,18,.45), transparent 32%);
        }

        .summary-band h3 {
            margin-bottom: 14px;
            font-size: 26px;
            line-height: 1.35;
            font-weight: 800;
            letter-spacing: -0.045em;
        }

        .summary-band p {
            color: rgba(255,255,255,.75);
            font-size: 16px;
            line-height: 1.85;
        }