/* Technology page: 遠赤外線の、身近な応用 (#fir-applications). Shared layout for the three figure variants a/b/c. Claude 20261107. */
#fir-science.fir-science .fir-apps{background:#f7f6f2}
#fir-science.fir-science .fir-apps-figure{max-width:1400px;margin:0 auto 54px}
#fir-science.fir-science .fir-apps-figure figcaption{margin:22px auto 0;max-width:1100px;text-align:center;font-size:11px;line-height:1.9;letter-spacing:.03em;color:#7b7871}
#fir-science.fir-science .fir-apps-stage{position:relative;width:100%}
#fir-science.fir-science .fir-apps-stage svg{display:block;width:100%;height:auto;overflow:visible}
#fir-science.fir-science .fir-apps-stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none}
/* a: wavelength bands */
#fir-science.fir-science .fir-apps-band text{font-family:JPHEATLatin,JPHEATJP,JPHEATHan,sans-serif}
/* b: icons */
#fir-science.fir-science .fir-apps-icons{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0 18px;position:relative;padding:110px 0 0}
#fir-science.fir-science .fir-apps-icons>div{position:relative;text-align:center;padding-bottom:18px;border-bottom:1px solid #dcd9d1}
#fir-science.fir-science .fir-apps-icons svg{display:block;width:min(128px,70%);height:auto;margin:0 auto 14px;color:#4f4c47;transition:color .6s}
#fir-science.fir-science .fir-apps-icons svg path,#fir-science.fir-science .fir-apps-icons svg circle,#fir-science.fir-science .fir-apps-icons svg line,#fir-science.fir-science .fir-apps-icons svg rect{fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
#fir-science.fir-science .fir-apps-icons>div.is-on svg{color:#c7401f}
#fir-science.fir-science .fir-apps-icons>div span{display:block;font-size:11px;letter-spacing:.12em;color:#7b7871}
#fir-science.fir-science .fir-apps-icons>div.is-on span{color:#c7401f}
#fir-science.fir-science .fir-apps-icons>div i{position:absolute;left:50%;bottom:-1px;width:100%;height:2px;background:#d6492a;transform:translateX(-50%) scaleX(0);transform-origin:50% 50%}
#fir-science.fir-science .fir-apps-icons>div.is-on i{animation:fir-apps-grow 3s linear forwards}
@keyframes fir-apps-grow{to{transform:translateX(-50%) scaleX(1)}}
html.fir-paused #fir-science.fir-science .fir-apps-icons>div i{animation-play-state:paused}
/* d: slabs on a floor in three.js, HTML labels projected over the canvas */
#fir-science.fir-science .fir-apps-3d{aspect-ratio:1200/460;background:radial-gradient(ellipse at 50% 70%,#fff 0%,#faf9f6 55%,#f2f1ee 100%)}
#fir-science.fir-science .fir-apps-3d canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
#fir-science.fir-science .fir-apps-3d-labels{position:absolute;inset:0;pointer-events:none;overflow:hidden}
#fir-science.fir-science .fir-apps-3d-labels span{position:absolute;white-space:nowrap;font-size:10px;line-height:1;color:#8c8984;letter-spacing:.04em;transition:color .3s}
#fir-science.fir-science .fir-apps-3d-row{font-size:12px!important;letter-spacing:.1em!important;color:#4f4c47!important}
#fir-science.fir-science .fir-apps-3d-row.is-on,#fir-science.fir-science .fir-apps-3d-sub.is-on{color:#c7401f!important}
#fir-science.fir-science .fir-apps-3d-tick{color:#77736e!important;font-size:11px!important}
#fir-science.fir-science .fir-apps-3d-fir{color:#c7401f!important;letter-spacing:.2em!important}
#fir-science.fir-science .fir-apps-3d-peak,#fir-science.fir-science .fir-apps-3d-mark{color:#c7401f!important}
#fir-science.fir-science .fir-apps-3d-mark{font-size:11px!important}
@media(max-width:700px){#fir-science.fir-science .fir-apps-3d{aspect-ratio:1/1}#fir-science.fir-science .fir-apps-3d-sub{display:none}}
/* c: planck chart */
#fir-science.fir-science .fir-apps-chart text{font-family:JPHEATLatin,JPHEATJP,JPHEATHan,sans-serif}
/* list */
#fir-science.fir-science .fir-apps-list{list-style:none;margin:0 auto;padding:0;max-width:1400px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 4vw}
#fir-science.fir-science .fir-apps-list li{position:relative;border-top:1px solid #dcd9d1;padding-top:20px;margin:0}
#fir-science.fir-science .fir-apps-list li>i{position:absolute;left:0;top:-1px;width:100%;height:2px;background:#d6492a;transform:scaleX(0);transform-origin:0 50%;transition:transform .5s}
#fir-science.fir-science .fir-apps-list li.is-on>i{transform:scaleX(1)}
#fir-science.fir-science .fir-apps-tag{display:flex;gap:14px;align-items:baseline;font-size:10px;letter-spacing:.2em;color:#7b7871}
#fir-science.fir-science .fir-apps-tag b{font-weight:400;color:#c7401f}
#fir-science.fir-science .fir-apps-list li.is-on .fir-apps-tag{color:#c7401f}
#fir-science.fir-science .fir-apps-list h3{margin:12px 0 10px;font-size:clamp(16px,1.3vw,20px);line-height:1.7;letter-spacing:.04em;font-weight:400}
#fir-science.fir-science .fir-apps-list h3 small{display:block;font-size:12px;line-height:1.8;letter-spacing:.1em;color:#7b7871}
#fir-science.fir-science .fir-apps-list p{font-size:13px;line-height:2.1;margin:0}
#fir-science.fir-science .fir-apps-note{max-width:1400px;margin:44px auto 0;padding-top:22px;border-top:1px solid #dcd9d1;font-size:11px;line-height:1.9;color:#7b7871}
@media(max-width:1100px){#fir-science.fir-science .fir-apps-icons{grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 18px;padding-top:120px}}
@media(max-width:900px){#fir-science.fir-science .fir-apps-list{grid-template-columns:1fr;gap:26px}}
@media(max-width:600px){#fir-science.fir-science .fir-apps-icons{grid-template-columns:repeat(2,minmax(0,1fr));padding-top:90px}}
/* phones: the two charts keep a readable size and pan sideways inside the figure */
@media(max-width:700px){#fir-science.fir-science .fir-apps-stage:has(>svg){overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:6px}#fir-science.fir-science .fir-apps-stage>svg{min-width:900px}}