/* ==================== ARTICLE NETWORK ==================== */
#articleNetwork{position:relative;overflow:hidden;padding:25px 0;color:var(--secondary);}
#articleNetwork .network_intro{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:70px;padding-bottom:55px;border-bottom:1px solid #dce8f1;}
#articleNetwork .network_titlebox{max-width:920px;}
#articleNetwork .network_en{position:relative;margin:0 0 14px;padding-left:48px;font-size:9px;line-height:1.4;font-weight:800;letter-spacing:.2em;color:var(--primary);}
#articleNetwork .network_en:before{content:"";position:absolute;left:0;top:50%;width:34px;height:2px;background:var(--primary);transform:translateY(-50%);}
#articleNetwork .network_title{font-size:clamp(36px,4vw,56px);line-height:1.2;font-weight:900;letter-spacing:-.04em;color:var(--secondary);}
#articleNetwork .network_lead{max-width:850px;margin:22px 0 0;font-size:16px;line-height:2;color:var(--info);}
#articleNetwork .network_protocol{display:flex;align-items:center;gap:10px;padding-bottom:6px;}
#articleNetwork .network_protocol span{padding:7px 12px;border:1px solid #d5e4ee;background:#f8fcff;font-size: 13px;line-height:1.4;font-weight:800;color:var(--primary);}
#articleNetwork .network_protocol i{width:16px;height:1px;background:#bfd3e0;}

/* ==================== ARCHITECTURE ==================== */
#articleNetwork .network_architecture{display:grid;grid-template-columns:minmax(300px,.7fr) minmax(0,1.3fr);gap:20px;margin-top:55px;}
#articleNetwork .network_core{position:relative;min-height:500px;background:linear-gradient(145deg,#061d37 0%,#083a64 65%,#086ca8 100%);overflow:hidden;}
#articleNetwork .network_core:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(120,208,247,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(120,208,247,.055) 1px,transparent 1px);background-size:48px 48px;}
#articleNetwork .core_ring{position:absolute;left:50%;top:42%;border:1px solid rgba(112,216,255,.18);border-radius:50%;transform:translate(-50%,-50%);}
#articleNetwork .core_ring.ring_01{width:330px;height:330px;}
#articleNetwork .core_ring.ring_02{width:230px;height:230px;border-style:dashed;animation:networkRing 22s linear infinite;}
#articleNetwork .core_ring.ring_02:before{content:"";position:absolute;left:50%;top:-4px;width:7px;height:7px;border-radius:50%;background:#72ddff;box-shadow:0 0 10px rgba(92,213,255,.8);}
#articleNetwork .core_content{position:absolute;left:42px;right:42px;bottom:45px;z-index:3;}
#articleNetwork .core_content>span{display:block;margin-bottom:10px;font-size:9px;line-height:1.4;font-weight:800;letter-spacing:.18em;color:#70d9ff;}
#articleNetwork .core_content>div{font-size:32px;line-height:1.3;font-weight:850;color:#fff;}
#articleNetwork .core_content>p{max-width:420px;margin:15px 0 0;font-size: 16px;line-height:1.85;color:#aac6d8;}
@keyframes networkRing{0%{transform:translate(-50%,-50%) rotate(0deg);}100%{transform:translate(-50%,-50%) rotate(360deg);}}

/* ==================== FLOW ==================== */
#articleNetwork .network_flow{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid #dce7ef;border-left:1px solid #dce7ef;}
#articleNetwork .flow_item{position:relative;min-height:240px;padding:27px 26px;border-right:1px solid #dce7ef;border-bottom:1px solid #dce7ef;background:#fff;overflow:hidden;transition:.4s ease;}
#articleNetwork .flow_item:before{content:"";position:absolute;left:0;top:0;width:3px;height:0;background:linear-gradient(180deg,var(--primary),var(--complement));transition:height .4s ease;}
#articleNetwork .flow_item:after{content:"";position:absolute;right:-55px;bottom:-55px;width:140px;height:140px;border:1px solid rgba(var(--primary-rgb),.06);border-radius:50%;}
#articleNetwork .flow_no{font-size:10px;line-height:1;font-weight:800;color:var(--primary);}
#articleNetwork .flow_info{position:relative;z-index:2;margin-top:35px;}
#articleNetwork .flow_info>p{margin:0 0 5px;font-size:8px;line-height:1.4;font-weight:800;letter-spacing:.17em;color:#96a9b8;}
#articleNetwork .flow_info>div{font-size:22px;line-height:1.3;font-weight:850;color:#173f63;transition:.3s ease;}
#articleNetwork .flow_info>span{display:block;margin-top:12px;font-size: 16px;line-height:1.8;color:#788d9e;}
#articleNetwork .flow_item:hover{background:#f8fcff;}
#articleNetwork .flow_item:hover:before{height:100%;}
#articleNetwork .flow_item:hover .flow_info>div{color:var(--primary);}

/* ==================== FOCUS ==================== */
#articleNetwork .network_focus{margin-top:90px;padding:45px 48px;border:1px solid #dce8f1;background:#f5f9fc;}
#articleNetwork .focus_head{display:grid;grid-template-columns:minmax(210px,.4fr) minmax(0,1fr);align-items: center;gap:40px;padding-bottom:30px;border-bottom:1px solid #d7e4ed;}
#articleNetwork .focus_head>p{margin:0;font-size:9px;line-height:1.4;font-weight:800;letter-spacing:.19em;color:var(--primary);}
#articleNetwork .focus_head>div{font-size:28px;line-height:1.4;font-weight:850;color:var(--secondary);}
#articleNetwork .focus_list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:15px;}
#articleNetwork .focus_item{padding:22px 18px 22px 0;display:flex;align-items:center;gap:14px;border-bottom:1px solid #dce7ef;}
#articleNetwork .focus_item>span{width:28px;height:28px;flex-shrink:0;border:1px solid #bfd5e4;display:flex;align-items:center;justify-content:center;font-size:8px;line-height:1;color:var(--primary);}
#articleNetwork .focus_item font{display:block;font-size: 12px;line-height:1.3;font-weight:800;letter-spacing:.15em;color:#98aab7;}
#articleNetwork .focus_item p{margin:3px 0 0;font-size: 18px;line-height:1.5;font-weight:700;color:#4f6c82;}

/* ==================== STATEMENT ==================== */
#articleNetwork .network_statement{position:relative;margin-top:60px;padding:45px 48px;display:flex;align-items:center;justify-content:space-between;gap:40px;background:linear-gradient(110deg,#071f39 0%,#08446f 100%);overflow:hidden;}
#articleNetwork .network_statement:after{content:"";position:absolute;right:-130px;top:-190px;width:400px;height:400px;border:1px solid rgba(105,213,255,.13);border-radius:50%;box-shadow:0 0 0 55px rgba(105,213,255,.015);}
#articleNetwork .network_statement>div{position:relative;z-index:2;}
#articleNetwork .network_statement>div>p{margin:0 0 11px;font-size:8px;line-height:1.4;font-weight:800;letter-spacing:.19em;color:#6edaff;}
#articleNetwork .network_statement>div>div{font-size:clamp(26px,3vw,38px);line-height:1.35;font-weight:850;color:#fff;}
#articleNetwork .network_statement .comm_btn{position:relative;z-index:3;flex-shrink:0;}

/* ==================== RWD ==================== */
@media screen and (max-width:1200px) {
  #articleNetwork .network_intro { grid-template-columns: 1fr; gap: 24px; }
  #articleNetwork .network_architecture { grid-template-columns: 1fr; }
  #articleNetwork .network_core { min-height: 430px; }
  #articleNetwork .focus_list { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media screen and (max-width:767px) {
  #articleNetwork .network_intro { padding-bottom: 38px; }
  #articleNetwork .network_lead { font-size: 15px; }
  #articleNetwork .network_protocol { flex-wrap: wrap; }
  #articleNetwork .network_architecture { margin-top: 38px; }
  #articleNetwork .network_core { min-height: 380px; }
  #articleNetwork .core_ring.ring_01 { width: 270px; height: 270px; }
  #articleNetwork .core_ring.ring_02 { width: 190px; height: 190px; }
  #articleNetwork .core_content { left: 25px; right: 25px; bottom: 28px; }
  #articleNetwork .core_content>div { font-size: 27px; }
  #articleNetwork .network_flow { grid-template-columns: 1fr; }
  #articleNetwork .flow_item { min-height: auto; padding: 24px 22px; }
  #articleNetwork .network_focus { margin-top: 60px; padding: 30px 22px; }
  #articleNetwork .focus_head { grid-template-columns: 1fr; gap: 10px; }
  #articleNetwork .focus_head>div { font-size: 23px; }
  #articleNetwork .focus_list { grid-template-columns: 1fr; }
  #articleNetwork .network_statement { margin-top: 40px; padding: 35px 24px; align-items: flex-start; flex-direction: column; }
  #articleNetwork .network_statement .comm_btn { width: 100%; }
}