@charset "UTF-8";


.main_wrap{position: relative;}
.main_aside{position: absolute; top: 197px; right: 0; width: 60px; height: 370px;  background-color: #00a0ec; z-index: 2;}
.main_aside:hover{background-color: #0fb2ff;}
.main_aside a{
    font-size: 21px; color: #fff; writing-mode: vertical-lr; text-align: center; display: block;
    background: url('/web/images/main/main_contact_icon.png') no-repeat top center; padding-top: 33px;
    letter-spacing: -4px; margin: 70px auto 0; 
}
.slide_textBox{max-width: 1200px; margin: 0 auto; color: #fff; position: absolute; top: 140px; left: 0; right: 0;}
.page_num{font-size: 20px; font-weight: 500; color: rgba(255,255,255,0.5); margin-bottom: 20px;}
.page_num span{vertical-align: baseline; color: rgba(255,255,255,1); margin-right: 5px;}
.slide_textBox p{font-size: 20px; font-weight: 500; margin-bottom: 15px;}
.slide_textBox h2{font-size: 58px; font-weight: 600; margin-bottom: 40px;}
.slide_textBox ul{font-size: 18px; font-weight: 200; line-height: 1.5; margin-bottom: 55px;}
.slide_textBox a{
    display: block; width: 154px; height: 46px; border: 1px solid #fff; color: #fff; font-size: 18px; font-weight: 200;
    text-align: center; line-height: 46px; box-sizing: border-box;
}
.slide_textBox a:hover{background-color: #008bf4; font-weight: 500; border-color: #008bf4;}
/* slide section */

.main_shortcut{max-width: 1200px; margin: 80px auto; display: flex; justify-content: space-between;}
.main_business{width: 48.7%; background: url('/web/images/main/main_con01.jpg') no-repeat left top;}
.main_business:hover{background-image: url('/web/images/main/main_con_hover01.jpg');}
.main_business a{display: block; width: 100%; padding: 440px 0 45px 45px; box-sizing: border-box; color: #fff;}
.main_business a span,
.shortcut_subBox div a span{
    font-size: 25px; font-weight: 600; text-transform: uppercase; margin-bottom: 18px; display: block;
}
.main_business a p,
.shortcut_subBox div a p{font-size: 18px; font-weight: 400; line-height: 1.5;}
.shortcut_subBox{width: 48.7%;}
.shortcut_subBox div a{padding: 173px 0 50px 37px; box-sizing: border-box; color: #fff; display: block;}
.main_protector{background: url('/web/images/main/main_con02.jpg') no-repeat left top; margin-bottom: 10px;}
.main_protector:hover{background-image: url('/web/images/main/main_con_hover02.jpg');}
.main_procedure{background: url('/web/images/main/main_con03.jpg') no-repeat left top;}
.main_procedure:hover{background-image: url('/web/images/main/main_con_hover03.jpg');}





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


    .slide_textBox{width: 95%;}
    .main_shortcut{width: 90%;}
    .main_business,
    .main_protector, .main_procedure{background-position: center top;}
    .main_business:hover,
    .main_protector:hover,
    .main_procedure:hover{background-position: left top;}
    .main_business a{padding: 440px 15px 30px;}
    .main_business a p{font-size: 16px;}
    .shortcut_subBox div a{padding: 165px 15px 30px;}


}




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


    .slider div img{width: 100%;}
    .slide_textBox{width: 90%; top: 58px;}
    .page_num{font-size: 12px; margin-bottom: 10px;}
    .slide_textBox p{font-size: 10px; margin-bottom: 11px;}
    .slide_textBox h2{font-size: 25px; margin-bottom: 23px;}
    .slide_textBox ul{font-size: 10px; margin-bottom: 20px;}
    .m_br{display: block;}
    .slide_textBox a{width: 77px; height: 23px; font-size: 10px; line-height: 23px;}
    .slick-dots{bottom: 20px !important;}
    .slick-dots li{margin: 0 3px !important;}
    .slick-dots li,
    .slick-dots li button,
    .slick-dots li button:before{width: 7px !important; height: 7px !important;}

    .main_aside{top: 100px; width: 30px; height: 185px;}
    .main_aside a{font-size: 12px; background-size: contain; padding-top: 15px; margin: 35px auto 0;}

    .main_shortcut{margin: 29px auto; display: block;}
    .main_business{margin-bottom: 10px;}
    .main_business,
    .main_business:hover{width: 100%; background: url('/web/images/main/m_main_con01.jpg') no-repeat center;}
    .main_business a,
    .shortcut_subBox div a{padding: 77px 20px 20px;}
    .main_business a span, .shortcut_subBox div a span{font-size: 13px; margin-bottom: 8px;}
    .main_business a p,
    .main_business a p, .shortcut_subBox div a p{font-size: 10px;}
    .shortcut_subBox{width: 100%;}
    .main_protector,
    .main_protector:hover{background: url('/web/images/main/m_main_con02.jpg') no-repeat left top;}
    .main_procedure,
    .main_procedure:hover{background: url('/web/images/main/m_main_con03.jpg') no-repeat center;}

}