@font-face
{
    font-family: 'HZ';
    src: url('../css/font/UTMHanzel.eot'); /* IE9 Compat Modes */
    src: url('../css/font/UTMHanzel.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../css/font/UTMHanzel.woff') format('woff'), /* Modern Browsers */
    url('../css/font/UTMHanzel.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../css/font/UTMHanzel.svg#UTMHanzel') format('svg'); /* Legacy iOS */
}
@font-face
{
    font-family: 'GB';
    src: url('../css/font/GoogleSans-Bold.eot'); /* IE9 Compat Modes */
    src: url('../css/font/GoogleSans-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../css/font/GoogleSans-Bold.woff') format('woff'), /* Modern Browsers */
    url('../css/font/GoogleSans-Bold.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../css/font/GoogleSans-Bold.svg#GoogleSans-Bold') format('svg'); /* Legacy iOS */
}
@font-face
{
    font-family: 'GR';
    src: url('../css/font/GoogleSans-Regular.eot'); /* IE9 Compat Modes */
    src: url('../css/font/GoogleSans-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../css/font/GoogleSans-Regular.woff') format('woff'), /* Modern Browsers */
    url('../css/font/GoogleSans-Regular.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../css/font/GoogleSans-Regular.svg#GoogleSans-Regular') format('svg'); /* Legacy iOS */
}

.imgc, .imgc0{position:relative;z-index:1;display: block}
.imgc:before, .imgc0:before{content:"";display:block;padding-bottom: 66.66%}
.imgc img {object-fit: cover;width: 100%;height: 100%;position: absolute;top: 0;left: 0;display: block}
.imgc0 img {width: 100%;height: 100%;position: absolute;object-fit: scale-down;display: block;top: 0;left: 0}
.imgc iframe {position: absolute;top: 0;left: 0;width: 100%;height: 100%}

.TextSize {margin-bottom: 20px;line-height: 22px}
.TextSize b, .TextSize strong {font-weight: normal;font-family: 'GB'}
.TextSize img {max-width: 100%;height: auto !important}
.TextSize table, .TextSize iframe {max-width: 100%}
.TextSize .imgc.video:before {padding-bottom: 56.25%}
.slick-arrow {border: none;outline: none;cursor: pointer;position: absolute;z-index: 3;box-sizing: border-box;width: 40px;height: 40px;border-radius: 50%;background-color: rgba(0,0,0,0.2);left: 10px;top: calc(50% - 20px);box-shadow: 0 0 10px rgba(255,255,255,0.8)}
.slick-next {left: auto;right: 10px}
.slick-arrow:hover {background-color: var(--main-color)}
.slick-prev:before {content: "\f104";font: 16px FontAwesome;color: white}
.slick-next:before {content: "\f105";font: 16px FontAwesome;color: white}
.slick-list * {outline: none}
.slick-list {overflow: hidden}
.slick-slider {-webkit-user-select: text;-moz-user-select: text;-ms-user-select: text;user-select: text;}
.fancybox-caption {text-align: center}
.cb {clear: both}
.dn {display: none !important}
#CommonCuoiChiTietTin .fb_iframe_widget span, .commonTool .fb_iframe_widget span {display: block}
#CommonCuoiChiTietTin .fb_iframe_widget, .commonTool .fb_iframe_widget {float: left}

.commonTool {text-align: center;margin-bottom: 30px;color: #999}
.commonTool span {display: inline-block;padding: 0 10px;border: 1px solid #eee;border-radius: 3px;line-height: 30px;margin: 0 3px;cursor: pointer;height: 30px}
.commonTool span sup {line-height: 0}
.commonTool span.sizeText:hover {background-color: var(--main-color);color: white}

#CommonCuoiChiTietTin {overflow: hidden;padding: 7px 0 5px 0;border-top: 1px solid #eee;border-bottom: 1px solid #eee;margin-bottom: 20px}
#CommonCuoiChiTietTin .apd {float: left}
#CommonCuoiChiTietTin .apd a {font-size: 15px;float: left;text-decoration: none;color: #333;padding: 0 12px;margin-right: 5px;border-radius: 5px;line-height: 26px;position: relative;background-color: #f0f0f0}
#CommonCuoiChiTietTin .apd a:before {margin-right: 5px}
#CommonCuoiChiTietTin .apd a:hover {color: white;background-color: var(--main-color)}
#CommonCuoiChiTietTin .apd a:hover:before {filter: brightness(0) invert(1);-webkit-filter: brightness(0) invert(1);-moz-filter: brightness(0) invert(1)}
#CommonCuoiChiTietTin .right {float: right;margin-bottom: 0}
#CommonCuoiChiTietTin .right .shareItem {float: left;margin-left: 5px}
.SplitPages {display: inline-block}
.SplitPages a {font-size: 14px;display: inline-block;margin: 0 3px;height: 32px;line-height: 32px;min-width: 32px;text-decoration: none;border: 1px solid #cecece;color: #333;text-align: center;background-color: white}
.SplitPages .dau:before, .SplitPages .cuoi:before, .SplitPages .truoc:before, .SplitPages .sau:before {content: "\f100";font: 16px FontAwesome}
.SplitPages .cuoi:before {content: "\f101"}
.SplitPages .truoc:before {content: "\f104"}
.SplitPages .sau:before {content: "\f105"}
.SplitPages a:hover, .SplitPages a.hientai {background-color: var(--main-color);color: white}
.phantrang {overflow: hidden;border-top: 1px solid #ececec;padding: 20px 0;text-align: right}
.ndCate.TextSize {margin-bottom: 70px}
.TextSize.show {max-width: 850px;margin-left: auto;margin-right: auto}


#wrap {overflow: hidden;position: relative}
body {padding: 0;margin: 0;font: 16px 'GR';color: #333;position: relative}
.container {width: calc(100% - 140px);margin: 0 auto}

#header {height: 100px}
#header .top {padding-top: 12px}
#header .top .left {float: left}
#header .top .left a {text-decoration: none;color: #333;font-size: 15px;margin-right: 20px}
#header .top .left a i {color: var(--main-color)}
#header .top .left a span {font-family: 'GB'}
#header .lang {float: left;overflow: hidden;padding: 5px 3px;border: 1px solid #cecece}
#header .lang a {float: left;margin: 0 2px}
#header .lang img {max-width: 25px;max-height: 18px;display: block}
#header .top .right {float: right}
#header .search {float: left;margin-right: 7px;border: 1px solid #cecece;position: relative}
#header .search input {width: 150px;height: 28px;padding: 0 10px;border-right: none;font: 14px 'GR';float: left;outline: none;background: none;color: #333;border: none}
#header .search a {float: right;width: 30px;height: 28px;text-align: center;color: #333;font-size: 13px;line-height: 30px}

#header .logo {width: 275px;margin: 0 auto;background: url(images/bg_logo.png) no-repeat bottom center;z-index: 2;position: relative;padding-bottom: 30px}
#header .logo .imgc0 {width: 217px;margin: 8px auto 0 auto}
#header .logo .imgc0:before {padding-bottom: 72px}

#footer {padding-top: 70px;color: white;position: relative}
#footer:before {content: "";display: block;width: 100%;height: calc(100% + 200px);position: absolute;left: 0;bottom: 0;background: url(images/bg_ft.jpg) no-repeat bottom center;background-size: cover}
#footer .camket {overflow: hidden;background: linear-gradient(to right, var(--main-color), var(--other-color));margin-bottom: 40px;color: white}
#footer .camket .item {width: 25%;box-sizing: border-box;float: left;padding: 15px 20px;overflow: hidden}
#footer .camket .imgc0 {width: 50px;height: 50px;border-radius: 50%;float: left;background-color: rgba(255,255,255,0.3)}
#footer .camket img {filter: brightness(0) invert(1);-webkit-filter: brightness(0) invert(1);-moz-filter: brightness(0) invert(1)}
#footer .camket .info {width: calc(100% - 60px);float: right}
#footer .camket .title {text-transform: uppercase;font-family: GB;margin: 4px 0}

#footer .logo_ft {width: 265px;margin: 0 auto 60px auto}
#footer .logo_ft:before {padding-bottom: 87px}
#footer .col_ft {width: calc((100% - 750px)/3);float: left;margin-right: 30px;position: relative}
#footer .col_ft:nth-child(2) {width: 330px}
#footer .col_ft:nth-child(6) {width: 300px;margin-right: 0}
#footer .col_ft:nth-child(6) img {max-width: 100%}
#footer .title {font-family: 'GB';text-transform: uppercase;margin-bottom: 15px}
#footer .col_ft .item {margin-bottom: 10px;padding-left: 25px;line-height: 24px;position: relative}
#footer .col_ft .item i {position: absolute;top: 2px;left: 0;width: 20px;height: 20px;text-align: center;line-height: 20px;color: #91d1ff}
#footer .mnFooter {display: block;text-decoration: none;color: white;margin-bottom: 8px;padding-left: 15px;position: relative}
#footer .mnFooter:before {content: "";display: block;width: 5px;height: 5px;border: 1px solid #91d1ff;position: absolute;left: 0;top: 7px;border-radius: 50%}
#footer .mnFooter:hover {color: #91d1ff}
#footer .mnFooter:hover:before {background-color: #91d1ff}
#footer .mxhFT {display: inline-block;text-decoration: none;margin-right: 3px}
#footer .mxhFT img {max-width: 40px;max-height: 40px}
#footer .alertBCT {margin-top: 30px}
#footer .alertBCT img {display: block;max-width: 100%}
#footer .license {margin-top: 70px;padding: 20px 0;text-align: center;position: relative}
#footer .license:before {content: "";display: block;width: 100%;height: 100%;position: absolute;top: 0;left: 0;background-color: var(--main-color);opacity: 0.1}
#footer .license .container {position: relative;z-index: 2}
#footer .license a {text-decoration: none;color: white}
#footer .license a:hover {color: var(--main-color)}

#fixRight {width: 44px;position: fixed;z-index: 4;right: 10px;bottom: 100px}
#fixRight .imgc0 {margin-bottom: 10px;text-decoration: none}
#fixRight .imgc0:before {padding-bottom: 100%}
#page_head {display: block;width: 44px;height: 44px;background-color: #333;border-radius: 50%;color: white;text-align: center;line-height: 44px}

.cskhFT {position: relative}
.cskhFT:before {content: "";display: block;width: 100%;height: calc(100% - 200px);position: absolute;z-index: -1;top: 0;left: 0;background: linear-gradient(to top, #005a99, #f6fbff)}
.formHome {overflow: hidden;display: flex;box-shadow: 0 -5px 10px rgba(0,0,0,0.1);position: relative;z-index: 3}
.formHome .left {width: 50%;float: left;box-sizing: border-box;background: #fcfcfc url(images/ht_l.png) no-repeat left -70px bottom;padding: 60px 60px 0 0;overflow: hidden}
.formHome .right {width: 50%;float: right;box-sizing: border-box;padding-left: 100px;background: url(images/ht_r.png) no-repeat center;background-size: cover;padding: 60px 0 50px 60px}
.formHome .spTitle {font: 26px 'GB';margin-bottom: 20px}
.formHome .spDesc {line-height: 24px;margin-bottom: 20px}
.support {width: 500px;float: right}

.list_ht {overflow: hidden;padding-bottom: 20px}
.list_ht .item {overflow: hidden;margin-bottom: 20px;box-sizing: border-box;padding: 15px 20px;border-radius: 10px;border: 1px solid #eee;background-color: white}
.list_ht .item:last-child {margin-bottom: 0}
.list_ht .info {width: calc(100% - 110px);float: left}
.list_ht .imgc {float: right;width: 100px;height: 100px;border-radius: 10px;overflow: hidden}
.list_ht .title {font: 18px 'GB';margin-bottom: 10px;display: block;text-decoration: none;color: #333}
.list_ht .desc {margin-bottom: 5px}
.list_ht .hotro {overflow: hidden}
.list_ht .hotro span {line-height: 26px;float: left;margin-right: 5px}
.list_ht .hotro a {float: left;text-decoration: none;width: 26px;height: 26px;margin: 0 3px;background: url(images/ht1.png) no-repeat center}
.list_ht .hotro a.messenger {background-image: url(images/ht2.png)}
.list_ht .hotro a.zalo {background-image: url(images/ht3.png)}

.ycTuvan {width: 500px;float: left}
.formYC .item {overflow: hidden;padding-left: 40px;position: relative;margin-bottom: 10px}
.formYC .item:before {content: "";display: block;width: 40px;height: 100%;position: absolute;top: 0;left: 0;background-color: #dfdfdf}
.formYC .item > i {position: absolute;top: 0;left: 0;width: 40px;height: 100%;line-height: 40px;text-align: center;border-radius: 3px 0 0 3px;color: var(--other-color)}
.formYC input {width: 100%;height: 40px;box-sizing: border-box;display: block;padding: 0 15px;color: #333;border: none;outline: none;font: 16px 'GR';background-color: rgba(255,255,255,0.8);border-radius: 0 3px 3px 0}
.formYC textarea {display: block;width: 100%;height: 130px;box-sizing: border-box;margin: 0;border: none;outline: none;resize: none;padding: 10px 15px;font: 16px 'GR';color: #333;background-color: rgba(255,255,255,0.8)}
.formYC .btn_form {text-align: center}
.formYC .btn_form a {display: inline-block;text-decoration: none;color: #333;background-color: #cecece;padding: 1px;font: 16px 'GB';line-height: 40px;clip-path: polygon(10px 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 12px 100%, 0 50%)}
.formYC .btn_form a span {display: block;clip-path: polygon(10px 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 12px 100%, 0 50%);background-color: white;padding: 0 40px}
.formYC .btn_form a:first-child {color: white;background-color: var(--main-color);text-transform: uppercase}
.formYC .btn_form a:first-child span {background: none}
.formYC .btn_form a:hover {color: white}
.formYC .btn_form a:hover span {background: none}
.formYC .btn_form a:first-child:hover {background-color: var(--other-color)}
.formYC .captcha input {width: 180px}

@media(min-width: 1200px){
    #menu {padding: 0;margin: 16px 0 0 0;float: left;width: 100%;text-align: center;padding-bottom: 10px}
    #menu > li {display: inline-block;margin: 0 -4px;position: relative}

    #menu > li > a {display: block;color: #333;text-decoration: none;font: 16px 'GB';line-height: 30px;position: relative;margin-right: 4px;z-index: 2;clip-path: polygon(10px 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 12px 100%, 0 50%);background-color: var(--main-color);padding: 1px}
    #menu > li > a > span {position: relative;z-index: 3;display: block;clip-path: polygon(10px 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 12px 100%, 0 50%);background-color: white;padding: 0 20px}
    #menu > li:nth-child(5) {margin-right: 350px}
    #menu > li:last-child {margin-right: 60px}
    #menu > li:hover > a > span, #menu > li.active > a > span {background: none;color: white}

    #menu ul {position: absolute;top: 100%;left: calc(50% - 130px);border-radius: 5px;z-index: 3;width: 260px;padding: 13px 0 0 0;margin: 0;text-align: left;display: none}
    #menu ul:before {content: "";display: block;position: absolute;top: 8px;left: calc(50% - 5px);border-bottom: 5px solid white;border-left: 7px solid transparent;border-right: 7px solid transparent}
    #menu li:hover > ul {display: block}
    #menu ul li {list-style: none;display: block;background-color: white;position: relative}
    #menu ul li a {display: block;text-decoration: none;color: #333;padding: 8px 15px}
    #menu ul li a:hover {color: var(--main-color)}
    #menu ul li:first-child {border-radius: 5px 5px 0 0}
    #menu ul li:last-child {border-radius: 0 0 5px 5px}
    #menu ul ul {top: 0;left: 100%;padding-top: 0;box-shadow: 0 0 5px rgba(0,0,0,0.2)}
    #menu ul ul:before {display: none}

    @media(max-width: 1366px){
        #menu > li {margin: 0 1px}
        #menu > li:nth-child(4) {margin-right: 250px}
        #menu > li:last-child {margin-right: 30px}
        .container {width: calc(100% - 60px)}
    }
}

#slide_home .imgMB, .banner .imgMB {display: none}
.banner .imgc:before {padding-bottom: 27.368421052%}
#slide_home .imgc:before {padding-bottom: 37.894736842%}
#slide_home .slick-prev {left: 10px}
#slide_home .slick-next {right: 10px}

#slide_home .slick-dots {position: absolute;left: 50%;bottom: 20px;transform: translateX(-50%);-webkit-transform: translateX(-50%);-moz-transform: translateX(-50%);padding: 0;margin: 0}
#slide_home .slick-dots li {float: left;margin: 0 4px;list-style: none}
#slide_home .slick-dots button {width: 10px;height: 10px;border-radius: 11px;border: 1px solid white;background: none;font-size: 0;padding: 0;margin: 0}
#slide_home .slick-dots .slick-active button {width: 30px;background-color: var(--main-color);border: none;border-radius: 0}
#slide_home .info {position: absolute;z-index: 2;left: 70px;top: 50%;transform: translateY(-50%);-webkit-transform: translateY(-50%);-moz-transform: translateY(-50%);background-color: rgba(255,255,255,0.9);padding: 50px 60px;max-width: 460px;box-shadow: 0 0 10px rgba(0,0,0,0.2);text-decoration: none;color: #333;clip-path: polygon(0 0, calc(100% - 60px) 0, 100% 60px, 100% 100%, 60px 100%, 0 calc(100% - 60px))}
#slide_home .title {display: block;color: #333;font: 24px 'GB';text-transform: uppercase;margin-bottom: 10px}
#slide_home .title:hover {color: var(--main-color)}
#slide_home .desc {line-height: 24px;max-height: 120px;overflow: hidden;display: block;margin-bottom: 15px}

.btn {display: inline-block;text-decoration: none;color: white;position: relative;line-height: 40px;clip-path: polygon(12px 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 12px 100%, 0 50%);background-color: var(--main-color);padding: 0 30px}
.btn:hover {background-color: var(--other-color)}

.qcHome {overflow: hidden;padding: 20px 20px 0 20px}
.qcHome .slick-list {width: calc(100% + 20px)}
.qcHome .imgc {margin: 0 20px 20px 0}
.qcHome .imgc span {position: absolute;z-index: 2;left: 0;bottom: 0;color: white;text-align: center;width: 100%;padding: 15px;font: 16px 'HZ';text-transform: uppercase;background: linear-gradient(to top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.4) 50%, rgba(0,0,0,0.1) 90%, transparent 100%);box-sizing: border-box}
.qcHome .imgc:hover span {background: var(--main-color)}

.qcProduct {margin: 0 20px 50px 20px;background-color: #f8f8f8}
.qcProduct .item {margin: 0 20px 20px 20px}
.qcProduct .imgc0:before {padding-bottom: 100%}
.qcProduct .title {text-align: center;color: #333;text-decoration: none;display: block;font-family: 'GB'}
.qcProduct .title:hover {color: var(--main-color)}

.gt_home {padding-bottom: 60px;background-color: #f6fbff}
.gt_home .left {width: calc(50% - 30px);float: left}
.gt_home .left:before {padding-bottom: 80%}
.gt_home .right {width: calc(50% - 10px);float: right;box-sizing: border-box;padding: 50px 60px 0 0}
.gt_home .right > .title {font: 30px 'HZ';color: var(--main-color);text-transform: uppercase;margin: 10px 0;color: var(--other-color)}
.gt_home .content {line-height: 24px;text-align: justify;max-height: 268px;overflow: hidden;margin-bottom: 30px}
.gt_home .btn a {text-decoration: none;color: #333;padding: 0 20px;position: relative;border-top: 1px solid var(--main-color);border-bottom: 1px solid var(--main-color);line-height: 40px;display: inline-block;margin: 0 9px;z-index: 2}
.list_gtHome {overflow: hidden}
.list_gtHome .item {width: calc((100% - 60px)/3);float: left;margin: 0 30px 30px 0}
.list_gtHome .item:nth-child(3n) {margin-right: 0}
.list_gtHome .imgc0 {width: 70px;height: 70px}
.list_gtHome .imgc0 img {z-index: 3}
.list_gtHome .title {display: block;color: var(--other-color);margin: 20px 0 10px 0;font: 18px 'GB'}
.list_gtHome .desc {line-height: 24px;max-height: 72px;overflow: hidden;display: block}

.bao_tt {text-align: center;margin-bottom: 25px;position: relative}
.bao_tt .line {width: 100%;height: 1px;background-color: var(--main-color);position: absolute;top: 22px;left: 0}
.bao_tt .line:before, .bao_tt .line:after {content: "";display: block;width: 7px;height: 7px;background-color: var(--main-color);position: absolute;top: -3px;left: 0;transform: rotate(45deg);-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg)}
.bao_tt .line:after {left: auto;right: 0}
.bao_tt .btn {font: 20px 'HZ';line-height: 44px;text-transform: uppercase;background-color: var(--other-color);padding: 0 6px}
.bao_tt .btn:after {content: "";display: block;width: calc(100% - 6px);height: 100%;background-color: white;position: absolute;top: 0;left: 3px;clip-path: polygon(12px 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 12px 100%, 0 50%)}
.bao_tt .btn span {display: block;clip-path: polygon(12px 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 12px 100%, 0 50%);background-color: var(--main-color);position: relative;z-index: 2;padding: 0 40px}
.bao_tt .btn:hover span {background-color: var(--other-color)}

.bao_tt .titleCT {display: inline-block;color: #333;text-transform: none;font: 30px 'GB';position: relative;z-index: 2;color: #333}
.bao_nd .bao_tt {margin-bottom: 10px}
.bao_Album.bao_tt .titleCT {color: white;background: url(images/bg.jpg)}

.bao_tt .titleCate {display: inline-block;text-decoration: none;color: var(--other-color);text-transform: uppercase;font: 40px 'HZ';margin-bottom: 0}
.bao_tt .titleCate:hover {color: var(--main-color)}

.bao_tt .desc {padding-top: 5px;margin-top: 15px}
.bao_UD {position: relative}

.list_sp .item {margin: 0 20px 20px 0;box-sizing: border-box;box-shadow: 0 0 10px rgba(0,0,0,0.1);background-color: white;overflow: hidden}
.list_sp .item:hover {box-shadow: 0 0 10px var(--main-color)}

.list_sp:not(.slick-slider) .item {width: calc((100% - 80px)/5);float: left}
.list_sp:not(.slick-slider) .item:nth-child(5n) {margin-right: 0}
.slide4 .slick-list {width: calc(100% + 20px);margin-left: -10px}
.slide4.slick-slider {margin-bottom: 10px}
.slide4.slick-slider .item {margin: 10px}

.list_sp .imgc0:before {padding-bottom: 100%}
.list_sp .linkCate {margin: 10px 15px;display: block;color: #666;text-transform: uppercase;font-size: 12px;line-height: 22px;height: 22px;overflow: hidden;text-decoration: none}
.list_sp .title {margin: 0 15px;display: block;text-decoration: none;color: #333;font: 16px 'GB';line-height: 22px;height: 44px;overflow: hidden}
.list_sp .item:hover .title {color: var(--main-color)}

.list_spCate {margin-bottom: 30px}
.list_spCate .item {width: calc(50% - 10px);box-sizing: border-box;padding: 15px 20px;box-shadow: 0 0 10px rgba(0,0,0,0.1);overflow: hidden;float: left;margin: 0 20px 20px 0}
.list_spCate .item:nth-child(2n) {margin-right: 0}
.list_spCate .imgc {width: 220px;float: left}
.list_spCate .imgc:before {padding-bottom: 100%}
.list_spCate .info {width: calc(100% - 240px);float: right}
.list_spCate .title {display: block;text-decoration: none;color: #333;text-transform: uppercase;font-family: 'GB';margin-bottom: 10px}
.list_spCate .desc {line-height: 24px;max-height: 48px;overflow: hidden;margin-bottom: 10px}
.list_spCate .cateChild {border-top: 1px solid #ececec}
.list_spCate .cateChild a {display: block;text-decoration: none;color: #333;font-family: 'GB';padding: 7px 0 7px 20px;border-bottom: 1px solid #ececec;position: relative}
.list_spCate .cateChild a:before {content: "+";display: block;position: absolute;left: 0;top: 3px;color: var(--main-color);font-size: 24px;line-height: 24px;height: 24px}
.list_spCate .cateChild a:hover {color: var(--main-color)}
.list_spCate .btn_sp {overflow: hidden}
.list_spCate .btn_sp a {float: left;color: #333;text-decoration: none;clip-path: polygon(10px 0, calc(100% - 10px) 0, 100% 50%, calc(100% - 10px) 100%, 10px 100%, 0 50%);background-color: var(--main-color);line-height: 34px;padding: 1px;margin-top: 15px}
.list_spCate .btn_sp a span {display: block;clip-path: polygon(10px 0, calc(100% - 10px) 0, 100% 50%, calc(100% - 10px) 100%, 10px 100%, 0 50%);background-color: white;padding: 0 15px}
.list_spCate .btn_sp a:hover span {background: none;color: white}

.spHome {padding: 60px 0}
.btn_more {text-align: center}
.btn_more .btn {color: #333;padding: 1px}
.btn_more .btn span {display: block;background-color: white;clip-path: polygon(12px 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 12px 100%, 0 50%);padding: 0 30px}
.btn_more .btn:hover {background-color: var(--main-color)}
.btn_more .btn:hover span {background: none;color: white}

.road {margin-bottom: 40px;padding: 10px 0}
.road a {display: inline-block;margin-left: 10px;text-decoration: none;color: #333;position: relative}
.road a:before {content: "\f105";font: 16px FontAwesome;margin-right: 10px}
.road .container a:first-child {margin-left: 0}
.road .container a:first-child:before {content: "\f015"}
.road a:hover {color: var(--other-color)}

.titleCate {margin-bottom: 30px}
.titleCate .title {display: inline-block;padding-right: 100px;background: url(images/ttr.png) no-repeat right center;font: 40px 'HZ';color: var(--main-color);margin-bottom: 10px}
.titleCate .desc {line-height: 22px}

.list_gt {margin-bottom: 50px}
.list_gt .item {width: calc((100% - 60px)/4);float: left;margin: 0 0 20px 20px;background-color: white;border-radius: 5px;padding: 0 20px 20px 20px;box-sizing: border-box;box-shadow: 0 0 10px rgba(0,0,0,0.1)}
.list_gt .item:nth-child(4n+1) {margin-left: 0;clear: both}
.list_gt .desc {line-height: 22px;max-height: 66px;overflow: hidden;margin-bottom: 15px}
.list_gt .xemct {margin-bottom: 15px}
.list_gt .xemct a {color: #333;text-decoration: none;display: inline-block;border-bottom: 1px solid #333}
.list_gt .title {margin: 15px 0}
.list_gt .title a {display: inline-block;position: relative;text-decoration: none;color: white;font: 16px 'GB';line-height: 24px;padding: 8px 20px;background: linear-gradient(to right, var(--main-color), var(--other-color));border-radius: 0 20px 20px 0;margin-left: -20px}
.list_gt .imgc {border-radius: 5px;overflow: hidden}
.list_gt .item:hover .title a {background: linear-gradient(to right, var(--other-color), white);color: var(--main-color);box-shadow: 2px 0 5px rgba(0,0,0,0.2)}
.list_gt .item:hover {border-color: var(--main-color)}
.list_gt .item:hover .xemct a {color: var(--main-color);border-color: var(--main-color)}

.bao_nd {padding: 30px 70px;background-color: white;border: 2px solid #ececec;border-radius: 20px;box-shadow: 0 5px 10px rgba(0,0,0,0.05);margin-bottom: 50px}

.other {margin-bottom: 60px}
.tt_other {margin-bottom: 15px}
.tt_other .title {color: #333;text-decoration: none;font: 30px 'GB'}
.tt_other a.title:hover {color: var(--other-color)}
.tt_other .more {float: right;color: #333;text-decoration: none;border-bottom: 1px solid #333;margin-top: 5px}
.tt_other .more:hover {color: var(--other-color);border-color: var(--other-color)}

.nameCty {text-align: center;color: var(--other-color);font: 40px 'HZ';margin: 50px 0 20px 0}
.infoCty {margin-bottom: 40px;display: flex}
.infoCty .item {width: calc((100% - 60px)/4);float: left;margin: 0 0 20px 20px;box-shadow: 0 0 10px rgba(0,0,0,0.1);box-sizing: border-box;padding: 10px 20px 10px 20px;text-align: center;border-radius: 5px;background-color: white}
.infoCty .item i {font-size: 24px;width: 40px;height: 40px;text-align: center;margin: auto;line-height: 40px;color: var(--main-color)}
.infoCty .thuoctinh {text-transform: uppercase;margin-bottom: 5px;font-family: 'GB'}
.infoCty .item:first-child {margin-left: 0}

.titleLH {text-align: center;margin-bottom: 20px;font: 30px 'HZ';text-transform: uppercase;color: var(--main-color)}
.form_lh {width: calc(50% - 10px);float: left;margin-bottom: 70px}
.map_lh {width: calc(50% - 10px);float: right;margin-bottom: 70px}
.map_lh .iframeMap {height: 343px}
.map_lh iframe {width: 100%;height: 100%}
.title_lh {font: 26px 'GB';margin-bottom: 10px}
.form_lh .item {border: 1px solid #eee;margin-bottom: 10px;background: #f5f6f8 url(images/ct5.png) no-repeat left 10px top 10px;padding-left: 40px;box-sizing: border-box;border-radius: 3px;overflow: hidden;position: relative}
.form_lh .item i {font-size: 20px;position: absolute;top: 0;left: 0;width: 40px;height: 40px;text-align: center;line-height: 40px;color: var(--main-color)}
.form_lh input, .form_lh textarea {display: block;width: 100%;box-sizing: border-box;padding: 0 10px;background-color: white;margin: 0;border: none;outline: none;height: 40px;font: 15px 'GR';color: #333;resize: none}
.form_lh .item:nth-child(2) {width: calc(50% - 5px);float: left}
.form_lh .item:nth-child(3) {width: calc(50% - 5px);float: right}
.form_lh .item:nth-child(4) {clear: both}
.form_lh textarea {padding: 10px;height: 150px}
.form_lh .name, .form_lh .phone {width: calc(50% - 5px);float: left}
.form_lh .phone {float: right;background-image: url(images/ct6.png)}
.form_lh .email {clear: both;background-image: url(images/ct7.png);background-position: left 10px top 13px}
.form_lh .content {background-image: url(images/ct8.png)}
.form_lh .btn_lh {margin-bottom: 15px}
.form_lh .btn_lh a {display: inline-block;text-decoration: none;color: #333;padding: 0 35px;clip-path: polygon(10px 0, calc(100% - 10px) 0, 100% 50%, calc(100% - 10px) 100%, 10px 100%, 0 50%);font-family: 'GB';line-height: 40px;border-radius: 5px;background-color: #dedede}
.form_lh .btn_lh a:first-child {color: white;background-color: var(--main-color);text-transform: uppercase}
.form_lh .btn_lh a:hover {color: white;background-color: #999}
.form_lh .btn_lh a:first-child:hover {background-color: var(--other-color)}

.alert {text-align: center}
.nd_alert {max-width: 750px;margin: 70px auto}
.nd_alert .fa-check {display: inline-block;background-color: var(--main-color);color: white;border-radius: 50%;width: 100px;height: 100px;font-size: 60px;line-height: 100px}
.nd_alert .title {margin: 30px 0 10px 0;font-size: 36px;font-weight: 600}
.nd_alert .desc {margin-bottom: 20px}
.nd_alert .content {margin-bottom: 20px;line-height: 22px}
.nd_alert .content a {text-decoration: none;font-family: 'GB';color: red}
.nd_alert .ok i {display: inline-block;width: 80px;height: 80px;font-size: 40px;background-color: var(--main-color);border-radius: 50%;line-height: 80px;color: white}

.col_left {width: calc((100% - 80px)/5);float: left;margin-bottom: 30px;border-radius: 8px}
.col_right {width: calc((100% - 80px)/5*4 + 60px);float: right;margin-bottom: 30px}
.block_left {padding: 20px 20px 0 20px;margin-bottom: 20px;background-color: white;overflow: hidden;box-shadow: 0 0 10px rgba(0,0,0,0.1)}
.titleLeft {font: 20px 'GB';margin-bottom: 20px;text-transform: uppercase}
.titleLeft a {text-decoration: none;color: #333}
.col_left .block_left:last-child {margin-bottom: 0;border-bottom: none}

.col_right .list_sp .item {width: calc((100% - 60px)/4)}
.col_right .list_sp .item:nth-child(5n) {margin-right: 20px}
.col_right .list_sp .item:nth-child(4n) {margin-right: 0}

.blockCate {background-color: var(--main-color);color: white;border-radius: 10px}
.cateLeft a {display: block;margin-bottom: 15px;overflow: hidden;text-decoration: none;color: white;position: relative;line-height: 20px;padding-left: 30px}
.cateLeft .imgc0 {width: 20px;height: 20px;position: absolute;left: 0;top: 0}
.cateLeft img {filter: brightness(0) invert(1);-webkit-filter: brightness(0) invert(1);-moz-filter: brightness(0) invert(1)}

.listOrder a {display: block;text-decoration: none;color: #333;padding-left: 30px;position: relative;margin-bottom: 15px;line-height: 20px}
.listOrder a:before {content: "";display: block;width: 20px;height: 20px;box-sizing: border-box;border-radius: 50%;border: 1px solid #cecece;position: absolute;top: 0;left: 0}
.listOrder a.active:before, .listOrder a:hover:before {border: 5px solid var(--main-color)}

.cateProduct.bao_tt {text-align: left}

.imgProduct {width: calc((100% - 40px)/3 * 2 + 20px);float: left;overflow: hidden;position: relative;margin-bottom: 30px}
.imgProduct.show .imgc:nth-child(n+7) {display: block}
.imgProduct.show .openAlbum {display: none}
.imgProduct .imgc {width: calc((100% - 60px)/4);float: left;margin: 0 20px 20px 0;box-shadow: 0 0 10px rgba(0,0,0,0.1);background-color: white}
.imgProduct .imgc:first-child, .imgProduct .imgc:nth-child(2) {width: calc(50% - 10px)}
.imgProduct .imgc:nth-child(4n+2) {margin-right: 0}
.imgProduct .imgc:before {padding-bottom: 100%}
.imgProduct .imgc:nth-child(n+7) {display: none}
.imgProduct .openAlbum {position: absolute;right: 0;bottom: 20px;width: calc((100% - 60px)/4);background-color: rgba(0,0,0,0.5);z-index: 3;cursor: pointer}
.imgProduct .openAlbum:before {content: "";display: block;width: 100%;padding-bottom: 100%}
.imgProduct .openAlbum span {position: absolute;top: 50%;left: 50%;z-index: 3;color: white;transform: translate(-50%, -50%);-webkit-transform: translate(-50%, -50%);-moz-transform: translate(-50%, -50%);font-size: 16px;padding-top: 20px}
.imgProduct .openAlbum span:before {content: "";display: block;width: 1px;height: 15px;background-color: white;position: absolute;top: 0;left: 50%;z-index: 3}
.imgProduct .openAlbum span:after {content: "";display: block;width: 15px;height: 1px;background-color: white;position: absolute;top: 7px;left: calc(50% - 7px);z-index: 3}

.infoProduct {width: calc((100% - 40px)/3);float: right;margin-bottom: 30px;box-sizing: border-box;padding: 10px 20px;background-color: white;box-shadow: 0 0 10px rgba(0,0,0,0.1)}
.infoProduct .title {font: 30px 'GB';margin-bottom: 10px;color: #333}
.infoProduct .key {margin-bottom: 15px}
.infoProduct .cm_topSP {display: inline-block;margin-left: 20px}
.infoProduct .cm_topSP .tbc {display: none}
.infoProduct .cm_topSP .tbcSao {display: inline-block;margin-right: 5px}
.infoProduct .cm_topSP .tbcSao span:before {content: "\f006";font: 14px FontAwesome;color: #fbcc04}
.infoProduct .cm_topSP .tbcSao span.sao1:before {content: "\f005"}
.infoProduct .cm_topSP .note {float: right}
.infoProduct .info {padding: 10px 15px 5px 15px;border-radius: 5px;position: relative;margin-bottom: 20px;border: 1px solid #b2dfff;background-color: #e3f4fe}
.infoProduct .info ul {margin: 0;padding-left: 0}
.infoProduct .info li {list-style: none;margin: 8px 0;padding-left: 15px;position: relative}
.infoProduct .info li:before {content: "";display: block;width: 7px;height: 7px;background-color: var(--other-color);border-radius: 50%;position: absolute;left: 0;top: 6px}
.infoProduct .desc {line-height: 22px;max-height: 110px;overflow: hidden;margin-bottom: 20px}
.infoProduct .khuyenMai {padding-top: 15px;border-top: 1px solid #ddd;margin-bottom: 20px}
.infoProduct .khuyenMai ul {margin: 0;padding-left: 22px}
.infoProduct .khuyenMai li {list-style-image: url(images/sao.png);margin-bottom: 5px}
.infoProduct .khuyenMai b, .infoProduct .khuyenMai strong {font-weight: normal;font-family: 'GB'}

.infoProduct .muaNgay {display: block;text-decoration: none;color: #333;text-align: center;padding: 10px 0;margin-bottom: 10px;font-size: 13px;background-color: var(--main-color);color: white}
.infoProduct .muaNgay span {display: block;font: 17px 'GB';text-transform: uppercase;margin-bottom: 2px}
.infoProduct .muaNgay:hover {background-color: var(--other-color)}

.infoProduct .hotlinesp {margin-bottom: 30px;text-align: center;margin-left: 15px}
.infoProduct .hotlinesp span {display: inline-block;color: white;background-color: var(--other-color);padding: 15px 20px 15px 30px;position: relative;font: 16px 'GB';line-height: 22px;border-radius: 25px}
.infoProduct .hotlinesp span i {position: absolute;width: 30px;height: 30px;text-align: center;color: white;background-color: var(--other-color);border: 1px solid white;border-radius: 50%;line-height: 30px;left: -15px;top: calc(50% - 16px)}
.infoProduct .hotlinesp a {color: white;text-decoration: none}

.infoProduct .mxhProduct {text-align: center;padding: 15px 0 20px 0}
.infoProduct .mxhProduct .imgc0 {width: 24px;height: 24px;display: inline-block;margin: 0 10px}
.infoProduct .uuDai_SP {overflow: hidden;padding: 15px 0;border-top: 1px solid #ddd}
.infoProduct .uuDai_SP .item {width: calc(50% - 10px);float: left;margin-bottom: 10px}
.infoProduct .uuDai_SP .item:nth-child(2n) {float: right}
.infoProduct .uuDai_SP .item .imgc0 {width: 35px;height: 35px;float: left}
.infoProduct .uuDai_SP .item .benifit {width: calc(100% - 40px);float: right;padding-top: 5px}

.titleTab {border-top: 3px solid var(--main-color);border-bottom: 1px solid var(--other-color);padding: 20px 0}
.titleTab a {display: inline-block;margin-right: 50px;text-decoration: none;color: #333;font: 18px 'GB'}
.titleTab a.active, .titleTab a:hover {color: var(--main-color)}

.ndTab .TextSize {display: none}
.ndTab .TextSize.active {display: block}
.ndSanPham {padding: 20px;background-color: white;margin-bottom: 50px}


.infoCM {padding: 20px 0}
.infoCM .col_1 {width: 200px;float: left;text-align: center;padding-top: 30px}
.infoCM .col_2 {width: 350px;float: left;margin: 0 20px;padding-top: 25px}
.infoCM .col_3 {width: calc(100% - 600px);float: right;position: relative}
.infoCM .col_1 b {font-family: 'MB';display: block;margin-bottom: 15px}
.infoCM .col_1 .tbc {font: 50px 'GB';color: #333;margin-bottom: 10px}
.infoCM .col_1 .tbcSao {margin-bottom: 10px}
.infoCM .col_1 .tbcSao span {display: inline-block;width: 20px;height: 20px}
.infoCM .col_1 .tbcSao span:before {content: "\f005";font: 18px FontAwesome;color: #feca04}
.infoCM .col_1 .tbcSao .sao0:before {content: "\f006"}
.infoCM .col_1 .note {font-size: 13px;color: #888}
.infoCM .col_2 .itemPT {overflow: hidden;margin-bottom: 5px}
.infoCM .col_2 .soSao {color: #333;line-height: 24px;float: left;width: 30px;text-align: right}
.infoCM .col_2 .soSao:after {content: "\f005";font: 16px FontAwesome;margin-left: 5px}
.infoCM .col_2 .luocDo {width: calc(100% - 90px);float: left;background-color: #e1e1e1;height: 8px;border-radius: 4px;margin: 8px 0 0 10px}
.infoCM .col_2 .luocDo span {display: block;background-color: var(--other-color);height: 8px;border-radius: 4px}
.infoCM .col_2 .soPT {width: 35px;float: right;line-height: 24px}

#popupCM .saoBL {margin-bottom: 10px}
#popupCM .saoBL b {font-family: 'GB';margin-right: 10px}
#popupCM .chonSao {display: inline-block}
#popupCM .chonSao span {display: inline-block;width: 16px;height: 16px;cursor: pointer}
#popupCM .chonSao span:before {content: "\f006";font: 18px FontAwesome;color: #999}
#popupCM .chonSao span.active:before {content: "\f005";color: #feca04}
#popupCM input[type=text] {display: block;width: 100%;height: 40px;box-sizing: border-box;padding: 0 10px;font: 15px 'GR';color: #333;outline: none;margin-bottom: 10px;border: 1px solid #cecece;border-radius: 3px}
#popupCM textarea {display: block;margin: 0;border: 1px solid #cecece;outline: none;resize: none;padding: 10px;box-sizing: border-box;margin-bottom: 10px;font: 15px 'GR';color: #333;width: 100%;height: 100px;border-radius: 3px}
#popupCM a {display: inline-block;text-decoration: none;color: white;clip-path: polygon(12px 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 12px 100%, 0 50%);font: 16px 'GB';text-transform: uppercase;line-height: 40px;padding: 0 25px;background-color: var(--main-color)}
#popupCM a:hover {background-color: var(--other-color)}

.titleCM {text-transform: uppercase;font-family: 'GB';padding-bottom: 10px;border-bottom: 1px solid #eee}
.cmList {margin-bottom: 30px}
.itemCM {overflow: hidden;padding: 15px 0;border-bottom: 1px solid #eee}
.itemCM .infoKH {width: 300px;float: left}
.itemCM .infoKH .nameCM {font-family: 'GB';float: left;margin-right: 10px;line-height: 22px}
.itemCM .infoKH .timeCM {clear: both;padding-top: 10px;color: #999}
.itemCM .infoKH .saoCM {float: left}
.itemCM .infoKH .saoCM span {display: inline-block}
.itemCM .infoKH .saoCM span:before {content: "\f006";font: 17px FontAwesome;color: #ececec}
.itemCM .infoKH .saoCM span.sao1:before {content: "\f005";color: #feca04}
.itemCM .contentCM {width: calc(100% - 320px);float: right}

.titleTK {text-align: center;font: 24px 'GB';margin-bottom: 10px}
.descTK {text-align: center;margin-bottom: 40px}
.itemTK {margin-bottom: 30px}
.itemTK b {font-weight: normal;font-family: 'GB';margin-bottom: 5px;display: block}
.itemTK input {display: block;width: 100%;height: 40px;box-sizing: border-box;padding: 0 12px;outline: none;border: 1px solid #ddd;font: 15px 'GR';color: #333}
.btnTK {text-align: center}
.btnTK a, .btnSave {display: inline-block;text-decoration: none;color: white;text-transform: uppercase;padding: 0 60px;font-family: 'GB';line-height: 40px;border-radius: 21px;border: 1px solid var(--main-color);background-color: var(--main-color)}
.btnTK a:hover, .btnSave:hover {color: var(--main-color);background-color: white}
.quenMK {text-align: center;margin-top: 10px}
.quenMK a {text-decoration: none;color: #333;line-height: 22px}
.dangKy .itemTK:nth-child(3), .dangKy .itemTK:nth-child(4), .dangKy .itemTK:nth-child(5) {width: calc((100% - 40px)/3);float: left;margin-right: 20px}
.dangKy .itemTK:nth-child(5) {margin-right: 0}
.dangKy .itemTK:nth-child(6), .dangKy .itemTK:nth-child(7) {width: calc(50% - 10px);float: left}
.dangKy .itemTK:nth-child(7) {float: right}

#formAccount {overflow: hidden}
#formAccount .accIMG {width: 172px;float: left;margin: 20px 0 0 50px;text-align: center}
#formAccount .accIMG .imgc {border-radius: 50%;overflow: hidden;margin-bottom: 20px;background: url(images/user.png) no-repeat center;border-radius: 50%;overflow: hidden}
#formAccount .accIMG .imgc:before {padding-bottom: 100%}
#formAccount .accIMG label input {display: none}
#formAccount .accIMG label {padding-left: 20px;background: url(images/edit.png) no-repeat left center;font-size: 15px}
#formAccount .accIMG label:hover {color: var(--main-color);cursor: pointer}
#formAccount .accInfo {width: calc(100% - 300px);float: right;overflow: hidden}
#formAccount .accInfo .item {overflow: hidden;margin-bottom: 5px}
#formAccount .accInfo b {width: 115px;float: left;height: 40px;background-color: #eaeaea;font-weight: normal;font: 15px 'GB';line-height: 40px;padding-left: 15px;box-sizing: border-box}
#formAccount .accInfo .item div {width: calc(100% - 115px);float: right;height: 40px;border: 1px solid #e0e0e0;border-left: none;box-sizing: border-box;position: relative}
#formAccount .accInfo span {display: block;position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: white;padding: 0 20px;font: 15px 'GR';line-height: 38px;box-sizing: border-box}
#formAccount .accInfo input, #formAccount .accInfo select {width: 100%;height: 38px;border: none;outline: none;padding: 0 20px;box-sizing: border-box;display: block;font: 15px 'GR'}
#formAccount .accInfo .btnSave {float: right;margin-top: 20px}

.infoAccount {background-color: white;padding: 30px 40px 50px 40px;border-radius: 8px}
.infoAccount .tt_other .title {font-size: 28px}
.menuAccount.block_left {padding-top: 30px;padding-bottom: 10px}
.menuAccount .titleLeft {text-transform: none;font-size: 28px}
.infoAccount .tt_other {padding-bottom: 10px;border-bottom: 1px solid #eee;margin-bottom: 30px}
.infoAccount .editInfo {float: right;text-decoration: none;color: #333;padding-left: 20px;background: url(images/edit.png) no-repeat left bottom 2px;font-weight: 600;line-height: 22px}
.infoAccount .editInfo:hover {color: var(--main-color)}

#formAccount #ChangePassForm.accInfo b {float: none;background: none;padding: 0;height: auto;line-height: 22px;margin-bottom: 5px;display: block;width: auto}
#formAccount #ChangePassForm.accInfo .item div {float: none;width: auto;border-left: 1px solid #e0e0e0}
#formAccount #ChangePassForm.accInfo .item {margin-bottom: 20px}
#formAccount #ChangePassForm.accInfo .btnSave {float: none;margin-top: 0}
#ChangePassForm.accInfo {max-width: 600px;float: left;margin-left: 70px}

.infoCart {width: calc(100% - 500px);float: left}
.infoCart .bgWhite {background-color: white;padding: 20px;margin-bottom: 20px;box-shadow: 0 0 10px rgba(0,0,0,0.1)}
.infoCart .titleTK {text-align: left;margin-bottom: 20px}
.listCart {width: 480px;float: right;box-shadow: 0 0 10px rgba(0,0,0,0.1)}
.infoCart .bgWhite .itemTK {width: calc((100% - 20px)/3);float: left;margin: 0 10px 20px 0}
.infoCart .bgWhite .itemTK:nth-child(3n+1) {margin-right: 0}
.infoCart .bgWhite .itemTK:nth-child(8), .infoCart .bgWhite .itemTK:nth-child(9) {width: 100%}
.itemTK select {width: calc((100% - 40px)/3);box-sizing: border-box;height: 40px;border: 1px solid #ddd;outline: none;padding: 0 10px;font: 15px 'GR';color: #333;margin-bottom: 10px}
.itemTK textarea {display: block;margin: 0 0 30px 0;padding: 10px 12px;font: 15px 'GR';color: #333;border: 1px solid #ddd;outline: none;resize: none;height: 100px;width: 100%;box-sizing: border-box}

.tabPTTT {overflow: hidden;display: flex}
.tabPTTT .item {width: calc((100% - 40px)/3);float: left;margin: 0 10px 20px 0;box-sizing: border-box;padding: 15px 10px 10px 55px;border: 1px solid #ddd;border-radius: 5px;background: url(images/tt1.png) no-repeat left 10px top 15px;position: relative;cursor: pointer}
.tabPTTT .item:nth-child(3) {background-image: url(images/tt4.png);margin-right: 0}
.tabPTTT .item:nth-child(2) {background: url(images/tt3.png) no-repeat left 10px top 15px, url(images/tt2.png) no-repeat right bottom 15px}
.tabPTTT .item b {font-weight: normal;font-family: 'GB';display: block;margin-bottom: 5px}
.tabPTTT .item.active {border-color: var(--main-color)}
.tabPTTT .item.active:before {content: "";display: block;width: 12px;height: 12px;border-right: 1px solid var(--main-color);border-bottom: 1px solid var(--main-color);position: absolute;left: calc(50% - 5px);bottom: -7px;transform: rotate(45deg);-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);background-color: white}

.ndPTTT .TextSize {display: none}
.ndPTTT .TextSize.active {display: block}

.btnCart {text-align: center;margin-bottom: 70px}
.btnCart a {display: inline-block;text-decoration: none;color: white;font-family: 'GB';text-transform: uppercase;padding: 0 40px;line-height: 50px;background: linear-gradient(to right, var(--main-color), var(--other-color));margin: 0 8px;box-sizing: border-box;border-radius: 5px}
.btnCart a:first-child {color: #333;background: #eaeaea}
.btnCart a:first-child:before {content: "\f177";font: 16px FontAwesome;margin-right: 10px}
.btnCart a:first-child:hover {color: white;background-color: #999}
.btnCart a:last-child:hover {background: linear-gradient(to right, var(--main-color), var(--other-color), var(--main-color))}


#tbNote {display: none}
.titleDH {font: 20px 'GB';padding: 12px 20px 10px 20px;background-color: #eaeaea;line-height: 22px}
.totalDH {padding: 10px 20px;text-transform: uppercase;font-weight: 600;background-color: #eaeaea;font-size: 18px;overflow: hidden}
.totalDH span {float: right;text-transform: none;color: red;font: 24px 'GB';letter-spacing: -0.5px}

.itemCart {padding: 20px;overflow: hidden;border-bottom: 1px solid #cecece;background-color: white}
.itemCart .imgc0 {width: 100px;height: 100px;float: left;background-color: #f6f6f6}
.itemCart .info {width: calc(100% - 115px);float: right}
.itemCart .title {font: 16px 'GB';margin-bottom: 10px}
.itemCart .price {overflow: hidden;margin-bottom: 15px}
.itemCart .price .dongia {font: 16px 'GB';margin-right: 10px;color: red}
.itemCart .price input {width: 34px;height: 34px;text-align: center;outline: none;margin-left: 10px;font: 16px 'GB'}
.itemCart .price .thanhtien {float: right;font: 16px 'GB';line-height: 36px;color: red}
.itemCart .delete {float: right;color: #999;text-decoration: none}
.itemCart .delete:after {content: "\f1f8";font: 14px FontAwesome;margin-left: 5px}
.itemCart .delete:hover {color: var(--main-color)}

.xuatHD {margin-bottom: 15px}
.xuatHD input[type=checkbox] {width: 20px;height: 20px;display: inline-block;margin-right: 5px}
.xuatHD b {line-height: 20px;display: inline-block;transform: translateY(-3px);-webkit-transform: translateY(-3px);-moz-transform: translateY(-3px)}
.tbCty {margin-bottom: 40px;clear: both;display: none}
.infoCart .bgWhite .tbCty .itemTK, .infoCart .bgWhite .captcha .itemTK {width: 100%;float: none}
.captcha {margin-bottom: 20px;overflow: hidden;clear: both}
.captcha input {width: 150px;float: left}
.captcha img {height: 40px;float: left;margin: 0 10px}
.captcha a {float: left;width: 30px;height: 40px;text-align: center;line-height: 40px;color: #333;font-size: 20px}

.col_dh {background-color: #ededed;overflow: hidden;padding: 10px 0;font: 16px 'GB';line-height: 22px}
.list_dh .item {overflow: hidden;padding: 10px 0;border-bottom: 1px solid #eee;display: block;text-decoration: none;color: #333}
.col1, .col2, .col3, .col4, .col5 {float: left;margin: 0 15px;line-height: 22px;width: 140px}
.col1 {width: 160px}
.col5 {width: 120px}
.col3 {width: calc(100% - 710px)}
.list_dh .col4 {font-family: 'GB';font-size: 18px}
.list_dh .item:hover {background-color: #ffcccb}
.ngayDH {float: right}
.statusDH {font-weight: bold}

.detailCart {overflow: hidden;margin-bottom: 30px}
.detailCart .item {width: calc(50% - 10px);float: left}
.detailCart .item:nth-child(2n) {float: right}
.detailCart .titleCart {font-weight: bold;font-size: 16px;text-transform: uppercase;padding-bottom: 5px;border-bottom: 1px solid #eee;margin-bottom: 20px}
.detailCart .title {font-weight: bold;margin-bottom: 10px}

.col_ct {overflow: hidden;padding: 7px 0;border-bottom: 1px solid #eee;font-weight: bold;font-size: 16px;text-transform: uppercase}
.colt4, .colt3, .colt2, .colt1  {width: 160px;float: left;margin-left: 20px}
.colt1 {width: calc(100% - 540px);margin-left: 0}
.colt2, .colt3 {text-align: center}
.colt4 {text-align: right}
.list_ct {margin-bottom: 15px}
.list_ct .item {overflow: hidden;padding: 10px 0;border-bottom: 1px solid #eee;font-weight: bold;font-size: 17px;display: flex;align-items: center}
.list_ct .colt1 {overflow: hidden;display: flex;align-items: center}
.list_ct .colt1 .imgc0 {width: 100px;height: 100px;border: 1px solid #eee;float: left;margin-right: 10px}
.list_ct .colt1 .title {width: calc(100% - 110px);font-weight: bold;font-size: 17px;float: right}
.btn_ct {overflow: hidden}
.btn_ct a {display: inline-block;text-decoration: none;color: #333;padding: 0 30px;border: 1px solid var(--main-color);line-height: 44px;border-radius: 23px}
.btn_ct a:before {content: url(images/return1.png);margin-right: 8px}
.btn_ct a:hover {color: white;background-color: var(--main-color)}
.btn_ct a:hover:before {filter: brightness(0) invert(1);-webkit-filter: brightness(0) invert(1);-moz-filter: brightness(0) invert(1)}
.btn_ct span {float: right;font-size: 20px;font-weight: 600;text-transform: uppercase}
.btn_ct span b {margin-left: 10px;color: var(--main-color);font-size: 24px;text-transform: none;font-weight: bold}

.newsHome, .blockNews {margin-bottom: 70px}
.cateNews {text-align: center;margin-bottom: 20px}
.cateNews a {display: inline-block;color: #333;line-height: 38px;text-decoration: none;margin: 0 2px 5px 0;position: relative;clip-path: polygon(12px 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 12px 100%, 0 50%);background-color: #cbcbcb}
.cateNews a span {content: "";display: block;margin: 1px;background-color: white;clip-path: polygon(12px 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 12px 100%, 0 50%);padding: 0 20px}
.cateNews a:hover {background-color: var(--main-color);color: white}
.cateNews a:hover  span {background-color: transparent}
.blockNews .list_news {margin-bottom: 15px}


.list_news .item {box-shadow: 0 0 10px rgba(0,0,0,0.1)}
.list_news:not(.slick-slider) .item {width: calc((100% - 60px)/4);float: left;margin: 0 20px 20px 0}
.list_news:not(.slick-slider) .item:nth-child(4n) {margin-right: 0}
.list_news:not(.slick-slider) .item:nth-child(4n+1) {clear: both}
.list_news .info {padding: 15px}
.list_news .date {margin: 0 0 10px 0;font-size: 14px;color: #999}
.list_news .date i {font-size: 13px;margin-right: 5px}
.list_news .item:hover {box-shadow: 0 0 10px var(--main-color)}
.list_news .item:hover .title {color: var(--main-color)}
.list_news .item:hover .more {color: var(--other-color)}
.list_news .slick-list {width: calc(100% + 20px)}
.list_news .title {font: 16px 'GB';color: #333;text-decoration: none;display: block;margin-bottom: 10px;line-height: 22px;height: 44px;overflow: hidden}
.list_news .desc {line-height: 22px;max-height: 44px;overflow: hidden;color: #333;margin-bottom: 10px}
.list_news .more {display: inline-block;text-decoration: none;color: red}

.slide4 .slick-list, .slide5 .slick-list {width: calc(100% + 20px);margin-left: -10px}
.slide4 .item, .slide5 .item {margin: 10px}
.slide4 .slick-prev, .slide5 .slick-prev {left: 0}
.slide4 .slick-next, .slide5 .slick-next {right: 0}

.newsHome .list_news {margin-bottom: 10px}
.newsHome .list_news .slick-list {margin-left: -10px}
.newsHome .list_news .item {margin: 10px}
.newsHome .list_news .desc {height: 44px}

.paHome {margin-bottom: 70px;padding: 80px 0;background: url(images/bg_da.jpg) no-repeat center;background-size: cover}
.paHome .bao_tt .desc {color: white}
.paHome .btn:before {background-color: #614724}
.list_tinIndex {overflow: hidden}
.newsIndex {margin-bottom: 50px}
.list_tinIndex .imgc {width: calc((100% - 60px)/4);float: left;margin: 0 0 20px 20px}
.list_tinIndex .imgc:first-child {width: calc((100% - 60px)/2 + 20px);margin-left: 0}
.list_tinIndex .imgc:first-child:before {padding-bottom: calc(66.66% + 6.668px)}
.list_tinIndex .info {position: absolute;left: 0;bottom: 0;width: 100%;box-sizing: border-box;padding: 20px 20px 10px 20px;background: linear-gradient(to top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.4) 50%, rgba(0,0,0,0.1) 90%, transparent 100%)}
.list_tinIndex .date {color: white;display: block;margin-bottom: 10px;position: relative;opacity: 0.6}
.list_tinIndex .date i {font-size: 14px;margin-right: 5px}
.list_tinIndex .title {display: block;color: white;font: 16px 'GB';line-height: 22px;max-height: 44px;overflow: hidden;text-decoration: none}
.list_tinIndex .imgc:first-child .title {font-size: 20px;line-height: 28px;max-height: 56px}
.list_tinIndex .imgc:hover .info {background: var(--main-color)}

.newsLeft .item {overflow: hidden;margin: -10px 0 30px 0}
.newsLeft .item:last-child {margin-bottom: 20px}
.newsLeft .imgc {width: 100px;float: left;overflow: hidden;border-radius: 3px}
.newsLeft .title {float: right;width: calc(100% - 110px);text-decoration: none;color: #333;line-height: 22px;max-height: 66px;overflow: hidden}
.newsLeft .title:hover {color: var(--main-color)}

.block_left.tinTrai {margin-top: 20px}
.slide5.list_sp {margin-bottom: 10px}

.slideDA {margin: 6% auto;max-width: 80%}
.slideDA .slick-list {overflow: visible}
.slideDA .imgc {transform: scale(0.8);-webkit-transform: scale(0.8);-moz-transform: scale(0.8);transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s;border-radius: 25px;overflow: hidden}
.slideDA .imgc:before {padding-bottom: 56.25%}
.slideDA .slick-current .imgc {transform:scale(1.15);-webkit-transform: scale(1.15);-moz-transform: scale(1.15);transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s}
.slideDA .slick-arrow:before {filter: brightness(0) invert(1);-webkit-filter: brightness(0) invert(1);-moz-filter: brightness(0) invert(1)}
.slideDA .slick-arrow {box-shadow: 0 0 2px 2px rgba(255,255,255,0.3)}


#popupSP {position: fixed;z-index: 11;top: 0;left: 0;width: 100%;height: 100%;overflow: auto;background-color: rgba(0,0,0,0.5);display: none}
.ndPopup {background-color: white;width: 720px;box-sizing: border-box;padding: 50px;margin: 30px auto;position: relative;overflow: hidden}
#popupSP .closePopup {position: absolute;top: 0;right: 0;width: 40px;height: 40px;border-left: 1px solid #333;border-bottom: 1px solid #333;text-align: center;line-height: 40px}
#popupSP .main_tt {font: 24px 'HZ';text-transform: uppercase;text-align: center;margin-bottom: 10px}
#popupSP .desc {text-align: center}
#popupSP .small_tt {margin: 40px 0 10px 0;font: 20px 'GB'}
#popupSP .formYC input {border: 1px solid #cecece;border-left: none;height: 38px}
#popupSP .formYC textarea {border: 1px solid #cecece;border-left: none}
#popupSP .formYC .item > i {color: var(--other-color)}
#popupSP .captcha img {height: 36px;border: 1px solid #cecece}
#popupSP .captcha a {height: 38px}
#popupSP .formYC .btn_form {text-align: left;padding-top: 10px}

.list_gt0 {padding: 50px 0}

.list_gt1 {display: flex;margin-bottom: 60px}
.list_gt1 .item {width: 50%;position: relative;text-align: center;background-size: cover;background-position: center}
.list_gt1 .item:before {content: "";display: block;padding-bottom: 66.66%}
.list_gt1 .nd_content {position: absolute;top: 50%;left: 0;width: 100%;color: white;padding: 0 70px;box-sizing: border-box;transform: translateY(-50%);-webkit-transform: translateY(-50%);-moz-transform: translateY(-50%)}
.list_gt1 .nd_content .imgc0 {width: 100px;margin: auto}
.list_gt1 .title {font: 30px 'GB';text-transform: uppercase;margin: 30px 0 20px 0}
.list_gt1 .desc {line-height: 24px}

.gt_type3 {padding: 40px 0}
.slide_gt3 .slick-list {width: calc(100% + 20px);margin-left: -10px}
.slide_gt3 .item {box-shadow: 0 0 10px rgba(0,0,0,0.1);margin: 10px;border-radius: 5px}
.slide_gt3 .imgc {width: 250px;float: left}
.slide_gt3 .imgc:before {padding-bottom: 150%}
.slide_gt3 .info {width: calc(100% - 270px);float: right;padding: 15px 15px 0 0;box-sizing: border-box}
.slide_gt3 .title {font: 20px 'GB';margin-bottom: 10px}
.slide_gt3 .desc {line-height: 24px}
.blockGT .slick-dots {margin-bottom: 20px;padding: 0;text-align: center}
.blockGT .slick-dots li {list-style: none;display: inline-block;margin: 0 3px}
.blockGT .slick-dots button {border: 1px solid var(--main-color);border-radius: 0;font-size: 0;background: none;padding: 0;width: 12px;height: 12px;outline: none}
.blockGT .slick-dots .slick-active button {background-color: var(--main-color);width: 30px}

.gt_type4 {padding: 40px 0}
.slide_gt4 {margin-bottom: 30px}
.slide_gt4 .item {margin: 10px}
.slide_gt4 .imgc0 {box-shadow: 0 0 10px rgba(0,0,0,0.1);border-radius: 5px}
.slide_gt4 .imgc0:before {padding-bottom: 55%}
.slide_gt4 .title {text-align: center;font: 16px 'GB';margin-top: 10px}

.list_file {border-top: 1px solid #cecece}
.list_file .item {overflow: hidden;border: 1px solid #cecece;padding: 10px;border-top: none}
.list_file .title {float: left;width: calc(100% - 350px);text-decoration: none;color: #333;font-family: 'GB'}
.list_file .date {width: 120px;float: left;font-size: 14px}
.list_file .view {width: 120px;float: left;font-size: 14px}
.list_file .taive {width: 80px;float: right;font-size: 14px;text-decoration: none;color: #333}
.list_file .item:hover {background-color: var(--other-color);color: white}
.list_file .item:hover .title, .list_file .item:hover .taive {color: white}

.readFile {max-width: 1100px;margin: 0 auto 30px auto}