.page-header{max-width:1024px;padding:0 24px;margin:0 auto}@media screen and (max-width:768px){.page-header{padding:0 16px}}.page-header__link{display:block;font-size:14px;color:#9a9f9d;text-decoration:none;padding:16px 0;position:relative;padding-left:1rem}.page-header__link:before{content:"";position:absolute;top:calc(50% - 4px);left:.2rem;width:8px;height:8px;border-top:solid 1px #9a9f9d;border-right:solid 1px #9a9f9d;rotate:225deg;transition:border-color .2s cubic-bezier(.47,0,.745,.715)}.page-header__link:hover{color:#2c2c2c}.page-header__link:hover:before{border-color:#2c2c2c}.data-table{margin-top:32px;display:grid;grid-template-columns:96px 1fr;align-items:baseline;row-gap:4px;column-gap:16px;font-size:14px}@media screen and (max-width:768px){.data-table{grid-template-columns:100px 1fr}}.data-table dt{font-weight:700}.data-table dd{margin:0;white-space:pre-wrap;word-wrap:break-word}.btn-wrap{margin-top:64px;text-align:center}.link{color:#1182f1}dl .link:after{content:"";display:inline-block;width:15px;height:15px;margin-left:4px;background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20id='_レイヤー_2'%20data-name='レイヤー%202'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2011.7%2010.5'%3e%3cdefs%3e%3cstyle%3e%20.cls-1%20{%20fill:%20none;%20stroke:%20%23333;%20stroke-miterlimit:%2010;%20}%20%3c/style%3e%3c/defs%3e%3cg%20id='_レイヤー_1-2'%20data-name='レイヤー%201'%3e%3crect%20class='cls-1'%20x='3.5'%20y='.5'%20width='7.7'%20height='6.7'/%3e%3cpolyline%20class='cls-1'%20points='8.2%208.6%208.2%2010%20.5%2010%20.5%203.4%202.1%203.4'/%3e%3c/g%3e%3c/svg%3e");background-repeat:no-repeat;background-size:contain;vertical-align:middle}dd{margin-left:8px}h2{margin-top:16px;font-size:4vw;line-height:1.4}@media screen and (min-width:600px){h2{font-size:18px}}.work{margin-top:88px}@media screen and (max-width:768px){.work{margin-top:56px}}.work-list{margin-top:24px;display:grid;grid-template-columns:repeat(3,1fr);gap:40px}@media screen and (max-width:768px){.work-list{grid-template-columns:repeat(1,1fr);justify-items:center}}.work-title{text-align:left;font-weight:700}.work-section{margin-top:24px}.work-section__title{margin-top:0;font-weight:700}.work-section__text{margin-top:8px;white-space:pre-wrap;line-height:1.8}.work-section--testimonial{padding:24px;border-left:4px solid #174c4f;background-color:#f5f5f5}.eyecatch_img{width:100%;max-width:1024px;height:480px;object-fit:cover;object-position:top;display:block;margin:0 auto;background-color:#d9d9d9}@media screen and (max-width:768px){.eyecatch_img{height:auto;aspect-ratio:3/4;object-fit:cover;object-position:top}}.work-category{margin-top:4px;font-size:12px;display:inline-block;padding:3px 20px;border-radius:99px;color:#174c4f;border:1px solid #174c4f}@media screen and (max-width:768px){.work-item{width:80%}}.work-item__link:hover.work-item__link img{transform:scale(1.05)}.work-item__link img{transition:.3s}.section-title{margin-top:120px;font-size:18px;text-align:left;position:relative;margin-left:-10px;font-family:"Noto Serif JP",serif}.section-title:before{content:"";display:inline-block;height:28px;border-right:solid 3px #174c4f;position:absolute;left:-10px}@media screen and (max-width:768px){.section-title{margin-left:4px}}.section-title span{font-size:12px;margin-left:8px}main{overflow-x:clip;margin-bottom:64px}.work-overview{margin-top:64px;margin-bottom:80px}@media screen and (max-width:768px){.work-overview{margin-top:40px;margin-bottom:40px}}.work-overview__text{max-width:640px;white-space:pre-wrap}.work-full-img{margin-top:64px;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);width:100vw}.work-full-img img{display:block;width:100%;height:auto}@media screen and (max-width:768px){.work-full-img{margin-top:40px}}.work-gallery{margin-top:64px;display:flex;flex-wrap:wrap;justify-content:center;gap:56px 40px;padding:24px 0}@media screen and (max-width:768px){.work-gallery{margin-top:40px;gap:40px}}.browser-frame{width:320px;border-radius:8px;overflow:hidden;background-color:#fff;box-shadow:0 20px 40px #0000002e;transform:perspective(1200px) rotateY(var(--tilt, 0deg));transition:transform .4s cubic-bezier(.19,1,.22,1)}.browser-frame:hover{transform:perspective(1200px) rotateY(0)}@media screen and (max-width:768px){.browser-frame{width:100%;max-width:320px}}.browser-frame__bar{display:flex;align-items:center;gap:6px;padding:10px 12px;background-color:#e5e5e5}.browser-frame__bar span{width:8px;height:8px;border-radius:50%;background-color:#bbb}.browser-frame__body{width:100%;aspect-ratio:4/3;overflow:hidden}.browser-frame__body img{display:block;width:100%;height:100%;object-fit:cover;object-position:top}
