body{background:var(--color-bg)}@media screen and (max-width: 1366px){#container{width:95%}}@media screen and (max-width: 1024px){#container{display:block}}@media screen and (max-width: 520px){#container{width:98%}}#portfolio{width:84%;margin:0 auto var(--space-9)}@media screen and (max-width: 1024px){#portfolio{width:95%}}@media screen and (max-width: 520px){#portfolio{width:100%}}#portfolio .works_wrap{display:grid;grid-template-columns:repeat(3, 1fr);gap:var(--space-5)}@media screen and (max-width: 768px){#portfolio .works_wrap{grid-template-columns:repeat(2, 1fr)}}@media screen and (max-width: 520px){#portfolio .works_wrap{grid-template-columns:1fr;gap:var(--space-4)}}#portfolio .works_wrap .work_box{background:var(--color-bg-white);border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--color-border);transition:transform .4s ease,box-shadow .4s ease;cursor:pointer}#portfolio .works_wrap .work_box:hover{transform:translateY(-8px);box-shadow:var(--shadow-xl);border-color:rgba(46,175,213,.2)}#portfolio .works_wrap .work_box:hover .work_thumb img{transform:scale(1.05)}#portfolio .works_wrap .work_box .work_thumb{overflow:hidden;aspect-ratio:16/10}#portfolio .works_wrap .work_box .work_thumb img{width:100%;height:100%;object-fit:cover;vertical-align:bottom;transition:transform .5s ease}#portfolio .works_wrap .work_box .work-info{padding:var(--space-4)}#portfolio .works_wrap .work_box h3{padding:0;text-align:left;margin-bottom:var(--space-1)}#portfolio .works_wrap .work_box h3 span{font-size:1.8rem;font-weight:700;letter-spacing:.04em;color:var(--color-text);line-height:1.3}#portfolio .works_wrap .work_box .jpname{font-size:1.3rem;font-weight:400;color:var(--color-text-light);letter-spacing:.08em;margin-bottom:var(--space-2)}#portfolio .works_wrap .work_box .colormode{display:inline-block;font-size:1.1rem;color:var(--color-primary);background:rgba(46,175,213,.1);padding:2px 10px;border-radius:var(--radius-full);letter-spacing:.06em}.about-body{padding:var(--space-7);width:940px;margin:0 auto;background:var(--color-bg-white);border-radius:var(--radius-lg);border:1px solid var(--color-border);box-shadow:var(--shadow-sm)}@media screen and (max-width: 960px){.about-body{width:95%;padding:var(--space-5)}}@media screen and (max-width: 520px){.about-body{padding:var(--space-4);width:100%}}.about-body h2{font-size:1.8rem;font-weight:700;color:#fff;background:linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);padding:16px 16px 16px 44px;line-height:1;letter-spacing:.15em;margin-bottom:var(--space-4);position:relative;border-radius:var(--radius-md);box-shadow:var(--shadow-primary)}.about-body h2::before{content:"";position:absolute;width:8px;height:8px;background:hsla(0,0%,100%,.6);border-radius:50%;top:50%;transform:translateY(-50%);left:18px;box-shadow:0 0 0 3px hsla(0,0%,100%,.3)}.about-body h3{margin-bottom:var(--space-3)}.about-body h3 span{font-size:1.6rem;padding:5px 14px;border:1.5px solid var(--color-primary);color:var(--color-primary);border-radius:var(--radius-full);display:inline-block;font-weight:600;letter-spacing:.08em}.about-body p{font-size:1.5rem;line-height:2;letter-spacing:.08em;color:var(--color-text-mid);margin-bottom:var(--space-5)}@media screen and (max-width: 520px){.about-body p{font-size:1.55rem}.about-body p br{display:none}}.about-body dl{padding:var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-md);margin-bottom:var(--space-4);background:var(--color-bg-pale)}.about-body dl dt{font-size:1.35rem;font-weight:700;letter-spacing:.12em;color:var(--color-text);margin-bottom:var(--space-1)}.about-body dl dd{font-size:1.35rem;line-height:2;letter-spacing:.1em;color:var(--color-text-light);padding:var(--space-2) var(--space-3)}