/* header */
header {padding:30px 5%; position:fixed; left:0; top:0; width:100%; z-index:1000; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; transition:all ease 0.5s;}
header h1 a {font-size:32px; font-weight:700; color:#fff !important; transition:all ease 0.5s;}
header ul {display:flex; flex-wrap:wrap; align-items:center; gap:42px;}
header ul li a {font-size:20px; font-weight:700; color:#fff !important; transition:all ease 0.5s;}
header ul li a:hover {text-decoration:underline;}
header button {display:none; transition:all ease 0.5s;}
header.scroll {background:#fff; box-shadow:0 0 10px rgba(0,0,0,0.05);}
header.scroll h1 a {color:#000 !important;}
header.scroll ul li a {color:#000 !important;}
header.bg-white {background:#fff; box-shadow:0 0 10px rgba(0,0,0,0.05);}
header.bg-white h1 a {color:#000 !important;}
header.bg-white ul li a {color:#000 !important;}
header ul li.active a {color:#FF9D00 !important;}
@media (max-width:1300px){
header {padding:20px 15px;}
header h1 a {font-size:25px;}
header ul {gap:15px;}
header ul li a {font-size:18px;}
}
@media (max-width:991px){
header {padding:15px;}
header h1 a {font-size:20px; text-align:center;}
header ul {pointer-events:none; opacity:0; transition:all ease 0.5s; position:fixed; left:0; top:0; width:100%; height:100%; background:#000; display:flex; flex-wrap:wrap; align-items:center; align-content:center; justify-content:center;}
header ul li {width:100%;}
header ul li a {display:block; text-align:center; font-size:24px;}
header button {display:block; font-size:0; width:28px; height:28px; filter:var(--filter-white); background:url('../images/icon_menu.svg') no-repeat center / cover;}
header.fixed button {background-image:url('../images/icon_close.svg'); filter:var(--filter-white) !important;}
header.fixed ul {pointer-events:inherit; opacity:1;}
header.scroll button {filter:var(--filter-black);}
header.scroll ul li a {color:#fff !important;}
header.bg-white button {filter:var(--filter-black);}
header.bg-white ul li a {color:#fff !important;}
}

/* footer */
footer {background:#000; padding:60px 0;}
footer .footer-top h2 {font-size:24px; font-weight:700; margin:0 0 24px; line-height:1; color:#fff;}
footer .footer-top ul {display:flex; flex-wrap:wrap; gap:24px;}
footer .footer-top ul li {display:flex; flex-wrap:wrap; gap:12px;}
footer .footer-top ul li b {font-weight:600; color:#d9d9d9;}
footer .footer-top ul li p {font-weight:500; color:#fff;}
footer .footer-bottom {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; border-top:1px solid #303030; padding:42px 0 0; margin:42px 0 0;}
footer .footer-bottom p {font-size:12px; font-weight:500; color:#d9d9d9;}
footer .footer-bottom ul {display:flex; flex-wrap:wrap; align-items:center; gap:12px;}
footer .footer-bottom ul li a {font-size:14px; color:#d9d9d9; font-weight:500;}
footer .footer-bottom ul li a:hover {color:#fff; text-decoration:underline;}
@media (max-width:991px){
footer {padding:35px 0;}
footer .footer-top h2 {font-size:20px;}
footer .footer-top ul {gap:5px;}
footer .footer-top ul li {gap:8px; width:100%;}
footer .footer-top ul li b {font-size:13px;}
footer .footer-top ul li p {font-size:13px; flex:1; min-width:0; word-break:keep-all;}
footer .footer-bottom {padding:24px 0 0; margin:24px 0 0; gap:5px;}
footer .footer-bottom p {font-size:11px; width:100%;}
footer .footer-bottom ul {gap:8px; width:100%;}
footer .footer-bottom ul li a {font-size:12px;}
}

/* main-banner */
.main-box .main-banner {min-height:80vh; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; background:url('../images/bg_main_banner.png') no-repeat center / cover;}
.main-box .main-banner h2 {font-size:70px; line-height:1; text-align:center; color:#fff; font-weight:700;}
.main-box .main-banner p {margin:42px 0 0; font-size:28px; font-weight:500; text-align:center; word-break:keep-all; color:#fff;}
@media (max-width:991px){
.main-box .main-banner h2 {font-size:35px;}
.main-box .main-banner p {margin:24px 0 0; font-size:18px;}
}
@media (max-width:767px){
.main-box .main-banner h2 {font-size:30px;}
.main-box .main-banner p {font-size:15px; margin:15px 0 0;}
}

/* main-card */
.main-box .main-card {margin:80px 0 0;}
.main-box .main-card ul li {margin:0 0 80px; display:flex; flex-wrap:wrap; gap:80px;}
.main-box .main-card ul li:last-of-type {margin:0;}
.main-box .main-card ul li .list-image {flex:1; min-width:0;}
.main-box .main-card ul li .list-image img {width:100%;}
.main-box .main-card ul li .list-content {flex:1; min-width:0; display:flex; flex-wrap:wrap;}
.main-box .main-card ul li .list-content strong {font-size:42px; font-weight:700; word-break:keep-all; width:100%;}
.main-box .main-card ul li .list-content p {font-size:28px; font-weight:500; word-break:keep-all; width:100%; margin:15px 0 0;}
.main-box .main-card ul li .list-content p b {font-size:28px; font-weight:600; color:#0059FF;}
.main-box .main-card ul li .list-content span {width:100%; display:block; font-size:20px; word-break:keep-all; color:#333; margin:15px 0 0;}
.main-box .main-card ul li .list-content a {height:44px; font-size:16px; color:#333; justify-content:center; display:flex; flex-wrap:wrap; align-items:center; border-radius:4px; border:1px solid #888; margin:42px 0 0; padding:0 42px;}
.main-box .main-card ul li .list-content a:after {display:inline-block; content:""; width:24px; height:24px; margin:0 0 0 10px; background:url('../images/icon_main_card_more.svg') no-repeat center / cover;}
.main-box .main-card ul li .list-content a:hover {background:#333; color:#fff;}
.main-box .main-card ul li .list-content a:hover:after {filter:var(--filter-white);}
.main-box .main-card ul li:nth-of-type(odd) {flex-direction:row-reverse;}
@media (max-width:1200px){
.main-box .main-card ul li {gap:40px;}
.main-box .main-card ul li .list-content strong {font-size:35px;}
.main-box .main-card ul li .list-content p {font-size:24px;}
.main-box .main-card ul li .list-content p b {font-size:24px;}
.main-box .main-card ul li .list-content span {font-size:17px;}
.main-box .main-card ul li .list-content a {font-size:14px; margin:30px 0 0;}
}
@media (max-width:991px){
.main-box .main-card {margin:50px 0 0;}
.main-box .main-card ul li {margin:0 0 50px; gap:15px;}
.main-box .main-card ul li .list-image {flex:none; width:100%;}
.main-box .main-card ul li .list-content {flex:none; width:100%;}
.main-box .main-card ul li .list-content strong {font-size:22px;}
.main-box .main-card ul li .list-content p {font-size:16px;}
.main-box .main-card ul li .list-content p b {font-size:16px;}
.main-box .main-card ul li .list-content span {font-size:14px;}
.main-box .main-card ul li .list-content a {height:40px; padding:0 24px; font-size:13px; margin:15px 0 0;}
.main-box .main-card ul li .list-content a:after {width:20px; height:20px; margin:0 0 0 5px;}
}

/* main-solution */
.main-box .main-solution {margin:80px 0;}
.main-box .main-solution .inner {padding:40px; border-radius:200px; background:url('../images/bg_main_solution.png') no-repeat center / cover;}
.main-box .main-solution .inner h2 {text-align:center; font-size:40px; font-weight:700; color:#fff; word-break:keep-all;}
.main-box .main-solution .inner p {margin:10px 0 0; font-size:24px; font-weight:500; color:#fff; text-align:center; word-break:keep-all;}
.main-box .main-solution .inner a {width:150px; height:45px; border:1px solid #fff; font-size:18px; font-weight:600; color:#fff; border-radius:5px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; margin:15px auto 0;}
.main-box .main-solution .inner a:after {display:inline-block; content:""; width:24px; height:24px; margin:0 0 0 5px; background:url('../images/icon_main_card_more.svg') no-repeat center / cover; filter:var(--filter-white);}
.main-box .main-solution .inner a:hover {background:#fff; color:#000;}
.main-box .main-solution .inner a:hover:after {filter:none;}
@media (max-width:1200px){
.main-box .main-solution .inner h2 {font-size:35px;}
.main-box .main-solution .inner p {font-size:20px;}
.main-box .main-solution .inner a {font-size:15px;}
}
@media (max-width:991px){
.main-box .main-solution {margin:50px 0 0;}
.main-box .main-solution .inner {border-radius:0; padding:40px 15px; margin:0 -15px;}
.main-box .main-solution .inner h2 {font-size:22px;}
.main-box .main-solution .inner p {font-size:16px;}
.main-box .main-solution .inner a {width:120px; height:40px; font-size:14px;}
.main-box .main-solution .inner a:after {width:20px; height:20px;}
}