:root{
    --color_primary: #1C1666;
    --color_secondary: #C4161C;
    --color_green: #9FFF9A;
    --color_darkblue: #0061AF;
    --color_blue: #0082C4;
    --color_blue2: #8CBBFF;
    --color_orange: #F15A22;
    --color_yellow: #FCAF17;
    --color_light: #FFFFFF;
    --color_dark: #000000;
    --color_darkgray: #4D4D4D;
    --color_gray: #D9D9D9;
    --color_lightgray: #f3f3f3;
    --color_orange2: rgba(245, 170, 143, 0.702);
}
* {margin:0; padding: 0; box-sizing: border-box;}
html {-webkit-font-smoothing: antialiased; /*scroll-behavior: smooth;*/}
body {overflow-x: hidden; color:#000; background: #fff; font-family: 'scg_reg', sans-serif !important; line-height: 1.4; font-size: 16px; color: var(--color_dark);}
img {vertical-align: middle; width: auto; max-width: 100%; height: auto;}
a, a:hover, a:active, a:focus, a:visited {text-decoration: none;}
.pos {position: absolute;}
.rel {position: relative;}
.t_inline {display: inline-block;}
h1,h2,h3,h4,h5,h6,p {margin-bottom: 0; line-height: 1.4; font-weight: normal;}
.showpc {display: block;}
.showmb {display: none;}

.text-center{text-align: center !important;}
.text-bold{font-family: 'scg_bol', sans-serif !important;}

.container{max-width: 1200px !important; width: 100%; padding: 0 15px; margin: 0 auto;}

.header{position: fixed; top: 0; width: 100%; box-shadow: 0 4px 44px rgba(0, 0, 0, 0.25); background-color: var(--color_light); z-index: 99;}
/* .header.theme-app{padding: 36px 0 30px;} */
.header .container > div{
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: 168px;
    transition: all 300ms;
}
/* .header.tiny{} */
.header.tiny .container > div{height: 100px;}
.header.theme-app.tiny .container > div{height: 120px;}

.header .block-menu{display: flex; width: 100%; justify-content: flex-end; align-items: center; max-width: 100%;}
.header .brand img{width: 133px;}

.header.theme-app .brand img{width: 224px;}
/* .header.theme-app .block-menu{max-width: 100%;} */

.header .item-list{
    display: flex;
}
.header .menu-list{margin: 0 10px;}
.header.theme-app .menu-list{margin: 0 10px;}
.header .menu-list > li{
    padding: 0 10px;
}
.header .menu-list .link{
    font-family: "scg_reg", sans-serif;
    display: inline-block;
    position: relative;
    font-weight: 200;
    color: var(--color_darkgray);
    font-size: 18px;
    transition: font-weight 300ms;
}
.header .menu-list .link.active{font-weight: 900; color: #101010;}
.header .menu-list .link:hover{font-weight: 900; color: #101010;}
.header .social-list{margin: 0 -6px;}
.header .social-list > li{
    padding: 0 6px;
    display: flex;
    align-items: center;
}
.header .social-list .link{display: inline-block;}
.header .social-list .link img{max-width: 28px; transition: all 300ms;}
.header .social-list .link:hover img{filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.2)); transform: translateY(-5px);}

.header .dropdown{position: relative; width: 100%; z-index: 1;}
.header .lang .dropdown{margin-top: 14px;}
.header .dropdown a,
.header .dropdown .link{display: flex; align-items: center; width: fit-content;}
.header .dropdown .dropdown-item{width: 100%;}
.header .dropdown a img,
.header .dropdown .link img{padding-right: 10px;}
.header .dropdown .dropdown-toggle{position: relative; padding-right: 20px; margin: 0 auto;}
.header .dropdown .dropdown-toggle:after{
    content: '';
    position: absolute;
    top: 50%;
    right: 0;
    transform: translate(0, -50%);
    width: 16px;
    height: 16px;
    background-image: url(../images/icon/arrow-down.png);
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 300ms;
}
.header .dropdown:hover .dropdown-toggle:after{transform: translate(0, -50%) rotate(-180deg);}
.header .dropdown .dropdown-menu{
    position: absolute;
    padding-top: 15px;
    min-width: 160px;
    /* max-height: 0; */
    /* overflow: hidden; */
    /* transition: all 0.6s ease; */
}
.header .dropdown .dropdown-menu .content{
    position: relative;
    display: block;
    background-color: var(--color_light);
    padding: 0 19px;
    border-radius: 6px;
    /* border: 1px solid var(--color_dark); */
    box-shadow: 4px 8px 18px rgba(0, 0, 0, 0.14);
    overflow: hidden;
    max-height: 0;
    z-index: 99;
    transition: all 0.5s linear;
    pointer-events: none;
}
.header .dropdown:hover .link{font-weight: 900; color: #101010;}
.header .dropdown:hover .dropdown-menu{pointer-events: auto;}
.header .dropdown:hover .dropdown-menu .content{pointer-events: auto; border: 1px solid var(--color_dark); max-height: 30em;}
.header .dropdown-menu .dropdown-item{padding: 11px 0; font-weight: 200; transition: all 200ms;}
.header .dropdown-menu .dropdown-item:hover{font-weight: 900;}
.header .dropdown-menu .dropdown-item + .dropdown-item{border-top: 1px solid var(--color_gray);}

.header.theme-app .block-laso{
    display: grid;
    justify-self: stretch;
    align-self: center;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 15px;
}
.header.theme-app .block-laso .lang{order: 1;}
.header.theme-app .block-laso .social-list{order: 2;}
.header.theme-app .block-laso .block{order: 3; grid-column: 1 / sapn 2;}
/* .header.theme-app .dropdown .dropdown-menu{padding-top: 10px;} */

.header.theme-app .block{
    display: grid;
    justify-self: stretch;
    align-self: center;
    grid-template-columns: repeat(2, 1fr);
    width: 100%;
    grid-gap: 8px;
}


.h-title{position: relative; font-size: 58px; line-height: 1; text-transform: uppercase;}
.h-title .highlight{position: relative; z-index: 0; display: inline-block;}
.h-title .highlight:before{
    content: '';
    position: absolute;
    bottom: 2%;
    left: 0;
    width: 100%;
    height: 30px;
    z-index: -1;
}
.h-title .highlight.green:before{background-color: var(--color_green);}
.h-title .highlight.orange:before{background-color: var(--color_orange2);}
.h-title .highlight.blue:before{background-color: var(--color_blue2);}

.text-small{font-size: 36px;}


.mt-f-sec{margin-top: 168px;}
.obj{position: absolute;}

.text-limit{
    display: -webkit-box;
    /* -webkit-line-clamp: 3; */
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.remodal-close, .remodal-close:before {left:auto; right:0;}

.swiper-pagination{margin-top: 26px;}
.swiper-pagination-bullet{--sizePagin: 9px; border-radius: 0; width: var(--sizePagin); height: var(--sizePagin); margin: 0 3px; opacity: 1; background: #888888; transition: all 300ms;}
.swiper-pagination-bullet-active{background: var(--color_dark); width: 33px;}

.otherYear{padding: 70px 0 60px;}
.swiperOtherYear{overflow: hidden; margin-top: 40px; height: auto; padding-bottom: 40px;}
.swiperOtherYear .swiper-wrapper{height: auto;}
.swiperOtherYear .swiper-slide .link{display: inline-block; width: 100%;}
.swiperOtherYear .block figure.cover{
    position: relative;
    width: 100%;
    height: 192px;
    border-radius: 10px;
    overflow: hidden;
}
.swiperOtherYear figure.cover > img{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    object-fit: cover;
    transform: scale(1);
    transition: all 400ms;
}
.swiperOtherYear .block .name{
    font-family: "scg_reg", sans-serif;
    font-size: 20px;
    color: var(--color_dark);
    text-align: center;
    padding-top: 15px;
}
.swiperOtherYear .block .name.text-limit{-webkit-line-clamp: 1;}

.swiperOtherYear .link:hover figure.cover img{transform: scale(1.1);}
.swiperOtherYear .swiper-pagination{left: 50%; transform: translate(-50%, 0);}
.otherYear_theme2 .swiperOtherYear .block .name{text-align: left; font-family: "scg_bol", sans-serif;}
.otherYear_theme2 .swiperOtherYear .block .desc{color: #888; font-size: 18px; line-height: 1.3em;}
.otherYear_theme2 .swiperOtherYear .block .desc.text-limit{-webkit-line-clamp: 3; height: calc(1.3em * 3);}

.bg_gradiusGreen{background: linear-gradient(180deg, var(--color_green) 0%, var(--color_light) 23%);}
.bg_gradiusOrange{background: linear-gradient(180deg, var(--color_orange) 0%, var(--color_light) 23%);}

.breadcrumb{margin-bottom: 35px;}
.breadcrumb > ul{
    display: flex;
    align-items: center;
    margin: 0 -10px;
}
.breadcrumb ul > li{
    position: relative;
    padding: 0 10px;
    font-size: 18px;
}
.breadcrumb ul li:not(:last-child){font-family: "scg_bol", sans-serif;}
.breadcrumb ul li:not(:last-child):before{
    --size: 8px;
    content: '';
    position: absolute;
    top: 46%;
    right: 0;
    width: var(--size);
    height: var(--size);
    border-top: 2px solid var(--color_dark);
    border-right: 2px solid var(--color_dark);
    transform: rotate(45deg) translate(0, -50%);
}

.sticky-social-list{
    position: sticky;
    top: 50%;
    right: 135px;
    float: right;
    z-index: 2;
}
.sticky-social-list ul{margin: 0 0 8px;}
.sticky-social-list ul > li{padding: 4px 0;}
.sticky-social-list li .link{
    display: inline-block;
    border-radius: 6px;
    border: 1px solid #C4C4C4;
    box-shadow: 0px 4px 24px rgba(0, 0, 0, 0);
    overflow: hidden;
    transition: all 300ms;
}
.sticky-social-list li .link img{max-width: 48px;}
.sticky-social-list li .link:hover{
    box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.1);
}

.sticky-social-list.contactSocial{
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 3;
    position: fixed;
    top: inherit;
    right: 30px;
    bottom: 35px;
}
.sticky-social-list.contactSocial li .link{
    --size: 48px;
    width: var(--size);
    height:var(--size);
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color_light);
}
.sticky-social-list.contactSocial li.phone img{filter: brightness(0) invert(0);}


/* lang vietnam */
/* vn lang */
.lang-vn .text-bold, .lang-vn .btn, .lang-vn .rules .rules-tab .item .heading .txt h2, .lang-vn .speakout .packaging .package-title{font-family: 'Roboto', sans-serif !important; font-weight: 700;}
.lang-vn .rules .rules-tab .item .heading .txt p{font-family: 'Roboto', sans-serif !important;}
.lang-vn p, .lang-vn div, .lang-vn h1, .lang-vn h2, .lang-vn h3, .lang-vn h4, .lang-vn h5, .lang-vn a, .lang-vn span{font-family: 'Roboto', sans-serif;}
.lang-vn .subTopic .title, .lang-vn .rules .rules-tab .content .content_item h2{font-family: 'Roboto', sans-serif; font-weight: 700;}
