.insole-page-wrapper{display:flex;flex-direction:column;justify-content:center;margin-bottom:120px}.insole-page-wrapper .insole-page-container{width:100%;display:flex;flex-direction:column;justify-content:center;gap:120px}@media(max-width:768px){.insole-page-wrapper .insole-page-container{margin-top:-20dvh}}.insole-page-top{width:100%;height:70dvh;display:flex;justify-content:center;align-items:center;position:relative;overflow:hidden}@media(max-width:1200px){.insole-page-top{height:80dvh}}@media(max-width:380px){.insole-page-top{margin-bottom:-30dvh}}.insole-page-top h2{font-size:10rem;display:inline-block;text-shadow:0 10px 10px rgba(51,51,51,.25);position:relative;z-index:1;margin-top:-50dvh;animation:slide-fade-in .5s ease-in-out}.insole-page-top h2,.insole-page-top h2:after{background:linear-gradient(90deg,#14243F,#ce6b0f);-webkit-background-clip:text;-webkit-text-fill-color:rgba(0,0,0,0)}.insole-page-top h2:after{content:"INSOLE";position:absolute;top:60%;left:0;right:0;width:100%;overflow:hidden;color:#333;transform:scaleY(-1);opacity:0;-webkit-clip-path:polygon(0 0,100% 0,100% 100%,0 100%);clip-path:polygon(0 0,100% 0,100% 100%,0 100%);-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,0),rgb(0,0,0));mask-image:linear-gradient(180deg,rgba(0,0,0,0),rgb(0,0,0));animation:slide-fade-in-shadow .3s ease-in-out .5s forwards}@media(max-width:1200px){.insole-page-top h2{margin-top:-35dvh}}@media(max-width:576px){.insole-page-top h2{margin-top:-35dvh;font-size:5rem}}@media(max-width:380px){.insole-page-top h2{margin-top:-55dvh}}.insole-page-top .gradation-box{position:absolute;width:100%;height:80%;bottom:0;left:0;opacity:.5;background:linear-gradient(0deg,rgba(0,0,0,0) 90%,rgba(0,0,0,.3));box-shadow:0 -5px 25px rgba(51,51,51,.25)}@media(max-width:1200px){.insole-page-top .gradation-box{height:70%}}@media(max-width:380px){.insole-page-top .gradation-box{height:80%}}.insole-section{width:100%;height:100dvh;display:flex}@media(max-width:992px){.insole-section{height:-moz-fit-content;height:fit-content;padding:30px 0}}.insole-section .insole-page-text{position:relative;z-index:1;height:100%;width:95%;max-width:1200px;margin:0 auto;display:flex;flex-direction:column;justify-content:center}.insole-section .insole-page-text .insole-section-titie{font-size:3.5rem;font-weight:600}@media(max-width:1200px){.insole-section .insole-page-text .insole-section-titie{font-size:2.8rem}}@media(max-width:992px){.insole-section .insole-page-text .insole-section-titie{font-size:2.5rem}}@media(max-width:380px){.insole-section .insole-page-text .insole-section-titie{font-size:2rem}}.insole-section .insole-page-text h2{font-size:1.5rem;font-weight:700;color:#14243f;margin-left:8px}.insole-section .insole-page-text .under-text{font-size:2rem;font-weight:600;background:linear-gradient(90deg,#14243F,#ce6b0f);-webkit-background-clip:text;-webkit-text-fill-color:rgba(0,0,0,0);width:-moz-fit-content;width:fit-content;margin:24px 0 40px}@media(max-width:1200px){.insole-section .insole-page-text .under-text{font-size:1.5rem}}@media(max-width:768px){.insole-section .insole-page-text .under-text{font-size:1.2rem;margin:16px 0 40px}}.insole-section .insole-page-text .insole-page-text-detail{font-size:16px;line-height:180%}.concept{position:relative}@media(max-width:992px){.concept{flex-direction:column-reverse;justify-content:center;gap:60px}}.concept .insole-page-text{padding-right:30%}@media(max-width:1200px){.concept .insole-page-text{padding-right:40%}}@media(max-width:992px){.concept .insole-page-text{padding-right:0}}.concept .insole-page-backgronud{position:absolute;top:0;right:0;width:40%;height:100%}.concept .insole-page-backgronud .concept-image{width:100%;height:100%;object-fit:cover}@media(max-width:992px){.concept .insole-page-backgronud .concept-image{display:none}.concept .insole-page-backgronud{position:relative;width:100%;height:50dvh;background-size:cover;-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,0) 0,rgb(0,0,0) 25%,rgb(0,0,0) 50%,rgb(0,0,0) 75%,rgba(0,0,0,0));mask-image:linear-gradient(180deg,rgba(0,0,0,0) 0,rgb(0,0,0) 25%,rgb(0,0,0) 50%,rgb(0,0,0) 75%,rgba(0,0,0,0));-webkit-mask-size:cover;mask-size:cover;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;background-image:url(/_next/static/media/standing-man.0416afd3.webp)}}.technology{position:relative;overflow:visible}.technology .insole-page-backgronud{position:absolute;bottom:0;right:0;width:100%;height:-moz-fit-content;height:fit-content;z-index:-1}@media(max-width:576px){.technology .insole-page-backgronud{top:0}}.technology .insole-page-backgronud .concept-image{width:100%;height:100%;object-fit:contain;opacity:.5}.structure{position:relative}.structure .insole-page-text{padding-right:30%}@media(max-width:576px){.structure .insole-page-text{padding-right:0}}.structure .insole-structure-image{position:absolute;top:0;right:0;width:45%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}@media(max-width:1200px){.structure .insole-structure-image{transform:translateX(15%)}}@media(max-width:576px){.structure .insole-structure-image{flex-direction:row;width:100%;height:100svh;transform:translateX(0);top:5%}}@media(max-width:380px){.structure .insole-structure-image{flex-direction:row;width:100%;height:100svh;transform:translateX(-10%);top:3%}}.structure .insole-structure-image .cover-image{width:100%;height:25%;object-fit:contain;transition:all .3s ease-in-out;position:relative;pointer-events:none}.structure .insole-structure-image .cover-image.active{transform:scale(1.3)}.structure .insole-structure-image .cover-image.active:first-child{transform:translateX(0) translateY(0) scale(1.3)}@media(max-width:576px){.structure .insole-structure-image .cover-image.active:first-child{transform:translateX(-50%) translateY(0) scale(1.3)}}@media(max-width:380px){.structure .insole-structure-image .cover-image.active:first-child{transform:translateX(-30%) translateY(0) scale(1.3)}}.structure .insole-structure-image .cover-image.active:nth-child(4){transform:translateX(0) translateY(0) scale(1.3)}@media(max-width:576px){.structure .insole-structure-image .cover-image.active:nth-child(4){transform:translateX(-50%) translateY(0) scale(1.3)}}@media(max-width:380px){.structure .insole-structure-image .cover-image.active:nth-child(4){transform:translateX(-30%) translateY(0) scale(1.3)}}@media(max-width:576px){.structure .insole-structure-image .cover-image.active{transform:translateX(-50%) scale(1.3)}}@media(max-width:380px){.structure .insole-structure-image .cover-image.active{transform:translateX(-30%) scale(1.3)}}.structure .insole-structure-image .cover-image:not(.active){opacity:.5;z-index:-1}.structure .insole-structure-image .cover-image:not(:first-child){margin-top:-10%}@media(max-width:576px){.structure .insole-structure-image .cover-image:not(:first-child){margin-top:0}.structure .insole-structure-image .cover-image{height:90%;width:60%;position:absolute;top:0;left:50%;transform:translateX(-50%)}}@media(max-width:380px){.structure .insole-structure-image .cover-image{height:100%;width:55%;position:absolute;top:5%;left:50%;transform:translateX(-30%)}}@media(max-width:576px){.structure{flex-direction:column}}.top-cover{position:relative;gap:60px}.top-cover .top-cover-container{width:95%;margin:0 auto;max-width:1200px;display:flex}.top-cover .insole-page-text{position:relative;z-index:1;width:60%}.top-cover .insole-page-text h3{margin:24px 0}@media(max-width:576px){.top-cover .insole-page-text h3{margin:16px 0 40px}.top-cover .insole-page-text{width:100%}}.top-cover .insole-top-cover-image{width:40%;height:100%;display:flex;justify-content:center;align-items:center;padding:2%;position:relative;z-index:1}.top-cover .insole-top-cover-image img{position:absolute;top:50%;left:0;transform:translateY(-50%);width:100%;opacity:0;transition:all .3s ease-in-out}.top-cover .insole-top-cover-image img.active{opacity:1}@media(max-width:576px){.top-cover .insole-top-cover-image{display:none}}.top-cover .insole-top-cover-background{position:absolute;top:0;right:0;width:45%;height:100%;z-index:0;opacity:.3}@media(max-width:576px){.top-cover .insole-top-cover-background{width:60%;height:60%;top:inherit;bottom:0}}.top-cover .insole-top-cover-background .top-cover-background{position:relative;width:100%;height:100%}.top-cover .insole-top-cover-background .top-cover-background img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;opacity:0}.top-cover .insole-top-cover-background .top-cover-background img.active{opacity:1}.navigation-button{width:10dvw;height:-moz-fit-content;height:fit-content;position:fixed;bottom:0;right:0;z-index:3;display:flex;flex-direction:column;justify-content:center;gap:16px;padding:16px 24px;border-radius:16px 0 0 0;background-color:#14243f}@media(max-width:576px){.navigation-button{display:none}}.navigation-button button{background-color:inherit;border:none;font-size:16px;color:#333;font-family:Noto Sans JP,sans-serif;color:#fff;display:flex;justify-content:flex-start;align-items:center;cursor:pointer}.navigation-button button.active{border-bottom:2px solid #fff;font-weight:600}.navigation-button button:hover{color:#81c7fb}.tabs-container .tabs{display:flex;flex-wrap:wrap}@media(max-width:576px){.tabs-container .tabs{position:relative;z-index:999;width:100%;display:grid;grid-template-columns:repeat(2,auto)}.tabs-container .tabs.structure-tub{margin-top:40svh}}.tabs-container .tabs .tab-button{border:1px solid #14243f;position:relative;padding:8px 16px;background-color:#81c7fb;border-radius:0 20px 0 0;box-shadow:5px 5px 10px rgba(51,51,51,.5);cursor:pointer;font-size:16px;color:#14243f;transition:all .3s ease-in-out}.tabs-container .tabs .tab-button svg{margin-left:16px;transform:rotate(90deg)}.tabs-container .tabs .tab-button:hover{background-color:rgb(6.9846153846,129.2153846154,220.0153846154);color:#fff}.tabs-container .tabs .tab-button.active{background:#14243f;color:#fff}.tabs-container .tabs .tab-button.active svg{transform:rotate(-90deg)}.tabs-container .tabs .tab-button:not(:first-child){margin-left:-8px}@media(max-width:576px){.tabs-container .tabs .tab-button:not(:first-child){margin-left:0}}.tabs-container .tabs .tab-button:first-child{z-index:4}.tabs-container .tabs .tab-button:first-child.active{z-index:5}.tabs-container .tabs .tab-button:nth-child(2){z-index:3}.tabs-container .tabs .tab-button:nth-child(2).active{z-index:5}.tabs-container .tabs .tab-button:nth-child(3){z-index:2}.tabs-container .tabs .tab-button:nth-child(3).active{z-index:5}.tabs-container .tabs .tab-button:nth-child(4){z-index:1}.tabs-container .tabs .tab-button:nth-child(4).active{z-index:5}.tabs-container .tabs .tab-button:nth-child(5){z-index:0}.tabs-container .tabs .tab-button:nth-child(5).active{z-index:5}@media(max-width:576px){.tabs-container .tabs .tab-button{position:relative;z-index:999;background-color:#fff;box-shadow:none;border-radius:0;padding:16px 0}}.tabs-container .tab-content{padding:40px 24px;display:flex;flex-direction:column;justify-content:center;background-color:#14243f;position:relative;z-index:6;border-radius:0 24px 0 0}@media(max-width:576px){.tabs-container .tab-content{justify-content:flex-start;border-radius:0}}.tabs-container .tab-content .structure-name,.tabs-container .tab-content .tab-subtitle,.tabs-container .tab-content p{color:#fff}.tabs-container .tab-content .structure-name{font-size:1.8rem;margin:0}@media(max-width:380px){.tabs-container .tab-content .structure-name{font-size:1.5rem}}.tabs-container .tab-content .tab-subtitle{font-size:1.3rem;font-weight:600;margin:8px 0 16px;border-bottom:2px solid #fff;padding-bottom:16px}@media(max-width:380px){.tabs-container .tab-content .tab-subtitle{font-size:1.1rem}}.tabs-container .tab-content p{font-size:16px;line-height:1.5;margin-bottom:5px}.tabs-container .tab-content .fade-in{opacity:0;animation:tabFadeIn .5s ease-in-out forwards;transform:translateY(0)}.top-cover-tab-content{width:95%;display:flex;flex-direction:column;justify-content:center;padding:40px 24px;background-color:#f7f7f7;border:20px solid #14243f;border-radius:0 24px 0 0;position:relative;z-index:6}@media(max-width:576px){.top-cover-tab-content{background-color:inherit;padding:24px 16px;margin-top:16px;border:0 solid #14243f;width:100%}}.top-cover-tab-content .tabs{display:flex;gap:10px;margin-bottom:20px;flex-wrap:wrap}@media(max-width:576px){.top-cover-tab-content .tabs{margin-bottom:20px;position:relative;justify-content:center;z-index:999}}.top-cover-tab-content .tabs .tab-button{padding:8px 16px;border:1px solid #004080;border-radius:20px;background:rgba(0,0,0,0);cursor:pointer;font-size:16px;color:#004080;transition:background .3s,color .3s}.top-cover-tab-content .tabs .tab-button svg{margin-left:16px;transform:rotate(90deg)}.top-cover-tab-content .tabs .tab-button.active{background:#004080;color:#fff}.top-cover-tab-content .tabs .tab-button.active svg{transform:rotate(-90deg)}@media(max-width:576px){.top-cover-tab-content .tabs .tab-button{position:relative;z-index:999}}.top-cover-tab-content .texture{font-size:3rem;background:linear-gradient(90deg,#14243F,#ce6b0f);-webkit-background-clip:text;-webkit-text-fill-color:rgba(0,0,0,0);width:-moz-fit-content;width:fit-content}@media(max-width:1200px){.top-cover-tab-content .texture{font-size:2.3rem}}.top-cover-tab-content .title-detail{font-size:1.3rem;font-weight:600}@media(max-width:1200px){.top-cover-tab-content .title-detail{font-size:1rem}}@media(max-width:576px){.top-cover-tab-content .title-detail{font-size:1rem}.top-cover-tab-content .title-detail br{display:none}}.top-cover-tab-content .purpose-list{list-style:none;display:flex;flex-direction:column;justify-content:center;gap:16px;margin-top:24px}@media(max-width:576px){.top-cover-tab-content .purpose-list{gap:24px}}.top-cover-tab-content .purpose-list .purpose-list-item{display:flex;align-items:center;gap:16px}@media(max-width:576px){.top-cover-tab-content .purpose-list .purpose-list-item{flex-direction:column;align-items:flex-start}}.top-cover-tab-content .purpose-list .purpose-list-item:last-child{flex-direction:column;align-items:flex-start}.top-cover-tab-content .purpose-list .purpose-list-item .label{font-size:1rem;color:#fff;background-color:#14243f;padding:4px 16px;border-radius:8px;display:flex;justify-content:center;align-items:center}@media(max-width:1200px){.top-cover-tab-content .purpose-list .purpose-list-item .label{width:25%;flex-direction:column}}@media(max-width:576px){.top-cover-tab-content .purpose-list .purpose-list-item .label{width:-moz-fit-content;width:fit-content;flex-direction:column}}.top-cover-tab-content .purpose-list .purpose-list-item .color-label{display:flex;align-items:center;width:100%}.top-cover-tab-content .purpose-list .purpose-list-item .color-label .arrert{font-size:.7rem;margin-left:8px}.top-cover-tab-content .purpose-list .purpose-list-item .detail{font-size:1rem}@media(max-width:1200px){.top-cover-tab-content .purpose-list .purpose-list-item .detail{width:75%}}@media(max-width:576px){.top-cover-tab-content .purpose-list .purpose-list-item .detail{width:100%}}.top-cover-tab-content .purpose-list .purpose-list-item .color-list{list-style:none;display:flex;align-items:center;gap:24px}.top-cover-tab-content .purpose-list .purpose-list-item .color-list .color-list-item{display:flex;flex-direction:column;justify-content:center;align-items:center}.top-cover-tab-content .purpose-list .purpose-list-item .color-list .color-list-item .color-curcle{width:80px;aspect-ratio:1/1;object-fit:cover;border-radius:50%}.top-cover-tab-content .fade-in{opacity:0;animation:tabFadeIn .5s ease-in-out forwards;transform:translateY(0)}@keyframes tabFadeIn{0%{opacity:0}to{opacity:1}}@keyframes slide-fade-in{0%{transform:translateY(100px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes slide-fade-in-shadow{0%{opacity:0}to{opacity:.4}}