@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap");
body { font-family: "Inter"; font-size: 16px; font-weight: 400; margin: 0; padding: 0; color: #0A2240; position: relative; }
a { transition: all 0.3s; }
ul { list-style-type: none; }
ul li { list-style-type: none; }
.fade-backdrop { z-index: 2; background: #000; opacity: 0.5; position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; display: none; }
.block-page { overflow: hidden; }
.bg-blue { background: #0A2240; }
.bg-dack-gold { background: #B6A999; }
.bg-light-gray { background: #F8F8FA !important; }
.bg-gray { background: #ECECF2; }
.pink-color { color: #FFA489; }
.blue-color { color: #0A2240 !important; }
.gray-color { color: #797F94; }
.red-color { color: #FF0000; }
.light-gray-color { color: #CACADD; }
.bold-6 { font-weight: 600; }
.bold-7 { font-weight: 700; }
.py-lg-104 { padding-top: 104px; padding-bottom: 104px; }
.h-100 { height: 100%; }
.w-60 { width: 60%; }
.w-40 { width: 40%; }
.fixed-top-1 { position: fixed; top: 0; right: 0; left: 0; z-index: 1030; }
.fixed-top-2 { position: fixed; top: 0; right: 0; left: 0; z-index: 1030; }
.nav-up { top: -140px; }
.navbar { width: 100%; display: flex; margin: 0; padding: 0; transition: 0.4s; }
.navbar-top { width: 100%; padding: 12px 0; color: #fff; }
.navbar .logo-kingkoll { padding: 16px 0; width: 230px; text-align: center; }
.navbar .logo-kingkoll img { width: 100%; height: auto; max-height: 59px; }
.navbar .all-nav-kingkoll { width: 100%; display: flex; flex-wrap: inherit; justify-content: space-between; border-top: 1px solid rgba(255, 255, 255, 0.3); padding: 0; }
.navbar .nav-kingkoll { margin: 0; padding: 0; list-style-type: none; display: flex; justify-content: space-between; }
.navbar .nav-kingkoll li { display: block; margin: 0; padding: 18px 25px; }
.navbar .nav-kingkoll li:hover .sub-nav-1 { top: 72px; visibility: visible; opacity: 1; }
.navbar .nav-kingkoll li:first-child { padding-left: 0; }
.navbar .nav-kingkoll li a { color: #fff; font-size: 16px; font-weight: 400; padding: 15px 0; text-decoration: none; display: block; font-family: "Inter"; position: relative; }
.navbar .nav-kingkoll li a:hover, .navbar .nav-kingkoll li a:focus { color: #fff; text-decoration: none; }
.navbar .nav-kingkoll li a:hover::after, .navbar .nav-kingkoll li a:focus::after { width: 30px; height: 2px; background: #ffffff; position: absolute; left: 50%; bottom: 7px; transform: translateX(-50%); -webkit-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: 2px; border-radius: 2px; content: ''; }
.navbar .nav-kingkoll li .sub-menu { width: 100%; position: absolute; margin: 0; padding: 3rem 0 0 0; left: 0; top: 130px; display: none; z-index: 2; background: #fff; }
.navbar .nav-kingkoll li .sub-menu .tt-bst { font-family: "Lora"; font-size: 24px; font-weight: 600; line-height: 180%; padding: 0; }
.navbar .nav-kingkoll li .sub-menu ul { margin: 0; padding: 0; display: flex; flex-wrap: wrap; width: 100%; }
.navbar .nav-kingkoll li .sub-menu ul > li { margin: 0; padding: 0; width: 50%; }
.navbar .nav-kingkoll li .sub-menu ul > li:first-child { border-top: none; }
.navbar .nav-kingkoll li .sub-menu ul > li > a { padding: 6px 0; text-decoration: none; display: block; color: #353D49; }
.navbar .nav-kingkoll li .sub-menu ul > li > a:hover { text-decoration: none; }
.navbar .nav-kingkoll li .sub-menu ul > li > a:hover::after { display: none !important; }
.navbar .nav-kingkoll li .sub-menu ul > li > a .new { width: 46px; height: 25px; background: #FFA489; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; text-align: center; color: #fff; font-size: 12px; padding: 4px 10px; }
.navbar .nav-kingkoll li .sub-menu ul > li > a .new:hover::after { display: none !important; }
.navbar .nav-kingkoll li .sub-menu ul > li.ship-mb { background: #0A2240; }
.navbar .nav-kingkoll li .sub-menu ul > li.ship-mb a { color: #fff; }
.navbar .nav-kingkoll li .sub-menu ul > li.ship-mb a i { font-size: 16px; margin-right: 5px; }
.navbar .nav-kingkoll li .sub-menu .box-ship { width: 100%; padding: 16px; border-top: 1px solid #ECECF2; background: #F8F8FA; display: flex; justify-content: center; }
.navbar .nav-kingkoll li .sub-menu .box-ship > a { display: block; width: max-content; color: #020D1B; text-decoration: none; margin: 0 40px; padding: 0; }
.navbar .nav-kingkoll li .sub-menu .box-ship > a:hover::after { display: none; }
.navbar .nav-kingkoll li .sub-menu .box-ship > a i { font-size: 20px; margin-right: 5px; }
.navbar .nav-kingkoll li .sub-menu .see-all-product { width: 188px; font-size: 16px; font-weight: 400; line-height: 180%; letter-spacing: 0.128px; color: #fff; background: #0A2240; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; display: block; text-align: center; text-decoration: none; padding: 10px; }
.navbar .nav-kingkoll li .sub-menu .see-all-product:hover { color: #fff; }
.navbar .nav-kingkoll li .sub-menu .see-all-product:hover::after { display: none; }
.navbar .nav-kingkoll li .sub-menu .container { animation: pullmenu 1s forwards; }
.navbar .nav-kingkoll li.menu-item-has-children > a { position: relative; }
.navbar .nav-kingkoll li.menu-item-has-children > a::before { position: absolute; top: 50%; right: -12px; width: 8px; height: 5px; background: url(//kingkoil.vn/wp-content/themes/kingkoil/assets/images/stroke-2.png) no-repeat; background-size: 100% auto; content: ''; }
.navbar .nav-kingkoll li.current_page_item > a::after { width: 30px; height: 2px; background: #ffffff; position: absolute; left: 50%; bottom: 7px; transform: translateX(-50%); -webkit-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: 2px; border-radius: 2px; content: ''; }
.navbar .nav-kingkoll li.current_page_item .link-contact { font-weight: 700; }
.navbar .nav-kingkoll li.current_page_item .link-contact::after { display: none; }
.navbar .nav-kingkoll .active > a { color: #ffffff; }
.navbar .nav-kingkoll .active > a:hover, .navbar .nav-kingkoll .active > a:focus { color: #ffffff; }
.navbar .nav-kingkoll .active > a::after { width: 30px; height: 2px; background: #ffffff; position: absolute; left: 50%; bottom: 7px; transform: translateX(-50%); -webkit-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: 2px; border-radius: 2px; content: ''; }
@keyframes pullmenu { 0% { transform: translateY(-20px); }
100% { transform: translateY(0px); } }
.navbar .box-search { display: flex; justify-content: space-between; padding-top: 28px; }
.navbar .box-search .item-search { max-width: 178px; position: relative; }
.navbar .box-search .item-search input[type=submit] { width: 21px; height: 21px; outline: none; position: absolute; top: 8px; right: 10px; background: url(//kingkoil.vn/wp-content/themes/kingkoil/assets/images/icon-serach.png) no-repeat center; background-size: cover; border: 0; z-index: 1; font-size: 0; padding: 0; }
.navbar .box-search .item-search input { width: 100%; height: 36px; -webkit-border-radius: 55px; -moz-border-radius: 55px; -ms-border-radius: 55px; border-radius: 55px; border: 1px solid #fff; padding: 10px 30px 10px 15px; outline: none; background: transparent; color: #fff; font-size: 14px; font-weight: 300; }
.navbar .item-cart { display: block; color: #fff; text-decoration: none; position: relative; padding-top: 7px; }
.navbar .item-cart i { font-size: 20px; }
.navbar .item-cart .notes { position: absolute; display: block; top: 0; right: -3px; width: 11px; height: 11px; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; background: #FFA489; color: #fff; font-size: 7px; text-align: center; padding: 1px 0 0 0; }
.box-media-nav { width: 45%; display: flex; }
.box-media-nav a { width: 20px; height: 20px; display: block; text-decoration: none; color: #fff; margin-right: 12px; }
.box-media-nav a:hover { color: #fff; }
.box-media-nav a i { font-size: 20px; }
.box-top-nav { width: 45%; display: flex; justify-content: end; margin: 0; padding: 0; }
.box-top-nav li a { display: block; padding: 0px 14px; text-decoration: none; color: #fff; font-size: 14px; text-align: center; position: relative; }
.box-top-nav li a:hover { color: #fff; }
.box-top-nav li.active a::after { position: absolute; bottom: -5px; left: 50%; transform: translate(-50%); width: 40px; height: 2px; background: #fff; content: ''; }
.language-selector { position: relative; }
.language-selector .bt-language { color: #fff; display: flex; text-decoration: none; align-items: center; }
.language-selector .bt-language i { font-size: 16px; margin: 3px 0 0 3px; }
.language-selector .sub-language { position: absolute; top: 30px; left: 10px; opacity: 0; max-width: 100px; display: none; z-index: 2; transform: translateY(-20px); transition: all 0.3s; background: #B6A999; margin: 0; padding: 0; }
.language-selector .sub-language li { width: 100%; border-top: 1px solid #C6D8CD; }
.language-selector .sub-language li:first-child { border-top: none; }
.language-selector .sub-language li a { padding: 5px 10px; text-align: center; text-decoration: none; display: block; color: #fff; width: max-content; }
.language-selector .sub-language li a:hover { text-decoration: none; color: #fff; }
.language-selector .open { opacity: 1; display: block; transform: translateY(0px); }
.bg-nav, .bg-nav-sub { background: #0A2240; }
.bg-nav .navbar-top, .bg-nav-sub .navbar-top { background: #B6A999; }
.bg-nav .navbar-top .box-media-nav a, .bg-nav-sub .navbar-top .box-media-nav a { color: #0A2240 !important; }
.bg-nav .navbar-top .box-top-nav li a, .bg-nav-sub .navbar-top .box-top-nav li a { color: #0A2240; width: max-content; }
.bg-nav .all-nav-kingkoll, .bg-nav-sub .all-nav-kingkoll { border-top: 0; }
.big-banner { padding: 0; position: relative; width: 100%; height: 100%; margin-bottom: 0; }
.box-banner { display: block; width: 100%; height: 100vh; padding: 0; position: relative; background-repeat: no-repeat; background-size: cover; }
.box-banner img { width: 100%; height: auto; max-height: 984px; }
.box-banner .lbanner { max-width: 768px; color: #fff; margin-bottom: 115px; padding: 0; transform: translateY(10%); opacity: 0; transition: 2s; }
.box-banner .lbanner h1 { font-family: "Lora"; font-size: 48px; font-style: normal; font-weight: 600; line-height: 140%; letter-spacing: 0.096px; color: #fff; padding-bottom: 26px; }
.box-banner .lbanner h2 { font-size: 16px; font-style: normal; font-weight: 600; line-height: 180%; letter-spacing: 0.128px; text-transform: uppercase; padding-bottom: 5px; }
.box-banner .lbanner .bt-lear-more { font-size: 16px; font-style: normal; font-weight: 300; line-height: 140%; letter-spacing: 0.08px; text-decoration: none; color: #fff; }
.box-banner .lbanner .bt-lear-more:hover { text-decoration: underline; color: #fff; }
.big-banner .slick-current .lbanner { transform: translateY(0%); opacity: 1; }
.big-banner .slick-dots { width: max-content; display: flex; flex-direction: column; align-items: center; gap: 20px; position: absolute; justify-content: center; align-items: center; right: 80px; bottom: 200px; }
.big-banner .slick-dots .slick-active button { position: relative; }
.big-banner .slick-dots .slick-active button::after { position: absolute; top: -8px; left: -8px; width: 24px; height: 24px; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; border: 1px solid #ffffff; content: ''; }
.big-banner .slick-dots .slick-active button::before { display: none; }
.big-banner .slick-dots button { font-size: 0; background: #fff; border: none; width: 8px; height: 8px; cursor: pointer; transition: all 0.2s linear; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; padding: 0; }
.big-banner .slick-dots button::before { display: none; }
.box-full-midle { width: 100%; position: relative; background: url(//kingkoil.vn/wp-content/themes/kingkoil/assets/images/bg-m.jpg) no-repeat center; background-size: cover; }
.full-midle-content { padding: 70px 0; max-width: 1116px; margin: auto; }
.title-2 { font-size: 40px; font-family: "Lora"; font-weight: 600; line-height: 160%; color: #0A2240; }
.text-content { font-size: 24px; font-weight: 400; line-height: 180%; letter-spacing: 0.192px; }
.box-left-slide-middle { background-size: cover; background-repeat: no-repeat; z-index: 4; }
.box-left-slide-middle-abso { width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
.box-left-slide-middle-abso .container { height: 100%; }
.text-content-left-slide { height: 100%; display: flex; color: #fff; flex-wrap: wrap; flex-direction: column; justify-content: space-between; align-items: flex-start; padding: 104px 0px; }
.text-content-left-slide .tt-1 { font-size: 60px; font-family: "Lora"; font-weight: 600; line-height: 140%; letter-spacing: 0.12px; }
.text-content-left-slide .tt-2 { font-size: 19px; font-weight: 400; line-height: 180%; letter-spacing: 0.16px; width: 100%; }
.box-slide-middle { background: #B6A999; padding: 104px 0; }
.box-why { background: #ECECF2; }
.title-3 { font-size: 48px; font-family: "Lora"; font-weight: 600; line-height: 140%; letter-spacing: 0.096px; }
.item-why { width: 100%; text-align: center; }
.item-why .b-icon { width: 100%; text-align: center; padding-bottom: 12px; }
.item-why .b-icon img { width: 104px; height: 104px; }
.item-why .text-oject { text-align: center; font-size: 20px; font-weight: 600; margin-bottom: 5px; }
.box-product { padding: 104px 0; }
.nav-products { padding: 0; border-bottom: 1px solid #ECECF2; margin-bottom: 0; }
.nav-products .nav-item .nav-link { color: #797F94; font-size: 20px; font-weight: 400; padding: 12px 40px; line-height: 100%; border: none; background: transparent; border-right: 1px solid #ECECF2; margin: 12px 0; position: relative; text-align: center;}
.nav-products .nav-item .nav-link:hover { color: #F5c0b0; }
.nav-products .nav-item .nav-link:hover::after { position: absolute; left: 0; bottom: -12px; width: 100%; height: 1px; background: #FFA489; content: ''; }
.nav-products .nav-item:first-child .nav-link { padding-left: 15px; }
.nav-products .nav-item:last-child .nav-link { border-right: 0; }
.nav-products .nav-item:last-child .nav-link.nav-last-border { border-left: 1px solid #7F797D; }
.nav-products .nav-item .active { color: #FFA489; font-weight: 600; position: relative; transition: all 0.3s; }
.nav-products .nav-item .active::after { position: absolute; left: 0; bottom: -12px; width: 100%; height: 1px; background: #FFA489; content: ''; }
.nav-products .slick-arrow { position: absolute; background: #0A2240; border: none; outline: none; width: 26px; height: 26px; z-index: 3; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; cursor: pointer; color: #fff; }
.nav-products .slick-arrow:hover { color: #fff; }
.nav-products .slick-arrow::before { display: none; }
.nav-products .slick-arrow { bottom: 20px; }
.nav-products .slick-prev { left: -30px; }
.nav-products .slick-prev i { font-size: 14px; }
.nav-products .slick-next { right: -30px; }
.nav-products .slick-next i { font-size: 14px; }
.nav-products .slick-disabled { display: none !important; }
.box-product-l { width: 100%; }
.box-product-l .tt-number { display: flex; color: #0A2240; font-size: 16px; font-weight: 600; line-height: 160%; letter-spacing: 0.08px; }
.box-product-l .tt-number span { width: 28px; height: 28px; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; background: #0A2240; display: flex; color: #fff; align-items: center; justify-content: center; margin-right: 10px; }
.box-product-l .pic-product { width: 100%; }
.box-product-l .pic-product img { width: 100%; height: auto; aspect-ratio: 13/7; object-fit: cover; }
.title-4 { font-family: "Lora"; font-size: 32px; font-weight: 600; line-height: 160%; letter-spacing: 0.064px; color: #020D1B; }
.title-5 { font-size: 48px; font-family: "Lora"; font-weight: 600; line-height: 140%; letter-spacing: 0.096px; }
.title-6 { font-size: 40px; font-family: "Lora"; font-weight: 600; line-height: 140%; letter-spacing: 0.096px; }
.box-price { width: 100%; color: #797F94; }
.box-price span { color: #FFA489; font-size: 20px; font-weight: 600; line-height: 180%; letter-spacing: 0.16px; padding-left: 10px; }
.box-list-number { margin: 0; width: 100%; padding: 44px 0; }
.box-list-number li { padding: 10px 0; }
.box-list-number li .list-item { color: #797F94; text-decoration: none; display: flex; font-size: 16px; }
.box-list-number li .list-item span { width: 22px; height: 22px; display: flex; color: #fff; align-items: center; justify-content: center; background: #CACADD; font-size: 14px; margin-right: 10px; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; }
.box-list-number li .list-item:hover { color: #020D1B; }
.box-list-number li .list-item:hover span { background: #020D1B; }
.box-list-number li .active { color: #020D1B; font-weight: 600; }
.box-list-number li .active span { background: #020D1B; }
.bt-see-product { width: 188px; font-size: 16px; font-weight: 400; line-height: 180%; letter-spacing: 0.128px; color: #fff; background: #0A2240; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; display: block; text-align: center; text-decoration: none; padding: 16px; }
.bt-see-product:hover { color: #fff; background: #013665; }
.box-banner-more { width: 100%; }
.box-banner-more img { width: 100%; height: auto; object-fit: cover; }
.box-style-king { padding: 104px 0; }
.pic-page img { width: 100%; height: auto; object-fit: cover; aspect-ratio: 3/2; }
.box-footer { width: 100%; background: #0A2240; padding: 66px 0; color: #fff; }
.box-footer .logo-footer { text-align: center; border-bottom: 1px solid #797F94; padding-bottom: 50px; }
.box-footer .logo-footer img { width: 100%; height: auto; max-width: 232px; }
.box-footer .nav-footer { padding: 64px 0 0 0; position: relative; width: 100%; margin: 0; display: flex; flex-wrap: wrap; justify-content: space-between; }
.box-footer .nav-footer li { width: 22%; margin-left: 20px; }
.box-footer .nav-footer li .text-title { width: 100%; font-weight: 700; margin-bottom: 30px; display: block; }
.box-footer .nav-footer li .list-nav a { color: #DDDDE7; text-decoration: none; font-weight: 400; margin: 0; padding-bottom: 20px; display: block; }
.box-footer .nav-footer li .list-nav a:hover { color: #fff; text-decoration: none; }
.box-footer .nav-footer li .plus { display: none; }
.box-footer .box-contact-media { width: 100%; padding: 65px 50px 0 0; font-size: 14px; }
.box-footer .box-contact-media ul { margin: 0; padding: 0; }
.box-footer .box-contact-media ul li { display: flex; flex-wrap: wrap; margin-bottom: 20px; color: #fff; }
.box-footer .box-contact-media ul li .address { opacity: 0.5; }
.box-footer .box-contact-media ul li i { font-size: 22px; margin-right: 15px; }
.box-footer .box-contact-media ul li a { color: #fff; text-decoration: none; margin-left: 5px; }
.box-footer .box-contact-media ul li a:hover { color: #fff; text-decoration: underline; }
.icon-cong-thuong { padding: 20px 0; }
.icon-cong-thuong img { max-width: 100%; height: auto; margin-right: 20px; }
.box-icon-chat { width: 48px; height: 48px; position: fixed; right: 20px; bottom: 22px; z-index: 4; cursor: pointer; }
.box-icon-chat .b-tooltip { width: 129px; position: absolute; left: -140px; top: 0; background: #103665; color: #fff; text-align: center; font-size: 14px; padding: 10px 22px; -webkit-border-radius: 7px; -moz-border-radius: 7px; -ms-border-radius: 7px; border-radius: 7px; transition: all 0.3s; display: none; }
.box-icon-chat:hover .b-tooltip { display: block; }
.box-icon-chat .box-icon-media { position: absolute; left: 0; top: -190px; width: 42px; visibility: hidden; transition: all 0.3s; }
.box-icon-chat .box-icon-media img { margin-top: 15px; }
.box-icon-chat .box-icon-media.show { visibility: visible; }
.bg-blue { background: #0A2240; }
.bg-dack-gold { background: #B6A999; }
.bg-light-gray { background: #F8F8FA !important; }
.pink-color { color: #FFA489; }
.blue-color { color: #0A2240 !important; }
.gray-color { color: #797F94; }
.red-color { color: #FF0000; }
.light-gray-color { color: #DDDDE7; }
.bold-6 { font-weight: 600; }
.bold-7 { font-weight: 700; }
.py-lg-104 { padding-top: 104px; padding-bottom: 104px; }
.font-16 { font-size: 16px; }
.h-100 { height: 100%; }
.w-60 { width: 60%; }
.w-40 { width: 40%; }
.pic-main-post img { width: 100%; height: auto; aspect-ratio: 2/1; }
.blog-detail-page .blog-item .blog-title { height: 60px; overflow: hidden; }
.box-content-post-more { height: 67px; overflow: hidden; }
.bg-modal { background: transparent !important; border: none !important; }
.cascade-slider_container { position: relative; width: 100%; height: 703px; margin-left: auto; margin-right: auto; }
.cascade-slider_container .cascade-slider_item { position: absolute; left: 50%; top: 50%; transform: translateY(-50%) translateX(-50%) scale(0.45); opacity: 0; transition: all 0.3s ease; width: 420px; height: 703px; }
.cascade-slider_container .cascade-slider_item img { width: 100%; height: auto; }
.cascade-slider_container .cascade-slider_item.next { left: 108%; opacity: 0.3; z-index: 2; }
.cascade-slider_container .cascade-slider_item.prev { left: -8%; opacity: 0.3; z-index: 2; }
.cascade-slider_container .slide-communities .cascade-slider_item.next { left: 98%; opacity: 0.3; z-index: 2; }
.cascade-slider_container .slide-communities .cascade-slider_item.prev { left: 2%; opacity: 0.3; z-index: 2; }
.cascade-slider_container .cascade-slider_item.now { opacity: 1; filter: blur(0px); top: 50%; left: 50%; transform: translateY(-50%) translateX(-50%) scale(1); z-index: 3; transition: all 0.3s ease; }
.cascade-slider_container .arrow { display: none; width: 27px; height: 27px; position: absolute; top: 50%; margin-top: -25px; cursor: pointer; z-index: 4; }
.cascade-slider_container .arrow i { font-size: 32px; }
.cascade-slider_container .arrow:hover { color: #BE1E2D; }
.cascade-slider_container .arrow.left { left: 0; }
.cascade-slider_container .arrow.right { right: 0; }
.cascade-slider_container .cascade-slider_nav { width: 100%; position: absolute; left: 0; bottom: -63px; display: flex; justify-content: center; z-index: 5; padding: 0; }
.cascade-slider_container .cascade-slider_nav .cascade-slider_dot { width: 8px; height: 8px; margin: 0 10px; background: #fff; list-style: none; cursor: pointer; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; }
.cascade-slider_container .cascade-slider_nav .cascade-slider_dot.cur { background: #fff; position: relative; }
.cascade-slider_container .cascade-slider_nav .cascade-slider_dot.cur::after { position: absolute; top: -8px; left: -8px; width: 24px; height: 24px; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; border: 1px solid #ffffff; content: ''; }
.box-slide-middle-com .cascade-slider_container .cascade-slider_nav .cascade-slider_dot { background: #DDDDE7; }
.box-slide-middle-com .cascade-slider_container .cascade-slider_nav .cascade-slider_dot.cur { background: #020D1B; }
.box-slide-middle-com .cascade-slider_container .cascade-slider_nav .cascade-slider_dot.cur::after { border: 1px solid #797F94; }
.about-page { width: 100%; padding-top: 265px; position: relative; background-position: center top; background-repeat: no-repeat; background-size: cover; }
.about-page .history-content { padding: 70px 0 130px; }
.about-page .history-content .yearly { color: var(--brand-champange-gold, #B6A999); text-align: center; font-family: Lora; font-size: 40px; font-style: normal; font-weight: 600; line-height: 160%; letter-spacing: 0.2px; }
.about-page .history-content .events { color: var(--neutral-8, #020D1B); font-size: 16px; font-style: normal; font-weight: 400; line-height: 180%; letter-spacing: 0.128px; padding: 12px 30px 0 30px; }
.about-page .history-content .history-line { display: flex; flex-direction: column; align-items: center; padding: 40px 0; }
.about-page .history-content .history-img { width: 1px; height: 49px; gap: 44px; }
.technical { background-color: var(--neutral-3, #ECECF2); }
.technical-content { padding: 104px 0; }
.technical-content .description { color: var(--neutral-7, #353D49); font-size: 20px; font-style: normal; font-weight: 400; line-height: 180%; letter-spacing: 0.16px; }
.technical .technical-item-desc { color: var(--neutral-7, #353D49); font-style: normal; font-weight: 400; line-height: 180%; letter-spacing: 0.128px; }
.technical .tech-material-content { padding-bottom: 84px; }
.technical .tech-material-content:last-child { padding-bottom: 0; }
.benefit .benefit-title { color: var(--neutral-6, #797F94); font-style: normal; font-weight: 600; line-height: 180%; letter-spacing: 0.128px; }
.benefit img { width: 64px; height: 64px; }
.certificates { padding: 40px 82px 78px; }
.certificates .certificate-title { padding-bottom: 40px; }
.about-project { background: linear-gradient(360deg, #B6A999 0%, #FFF 100%); padding: 100px 0 200px; }
.about-project .about-project-title { padding: 0px 240px; }
.about-project .box-slide-project { width: 100%; padding: 30px 0 0 0; }
.cascade-slider_container.fv-slide .cascade-slider_item { opacity: 1; }
.cascade-slider_container.fv-slide .cascade-slider_item:nth-child(3) { left: 108%; transform: translateY(-57%) translateX(-65%) scale(0.35); }
.cascade-slider_container.fv-slide .cascade-slider_item:nth-child(4) { left: -8%; transform: translateY(-57%) translateX(-35%) scale(0.35); }
.cascade-slider_container.fv-slide .cascade-slider_item.next { left: 77%; opacity: 1; transform: translateY(-52%) translateX(-35%) scale(0.7); }
.cascade-slider_container.fv-slide .cascade-slider_item.prev { left: 23%; opacity: 1; transform: translateY(-52%) translateX(-65%) scale(0.7); }
.slider-rotate__arrow i { font-size: 46px; }
.position { position: absolute; top: 50%; left: 50%; color: #ffffff; font-size: 30px; display: none; }
.slider-rotate { margin: 0 auto; padding-top: 82px; }
.slider-rotate__container { margin: 0 auto; }
.slider-rotate__container { position: relative; height: 500px; visibility: hidden; }
.slider-rotate__item { position: absolute; left: 50%; top: 50%; opacity: 0; -webkit-transform: translateY(-50%) translateX(-50%) scale(0.7); -moz-transform: translateY(-50%) translateX(-50%) scale(0.7); -ms-transform: translateY(-50%) translateX(-50%) scale(0.7); -o-transform: translateY(-50%) translateX(-50%) scale(0.7); transform: translateY(-50%) translateX(-50%) scale(0.7); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
.slider-rotate__item.slider-rotate__item--next { left: 76%; }
.slider-rotate__item.slider-rotate__item--prev { left: 24%; }
.slider-rotate__item.slider-rotate__item--prev, .slider-rotate__item.slider-rotate__item--next { opacity: 1; z-index: 2; -webkit-filter: blur(0); -moz-filter: blur(0); -ms-filter: blur(0); -o-filter: blur(0); filter: blur(0); padding: 10px; }
.slider-rotate__item img { position: relative; }
.slider-rotate__item .slider-inner-link { visibility: hidden; position: absolute; display: flex; width: 100%; justify-content: center; bottom: 85px; }
.slider-rotate__item p { text-align: center; padding: 20px 0 0 0; margin: 0; font-size: 24px; font-style: normal; font-weight: 400; letter-spacing: 0.128px; }
.slider-rotate__item.slider-rotate__item--next-2 { left: 96%; }
.slider-rotate__item.slider-rotate__item--prev-2 { left: 4%; }
.slider-rotate__item.slider-rotate__item--next-2, .slider-rotate__item.slider-rotate__item--prev-2 { opacity: 1; z-index: 1; -webkit-transform: translateY(-50%) translateX(-50%) scale(0.55); -moz-transform: translateY(-50%) translateX(-50%) scale(0.55); -ms-transform: translateY(-50%) translateX(-50%) scale(0.55); -o-transform: translateY(-50%) translateX(-50%) scale(0.55); transform: translateY(-50%) translateX(-50%) scale(0.55); -webkit-filter: blur(0); -moz-filter: blur(0); -ms-filter: blur(0); -o-filter: blur(0); filter: blur(0); }
.slider-rotate__item.slider-rotate__item--next-2 p, .slider-rotate__item.slider-rotate__item--prev-2 p { visibility: hidden; }
.slider-rotate__item.slider-rotate__item--active { z-index: 2; opacity: 1; z-index: 5; top: 50%; left: 50%; -webkit-transform: translateY(-50%) translateX(-50%) scale(1); -moz-transform: translateY(-50%) translateX(-50%) scale(1); -ms-transform: translateY(-50%) translateX(-50%) scale(1); -o-transform: translateY(-50%) translateX(-50%) scale(1); transform: translateY(-50%) translateX(-50%) scale(1); -webkit-filter: blur(0); -moz-filter: blur(0); -ms-filter: blur(0); -o-filter: blur(0); filter: blur(0); }
.slider-rotate__item.slider-rotate__item--active .slider-inner-link { visibility: visible; }
.slider-rotate__item.slider-rotate__item--active p { color: var(--neutral-8, #020D1B); font-size: 24px; font-style: normal; font-weight: 600; line-height: 180%; letter-spacing: 0.192px; }
.dots-list { padding: 82px 0 0 0; text-align: center; }
.dot-item { display: inline-block; width: 8px; height: 8px; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; background-color: #FFF; margin: 0 10px; cursor: pointer; }
.dot-item.active-dot { background: #fff; position: relative; }
.dot-item.active-dot::after { position: absolute; top: -8px; left: -8px; width: 24px; height: 24px; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; border: 1px solid #ffffff; content: ''; }
.dot-item-none { display: none; }
.nav-technology { padding: 12px 0; border-bottom: 1px solid #ECECF2; margin-bottom: 0; }
.nav-technology .nav-item .nav-link { color: #797F94; font-size: 20px; font-weight: 400; padding: 0 40px; line-height: 100%; border: none; background: transparent; border-right: 1px solid #ECECF2; margin: 12px 0; position: relative; }
.nav-technology .nav-item .nav-link:hover { color: #F5c0b0; }
.nav-technology .nav-item .nav-link:hover::after { position: absolute; left: 0; bottom: -25px; width: 100%; height: 1px; background: #FFA489; content: ''; }
.nav-technology .nav-item:first-child .nav-link { padding-left: 15px; }
.nav-technology .nav-item:last-child .nav-link { border-right: 0; }
.nav-technology .nav-item:last-child .nav-link.nav-last-border { border-left: 1px solid #7F797D; }
.nav-technology .nav-item .active { color: #FFA489; font-weight: 600; position: relative; transition: all 0.3s; }
.nav-technology .nav-item .active::after { position: absolute; left: 0; bottom: -25px; width: 100%; height: 1px; background: #FFA489; content: ''; }
.nav-technology .slick-arrow { position: absolute; background: #0A2240; border: none; outline: none; width: 26px; height: 26px; z-index: 3; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; cursor: pointer; color: #fff; }
.nav-technology .slick-arrow:hover { color: #fff; }
.nav-technology .slick-arrow::before { display: none; }
.nav-technology .slick-arrow { bottom: 20px; }
.nav-technology .slick-prev { left: -30px; }
.nav-technology .slick-prev i { font-size: 14px; }
.nav-technology .slick-next { right: -30px; }
.nav-technology .slick-next i { font-size: 14px; }
.nav-technology .slick-disabled { display: none !important; }
@media (max-width: 820px) { .about-page { padding-top: 100px; }
.about-page .history-content { padding: 24px 0 24px; }
.about-page .history-content .yearly { color: var(--brand-champange-gold, #B6A999); text-align: center; font-size: 28px; }
.about-page .history-content .events { font-size: 12px; padding: 5px 0 20px 0; }
.about-page .history-content .history-line { display: none; }
.technical-content { padding: 44px 0; }
.technical-content .description { font-size: 14px; }
.technical .technical-item-desc { color: var(--neutral-7, #353D49); font-style: normal; font-weight: 400; line-height: 180%; letter-spacing: 0.128px; }
.technical .tech-material-content { padding-bottom: 24px; }
.technical .tech-material-content:last-child { padding-bottom: 0; }
.certificates { padding: 32px 0px; overflow: hidden; }
.certificates .certificate-title { padding-bottom: 20px; }
.certificates .slick-dots-pro .slick-dots { bottom: -60px; }
.certificates .slick-slider { margin-bottom: 44px; }
.about-project { padding: 44px 0; }
.about-project .about-project-title { padding: 0px; }
.about-project .box-slide-project { width: 100%; padding: 30px 0 0 0; } .slider-rotate__container { height: 400px; }
.dots-list { padding-top: 60px; }
.slider-rotate__item { top: 50%; left: 50%; }
.slider-rotate__item img { position: relative; }
.slider-rotate__item .slider-inner-link { visibility: hidden; position: absolute; display: flex; width: 60%; left: 20%; justify-content: center; bottom: 85px; }
.slider-rotate__item p { text-align: center; padding: 20px 0 0 0; margin: 0; font-size: 16px; font-style: normal; font-weight: 400; letter-spacing: 0.128px; visibility: hidden; }
.slider-rotate__item.slider-rotate__item--active { z-index: 2; opacity: 1; top: 50%; left: 50%; -webkit-transform: translateY(-50%) translateX(-50%) scale(0.8); -moz-transform: translateY(-50%) translateX(-50%) scale(0.8); -ms-transform: translateY(-50%) translateX(-50%) scale(0.8); -o-transform: translateY(-50%) translateX(-50%) scale(0.8); transform: translateY(-50%) translateX(-50%) scale(0.8); -webkit-filter: blur(0); -moz-filter: blur(0); -ms-filter: blur(0); -o-filter: blur(0); filter: blur(0); }
.slider-rotate__item.slider-rotate__item--active .slider-inner-link { visibility: visible; }
.slider-rotate__item.slider-rotate__item--active p { color: var(--neutral-8, #020D1B); font-size: 16px; font-style: normal; font-weight: 600; line-height: 180%; letter-spacing: 0.192px; visibility: visible; }
.slider-rotate__item.slider-rotate__item--next { left: 108%; -webkit-transform: translateY(-50%) translateX(-50%) scale(0.5); -moz-transform: translateY(-50%) translateX(-50%) scale(0.5); -ms-transform: translateY(-50%) translateX(-50%) scale(0.5); -o-transform: translateY(-50%) translateX(-50%) scale(0.5); transform: translateY(-50%) translateX(-50%) scale(0.5); }
.slider-rotate__item.slider-rotate__item--prev { left: -8%; -webkit-transform: translateY(-50%) translateX(-50%) scale(0.5); -moz-transform: translateY(-50%) translateX(-50%) scale(0.5); -ms-transform: translateY(-50%) translateX(-50%) scale(0.5); -o-transform: translateY(-50%) translateX(-50%) scale(0.5); transform: translateY(-50%) translateX(-50%) scale(0.5); }
.slider-rotate__item.slider-rotate__item--next-2, .slider-rotate__item.slider-rotate__item--prev-2 { top: 50%; left: 50%; -webkit-transform: translateY(-50%) translateX(-50%) scale(0.5); -moz-transform: translateY(-50%) translateX(-50%) scale(0.5); -ms-transform: translateY(-50%) translateX(-50%) scale(0.5); -o-transform: translateY(-50%) translateX(-50%) scale(0.5); transform: translateY(-50%) translateX(-50%) scale(0.5); }
.nav-technology { padding: 12px 0; margin-bottom: 0; justify-content: center; }
.nav-technology .nav-item { width: 50%; }
.nav-technology .nav-item .nav-link { font-size: 14px; padding: 0 20px; text-align: center; }
.nav-technology .nav-item:first-child .nav-link { padding-left: 0px; }
.nav-technology .slick-arrow { width: 18px; height: 18px; }
.nav-technology .slick-prev { left: -10px; }
.nav-technology .slick-prev i { font-size: 12px; }
.nav-technology .slick-next { right: -10px; }
.nav-technology .slick-next i { font-size: 12px; } }
@media (max-width: 500px) { .slider-rotate { padding-top: 24px; }
.dots-list { padding-top: 0; }
.slider-rotate__container { height: 430px; }
.slider-rotate__item.slider-rotate__item--active { z-index: 2; opacity: 1; top: 50%; left: 50%; -webkit-transform: translateY(-50%) translateX(-50%) scale(0.69); -moz-transform: translateY(-50%) translateX(-50%) scale(0.69); -ms-transform: translateY(-50%) translateX(-50%) scale(0.69); -o-transform: translateY(-50%) translateX(-50%) scale(0.69); transform: translateY(-50%) translateX(-50%) scale(0.69); -webkit-filter: blur(0); -moz-filter: blur(0); -ms-filter: blur(0); -o-filter: blur(0); filter: blur(0); }
.slider-rotate__item.slider-rotate__item--active .slider-inner-link { bottom: 95px; }
.slider-rotate__item.slider-rotate__item--active .slider-inner-link .bt-see-product { font-size: 14px; padding-top: 22px; padding-bottom: 22px; }
.slider-rotate__item.slider-rotate__item--next { left: 119%; }
.slider-rotate__item.slider-rotate__item--prev { left: -19%; }
.slider-rotate__item.slider-rotate__item--next, .slider-rotate__item.slider-rotate__item--prev { -webkit-transform: translateY(-50%) translateX(-50%) scale(0.58); -moz-transform: translateY(-50%) translateX(-50%) scale(0.58); -ms-transform: translateY(-50%) translateX(-50%) scale(0.58); -o-transform: translateY(-50%) translateX(-50%) scale(0.58); transform: translateY(-50%) translateX(-50%) scale(0.58); } }
@media (max-width: 391px) { .slider-rotate__item.slider-rotate__item--next { left: 124%; }
.slider-rotate__item.slider-rotate__item--prev { left: -24%; } }
.pt-page { margin-top: 136px; }
.pt-page-1 { margin-top: 60px; }
.all-nav-products { width: 100%; margin: auto; background: #fff; z-index: 4; transition: all 0.3s; }
.nav-products-sub { width: 100%; border-bottom: 1px solid #ECECF2; }
.nav-products-sub .nav-products-link { display: flex; position: relative; padding: 24px 0; }
.nav-products-sub .nav-products-link a { width: 100%; display: block; color: #797F94; font-size: 20px; font-weight: 400; text-decoration: none; padding: 0 28px; line-height: 100%; border-left: 1px solid #ECECF2; }
.nav-products-sub .nav-products-link a:hover { text-decoration: none; color: #FFA489; }
.nav-products-sub .nav-products-link:first-child { border-left: none; }
.nav-products-sub .nav-products-link:first-child a { padding-left: 0px; border-left: 0; }
.nav-products-sub .nav-products-link.active a { color: #FFA489; }
.nav-products-sub .nav-products-link.active::after { width: 100%; height: 1px; background: #FFA489; position: absolute; left: 0; bottom: 0px; z-index: 2; content: ''; }
.nav-products-sub .sclick-arrow { position: absolute; background: #0A2240; border: none; outline: none; width: 26px; height: 26px; z-index: 3; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; cursor: pointer; color: #fff; }
.nav-products-sub .sclick-arrow:hover { color: #fff; }
.nav-products-sub .sclick-arrow::before { display: none; }
.nav-products-sub .sclick-arrow { bottom: 20px; }
.nav-products-sub .slick-prev { left: -30px; }
.nav-products-sub .slick-prev i { font-size: 14px; }
.nav-products-sub .slick-next { right: -30px; }
.nav-products-sub .slick-next i { font-size: 14px; }
.nav-products-sub .slick-disabled { display: none !important; }
.banner-product img { width: 100%; height: auto; object-fit: cover; aspect-ratio: 16/5; }
.box-left-product { width: 100%; border: 1px solid #DDDDE7; }
.box-left-product .top-filter { width: 100%; background: #F8F8FA; display: flex; justify-content: space-between; padding: 16px; }
.box-left-product .hidde-filter { cursor: pointer; display: block; }
.box-left-product .setup-filter { border-bottom: 1px solid #ECECF2; color: #FFA489; padding: 16px; }
.box-left-product .accordion-item { border: none; }
.box-left-product .accordion-item .accordion-button { font-size: 16px; font-weight: 600; line-height: 180%; letter-spacing: 0.128px; color: #797F94; }
.box-left-product .accordion-item .accordion-button:not(.collapsed) { color: #797F94; background: transparent; box-shadow: none; }
.box-left-product .accordion-item .accordion-button::after { background-image: url(//kingkoil.vn/wp-content/themes/kingkoil/assets/images/chevron-down.png); }
.box-left-product .accordion-item .accordion-filter { margin: 0 16px 16px 16px; border-bottom: 1px solid #ECECF2; padding-bottom: 16px; }
.box-left-product .accordion-item .accordion-filter .item-filter { width: 100%; display: flex; font-size: 20px; align-items: center; padding-bottom: 25px; }
.box-left-product .accordion-item .accordion-filter .item-filter input[type="checkbox"] { width: 20px; height: 20px; border: 1px solid #CACADD; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; margin-right: 12px; }
.box-left-product .accordion-item:last-child .accordion-filter { border-bottom: 0; }
.wpc-filter-chips-list li.wpc-filter-chip { display: none; }
.wpc-filter-chips-list li.wpc-chip-reset-all { display: block !important; border-bottom: 1px solid #ECECF2 !important; color: #FFA489; padding: 16px !important; width: 100%; font-size: 16px !important; }
.wpc-filter-chips-list li.wpc-chip-reset-all a { border: none !important; }
.wpc-filters-scroll-container .wpc-filters-widget-wrapper { padding: 16px; }
.wpc-filter-header { font-size: 16px; font-weight: 600; color: #797F94; background: url(//kingkoil.vn/wp-content/themes/kingkoil/assets/images/chevron-down.png) no-repeat 100% 0; cursor: pointer; margin-bottom: 1.5em !important; }
.widget-active { background: url(//kingkoil.vn/wp-content/themes/kingkoil/assets/images/chevron-up.png) no-repeat 100% 0; }
.wpc-filters-main-wrap ul.wpc-filters-ul-list { padding: 0 !important; border-bottom: 1px solid #ECECF2; }
.wpc-filters-main-wrap ul li.wpc-term-item { margin-bottom: 25px !important; }
.wpc-filters-main-wrap ul li.wpc-term-item a { color: #0A2240; font-size: 20px; }
.wpc-filters-main-wrap ul li.wpc-term-item input[type=checkbox] { width: 20px; height: 20px; border: 1px solid #CACADD; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; margin-right: 10px !important; }
.box-total-product { width: 100%; display: flex; justify-content: space-between; }
.box-total-product .all-product { font-size: 24px; font-weight: 600; line-height: 180%; letter-spacing: 0.12px; font-family: "Lora"; }
.box-total-product .slect-filter { width: max-content; padding: 16px 30px 16px 20px; background-color: #F8F8FA; border: none; outline: none; cursor: pointer; border-radius: 0; }
.box-total-product .slect-filter:focus { box-shadow: none; }
.box-item-product .pic-product { position: relative; transition: all 0.3s; overflow: hidden; }
.box-item-product .pic-product img { width: 100%; height: auto; object-fit: cover; aspect-ratio: 19/15; transition: all 0.3s; }
.box-item-product .pic-product .bag { width: max-content; max-width: 280px; height: 37px; position: absolute; left: 0; bottom: 0; color: #fff; text-transform: uppercase; padding: 6px 40px 6px 10px; background-image: linear-gradient(90deg, #b6a999 0%, #b6a999 40%, rgba(182, 169, 153, 0) 40%, rgba(182, 169, 153, 0) 100%), url(//kingkoil.vn/wp-content/themes/kingkoil/assets/images/bag-cloud.png); background-repeat: no-repeat; background-position: right; overflow: hidden; z-index: 1; }
.box-item-product .pic-product:hover img { transform: scale(1.1); }
.box-item-product .box-info-product { height: 166px; }
.box-item-product .box-info-product .title-pro { display: flex; justify-content: space-between; align-items: center; font-size: 24px; font-weight: 600; line-height: 180%; color: #020D1B; text-decoration: none; }
.box-item-product .box-info-product .title-pro:hover { color: #020D1B; text-decoration: none; }
.box-item-product .box-info-product .title-cloud-pro { font-size: 32px; font-weight: 600; font-family: "Lora"; color: #020D1B; text-decoration: none; display: block; }
.box-item-product .box-info-product .text-content-cloud-pro { font-size: 20px; font-weight: 400; line-height: 180%; letter-spacing: 0.16px; }
.box-item-product .box-info-product .price { font-size: 20px; color: #020D1B; }
.box-item-product .box-info-product .price span { color: #FFA489; padding-left: 10px; }
.box-item-product .box-info-product .installment { color: var(--neutral-7, #353D49); font-size: 16px; font-weight: 500; line-height: 180%; letter-spacing: 0.128px; }
.box-item-product .box-info-product .box-quality { width: 100%; border-top: 1px solid #CACADD; padding: 30px; margin-top: 30px; }
.box-item-product .box-info-product .box-quality .item-quality { width: 100%; max-width: 300px; margin: auto; display: flex; justify-content: space-between; padding-bottom: 20px; }
.box-item-product .box-info-product .box-quality .item-quality img { width: 28px; height: 28px; margin: 0; }
.box-item-product .box-info-product .box-quality .item-quality .tex { color: #353D49; text-align: center; font-size: 20px; font-weight: 400; line-height: 180%; letter-spacing: 0.16px; width: 80%; }
.box-item-product .cloud-product { height: auto; }
.slide-product-watched { cursor: pointer; }
.slide-product-watched .slick-slide { margin-left: 22px; margin-right: 22px; }
.slide-product-watched .slick-list { margin-left: -22px; margin-right: -22px; }
.slide-product-watched .slick-dots { justify-content: center; align-items: center; bottom: -10px; }
.slide-product-watched .slick-dots .slick-active button { position: relative; }
.slide-product-watched .slick-dots .slick-active button::before { position: absolute; top: -8px; left: -8px; width: 24px; height: 24px; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; border: 1px solid #0A2240; content: ''; visibility: visible; }
.slide-product-watched .slick-dots button { font-size: 0; background: #0A2240; border: none; width: 8px; height: 8px; cursor: pointer; transition: all 0.2s linear; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; padding: 0; }
.slide-product-watched .slick-dots button::before { visibility: hidden; }
.bt-see-more-pro { border-radius: 8px; border: 1px solid #ECECF2; background: #FFF; width: max-content; padding: 16px 32px; font-size: 20px; font-weight: 400; line-height: 180%; letter-spacing: 0.16px; cursor: pointer; color: #0A2240; }
.info-service-kingkoll { width: 100%; background: #ECECF2; overflow: hidden; }
.box-item-service { text-align: center; width: 100%; padding: 0 5px; }
.box-item-service img { width: 104px; height: 104px; margin-bottom: 10px; }
.box-item-service .tt { font-size: 20px; font-weight: 600; line-height: 180%; letter-spacing: 0.16px; color: #020D1B; padding-bottom: 10px; }
.box-item-service .link-more { color: #797F94; text-decoration: underline; padding-top: 15px; display: block; }
.slide-advise .slick-dots { justify-content: center; align-items: center; bottom: -60px; }
.slide-advise .slick-dots .slick-active button { position: relative; }
.slide-advise .slick-dots .slick-active button::before { position: absolute; top: -8px; left: -8px; width: 24px; height: 24px; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; border: 1px solid #0A2240; content: ''; visibility: visible; }
.slide-advise .slick-dots button { font-size: 0; background: #0A2240; border: none; width: 8px; height: 8px; cursor: pointer; transition: all 0.2s linear; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; padding: 0; }
.slide-advise .slick-dots button::before { visibility: hidden; }
.box-Evaluate { width: 100%; }
.box-Evaluate .box-comment { background: #0A2240; -webkit-border-radius: 60px 8px 8px 8px; -moz-border-radius: 60px 8px 8px 8px; -ms-border-radius: 60px 8px 8px 8px; border-radius: 60px 8px 8px 8px; padding: 44px 20px; color: #fff; font-size: 20px; line-height: 180%; height: 100%; }
.box-Evaluate .box-comment p img { margin: 0; }
.box-Evaluate .box-comment .user-comment { width: 100%; }
.box-Evaluate .box-comment .user-comment .avatar { width: 64px; margin-right: 12px; }
.box-Evaluate .box-comment .user-comment .avatar img { width: 64px; height: 64px; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; border: 1px solid #fff; }
.box-Evaluate .box-comment .user-comment .name-cm { width: auto; font-size: 24px; font-weight: 600; line-height: 140%; letter-spacing: 0.192px; }
.box-Evaluate .box-comment .user-comment .name-cm p { padding: 0; margin: 0; }
.box-Evaluate .box-comment .user-comment .name-cm i { font-size: 20px; margin-right: 8px; }
.box-Evaluate .box-comment-kh .slick-slide { margin-left: 20px; margin-right: 20px; }
.box-Evaluate .box-comment-kh .slick-list { margin-left: -20px; margin-right: -20px; }
.box-Evaluate .box-comment-kh .slick-dots { justify-content: center; align-items: center; bottom: -60px; }
.box-Evaluate .box-comment-kh .slick-dots .slick-active button { position: relative; }
.box-Evaluate .box-comment-kh .slick-dots .slick-active button::before { position: absolute; top: -8px; left: -8px; width: 24px; height: 24px; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; border: 1px solid #0A2240; content: ''; visibility: visible; }
.box-Evaluate .box-comment-kh .slick-dots button { font-size: 0; background: #0A2240; border: none; width: 8px; height: 8px; cursor: pointer; transition: all 0.2s linear; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; padding: 0; }
.box-Evaluate .box-comment-kh .slick-dots button::before { visibility: hidden; }
.all-faq { border-top: 1px solid #ECECF2 !important; border-bottom: 0 !important; }
.box-faq { width: 100%; }
.box-faq li { padding: 0; margin: 0; }
.box-faq li:first-child .link-faq { border-top: none; }
.box-faq li:first-child .link-factory { border-top: none; }
.box-faq li .link-faq { display: flex; justify-content: space-between; color: #222222; font-weight: 600; font-size: 20px; text-decoration: none; margin: 0px; padding: 24px 0; border-top: 1px solid #ECECF2; }
.box-faq li .link-faq.no-bo { border-top: none; }
.box-faq li .link-faq:hover { color: #020D1B; text-decoration: none; }
.box-faq li .link-faq:focus { color: #020D1B; text-decoration: none; }
.box-faq li .link-faq.active { color: #020D1B; text-decoration: none; }
.box-faq li .plus { width: 12px; height: 12px; position: relative; margin-top: 10px; margin-left: 30px; }
.box-faq li .plus::after { position: absolute; left: 0; top: 4px; width: 12px; height: 2px; background: #020D1B; display: block; content: ''; }
.box-faq li .plus::before { position: absolute; left: 0; top: 4px; width: 12px; height: 2px; background: #020D1B; transform: rotate(90deg); display: block; content: ''; transition: 0.3s; }
.box-faq li .sub::before { transform: rotate(0deg); transition: 0.3s; }
.box-faq li .content-faq { width: 100%; display: none; padding: 0 0 24px 0; font-size: 16px; }
.pic-product-detail { margin-bottom: 12px; cursor: pointer; }
.pic-product-detail .item-nav img { width: 100%; height: auto; aspect-ratio: 2/1; }
.pic-product-nav { padding: 0 50px; }
.pic-product-nav .item-nav { padding: 0 5px; cursor: pointer; }
.pic-product-nav .item-nav img { width: 100%; height: auto; aspect-ratio: 2/1; }
.pic-product-nav .slick-current img { border: 1px solid #0A2240; }
.pic-product-nav .sclick-arrow { position: absolute; background: #F8F8FA; border: none; outline: none; width: 40px; height: 40px; z-index: 3; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; cursor: pointer; color: #020D1B; }
.pic-product-nav .sclick-arrow:hover { color: #020D1B; }
.pic-product-nav .sclick-arrow::before { display: none; }
.pic-product-nav .sclick-arrow { bottom: 20px; }
.pic-product-nav .slick-prev { left: -5px; }
.pic-product-nav .slick-prev i { font-size: 22px; }
.pic-product-nav .slick-next { right: -5px; }
.pic-product-nav .slick-next i { font-size: 22px; }
.pic-product-nav .slick-disabled { display: none !important; }
.pic-product-detail-popu { margin-bottom: 12px; cursor: pointer; }
.pic-product-detail-popu .item-nav img { width: 100%; height: auto; aspect-ratio: 16/9; }
.pic-product-nav-popu { padding: 0 50px; }
.pic-product-nav-popu .item-nav { padding: 0 5px; cursor: pointer; }
.pic-product-nav-popu .item-nav img { width: 100%; height: auto; aspect-ratio: 2/1; }
.pic-product-nav-popu .slick-current img { border: 1px solid #0A2240; }
.pic-product-nav-popu .sclick-arrow { position: absolute; background: #F8F8FA; border: none; outline: none; width: 40px; height: 40px; z-index: 3; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; cursor: pointer; color: #020D1B; }
.pic-product-nav-popu .sclick-arrow:hover { color: #020D1B; }
.pic-product-nav-popu .sclick-arrow::before { display: none; }
.pic-product-nav-popu .sclick-arrow { bottom: 20px; }
.pic-product-nav-popu .slick-prev { left: -5px; }
.pic-product-nav-popu .slick-prev i { font-size: 22px; }
.pic-product-nav-popu .slick-next { right: -5px; }
.pic-product-nav-popu .slick-next i { font-size: 22px; }
.pic-product-nav-popu .slick-disabled { display: none !important; }
.box-select-size { padding: 8px 15px; border: 1px solid #ECECF2; outline: none; width: 100%; height: 45px; margin: 10px 0; border-radius: 0; }
.box-select-size:focus { border: 1px solid #0A2240; box-shadow: none; }
.under-line { text-underline-position: under; text-decoration: underline; }
.box-number-item { display: flex; padding: 10px 0; }
.box-number-item .bt-minus, .box-number-item .bt-plus { width: 45px; height: 45px; border: 1px solid #ECECF2; color: #020D1B; display: flex; justify-content: center; align-items: center; background: #fff; }
.box-number-item .add-number { width: 45px; height: 45px; border: none; text-align: center; }
.box-price-cart { display: flex; align-items: center; }
.price-now { font-size: 20px; font-weight: 600; padding-left: 10px; }
.price-old { color: #797F94; text-decoration: line-through; padding-left: 10px; }
.box-installment { background: #F8F8FA; padding: 16px; }
.box-installment span { font-weight: 700; }
.box-promotion { display: flex; margin: 0; padding: 0; justify-content: space-between; }
.box-promotion li { width: 49%; border: 1px solid #ECECF2; background: #F8F8FA; padding: 8px 12px; margin-right: 12px; font-size: 14px; }
.box-promotion li:last-child { margin-right: 0; }
.fix-bt-cart-mb { position: relative; background: transparent; }
.box-buton-cart { display: flex; margin: 0; padding: 0; justify-content: space-between; }
.box-buton-cart li { width: 49%; }
.box-buton-cart li:last-child { margin-right: 0; }
.btk { display: flex; text-align: center; align-items: center; gap: 8px; color: #fff; text-decoration: none; display: block; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; border: none; }
.bt-buy { padding: 16px 18px; background: #0A2240; font-weight: 400; line-height: 180%; letter-spacing: 0.128px; color: #fff !important; transition: all 0.3s; }
.bt-buy:hover { background: #013665; color: #fff; transition: all 0.3s; }
.bt-add-cart { padding: 16px; background: #B6A999 !important; font-weight: 400; line-height: 180%; letter-spacing: 0.128px; transition: all 0.3s; min-width: 100px; }
.bt-add-cart:hover { background: #cbc0b2 !important; color: #fff; }
.bt-add-cart-custom { padding: 16px !important; min-width: 100px; }
.bt-add-cart-custom:hover { background: #cbc0b2 !important; color: #fff; }
.bt-buy-now { padding: 8px 16px; background: #0A2240; font-weight: 400; line-height: 180%; letter-spacing: 0.128px; width: max-content; color: #fff !important; display: block; transition: all 0.3s; }
.bt-buy-now:hover { background: #013665; color: #fff; }
.box-sticky { width: 100%; position: sticky; top: 150px; }
.box-tinh-nang { width: 100%; display: flex; flex-wrap: wrap; padding: 0; border-top: 1px solid #CACADD; border-left: 1px solid #CACADD; }
.box-tinh-nang li { width: 50%; border-right: 1px solid #CACADD; border-bottom: 1px solid #CACADD; background: #ECECF2; padding: 16px; }
.box-tinh-nang li .tt-tinh { width: 100%; font-weight: 600; display: flex; margin-bottom: 10px; justify-content: space-between; }
.box-tinh-nang li .tt-tinh .bt-er { width: 24px; height: 24px; }
.box-tinh-nang li .tt-tinh .bt-er i { font-size: 18px; }
.box-tinh-nang li .text-inerbox { display: block; }
.line-bt { width: 100%; height: 1px; background: #ECECF2; }
.z-in-5 { z-index: 5; }
.bt-collap { width: 40px; height: 40px; background: #F8F8FA; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; text-decoration: none; color: #020D1B; display: flex; align-items: center; justify-content: center; }
.bt-collap i { font-size: 24px; }
.bt-collap:hover { color: #020D1B; }
.bt-hd { cursor: pointer; }
.nav-cart { width: 100%; border-bottom: 1px solid #ECECF2; }
.nav-cart .nav-cart-link { display: flex; position: relative; padding: 24px 0; }
.nav-cart .nav-cart-link a { width: 100%; min-height: 25px; display: block; color: #797F94; font-size: 20px; font-weight: 400; text-decoration: none; padding: 0 20px; line-height: 100%; text-align: center; border-left: 1px solid #ECECF2; }
.nav-cart .nav-cart-link a:hover { text-decoration: none; color: #FFA489; }
.nav-cart .nav-cart-link:first-child { border-left: none; }
.nav-cart .nav-cart-link:first-child a { border-left: 0; }
.nav-cart .nav-cart-link.active a { color: #FFA489; }
.nav-cart .nav-cart-link.active::after { width: 100%; height: 2px; background: #FFA489; position: absolute; left: 0; bottom: 0px; z-index: 2; content: ''; }
.nav-cart .sclick-arrow { position: absolute; background: #0A2240; border: none; outline: none; width: 26px; height: 26px; z-index: 3; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; cursor: pointer; color: #fff; }
.nav-cart .sclick-arrow:hover { color: #fff; }
.nav-cart .sclick-arrow::before { display: none; }
.nav-cart .sclick-arrow { bottom: 20px; }
.nav-cart .slick-prev { left: -30px; }
.nav-cart .slick-prev i { font-size: 14px; }
.nav-cart .slick-next { right: -30px; }
.nav-cart .slick-next i { font-size: 14px; }
.nav-cart .slick-disabled { display: none !important; }
.box-item-product-cart { padding: 22px 50px 0 0; display: grid; grid-template-columns: 36px auto; }
.box-item-product-cart i { color: #020D1B; font-size: 18px; }
.box-item-product-cart .item-cart { width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; padding-bottom: 22px; border-bottom: 1px solid #DDDDE7; }
.box-item-product-cart .item-cart .pic-item-cart { width: 30%; }
.box-item-product-cart .item-cart .pic-item-cart img { width: 100%; height: auto; aspect-ratio: 1/1; }
.box-item-product-cart .item-cart .box-info-price { width: 69%; display: grid; grid-template-columns: auto auto; flex-wrap: wrap; padding-left: 30px; flex-direction: column; justify-content: space-between; align-items: flex-start; }
.box-item-product-cart:last-child .item-cart { border-bottom: 0; }
.delete-item { display: block; color: #020D1B; text-decoration: none; }
.font-12 { font-size: 12px; line-height: 180%; letter-spacing: 0.112px; }
.font-14 { font-size: 14px; line-height: 180%; letter-spacing: 0.112px; }
.font-24 { font-size: 24px; line-height: 120%; letter-spacing: 0.192px; }
.font-32 { font-size: 32px; line-height: 160%; letter-spacing: 0.16px; }
.tom-tat-hang { width: 100%; border: 1px solid #DDDDE7; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; padding: 40px 30px; background: #ffffff; }
.tom-tat-hang .list-item { width: 100%; display: grid; grid-template-columns: 95px auto 150px; border-bottom: 1px solid #ECECF2; padding: 22px 0; }
.tom-tat-hang .list-item .thum-p { margin-right: 10px; }
.tom-tat-hang .list-item .thum-p img { width: 100%; height: 75px; aspect-ratio: 1/1; }
.tom-tat-hang .list-item .col-size { display: flex; flex-wrap: wrap; align-items: center; }
.tom-tat-hang .list-item .col-size .col-tl { width: 75%; }
.tom-tat-hang .list-item .col-size .col-tr { width: 25%; }
.tom-tat-hang .add-code { border: 1px solid #CACADD; padding: 16px; max-width: 100%; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px; margin-right: 20px; }
.col-bt-payment { display: block; }
.no-item-cart { text-align: center; }
.no-item-cart img { max-width: 100%; height: auto; }
.continue-shopping { max-width: 420px; margin: 50px auto; }
.banner-pro-cate { position: relative; }
.banner-pro-cate img { width: 100%; height: auto; object-fit: cover; }
.banner-pro-cate .clip-firm-series { width: 100%; height: auto; object-fit: cover; aspect-ratio: 21/10; }
.banner-pro-cate .clip-cloud-pro { background: #797F94; width: 100%; height: 100%; object-fit: cover; aspect-ratio: 1/1; }
.banner-pro-cate .box-info-banner { width: 100%; position: absolute; left: 0; bottom: 0; padding: 82px; display: flex; justify-content: space-between; align-items: center; z-index: 1; color: #ffffff !important; cursor: pointer; }
.banner-pro-cate .box-info-banner .tt-banner { width: max-content; }
.banner-pro-cate .box-info-banner .tt-banner .text-oject { font-size: 60px; font-weight: 600; line-height: 140%; letter-spacing: 0.12px; font-family: "Lora"; margin: 0; padding: 0; }
.banner-pro-cate .box-info-banner .tt-banner .text-oject-2 { font-size: 32px; font-weight: 600; line-height: 160%; letter-spacing: 0.064px; font-family: "Lora"; margin: 0; padding: 0; }
.banner-pro-cate .box-info-banner .tt-banner .text-content { font-size: 24px; font-weight: 400; line-height: 180%; letter-spacing: 0.192px; }
.banner-pro-cate .box-info-banner .icon-play { width: max-content; height: auto; text-decoration: none; display: block; }
.banner-pro-cate .box-info-banner .icon-play:hover { text-decoration: none; }
.banner-pro-cate .box-info-banner .icon-play img { width: 64px; height: 64px; }
.banner-pro-cate .box-info-banner .icon-play.more img { width: 52px; height: 52px; }
.pic-ability img { width: 100%; height: 100%; object-fit: cover; }
.block-ability { width: 50%; padding: 40px; text-align: center; border-bottom: 1px solid #ECECF2; border-left: 1px solid #ECECF2; }
.block-ability:nth-child(2n+1) { border-left: 0; }
.block-ability img { width: 48px; height: 48px; }
.block-ability .title-item { width: 100%; display: block; color: #FFA489; font-family: "Lora"; font-size: 24px; font-weight: 600; line-height: 180%; letter-spacing: 0.12px; }
.add-stky { max-width: 800px; margin: auto; position: sticky; top: 140px; margin-bottom: 400px; }
.ability-slide { max-width: 800px; margin: auto; position: relative; }
.ability-slide .item-slide { position: sticky; top: 270px; left: 0; display: flex; flex-wrap: wrap; height: 60vh; }
.ability-slide .item-slide img { width: 416px; height: 416px; }
.ability-slide .item-slide .tt-note { font-size: 32px; font-weight: 400; line-height: 160%; letter-spacing: 0.064px; font-family: "Lora"; text-align: left; padding-left: 70px; display: flex; align-items: center; }
.ability-slide .item-slide:nth-child(2n-2) img { transform: rotate(7.17deg); }
.ability-slide .item-slide:nth-child(1) { background: #ECECF2; }
.ability-slide .item-slide:nth-child(1) .tt-note { margin-bottom: 100px; }
.ability-slide .item-slide:nth-child(3) .tt-note { margin-bottom: -100px; }
.nav-cloud-pro .nav-item { margin: 0 10px; }
.nav-cloud-pro .nav-item .nav-link { color: #020D1B; background: #F8F8FA; border: 0; border-radius: 0.45rem; }
.nav-cloud-pro .nav-item .nav-link.active { background: #FFA489; }
.variations tbody tr td { display: block; }
.single_variation_wrap { display: block; }
.popup-big-pic { display: none; position: fixed; top: 0; left: 0; width: 100vw; height: 100%; padding: 100px 50px; background: #0000006e; box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); z-index: 1062; text-align: center; align-items: center; justify-content: center; opacity: 0; cursor: pointer; transition: all 0.3s; }
.popup-big-pic img { width: 100%; max-width: 75%; height: auto; margin: auto; object-fit: cover; aspect-ratio: 16/9; }
.popup-big-pic.show { display: flex; opacity: 1; animation-name: zoom; animation-duration: 0.6s; }
@keyframes zoom { from { transform: scale(0.1); }
to { transform: scale(1); } }  @media (max-width: 991.98px) { .no-bold { font-weight: 400; }
.text-mb-16 { font-size: 16px; }
.box-left-product { width: 100%; border: 0; background: #F8F8FA; }
.box-left-product .hidde-filter { cursor: pointer; display: block; }
.box-left-product .setup-filter { padding: 16px 16px 16px 26px; font-size: 12px; }
.box-left-product .accordion-item { background: transparent; padding-left: 10px; padding-right: 10px; }
.box-left-product .accordion-item .accordion-button { font-size: 12px; background: transparent; }
.box-left-product .accordion-item .accordion-button:not(.collapsed) { background: transparent; }
.box-left-product .accordion-item .accordion-button::after { background-image: url(//kingkoil.vn/wp-content/themes/kingkoil/assets/images/chevron-down.png); }
.box-left-product .accordion-item .accordion-filter { margin: 0 16px 0px 16px; border-bottom: 0; padding-bottom: 0px; }
.box-left-product .accordion-item .accordion-filter .item-filter { font-size: 12px; }
.box-left-product .accordion-item .accordion-filter .item-filter input[type="checkbox"] { width: 14px; height: 14px; }
.box-left-product .accordion-item:last-child .accordion-filter { border-bottom: 0; }
.all-product { font-family: "Lora"; font-weight: 600; }
.top-filter { font-size: 12px; width: 100%; display: flex; justify-content: space-between; padding: 12px 0; }
.top-filter .show-filter { background: #F8F8FA; padding: 12px; width: 45%; margin-right: 20px; color: #797F94; font-weight: 600; display: flex; justify-content: space-between; }
.top-filter .slect-filter { width: 55%; padding: 12px 30px 12px 12px; background-color: #F8F8FA; border: none; outline: none; cursor: pointer; border-radius: 0; font-size: 12px; }
.top-filter .slect-filter:focus { box-shadow: none; }
.box-item-product .pic-product img { max-height: 100%; }
.box-item-product .pic-product .bag { font-size: 14px; }
.box-item-product .box-info-product { height: auto; }
.box-item-product .box-info-product .title-pro { font-size: 16px; }
.box-item-product .box-info-product .price { font-size: 14px; }
.box-item-product .box-info-product .title-cloud-pro { font-size: 20px; }
.box-item-product .box-info-product .text-content-cloud-pro { font-size: 12px; }
.box-item-product .box-info-product .installment { font-size: 14px; }
.box-item-product .box-info-product .box-quality .item-quality { max-width: 240px; }
.box-item-product .box-info-product .box-quality .item-quality img { width: 16px; height: 16px; }
.box-item-product .box-info-product .box-quality .item-quality .tex { font-size: 14px; }
.slide-product-watched { padding-bottom: 50px; overflow: hidden; }
.slide-product-watched .slick-slide { margin-left: 15px; margin-right: 15px; }
.slide-product-watched .slick-list { margin-left: -15px; margin-right: -15px; }
.box-item-service .tt { font-size: 16px; }
.box-Evaluate { overflow: hidden; }
.box-Evaluate .box-comment { font-size: 16px; }
.box-Evaluate .box-comment .user-comment .name-cm { font-size: 16px; }
.box-Evaluate .box-comment .user-comment .name-cm p { padding: 0 0 10px 0; margin: 0; }
.box-Evaluate .box-comment .user-comment .name-cm i { font-size: 20px; margin-right: 8px; }
.box-faq { width: 100%; padding: 0; overflow: hidden; }
.box-faq li { padding: 0; margin: 0; }
.box-faq li:first-child { border-top: none; }
.box-faq li:first-child .link-factory { border-top: none; }
.info-service-kingkoll { overflow: hidden; }
.box-select-size { background-color: #F8F8FA; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; font-size: 12px; width: 60%; }
.box-number-item .bt-minus, .box-number-item .bt-plus { background-color: #F8F8FA; border: 1px solid #F8F8FA; }
.price-now { font-size: 16px; padding-left: 10px; }
.price-old { padding-left: 10px; }
.box-installment { padding: 12px; text-align: center; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; }
.box-promotion { font-size: 12px; }
.box-promotion li { -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; }
.box-tinh-nang { border-top: 0; border-left: 0; }
.box-tinh-nang li { width: 100%; padding-bottom: 12px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; margin-bottom: 10px; }
.box-tinh-nang li .tt-tinh { display: flex; }
.box-tinh-nang li .text-inerbox { display: none; }
.box-buton-cart li { width: 48%; }
.box-total-product .all-product { font-size: 20px; }
.nav-cart .nav-cart-link { padding: 10px 0; }
.nav-cart .nav-cart-link a { font-size: 12px; min-height: 15px; padding: 0 10px; }
.nav-cart .sclick-arrow { position: absolute; background: #0A2240; border: none; outline: none; width: 20px; height: 20px; z-index: 3; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; cursor: pointer; color: #fff; }
.nav-cart .sclick-arrow:hover { color: #fff; }
.nav-cart .sclick-arrow::before { display: none; }
.nav-cart .sclick-arrow { bottom: 15px; }
.nav-cart .slick-prev { left: -10px; }
.nav-cart .slick-prev i { font-size: 14px; }
.nav-cart .slick-next { right: -10px; }
.nav-cart .slick-next i { font-size: 14px; }
.nav-cart .slick-disabled { display: none !important; }
.box-item-product-cart { padding: 20px 0 0 0; grid-template-columns: 20px auto; }
.box-item-product-cart .item-cart { padding-bottom: 22px; border-bottom: 1px solid #DDDDE7; }
.box-item-product-cart .item-cart .box-info-price { grid-template-columns: auto; padding-left: 10px; position: relative; }
.delete-item { position: absolute; top: 50%; transform: translateY(-50%); right: 0; }
.box-number-item .bt-mb { width: 30px; height: 30px; }
.box-number-item .add-number-mb { width: 30px; height: 30px; }
.tom-tat-hang { padding: 14px; }
.tom-tat-hang .list-item { width: 100%; display: grid; grid-template-columns: 95px auto auto; border-bottom: 1px solid #ECECF2; padding: 22px 0; }
.tom-tat-hang .list-item .thum-p { margin-right: 10px; }
.tom-tat-hang .list-item .thum-p img { width: 100%; height: 75px; }
.tom-tat-hang .list-item .col-size { display: flex; flex-wrap: wrap; align-items: center; }
.tom-tat-hang .list-item .col-size .col-tl { width: 100%; }
.tom-tat-hang .list-item .col-size .col-tr { width: 100%; font-size: 12px; }
.tom-tat-hang .add-code { border: 1px solid #CACADD; padding: 10px 16px; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px; }
.col-bt-payment { position: fixed; left: 0; bottom: 0; right: 0; background: #ECECF2; padding: 20px; }
.banner-pro-cate .clip-firm-series { aspect-ratio: 7/10; }
.banner-pro-cate .clip-cloud-pro { background: #797F94; width: 100%; height: 100%; object-fit: cover; aspect-ratio: 1/1; }
.banner-pro-cate .box-info-banner { bottom: 24%; padding: 0 30px; }
.banner-pro-cate .box-info-banner .tt-banner .text-oject { font-size: 28px; order: 1; display: flex; justify-content: center; }
.banner-pro-cate .box-info-banner .tt-banner .text-oject-2 { font-size: 16px; }
.banner-pro-cate .box-info-banner .tt-banner .text-content { font-size: 12px; order: 0; display: flex; justify-content: center; }
.banner-pro-cate .box-info-banner .icon-play { text-align: center; padding-bottom: 30px; }
.banner-pro-cate .box-info-banner .icon-play.more { margin-right: 20px; }
.banner-pro-cate .box-info-banner .icon-play.more img { width: 28px; height: 28px; }
.block-ability { padding: 15px 40px; }
.block-ability img { width: 40px; height: 40px; opacity: 0.6; }
.block-ability .title-item { color: #797F94; font-size: 12px; }
.block-ability.active img { opacity: 1; }
.block-ability.active .title-item { color: #FFA489; }
.text-info-ability-mb { width: 100%; padding: 22px 16px; text-align: center; font-size: 12px; font-weight: 400; line-height: 180%; letter-spacing: 0.096px; }
.text-info-ability-mb img { width: 100%; max-width: 160px; margin: 20px auto; }
.text-info-ability-mb .tt-a { font-family: "Lora"; font-size: 24px; font-weight: 600; line-height: 180%; letter-spacing: 0.12px; color: #FFA489; }
.nav-cloud-pro .nav-item { margin: 0 5px; }
.nav-cloud-pro .nav-item .nav-link { padding: 0.5rem 0.5rem; font-size: 12px; }
.ability-for { margin-bottom: 10px; }
.ability-for .item-nav { position: relative; }
.ability-for .item-nav .tt-mb { position: absolute; left: 0; bottom: 20px; width: 100%; font-family: "Lora"; font-size: 16px; font-weight: 600; line-height: 180%; letter-spacing: 0.08px; color: #fff; text-align: center; }
.ability-for .item-nav img { width: 100%; height: auto; object-fit: cover; aspect-ratio: 1/1; }
.ability-nav .item-nav { margin: 0 5px; }
.ability-nav .item-nav img { width: 100%; height: auto; object-fit: cover; aspect-ratio: 1/1; }
.wpc-filters-main-wrap ul li.wpc-term-item a { font-size: 12px; }
.wpc-filters-main-wrap ul li.wpc-term-item input[type=checkbox] { width: 16px; height: 16px; min-width: auto; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; border-radius: 4px; margin-right: 6px !important; }
.mb-full-filter .wpc-button-inner { justify-content: space-between; }
.mb-full-filter .wpc-button-inner .wpc-icon-html-wrapper { display: none; }
.variations tbody tr td { display: flex; justify-content: space-between; align-items: center; }
.single_variation_wrap { width: 100%; display: flex; justify-content: space-between; align-items: center; }
.popup-big-pic { padding: 6%; }
.popup-big-pic img { max-width: 100%; aspect-ratio: 15/11; } }
@media (min-width: 320px) and (max-width: 768px) { .pt-page { margin-top: 70px; }
.pt-page-1 { margin-top: 14px; } }
@media (min-width: 768px) and (max-width: 820px) { .pt-page { margin-top: 70px; }
.pt-page-1 { margin-top: 14px; } }
@media (max-width: 991.98px) { .fix-bt-cart-mb { position: fixed; background: #F8F8FA; bottom: 0; left: 0; right: 0; } } @media (min-width: 980px) and (max-width: 1439px) { .nav-cart .nav-cart-link a { font-size: 15px; padding: 0 12px; } } .box-slect-city { width: 49%; margin-right: 10px; }
.box-slect-city:last-child { margin-right: 0; }
.sect-city { padding: 20px 24px; width: 100%; border: 1px solid #CACADD; outline: none; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px; }
.sect-city:focus { border: 1px solid #CACADD; box-shadow: none; }
#map { width: 100%; height: 100%; min-height: 400px; }
.title-agency { font-family: "Lora"; font-size: 24px; font-weight: 600; line-height: 180%; letter-spacing: 0.12px; }
.box-agency { width: 100%; max-height: 790px; overflow: auto; overflow-y: scroll; padding-right: 17px; margin-bottom: 10px; }
.box-agency .item-agency { width: 100%; background: #fff; border: 1px solid #ECECF2; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px; padding: 16px; margin-bottom: 10px; }
.box-agency .item-agency .agency-tt { background: #F8F8FA; width: max-content; -webkit-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; border-radius: 50px; padding: 5px 16px; display: block; }
#style-4::-webkit-scrollbar-track { background-color: #F8F8FA; }
#style-4::-webkit-scrollbar { width: 6px; background-color: #F8F8FA; }
#style-4::-webkit-scrollbar-thumb { background-color: #797F94; -webkit-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; border-radius: 50px; }
.font-20 { font-size: 20px; line-height: 180%; }
.nav-store { padding: 42px 0 17px 0; border-bottom: 1px solid #CACADD; }
.nav-store .nav-item .nav-link { color: var(--neutral-5, #CACADD); font-size: 20px; font-weight: 600; padding: 0; line-height: 100%; border: none; background: transparent; margin: 12px 25px; position: relative; }
.nav-store .nav-item .nav-link:hover { color: var(--neutral-8, #020D1B); }
.nav-store .nav-item .nav-link:hover::after { position: absolute; left: 0; bottom: -30px; width: 100%; height: 4px; background: #020D1B; content: ''; }
.nav-store .nav-item:first-child .nav-link { padding-left: 0; margin-left: 0; }
.nav-store .nav-item:last-child .nav-link { border-right: 0; }
.nav-store .nav-item .active { color: var(--neutral-8, #020D1B); font-weight: 600; position: relative; transition: all 0.3s; }
.nav-store .nav-item .active::after { position: absolute; left: 0; bottom: -30px; width: 100%; height: 4px; background: #020D1B; content: ''; }
.box-notice { border-radius: 8px; background: var(--brand-champange-gold, #B6A999); color: #FFF; line-height: 180%; letter-spacing: 0.128px; padding: 16px 24px; }
.warning-access-location i { width: 48px; height: 48px; color: #FF0000; }
.warning-access-location i::before { font-size: 48px; }
.notice-access-location { color: #000; text-align: center; font-size: 20px; font-weight: 600; line-height: 180%; letter-spacing: 0.16px; display: inline-block; padding-top: 10px; }
.pic-map img { width: 100%; height: auto; object-fit: cover; }  @media (max-width: 820px) { .nav-store { flex-wrap: nowrap; }
.nav-store .nav-item .nav-link { font-size: 16px; margin: 0px 25px; }
.nav-store .nav-item .nav-link:hover::after { bottom: -18px; }
.nav-store .nav-item .active::after { bottom: -18px; }
.font-mb-20 { font-size: 16px !important; }
.sect-city { padding: 16px 20px; } }
.bg-act { width: 100%; background: url(//kingkoil.vn/wp-content/themes/kingkoil/assets/images/bg-acount.png) no-repeat center bottom; background-size: cover; padding-bottom: 300px; }
.line-login { width: 100%; height: 1px; position: relative; background: #ECECF2; margin: 20px 0; }
.line-login span { display: block; width: max-content; background: #fff; position: absolute; padding: 0 20px; top: -13px; left: 50%; transform: translateX(-50%); }
.line-right { position: relative; }
.line-right::after { position: absolute; top: 30%; right: -2px; width: 1px; height: 500px; background: #DDDDE7; content: ''; }
.login-box .slick-list { overflow: hidden; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; }
.bt-back { font-size: 20px; color: #353D49; text-decoration: none; display: flex; align-items: center; }
.bt-back:hover { color: #353D49; text-decoration: none; }
.box-address { width: 100%; padding: 20px; border: 1px solid #CACADD; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px; color: #797F94; margin-bottom: 20px; background: #fff; }
.box-address.active { border: 2px solid #0A2240; color: #0A2240; }
.box-address.active .payment-methods i { font-weight: 900; }
.box-address.active a { color: #FF8561; text-decoration: none; display: block; }
.box-address.active a:hover { color: #FF8561; text-decoration: none; }
.box-address a { color: #797F94; text-decoration: none; display: block; }
.box-address a:hover { color: #797F94; text-decoration: none; }
.payment-methods { display: flex; justify-content: space-between; align-items: center; cursor: pointer; }
.payment-methods i { margin-right: 10px; }
.payment-methods .icon-payment { width: max-content; height: 44px; display: flex; align-items: center; }
.payment-methods .icon-payment img { max-height: 44px; width: auto; }
.item-atm { border: 1px solid #DDDDE7; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; border-radius: 4px; display: flex; justify-content: center; align-items: center; cursor: pointer; }
.item-atm.active { border: 2px solid #0A2240; }
.item-atm.h-110 { height: 110px; }
.item-atm.h-80 { height: 80px; }
.item-atm img { max-width: 100%; height: auto; }
.select-month { border: 0; font-size: 20px; }
.box-payment-success { padding: 208px 0 40px; }
.w-18 { width: 18%; }  @media (max-width: 820px) { .bg-act { background: none; padding-bottom: 50px; }
.line-right::after { display: none; }
.bt-back { font-size: 12px; margin-bottom: 20px; }
.bt-back i { font-size: 20px; margin-left: -5px; }
.box-address { padding: 15px; }
.box-address .payment-methods { font-size: 12px; }
.box-address.active .payment-methods { font-size: 12px; }
.box-address.active .payment-methods i { font-weight: 900; }
.box-payment-success { padding: 138px 0 40px; }
.w-100-mb { width: 100% !important; } }
.slide-thumb-communities { overflow: hidden; padding-bottom: 60px; margin-bottom: 104px; }
.slide-thumb-communities .slick-slide { margin-left: 22px; margin-right: 22px; }
.slide-thumb-communities .slick-list { margin-left: -22px; margin-right: -22px; }
.slide-thumb-communities .communities-item .pic-thimb { padding-bottom: 31px; }
.slide-thumb-communities .communities-item .pic-thimb img { width: 100%; height: auto; aspect-ratio: 3/2; }
.slide-thumb-communities .communities-item .box-text-info .title-5 { font-size: 24px; font-family: "Lora"; font-weight: 600; }
.slide-thumb-communities .slick-dots { justify-content: center; align-items: center; bottom: -20px; }
.slide-thumb-communities .slick-dots .slick-active button { position: relative; }
.slide-thumb-communities .slick-dots .slick-active button::before { position: absolute; top: -8px; left: -8px; width: 24px; height: 24px; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; border: 1px solid #0A2240; content: ''; visibility: visible; }
.slide-thumb-communities .slick-dots button { font-size: 0; background: #0A2240; border: none; width: 8px; height: 8px; cursor: pointer; transition: all 0.2s linear; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; padding: 0; }
.slide-thumb-communities .slick-dots button::before { visibility: hidden; }
.box-slide-middle-com { background: #F8F8FA; padding: 104px 0; }
.w-com { width: 50%; }
@media (max-width: 991.98px) { .w-com { width: 100%; } }  @media (max-width: 820px) { body { font-size: 14px; }
.py-104 { padding-top: 44px; padding-bottom: 44px; }
.w-60 { width: 100%; }
.w-40 { width: 100%; }
.main-banner { padding: 0; position: relative; }
.pic-page img { aspect-ratio: 1/1; }
.box-banner { background-repeat: no-repeat; background-size: cover; background-position: 50% 0; }
.box-banner .lbanner { max-width: 768px; color: #fff; margin-bottom: 115px; padding: 0 20px; }
.box-banner .lbanner h1 { font-size: 28px; }
.box-banner .lbanner h2 { font-size: 12px; }
.full-midle-content { padding: 44px 0; }
.title-2 { font-size: 20px; line-height: 140%; }
.title-3 { font-size: 28px; }
.title-4 { font-size: 20px; }
.title-5 { font-size: 28px; }
.title-6 { font-size: 28px; }
.box-price span { font-size: 16px; }
.text-content { font-size: 12px; padding: 0 15px; }
.box-left-slide-middle { min-height: 430px; background-position: 0; }
.box-left-slide-middle-abso { position: relative; }
.box-left-slide-middle-abso .container { height: 100%; }
.box-slide-middle-mb { padding: 0; margin: 10px 0px; background: #fff; }
.box-slide-middle-mb .item-pic span { margin: 0; display: block; }
.box-slide-middle-mb .item-pic span img { width: 100%; height: auto; object-fit: cover; aspect-ratio: 1/1; }
.box-slide-middle-mb .slick-slide { margin-left: 5px; margin-right: 5px; }
.box-slide-middle-mb .slick-list { margin-left: -5px; margin-right: -5px; }
.box-slide-middle-mb .slick-dots { justify-content: center; align-items: center; bottom: -60px; }
.box-slide-middle-mb .slick-dots .slick-active button { position: relative; }
.box-slide-middle-mb .slick-dots .slick-active button::before { position: absolute; top: -8px; left: -8px; width: 24px; height: 24px; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; border: 1px solid #0A2240; content: ''; visibility: visible; }
.box-slide-middle-mb .slick-dots button { font-size: 0; background: #0A2240; border: none; width: 8px; height: 8px; cursor: pointer; transition: all 0.2s linear; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; padding: 0; }
.box-slide-middle-mb .slick-dots button::before { visibility: hidden; }
.text-content-left-slide { justify-content: end; padding: 104px 0px 27px 0; }
.text-content-left-slide .tt-1 { font-size: 16px; padding-bottom: 15px; }
.text-content-left-slide .tt-2 { font-size: 12px; text-align: left; }
.item-why .text-oject { font-size: 16px; }
.box-product { padding: 44px 0; }
.nav-products { padding: 0; margin-bottom: 0; }
.nav-products .nav-item .nav-link { font-size: 14px; padding: 0 20px; }
.nav-products .nav-item:first-child .nav-link { padding-left: 0px; }
.nav-products .slick-arrow { width: 18px; height: 18px; }
.nav-products .slick-prev { left: -10px; }
.nav-products .slick-prev i { font-size: 12px; }
.nav-products .slick-next { right: -10px; }
.nav-products .slick-next i { font-size: 12px; }
.box-product-l { display: flex; flex-wrap: wrap; }
.box-list-number { padding: 20px 0; }
.bt-see-product { width: 100%; font-size: 12px; }
.box-style-king { padding: 44px 0; }
.box-footer .logo-footer { padding-bottom: 40px; }
.box-footer .logo-footer img { width: 100%; height: auto; max-width: 232px; }
.box-footer .nav-footer { padding: 10px 0 0 0; }
.box-footer .nav-footer li { width: 100%; margin-left: 0px; }
.box-footer .nav-footer li .text-title-mb { cursor: pointer; display: flex; justify-content: space-between; }
.box-footer .nav-footer li .list-nav-mb { display: none; }
.box-footer .nav-footer li .plus { width: 18px; height: 18px; position: relative; margin-top: 10px; margin-left: 30px; display: block; }
.box-footer .nav-footer li .plus::after { position: absolute; left: 0; top: 4px; width: 18px; height: 2px; background: #fff; display: block; content: ''; }
.box-footer .nav-footer li .plus::before { position: absolute; left: 0; top: 4px; width: 18px; height: 2px; background: #fff; transform: rotate(90deg); display: block; content: ''; transition: 0.3s; }
.box-footer .nav-footer li .sub::before { transform: rotate(0deg); transition: 0.3s; }
.box-footer .box-contact-media { width: 100%; padding: 44px 0 0 0; font-size: 14px; }
.box-footer .box-contact-media ul li .address { opacity: 1; }
.box-footer .box-contact-media ul li i { font-size: 22px; margin-right: 15px; }
.box-footer .box-contact-media ul li a { color: #fff; text-decoration: none; margin-left: 5px; }
.box-footer .box-contact-media ul li a:hover { color: #fff; text-decoration: underline; }
.box-icon-chat:hover .b-tooltip { display: none; }
.box-banner-more img { aspect-ratio: 2/1; }
.font-12-mb { font-size: 12px; } }
@media (min-width: 320px) and (max-width: 767.98px) { .big-banner .slick-dots { width: max-content; display: flex; flex-direction: row; align-items: center; gap: 5px; left: 0px; bottom: 50px; padding: 0 0 0 40px; }
.big-banner .slick-dots .slick-active button { position: relative; }
.big-banner .slick-dots .slick-active button::after { width: 22px; height: 22px; }
.big-banner .slick-dots button { width: 6px; height: 6px; }
.font-16 { font-size: 14px; }
.box-list-number li .list-item { font-size: 14px; }
.box-footer { padding: 34px 0 100px 0; }
.box-footer .logo-footer { padding-bottom: 30px; }
.box-footer .logo-footer img { width: 100%; height: auto; max-width: 162px; } } @media (min-width: 768px) and (max-width: 991px) { .big-banner .slick-dots { transform: translate(0%); justify-content: flex-start; align-items: flex-end; display: flex; flex-direction: row; left: 5%; bottom: 50px; width: 300px; padding: 0 0 0 35px; }
.big-banner .slick-dots button { margin-right: 15px; }
.box-footer { padding: 44px 0 120px 0; } }
@media (min-width: 820px) and (max-width: 1023px) { .w-60 { width: 100%; }
.w-40 { width: 100%; }
.box-left-slide-middle { min-height: 430px; background-position: 0; }
.box-left-slide-middle-abso { position: relative; }
.box-left-slide-middle-abso .container { height: 100%; }
.box-slide-middle-mb { padding: 0; margin: 10px 0; background: #fff; }
.box-slide-middle-mb .item-pic span { margin: 0; display: block; }
.box-slide-middle-mb .item-pic span img { width: 100%; height: auto; object-fit: cover; aspect-ratio: 1/1; }
.box-slide-middle-mb .slick-slide { margin-left: 5px; margin-right: 5px; }
.box-slide-middle-mb .slick-list { margin-left: -5px; margin-right: -5px; }
.box-slide-middle-mb .slick-dots { justify-content: center; align-items: center; bottom: -60px; }
.box-slide-middle-mb .slick-dots .slick-active button { position: relative; }
.box-slide-middle-mb .slick-dots .slick-active button::before { position: absolute; top: -8px; left: -8px; width: 24px; height: 24px; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; border: 1px solid #0A2240; content: ''; visibility: visible; }
.box-slide-middle-mb .slick-dots button { font-size: 0; background: #0A2240; border: none; width: 8px; height: 8px; cursor: pointer; transition: all 0.2s linear; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; padding: 0; }
.box-slide-middle-mb .slick-dots button::before { visibility: hidden; } }
@media (max-width: 991px) { .icon-chat-mb { bottom: 120px; }
.fixed-top-2 { position: fixed; top: 70px; right: 0; left: 0; z-index: 1030; } } @media (min-width: 992px) and (max-width: 1439px) { .navbar { padding: 0; }
.navbar .logo-kingkoll { padding: 20px 0; width: 130px; }
.navbar .nav-kingkoll li { padding: 15px; }
.navbar .nav-kingkoll li a { font-size: 14px; }
.navbar .box-search { display: flex; justify-content: space-between; padding-top: 28px; }
.navbar .box-search .item-search { max-width: 135px; }
.nav-products .nav-item .nav-link { font-size: 16px; } }  .menu-toggle { justify-self: end; margin-right: 5px; display: none; }
.menu-toggle .bar { width: 26px; height: 2px; background-color: #fff; margin: 6px 0; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; border-radius: 10px; }
.menu-toggle:hover { cursor: pointer; }
#mobile-menu.is-active { position: relative; transition: 0.4s; position: relative; }
#mobile-menu.is-active .bar:nth-child(2) { opacity: 0; }
#mobile-menu.is-active .bar:nth-child(1) { -webkit-transform: translateY(7px) rotate(45deg); -ms-transform: translateY(7px) rotate(45deg); -o-transform: translateY(7px) rotate(45deg); transform: translateY(7px) rotate(45deg); }
#mobile-menu.is-active .bar:nth-child(3) { -webkit-transform: translateY(-9px) rotate(-45deg); -ms-transform: translateY(-9px) rotate(-45deg); -o-transform: translateY(-9px) rotate(-45deg); transform: translateY(-9px) rotate(-45deg); width: 26px; } @-webkit-keyframes gradbar { 0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; } }
@-moz-keyframes gradbar { 0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; } }
@keyframes gradbar { 0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; } } @media (max-width: 991px) { .menu-toggle, .bar { display: block; cursor: pointer; }
.is-active { position: relative; transition: 0.4s; }
.navbar { top: 0; left: 0; z-index: 6; background: #0A2240; padding: 20px 0; }
.navbar .box-user-mb { margin-right: 15px; }
.navbar .box-user-mb i { color: #fff; font-size: 20px; }
.navbar .logo-kingkoll { padding: 0; }
.navbar .logo-kingkoll img { max-width: 100%; height: auto; }
.navbar .all-nav-kingkoll { position: fixed; right: 0; z-index: 3; width: 100% !important; height: calc(100vh - 55px); transform: translate(106%); transition: 0.6s; background: #ffffff; overflow: hidden; align-content: flex-start; height: 100vh; overflow-y: scroll; }
.navbar .all-nav-kingkoll .logo-kingkoll { display: none !important; }
.navbar .nav-kingkoll { flex-direction: column; justify-content: start; width: 100%; }
.navbar .nav-kingkoll li { padding: 0; border-top: 1px solid #ECECF2; }
.navbar .nav-kingkoll li a { padding: 15px; color: #0A2240; font-size: 12px; }
.navbar .nav-kingkoll li:hover .sub-nav-1 { display: block; }
.navbar .nav-kingkoll li.menu-item-has-children > a { background: #ECECF2; color: #353D49; }
.navbar .nav-kingkoll li.menu-item-has-children > a::after { display: none; }
.navbar .nav-kingkoll li.menu-item-has-children > a::before { display: none; top: 30%; right: 10px; width: 20px; height: 14px; background: url(//kingkoil.vn/wp-content/themes/kingkoil/assets/images/black-chevron-down.png) no-repeat; }
.navbar .nav-kingkoll li .sub-menu { position: inherit; opacity: 1; top: 0; left: 0; transform: translate(0); width: 100%; background: #fff; padding: 0px; }
.navbar .nav-kingkoll li .sub-menu ul { margin: 0; padding: 0; display: flex; flex-wrap: wrap; width: 100%; }
.navbar .nav-kingkoll li .sub-menu ul > li { margin: 0; padding: 0 10px; width: 100%; border-top: 0; }
.navbar .nav-kingkoll li .sub-menu ul > li a { padding: 10px 15px; text-decoration: none; display: block; }
.navbar .nav-kingkoll li .sub-menu ul > li a:hover { text-decoration: none; }
.navbar .nav-kingkoll .active > a { color: #0A2240; }
.navbar .nav-kingkoll .active > a:hover, .navbar .nav-kingkoll .active > a:focus { color: #0A2240; }
.navbar .mobile-nav { transform: translate(0%) !important; }
.navbar .box-search { padding: 12px; width: 100%; }
.navbar .box-search .item-search { max-width: 100%; }
.navbar .box-search .item-search input[type=submit] { left: 10px; background: url(//kingkoil.vn/wp-content/themes/kingkoil/assets/images/icon-serach-m.png) no-repeat center; }
.navbar .box-search .item-search input { width: 100%; border: 1px solid #ECECF2; padding: 10px 15px 10px 35px; background: #F8F8FA; color: #0A2240; }
.language-selector { position: relative; }
.language-selector .bt-language { color: #fff; display: flex; text-decoration: none; align-items: center; }
.language-selector .bt-language i { font-size: 16px; margin: 3px 0 0 3px; }
.language-selector .sub-language { left: 0; }
.language-selector .open { opacity: 1; transform: translateY(0px); } }
@media (min-width: 320px) and (max-width: 768px) { .navbar .logo-kingkoll { padding: 0; max-width: 180px; }
.navbar .logo-kingkoll img { max-width: 119px; height: auto; }
.navbar .all-nav-kingkoll { top: 70px; padding-bottom: 140px; } } @media (min-width: 768px) and (max-width: 991px) { .navbar .logo-kingkoll img { max-width: 119px; height: auto; }
.navbar .all-nav-kingkoll { top: 70px; padding-bottom: 120px; } }