@charset "utf-8";

@font-face{
    font-family: DM_Sans;
    src: url(../fonts/DM_Sans/DMSans-Regular.ttf) format("truetype");
    font-weight: 400;
}
 
*{font-family: DM_Sans, sans-serif;}

html {width: 100%; height: 100%;}
body {font-family: DM_Sans, sans-serif; font-size: 18px; color: #fff; line-height: 1.1; margin: 0 auto; padding: 0; box-sizing: border-box; width: 100%; max-width: 1920px; height: 100%; background: #fff; overflow-x: hidden; word-break: keep-all;}

a {color: #111; box-sizing: border-box; border-bottom: 2px solid transparent;}
a:link {text-decoration: none;}
a:visited {text-decoration: none;}
a:hover {text-decoration:none;}
a:hover {color: #111; text-decoration: none;}
p, ul, li {margin: 0; padding: 0;}
h1, p {word-break:keep-all}
li {list-style: none;}
/* h1 span {font-size: 2rem;} */

.bold_500 {font-weight: 500;}
.bold_700 {font-weight: 700;}
.bold_900 {font-weight: 900;}

.container_800 {margin: 0 auto; padding: 0 1%; width: 100%; max-width: 800px;}
.container_1000 {margin: 0 auto; padding: 0 1%; width: 100%; max-width: 1000px;}
.container_1100 {margin: 0 auto; padding: 0 1%; width: 100%; max-width: 1100px;}
.container_1400 {margin: 0 auto; padding: 0 1%; width: 100%; max-width: 1400px;}
.container_1600 {margin: 0 auto; padding: 0 1%; width: 100%; max-width: 1600px;}
.container_1800 {margin: 0 auto; padding: 0 1%; width: 100%; max-width: 1800px;}
.img100 {width: 100%; height: auto;}
.row {margin-left: 0 !important; margin-right: 0 !important;}
.row_r {flex-direction: row-reverse !important;}
.hidden {height:100%; min-height:100%; overflow:hidden !important; touch-action:none;}
.po_rel {position: relative; top: 0;}
.po_abs {position: absolute;}
.web_show {display: block;}
.mob_show {display: none;}
.opcity_0 {opacity: 0;}

.navbar {position: fixed; top: 0; left: 0; right: 0; z-index: 100; color: #111; margin: 0 auto; padding: 1% 4%; width: 100%; max-width: 1920px; background: none; transition: all 0.3s;}
.scroll {padding: 0 4%; background: rgba(0, 0, 0, 0.9) !important; box-shadow: -0.0625rem 0 0.625rem 0 rgba(0,0,0,0.07),0.3125rem 1.25rem 2.5rem 0 rgba(0,0,0,0.04) !important;}
.navbar-nav {padding-right: 4rem;}
.top_logo {width: 100%; max-width: 234px;}
.nav-item {font-weight: 500; color: #fff; padding: 1.5rem 0 !important; margin: 0 2rem !important; border-bottom: 2px solid transparent; cursor: pointer; text-transform: uppercase; display: block;}
.nav-item:hover, .nav-item.active {font-weight: 900; color: #2f99fd;}
.dropdown > a  {color: #fff; padding: 0.3rem 2rem; border-radius: 2rem; border: 1px solid #fff; cursor: pointer;}
.dropdown.mob_show > a  {padding: 0.3rem; border-radius: 2rem; background: none; border: none; cursor: pointer;}
.dropdown-menu a {color: #111;}
.ct_select {color: #fff; padding: 0.3rem 2rem; border-radius: 2rem; border: none; background-color: #2f99fd; cursor: pointer;}
.navbar i {color: #fff;}
.mob_nav_blur {position: fixed; top: 0; left: 0; right: 0; z-index: 99; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.8);display: none;}

.sub_title_img {margin: 0 auto; width: 100%; max-width: 1920px; height: 400px; background-size: contain;}

.sections {margin: 0 auto; width: 100%; max-width: 1920px; padding: 15% 0 5%;}
.sub_sections {margin: 0 auto; width: 100%; max-width: 1920px; margin: 10% 0; background-color: #fff;}


.section03 {background: url(../imgs/sec03_bg.jpg) center top no-repeat; background-size: cover;}
/* .section03 > div {margin-top: 2%;} */
.sec03_texts_box {text-align: left;}
.sec03_title {font-weight: 600; color:#fff; font-size: 3em; margin: 0 0 40%; width: 100%;}
.sec03_texts_box p:nth-child(1) {margin: 10% 0 3%; color: #2f99fd;}
/* .sec03_texts_box p:nth-child(2) {color: rgba(255, 255, 255, 0.8); margin-bottom: 3%; width: 70%;} */
/* .sec03_texts_box .download_btn div:nth-child(1){padding-right:0;}
.sec03_texts_box .download_btn div:nth-child(2){padding-left:0;} */
/* .sec03_texts_box .download_btn a{display: block;}
.sec03_texts_box .download_btn img{width:90%; box-shadow: 0 0 15px rgba(0,0,0,.7);} */
.sec03_btns {margin-top: 10%;}
.sec03_btns img {margin: 5% 2% 0 0;}
.sec03_btn_img {width: 100%; max-width: 285px; filter: drop-shadow(0 0 0.5em rgba(0, 0, 0, 0.2));}
.version {font-size: 0.9rem; color: rgba(255, 255, 255, 0.7); text-align: left; margin-top: 3%;}
.section03 .phone_img_wrap {text-align: right;}
.section03 .phone_img {width: 80%; max-width: 1713px;}
/* .user_guide {padding-left: 3%;} */
.user_guide li {padding: 1% 2%; margin: 2% 0; width: fit-content; border-radius: 3px; background: rgba(0, 0, 0, 0.7);}
.user_guide a {font-size: 0.9rem; color: #fff;}


.footer_wrap {color: #fff;}
.footer_wrap > div {padding: 2% 0;}
.footer_logo_wrap {margin-bottom: 5%;}
.footer_logo {max-width: 180px; opacity: 0.5;}
.footer_menu_wrap li {color: #fff; text-align: center; padding: 1%; cursor: pointer;}
.footer_menu_wrap li:last-child {border-right: none !important;}
.copyright {font-size: 0.8rem; margin-top: 10%; margin-left: 8%;}


.img_modal_bg {position: fixed; top: 0; left: 0; right: 0; z-index: 1000; margin: 0 auto; width: 100%; max-width: 1920px; height: 100%; background: rgba(0, 0, 0, 0.9); display: none;}

.img_modal {width: 100%; max-width: 900px; margin: 30% auto; box-sizing: border-box; background: #fff; box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.5);}
.img_modal img {width: 100%;}

.video_modal_bg {position: fixed; top: 0; left: 0; right: 0; z-index: 1000; margin: 0 auto; width: 100%; max-width: 1920px; height: 100%; background: rgba(0, 0, 0, 0.9); display: none;}
.video_modal_wrap {width: 100%; max-width: 900px; margin: 13.75% auto; box-sizing: border-box; box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.5);}  
.video_modal {position: relative; width: 100%; height: auto; padding-bottom: 56.25% }

iframe {z-index: 1; top: 0; left: 0; position: absolute; width: 100%; height: 100%;}



/* @media all and (max-width: 1340px) {
    .nav-item {margin: 0 1rem !important;}
} */

@media all and (max-width: 1200px) {
    .navbar-nav {padding-right: 0;}

    .card_texts {padding: 30% 5% 5% 5%;}
}

@media all and (max-width: 1000px) {
    .main_texts_box, .section02 {padding-left: 3% !important; padding-right: 3% !important;}
    /* .sec03_title {margin-top: 0;} */
}

@media all and (min-width: 992px) {
    .mob_nav_blur {display: none !important;}
}

@media all and (max-width: 974px) {
    .web_show {display: none;}
    .mob_show {display: block;}

    .navbar {padding-top: 0.5%; padding-bottom: 0.5%;}
    .navbar-nav {justify-content: center !important;}
    .nav-item, .dropdown {width: fit-content !important;}
    .dropdown {margin: 2% 0;}
    .navbar-collapse {margin-bottom: 3%;}

    .no_padding_img {padding-left: 15px !important;}

    .sub_title_img {height: 250px;}

    .main {height: 70vh;}

    .section01 .row > div:nth-child(1) {margin-bottom: 5%;}
    .section01 .row > div:nth-child(2) {margin-bottom: 5%;}

    .phone_img_wrap {text-align: center !important; margin-top: 10%;}
    .version {text-align: center; margin-top: 0; margin: 3% 0 5%;}
    .user_guide li {margin: 2% auto;}

    .footer_wrap {text-align: center !important;}
    .copyright {margin: 5% 0; margin-left: 0;}
}

@media all and (max-width: 768px) {
    .top_logo {max-width: 144px;}

    .card_texts {padding: 10% 5% 5% 5%;}

    .footer_logo_wrap {text-align: center; padding: 3% 0;}
    .footer_logo {margin: 3% 0;}
    .footer_menu_wrap {display: block;}
    .footer_wrap ul {padding: 3% 0;}
    .footer_wrap ul li {border-right: none; margin: 2% 0;}
}

@media all and (max-width: 576px) {
    body {font-size: 14px;}
    /* p {line-height: 1.3 !important;} */
    .nav-item a {padding: .5rem 0 !important;}
    .sections {padding: 20% 0;}

    .main {height: 60vh;}
    .main_title, .sec03_title {font-size: 3rem;}

    .sec01_title, .sec02_title {font-size: 2rem;}
    
    .video_modal_wrap {margin-top: 50%;}
}