main{
            overflow: hidden;
        }
        main .banner .fluid{
            bottom: 85px;
            justify-content: flex-end;
        }
        main .banner .txt>p:nth-child(n + 2){
            color: #DAC398;
        }
        

        main .contact .ttl{
            margin-bottom: 50px;
        }
        

        main .contact{
            margin-top: 88px;
            padding-bottom: 44px;
        }
        main .contact .map .txt{
            width: 425px;
            margin-right: 48px;
            font-size: 16px;
            line-height: 1.4;
        }
        main .contact .map .txt p{
            margin-top: 15px;
        }
        main .contact .map .txt p span{
            display: block;
        }
        main .contact .map .txt p .val{
            margin-top: 2px;
            position: relative;
            z-index: 2;
        }
        main .contact .map .txt p .val::after{
            z-index: -1;
            transform-origin: bottom;
            transition: .5s;
            transform: scaleY(0);
            background: #F0E5CF;
        }
        main .contact .map .txt p:hover .val::after{
            transform: scaleY(1);
        }
        main .contact .map .txt p:first-child{
            margin-top: 0px;
        }
        main .contact .map .txt p:first-child span{
            font-size: 24px;
            margin-bottom: 0px;
        }
        main .contact .map .txt .naviTo{
            width: 120px;
            line-height: 36px;
            font-size: 14px;
            text-align: center;
            margin-top: 20px;
            color: #fff;
            background-color: #141D44;
            border-radius: 6px;
            display: none;
        }
        /*
        .mobileDevice main .contact .map .txt .naviTo{
            display: block;
        }
        */
        main .contact .map #mapBox{
            flex: 1;
            height: 592px;
            border-width: 0px;
            z-index: 2;
        }


        main .recruit{
            padding-top: 51px;
            background: #F0E5CF;
            padding-bottom: 60px;
        }
        main .recruit .ttl::after{
            background-color: #D9C095;
        }
        main .recruit .tips{
            padding: 25px 0px;
            color: #8B8B8C;
            line-height: 1.4;

        }
        main .recruit .tips p{
            margin-top: 4px;
        }
        main .recruit .tips p:first-child{
            margin-top: 0px;
        }
        main .recruit .box{
            height: 540px;
            opacity: 0;
            border: 1px solid #D9C095;
            border-bottom-width: 0px;
            position: relative;
            transform: translateX(50%);
            transition: 1s opacity,transform 1s;
            transition-delay: .15s;
        }
        main .recruit .box::after{
            content: '';
            position: absolute;
            width: 100%;
            height: 1px;
            bottom: 0px;
            left: 0px;
            background-color: #D9C095;
            z-index: 2;
        }
        main .recruit .box.frozen{
            opacity: 1;
            transform: translateX(0%);
        }
        main .recruit .box .swp{
            height: 100%;
            width: 270px;
        }
        main .recruit .box .swp p{
            width: 100%;
            padding: 0px 10px;
            text-align: center;
            font-size: 20px;
        }
        main .recruit .box .swp .swiper-slide{
            color: #D9C095;
            cursor: pointer;
            transition:background .5s,border .5s,color .5s;
            border-right: 1px solid #D9C095;
            border-bottom: 1px solid #D9C095;
        }
        main .recruit .box .swp .swiper-slide:hover{
            background: rgba(255,255,255,.4);
        }
        main .recruit .box .swp .swiper-slide.active{
            background: #fff;
            color:#141D44;
        }
       
             
        main .recruit .list{
            padding: 36px 64px;
            font-size: 16px;
            flex: 1;
            background: #fff;
        }
        main .recruit .list .item{
            display: none;
            color: #332C2B;
            line-height: 1.6;
            height: 100%;
            overflow-y: auto;
        }
        main .recruit .list .item::-webkit-scrollbar{
            width: 6px;
            height: 6px; 
        }
        main .recruit .list .item::-webkit-scrollbar-thumb{
            border-radius: 3px;
            background: rgba(0,0,0, .03);
        }
        main .recruit .list .item:hover::-webkit-scrollbar-thumb{
            background: rgba(0,0,0, .08);
        }
        main .recruit .list .item::-webkit-scrollbar-track{
            background: rgba(0,0,0,0);
        }
        main .recruit .list .item.active{
           display: block;
        }
        main .recruit .list .item>p{
            font-family: 'Pro_Medium'; 
            background: #fff;
            color: #141D44;
            line-height: 1.8;
            font-size: 18px;
            display: inline-block;
            vertical-align: top;
            border-radius: 5px;
            padding: 0px 18px;
            margin-bottom: 12px;
        }
        main .recruit .list .item ul{
            margin-bottom: 40px;
        }
        main .recruit .list .item ul:last-child{
            margin-bottom: 0px;
        }
        main .recruit .list .item ul li{
            margin-top: 4px;
        }
        main .recruit .list .item ul li:first-child{
            margin-top: 0px;
        }
        
        main .recruit .send{
            background-color: #D5BA8C;
            width: 200px;
            line-height: 50px;
            display: block;
            text-align: center;
            position: relative;
            color: #fff;
            line-height: 36px;
            font-size: 14px;
            border-radius: 6px;
            overflow: hidden;
            margin: 0 auto;
            margin-top: 20px;
            transition: background .4s,color .4s;
            border: 1px solid #D5BA8C;
        }
        main .recruit .send input{
            position: absolute;
            left: 200%;
            display: none;
        }
        main .recruit .send:hover{
            background-color: #fff;
            color: #141D44;
        }
        
        
        main .coop1{
            position: relative;
            z-index: 2;
            padding: 68px 0px;
        }
        main .coop1>img{
            z-index: -1;
        }
        main .coop1 .ttl span:first-child{
            color: #fff;
        }
        main .coop1 .tips{
            line-height: 1.6;
            width: 60%;
            color: #fff;
            font-size: 14px;
        }
        main .coop1 .fluid>.txt{
            color: #D5BA8C;
            margin-top: 36px;
            margin-bottom: 35px;
        }
        main .coop1 .fluid>.txt>p{
            font-size: 38px;
            font-family: 'Pro_Heavy'; 
        }
        main .coop1 .fluid>.txt>*,
        main .coop1 .tips,
        main .coop1 .content>*{
            opacity: 0;
            transition: 1s opacity,1s transform;
        }
        main .coop1 .fluid>.txt>*.frozen,
        main .coop1 .tips.frozen,
        main .coop1 .content>*.frozen{
            opacity: 1;
            transform: translateY(0px);
        }
        main .coop1 .fluid>.txt .t{
            color: #fff;
            font-size: 22px;
            margin-top: 20px;
        }
        main .coop1 .t p,
        main .coop1 .tips p{
            margin-top: 10px;
        }
        main .coop1 .t p:first-child,
        main .coop1 .tips p:first-child{
            margin-top: 0px;
        }
        main .coop1 .content{
            margin-top: 90px;
             color: #332C2B;
        }
        main .coop1 .content>*{
            position: relative;
            z-index: 2;
            transform: translateY(30px);
            padding: 42px 32px 32px;
            border-radius: 14px;
        }
        main .coop1 .content>*>p{
            font-size: 30px;
            top: 0px;
            color: #D5BA8C;
        }
        main .coop1 .content>*::after{
            z-index: -1;
            box-sizing: border-box;
            border-radius: 14px;
            border: 2px solid #D5BA8C;
            clip-path: polygon(0% 0%,calc(50% - 86px) 0%,calc(50% - 86px) 5px,calc(50% + 86px) 5px,calc(50% + 86px) 0%,100% 0%,100% 100%,0% 100%);
        }
        main .coop1 .content>*::before{
            z-index: -2;
            background: url(../img/common/bg.png) no-repeat center center;
            background-size: cover;
            border-radius: 14px;
            overflow: hidden;
        }
        
        main .coop1 .content .modes{
            flex: 1;
        }
        main .coop1 .content .modes ul li{
            margin-top: 18px;
            background-color: rgba(26,44,92,1);
            overflow: hidden;
            font-size: 14px;
            position: relative;
            z-index: 2;
        }
        main .coop1 .content .modes ul li::after,
        main .coop1 .content .methods .flex p::after{
            z-index: -1;
            background-color: #fff;
            transform: scaleY(0);
            transform-origin: bottom;
            transition: .4s;
        }
        main .coop1 .content .modes ul li:hover::after,
        main .coop1 .content .methods .flex p:hover::after{
            transform: scaleY(1);
        }
        main .coop1 .content .modes ul li::after
        main .coop1 .content .modes ul li:first-child{
            margin-top: 0px;
        }
        main .coop1 .content .modes ul li p.name,
        main .coop1 .content .modes ul li,
        main .coop1 .content .methods .flex p{
            border-radius: 10px;
        }
        main .coop1 .content .modes ul li p.name{
            position: relative;
            background-color: #D5BA8C;
            width: 240px;
        }
        main .coop1 .content .modes ul li p.name span{
            white-space: nowrap;
        }
        main .coop1 .content .modes ul li p.name span,
        main .coop1 .content .methods .flex p:nth-child(odd){
            color: #1A2C5C;
            font-family: 'Pro_Heavy'; 
        }
        main .coop1 .content .modes ul li p.name,
        main .coop1 .content .methods .flex p{
            font-size: 22px;
        }
        main .coop1 .content .modes ul li .txt{
            min-height: 86px;
            flex: 1;
            flex-direction: column;
            padding: 10px 45px;
            color: #fff;
            transition: color .4s;
        }
        main .coop1 .content .methods{
            width: 310px;
            margin-left: 36px;
        }
        main .coop1 .content .methods .flex{
            height: 100%;
            flex-direction: column;
        }
        main .coop1 .content .methods .flex p{
            text-align: center;
            border-radius: 10px;
            z-index: 2;
            background-color: #D5BA8C;
            line-height: 60px;
            overflow: hidden;
            position: relative;
        }
        main .coop1 .content .methods .flex p:nth-child(even){
            background-color: rgba(26,44,92,1);
            color: #fff;
            transition: color .4s;
        }
        main .coop1 .content .methods .flex p:nth-child(even):hover,
        main .coop1 .content .modes ul li:hover .txt{
            color: #1A2C5C;
        }
        

        @media(max-width:1750px){
            main .contact .map #mapBox{
                height: 500px;
            }
        }

        @media(max-width:1600px){
            main .banner .fluid{
                bottom: 68px;
            }

            main .contact{
                margin-top: 60px;
                padding-bottom: 44px;
            }
            main .contact .map #mapBox{
                height: 420px;
            }
            main .contact .map .txt p:first-child span{
                font-size: 20px;
            }

            main .recruit{
                padding-bottom: 52px;
            }
            main .recruit .list .item ul{
                margin-bottom: 32px;
            }
            main .recruit .box{
                height: 480px;
             
            }
            main .recruit .box .swp{
                width: 240px;
            }
            main .recruit .box .swp p{
                font-size: 18px;
            }
            main .recruit .send{
                width: 180px;
            }

            main .coop1{
                padding: 50px 0px;
            }
            main .coop1 .content{
                margin-top: 70px;
            }
            main .coop1 .content .modes ul li p.name{
                width: 200px;
            }
            main .coop1 .content .modes ul li .txt{
                padding: 10px 35px;
            }
        }

        @media(max-width:1200px){
            main .contact{
                margin-top: 50px;
            }
            main .contact .ttl{
                margin-bottom: 40px;
            }
            main .banner .fluid{
                bottom: 48px;
            }

            main .contact{
                padding-bottom: 35px;
            }
            main .contact .map .txt{
                width: 360px;
                margin-right: 36px;
            }
            main .contact .map .txt p:first-child span{
                font-size: 18px;
            }
            
            main .contact .map #mapBox{
                height: 360px;
            }

            main .recruit{
                padding-top: 40px;
            }
            main .recruit .box{
                height: 400px;
            }
            main .recruit .box .swp{
                width: 200px;
            }
            main .recruit .list{
                padding: 30px 40px;
            }
            main .recruit .list .item>p{
                font-size: 16px;
                padding: 0px 12px;
            }
            main .recruit .list .item ul{
                margin-bottom: 26px;
            }
            main .recruit .send{
                width: 150px;
            }


            main .coop1 .fluid>.txt>p{
                font-size: 30px;
            }
            main .coop1 .fluid>.txt{
                margin-top: 30px;
            }
            main .coop1 .fluid>.txt .t{
                font-size: 18px;
            }
            main .coop1 .t p, main .coop1 .tips p{
                margin-top: 6px;
            }
            main .coop1 .content{
                margin-top: 60px;
            }
            main .coop1 .content>*{
                padding: 32px 24px 24px;
            }
            main .coop1 .content>*>p{
                font-size: 26px;
            }
            main .coop1 .content>*::after{
                border-radius: 10px;
                clip-path: polygon(0% 0%,calc(50% - 78px) 0%,calc(50% - 78px) 5px,calc(50% + 78px) 5px,calc(50% + 78px) 0%,100% 0%,100% 100%,0% 100%);
            }
            main .coop1 .content .modes ul li p.name{
                width: 160px;
            }
            main .coop1 .content .modes ul li .txt{
                padding: 10px 35px;
                min-height: 70px;
            }
            main .coop1 .content .modes ul li p.name, 
            main .coop1 .content .methods .flex p{
                font-size: 18px;
            }
            main .coop1 .content .modes ul li p.name,
            main .coop1 .content .modes ul li,
            main .coop1 .content .methods .flex p{
                border-radius: 6px;
            }
            main .coop1 .content .methods{
                width: 260px;
            }
            main .coop1 .content .methods .flex p{
                line-height: 50px;
            }
        }

        @media(max-width:1024px){
            main .banner .fluid{
                bottom: 36px;
            }
            main .contact .ttl{
                margin-bottom: 25px;
            }

            main .contact{
                padding-bottom: 25px;
            }
            main .contact .map .txt{
                width: 280px;
                margin-right: 30px;
                font-size: 14px;
            }
            
            main .contact .map #mapBox{
                height: 360px;
            }

            main .recruit{
                padding-bottom: 45px;
            }
            main .recruit .tips{
                font-size: 14px;
                padding: 16px 0px;
            }
            main .recruit .list{
                padding: 24px 26px;
                font-size: 14px;
            }
            main .recruit .list .item ul{
                margin-bottom: 18px;
            }
            main .recruit .box{
                height: 320px;
            }
            main .recruit .box .swp{
                width: 160px;
            }
            main .recruit .box .swp p{
                font-size: 16px;
            }
            main .recruit .list .item>p {
                font-size: 14px;
                padding: 0px 8px;
                border-radius: 4px;
            }
            main .recruit .send{
                width: 120px;
            }

            main .coop1{
                padding: 40px 0px;
            }
            main .coop1 .fluid>.txt{
                margin: 24px 0px;
            }
            main .coop1 .fluid>.txt .t{
                margin-top: 12px;
                line-height: 1.1;
                font-size: 16px;
            }
            main .coop1 .fluid>.txt>p{
                font-size: 24px;
            }
            main .coop1 .content{
                margin-top: 50px;
            }
            main .coop1 .content>* {
                padding: 24px 15px 15px;
            }
            main .coop1 .content>*>p{
                font-size: 20px;
            }
            main .coop1 .content>*::after {
                clip-path: polygon(0% 0%,calc(50% - 64px) 0%,calc(50% - 64px) 5px,calc(50% + 64px) 5px,calc(50% + 64px) 0%,100% 0%,100% 100%,0% 100%);
            }
            main .coop1 .content .modes ul li{
                margin-top: 12px;
            }
            main .coop1 .content .modes ul li p.name{
                width: 100px;
            }
            main .coop1 .content .modes ul li .txt{
                padding: 10px 18px;
                min-height: 64px;
            }
            main .coop1 .content .methods{
                width: 220px;
                margin-left: 26px;
            }
            main .coop1 .content .modes ul li p.name, 
            main .coop1 .content .methods .flex p{
                font-size: 16px;
            }
        }

        
        
        @media(max-width:767px){
            main .banner .fluid{
                bottom: 20px;
            }

            main .contact{
                margin-top: 40px;
            }
            main .contact .map{
                flex-direction: column-reverse;
            }
            main .contact .map .txt{
                width: 100%;
                margin-left: 0px;
                margin-top: 25px;
            }
            main .contact .map .txt p:first-child span{
                font-size: 16px;
            }
            main .contact .map .txt p{
                margin-top: 12px;
            }
            main .contact .map #mapBox{
                max-height: 360px;
                height: 60vw;
                flex: initial;
            }
            


            main .recruit{
                padding-bottom: 39px;
            }
            main .recruit .list{
                padding: 15px 20px;
                display: block;
            }
            main .recruit .list .item>p{
                font-size: 12px;
                padding: 0px 8px;
                border-radius: 4px;
            }
            main .recruit .box{
                height: 240px;
            }
            main .recruit .box .swp{
                width: 120px;
            }
            main .recruit .box .swp p{
                font-size: 14px;
            }
            main .recruit .send,
            main .contact .map .txt .naviTo{
                margin-top: 12px;
                line-height: 32px;
                width: 100px !important;
            }
            main .contact .map .txt .naviTo{
                margin-top: 15px;
            }
            
            main .coop1 .fluid>.txt{
                margin: 15px 0px 20px;
            }
            main .coop1 .fluid>.txt .t{
                font-size: 14px;
            }
            main .coop1 .fluid>.txt>p{
                font-size: 18px;
            }
            main .coop1 .tips{
                width: 80%;
            }
            main .coop1 .content{
                display: block;
                margin-top: 40px;
            }
            main .coop1 .content .methods{
                width: 100%;
                transition-delay: 0s !important;
                margin-left: 0px;
                margin-top: 36px;
            }
            main .coop1 .content .methods .flex p{
                margin-top: 12px;
                line-height: 40px;
            }
            main .coop1 .content .methods .flex p:first-child{
                margin-top: 0px;
            }
            main .coop1 .content .modes ul li .txt{
                font-size: 13px;
                padding: 10px 15px;
            }
            main .coop1 .content .modes ul li p.name{
                width: 90px;
                font-size: 15px;
            }
        }
        
        @media(min-width:501px){
            main .recruit .box .swp .swiper-slide.active{
                border-right-color: #fff;
            }
        }

        @media(max-width:500px){
            main .recruit .box .swp{
                width: 90px;
            }
            
            main .recruit .box{
                height: initial;
                display: block;
                border-right-width: 0px;  
            }
            main .recruit .box::before{
                content: '';
                width: 1px;
                height: 100%;
                top: 0px;
                right: 0px;
                z-index: 2;
                background-color: #D9C095;
                position: absolute;
            }
            main .recruit .box .swp{
                width: 100%;
                height: 48px;
            }
            main .recruit .box .swp .swiper-slide.active{
                border-bottom-color: #fff;
            }
            main .recruit .list .item{
                height: 60vh;
            }
        }