@charset "utf-8";

.scon .pc{display:block}
.scon .m{display:none}

.fl{float:left}
.section {position: relative;max-width:1920px;margin:0 auto;text-align:center}
.section-default-img {width: 100%;max-width: 1920px;}
.section-default-img.mobile {display: none;}
.tx{position:absolute;left:0}
.tx.m{display:none}
.section-link {position: absolute;z-index: 99;}
.section-link.m{display:none}
.sec1 .section-link--logo {left:16.14%;top:3.22%;width:6.45%;z-index:1}
.sec1 .section-link--promise {left:33.7%;top:47.84%;width:32.6%}
.fade{ 
opacity:1 !important;
animation: fadein 3s ease-in-out alternate;
-moz-animation: fadein 3s ease-in-out alternate; /* Firefox */
-webkit-animation: fadein 3s ease-in-out alternate; /* Safari and Chrome */
-o-animation: fadein 3s ease-in-out alternate; /* Opera */
}
.sec1btns{background:#ffcc00;text-align:center;}
.sec1btns a{display:inline-block;width:22.5%}
.sec1btns a:last-child{width:22.76%}
.sec2-1, .sec2-2{background:#eaf1f6}
.sec2-2 .youtube_box{position:absolute;top:0;left:22.14%;width:55.72%;height:100%}
.sec2-2 .youtube_box .youtube_inner{width:100%;height:100%}
.sec3, .sec4{background:#eaf1f6}
.swiperbtn .swiper-wrapper{max-width:1400px;margin:0 auto}
.swiperbtn .swiper-slide{position:relative;width:33.33% !important;cursor: pointer;background:#434343}
.swiperbtn .swiper-slide-thumb-active:after{z-index:1;display:block;position:absolute;top:0;left:0;content:'';width:100%;height:100%;background:url('../images/btn-sec4-1-active.jpg') no-repeat 0 0 / 100% auto #7ecdf4}
.swiperbtn .swiper-slide:nth-child(2).swiper-slide-thumb-active:after{background:url('../images/btn-sec4-2-active.jpg') no-repeat 0 0 / 100% auto #7ecdf4}
.swiperbtn .swiper-slide:nth-child(3).swiper-slide-thumb-active:after{background:url('../images/btn-sec4-3-active.jpg') no-repeat 0 0 / 100% auto #7ecdf4}
.swiperbtn .swiper-slide:nth-child(2).swiper-slide-thumb-active:after{margin:0 -4px;width:calc(100% + 6px);left:2px}
.swiperbtn .swiper-slide:nth-child(3).swiper-slide-thumb-active:after{margin:0 0 0 -2px;width:calc(100% + 4px)}
.swiperbtn .swiper-slide:nth-child(3){overflow:hidden}
.swiper-w{max-width:1400px;margin:0 auto}
.sec5 .tx1{width:62.18%;top:40.82%;left:18.91%}
.sec6 .tx1{width:28.43%;top:34.87%;left:53.22%}
.sec7 .tx1{width:25.67%;top:32.36%;left:16.04%}
.sec8 .tx1{width:29.84%;top:18.29%;left:53.22%}

.sec9 .scon{position:relative}
.sec9 .scon .sconlist{position:absolute;top:0;left:0;width:100%;height:100%;display:flex}
.sec9 .scon .sconlist a{position:relative;flex:1;overflow: hidden;width:100%;height:100%;}
.sec9 .scon .sconlist a img{width:100%;height:100%}
.sec9 .scon .sconlist a:after{position:absolute;top:-1px;left:-1px;content:'';width:calc(100% + 2px);height:calc(100% + 2px)}
.sec9 .scon .sconlist a:nth-child(1):after{background:url('../images/bg-sec9-1.png') no-repeat 50% 50% /100% auto}
.sec9 .scon .sconlist a:nth-child(2):after{background:url('../images/bg-sec9-2.png') no-repeat 50% 50% /100% auto}
.sec9 .scon .sconlist a:nth-child(3):after{background:url('../images/bg-sec9-3.png') no-repeat 50% 50% /100% auto}
.sec9 .scon .sconlist a:nth-child(1):hover:after{background:url('../images/bg-sec9-1-ov.png') no-repeat 50% 50% /100% auto}
.sec9 .scon .sconlist a:nth-child(2):hover:after{background:url('../images/bg-sec9-2-ov.png') no-repeat 50% 50% /100% auto}
.sec9 .scon .sconlist a:nth-child(3):hover:after{background:url('../images/bg-sec9-3-ov.png') no-repeat 50% 50% /100% auto}

.sec10 .section-link--promise{width:70.31%;left:14.84%;top:71.42%}
.sec13, .sec12{background:#0072ce}
.sec13-1{background:#fff}
.sec13 .big img{display:none}
.sec13 .big img.active{display:block}
.sec13 .big{position:absolute;top:9%;left:52.91%;width:29.58%}
.sec13 .small{padding:0 13.54%}
.sec13 .small span{position:relative;display:inline-block;width:22%;margin-left:1.1%;cursor: pointer;}
.sec13 .small span:first-child{margin-left:0}
.sec13 .small span:after{display:none;content:'';width:100%;height:100%;position:absolute;top:0;left:0;background:url('../images/btn-sec10-1-active.png')no-repeat 50% 50% / 100% auto}
.sec13 .small span.active:after{display:block}
.sec13 .small span:nth-child(2)::after{background:url('../images/btn-sec10-2-active.png') no-repeat 50% 50% / 100% auto}
.sec13 .small span:nth-child(3)::after{background:url('../images/btn-sec10-3-active.png') no-repeat 50% 50% / 100% auto}
.sec13 .small span:nth-child(4)::after{background:url('../images/btn-sec10-4-active.png') no-repeat 50% 50% / 100% auto}

.img1400{max-width:1400px;}
.img1070{max-width:1070px;}
.sec1400{padding:0 13.54%}
.quickmenu {position:fixed;right:1.2%;bottom:35%;width:8.9%;height:auto;z-index:100}
.menu-item.main{z-index:1;opacity:1}
.menu-item {width: 100%;position: absolute;transform: translate(0px, 0px);transition: transform 500ms;z-index: -2;transition: .5s;opacity:0;cursor: pointer;}
.menu-item.main img {-webkit-transform: scale(1);transform: scale(1);-webkit-transition: .3s ease-in-out;transition: .3s ease-in-out;}
.menu-item.main:hover img {-webkit-transform: scale(1.1);transform: scale(1.1);}
.menu-item:nth-child(2){width:70%}
.menu-item:nth-child(3){width:70%}
.menu-item:nth-child(4){width:70%;top:40px;left:40px}
.quickmenu.active:before{content: '';display: block;height: 300px;top: -115px;width: 200%;right: 0;position: absolute;z-index: -2;}
.quickmenu.active .menu-item:nth-child(2) {transform: rotate(-20deg) translateY(-110%) translateX(40%) rotate(20deg);transition-delay: 0.5s;opacity:1;}
.quickmenu.active .menu-item:nth-child(3) {transform: rotate(-80deg) translateY(-110%)  translateX(10%)  rotate(80deg);transition-delay: 0.35s;opacity:1;}
.quickmenu.active .menu-item:nth-child(4) {transform: rotate(-120deg) translateY(-160%)  translateX(40%)  rotate(120deg);transition-delay: 0.2s;opacity:1;}


@media screen and (max-width:1400px) {

.quickmenu{display:none}
.scon .pc{display:none}
.scon .m{display:block}

.section-default-img {display: none;}
.section-default-img.mobile {display: block;}
.section-link.m{display:block}
.section-default-img.img1400{display:block}
.section-default-img.img1070{display:block}
.sec1400{padding:0}
.sec1{z-index:1}
.sec1 .section-link--logo {top:3.44%;left:3.57%;width:8.85%}
.sec1 .section-link--promise {width:44.71%;top:48.14%;left:27.64%}
.sec1btns a{width:30.85%}
.sec1btns a:last-child{width:31.21%}
.sec2-2 .youtube_box{width:76.28%;left:11.86%}
.sec5 .tx1{width:85.28%;top:40.82%;left:7.36%}
.sec6 .tx1{width:39%;top:37.99%;left:54.42%}
.sec7 .tx1{width:35.21%;top:30.25%;left:3.28%}
.sec8 .tx1{width:40.92%;top:17.49%;left:54.42%}
.sec9 .scon .sconlist a:before{position: absolute;top: -1px;left: -1px;content: '';width: calc(100% + 2px);height: calc(100% + 2px);}
.sec9 .scon .sconlist a:nth-child(1):before{background: url('../images/bg-sec9-1mo.png')  no-repeat 50% 50% /100% auto;}
.sec9 .scon .sconlist a:nth-child(2):before{background: url('../images/bg-sec9-2mo.png')  no-repeat 50% 50% /100% auto;}
.sec9 .scon .sconlist a:nth-child(3):before{background: url('../images/bg-sec9-3mo.png')  no-repeat 50% 50% /100% auto;}
.sec9 .scon .sconlist a:after{opacity:0}
.sec9.active .scon .sconlist a.on:nth-child(1):after{background: url('../images/bg-sec9-1mo-ov.png')  no-repeat 50% 50% /100% auto;animation: image1 cubic-bezier(0.000, 0.780, 0.360, 1.640) alternate 2s ; }
.sec9.active .scon .sconlist a.on:nth-child(2):after{background: url('../images/bg-sec9-2mo-ov.png')  no-repeat 50% 50% /100% auto;animation: image1 cubic-bezier(0.000, 0.780, 0.360, 1.640) alternate 2s ; }
.sec9.active .scon .sconlist a.on:nth-child(3):after{background: url('../images/bg-sec9-3mo-ov.png')  no-repeat 50% 50% /100% auto;animation: image1 cubic-bezier(0.000, 0.780, 0.360, 1.640) alternate 2s ;}
.sec13 .big{width:40.57%;left:54%}
.sec13 .small{padding:0}

@keyframes image1 {
    0% {
     opacity:0
    }
    100% {
        opacity:1
    }
}

}