@charset "UTF-8";

#floatBanner { top:970px;}

#mainVisual { width:100%;height:870px;}
.swiper-container { width:100%;height:100%;}
#mainVisual .swiper-slide { background-size:cover;background-repeat:no-repeat;background-position:center;}
#mainVisual .swiper-slide .inner { flex-direction:column;justify-content:center;height:100%;position:relative;}
#mainVisual .swiper-slide a:hover { color:#1d1d1f;font-weight:700;}
#mainVisual .swiper-slide a:active { color:#6a6a70;}
#mainVisual .swiper-slide p { word-break:keep-all;font-size:1.4375rem;font-weight:700;color:#fff;line-height:1.39;}
#mainVisual .swiper-slide img { display:none;}
#mainVisual .slider01 { background-image:url('../images/main/main-visual01.png');}
#mainVisual .slider01 h2 { font-size:2rem;font-weight:700;color:#fff;margin-bottom:6.5%;}
#mainVisual .slider01 h2 img { display:block;margin-top:1.25rem;}
#mainVisual .slider01 a { position:absolute;top:84.5%;font-size:1.125rem;font-weight:500;color:#fff;}
#mainVisual .slider01 a.btn1 { left:0;}
#mainVisual .slider01 a.btn2 { left:13%;}
#mainVisual .slider02 { background-image:url('../images/main/main-visual02.png');}
#mainVisual .slider02 h2 { font-size:1.75rem;font-weight:700;color:#fff;margin-bottom:7.5%;margin-top:-8.2%;}
#mainVisual .slider02 h2 img { display:block;margin-top:4.5%;}
#mainVisual .slider02 a { position:absolute;top:84.5%;left:0;font-size:1.125rem;font-weight:500;color:#fff;}
#mainVisual .slider03 { background-image:url('../images/main/main-visual03.png');}
#mainVisual .slider03 h2 { font-size:5.25rem;font-weight:700;color:#fff;line-height:1.2;margin:1% 0 6.7%;}
#mainVisual .slider03 p span { color:#000;position:relative;}
#mainVisual .slider03 p span:after { content:'';display:block;width:100%;height:1px;position:absolute;left:0;bottom:0;background-color:#000;}
#mainVisual .slider03 a { position:absolute;top:84.5%;left:0;font-size:1.125rem;font-weight:500;color:#fff;}
#mainVisual .swiper-pagination { bottom:20px;}
#mainVisual .swiper-pagination-bullet { width:12px;height:12px;margin:0 9px;background-color:#000;opacity:0.2;}
#mainVisual .swiper-pagination-bullet.swiper-pagination-bullet-active { width:50px;opacity:0.7;border-radius:6px;}
#mainVisual .swiper-button-next,
#mainVisual .swiper-button-prev { display:none;width:2.4375rem;height:3.5rem;}
#mainVisual .swiper-button-prev { background:url('../images/m/main/m-main-visual-arrow-prev.png') no-repeat center;background-size:cover;}
#mainVisual .swiper-button-next { background:url('../images/m/main/m-main-visual-arrow-next.png') no-repeat center;background-size:cover;}
#mainVisual .swiper-button-next:after,
#mainVisual .swiper-button-prev:after { content:'';}

section.section:not(#wimIntro) { padding-top:180px;}
section .section-title { font-size:1.75rem;font-weight:700;color:#1d1d1f;line-height:1;margin-bottom:55px;text-align:center;}
section .section-title span { display:block;font-size:1rem;font-weight:400;line-height:1.63;margin-top:12px;}
#wimIntro { padding-top:120px;}
#wimIntro .intro-text { font-size:1.5rem;font-weight:700;color:#1d1d1f;text-align:center;margin-bottom:175px;word-break:keep-all;}
#wimIntro .intro-text span { display:block;line-height:1;margin-bottom:30px;}
#wimIntro .intro-text em { display:block;margin-top:54px;font-size:1.25rem;font-weight:400;line-height:1.4;}
#wimIntro .intro-wrap { display:flex;flex-wrap:wrap;flex-direction:row;justify-content:space-between;}
#wimIntro .intro-wrap .intro-box { display:flex;flex:0 0 28.572%;align-items:flex-end;justify-content:center;height:400px;padding-bottom:50px;border-radius:20px;}
#wimIntro .intro-wrap .intro-box:nth-child(odd) { background-color:#dbe8f5;}
#wimIntro .intro-wrap .intro-box:nth-child(even) { background-color:#d4ecea;}
#wimIntro .intro-wrap .intro-box:nth-child(-n+3) { margin-bottom:70px;}
#wimIntro .intro-wrap .intro1 { background:url('../images/main/intro-image1.png') no-repeat top center;}
#wimIntro .intro-wrap .intro2 { background:url('../images/main/intro-image2.png') no-repeat top center;}
#wimIntro .intro-wrap .intro3 { background:url('../images/main/intro-image3.png') no-repeat top center;}
#wimIntro .intro-wrap .intro4 { background:url('../images/main/intro-image4.png') no-repeat top center;}
#wimIntro .intro-wrap .intro5 { background:url('../images/main/intro-image5.png') no-repeat top center;}
#wimIntro .intro-wrap .intro6 { background:url('../images/main/intro-image6.png') no-repeat top center;}
#wimIntro .intro-wrap .intro-box p { font-size:1.125rem;font-weight:700;color:#1d1d1f;line-height:1.33;text-align:center;word-break:keep-all;padding:0 5%;}

#process .scrollbar-wrap { position:relative;height:600px;}
#process .scrollbar-img { width:1400px;height:600px;overflow:hidden;position:relative;}
#process .scrollbar-img img { max-width: min-content;}
#process .scroll-wrapper .scroll-content { overflow-x:scroll;position:relative;}
#process .scroll-wrapper .scroll-content::-webkit-scrollbar { height:0;width:0;}
#process .scrollbar-img .img-box { width:4821px;height:600px;background:url('../images/main/process-img.png') no-repeat left center;background-size:contain;}
#process .scrollbar-img .img-box.en { background:url('../images/main/en/process-img.png') no-repeat left center;background-size:contain;}
#process .scroll { display:block;width:300px;height:18px;margin:0 auto;border-radius:9px;background-color:#eee;position:absolute;bottom:0;left:0;right:0;;padding:4px 6px;}
#process .scroll .scroll-outer,
#process .scroll .scroll-element_size,
#process .scroll .scroll-element_track { position:absolute;left:0;top:0;width:100%;height:100%;}
#process .scroll .scroll-outer { position:relative;}
#process .scroll .scroll-bar { display:block;width:60px;height:10px;border-radius:5px;background-color:#86cfcd;position:absolute;;cursor:pointer;}
#process p.info { font-size:1rem;font-weight:400;color:#1d1d1f;line-height:1;text-align:center;margin-top:0.75rem;}

#solution .solution-box { display:flex;flex-direction:row;position:relative;height:500px;}
#solution .solution-box .box { display:flex;flex-direction:column;width:calc(20% - (40px / 5));height:500px;padding-top:42px;position:relative;cursor:pointer;-webkit-transition:none;transition:none;}
#solution .solution-box .box:not(:first-child) { margin-left:10px;}
#solution .solution-box .box .hover-bg { display:none;position:absolute;top:0;left:0;width:100%;height:100%;border:6px solid #ff3900;background-color:rgba(0, 0, 0, .4);z-index:3;transition:none;}
#solution .solution-box .box .bg { position:absolute;right:3.43%;top:8.4%;width:66%;height:83.2%;pointer-events:none;z-index:1;opacity:0;}
#solution .solution-box .box .bg img { display:none;}
#solution .solution-box .box1 { background:url('../images/main/solution-bg01.jpg') no-repeat left center #00041c;}
#solution .solution-box .box2 { background:url('../images/main/solution-bg02.jpg') no-repeat left center #00041c;}
#solution .solution-box .box3 { background:url('../images/main/solution-bg03.jpg') no-repeat left center #00041c;}
#solution .solution-box .box4 { background:url('../images/main/solution-bg04.jpg') no-repeat left center #00041c;}
#solution .solution-box .box5 { background:url('../images/main/solution-bg05.jpg') no-repeat left center #00041c;}
#solution .solution-box .box1.on { background-image:none !important;}
#solution .solution-box .box2.on { background-image:none !important;}
#solution .solution-box .box3.on { background-image:none !important;}
#solution .solution-box .box4.on { background-image:none !important;}
#solution .solution-box .box5.on { background-image:none !important;}
#solution .solution-box .box1.on .bg { background:url('../images/main/solution-img01.jpg') no-repeat center #00041c;background-size:contain;}
#solution .solution-box .box2.on .bg { background:url('../images/main/solution-img02.jpg') no-repeat center #00041c;background-size:contain;}
#solution .solution-box .box3.on .bg { background:url('../images/main/solution-img03.jpg') no-repeat center #00041c;background-size:contain;}
#solution .solution-box .box4.on .bg { background:url('../images/main/solution-img04.jpg') no-repeat center #00041c;background-size:contain;}
#solution .solution-box .box5.on .bg { background:url('../images/main/solution-img05.jpg') no-repeat center #00041c;background-size:contain;}
#solution .solution-box .box.on { padding:42px 48px;cursor:auto;}
#solution .solution-box .box.on .bg { -webkit-animation-name:fadeIn;animation-name:fadeIn;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;}
#solution .solution-box .box.end .bg { -webkit-animation-name:fadeOut;animation-name:fadeOut;-webkit-animation-duration:.5s;animation-duration:.5s;}
#solution .solution-box .box h4 { display:block;width:auto;font-size:1.5rem;font-weight:700;color:#fff;line-height:1;margin-bottom:2.5rem;text-align:center;position:relative;z-index:2;}
#solution .solution-box .box .info { display:block;font-size:0.9375rem;font-weight:500;color:#fff;line-height:1.33;text-align:center;position:relative;z-index:2;-webkit-animation-name:fadeIn;animation-name:fadeIn;-webkit-animation-duration:.5s;animation-duration:.5s;-webkit-animation-fill-mode:both;animation-fill-mode:both;}
#solution .solution-box .box .detail { display:none;position:relative;z-index:2;width:100%;}
#solution .solution-box .box.on .info { display:none;}
#solution .solution-box .box.on h4 { text-align:left;}
#solution .solution-box .box.on .detail { display:block;opacity:1;-webkit-animation-name:fadeInUp;animation-name:fadeInUp;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;}
#solution .solution-box .box.on .info2 { font-size:1rem;font-weight:400;line-height:1.5;color:#fff;margin-bottom:2.25rem;}
#solution .solution-box .box.on h5 { font-size:1rem;font-weight:700;line-height:1.5;color:#fff;-webkit-animation-name:fadeInUp2;animation-name:fadeInUp2;}
#solution .solution-box .box.on .con { font-size:1rem;font-weight:500;line-height:1.5;color:#fff;}
#solution .solution-box .box.on .link-btn { font-size:1rem;font-weight:500;line-height:1;margin:auto 0 1.5rem;}
#solution .solution-box .box .detail.ing { opacity:0;-webkit-animation-name: fadeOut;animation-name: fadeOut;-webkit-animation-duration:.3s;animation-duration:.3s;}
#solution .solution-box .box h5.detail.ing { -webkit-animation-name: fadeOut;animation-name: fadeOut;}
#solution .solution-box .box .close-btn { position:absolute;top:0;right:0;display:none;width:90px;height:90px;background:url('../images/main/solution-close-btn-nor.png') no-repeat center rgba(0, 0, 0, .7);z-index:2;}
#solution .solution-box .box .close-btn:active { background-image:url('../images/main/solution-close-btn-sel.png');}
#solution .solution-box .box.on .close-btn { display:block;}

#effect .effect-wrap { display:flex;flex-wrap:wrap;flex-direction:row;justify-content:space-between;}
#effect .effect-wrap .effect-box { display:flex;flex:0 0 calc(20% - (200px/5));height:240px;border:1px solid #f1f1f1;border-radius:50%;padding-top:145px;}
#effect .effect-wrap .effect-box p { width:100%;font-size:1.125rem;font-weight:700;color:#1d1d1f;line-height:1.33;text-align:center;word-break:keep-all;}
#wrap.en #effect .effect-wrap .effect-box p { font-size:0.875rem;padding:0 5%;}
#effect .effect-wrap .effect-box:nth-child(-n+5) { margin-bottom:50px;}
#effect .effect-wrap .effect-box:nth-child(odd):hover { background-color:#2fada9;}
#effect .effect-wrap .effect-box:nth-child(even):hover { background-color:#4664b8;}
#effect .effect-wrap .effect-box:hover p { color:#fff;}
#effect .effect-wrap .effect01 { background:url('../images/main/effect-icon01.png') no-repeat center 22% #f8f8f8;}
#effect .effect-wrap .effect02 { background:url('../images/main/effect-icon02.png') no-repeat center 22% #f8f8f8;}
#effect .effect-wrap .effect03 { background:url('../images/main/effect-icon03.png') no-repeat center 22% #f8f8f8;}
#effect .effect-wrap .effect04 { background:url('../images/main/effect-icon04.png') no-repeat center 22% #f8f8f8;}
#effect .effect-wrap .effect05 { background:url('../images/main/effect-icon05.png') no-repeat center 22% #f8f8f8;}
#effect .effect-wrap .effect06 { background:url('../images/main/effect-icon06.png') no-repeat center 22% #f8f8f8;}
#effect .effect-wrap .effect07 { background:url('../images/main/effect-icon07.png') no-repeat center 22% #f8f8f8;}
#effect .effect-wrap .effect08 { background:url('../images/main/effect-icon08.png') no-repeat center 22% #f8f8f8;}
#effect .effect-wrap .effect09 { background:url('../images/main/effect-icon09.png') no-repeat center 22% #f8f8f8;}
#effect .effect-wrap .effect10 { background:url('../images/main/effect-icon10.png') no-repeat center 22% #f8f8f8;}
#effect .effect-wrap .effect01:hover { background-image:url('../images/main/effect-icon01_over.png');}
#effect .effect-wrap .effect02:hover { background-image:url('../images/main/effect-icon02_over.png');}
#effect .effect-wrap .effect03:hover { background-image:url('../images/main/effect-icon03_over.png');}
#effect .effect-wrap .effect04:hover { background-image:url('../images/main/effect-icon04_over.png');}
#effect .effect-wrap .effect05:hover { background-image:url('../images/main/effect-icon05_over.png');}
#effect .effect-wrap .effect06:hover { background-image:url('../images/main/effect-icon06_over.png');}
#effect .effect-wrap .effect07:hover { background-image:url('../images/main/effect-icon07_over.png');}
#effect .effect-wrap .effect08:hover { background-image:url('../images/main/effect-icon08_over.png');}
#effect .effect-wrap .effect09:hover { background-image:url('../images/main/effect-icon09_over.png');}
#effect .effect-wrap .effect10:hover { background-image:url('../images/main/effect-icon10_over.png');}

#partner .partner-wrap { display:flex;flex-direction:row;justify-content:space-between;}
#partner .partner-list { width:500px;}
#partner .partner-list .partners-box { display:flex;flex-direction:column;height:146px;padding-bottom:30px;}
#partner .partner-list .partners-box p.tit { display:block;width:100%;height:17px;font-size:1.125rem;font-weight:700;color:#1d1d1f;line-height:1;}
#partner .partner-list .partners-box .img-box { display:flex;flex:1 0 auto;justify-content:center;align-items:center;}

#newsMidea .inner { display:flex;flex-direction:row;justify-content:space-between;}
#newsMidea article { width:calc(50% - 1.71%);}
#newsMidea article .section-title { text-align:left;}
#newsMidea article ul { display:flex;flex-direction:row;justify-content:space-between;}
#newsMidea article ul li { width:44.45%;cursor:pointer;}
#newsMidea article ul li .img-box { width:100%;height:177px;overflow:hidden;}
#newsMidea article ul li .img-box img { max-width:100%;}
#newsMidea article ul li .txt-box { margin-top:16px;font-size:1.125rem;font-weight:700;line-height:1.33;color:#1d1d1f;text-align:center;}
#newsMidea .video-modal { position:fixed;top:0;left:0;right:0;bottom:0;opacity:0;pointer-events:none;overflow:hidden;}
#newsMidea .video-modal.open { display:flex;align-items:center;justify-content:center;z-index:110;background-color:rgba(0, 0, 0, .6);opacity:1;pointer-events:auto;}
#newsMidea .video-modal .video-wrap { position:relative;width:60%;padding-bottom:36%;z-index:111;}
#newsMidea .video-modal .video-wrap iframe { position:absolute;width:100%;height:100%;}
#newsMidea .video-modal .video-modal-closer { position:absolute;right:-90px;top:-90px;width:90px;height:90px;background:url('/images/main/solution-close-btn-nor.png') no-repeat center rgba(0, 0, 0, .7);cursor:pointer;z-index:112;}
#newsMidea .video-modal .video-modal-closer:active { background-image:url('../images/main/solution-close-btn-sel.png');}


#product { margin-bottom:180px;}
#product .product-list { display:flex;flex-direction:row;justify-content:space-between;}
#product .product-list li { width:calc((100% - 14.286%) / 5);box-shadow:9.4px 10.4px 30px 0 rgba(0, 0, 0, 0.1);position:relative;}
#product .product-list li.box:not(:first-child) { margin-left:calc(14.286% / 4);}
#product .product-list li p { position:absolute;left:0;right:0;bottom:0;min-height:33%;display:flex;align-items:center;justify-content:center;text-align:center;word-break:keep-all;font-size:1rem;font-weight:700;color:#1d1d1f;line-height:1.5;padding: 0 10px;}
#product .product-list li p.white { color:#fff;}
#product .product-list li a .hover-bg { position:absolute;top:0;left:0;right:0;bottom:0;border:6px solid #ff6900;background-color:rgba(0, 0, 0, .4);z-index:1;opacity:0;}
#product .product-list li a:hover .hover-bg { opacity:1;}



@-webkit-keyframes fadeInUp {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 50%, 0);
        transform: translate3d(0, 50%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 50%, 0);
        transform: translate3d(0, 50%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@-webkit-keyframes fadeInUp2 {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 200%, 0);
        transform: translate3d(0, 200%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes fadeInUp2 {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 200%, 0);
        transform: translate3d(0, 200%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@-webkit-keyframes fadeOutDown {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 50%, 0);
        transform: translate3d(0, 50%, 0);
    }
}

@keyframes fadeOutDown {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 50%, 0);
        transform: translate3d(0, 50%, 0);
    }
}

@-webkit-keyframes fadeOutDown2 {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 200%, 0);
        transform: translate3d(0, 200%, 0);
    }
}

@keyframes fadeOutDown2 {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 200%, 0);
        transform: translate3d(0, 200%, 0);
    }
}

@-webkit-keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@-webkit-keyframes fadeOut {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

@keyframes fadeOut {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

@media all and (max-width:1280px) {
    #mainVisual { height:auto;}
    #mainVisual .swiper-slide { position:relative;background:none;}
    #mainVisual .swiper-slide img { display:block;}
    #mainVisual .swiper-slide .inner { position:absolute;left:0;top:0;right:0;bottom:0;justify-content: flex-start;padding:0 8.6%;}
    #mainVisual .swiper-button-next,
    #mainVisual .swiper-button-prev { display:flex;}
    #mainVisual .swiper-slide a { position:static;top:0;left:0;}
    #mainVisual .slider01 h2 { margin:11% 0 6.5%;}
    #mainVisual .slider01 h2 img { margin-top:11%;width:64vw;}
    #mainVisual .slider01 a.btn1 { margin:auto 0 7%;}
    #mainVisual .slider01 a.btn2 { margin-bottom:19%;}
    #mainVisual .slider02 h2 { margin:12% 0 9.5%;}
    #mainVisual .slider02 h2 img { margin-top:11.5%;width:36vw;}
    #mainVisual .slider02 a { margin:auto 0 19%;}
    #mainVisual .slider03 h2 { font-size:4.5rem;margin:10% 0 12%;}
    #mainVisual .slider03 p { max-width:55%;word-break:keep-all;}
    #mainVisual .slider03 a { margin:auto 0 19%;}

    #wimIntro { padding-top:3.75rem;}
    #wimIntro .intro-text em { margin-top:2.8125rem;}
    #wimIntro .intro-text { margin-bottom:6.25rem;}
    #wimIntro .intro-wrap .intro-box { flex:0 0 47.95%;}
    #wimIntro .intro-wrap .intro-box:nth-child(-n+4) { margin-bottom:2vh;}
    section .section-title { margin-bottom:1.875rem;}

    section.section:not(#wimIntro) { padding-top:6.25rem;}
    #process .scrollbar-wrap { height:320px;}
    #process .scrollbar-img { width:100%;height:300px;}
    #process .scrollbar-img .img-box { width:2400px;height:300px;}

    #solution .solution-box { flex-direction:column;height:auto;}
    #solution .solution-box .box { width:100%;height:200px;max-height:200px;transition:max-height .3s ease;}
    #solution .solution-box .box:not(:first-child) { margin:0.875rem 0 0 0;}
    #solution .solution-box .box .bg { position:static;background:none;width:100%;height:auto;margin-top:2.25rem;}
    #solution .solution-box .box .bg img { display:block;width:100%;}
    #solution .solution-box .box1 { background:url('../images/m/main/solution-bg-1024-01.png') no-repeat center #00041c;background-size:cover;}
    #solution .solution-box .box2 { background:url('../images/m/main/solution-bg-1024-02.png') no-repeat center #00041c;background-size:cover;}
    #solution .solution-box .box3 { background:url('../images/m/main/solution-bg-1024-03.png') no-repeat center #00041c;background-size:cover;}
    #solution .solution-box .box4 { background:url('../images/m/main/solution-bg-1024-04.png') no-repeat center #00041c;background-size:cover;}
    #solution .solution-box .box5 { background:url('../images/m/main/solution-bg-1024-05.png') no-repeat center #00041c;background-size:cover;}
    #solution .solution-box .box .detail { text-align:center;}
    #solution .solution-box .box.on { padding:1.5625rem 6% 4.75rem;height:auto;max-height:800px;}
    #solution .solution-box .box.on h4 { text-align:center;}
    #solution .solution-box .box.on .link-btn { position:absolute;bottom:1rem;left:0;right:0;}
    #solution .solution-box .box .close-btn { width:3rem;height:3rem;background-size:60%;}

    #effect .effect-wrap .effect-box { flex:0 0 48%;align-items:center;height:200px;padding:0 0 0 20%;border-radius:100px;background-position:left 15% center;background-size:20%;}
    #effect .effect-wrap .effect-box:nth-child(-n+8) { margin-bottom:2rem;}
    #effect .effect-wrap .effect-box p { text-align:left;}

    #partner .partner-wrap { flex-direction:column;align-items:center;}
    #partner .partner-wrap .map img { display:block;margin:0 auto;max-width:100%;}
    #partner .partner-list { width:80%;margin-top:1rem;}

    #product { margin-bottom:6.25rem;}
}

@media all and (max-width:1024px) {
    #product .product-list { flex-direction:column;}
    #product .product-list li { width:100%;margin-left:0;margin-bottom:1rem;}
    #product .product-list li img { width:100%;}
    #product .product-list li p { justify-content:inherit;top:0;text-align:left;padding-left:50%;font-size:1.125rem;}

    #product .product-list li a:hover .hover-bg { opacity:0;}
    #product .product-list li a:active .hover-bg { opacity:1;}

    #newsMidea .inner { justify-content:inherit;flex-direction:column;}
    #newsMidea article { width:100%;}
    #newsMidea article.media { margin-top:6.25rem;}
    #newsMidea article .section-title { text-align:center;}
    #newsMidea article ul li { width:48%;}
    #newsMidea article ul li .img-box { padding-top:60%;height:auto;position:relative;}
    #newsMidea article ul li .img-box img { position:absolute;left:0;top:0;width:100%;}
}

@media all and (max-width:768px) {
    #mainVisual .slider01 h2 img { margin-top:10%;}
    #mainVisual .slider01 p { max-width:80%;}
    #mainVisual .slider01 a.btn1 { margin-bottom:6%;}
    #mainVisual .slider02 h2 { margin:10% 0 7.5%;}
    #mainVisual .slider02 p { max-width:50%;}
    #mainVisual .slider03 h2 { font-size:3.75rem;}
    #mainVisual .slider03 p { max-width:59%;}

    #wimIntro .intro-wrap .intro-box { height:18.75rem;padding-bottom:1.875rem;background-size:contain;}

    #effect .effect-wrap .effect-box { height:150px;border-radius:75px;}

    #partner .partner-list { width:100%;}

    #newsMidea .video-modal .video-modal-closer { width:3.75rem;height:3.75rem;top:-3.75rem;right:-3.75rem;background-size:60%;}
}

@media all and (max-width:640px) {
    #mainVisual .swiper-slide h2 { font-size:1.375rem;}
    #mainVisual .swiper-slide p { font-size:1.125rem;}
    #mainVisual .slider03 h2 { font-size:3.125rem;}

    #effect .effect-wrap .effect-box { flex:0 0 100%;padding:0 5% 0 30%;}
    #effect .effect-wrap .effect-box:nth-child(-n+9) { margin-bottom:2rem;}

    #solution .solution-box .box1 { background:url('../images/m/main/solution-bg01.png') no-repeat center #00041c;background-size:cover;}
    #solution .solution-box .box2 { background:url('../images/m/main/solution-bg02.png') no-repeat center #00041c;background-size:cover;}
    #solution .solution-box .box3 { background:url('../images/m/main/solution-bg03.png') no-repeat center #00041c;background-size:cover;}
    #solution .solution-box .box4 { background:url('../images/m/main/solution-bg04.png') no-repeat center #00041c;background-size:cover;}
    #solution .solution-box .box5 { background:url('../images/m/main/solution-bg05.png') no-repeat center #00041c;background-size:cover;}

    #effect .effect-wrap .effect-box { height:120px;border-radius:60px;padding:0 5% 0 30%;background-position:left 10% center;}
    #partner .partner-list .partners-box .img-box img { max-width:90%;}
}

@media all and (max-width:424px) {
    #mainVisual .slider03 h2 { font-size:2.375rem;}
    #wimIntro .intro-wrap .intro-box { flex:0 0 100%;height:25rem;}
    #wimIntro .intro-wrap .intro-box:nth-child(-n+5) { margin-bottom:2vh;}

    #solution .solution-box .box { height:150px;max-height:150px;transition:max-height .3s ease;}

    #partner .partner-list .partners-box .img-box img { max-width:80%;}

    #newsMidea article ul { flex-direction:column;justify-content:inherit;}
    #newsMidea article ul li { width:100%;}
    #newsMidea article ul li:first-child { margin-bottom:3.125rem;}
}

@media all and (max-width:320px) {
    #product .product-list li p { padding-left:47%;}
}
