/* ================= Base ================= */ :root{ --bg:#05060b; --cell:#080b12; --cell2:#0b1019; --line:rgba(221,234,236,.115); --line2:rgba(231,240,241,.2); --hair:rgba(216,230,233,.064); --text:#edf1f2; --muted:#9da7b1; /* 2026-08: raised from #5d6975. Against --bg that was 3.61:1, and --dim is not decoration — it carries the breadcrumbs, the figure captions, BACK TO TOP, the footer tagline, the CTA note and the definition-list labels, all at 13-16px where the 3:1 large-text exemption does not apply. #6d7b8a is the smallest hue-preserving lift that clears AA on --bg (4.68:1) AND on the lightest panel any --dim text actually lands on, rgb(8,11,15) behind the /news/ datelines (4.55:1). Solved against the measured worst case, not against --bg alone. Contrast against --bg for the rest of the ramp, for whoever changes these next: --text 17.80, --muted 8.29, --mint 11.55, --cyan 12.43. */ --dim:#6d7b8a; --cyan:#b4d0d2; --violet:#aaa7b5; --mint:#a7cbc4; --amber:#e2c28b; --navy:#111a26; --navy2:#182b3a; --teal-soft:#b7cfd0; --ice:#e3ebec; --aperture:#e4c58d; --surface:#090d12; --surface2:#0d131a; --cool-glow:rgba(196,222,224,.2); --warm-glow:rgba(228,197,141,.22); --grad:linear-gradient(112deg,#f1f4f4 0%,#c8dddd 48%,#b9b5c0 78%,#dfcfad 100%); --mobius-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 480 480'%3E%3Cpath d='M397,478C380,477,359,475,346,472C345,472,342,471,341,471C339,471,335,470,332,469C325,468,325,467,319,466C317,465,315,465,314,464C310,463,304,461,301,460C298,459,295,458,294,458L291,457L289,458C283,461,268,466,262,468C256,469,251,471,249,471C248,471,246,472,245,472C244,472,240,473,238,473C233,474,230,475,219,476C212,477,189,476,181,476C173,475,163,473,158,472C157,472,155,471,154,471C152,471,147,469,141,468C136,466,124,462,120,460C119,460,117,459,115,459C111,457,100,451,97,450C96,449,95,448,95,448C95,448,82,441,79,438C71,433,62,425,56,419C54,417,52,416,52,415C51,415,52,412,53,410C54,409,55,407,57,406C63,400,72,391,83,377C93,366,107,347,114,334C120,324,122,321,126,313C135,294,140,281,145,263C146,260,148,251,149,248C149,246,149,244,150,243C151,233,152,207,151,198C148,180,143,166,134,153C127,143,113,134,94,126C83,122,64,117,55,116C52,115,51,114,51,113C51,112,52,110,56,107C89,77,127,59,170,52C182,50,206,50,217,50C243,53,262,58,287,68C293,70,303,76,312,81L313,82L315,80C316,79,318,77,320,75C322,73,325,71,327,70C328,68,332,65,335,63C340,58,345,54,352,49C355,47,358,45,359,43C370,35,397,17,411,9C414,7,419,4,421,3C424,1,426,0,426,0C429,4,430,3,414,19C406,27,398,35,397,37C395,38,394,39,394,40C394,40,392,42,390,44C388,46,387,48,386,48C382,52,357,84,346,99L343,104L351,112C359,119,363,124,366,128C366,128,367,129,367,129C367,129,369,132,372,136C373,137,374,139,375,139C375,140,382,150,385,155C388,160,393,170,396,175C396,177,397,179,398,180C403,193,409,211,411,227C416,257,415,290,407,318C407,319,407,321,406,322C403,337,394,357,384,373C381,378,372,391,371,392C371,392,370,394,368,395C361,405,349,418,339,426C334,430,327,436,325,437C324,437,324,438,324,438C324,440,344,450,356,455C361,457,367,460,370,460C377,463,383,465,389,466C392,467,396,468,397,468C397,468,400,469,403,470C414,472,416,472,421,473C426,474,427,474,428,475C428,476,428,478,427,479C426,479,409,479,397,478ZM216,472C218,472,223,472,225,472C230,471,238,470,243,469C244,469,246,468,248,468C259,465,285,457,285,455C286,454,285,454,285,454C285,454,283,453,275,449C251,439,229,421,216,401C208,389,201,373,197,355C195,347,193,329,193,319C193,309,195,288,197,278C200,263,204,248,209,236C210,233,211,230,212,228C212,226,214,222,215,219C217,216,218,213,219,211C220,207,229,190,232,186C233,184,234,182,234,182C234,181,246,161,251,154C252,153,255,149,257,145C263,137,274,123,280,116C283,113,286,110,287,109C288,107,297,98,305,90C308,87,310,85,310,84C310,83,296,76,288,72C287,72,285,71,283,70C276,67,256,61,248,59C247,59,245,58,244,58C214,52,179,52,149,60C141,62,141,62,135,64C112,72,90,84,71,99C65,104,64,105,60,109C56,112,56,112,63,112C73,112,90,114,103,116C115,119,132,123,140,127C140,127,141,128,143,128C159,134,175,147,184,160C194,174,199,191,199,214C199,234,196,248,189,268C174,309,139,354,98,385C96,387,94,388,94,388C92,390,68,406,58,411C57,412,56,413,56,413C55,414,69,426,80,434C98,447,122,459,142,464C157,469,167,471,185,472C191,473,211,473,216,472ZM325,433C353,413,378,382,392,352C395,343,396,342,398,337C402,327,404,318,406,307C408,298,408,296,410,286C410,280,410,248,410,241C407,222,402,199,397,188C397,187,396,185,395,183C387,163,373,141,359,125C356,121,342,107,341,107C341,107,329,125,324,134C321,139,319,142,319,142C319,142,319,143,318,144C314,150,304,171,299,182C297,188,295,193,290,204C288,209,285,218,283,224C282,227,281,230,281,231C278,240,273,265,271,278C265,327,271,372,290,403C291,405,292,407,292,407C292,407,298,417,300,418C305,425,319,437,320,436C321,436,323,434,325,433ZM271,411C270,409,269,408,269,407C269,407,268,406,267,404C266,401,259,389,258,385C254,373,250,361,249,351C248,350,248,347,248,345C244,321,246,289,252,261C252,259,253,258,253,256C253,255,254,252,255,249C255,247,256,244,256,243C257,241,257,239,259,234C260,232,260,230,261,229C261,227,265,216,265,215C265,215,266,214,266,214C266,213,266,213,266,212C267,210,268,207,268,207C268,207,267,207,267,208C267,208,267,210,266,211C265,213,265,214,265,214C265,214,265,215,264,215C264,217,261,225,259,231C258,234,257,236,257,237C257,237,256,239,256,240C254,246,253,249,253,252C252,253,252,255,252,256C251,259,250,265,248,272C248,273,248,276,247,277C247,279,246,284,245,291C243,316,244,344,249,364C252,372,252,374,252,375C253,376,253,378,254,380C255,382,256,385,257,386C258,388,258,390,258,390C258,392,269,410,272,413C273,415,273,414,271,411ZM250,407C249,406,249,404,249,404C249,404,248,403,248,403C247,402,246,399,245,397C229,368,223,331,228,291C229,280,232,263,235,255C235,253,236,250,237,248C238,244,242,232,244,224C247,217,253,203,256,197C257,193,258,192,256,194C256,195,255,196,255,196C255,197,255,197,255,197C255,197,254,197,254,198C254,198,253,200,252,203C251,206,249,209,249,209C249,210,248,211,248,212C247,214,246,216,246,218C244,221,244,222,243,224C243,225,242,227,242,228C241,229,241,230,241,230C240,231,240,231,240,232C240,232,240,233,240,233C238,237,231,263,229,273C229,275,228,277,228,278C225,290,223,319,225,333C225,340,227,352,228,355C228,357,229,359,229,360C232,376,242,399,250,408C252,411,252,410,250,407ZM232,406C220,389,211,366,208,343C206,323,207,301,210,281C212,272,213,267,217,252C220,242,228,218,233,207C235,203,238,197,240,194C240,192,241,190,241,190C241,189,236,199,236,200C236,200,236,200,236,200C235,201,231,209,231,210C231,210,230,211,230,213C229,214,228,217,227,218C227,220,226,221,226,221C226,221,226,222,225,223C225,224,224,227,223,230C222,233,220,236,220,238C219,240,217,246,216,251C216,251,215,254,214,257C211,267,209,275,208,281C208,283,207,286,207,288C204,306,204,332,207,349C211,370,218,389,228,402C229,403,231,405,231,406C232,407,232,407,232,407C233,407,232,407,232,406ZM281,397C279,393,277,389,277,389C277,388,277,388,277,387C276,384,273,376,271,370C271,369,270,366,269,364C269,362,268,359,268,358C268,356,267,354,267,353C265,342,263,320,264,307C264,301,264,299,263,300C263,300,263,304,263,314C263,334,264,348,268,364C268,365,269,366,269,367C269,369,271,374,272,377C275,386,277,391,282,400C282,401,283,401,283,401C283,400,282,399,281,397ZM256,395C255,393,254,391,253,390C253,390,253,388,252,387C241,362,237,327,241,291C241,285,243,276,243,274C243,272,244,270,244,269C245,263,247,253,248,249C249,249,249,245,250,242C252,235,253,233,253,231C254,231,254,228,255,226C256,224,257,222,257,221C257,221,257,221,257,220C257,220,257,219,258,218C258,218,259,216,260,213C260,212,261,211,260,211C260,211,260,211,260,212C259,212,259,213,258,216C258,216,257,218,257,219C257,220,256,221,256,221C256,222,255,222,255,223C255,223,255,224,255,224C255,225,254,226,254,228C253,229,253,230,253,231C252,232,250,239,249,241C249,243,248,244,248,246C248,247,247,249,246,252C246,254,245,257,245,258C244,262,244,263,243,264C243,265,243,267,242,270C241,274,241,276,240,284C237,303,237,334,240,349C240,350,240,352,241,354C241,357,244,366,244,368C245,372,248,380,248,381C248,381,249,383,250,384C250,385,251,386,251,386C251,387,255,397,256,397C256,397,256,398,256,398C257,399,257,399,257,399C257,399,257,397,256,395ZM274,393C273,391,271,388,270,386C270,383,269,381,269,381C268,380,266,372,264,367C263,363,262,357,261,354C261,352,261,349,260,348C258,332,257,307,260,287C261,276,263,263,264,257C264,257,265,255,265,253C266,251,266,248,267,245C269,238,269,236,270,235C270,234,270,233,270,232C271,230,272,226,272,226C272,225,272,226,272,226C270,232,269,235,268,236C268,237,268,238,268,238C268,239,268,239,268,240C267,240,267,243,266,246C265,248,265,251,264,252C259,274,255,307,257,326C258,342,259,352,261,359C261,360,262,362,262,364C263,366,263,368,263,368C264,369,264,370,264,372C266,377,268,384,270,388C274,396,275,398,275,397C275,397,274,395,274,393ZM248,393C248,391,247,391,247,391C247,392,249,397,250,396C250,396,249,395,248,393ZM268,396C268,395,267,394,266,392C266,390,264,387,264,386C264,385,263,382,262,381C261,379,261,376,260,376C260,375,260,372,259,370C258,368,257,365,257,363C257,362,256,360,256,359C253,344,251,318,253,301C253,293,254,282,255,278C255,277,256,274,256,273C256,270,259,256,260,254C260,253,260,251,260,250C261,248,263,242,264,237C264,236,265,235,265,234C265,233,266,230,267,228C268,223,268,222,268,222C267,222,267,223,267,224C267,224,267,225,267,225C266,225,266,228,265,230C264,232,263,235,263,237C262,240,258,254,257,260C256,261,256,263,256,264C256,265,255,268,255,270C254,273,254,276,253,277C253,279,253,282,253,284C252,286,252,289,252,291C250,299,250,316,251,327C251,336,251,340,253,350C253,354,255,362,256,365C257,367,257,369,257,369C258,372,262,384,263,386C264,388,265,390,265,391C266,392,266,394,267,395C267,396,268,397,268,396ZM228,391C226,387,224,382,224,382C224,381,223,379,223,377C221,373,218,362,217,359C217,358,217,357,217,355C208,313,217,258,240,206C241,205,242,203,242,202C242,201,244,197,247,192C249,188,251,184,251,183C251,183,250,183,250,184C241,201,232,220,224,243C223,246,223,249,220,257C218,266,218,265,216,275C212,292,211,318,212,333C213,346,214,353,217,363C218,366,219,370,219,370C219,371,219,372,220,372C220,372,220,372,220,373C220,374,220,374,220,375C221,375,222,378,224,383C224,384,225,386,228,391C229,394,230,394,228,391ZM236,393C236,393,235,391,235,390C218,355,216,310,227,262C231,247,238,223,243,213C244,212,244,210,245,209C247,203,257,182,259,179C260,178,260,176,260,176C260,176,260,176,260,177C260,177,259,178,259,178C259,178,259,178,258,179C258,179,258,181,257,182C254,187,246,204,243,211C242,212,241,214,241,215C240,216,240,216,238,221C237,223,237,225,236,226C236,226,235,229,234,232C233,235,232,237,232,238C231,240,227,254,225,262C225,265,224,268,224,269C223,273,221,286,219,297C218,305,219,334,220,341C220,344,221,348,221,350C221,353,223,361,224,363C224,364,224,365,225,366C225,369,227,375,228,377C228,377,229,378,229,379C231,385,236,395,236,393ZM215,389C214,388,214,386,213,385C213,384,212,383,212,382C211,381,211,380,211,380C211,380,211,379,210,378C209,376,207,368,206,364C204,359,202,348,201,340C200,334,200,305,201,298C204,274,208,256,217,232C218,228,220,224,220,223C220,223,221,221,222,220C222,218,223,216,224,214C227,207,236,189,239,183C240,182,240,181,240,181C240,181,240,181,239,182C239,182,239,183,239,183C238,183,236,187,234,191C233,193,232,195,232,195C232,195,221,217,221,218C221,218,220,219,220,221C217,227,211,245,209,252C204,269,202,278,200,290C200,292,199,295,199,296C198,302,198,317,198,325C198,335,199,343,202,355C202,359,206,371,208,375C208,376,208,377,209,377C209,378,210,380,211,382C211,384,212,385,212,386C213,387,215,390,215,390C216,390,215,390,215,389ZM245,385C241,376,238,365,236,357C236,355,236,353,235,352C231,331,232,298,237,272C237,271,238,268,238,267C238,265,239,263,239,260C240,256,240,256,240,256C240,256,239,256,239,257C239,260,238,263,237,266C237,268,236,270,236,272C234,281,234,285,233,289C233,291,232,295,232,297C232,299,232,307,232,318C232,334,232,337,233,347C234,354,236,363,238,369C239,371,239,372,239,373C239,374,240,375,240,375C240,375,240,375,240,376C240,376,240,377,241,378C241,378,242,380,242,382C244,386,246,390,246,389C246,389,246,387,245,385ZM265,290C265,289,265,289,264,289C264,289,264,290,264,291C264,293,264,293,264,292C265,292,265,291,265,290ZM158,280C158,280,158,279,158,279C158,279,159,278,159,278C160,275,161,271,162,270C162,269,164,263,165,260C165,259,166,258,166,257C166,255,168,246,169,244C170,238,170,237,171,231C172,220,172,200,170,191C168,184,166,175,164,172C164,171,163,170,163,169C163,169,159,161,159,161C159,161,159,161,159,161C159,160,158,160,158,160C158,160,158,161,159,163C160,164,161,166,161,167C163,172,164,175,164,175C164,176,165,176,165,177C166,179,168,187,169,192C172,212,170,232,165,255C164,257,163,263,162,265C162,267,161,269,160,270C159,274,157,281,156,282C156,283,156,283,156,284C156,285,158,281,158,280ZM173,279C174,278,174,277,174,277C175,274,176,272,177,271C177,271,177,270,177,269C177,269,177,268,178,268C178,267,181,259,181,257C185,243,185,241,187,230C188,222,188,206,187,200C186,192,186,191,186,189C185,188,185,186,184,185C184,183,183,182,183,181L183,179L183,181C183,182,183,183,183,183C183,183,184,184,184,184C184,185,184,186,184,187C185,188,185,193,186,199C187,204,187,222,186,227C185,238,182,249,181,255C181,255,180,257,180,258C179,261,175,272,174,274C174,275,174,276,173,277C172,279,172,281,171,282C171,282,171,283,171,283C171,284,172,282,173,279ZM147,280C148,280,148,278,148,277C149,276,149,274,150,274C150,273,151,271,151,269C152,266,153,264,153,263C153,262,155,255,156,249C158,241,159,232,160,220C160,214,159,200,158,194C157,188,157,186,155,182C155,180,154,178,154,177C154,177,153,175,153,174C151,170,148,163,147,163C147,163,148,164,149,167C149,168,150,169,151,171C151,172,152,174,152,175C153,177,155,185,156,189C160,210,159,233,153,257C153,257,153,259,153,260C153,260,152,263,151,266C150,269,149,272,149,273C149,273,149,275,148,275C148,276,148,277,148,277C148,277,147,278,147,278C147,279,147,280,147,280C147,280,146,281,146,281L147,283L147,281C147,281,147,280,147,280ZM183,276C184,273,185,271,185,271C185,271,185,270,185,270C186,267,191,252,192,248C192,247,193,245,193,244C197,226,198,205,194,190C194,189,193,188,193,187C193,184,191,179,190,178C190,178,190,177,190,177C190,176,189,174,187,172C187,171,187,170,187,170C186,169,186,169,186,169C186,169,185,168,185,167C184,165,184,165,184,166C184,166,184,167,184,167C184,167,185,168,185,169C185,169,186,170,186,171C187,171,187,173,188,174C188,176,189,178,190,180C190,181,191,183,191,184C192,185,192,187,192,188C196,204,196,222,192,242C191,248,190,249,188,256C187,262,182,275,181,278C180,279,180,280,181,280C181,280,182,278,183,276ZM172,260C173,259,173,257,173,257C174,256,174,253,175,249C177,241,177,242,178,232C179,226,180,214,179,206C179,201,179,198,178,198C178,198,178,204,178,212C178,221,178,228,178,231C177,233,177,236,177,238C176,240,176,242,176,243C173,253,173,256,172,257C172,258,172,259,172,260C172,260,172,261,171,261C171,261,171,262,171,263C171,264,171,264,171,264C171,263,172,262,172,260ZM162,256C162,255,162,255,161,255C161,256,161,258,161,257C162,257,162,256,162,256ZM241,253C241,252,241,252,241,252C240,253,240,255,241,254C241,254,241,254,241,253ZM163,251C163,250,163,249,163,249C164,248,165,244,164,244C164,244,163,245,163,246C163,247,163,248,163,249C162,250,162,253,162,253C163,253,163,252,163,251ZM161,240C165,218,164,197,158,178C158,175,156,172,156,171C154,166,151,160,151,160C150,160,151,161,151,163C153,166,156,173,157,176C157,177,157,178,158,179C159,183,160,189,161,192C161,193,161,196,162,198C162,199,162,204,162,210C163,222,162,232,160,243C159,250,159,251,160,247C161,245,161,242,161,240ZM188,247C188,245,189,243,189,242C189,240,190,234,191,229C193,219,192,199,190,191C190,190,190,188,189,187C188,182,188,181,187,178C185,174,180,164,180,164C179,163,179,165,181,167C182,169,183,172,184,173C184,175,185,177,185,177C191,193,192,217,188,242C187,247,187,249,187,249C187,249,187,248,188,247ZM165,240C165,238,165,238,165,238C165,239,164,240,164,241C164,243,164,243,165,243C165,242,165,241,165,240ZM181,239C181,238,181,238,181,238C181,239,180,240,180,240C180,243,181,241,181,239ZM166,233C166,232,166,230,167,229C168,224,167,202,165,191C165,188,163,179,162,179C162,179,162,178,162,177C162,177,162,176,161,176C161,176,161,175,161,175C161,175,161,173,160,172C159,171,158,169,158,168C157,167,157,166,157,166C157,167,157,168,158,169C159,170,159,172,159,172C159,173,159,173,160,173C160,173,160,174,160,175C160,175,160,176,160,176C161,176,161,178,161,179C162,180,162,181,163,182C163,184,163,185,164,190C166,201,167,215,166,225C165,236,165,237,166,237C166,236,166,235,166,233ZM182,233C183,232,183,228,183,226C184,221,184,199,183,195C181,186,181,185,179,180C178,175,178,175,174,168C173,165,171,162,171,162C171,162,170,162,170,161C170,161,170,161,170,161C170,161,170,162,171,163C171,164,172,165,172,166C172,166,173,168,174,169C176,175,179,183,180,189C181,192,181,195,182,197C183,204,183,222,181,234C181,235,181,236,182,236C182,236,182,235,182,233ZM175,227C174,227,174,227,174,229C174,230,174,231,175,230C175,229,175,228,175,227ZM273,223C273,222,273,222,273,223C272,223,272,225,273,225C273,225,273,224,273,223ZM175,212C175,195,173,182,169,175C169,174,169,174,169,174C169,173,165,165,164,165C164,165,165,166,165,167C167,171,168,175,169,176C169,177,170,179,170,181C171,184,172,186,172,187C174,199,175,206,175,214C175,218,175,221,175,221C176,220,176,216,175,212ZM155,202C155,201,155,202,155,203C155,205,155,206,155,205C155,204,155,203,155,202ZM154,192C154,192,154,193,154,195L154,196L154,195C154,194,154,193,154,192ZM178,192C177,191,177,193,177,195C178,196,178,196,178,194C178,193,178,192,178,192ZM153,188C153,187,153,187,153,188C153,190,153,190,153,189C153,188,153,188,153,188ZM254,178C254,178,254,177,255,176C256,174,256,174,256,174C256,174,255,174,255,175C254,176,254,177,254,177C253,178,253,179,253,179C254,179,254,178,254,178Z' fill='black'/%3E%3C/svg%3E"); --font-d:"Space Grotesk",sans-serif; --font-b:"Inter",sans-serif; --font-m:"IBM Plex Mono",monospace; --font-s:"Instrument Serif",serif; --ease:cubic-bezier(.16,1,.3,1); --nav-h:74px; /* ---- Type scale : 最小フォントサイズの定義 ---- 可読性の下限は --fs-nano(13px)。これより小さい指定は作らない。 --fs-nano 極小モノラベル（インデックス番号・座標・SVG注記） --fs-micro ラベル / タグ / ナビゲーション --fs-meta メタ情報 / ボタン / UI テキスト --fs-sm キャプション・補助本文 --fs-body 本文 2026-08: 全体を一段上げた。--fs-nano が 103 箇所、--fs-micro が 42 箇所で 使われている一方 --fs-body は 1 箇所しかなく、巨大な見出しと 11px の ラベルの海という構成になっていた。ここを上げると同時に、末尾の 「Readable type」ブロックで、ラベルではなく実質は本文である要素 （役職・所属・会社概要の値・誌名・日付・絞り込みボタン・但し書き）を このトークン群の外へ出している。site-nav.js の TYPE_FLOOR も この値に合わせること。 */ --fs-nano:13px; --fs-micro:14px; --fs-meta:15px; --fs-sm:16px; --fs-body:18px; } *{margin:0;padding:0;box-sizing:border-box} /* rem は :root の font-size に紐づくので --fs-body では動かない。本文 rem 指定 （.lead 1.05rem など）と clamp() の見出しをまとめて一段上げるのはここ。 */ html{font-size:17px;scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 20px)} body{ background:var(--bg);color:var(--text); font-family:var(--font-b);font-size:var(--fs-body);line-height:1.6; overflow-x:hidden;-webkit-font-smoothing:antialiased; } ::selection{background:rgba(56,225,255,.28);color:#fff} ::-webkit-scrollbar{width:9px} ::-webkit-scrollbar-thumb{background:#1a1e2e;border:2px solid var(--bg)} ::-webkit-scrollbar-track{background:var(--bg)} a{color:inherit;text-decoration:none} img,svg{display:block} /* em 継承で下限を割らないための保険 */ small,sub,sup{font-size:max(var(--fs-nano),.83em)} button,input{font:inherit;color:inherit} :focus-visible{outline:1px solid var(--cyan);outline-offset:3px} /* film grain */ body::after{ content:"";position:fixed;inset:-50%;z-index:95;pointer-events:none;opacity:.05; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); } /* column guides */ #guides{position:fixed;inset:0;z-index:0;pointer-events:none} #guides::before,#guides::after{content:"";position:absolute;top:0;bottom:0;width:1px;background:var(--hair)} #guides::before{left:max(24px,calc((100% - 1180px)/2))} #guides::after{right:max(24px,calc((100% - 1180px)/2))} /* fixed edge metadata */ .edge{position:fixed;z-index:3;font-family:var(--font-m);font-size:var(--fs-micro);letter-spacing:.32em;color:var(--dim);opacity:.55;pointer-events:none;white-space:nowrap} .edge-l{left:14px;bottom:120px;transform:rotate(180deg);writing-mode:vertical-rl} .edge-r{right:14px;top:140px;writing-mode:vertical-rl} @media (max-width:1280px){.edge{display:none}} .container{width:min(1180px,calc(100% - 48px));margin:0 auto} section{position:relative;padding:130px 0} /* ================= Type ================= */ h1,h2{font-family:var(--font-d);font-weight:600;letter-spacing:-.03em} h2{font-size:clamp(2.2rem,4.2vw,3.6rem);line-height:1.04;margin:34px 0 22px} .acc{font-family:var(--font-s);font-style:italic;font-weight:400;letter-spacing:0;font-size:1.06em} .acc-grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent} .lead{color:var(--muted);max-width:54ch;font-size:1.05rem} .mono{font-family:var(--font-m)} /* line-mask reveal */ .lm{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em} .js .lmi{display:inline-block;transform:translateY(120%) rotate(2deg);transform-origin:0 100%; transition:transform 1.1s var(--ease);transition-delay:var(--d,0s)} .js .reveal-lines.in .lmi,.js body.loaded #hero .lmi{transform:none} /* section top rule */ .sec-top{position:relative;display:flex;align-items:baseline;gap:22px;padding-top:20px; font-family:var(--font-m);font-size:var(--fs-micro);letter-spacing:.22em;color:var(--dim)} .sec-top::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:var(--line2); transform:scaleX(0);transform-origin:left;transition:transform 1.3s var(--ease)} .js .sec-top.in::before{transform:scaleX(1)} .sec-top .s-idx{color:var(--cyan)} .sec-top .s-lbl{color:var(--muted);font-size:var(--fs-body);letter-spacing:.16em} .sec-top .s-meta{margin-left:auto;color:var(--dim)} .cross{position:absolute;top:-7px;font-family:var(--font-m);font-size:var(--fs-meta);line-height:1;color:#3a4158} .cross.c-l{left:-4px}.cross.c-r{right:-4px} /* Möbius micro-mark — a shared visual grammar derived from the hero field */ .sec-top::after{content:"";position:absolute;left:8px;top:-15px;width:30px;height:30px;background:linear-gradient(135deg,var(--ice),var(--cyan) 50%,#dfb87a);-webkit-mask:var(--mobius-mask) center/contain no-repeat;mask:var(--mobius-mask) center/contain no-repeat;opacity:.72;filter:drop-shadow(0 0 8px rgba(227,235,236,.2));transform:scale(0) rotate(-22deg);transform-origin:center;transition:transform 1s .22s var(--ease),opacity .35s} .js .sec-top.in::after{transform:scale(1) rotate(0)} .sec-top .cross.c-l{display:none} /* generic reveal */ .js .reveal{opacity:0;transform:translateY(28px)} .js .reveal.in{opacity:1;transform:none; transition:opacity .95s var(--ease),transform .95s var(--ease);transition-delay:var(--d,0s)} .js .sec-top{opacity:1} /* ================= Buttons ================= */ .btn{ position:relative;display:inline-flex;align-items:center;gap:12px;cursor:pointer; font-family:var(--font-m);font-size:var(--fs-meta);font-weight:500;letter-spacing:.18em;text-transform:uppercase; padding:17px 28px;border:1px solid var(--line2);background:transparent;color:var(--text); transition:background .3s,color .3s,border-color .3s;white-space:nowrap;will-change:transform; } .btn .ar{display:inline-block;transition:transform .3s var(--ease)} .btn:hover .ar{transform:translateX(6px)} .btn-primary{background:var(--text);border-color:var(--text);color:#05060b; clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%)} .btn-primary:hover{background:var(--cyan);border-color:var(--cyan)} .btn-ghost:hover{border-color:var(--text)} .btn-sm{padding:12px 20px;font-size:var(--fs-micro)} /* ================= Nav ================= */ nav{position:fixed;top:0;left:0;right:0;z-index:100;transition:background .35s,backdrop-filter .35s;border-bottom:1px solid transparent} nav.scrolled{background:rgba(5,6,11,.78);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-color:var(--line)} .nav-in{height:var(--nav-h);display:flex;align-items:center;gap:30px} .logo{display:flex;align-items:center;gap:12px;font-family:var(--font-d);font-weight:700;letter-spacing:.26em;font-size:14px} .logo svg{width:24px;height:24px} .nav-links{display:flex;gap:30px;margin-left:auto;font-family:var(--font-m);font-size:var(--fs-micro);letter-spacing:.2em;color:var(--dim)} .nav-links a{transition:color .25s;padding:4px 0} .nav-links a:hover{color:var(--cyan)} #burger{display:none;background:none;border:1px solid var(--line2);width:44px;height:40px;cursor:pointer;position:relative;margin-left:auto} #burger span{position:absolute;left:12px;right:12px;height:1.4px;background:var(--text);transition:.3s} #burger span:nth-child(1){top:14px}#burger span:nth-child(2){top:20px}#burger span:nth-child(3){top:26px} nav.open #burger span:nth-child(1){top:20px;transform:rotate(45deg)} nav.open #burger span:nth-child(2){opacity:0} nav.open #burger span:nth-child(3){top:20px;transform:rotate(-45deg)} #mobile-menu{display:none;flex-direction:column;background:rgba(5,6,11,.97);border-bottom:1px solid var(--line);padding:12px 24px 30px} #mobile-menu a{display:flex;align-items:baseline;padding:15px 2px;border-bottom:1px solid var(--hair); font-family:var(--font-d);font-size:22px;letter-spacing:.02em} nav.open #mobile-menu{display:flex} /* progress */ #progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:200;background:var(--cyan); transform:scaleX(0);transform-origin:left} /* cursor glow */ #glow{position:fixed;top:0;left:0;width:620px;height:620px;z-index:1;pointer-events:none; background:radial-gradient(circle,rgba(90,150,255,.08) 0%,rgba(90,150,255,0) 62%); mix-blend-mode:screen;display:none} @media (pointer:fine){#glow{display:block}} /* ================= Hero ================= */ #hero{position:relative;min-height:100svh;display:flex;align-items:center;padding:calc(var(--nav-h) + 30px) 0 90px;overflow:hidden} #field{position:absolute;inset:0;z-index:0;width:100%;height:100%} #hero::before{content:"";position:absolute;inset:0;z-index:0; background: radial-gradient(50% 40% at 22% 16%, rgba(56,225,255,.08), transparent 70%), radial-gradient(44% 40% at 84% 70%, rgba(139,123,255,.09), transparent 70%); } #hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none; background:linear-gradient(100deg,rgba(5,6,11,.62) 0%,rgba(5,6,11,.26) 34%,transparent 58%), linear-gradient(180deg,transparent calc(100% - 140px),var(--bg))} .hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:1fr;align-items:center} .hero-copy{max-width:660px} .badge{display:inline-block;font-family:var(--font-m);font-size:var(--fs-micro);letter-spacing:.16em;color:var(--muted);margin-bottom:34px} .badge b{color:var(--mint);font-weight:400} h1{font-size:clamp(2.9rem,6.6vw,5.6rem);line-height:.99;margin-bottom:30px} .hero-sub{color:var(--muted);font-size:1.12rem;max-width:50ch;margin-bottom:40px} .hero-cta{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:34px} /* お問い合わせページでは .hero-cta が .lead-stack の最後の子で、後ろに .hero-note が 続かない。34px は主導線ボタンの下に残る死んだ余白なので、当該ページだけ落とす。 */ .contact-page .hero-cta{margin-bottom:0} /* 2026-08: var(--dim)（#6d7b8a・対 --bg 4.68:1）から --muted へ。設立年などを 載せるヒーロー下のメタ行は小さな等幅字で、暗背景では読みづらいとの指摘 （もう少し見やすく）。同じヒーローのメタ行である .badge が既に --muted （#9da7b1・8.29:1）なので、それに合わせる。 */ .hero-note{font-family:var(--font-m);font-size:var(--fs-micro);color:var(--muted);letter-spacing:.14em;margin-bottom:56px} .hero-note em{font-style:normal;color:#3a4158;padding:0 10px} /* 2026-08: トップページ（/ と /jp/ のみ、body.home-page）では #6d7b8a の文字を すべて #9da7b1（= --muted の値）へ、との指摘。トークン --dim を body 配下で 再定義する。レンダリング済み DOM を全要素監査した結果、トップページの --dim は ナビ・フッター見出し・言語切替・edge ラベル・news 矢印などの文字色のみで、 ボーダー・背景・SVG 図形には使われていないため一括再定義で安全。カスタム プロパティの継承なのでメディアクエリの詳細度問題も生じない。他ページは :root の --dim(#6d7b8a) のまま。 */ body.home-page{--dim:#9da7b1} .js .fx{opacity:0;transform:translateY(18px);filter:blur(6px)} .js body.loaded .fx{opacity:1;transform:none;filter:blur(0); transition:opacity 1s var(--ease),transform 1s var(--ease),filter 1s ease;transition-delay:var(--d,0s)} @keyframes pulse{0%,100%{opacity:1}50%{opacity:.25}} .scroll-cue{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);z-index:2; font-family:var(--font-m);font-size:var(--fs-micro);letter-spacing:.4em;color:var(--dim); display:flex;flex-direction:column;align-items:center;gap:10px} .scroll-cue::after{content:"";width:1px;height:46px;background:linear-gradient(180deg,var(--cyan),transparent); animation:cue 2.4s ease-in-out infinite} @keyframes cue{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}} @keyframes dash{to{stroke-dashoffset:-56}} /* ================= Technology ================= */ /* ================= Footer ================= */ footer{border-top:1px solid var(--line);padding:0} .foot-brand p{color:var(--dim);font-size:var(--fs-sm);margin-top:16px;max-width:26ch} .foot-bottom{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap; border-top:1px solid var(--hair);padding:26px 0;color:var(--dim);font-size:var(--fs-sm)} /* ================= Responsive ================= */ @media (max-width:1020px){ .hero-grid{grid-template-columns:1fr;gap:48px} .foot-brand{grid-column:span 2;border-bottom:1px solid var(--hair)} } @media (max-width:680px){ section{padding:88px 0} .nav-links{display:none} #burger{display:block} .scroll-cue{display:none} } /* ================= Reduced motion ================= */ @media (prefers-reduced-motion:reduce){ *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important} html{scroll-behavior:auto} .js .fx,.js .reveal{opacity:1 !important;transform:none !important;filter:none !important} .js .lmi{transform:none !important} .js .sec-top::before{transform:scaleX(1) !important} } /* ================= xFOREST Edition ================= */ /* 和文の書体。body（下）は Noto Sans JP を指しているのに、見出しは h1,h2 の var(--font-d)（104）と h3 級を捕まえる 13 本の font: 一括指定に上書きされて いた。Space Grotesk / Inter / IBM Plex Mono / Instrument Serif はいずれも CJK と仮名の unicode-range を 1 つも持たない（Google Fonts の @font-face 419 面を機械確認：CJK/仮名を宣言するのは Noto Sans JP の 372 面のみ）。 つまり和文見出しは今まで OS 依存のフォールバックで出ていて、macOS と Windows で別の書体だった。 フォールバックは 1 文字ずつ効くので、各変数の «末尾» に Noto Sans JP を 足すだけでよい。こうすると欧文は今までどおり Space Grotesk / Inter / IBM Plex Mono のまま、和文だけが Noto Sans JP に落ちる。Noto Sans JP に 先頭を譲ると欧文字幅まで変わり、"RNA" を含む見出しの折り返しが動く （実測：「RNA生物学を貫く」＋「3つの経路」が 3 行に割れた）ので順序は重要。 変数を差し替える形にしたので、font: 一括指定 13 本と詳細度を争わずに済み、 ボタンやナビなど見出し以外の和文にも同じ書体が行き渡る。 --font-s（Instrument Serif）も同じ形で末尾に Noto Sans JP を足した。ここは font-style:italic が掛かる唯一の場所で、和文に本物の斜体が無いため今までは フォールバック書体の «合成斜体» が出ていた。誰も選んでいない見た目なので 止める。和文に斜体が無いのは Noto Sans JP に限らず、Google Fonts の和文 書体すべて：Noto Sans JP / Noto Serif JP / IBM Plex Sans JP / Zen Old Mincho / Shippori Mincho / Klee One / Zen Kaku Gothic New の 7 ファミリで ital@1 が HTTP 400 を返す（css2 API に機械確認）。つまり «明朝を足せば斜体が直る» と いう道は無い。 止め方は font-style:normal ではなく font-synthesis-style:none。/jp/news/ の 「archive」は和文を含まない Latin の .acc で、Instrument Serif は本物の italic 面を持つ（この link は ital@0;1 を読み込んでいる）。normal にすると その Latin まで立ってしまうが、合成を切るだけなら «本物の斜体を持つ書体は そのまま、持たない書体だけが立つ» と字ごとに分かれる。実測：archive の幅は 156.55px で変更前と同一・Instrument Serif の 7 グリフのまま、和文は傾き （左端のずれの傾き）が -0.276 から -0.026 になった。 明朝（Noto Serif JP）を足す案は測って見送った。斜体は上のとおり直らない まま、.acc の文字を覆う subset 面を新たに引くので /jp/news/ で 2 リクエスト 65,228 バイト、/jp/technology/moa/ で 9 リクエスト 147,956 バイト増える。 28 か所の短い添え字にその代償は見合わない。強調は残る字送りと ウェイト差（見出し 600 に対して .acc は 400）と .acc-grad の階調で付く。 */ /* 和文書体は游ゴシックを第一候補にする（リポジトリ所有者の指定）。webfont は 増やさない：游ゴシックは OS 標準で、在る機械では取得ゼロで使える。 ファミリ名は OS ごとに違い、ここが唯一の落とし穴なので順に理由を書く。 1. "Yu Gothic Medium" を先頭に置く。Windows は游ゴシックの Medium 面を «独立したファミリ名» で見せる。Windows の Regular は画面で細く見えるので、 Medium を先に名指しするのが通例。 2. "游ゴシック Medium" は 1 と同じ面の和文名。欧文名が引けない古い Windows と ロケール依存の実装のための別名で、在庫が無ければ読み飛ばされる。 3. YuGothic（空白なし）が macOS のファミリ名。必ず "Yu Gothic"（空白あり）より «前»。macOS の YuGothic は normal でも W3/Medium 相当なので細くならない。 4. "游ゴシック体" は 3 の和文名。 5. "Yu Gothic"（空白あり）は Windows の Regular ファミリで、游ゴシック名の 最後の受け皿。Medium 系を先に置いたので、ここへ来るのは Medium が 引けない場合だけ。 "Yu Gothic UI" は «入れない»。UI 用に字送りを詰めた別ファミリで、本文や 見出し向きではない。Windows がこの名前も見せるので混同しやすい。 游ゴシックの後ろは実在する和文書体で埋める。iOS と旧 macOS に游ゴシックは 無いので Hiragino、Windows 8.1 より前は Meiryo。最後の砦として "Noto Sans JP"（webfont）を残す：Android と Linux はここに落ちる。これを 外すと OS 任せに戻って本 PR が買った決定性を失うので、link も含めて触らない。 総称（sans-serif / monospace / serif）は必ず最後。途中に置くと以降の和文名が 到達不能になる。 欧文書体は今までどおり先頭のまま（Space Grotesk / Inter / IBM Plex Mono / Instrument Serif）。上の «欧文の字幅を動かさない» 方針は変えていないので、 和文名を何本足しても欧文の 1 文字も動かない。実測でも英語ページ・和文見出し 中の Latin ともに完全一致（下の計測を参照）。 届く範囲。var(--font-d) を使う見出し（h1,h2 と font: 一括指定 13 本）、 var(--font-m) のナビ・ボタン・ラベル、var(--font-s) の .acc は游ゴシックに なる。«本文» は下の html[lang="ja"] body が Noto Sans JP を先頭に持つため Noto Sans JP のまま。この規則は main 由来（242c107）で、和文ページの本文中の Latin まで Noto Sans JP で組んでいる（実測 396.42px 対 Inter 404.47px）。 ここに游ゴシックを差すと «Latin を動かさない» に反するので今回は触らない。 本文まで游ゴシックにするなら 1 行の追加で足りるが、和文ページの本文の Latin の見た目が変わる判断を含むので所有者の確認待ちとする。 検証の限界を明記する。この計測コンテナに游ゴシック / Hiragino / Meiryo は 1 つも無い（和文は IPAGothic と WenQuanYi Zen Hei だけ）。CDP の CSS.getPlatformFontsForNode で確認できたのは «在らない名前は読み飛ばされ、 fontconfig の代替（DejaVu Sans）に化けることなく Noto Sans JP まで落ちる» ことと «並びが参照されている» ことまで。Windows と macOS で実際にどう見えるか、 1 の Medium 指定が効いて細さが直るかは «未検証»。 */ html[lang="ja"]{ --font-d:"Space Grotesk","Yu Gothic Medium","游ゴシック Medium",YuGothic,"游ゴシック体","Yu Gothic","Hiragino Sans","Hiragino Kaku Gothic ProN",Meiryo,"Noto Sans JP",sans-serif; --font-b:"Inter","Yu Gothic Medium","游ゴシック Medium",YuGothic,"游ゴシック体","Yu Gothic","Hiragino Sans","Hiragino Kaku Gothic ProN",Meiryo,"Noto Sans JP",sans-serif; --font-m:"IBM Plex Mono","Yu Gothic Medium","游ゴシック Medium",YuGothic,"游ゴシック体","Yu Gothic","Hiragino Sans","Hiragino Kaku Gothic ProN",Meiryo,"Noto Sans JP",monospace; --font-s:"Instrument Serif","Yu Gothic Medium","游ゴシック Medium",YuGothic,"游ゴシック体","Yu Gothic","Hiragino Sans","Hiragino Kaku Gothic ProN",Meiryo,"Noto Sans JP",serif} html[lang="ja"] .acc{font-synthesis-style:none} html[lang="ja"] body{font-family:"Noto Sans JP",var(--font-b)} /* 英語ページに置かれた和文の受け皿。英語ページは Noto Sans JP を読み込んで おらず html[lang="ja"] も当たらないので、和文の指定が 1 つも無い。言語の 手がかりが無いまま西欧ロケールのブラウザに渡ると簡体字の書体が選ばれる。 実測：about/company/ の 株式会社イクスフォレスト セラピューティクス（.company-facts dd が --font-b＝Inter で組む。 同じ詳細度の 536 行より後に来る側が勝つ）の 21 文字が WenQuanYi Zen Hei、 つまり中文書体で出ていた。サイト全体でここだけ。 21 文字のために webfont を 1 ファミリ増やすのは見合わないので、OS に必ず ある和文書体を並べる。ダウンロードは増えず、link にも手を入れない。 Inter を先頭に残すのは «欧文の字幅を動かさない» という上の方針と同じで、 この span に混じる半角空白と将来の欧文は Inter のまま出る。総称は必ず 最後：途中に置くと以降の和文名が到達不能になる。 html:not([lang="ja"]) で英語ページに閉じている。詳細度 (0,2,1) は .company-facts dd の (0,2,0) より強いので、記述順に関係なく勝つ。 和文ページ側は上のブロックがそのまま効き、この規則は当たらない。 並べたのは各 OS に標準で載っている名前：macOS は Hiragino Sans、 Windows 8.1 以降は Yu Gothic、それ以前は Meiryo、Linux と Android は Noto Sans CJK JP。webfont ではないので link は増えない。 検証の限界も書いておく。この計測コンテナには上のどれも入っていない （和文書体は IPAGothic と WenQuanYi Zen Hei だけ）ため、コンテナ上では 規則の «前» と «後» が同じ WenQuanYi Zen Hei のままで、効いていることを 直接は示せない。そこで実機で Hiragino が座る位置にコンテナに実在する IPAGothic を差し込んで測ると、21 文字は IPAGothic×21 に移り、 欧文は Inter×1 のまま、他の dd の幅も 310.16 / 76.41 / 557.53 / 273.3 / 302.81px と 1 つも動かなかった。つまり «並びは参照されていて、和文名が 在れば中文書体より先に勝つ» ところまでは実測できている。実機で どの面が出るかは OS 側の在庫次第。 なお同じ掃き出しで見つかった英語ページ上の和文はもう 11 か所あるが、 1 か所（CBI 講演会のニュースの和文タイトル。生成元は content/news/2023-05-26-cbi-lecture.md の 15 行目）を除く 10 か所は 英文中の全角括弧「（）」で、書体ではなく原稿の誤りなので別途直す。 いずれも lang を持たず .article-body の lang="en" を継ぐため、 lang による選択子では届かない。 */ html:not([lang="ja"]) [lang="ja"]{ font-family:"Inter","Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic Medium","Yu Gothic",Meiryo,"Noto Sans CJK JP","Noto Sans JP",sans-serif} .skip-link{position:fixed;left:18px;top:12px;z-index:999;transform:translateY(-150%);background:var(--text);color:var(--bg); padding:10px 14px;font-family:var(--font-m);font-size:var(--fs-micro);letter-spacing:.08em;transition:transform .2s} .skip-link:focus{transform:none} .sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important; clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important} .eyebrow{display:block;font-family:var(--font-m);font-size:var(--fs-micro);letter-spacing:.28em;color:var(--mint);text-transform:uppercase} /* brand */ .logo span{display:inline-flex;align-items:baseline} .logo b{color:var(--mint);font-size:1.22em;font-weight:600;margin-right:1px} .logo .brand-mark{width:27px;height:27px;overflow:visible;background:linear-gradient(135deg,var(--ice),var(--cyan) 50%,#dfb87a);-webkit-mask:var(--mobius-mask) center/contain no-repeat;mask:var(--mobius-mask) center/contain no-repeat;filter:drop-shadow(0 0 7px rgba(227,235,236,.18))} .brand-mark path,.brand-mark circle{opacity:0} /* navigation additions */ .lang-switch{display:flex;align-items:center;gap:5px;margin-left:4px;color:var(--dim);font-family:var(--font-m);font-size:var(--fs-micro)} .lang-switch button,.mobile-lang button{appearance:none;border:0;background:none;color:var(--dim);font-family:var(--font-m);font-size:var(--fs-micro); letter-spacing:.14em;cursor:pointer;padding:7px 3px;transition:color .25s} .lang-switch button:hover,.lang-switch button[aria-pressed="true"],.mobile-lang button[aria-pressed="true"]{color:var(--mint)} .nav-contact{margin-left:4px} #mobile-menu>a:last-of-type{color:var(--mint)} .mobile-lang{display:flex;gap:18px;padding-top:18px} .mobile-lang button{border:1px solid var(--line);padding:10px 14px} /* The drawer no longer carries a language block: EN / JP is in the header at every width, so a second copy behind the burger is a duplicate control. Hidden rather than deleted from the markup — site-nav.js uses .mobile-lang as the insertion anchor for the drawer's type switch, so the node has to stay. The #id keeps this ahead of the .detail-page .mobile-lang rule further down. */ #mobile-menu .mobile-lang{display:none} /* hero copy only — canvas and its 3D rendering remain unchanged */ .hero-copy{max-width:760px} #hero h1{font-size:clamp(2.8rem,5.75vw,5.2rem)} #hero .badge{color:#aab2c6} #hero .badge::before{content:"";display:inline-block;width:6px;height:6px;background:var(--mint);border-radius:50%;margin-right:12px; box-shadow:0 0 18px rgba(92,242,192,.75);animation:pulse 2.5s infinite} /* shared section framing */ #science,#technology,#pipeline,#advantage,#validation,#about,#join{isolation:isolate;overflow:clip} .section-heading{display:grid;grid-template-columns:minmax(0,1fr);margin-bottom:56px} .section-heading.split{grid-template-columns:minmax(0,1.2fr) minmax(280px,.65fr);gap:70px;align-items:end} .section-heading.split .lead{margin-bottom:8px} .section-heading h2{max-width:900px} .section-orbit{position:absolute;z-index:-1;width:760px;height:456px;pointer-events:none;background:linear-gradient(100deg,var(--cyan),var(--mint) 48%,var(--violet));-webkit-mask:var(--mobius-mask) center/contain no-repeat;mask:var(--mobius-mask) center/contain no-repeat;opacity:.038;filter:drop-shadow(0 0 22px rgba(81,212,214,.22))} .section-orbit::before,.section-orbit::after{display:none} .orbit-a{right:-310px;top:160px;transform:rotate(-11deg)} .orbit-b{width:900px;height:540px;left:-490px;top:310px;transform:rotate(14deg)} .orbit-c{width:680px;height:408px;right:-310px;bottom:120px;transform:rotate(-18deg)} /* proof strip */ #proof{padding:0;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);background:rgba(7,9,15,.7)} .proof-grid{display:grid;grid-template-columns:1.55fr repeat(3,1fr);border-left:1px solid var(--hair);border-right:1px solid var(--hair)} .proof-metric{min-height:175px;padding:34px 30px;display:flex;flex-direction:column;justify-content:center} .proof-metric{border-left:1px solid var(--hair);gap:14px} .proof-metric>span:last-child{font-family:var(--font-m);font-size:var(--fs-micro);line-height:1.5;letter-spacing:.15em;color:var(--dim);text-transform:uppercase} /* #proof has no padding of its own and .proof-signal is pinned to its bottom edge, so the source line has to carry the clearance itself. */ .proof-source{padding-bottom:28px} /* science */ .science-stage{display:grid;grid-template-columns:360px minmax(0,1fr);min-height:560px;border:1px solid var(--line);background:rgba(7,9,15,.78)} .science-copy{border-right:1px solid var(--line);display:flex;flex-direction:column} .science-step{flex:1;display:grid;grid-template-columns:44px 1fr;gap:16px;padding:34px 30px;border-bottom:1px solid var(--hair); position:relative;transition:background .35s} .science-step:last-child{border-bottom:0} .science-step.active{background:linear-gradient(110deg,rgba(92,242,192,.08),transparent)} .science-step.active::after{content:"";position:absolute;right:-1px;top:20%;bottom:20%;width:1px;background:var(--mint); box-shadow:0 0 22px rgba(92,242,192,.8)} .step-no{font-family:var(--font-m);font-size:var(--fs-micro);color:var(--mint);letter-spacing:.16em;padding-top:5px} .science-step h3{font-family:var(--font-d);font-size:1.16rem;margin-bottom:8px} .science-step p{color:var(--muted);font-size:var(--fs-sm);line-height:1.65} .rna-universe{position:relative;display:grid;place-items:center;overflow:hidden;padding:20px} .rna-universe::before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--hair) 1px,transparent 1px), linear-gradient(90deg,var(--hair) 1px,transparent 1px);background-size:40px 40px;-webkit-mask-image:radial-gradient(circle,#000 0,transparent 76%);mask-image:radial-gradient(circle,#000 0,transparent 76%);opacity:.55} .rna-universe svg{width:100%;height:auto;position:relative;z-index:1} .genome-ring circle,.genome-ring path,.motif-loop path,.protein-target path,.protein-target circle,.molecule circle,.molecule path{ fill:none;stroke:rgba(174,212,225,.7);stroke-width:1.4} .genome-ring path{stroke:rgba(56,225,255,.55)} .flow-line{fill:none;stroke:url(#rnaFlow);stroke-width:2;stroke-dasharray:8 9;animation:dash 4s linear infinite} .flow-line.ghost{opacity:.35;stroke-width:1} .rna-node circle{fill:#091510;stroke:var(--mint);stroke-width:1} .rna-node text{fill:#c6ffe8;text-anchor:middle;font:var(--fs-nano) var(--font-m)} .motif-loop path{stroke:rgba(139,123,255,.65)} .molecule circle,.molecule path{stroke:var(--amber)} .molecule{filter:drop-shadow(0 0 10px rgba(255,209,102,.26))} .protein-target{opacity:.58} .measure{stroke:var(--hair)} .fig-label,.coord-label{font-family:var(--font-m);font-size:var(--fs-micro);letter-spacing:.14em;fill:var(--dim)} .fig-label.hot{fill:var(--mint)} /* 861〜1080pxでは2カラムに挟まれて図が最も縮む。下限まで拡大した右端の ラベルが viewBox を越えるので、この帯だけ右寄せにして内側へ逃がす */ @media (min-width:861px) and (max-width:1080px){.fig-label.hot+.fig-label{text-anchor:end}} .coord-label{font-size:var(--fs-nano)} .science-principles{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-top:0} .principle{padding:34px 30px;min-height:220px} .principle+.principle{border-left:1px solid var(--hair)} .principle>span{font-family:var(--font-m);font-size:var(--fs-nano);letter-spacing:.2em;color:var(--mint)} .principle h3{font-family:var(--font-d);font-size:1.22rem;line-height:1.25;margin:34px 0 12px} .principle p{font-size:.9rem;color:var(--muted)} /* matrix system */ .matrix-system{border:1px solid var(--line);background:rgba(6,8,14,.9);position:relative;overflow:hidden} .matrix-system::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 38%,rgba(92,242,192,.08),transparent 38%)} .matrix-header{min-height:110px;padding:26px 30px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);position:relative;z-index:1} .system-tag,.panel-index{font-family:var(--font-m);font-size:var(--fs-nano);letter-spacing:.2em;color:var(--mint)} .matrix-header h3{font:600 1.8rem var(--font-d);margin-top:4px} .system-status{font-family:var(--font-m);font-size:var(--fs-nano);letter-spacing:.18em;color:var(--dim);display:flex;align-items:center;gap:10px} .system-status i,.pipeline-note i{width:6px;height:6px;background:var(--mint);border-radius:50%;box-shadow:0 0 12px rgba(92,242,192,.7)} .matrix-flow{min-height:440px;display:grid;grid-template-columns:1fr 1.45fr 1fr;position:relative;z-index:1} .library-panel{padding:34px 30px;border-right:1px solid var(--line);position:relative;overflow:hidden} .library-panel:last-child{border-right:0;border-left:1px solid var(--line)} .library-panel h4{font:600 1.25rem var(--font-d);margin:24px 0 10px} .library-panel p{color:var(--muted);font-size:var(--fs-sm);max-width:27ch} .rna-bars{height:150px;position:absolute;left:30px;right:30px;bottom:32px;display:flex;align-items:flex-end;gap:8px} .rna-bars span{height:var(--h);flex:1;border-top:1px solid var(--cyan);background:linear-gradient(180deg,rgba(56,225,255,.3),rgba(56,225,255,.02)); animation:barSense 3s ease-in-out infinite alternate} .rna-bars span:nth-child(2n){animation-delay:-.8s}.rna-bars span:nth-child(3n){animation-delay:-1.6s} @keyframes barSense{to{transform:scaleY(.72);opacity:.55}} .compound-cluster{position:absolute;width:190px;height:150px;bottom:24px;left:50%;transform:translateX(-50%)} .atom{position:absolute;width:30px;height:30px;border:1px solid var(--amber);border-radius:50%;background:rgba(255,209,102,.04);z-index:2} .a1{left:12px;top:54px}.a2{left:65px;top:16px}.a3{left:119px;top:48px}.a4{left:95px;top:104px}.a5{left:39px;top:105px} .bond{position:absolute;height:1px;background:rgba(255,209,102,.55);transform-origin:left;z-index:1} .b1{width:61px;left:34px;top:66px;transform:rotate(-36deg)}.b2{width:59px;left:89px;top:34px;transform:rotate(31deg)} .b3{width:59px;left:133px;top:74px;transform:rotate(114deg)}.b4{width:60px;left:111px;top:118px;transform:rotate(180deg)} .matrix-panel{position:relative;padding:34px 40px 34px 58px;display:grid;place-items:center} .matrix-grid{display:grid;grid-template-columns:repeat(12,1fr);grid-template-rows:repeat(8,1fr);gap:4px;width:min(100%,420px);aspect-ratio:1.5} .matrix-cell{background:#0d1220;border:1px solid rgba(255,255,255,.03);transition:background .4s,box-shadow .4s} .matrix-cell.low{background:rgba(56,225,255,.12)}.matrix-cell.mid{background:rgba(92,242,192,.34)} .matrix-cell.high{background:var(--mint);box-shadow:0 0 13px rgba(92,242,192,.6)} .matrix-cell.violet{background:rgba(139,123,255,.45)} .matrix-scan{position:absolute;left:40px;right:40px;height:1px;top:22%;background:linear-gradient(90deg,transparent,var(--mint),transparent); box-shadow:0 0 14px rgba(92,242,192,.7);animation:matrixScan 4.6s ease-in-out infinite} @keyframes matrixScan{0%,100%{top:20%;opacity:0}10%,90%{opacity:1}50%{top:79%}} .axis{position:absolute;z-index:3;font-family:var(--font-m);font-size:var(--fs-nano);letter-spacing:.18em;color:var(--muted)} .axis-y{left:14px;top:50%;writing-mode:vertical-rl;transform:translateY(-50%) rotate(180deg);transform-origin:center}.axis-x{bottom:10px;left:50%;transform:translateX(-50%)} .matrix-readout{position:absolute;top:16px;right:20px;display:flex;gap:10px;align-items:baseline;font-family:var(--font-m);font-size:var(--fs-nano);letter-spacing:.12em;color:var(--dim)} .matrix-readout strong{color:var(--mint);font-size:var(--fs-nano);font-weight:500} .discovery-output{display:grid;grid-template-columns:repeat(4,1fr);position:relative;border-top:1px solid var(--line);min-height:122px} .output-line{position:absolute;left:12.5%;right:12.5%;top:37px;height:1px;background:linear-gradient(90deg,var(--cyan),var(--mint),var(--violet));opacity:.38} .output-node{padding:28px 24px 24px;text-align:center;position:relative} .output-node::before{content:"";display:block;width:9px;height:9px;background:var(--cell);border:1px solid var(--dim);border-radius:50%;margin:4px auto 20px;position:relative;z-index:1} .output-node.hot::before{background:var(--mint);border-color:var(--mint);box-shadow:0 0 18px rgba(92,242,192,.85)} .output-node b{display:block;font:500 var(--fs-sm) var(--font-d);margin-top:6px} .tech-portfolio{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-top:0;background:var(--line);gap:1px} .tech-card{min-height:290px;padding:30px 26px;background:var(--cell);position:relative} .tech-no,.tech-state{font-family:var(--font-m);font-size:var(--fs-nano);letter-spacing:.18em;color:var(--dim)} .tech-state{float:right;color:var(--mint)} .tech-card h3{font:600 1.3rem var(--font-d);margin:70px 0 16px} .tech-card p{color:var(--muted);font-size:var(--fs-sm)} /* pipeline */ .pipeline-wrap{border:1px solid var(--line);background:rgba(7,9,15,.74)} .pipeline-note{min-height:62px;padding:0 24px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between; font-family:var(--font-m);font-size:var(--fs-nano);letter-spacing:.16em;color:var(--dim)} .pipeline-note>span:first-child{display:flex;align-items:center;gap:10px;color:var(--muted)} .pipeline-table{overflow-x:auto} .pipeline-head,.pipeline-row{display:grid} .pipeline-head{background:rgba(255,255,255,.015);border-bottom:1px solid var(--line)} .pipeline-head span{padding:18px 14px;font-family:var(--font-m);font-size:var(--fs-nano);letter-spacing:.1em;color:#8c9bb0;text-align:center;border-right:1px solid var(--hair)} .pipeline-head span:first-child,.pipeline-head span:nth-child(2){text-align:left} .pipeline-group{height:39px;padding:0 14px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--hair);font:600 var(--fs-nano) var(--font-m);letter-spacing:.13em;text-transform:uppercase;color:var(--mint);background:rgba(92,242,192,.025)} .pipeline-group i{width:5px;height:18px;border-radius:2px;background:currentColor}.pipeline-group.violet{color:var(--violet);background:rgba(139,123,255,.025)}.pipeline-group.blue{color:#4b9cff;background:rgba(75,156,255,.025)}.pipeline-group.indigo{color:#6575ff;background:rgba(101,117,255,.025)} .pipeline-row{min-height:78px;border-bottom:1px solid var(--hair);--pipeline:var(--mint)} .pipeline-row.violet{--pipeline:var(--violet)}.pipeline-row.blue{--pipeline:#4b9cff}.pipeline-row.indigo{--pipeline:#6575ff} .pipeline-row:last-child{border-bottom:0} .pipeline-cell{padding:15px 12px;display:flex;align-items:center;border-right:1px solid var(--hair);position:relative} .pipeline-cell.program{font:500 1rem var(--font-d);letter-spacing:.02em;color:var(--text)} .pipeline-cell.target-class{font:500 var(--fs-micro)/1.4 var(--font-m);letter-spacing:.045em;color:var(--muted)} .stage-cell{justify-content:center;overflow:hidden} .stage-cell::after{content:"";position:absolute;left:0;right:0;top:50%;height:5px;background:var(--hair)} .stage-cell:nth-child(3)::after{left:50%}.stage-cell.active::after{background:var(--pipeline)} /* --stage-pct (from PR #139 / Issue #135: "その段のどこまで来たか" — how far through the current stage a program is, not just which stage) is written inline on the .current cell by detail.js's stagePctStyle(), sourced from programs[].stagePct in site-data.js. Every position below that used to hard-code 50% (the stage's midpoint) now reads var(--stage-pct,50%) instead, so a row without stagePct keeps sitting at dead centre exactly as before, and one with it moves its cutoff, ring and (further down, where the animated variant of these rules lives) sweep endpoint together. The ring's ::before left is clamp()ed (2026-08, Hiroki: chemoresistance's ring at stagePct 2 rendered as a half-circle) because .stage-cell has overflow:hidden — a raw `pct - radius` can go negative (or past the right edge near 100%) and get sliced by the cell's own boundary. The clamp keeps the ring's full box inside its own cell — 2px of breathing room off either edge — for ANY stagePct, not just this row's, so a future value near 0% or 100% can't reproduce the same clip. */ .stage-cell.current::after{right:calc(100% - var(--stage-pct,50%))} .stage-cell.current::before{content:"";position:absolute;left:clamp(2px,calc(var(--stage-pct,50%) - 9px),calc(100% - 18px));top:calc(50% - 9px);width:16px;height:16px;border:2px solid var(--pipeline);border-radius:50%;background:#090b12;z-index:2;box-shadow:0 0 14px color-mix(in srgb,var(--pipeline) 38%,transparent)} .pipeline-target{position:relative;z-index:3;color:var(--pipeline);font:500 var(--fs-micro)/1.3 var(--font-m);letter-spacing:.05em;text-align:center;background:#090b12;padding:5px} .program-status{align-items:flex-start;justify-content:center;flex-direction:column;gap:5px;border-right:0}.program-status strong,.program-status small{font:500 var(--fs-micro)/1.4 var(--font-m);letter-spacing:.025em;color:var(--text)}.program-status small{color:var(--dim)} .pipeline-disclaimer{border-top:1px solid var(--line);padding:18px 24px;color:var(--dim);font-size:var(--fs-sm)} .pipeline-cards{display:none} .advantage-copy>span,.advantage-metric>span,.advantage-metric small,.advantage-detail{font:500 var(--fs-nano)/1.45 var(--font-m);letter-spacing:.15em;color:var(--mint)} .advantage-proofbar{display:grid;grid-template-columns:repeat(3,1fr);margin-bottom:28px;border:1px solid rgba(101,194,194,.18);background:linear-gradient(90deg,rgba(11,27,61,.78),rgba(11,55,102,.62),rgba(8,21,42,.84))}.advantage-proofbar article{display:grid;grid-template-columns:110px 1fr;align-items:baseline;gap:18px;padding:20px 24px;border-right:1px solid rgba(101,194,194,.14)}.advantage-proofbar article:last-child{border-right:0}.advantage-proofbar span{font:500 var(--fs-nano)/1.5 var(--font-m);letter-spacing:.16em;color:#51d4d6;text-transform:uppercase}.advantage-proofbar strong{font:600 clamp(1.05rem,1.8vw,1.45rem)/1.2 var(--font-d);letter-spacing:-.02em}.advantage-proofbar small{font:500 var(--fs-nano) var(--font-m);letter-spacing:.08em;color:#91a1b8} .advantage-stack{border:1px solid var(--line)} .advantage-row{display:grid;grid-template-columns:285px 1fr;min-height:360px;border-bottom:1px solid var(--hair);background:rgba(7,9,15,.76)}.advantage-row:last-child{border-bottom:0} .advantage-metric{padding:34px 30px;border-right:1px solid var(--line);display:flex;flex-direction:column;justify-content:center;background:radial-gradient(circle at 50% 55%,rgba(92,242,192,.1),transparent 54%)} .advantage-metric strong{font:600 clamp(3.6rem,7vw,6.2rem)/.85 var(--font-d);letter-spacing:-.06em;margin:30px 0 18px}.advantage-metric sup{font-size:max(var(--fs-nano),.42em);color:var(--mint)}.advantage-metric small{color:var(--dim)} .advantage-copy{padding:42px 44px;position:relative;overflow:hidden}.advantage-copy h3{font:500 clamp(1.8rem,3.3vw,3rem)/1.05 var(--font-d);margin:32px 0 16px}.advantage-copy>p{color:var(--muted);max-width:70ch} .advantage-compare{margin-top:34px;display:grid;grid-template-columns:125px 1fr;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}.advantage-compare b,.advantage-compare span{padding:13px 12px;font:500 var(--fs-nano)/1.45 var(--font-m);letter-spacing:.08em}.advantage-compare b{color:var(--mint);border-right:1px solid var(--hair)}.advantage-compare b:nth-of-type(2){color:var(--dim);border-top:1px solid var(--hair)}.advantage-compare span:nth-of-type(2){color:var(--dim);border-top:1px solid var(--hair)} .scale-rail{height:72px;margin-top:30px;display:grid;grid-template-columns:repeat(12,1fr);gap:6px;align-items:end;border-bottom:1px solid var(--hair)}.scale-rail i{height:var(--h,35%);background:linear-gradient(180deg,rgba(92,242,192,.62),rgba(92,242,192,.05));border-top:1px solid var(--mint)}.scale-rail i:nth-child(2n){--h:58%}.scale-rail i:nth-child(3n){--h:82%}.scale-rail i:nth-child(5n){--h:100%}.advantage-detail{display:block;margin-top:12px;color:var(--dim)} .chemical-glyphs{height:92px;margin-top:28px;position:relative}.chemical-glyphs::before{content:"";position:absolute;left:0;right:0;top:45px;height:1px;background:linear-gradient(90deg,var(--cyan),var(--mint),var(--violet),transparent)}.chemical-glyphs i{position:absolute;top:28px;left:var(--x);width:34px;height:34px;border:1px solid var(--mint);border-radius:50%;background:#090b12}.chemical-glyphs i:nth-child(1){--x:4%}.chemical-glyphs i:nth-child(2){--x:18%;border-radius:8px;transform:rotate(45deg);border-color:var(--cyan)}.chemical-glyphs i:nth-child(3){--x:33%;width:25px;height:25px;top:33px}.chemical-glyphs i:nth-child(4){--x:48%;border-color:var(--violet)}.chemical-glyphs i:nth-child(5){--x:63%;border-radius:5px}.chemical-glyphs i:nth-child(6){--x:78%;width:24px;height:24px;top:33px;border-color:var(--cyan)}.chemical-glyphs i:nth-child(7){--x:91%;border-color:var(--violet)} .advantage-source{margin-top:18px} html[lang="ja"] #advantage h2 .acc{white-space:nowrap} /* validation */ #validation{padding-bottom:0} .partner-band{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(255,255,255,.012)} .partner-grid{display:grid;grid-template-columns:repeat(7,1fr)} .partner-grid span{min-height:92px;display:grid;place-items:center;border-right:1px solid var(--hair);font:500 var(--fs-micro) var(--font-d);letter-spacing:.08em;color:#727b91;text-align:center;padding:12px} .partner-grid span:first-child{border-left:1px solid var(--hair)} .validation-grid{display:grid;grid-template-columns:1.1fr .9fr;border-left:1px solid var(--line);border-right:1px solid var(--line)} .validation-feature{padding:54px 50px;border-right:1px solid var(--line);min-height:510px;display:flex;flex-direction:column} .article-meta{font-family:var(--font-m);font-size:var(--fs-nano);letter-spacing:.18em;color:var(--mint)} .validation-feature h3{font:500 clamp(1.75rem,3vw,2.65rem)/1.12 var(--font-d);letter-spacing:-.025em;margin:48px 0 20px;max-width:18ch} .validation-feature p{color:var(--muted);max-width:56ch} .text-link{font-family:var(--font-m);font-size:var(--fs-micro);letter-spacing:.16em;color:var(--text);display:inline-flex;gap:10px;align-items:center;transition:color .25s} .text-link:hover{color:var(--mint)} .validation-feature .text-link{margin-top:28px;align-self:flex-start} .validation-signal{display:flex;align-items:center;margin-top:auto;padding-top:48px;color:var(--dim);font-family:var(--font-m);font-size:var(--fs-nano);letter-spacing:.1em} .validation-signal i{height:1px;flex:1;margin:0 9px;background:linear-gradient(90deg,var(--hair),rgba(92,242,192,.45),var(--hair))} .news-stack{display:flex;flex-direction:column} .news-item{min-height:142px;padding:26px 28px;display:grid;grid-template-columns:110px 1fr auto;grid-template-rows:auto 1fr;gap:14px 18px;border-bottom:1px solid var(--hair);transition:background .3s} .news-item:hover{background:rgba(92,242,192,.025)} .news-date,.news-type{font-family:var(--font-m);font-size:var(--fs-nano);letter-spacing:.14em;color:var(--dim)} .news-type{color:var(--mint)} .news-item strong{grid-column:1/3;font:500 1rem/1.4 var(--font-d);max-width:none} .news-arrow{grid-column:3;grid-row:1/3;align-self:center;color:var(--dim)} .all-news{margin:auto 28px 28px} /* company */ .company-vision{display:grid;grid-template-columns:1.2fr .7fr;gap:80px;align-items:end;margin-bottom:58px} .company-grid{display:grid;grid-template-columns:1.2fr .8fr;border:1px solid var(--line)} .leadership{display:flex;flex-direction:column} /* The 65px lead track held a decorative 01/02/03 that has been removed. */ .leader{min-height:140px;padding:30px 34px;display:grid;grid-template-columns:1fr;align-items:center;border-bottom:1px solid var(--hair)} .leader:last-child{border-bottom:0} .leader-index{font-family:var(--font-m);font-size:var(--fs-nano);letter-spacing:.15em;color:var(--mint)} .leader h3,.advisor h3{font:500 1.3rem var(--font-d);margin-bottom:6px} .leader p,.advisor p{color:var(--dim);font-family:var(--font-m);font-size:var(--fs-nano);letter-spacing:.12em;text-transform:uppercase} /* advisers — same typographic system as .leader, laid out five across */ .advisor-block{margin-top:46px} .advisor-block>h3{font:500 clamp(1.35rem,2.2vw,1.8rem)/1.16 var(--font-d);letter-spacing:-.025em;margin:14px 0 26px} .advisor-grid{display:grid;grid-template-columns:repeat(5,1fr);border:1px solid var(--line)} .advisor{min-height:152px;padding:28px 24px;display:flex;flex-direction:column;justify-content:center;gap:8px;border-left:1px solid var(--hair)} .advisor:first-child{border-left:0} .advisor h3{font-size:1.06rem;line-height:1.3;margin-bottom:0} .advisor p{line-height:1.6} .company-facts{border-left:1px solid var(--line);padding:38px;background: radial-gradient(circle at 80% 20%,rgba(92,242,192,.08),transparent 30%),linear-gradient(135deg,rgba(255,255,255,.015),transparent)} .fact-coord{font-family:var(--font-m);font-size:var(--fs-nano);letter-spacing:.18em;color:var(--mint)} .company-facts h3{font:500 1.65rem/1.18 var(--font-d);margin:64px 0 44px} .company-facts dl div{display:flex;justify-content:space-between;gap:20px;padding:15px 0;border-top:1px solid var(--hair)} .company-facts dt,.company-facts dd{font-family:var(--font-m);font-size:var(--fs-nano);letter-spacing:.1em;color:var(--dim)} .company-facts dd{color:var(--muted);text-align:right} .company-facts .fact-address{align-items:flex-start} .company-facts .fact-address dd{max-width:30ch;line-height:1.55} .company-facts address{font:inherit;font-style:normal} /* 採用情報ページとお問い合わせページの facts リスト（.careers-page / .contact-page 限定。about/company/ 側は住所と 長い肩書きが入るので 620 行の flex のままにする）。 flex + space-between では dt も収縮対象の flex item なので、dd の内容量が 多い行では dt が content 幅より狭められる。実測（1280px, main 06d919e）: 「領域」は natural 28.1px に対して 22.8px に潰れて 2 行に折り返し、その行 だけ高さが 56.6→82.2px になっていた。文面の長さの問題ではなく、ラベル列に 固有幅が無いこと自体が原因。 そこで dt を固定幅トラックに移し、dd も左揃えの 1 列にして、全行でラベルと 値の開始位置を揃える。 --facts-label-w は最長ラベルの実測幅（13px / letter-spacing .08em）の切り上げ： EN "EMPLOYMENT TYPE" 133.0px → 144px、和文「待遇・福利厚生」98.3px → 112px。 和文は全角なので 7 字 ×(13+1.04)=98.3px と書体に依らず決まる。 言語差は変数の差し替えだけで表現する。grid-template-columns 自体を html[lang="ja"] で上書きすると (0,3,2) が @media 内の (0,2,2) に勝ち、 スマートフォン幅の縦積みが和文だけ効かなくなる（[[jp-scoped-rule-media-query-trap]]）。 お問い合わせページも同じ facts リストを使うので、ブロックを複製せずセレクタ列に .contact-page を足して同一のラベル列を共有する。最長ラベルは EN "HEAD OFFICE" 79.2px・和文「対応言語」56.2px で、いずれも既存の 144px / 112px に収まる。 */ .careers-page .company-facts dl div, .contact-page .company-facts dl div{--facts-label-w:144px; display:grid;grid-template-columns:var(--facts-label-w) 1fr;align-items:baseline} html[lang="ja"] .careers-page .company-facts dl div, html[lang="ja"] .contact-page .company-facts dl div{--facts-label-w:112px} .careers-page .company-facts dt,.contact-page .company-facts dt{white-space:nowrap} .careers-page .company-facts dd,.contact-page .company-facts dd{text-align:left} /* 座標行を外したぶん、見出しを箱の天に寄せる（38px の padding だけ残す）。 */ .careers-page .company-facts h3{margin-top:0} .company-info-grid{display:grid;grid-template-columns:.72fr 1.28fr;border:1px solid var(--line)} .company-info-intro{padding:54px 48px;border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:flex-start} .company-info-intro h2{font-size:clamp(2.5rem,4.5vw,4.8rem);margin:46px 0 24px} .company-info-intro p{max-width:36ch;color:var(--muted);line-height:1.7} .company-info-intro .text-link{margin-top:auto;padding-top:46px} .company-information-page .company-facts{border-left:0;padding:48px} .company-information-page .company-facts dl{margin-bottom:42px} @media(max-width:800px){ .company-info-grid{grid-template-columns:1fr} .company-info-intro{padding:38px 28px;border-right:0;border-bottom:1px solid var(--line)} .company-info-intro .text-link{margin-top:28px;padding-top:0} .company-information-page .company-facts{padding:32px 28px} } .careers-link{margin-top:42px} /* the officer list grew from three rows to five, so the facts aside is ~300px taller than its own content: anchor the careers link to the foot of the column, the way .funding-card and .publication-action already do, instead of leaving a dead tail. */ #about .company-facts{display:flex;flex-direction:column} #about .company-facts dl{margin-bottom:42px} #about .company-facts>.text-link{margin-top:auto} /* Job postings on careers/ + jp/careers/ (2026-08 migration off Google Sites). The prose (headings, bullet requirements, treatment/conditions) is plain .article-body — see 1100. What lives here is what .article-body does not cover: the diversity pie-chart row, the apply button, and the OPEN POSITIONS carousel both hubs carry. */ .job-apply{margin-top:36px} /* position:static is load-bearing, not tidying: styles.css:156 is a bare `nav{position:fixed;top:0;left:0;right:0;z-index:100}` written for the site header, so this in-page link row — a