





/* html{
    scroll-behavior: smooth;
} */

#header .header_box.bk { background-color: rgba(255, 255, 255, .5); backdrop-filter: blur(6px); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05); }
#header .header_box.bk .h_logoBox a { background-image: url(/images/common/h_logo_a.png); }
#header .header_box.bk .dep1 .dep1_a { color: #222; }
#header .header_box.bk .rightBox .lang_box ul li a img { filter: none; }
#header .header_box .rightBox .lang_box ul li a span { color: #222; }
#header .header_box.bk .rightBox .lang_box ul li a span { color: #222; }
#header .header_box.bk .hamburger .line { background-color: #000; }

#section1 .sec1{background: url(/images/en/main/en_visual_banner1.jpg) no-repeat left center/cover; height: 100vh; position: relative;}
#section1 .sec1 p{position: absolute; left: 50%; transform: translateX(-50%); top: 26%; width: 100%;}


.photo_wrap{position: relative;}
.photo_wrap .m_photo{position: absolute; top: 0;}
.photo_wrap .m_photo.right{right: 0;}
.photo_wrap .m_photo.left{left: 0;}
.photo_wrap .con_account_box{padding-top: 210px;}
.photo_wrap .con_account_box p{margin: 30px 0 40px;}

.b_btn { padding: 15px 40px; display: inline-block; border-radius: 50px; position: relative; overflow: hidden; transition: all 0.5s cubic-bezier(0.55, 0.055, 0.675, 0.19); z-index: 2; border: 2px solid #328ae2; }
.b_btn::after { content: ''; display: block; background-color: #328ae2; width: 120%; height: 100%; position: absolute; top: 0; left: -130%; transform: skew(50deg); z-index: -1; transition: all 0.5s cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.b_btn span { vertical-align: sub; color: #328ae2; margin-right: 15px; transition: all 0.5s cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.b_btn img { vertical-align: middle; transition: all 0.5s cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.b_btn:hover { background-color: #fff; background-color: #328ae2; }
.b_btn:hover span { color: #fff;}
.b_btn:hover img { filter: brightness(0) invert(1); }
.b_btn:hover:after { left: 0; }

/* ========== section3 ========== */
#section5 .sec5 { position: relative; height: 100%; background: url(/images/main/main_sec3_bg.jpg) no-repeat center / cover; }
#section5 .sec5::after { content: ''; display: block; width: 100%; height: 100%; background-color: rgba(0, 0, 0, .5); position: absolute; top: 0; left: 0; right: 0; bottom: 0; }
#section5 .sec5 .w1180 { height: 100%; }
#section5 ul { position: relative; z-index: 10; height: 100%; border-right: 1px solid rgba(255, 255, 255, .2); border-left: 1px solid rgba(255, 255, 255, .2); }
#section5 ul li { width: 33.3333333%; text-align: center; height: 50%; }
#section5 ul li:not(:last-child, :nth-child(3)) { border-right: 1px solid rgba(255, 255, 255, .2); }
#section5 ul li:not(:nth-child(4), :nth-child(5), :nth-child(6)) { border-bottom: 1px solid rgba(255, 255, 255, .2); }
#section5 ul li > div { height: 100%; }
#section5 ul li > div > a { height: 100%; }

#section5 ul li .title_card { background-color: #52aea9; padding: 0 10px; }
#section5 ul li .title_card > * { color: #fff; }
#section5 ul li .title_card h3 { margin-bottom: 30px; }

#section5 ul li .default_card { transition: all 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955); }
#section5 ul li .default_card .img_box { margin-bottom: 35px; }
#section5 ul li .default_card .text_box > * { color: #fff; }
#section5 ul li .default_card .text_box.tb_over h6 { margin-bottom: 20px; }
#section5 ul li .default_card .text_box.tb_over{display: none;}
/* hover */
#section5 ul li .default_card:hover { background-color: #328ae2; }
#section5 ul li .default_card:hover .img_box{display: none;} 
#section5 ul li .default_card:hover .text_box{text-align: left;}
#section5 ul li .default_card:hover .text_box.tb_nover{display: none;} 
#section5 ul li .default_card:hover .text_box.tb_over{display: block;}
/* ========== section3 ========== */

#section6{background: #f1f4fa;}
#section6 .fp-tableCell{vertical-align: top;}
#section6 .sec6{padding-top: 200px;}
#section6 .sec6 .checkup{margin: 70px 0 160px;}
#section6 .sec6 .checkup li{ width: 31%; margin-bottom: 4%;}
#section6 .sec6 .checkup li .txt_box{background: #fff; padding: 25px; min-height: 310px;}
#section6 .sec6 .checkup li .txt_box h5{margin-bottom: 15px;}
#section6 .sec6 .bottomBox { position: relative; margin-top: 70px; }
#section6 .sec6 .bottomBox .sec5_swiper { position: static; overflow: hidden; }
#section6 .sec6 .bottomBox .sec5_next{ right: -100px;}
#section6 .sec6 .bottomBox .sec5_prev{ left: -100px;}
#section6 .sec6 .bottomBox .sec5_next,
#section6 .sec6 .bottomBox .sec5_prev { width: 46px; height: 46px; background-size: 46px 46px; }
#section6 .sec6 .bottomBox .sec5_next { background-image: url(/images/en/icon/main_sec5_next.png); transition: 0.3s;}
#section6 .sec6 .bottomBox .sec5_prev { background-image: url(/images/en/icon/main_sec5_prev.png); transition: 0.3s;}
#section6 .sec6 .bottomBox .sec5_next:hover { background-image: url(/images/en/icon/main_sec5_next_hover.png); }
#section6 .sec6 .bottomBox .sec5_prev:hover { background-image: url(/images/en/icon/main_sec5_prev_hover.png); }
#section6 .sec6 .bottomBox img{margin-bottom: 30px;}

/* .b_btn { padding: 15px 40px; display: inline-block; border-radius: 50px; position: relative; overflow: hidden; transition: all 0.5s cubic-bezier(0.55, 0.055, 0.675, 0.19); z-index: 2; border: 2px solid #328ae2; } */

.slider_thumbnail .swiper-wrapper { flex-wrap: wrap; transform: translate3d(0px, 0px, 0px) !important; }

/* ========== section6 ========== */
#section7 { height: auto !important; }
#section7 .fp-tableCell { height: auto !important; }
/* ========== section6 ========== */

@media screen and (max-width: 1600px){
    .photo_wrap .m_photo{width: 50%;}
    .photo_wrap .con_account_box{position: relative;}
}
@media screen and (max-width: 1440px){
    #section6 .sec6 .bottomBox .sec5_next{ right: 0;}
    #section6 .sec6 .bottomBox .sec5_prev{ left: 0;}
    #section5 .bottomBox{padding: 0 80px;}
}
@media screen and (max-width: 960px){
    #header .header_box{justify-content: space-between;}
    #header .header_box.bk{justify-content: space-between;}
    #section6 .sec6{padding-top: 100px;}
    #section6 .sec6 .checkup li{width: 48%;}
    #section6 .sec6 .contact_inner h4{width: 100%; margin-bottom: 5%;}

}

@media screen and (max-width: 768px){
    #section2 .sec2 { padding-top: 75px; padding-bottom: 70px; }
    #section3 .sec3 { padding-top: 75px; padding-bottom: 70px; }    
    #section4 .sec4 { padding: 75px 0; }
    /* ========= section3 ========= */
    #section5 ul li { width: 50%; height: 468px; }
    #section5 ul li:not(:nth-child(4), :nth-child(5), :nth-child(6)) { border-bottom: none; }
    #section5 ul li:not(:last-child, :nth-child(3)) { border-right: none; }
    #section5 ul li:not(:last-child, :nth-child(5)) { border-bottom: 1px solid rgba(255, 255, 255, .2); }
    #section5 ul li:not(:nth-of-type(even)) { border-right: 1px solid rgba(255, 255, 255, .2); }
    /* ========= section3 ========= */

    #section5 ul li .default_card:hover { background-color: transparent; }
    #section5 ul li .default_card:hover .img_box{display: block;} 
    #section5 ul li .default_card:hover .text_box{text-align: center;}
    #section5 ul li .default_card:hover .text_box.tb_nover{display: block;} 
    #section5 ul li .default_card:hover .text_box.tb_over{display: none;}

    .photo_wrap .m_photo{width: 70%;}
    .photo_wrap .con_account_box { padding-top: 70vw; }
    .b_btn{padding: 3% 9%;}
    .b_btn span{vertical-align: middle;}

    #section6 .sec6 .checkup li .txt_box{padding: 15px; min-height: 200px;}
    #section6 .sec6 .bottomBox img{width: 90px;}
    #section6 .sec6 .sec5_slide {text-align: center;}
    #section6 .sec6 .checkup{margin: 30px 0 70px;}
    #section6 .sec6 .checkup li .txt_box h5{margin-bottom: 8px;}
}

@media screen and (max-width: 500px){
    /* ========= section3 ========= */
    #section5 ul li { width: 50%; height: 250px; }
    #section5 ul li .title_card h3 { margin-bottom: 15px; }

    #section5 ul li .default_card .img_box { margin-bottom: 20px; }
    #section5 ul li .default_card .img_box img { width: 100px; }
    #section5 ul li .default_card .text_box.tb_over h6 { margin-bottom: 10px; }
    /* ========= section3 ========= */

    #section6 .bottomBox .sec5_next, 
    #section6 .bottomBox .sec5_prev { display: none; }
    .photo_wrap .con_account_box { padding-top: 54vw;}
    #section6 .sec6 .checkup li .txt_box{min-height: 300px;}
}



