/******** Common ***********/
/*Title*/
.mSection .inner .titBox .tit{font-size: 44px;font-weight: 600;color: #183d86;letter-spacing: -1px;}
/*.mSection .inner .titBox .tit span{display: inline-block;position: relative;padding: 0 22px 0 0; }
.mSection .inner .titBox .tit span::after{content: "";display: block;width:14px;height: 14px;position: absolute;right:0;bottom: 6px;; background-color: #183d86;border-radius: 50%;}*/

/**/
.column{display: flex;justify-content: space-between;}
.column .titBox{width: 360px;}
.column .conBox{width: calc(100% - 360px);}

/*Visual*/
.visual .inner{max-width: none;padding: 0;}
.visualArea{position: relative;}
.visualArea .mSlider li img{width: 100%;}
.visualArea .mSlider li .txt{max-width: 1496px;width: 100%;height: 50%;display: flex;justify-content: flex-end;flex-direction: column;position: absolute;top: 185px;left: 50%;transform: translateX(-50%);margin:0}
.visualArea .mSlider li .txt p{padding: 40px 0; color:#fff;font-size: 40px;font-weight: 600;}
.visualArea .mSlider li .txt p strong{display: block; font-size: 49px;font-weight: 900;}
.visualArea .sliderAcc{max-width: 1496px;width:100%;height: 100%;display: flex;justify-content: center;flex-direction: column;position: absolute;top: 0;left:50%;transform: translateX(-50%);}
.visualArea .sliderAcc .ctl{width:220px;height: 22px;margin:370px 0 0 0 ;}
.visualArea .sliderAcc .ctl .slider-counter{color: #fff;font-size: 17px;font-weight: 500;width:165px;height: 22px; display: flex;align-items: center;margin: 0 0 0 22px}
.visualArea .sliderAcc .ctl .slider-counter span{display: inline-block;width:15px;text-align: center;}
.visualArea .sliderAcc .ctl .slider-counter .bx-controls-auto-item{width:12px;height: 17px;z-index: 10;margin: 0 0 0 39px}
.visualArea .sliderAcc .ctl .slider-counter .bx-controls-auto-item a{display: block;width:12px;height: 17px; background: url(../images/main/btn_slide01.png) left no-repeat;}
.visualArea .sliderAcc .ctl .slider-counter .bx-controls-auto-item a.bx-stop.start{background: url(../images/main/btn_slide02.png) left no-repeat;}
.visualArea .sliderAcc .ctl .slider-arr .bx-controls a span{position: absolute;overflow: hidden;width: 1px;height: 1px;margin: -1px;line-height: 0;border: 0;clip: rect(0 0 0 0);font-size: 0;}
.visualArea .sliderAcc .ctl .slider-arr .bx-controls-direction .bx-prev{display: block;width: 13px;height: 20px;background: url(../images/main/arr_slide01.png) left no-repeat;position: absolute;left:0}
.visualArea .sliderAcc .ctl .slider-arr .bx-controls-direction .bx-next{display: block;width: 13px;height: 20px;background: url(../images/main/arr_slide02.png) left no-repeat;position: absolute;left:148px}
.visualArea .sliderAcc .ctl .slider-arr .bx-controls-auto {width: 12px;position: absolute;right: 0;}
.visualArea .sliderAcc .ctl .slider-counter .slider-progress {position: relative; width: 66px;height: 1px;background-color: rgba(255, 255, 255, 0.3);margin: 0 10px}
.visualArea .sliderAcc .ctl .slider-counter .slider-progress .slider-progress-bar {position: absolute;left: 0;bottom: 0;height: 2px;width: 0%; background-color: white; transition: width 0.3s ease;}
.visualArea .sliderAcc .txt{margin: 235px 0 45px 0}
.visualArea .sliderAcc .txt p{color:#fff;font-size: 40px;font-weight: 600;}
.visualArea .sliderAcc .txt p strong{display: block; font-size: 49px;font-weight: 900;}

/*Quick menu*/
.quick{position: relative;margin: 0;}
.quick::before{content: "";display: block;position: absolute;left:0;width:50%;height: 100%;background-color: #f7f9fb; z-index: 1;}
.quick .inner{position: relative;z-index: 5;background-color: #fff;padding: 120px 0 100px 0;}
.quick .inner::before{content: "";display: block;position: absolute;left:0;top:0;width:33%;height: 100%;max-width: 420px;background-color: #f7f9fb; z-index: 5;border-radius: 0 0 185px 0;}
.quickArea .titBox{position: relative;z-index: 10;padding: 5px 0 0 0;margin: 0 0 40px 0;}
.quickArea .titBox .tit{margin: 0 0 40px 0;}
.quickArea .titBox .tabMenu{padding: 0 20px 0 0;}
.quickArea .titBox .tabMenu li{position: relative; width: 322px;height: 60px;transform: translate(0, 0);margin: 0 0 6px 0;padding: 0 47px 0 0;border-radius: 15px 15px 35px 15px;overflow: hidden;}
.quickArea .titBox .tabMenu li.active::before{content: "";display: block;width: 11px;height: 22px;position: absolute;right:34px ;top:19px; background: url(../images/main/bg_tabBtn02.png) left top no-repeat;}
.quickArea .titBox .tabMenu li .tabBtn{display: block;width: 282px;height: 60px;padding: 20px 0 17px 30px; border-bottom:1px solid #e1e2e2 ;color:#4d4d4d;font-size: 22px;font-weight: 500;text-align: left;background: none;}
.quickArea .titBox .tabMenu li.active,
.quickArea .titBox .tabMenu li:hover{ background:  url(../images/main/bg_tabBtn01.png) left top no-repeat;background-size: cover;transition: all 0.5s;transform: translateY(-3px);box-shadow: 9px 7px 14px 4px rgba(0, 0, 0, 0.2);}
.quickArea .titBox .tabMenu li.active .tabBtn,
.quickArea .titBox .tabMenu li:hover .tabBtn{color: #fff;border-bottom: 0; transition: all 0.2s;}
.quickArea .tabContainer{position: relative;z-index: 10;}
.quickArea .tabContainer .tabCont{display: none;}
.quickArea .tabContainer .tabCont.active {display: block;}
.quickArea .tabContainer .tabCont .quickList{display: flex;flex-wrap: wrap;gap: 30px;}
.quickArea .tabContainer .tabCont .quickList > li{ position: relative;width: 23%;height: 220px;display: flex;align-content: center;flex-wrap: wrap;border:1px solid #e6e6e6;background-color: #fff;} 
.quickArea .tabContainer .tabCont .quickList > li > a {display: block;width:100%;text-align: center;padding: 10px;}
.quickArea .tabContainer .tabCont .quickList > li > a .icon{display: block;margin: 0 0 10px 0;}
.quickArea .tabContainer .tabCont .quickList > li > a strong{font-size: 21px;font-weight: 500;color:#4d4d4d;text-align: center;}
.quickArea .tabContainer .tabCont .quickList > li:hover{background: rgba(0, 0, 0, 0.3);}
.quickArea .tabContainer .tabCont .quickList > li:hover strong{color:#fff}

/*UOS News*/
.news{position: relative;}
.news::before{content: "";display: block;width:100%;background-color: #f4f6f9;height: calc(100% - 550px);position: absolute;top:245px;left:0;z-index: 1;}
.news .inner{position: relative; z-index: 5;padding: 70px 0 85px 0;}
.news .inner .titBox{margin:  0 0 38px 0;}
.newsList{display: flex;justify-content: space-between;flex-wrap: wrap;/*gap: 29px;*/}
.newsList li{position: relative;width: calc(33% - 29px);border-radius: 8px;margin: 0 0 13px 0;cursor: pointer;}
.newsList li a {display: block;width: 100%;height: 100%;}
.newsList li a .pic{position: relative; display: block;width: 100%;height: 0;padding-bottom: 52.991452%;background-color: #fff;margin: 0 0 22px 0;overflow: hidden;border-radius: 22px;}
.newsList li a .pic img{position: absolute;left: 0;top: 0;width: 100%;height: 100%; transition: all .5s;object-fit: cover;}
.newsList li a .pic::before{content: "";    display: block;width: 100%;height: 100%;text-align: center;background: rgba(0, 0, 0, 0.5);color: #fff;opacity: 0;transition: 0.3s;font-size: 19px;overflow: hidden;}
.newsList li a .sbj{height: 95px;font-size: 22px;color: #141414;font-weight: 500;}
.newsList li a .sbj p{overflow: hidden;line-height: 24px;height: 49px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;white-space: normal;text-overflow: ellipsis;margin: 0 0 10px 0}
.newsList li a .sbj .date{display: block;color: #7e7e7e;font-weight: 500;}
.newsList li a:hover .pic::before,
.newsList li a:focus .pic::before {opacity: 1;}
.hvr-style1 {display: inline-block;vertical-align: middle;transform: perspective(1px) translateZ(0);}

/*Research*/
.research{background: url(../images/main/bg_research01.jpg) no-repeat;background-attachment: fixed;background-size: cover;transition: .2s linear;}
.research .inner{display: flex;min-height: 820px;    flex-direction: column;justify-content: center;}
.research .inner .titBox .tit{color:#fff;margin: 0 0 145px 0;}
.research .inner .titBox .tit span::after{background-color: #fff;}
.researchList{display: flex;justify-content: space-between;}
.researchList li{width: calc(33.3% - 24px);text-align: center;padding: 82px 0 0 0;}
.researchList li.item1{background: url(../images/main/ico_research01.png) center top no-repeat;}
.researchList li.item2{background: url(../images/main/ico_research02.png) center top no-repeat;}
.researchList li.item3{background: url(../images/main/ico_research03.png) center top no-repeat;}
.researchList li .number{display: block;line-height: 73px; border-bottom: 1px solid #8d8f8c;font-size: 60px;font-weight: 500;color:#fff;margin:0 0 22px 0;}
.researchList li .title{display: block;line-height: 33px;font-size: 30px;font-weight: 500;color:#fff}

/*Quick Links*/
.qLinks{background: url(../images/main/bg_qlinks01.jpg) no-repeat;background-size: cover;}
.qLinks .inner{padding: 185px 0;}
.qLinks .inner .titBox .tit{color:#fff}
.qLinks .inner .titBox .tit span::after{background-color:#fff}
.qLinks .conBox .qLinksList{  display: flex;flex-wrap: wrap;justify-content: flex-start;gap: 24px;}
.qLinks .conBox .qLinksList li{width: calc(25% - 24px);padding: 30px 0 27px 0; background-color: rgba(78, 106, 159, 0.6);transform: translate(0, 0);transition: all 0.4s ease-out;}
.qLinks .conBox .qLinksList li h4{height: 50px;font-size: 25px;color: #fff;font-weight: 600; display: flex;justify-content: center;align-items: center;word-break: keep-all;padding: 0 10px;text-align: center;}
.qLinks .conBox .qLinksList li .ico{display: block;height: 88px; text-align: center;}
.qLinks .conBox .qLinksList li:hover{background: rgba(0, 0, 0, 0.3);transform: translateY(-5px);transition: all 0.4s ease-out;}

/*Service*/
.service{position: relative; background-color: #f5f5fa;}
.service .inner{overflow: hidden;position: relative;max-width: 1910px;}
.service .inner::before{content: "";display: block;width:445px ;height: 297px;position: absolute;left:0;top:0;background: url(../images/main/bg_service01.png) left top no-repeat;z-index: 1;}
.service .inner::after{content: "";display: block;width:383px;height: 856px;position: absolute;right:0;bottom:0;background: url(../images/main/bg_service02.png) left top no-repeat;z-index: 1;}
.service .inner .column{padding: 130px 0 155px 0;position: relative;z-index: 5;max-width: 1496px;margin:0 auto}
.service .inner .column .titBox{background: url(../images/main/bg_service03.png) 27px bottom no-repeat;}
.serviceArea{display: flex;justify-content: space-between;flex-wrap: wrap;}
.serviceArea .serviceCont{width: calc(33.3% - 24px);padding: 9px 30px 35px 30px;  background-color: #fff;}
.serviceArea .serviceCont h4{display: flex;align-items: center;justify-content: center;height: 65px;width: 100%;font-size: 32px;color: #1e1e1e;font-weight: 600;border-bottom: 2px solid #c7c9d8;}
.serviceArea .serviceCont ul{padding: 19px 0 0 0;}
.serviceArea .serviceCont ul li{margin: 0 0 5px 0}
.serviceArea .serviceCont ul li a{position: relative;  display: block;padding: 0 0 0 24px;  line-height: 22px;font-size: 18px;color: #4d4d4d;font-weight: 300;}
.serviceArea .serviceCont ul li a::before{content: "";display: block;width: 4px;height: 4px;position: absolute;left:10px;top:5px;background-color: #5b6dfe;}
.serviceArea .serviceCont ul li a:hover,
.serviceArea .serviceCont ul li a:focus{color: #183d86;font-weight: 600;}
.serviceArea .serviceCont ul li a.opennw::after{display: inline-block;margin-left: 5px;}

/*************************/

@media screen and (min-width: 1024px) {
    @keyframes hvr-style1 {
        50% {transform: scale(0.9);}
        100% {transform: scale(1);}
    }
    .hvr-style1:hover, 
    .hvr-style1:focus, 
    .hvr-style1:active {animation-name: hvr-style1;animation-duration: 0.3s;animation-timing-function: linear;animation-iteration-count: 1;}
}


@media screen and (max-width: 1555px) {
    .visualArea .sliderAcc .txt{margin-left: 15px;margin-bottom: 15px;}
    .visualArea .sliderAcc .ctl{margin-left: 15px;margin-bottom: 20px;}
    .visualArea .sliderAcc .ctl .slider-arr .bx-controls-direction .bx-prev{left:15px;}
    .visualArea .sliderAcc .ctl .slider-arr .bx-controls-direction .bx-next{left: 152px;}
    .visualArea .mSlider li .txt p{padding: 40px 15px;}



    .quick .inner{padding: 120px 15px 100px 15px;}
    .quickArea .tabContainer .tabCont .quickList > li{width: 22%;}
    .news .inner{padding: 70px 15px 80px 15px;}
    .qLinks .inner{padding:185px 15px;}
}

@media screen and (max-width: 1300px) {
    .column .inner .titBox{width: 260px;}
    .column .inner .conBox{width: calc(100% - 280px);}

    .quick .inner::before{width: 270px;}
    .quickArea .titBox .tabMenu li{width: 100%;}
    .quickArea .titBox .tabMenu li .tabBtn{padding-left: 15px;}
    .quickArea .tabContainer .tabCont .quickList{gap: 20px;}
    .quickArea .tabContainer .tabCont .quickList > li{width: calc(33.3% - 20px);}
    .qLinks .inner .titBox{width: 260px;}
    .service .inner .column .titBox{width: 260px;background-position: left bottom;}
    .service .inner .column .conBox{width: calc(100% - 260px);}
    .serviceArea .serviceCont{width: calc(33.3% - 5px);padding: 9px 10px 35px 10px;}
    
}

@media screen and (max-width: 1024px) {
    .mcontents{padding-top: 65px;}
    .column{display: block;}
    .column .titBox{width: 100%;}
    .column .conBox{width: 100%;}

    /* .mainCont{padding-top:65px ;} */
    .mSection .inner .titBox .tit{margin-bottom:40px ;}
    .mSection .inner .titBox .tit{font-size: 36px;}
    .mSection .inner .titBox .tit span{padding-right: 14px;}
    .mSection .inner .titBox .tit span::after{width:10px;height: 10px;}
    .mSection .inner .titBox .tit br{display: none;}
    .visualArea .sliderAcc{height: 22px;top:inherit;bottom: 0;}
    .visualArea .sliderAcc .txt{margin: 0 10px; text-align: center;}
    .visualArea .sliderAcc .txt p strong{font-size: 30px;}
    .visualArea .sliderAcc .txt p{font-size: 20px;}
    .visualArea .sliderAcc .ctl{position: absolute;bottom: 10px;left:50%;transform: translateX(-50%); margin:0 }
    .visualArea .sliderAcc .ctl .slider-arr .bx-controls-direction .bx-prev{left:0}
    .visualArea .mSlider li .txt{height: 100%;top:0;justify-content: center;padding-top: 70px;padding-bottom: 40px;}
    .visualArea .mSlider li .txt p{text-align: center;font-size: 20px;padding: 0 15px;}
    .visualArea .mSlider li .txt p strong{font-size: 30px;margin-bottom: 10px;}

    .quick .inner{padding: 60px 15px;}
    .quick .inner::before{width:100%;height: 100%;max-width: none;}
    .quickArea .titBox .tabMenu{display: flex;align-items: flex-end;height:60px; background-color: #585960;border-radius: 8px;margin-bottom: 15px;}
    .quickArea .titBox .tabMenu li{padding: 0;flex:1;height: 100%;margin-bottom:0;border-radius: 10px 10px 0 0;overflow: hidden;}
    .quickArea .titBox .tabMenu li.active{height: 70px;}
    .quickArea .titBox .tabMenu li.active, 
    .quickArea .titBox .tabMenu li:hover{box-shadow: none;transform: none;background-size: cover;}
    .quickArea .titBox .tabMenu li.active::before{display: none;}
    .quickArea .titBox .tabMenu li .tabBtn{position: relative;height: 100%; width: 100%;padding: 0 10px;text-align: center;border-bottom: 0;color:#fff;font-size: 18px;}
    .quickArea .titBox .tabMenu li:not(:first-child) .tabBtn::before{content: '';position: absolute;top: 50%;transform: translateY(-50%);left: 0;width: 2px;height: 30px;background-color: #87878c;}
    .quickArea .titBox .tabMenu li.active .tabBtn::before{display: none;}
    .quickArea .tabContainer .tabCont .quickList{gap: 10px;}
    .quickArea .tabContainer .tabCont .quickList > li{width: calc(33.3% - 10px);height: auto;}
    .quickArea .tabContainer .tabCont .quickList > li > a .icon{margin-bottom: 0;}
    .quickArea .tabContainer .tabCont .quickList > li > a .icon img{height: 60px;}
    .quickArea .tabContainer .tabCont .quickList > li > a strong{font-size: 16px;}
    .quickArea .tabContainer .tabCont .quickList > li:hover{background: none;}
    .quickArea .tabContainer .tabCont .quickList > li:hover strong{color:#4d4d4d}
    
    .news .inner{padding: 60px 15px;}
    .newsList li{width: calc(33% - 17px);}
    .newsList li a .sbj{font-size: 16px;line-height: 18px;height: auto;}
    .newsList li a .sbj p{line-height: inherit;height: 36px;}

    .research .inner{min-height: 500px;}
    .researchList li .number{font-size: 45px;}
    
    .qLinks .inner{padding: 60px 15px;}
    .qLinks .conBox .qLinksList li{width: calc(25% - 18px);padding: 20px 0;}
    .qLinks .conBox .qLinksList li h4{font-size: 18px;}
    .qLinks .conBox .qLinksList li .ico{height: 66px;}

    .service .inner .column{padding: 60px 0;}
    .service .inner .column .titBox{width: 100%;background: none;}
    .service .inner .column .conBox{width: 100%;}
    .serviceArea .serviceCont h4{font-size: 18px;height: 36px;}
    .serviceArea .serviceCont ul li a{font-size: 16px;}
}

@media screen and (max-width: 768px) {
    .newsList li{width: calc(48% - 1%);}
}

@media screen and (max-width: 640px) {
 
    .research{background-position:  50% 50%;}
    .research .inner{min-height: auto;padding: 50px 10px;}
    .research .inner .titBox{margin-bottom: 0;}
    .researchList li{padding-top: 42px;}
    .researchList li.item1,
    .researchList li.item2,
    .researchList li.item3{background-size: auto 35px;}
    .researchList li .number{font-size: 24px;margin-bottom: 10px;line-height: 44px;}
    .researchList li .title{font-size: 20px;line-height: 20px;}

    .qLinks{background-position: 50% 50%;}
    .qLinks .conBox .qLinksList{gap: 10px;}
    .qLinks .conBox .qLinksList li{width: calc(25% - 10px);padding: 10px 0;}
    .qLinks .conBox .qLinksList li h4{font-size: 15px;}
    .qLinks .conBox .qLinksList li .ico{height: 34px;}
    .qLinks .conBox .qLinksList li .ico img{height:32px ;}

    .serviceArea .serviceCont{width: calc(50% - 5px);margin-bottom: 10px;}
    .serviceArea .serviceCont:nth-child(3){width: 100%;}
}

@media screen and (max-width: 480px) {
    .mSection .inner .titBox .tit{font-size: 24px;margin-bottom:20px;}
    .mSection .inner .titBox .tit span{padding-right: 12px;}
    .mSection .inner .titBox .tit span::after{width:7px;height: 7px;bottom: 3px;}

    .visualArea .sliderAcc{top:0; bottom: inherit;height: 100%;display: flex;align-items: center;}
    .visualArea .sliderAcc .txt p strong{font-size: 18px;}
    .visualArea .sliderAcc .txt p{font-size: 14px;}
    .visualArea .sliderAcc .ctl{width: 100%;margin:0}
    .visualArea .sliderAcc .ctl{bottom: inherit;}
    .visualArea .sliderAcc .ctl .slider-counter{display: none;}
    .visualArea .sliderAcc .ctl .slider-arr .bx-controls-direction .bx-prev{left:0;width: 30px;height: 30px;background-color: rgba(0, 0, 0, 0.5);background-position: center;border-radius: 50%;background-size: 8px;}
    .visualArea .sliderAcc .ctl .slider-arr .bx-controls-direction .bx-next{left:inherit;right:0;width: 30px;height: 30px;background-color: rgba(0, 0, 0, 0.5);background-position: center;border-radius: 50%;background-size: 8px;}
  
    .visualArea .mSlider li .txt{padding-bottom: 0;}
    .visualArea .mSlider li .txt p{font-size: 14px;}
    .visualArea .mSlider li .txt p strong{font-size: 18px;margin-bottom: 5px;}

    .quick .inner::before{display: none}
    .quick .inner{padding: 30px 10px;    background-color: #f7f9fb;}
    .quickArea .titBox .tit{margin-bottom: 20px;}
    .quickArea .titBox .tabMenu{height: 48px;}
    .quickArea .titBox .tabMenu li.active{height: 54px;}
    .quickArea .titBox .tabMenu li .tabBtn{font-size: 14px;font-weight: 300;padding: 0 5px;}
    .quickArea .tabContainer .tabCont .quickList > li{width: 100%;height: auto;}
    .quickArea .tabContainer .tabCont .quickList > li > a{display: flex;justify-content: flex-start;align-items: center;padding: 3px 10px;}
    .quickArea .tabContainer .tabCont .quickList > li > a strong{font-size: 14px;text-align: left;}
    .quickArea .tabContainer .tabCont .quickList > li > a .icon{width:50px; margin: 0 5px 0 0;text-align: center;}
    .quickArea .tabContainer .tabCont .quickList > li > a .icon img{height: 45px;}

    .news .inner{padding: 30px 10px;}
    .news::before{display: none;}
    .news .inner .titBox{margin-bottom:20px ;}
    .newsList li{width: 100%;}
    .newsList li a .pic{height: 95px;margin-bottom: 15px;}
    .newsList li a .sbj{font-size: 14px;line-height: 14px;}
    .newsList li a .sbj p{height: 30px;}
    
    .researchList li{width: calc(33.3% - 10px);}
    .researchList li .number{font-size: 20px;line-height: 44px;}
    .researchList li .title{font-size: 15px;line-height: 15px;}

    .qLinks .inner{padding: 30px 10px;}
    .qLinks .conBox .qLinksList li h4{font-size: 14px;font-weight: 300;}

    .service .inner{padding: 30px 10px;}
    .serviceArea{display: block;}
    .service .inner .column{padding: 0;}
    .serviceArea .serviceCont{width: 100%;padding: 10px 5px;}
    .serviceArea .serviceCont ul{padding-top: 10px;}
    .serviceArea .serviceCont ul li a{font-size: 14px;}
}



