@charset "UTF-8";@media screen and (min-width: 768px){.headline{display:flex;justify-content:left;padding:112px 0 0 20px;margin-bottom:140px}.headline h1{font-size:44px!important;font-weight:500!important;line-height:160%!important;letter-spacing:2.64px!important;margin-bottom:0}footer{position:relative;z-index:11}main{max-width:1440px;width:100%;z-index:1;background:#fff;margin:88px auto 0;font-family:-apple-system,BlinkMacSystemFont,Hiragino Kaku Gothic ProN,Hiragino Sans,Yu Gothic Medium,Yu Gothic,sans-serif;font-weight:400}main br.sm{display:none}main .sel_list{position:relative;width:100%;min-height:120px;margin-bottom:63px}.sel_list #service_frame{padding:12px 0;background-color:#fffffff2}.sel_list #service_frame.fixed{position:fixed;bottom:0;width:100%;z-index:10;border-top:1px solid #cfd8dc}.sel_list #service_frame.fixed ul:first-child{display:none}.sel_list #service_frame.fixed ul:last-child{display:flex}.sel_list #service_frame ul.service_list{width:calc(100vw - 96px);margin:0 auto;display:flex;align-items:center;justify-content:center}.sel_list #service_frame ul.service_list:last-child{display:none}.sel_list #service_frame ul.service_list li{width:274px;height:46px;border:1px solid #bec0c1;display:flex;align-items:center;justify-content:center;margin-right:20px;cursor:pointer;border-radius:4px;color:#222;font-size:14px;font-family:-apple-system,BlinkMacSystemFont,Hiragino Kaku Gothic ProN,Hiragino Sans,Yu Gothic Medium,Yu Gothic,sans-serif;font-weight:600}.sel_list #service_frame ul.service_list li:last-child{margin-right:0}.sel_list #service_frame ul.service_list li:hover,.sel_list #service_frame ul.service_list li.current{background-color:#d7d8d9}.sel_list #service_frame ul.inquiry_list{width:calc(100vw - 96px);margin:0 auto;display:flex;align-items:center;justify-content:center;display:none}.sel_list #service_frame ul.inquiry_list li{width:274px;height:46px;margin-right:20px}.sel_list #service_frame ul.inquiry_list li a{width:274px;height:46px;display:flex;align-items:center;justify-content:center;border:1px solid #bec0c1;cursor:pointer;border-radius:4px;color:#222;font-size:14px;font-family:-apple-system,BlinkMacSystemFont,Hiragino Kaku Gothic ProN,Hiragino Sans,Yu Gothic Medium,Yu Gothic,sans-serif;font-weight:600;letter-spacing:.27em}.sel_list #service_frame ul.inquiry_list li a:last-child{margin-right:0}.sel_list #service_frame ul.inquiry_list li a:hover,.sel_list #service_frame ul.inquiry_list li a.current{background-color:#d7d8d9;opacity:1}.commonList_N li{border-top:none}.howl_link{width:276px;height:50px;margin:-63px auto 0;padding:12px 0;border:1px solid #bec0c1;border-radius:4px}.howl_link a{display:block;text-align:center;font-size:14px;color:#222;letter-spacing:1px}.howl_link a span{display:block;cursor:pointer;width:110px;height:27px;background:url(../../img/works/howl_rogo@2x.png) no-repeat;background-size:cover;margin:0 auto 7px;position:relative;right:11px}.howl_link a span:after{content:"";width:13px;height:13px;display:block;position:absolute;right:-23px;top:7px;background:url(../../img/works/icn_newwin@2x.png) no-repeat;background-size:cover}.app_list{max-width:1200px;margin:0 auto 40px;display:flex;flex-wrap:wrap;padding:0 48px}.app_list li{width:calc(33.3333333333% - .1px);max-width:400px;display:flex;margin-right:0;margin-bottom:20px}.app_list li:nth-child(2n){margin-right:0}.app_list li a{display:block;width:100%}.app_list li a .thmb{text-align:center;width:100%;margin-bottom:0;display:flex;align-items:center;justify-content:center;height:calc(33.3333333333vw - .1px);position:relative;max-height:400px}.app_list li a .thmb.wide,.app_list li a .thmb.tall{height:400px;min-height:inherit}.app_list li a .thmb.tall img:only-child{height:335px;width:auto}.app_list .hidden_img{opacity:0;transform:translate3d(0,50px,0)}.app_list .feedin_img{transition-delay:3s;-ms-transition-delay:1s;opacity:1;transform:translateZ(0);-webkit-transform:translate3d(0,0,0);transition:transform .5s,opacity .5s;transition:-webkit-transform .5s,opacity .5s}.app_list li a img{height:100%;z-index:2;max-width:400px;max-height:400px;top:0;position:absolute}.app_list li a img:first-child{z-index:1}.app_list li a img:only-child{position:relative;width:85%;height:auto}.app_list li a .ex_wide img,.app_list li a .wide img{height:auto;width:85%}.app_list li a .all img{width:100%}.app_list li a div h3{font-size:26px;color:#464849;text-align:center;margin-bottom:25px;font-family:-apple-system,BlinkMacSystemFont,Hiragino Kaku Gothic ProN,Hiragino Sans,Yu Gothic Medium,Yu Gothic,sans-serif;font-weight:600;letter-spacing:.05em}.app_list li a div p{font-size:15px;color:#222;text-align:center;margin-bottom:16px;font-family:-apple-system,BlinkMacSystemFont,Hiragino Kaku Gothic ProN,Hiragino Sans,Yu Gothic Medium,Yu Gothic,sans-serif;font-weight:400;letter-spacing:.05em}.works-list-container{margin-bottom:200px}main .contact{z-index:11;margin:0 auto;height:394px;background-size:cover;position:relative;background-position:center;background-color:#e4e9eb}main .contact p{text-align:center;font-size:28px;color:#222;letter-spacing:.15em;position:relative;z-index:2;backface-visibility:hidden;font-family:-apple-system,BlinkMacSystemFont,Hiragino Kaku Gothic ProN,Hiragino Sans,Yu Gothic Medium,Yu Gothic,sans-serif;font-weight:600;margin-bottom:64px;line-height:150%}main .contact>div{display:flex;justify-content:center;align-items:center;flex-direction:column;height:100%}main .contact>div>div{z-index:0;justify-content:center;align-items:center;display:flex}main .contact a{position:relative;height:48px;width:274px;font-size:14px;font-family:-apple-system,BlinkMacSystemFont,Hiragino Kaku Gothic ProN,Hiragino Sans,Yu Gothic Medium,Yu Gothic,sans-serif;font-weight:600;letter-spacing:3.78px;transition:background-color .5s cubic-bezier(.165,.84,.44,1);color:#222;border:1px solid #a6adb0}}@media screen and (min-width: 768px) and (max-width: 1024px){.sel_list ul{width:auto}.sel_list ul li{width:200px}.app_list{width:calc(100vw - 96px);margin:0 auto;padding:0;justify-content:space-between}.app_list li{width:calc(50% - 16px);margin-bottom:20px;max-width:448px}.app_list li:nth-child(2n){margin-right:0}.app_list li a{width:100%}.app_list li a .thmb{width:100%;height:calc((100vw - 128px)/2);max-height:448px;max-width:448px;margin:0 auto}.app_list li a .thmb.wide,.app_list li a .thmb.ex_wide{height:calc((100vw - 128px)/2);min-height:inherit}.app_list li a .thmb.tall{height:300px;min-height:inherit}.app_list li a .thmb.tall img:only-child{height:250px;width:auto}.app_list li a img{width:100%;height:inherit}.app_list li a .ex_wide img,.app_list li a .wide img{width:100%;height:auto}.app_list li a .all img{width:100%}}@media screen and (max-width: 767.9px){.headline{display:flex;justify-content:left;margin-bottom:62px;padding-top:48px}.headline h1{font-size:32px;font-weight:500;line-height:170%;letter-spacing:2.56px;margin-bottom:0}h1,h2,h3,h4,a,span,div,td,dd,p{max-height:999999px}.mobile,.mobile #container{min-height:inherit}footer{position:relative;z-index:11}main{font-family:-apple-system,BlinkMacSystemFont,Hiragino Kaku Gothic ProN,Hiragino Sans,Yu Gothic Medium,Yu Gothic,sans-serif;font-weight:400}body{background:#fff}.navi{display:none}body.mobile{-webkit-text-size-adjust:100%}main .white_area{background:#fff}main .gray_area{background:#f3f2f1}.sel_list #service_frame{padding:9px 0;background-color:#fffffff2}.sel_list #service_frame.fixed{position:fixed;bottom:0;width:100%;z-index:10;border-top:1px solid #cfd8dc}.sel_list #service_frame.fixed ul:first-child{display:none}.sel_list #service_frame.fixed ul:last-child{display:flex}.sel_list #service_frame ul.service_list{display:flex;align-items:center;justify-content:center;flex-wrap:wrap}.sel_list #service_frame ul.service_list li{width:100px;height:40px;line-height:40px;text-align:center;border:1px solid #bec0c1;margin-right:14px;cursor:pointer;border-radius:4px;font-family:-apple-system,BlinkMacSystemFont,Hiragino Kaku Gothic ProN,Hiragino Sans,Yu Gothic Medium,Yu Gothic,sans-serif;font-weight:400}.sel_list #service_frame ul.service_list li:last-child{margin-right:0;line-height:18px;padding-top:3px;height:38px}.sel_list #service_frame ul.service_list li:last-child{margin-right:0}.sel_list #service_frame ul.service_list li:hover,.sel_list #service_frame ul.service_list li.current{background-color:#d7d8d9}.sel_list #service_frame ul.inquiry_list{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;display:none}.sel_list #service_frame ul.inquiry_list li{width:calc(43.6vw - 6px);height:40px;margin-right:12px}.sel_list #service_frame ul.inquiry_list li:last-child{margin-right:0}.sel_list #service_frame ul.inquiry_list li a{width:calc(43.6vw - 6px);height:40px;line-height:40px;display:flex;align-items:center;justify-content:center;text-align:center;border:1px solid #cfd8dc;cursor:pointer;border-radius:4px;font-family:-apple-system,BlinkMacSystemFont,Hiragino Kaku Gothic ProN,Hiragino Sans,Yu Gothic Medium,Yu Gothic,sans-serif;font-weight:600;letter-spacing:.05em;font-size:13px}.sel_list #service_frame ul.inquiry_list li a:last-child{margin-right:0}.sel_list #service_frame ul.inquiry_list li a:hover,.sel_list #service_frame ul.inquiry_list li a.current{background-color:#d7d8d9;opacity:1}.howl_link{width:247px;height:50px;margin:30px auto 0;padding:6px 0;border:1px solid #bec0c1;border-radius:4px}.howl_link a{display:block;text-align:center;font-size:14px;color:#222;letter-spacing:1px}.howl_link a span{display:block;cursor:pointer;width:110px;height:27px;background:url(../../img/works/howl_rogo@2x.png) no-repeat;background-size:cover;margin:0 auto 7px;position:relative;right:11px}.howl_link a span:after{content:"";width:13px;height:13px;display:block;position:absolute;right:-23px;top:7px;background:url(../../img/works/icn_newwin@2x.png) no-repeat;background-size:cover}.app_list{margin:0 auto;width:100%;display:flex;align-items:center;justify-content:center;text-align:center;flex-direction:column}}@media screen and (max-width: 767.9px) and (max-width: 580px){.app_list{padding:0 6.4vw;box-sizing:border-box}}@media screen and (max-width: 767.9px){.app_list li{width:100%;max-width:565.5px;position:relative;margin-bottom:40px}.app_list li img{z-index:2}.app_list li img:first-child{z-index:1}.app_list li a{display:block;width:100%}.app_list li a .thmb{position:relative;width:100%;height:87.2vw;max-width:565.5px;max-height:565.5px;display:flex;align-items:center;justify-content:center;flex-direction:column}.app_list li a .thmb.wide{margin-bottom:-9.894vw;margin-top:-9.894vw}.app_list li a .thmb.tall{margin-bottom:24px}.app_list li a .thmb.ex_wide{margin-top:-13.09vw;margin-bottom:-13.09vw}.app_list li a .thmb.tall img:only-child{width:auto;height:87.2vw}.app_list li a>div{text-align:center}.app_list .hidden_img{opacity:0;transform:translate3d(0,50px,0)}.app_list .feedin_img{transition-delay:3s;-ms-transition-delay:1s;opacity:1;transform:translateZ(0);-webkit-transform:translate3d(0,0,0);transition:transform .5s,opacity .5s;transition:-webkit-transform .5s,opacity .5s}.app_list li a img{position:absolute;top:0;left:0;width:100%;height:100%;max-width:565.5px;max-height:565.5px;display:flex;align-items:center;flex-direction:column;justify-content:center}.app_list li a img:only-child{position:relative;width:85%;height:auto}.app_list li a div h3{font-size:36px;font-family:-apple-system,BlinkMacSystemFont,Hiragino Kaku Gothic ProN,Hiragino Sans,Yu Gothic Medium,Yu Gothic,sans-serif;font-weight:600;line-height:1.48em;letter-spacing:.02em;color:#222}.app_list li a div p{font-size:20px;font-family:-apple-system,BlinkMacSystemFont,Hiragino Kaku Gothic ProN,Hiragino Sans,Yu Gothic Medium,Yu Gothic,sans-serif;font-weight:400;line-height:1.8em;letter-spacing:.15em;color:#222}main .writings{width:100%;margin:0 auto 40px;padding:0 0 72%;background:url(../../img/works/writings_sp.jpg) no-repeat bottom center;background-size:contain}.writings h3{font-size:19px;color:#303233;text-align:center;padding-top:40px;margin:0 20px 20px;border-top:1px solid #efefef}.writings p{font-size:13px;color:#303233;line-height:160%;margin:0 20px 20px}.writings .link{margin-bottom:0;text-align:center}.writings .link a{color:#a0a2a2;text-decoration:underline}main .contact{margin:0 auto;background-size:cover;background-position:center;position:relative;padding:80px 20px;z-index:11;background-color:#e4e9eb}main .contact p{text-align:center;font-size:20px;color:#222;letter-spacing:.15em;position:relative;z-index:2;backface-visibility:hidden;font-family:-apple-system,BlinkMacSystemFont,Hiragino Kaku Gothic ProN,Hiragino Sans,Yu Gothic Medium,Yu Gothic,sans-serif;font-weight:600;margin-bottom:40px;line-height:150%}main .contact>div{display:flex;justify-content:center;align-items:center;flex-direction:column;height:100%}main .contact>div>div{z-index:0;display:flex;align-items:center;justify-content:center;flex-wrap:wrap}main .contact a{background:none;z-index:2;position:relative;width:calc(43.6vw - 6px);height:40px;margin-right:12px;-webkit-tap-highlight-color:rgba(0,0,0,.18)!important;letter-spacing:.05em;font-size:13px;font-family:-apple-system,BlinkMacSystemFont,Hiragino Kaku Gothic ProN,Hiragino Sans,Yu Gothic Medium,Yu Gothic,sans-serif;font-weight:600;color:#222;margin-bottom:0;border:1px solid #a6adb0;width:224px}main .contact a:last-child{margin-right:0}main .more{border-radius:4px;text-align:center;padding:14.5px 0;font-size:13px;color:#fff;margin:0 20px 40px;cursor:pointer;background-color:#cacaca;transition:opacity .1s}.more:hover{opacity:.85}}@media screen and (max-width: 767.9px) and (max-width: 579px){.app_list li a div h3{font-size:6.5vw;line-height:1.8em;letter-spacing:.05em}.app_list li a div p{font-size:3.5vw}}@media screen and (min-width: 768px){.filter-container{display:flex;flex-direction:column;gap:20px;padding:0 20px;margin-bottom:60px}.filter-list{display:flex;gap:14px}.category-list-wrap{display:flex;flex-wrap:wrap;gap:14px;padding:0;margin:0;list-style:none}.filter-large{cursor:pointer;display:flex;width:auto;height:auto;padding:12px 24px;justify-content:center;align-items:center;border-radius:12px;background:#fafafb;color:#1c1c1e;font-size:16px;font-style:normal;font-weight:600;line-height:170%;letter-spacing:.64px;user-select:none}.filter-large.is-active{background:#1c1c1e;color:#fff}.filter-large:hover{background-color:#c6c6c8;color:#fff}.filter-small{cursor:pointer;display:flex;gap:6px;width:auto;height:auto;padding:8px 16px;justify-content:center;align-items:center;border-radius:12px;background:#fafafb;color:#1c1c1e;font-size:14px;font-style:normal;font-weight:600;line-height:170%;letter-spacing:.84px;display:none;white-space:nowrap;user-select:none}.filter-small span{display:flex;padding:0 12px;justify-content:center;align-items:center;border-radius:100px;background-color:#00000014;font-size:12px;font-weight:400;line-height:160%;letter-spacing:.72px}.filter-small.is-active{background:#1c1c1e;color:#fafafb}.filter-small.is-active span{display:flex;padding:0 12px;justify-content:center;align-items:center;border-radius:100px;background-color:#ffffff24;font-size:12px;font-weight:400;line-height:160%;letter-spacing:.72px}.filter-small:hover{background-color:#c6c6c8;color:#fff}.filter-small.is-show{display:flex}}@media screen and (max-width: 767.9px){.filter-container{display:flex;flex-direction:column;gap:16px;padding:0 20px;margin-bottom:48px}.filter-list{display:flex;gap:10px}.category-list{display:flex;gap:10px;overflow:auto;scrollbar-width:none}.category-scroll-wrapper .scroll-arrow{display:none}.filter-large{cursor:pointer;display:flex;width:auto;height:auto;padding:10px 20px;justify-content:center;align-items:center;border-radius:12px;background:#fafafb;color:#1c1c1e;font-size:16px;font-style:normal;font-weight:600;line-height:150%;letter-spacing:.64px;user-select:none}.filter-large.is-active{background:#1c1c1e;color:#fff}.filter-large:hover{background-color:#c6c6c8;color:#fff}.filter-small{cursor:pointer;display:flex;gap:4px;width:auto;height:auto;padding:6px 12px;justify-content:center;align-items:center;border-radius:10px;background:#fafafb;color:#1c1c1e;font-size:12px;font-style:normal;font-weight:600;line-height:normal;letter-spacing:.72px;display:none;white-space:nowrap;user-select:none}.filter-small span{display:flex;padding:0 8px;justify-content:center;align-items:center;border-radius:100px;background-color:#00000014;font-size:11px;font-weight:400;line-height:170%;letter-spacing:.44px}.filter-small:hover{background-color:#c6c6c8;color:#fff}.filter-small.is-active{background:#1c1c1e;color:#fafafb}.filter-small.is-active span{display:flex;padding:0 8px;justify-content:center;align-items:center;border-radius:100px;background-color:#ffffff24;font-size:11px;font-weight:400;line-height:170%;letter-spacing:.44px}.filter-small.is-active:hover{background-color:#c6c6c8;color:#fff}.filter-small.is-show{display:flex}}@media screen and (min-width: 768px){.work-list{display:grid;grid-template-columns:1fr 1fr;align-items:baseline;justify-content:center;gap:40px;padding:0 20px}.work-list>li{width:100%;box-sizing:border-box}.work-item{display:flex;flex-direction:column;align-items:start;justify-content:center;width:100%;height:100%}.work-item .link{display:flex;flex-direction:column;width:100%;height:auto}.work-item .link .thumbnail{display:flex;align-items:center;justify-content:center;width:100%;height:100%;margin-bottom:16px;object-fit:contain;max-height:453px}.work-item .link .thumbnail.fbook,.work-item .link .thumbnail.phone_8,.work-item .link .thumbnail.phone_x,.work-item .link .thumbnail.pad_h,.work-item .link .thumbnail.pad_v{display:flex;position:relative;align-items:center;justify-content:center;width:100%;height:100%;background-color:#fafafb}.work-item .link .thumbnail.fbook img,.work-item .link .thumbnail.phone_8 img,.work-item .link .thumbnail.phone_x img,.work-item .link .thumbnail.pad_h img,.work-item .link .thumbnail.pad_v img{width:100%;height:100%;position:absolute}.work-item .link .thumbnail.fbook .device-img,.work-item .link .thumbnail.phone_8 .device-img,.work-item .link .thumbnail.phone_x .device-img,.work-item .link .thumbnail.pad_h .device-img,.work-item .link .thumbnail.pad_v .device-img{width:100%;height:100%;position:relative}.work-item .link .thumbnail img{width:100%;height:100%;object-fit:contain}.work-item .link .client-name{color:#848489;font-size:14px;font-weight:400;line-height:170%;margin-bottom:6px}.work-item .link .title{font-size:24px;font-style:normal;font-weight:400;line-height:160%;letter-spacing:1.44px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-synthesis:none}.work-item .link .description{color:#848489;font-size:14px;font-weight:400;line-height:170%;letter-spacing:.56px}}@media screen and (max-width: 767.9px){.work-list{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:72px}.work-list>li{width:calc(100% - 40px);box-sizing:border-box}.work-list>li:last-child{margin-bottom:72px}.work-item{display:flex;flex-direction:column;align-items:left;justify-content:center;width:100%;height:100%}.work-item .link{display:flex;flex-direction:column;width:100%;height:100%}.work-item .link .thumbnail{display:flex;align-items:center;justify-content:center;width:100%;height:calc((100vw - 40px)*.6666);margin-bottom:12px;object-fit:contain}.work-item .link .thumbnail.fbook,.work-item .link .thumbnail.phone_8,.work-item .link .thumbnail.phone_x,.work-item .link .thumbnail.pad_h,.work-item .link .thumbnail.pad_v{display:flex;position:relative;align-items:center;justify-content:center;width:auto;background-color:#fafafb}.work-item .link .thumbnail.fbook .device-img,.work-item .link .thumbnail.phone_8 .device-img,.work-item .link .thumbnail.phone_x .device-img,.work-item .link .thumbnail.pad_h .device-img,.work-item .link .thumbnail.pad_v .device-img{position:relative;width:100%;height:100%;object-fit:contain}.work-item .link .thumbnail.fbook img,.work-item .link .thumbnail.phone_8 img,.work-item .link .thumbnail.phone_x img,.work-item .link .thumbnail.pad_h img,.work-item .link .thumbnail.pad_v img{position:absolute;width:100%;height:100%;object-fit:contain}.work-item .link .thumbnail img{width:100%;height:100%;object-fit:contain}.work-item .link .client-name{color:#848489;font-size:12px;font-weight:400;line-height:170%;margin-bottom:4px}.work-item .link .title{font-size:20px;font-weight:500;line-height:150%;letter-spacing:1.6px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-synthesis:none;-webkit-text-stroke:.3px transparent}.work-item .link .description{color:#848489;font-size:12px;font-style:normal;font-weight:400;line-height:170%;letter-spacing:.48px}}
