:root {
    --color1: #dc3438;
    --color2: #0064d6;
    --color3: #d51243;
    --border-color: #ececec;
    --btnColor1: #0064d6;
    --btnColor2: #ffc107;
}
html{width:100%; overflow-x:hidden; }
body { font-size: 20px; color:#000; font-family:"Arsenal",'Roboto', sans-serif; width:100%; float:left; overflow-x:hidden;position:relative;  }

section{width:100%; float:left; position:relative; overflow:hidden; }

.intro-sestion{overflow:initial}
.intro-sestion .bg-slider{width:calc(100% - 40px) ; height:calc(100% - 85px); position:absolute; top:20px; left:20px; z-index:1; filter: blur(0px); overflow:hidden; border:none; border-radius:20px;}
.intro-sestion .bg-slider:before{ content:''; margin-right:10px; background:#000; width:100%; height:100%; display:block; position:absolute; top:0; left:0; opacity:.5; z-index:1;} 
.intro-sestion .container{z-index:3; position:relative;}
.intro-sestion .inner{width:100%; height:950px; padding-bottom:120px;  margin:0px; float:left; position:relative; display:block; z-index:3; display:flex; align-items:center; }
.intro-sestion .inner:before{content:''; width:350px; height:calc(100% - 200px);  position:absolute; top:20px; right:70px; background-image: linear-gradient(to bottom, var(--color1), rgba(255,255,255,0) 70%);} 
.intro-sestion .inner:after{content:''; width:350px; height:60px;  position:absolute; top:80px; right:70px; background:url(../images/ct-madeInJapan.svg) no-repeat center; background-size: auto 100%; z-index:2;} 
.intro-sestion .inner .ct-bottle{height:700px; position:absolute; bottom:60px; right:80px; z-index:4; display:block;  }
.intro-sestion .inner .ct-bowl{height:240px; position:absolute; bottom:30px; right:-100px; z-index:5; display:block; }
.intro-sestion a.logo{width:100px; display:block; margin: 0; z-index:3; position:absolute; top:20px; left:0;}
.intro-sestion a.logo img{width:100%;}
.intro-sestion .caption{ position:relative; display:block; margin: 0px ; z-index:2;  float:left; color:#fff; width:550px; }
.intro-sestion .caption h2{text-transform:uppercase; font-weight:bold; font-size:65px;}
.intro-sestion .caption p{width:100%; float:left; position:relative; text-align:left; font-size:23px; padding:20px 0; z-index:3;   }
.intro-sestion .wrap-nav{position:absolute;display:block; width:100%; top:100%; }
.intro-sestion .wrap-nav .col-nav{position:relative; width:50%; margin:0; float:left; padding-right:20px; }
.intro-sestion .wrap-nav .col-nav a{width:100%; float:left; background:var(--color1); line-height:60px; height:60px; display:block; color:#fff; text-decoration:none; padding: 0 25px; text-transform:uppercase; font-weight:bold; letter-spacing:0px; font-size:18px; transition:.3s; border-radius:7px; font-size:20px; }
.intro-sestion .wrap-nav .col-nav a:hover{box-shadow: inset 0 60px rgba(0,0,0,.15)}
.intro-sestion .wrap-nav .col-nav span{width:100%; margin:0; padding:0; font-size:15px; padding-top:10px; display:block; float:left; font-weight:normal; display:none;}
.intro-sestion .wrap-nav .col-nav:first-of-type a{background:#fff; color:var(--color1)}
.intro-sestion .row-feature{z-index:2; background:var(--color1); padding-left:50px; overflow:initial; width:100%; float:left; clear:both; height:130px; display:flex; align-items:center; position:absolute; left:0; bottom:0; border-radius:20px; box-shadow: 0px 0px 35px 0px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0,0,0,.03);}
.intro-sestion .row-feature ul{margin:0; padding:0; list-style:none; display:flex; position:relative; }
.intro-sestion .row-feature ul li{position:relative; padding-left:65px; margin-right:50px; text-align:left; color:#fff}
.intro-sestion .row-feature ul li span{display:block; padding-top:1px; opacity:.85}
.intro-sestion .row-feature ul li b{text-transform:uppercase; font-size:23px; float:left; letter-spacing:0;  width:100%; float:left; margin-top:-2px;}
.intro-sestion .row-feature ul li:before{content:''; width:50px; height:50px; background:url(../images/ct-allergen.svg) no-repeat 0 0; background-size: 100% auto; display:block; position:absolute; top:7px; left:0;}
.intro-sestion .row-feature ul li:nth-child(2):before{background-position: 0 -50px}
.intro-sestion .row-feature ul li:nth-child(3):before{background-position: 0 -100px}
.intro-sestion .row-feature ul li:nth-child(4):before{background-position: 0 -150px}



.vegas-timer-progress{background:var(--color1)!important; display:none;}

@keyframes bounce-hero {
    0% 		{margin-bottom:0px;}
    50% 	{margin-bottom:25px;}
    100% 	{margin-bottom:0px;}
}

@keyframes zoom-btn {
    0% 		{transform:scale(1)}
    50% 	{transform:scale(1.2)}
    100% 	{transform:scale(1);}
}

@media (max-width: 767px) {
    .intro-sestion .bg-slider{width:100% ; height:calc(100% - 140px);top:0px; left:0px; border-radius:0px;}
    .intro-sestion .inner{height:1200px; display:block; text-align:center; padding-top:150px;}
    .intro-sestion a.logo{width:80px; top:0;}
    .intro-sestion .caption{width:100%; margin:0 auto; display:block; max-width:350px; float:initial}
    .intro-sestion .caption h2{font-size:45px;}
    .intro-sestion .caption p{font-size:20px; text-align:center}
    .intro-sestion .inner:before{width:220px; top:0; right:0; display:none; }
    .intro-sestion .inner:after{width:100px; top:30px; height:50px; right:0; background-position-x:right}
    .intro-sestion .inner .ct-bottle{height:350px; bottom:300px; right:initial; left:50%; margin-left:-180px}
    .intro-sestion .inner .ct-bowl{height:160px; bottom:280px; right:50%; margin-right:-180px}
    .intro-sestion .wrap-nav{position:relative; width:calc(100% + 20px); margin-left:-10px;}
    .intro-sestion .wrap-nav .col-nav{width:calc(50% - 20px); margin: 0 10px; float:left; padding:0;}
    .intro-sestion .wrap-nav .col-nav a{height:55px; line-height:55px; font-size:18px; text-align:center ; padding: 0 10px;}
    .intro-sestion .row-feature{ border-radius:10px; height:350px; padding:0; width:350px; margin: 0 auto; left:50%; margin-left:-175px; padding-top:70px;}
    .intro-sestion .row-feature ul{display:block; width:100%; float:left;}
    .intro-sestion .row-feature ul li{margin:0; display:block; width:50%; height:140px; padding: 68px 0 0 0; text-align:center; float:left; }
    .intro-sestion .row-feature ul li:before{left:50%; margin-left:-25px; top:15px;}
    .intro-sestion .row-feature ul li span{font-size:18px;}
    .intro-sestion .row-feature ul li b{font-size:21px;}
    .intro-sestion .row-feature ul li:after{display:none;}
    .intro-sestion .row-feature ul li:first-child{border-bottom:1px solid rgba(0,0,0,.2); border-right:1px solid rgba(0,0,0,.2)}
    .intro-sestion .row-feature ul li:nth-child(2){border-bottom:1px solid rgba(0,0,0,.2);}
    .intro-sestion .row-feature ul li:nth-child(3){border-right:1px solid rgba(0,0,0,.2)}
}

@media (min-width: 768px) and (max-width: 991px) {
    .intro-sestion .bg-slider{width:100% ; height:calc(100% - 50px);top:0px; left:0px; border-radius:0px;}
    .intro-sestion .inner{height:780px;}
    .intro-sestion a.logo{width:90px; top:0;}
    .intro-sestion .caption{width:400px;}
    .intro-sestion .caption h2{font-size:50px;}
    .intro-sestion .caption p{font-size:21px;}
    .intro-sestion .inner:before{width:220px; top:0; right:0; }
    .intro-sestion .inner:after{width:220px; top:40px; height:50px; right:0;}
    .intro-sestion .inner .ct-bottle{height:500px; bottom:150px; right:-5px;}
    .intro-sestion .inner .ct-bowl{height:160px; bottom:150px; right:-80px;}
    .intro-sestion .wrap-nav .col-nav a{height:55px; line-height:55px; font-size:18px; text-align:center}
    .intro-sestion .row-feature{ border-radius:15px; height:100px; padding:0;}
    .intro-sestion .row-feature ul{display:table; width:100%; float:left;}
    .intro-sestion .row-feature ul li{margin:0; display:table-cell; width:25%; padding: 13px 0 0 0; text-align:center;}
    .intro-sestion .row-feature ul li:before{left:50%; margin-left:-25px; top:-40px;}
    .intro-sestion .row-feature ul li span{font-size:18px;}
    .intro-sestion .row-feature ul li b{font-size:21px;}
    .intro-sestion .row-feature ul li:after{content:''; width:1px; height: calc(100% - 20px); right:0; top:10px; background:#fff; position:absolute; box-shadow: 1px 0 #000; opacity:.3}
    .intro-sestion .row-feature ul li:last-child:after{display:none;}
}

@media (min-width: 992px) and (max-width: 1199px) {
    .intro-sestion .bg-slider{width:100% ; height:calc(100% - 55px);top:0px; left:0px; border-radius:0px;}
    .intro-sestion .inner{height:850px;}
    .intro-sestion a.logo{width:90px; top:0;}
    .intro-sestion .caption{width:470px;}
    .intro-sestion .caption h2{font-size:55px;}
    .intro-sestion .caption p{font-size:20px;}
    .intro-sestion .inner:before{width:270px; top:0;}
    .intro-sestion .inner:after{width:270px; top:40px; height:50px;}
    .intro-sestion .inner .ct-bottle{height:550px; bottom:150px;}
    .intro-sestion .inner .ct-bowl{height:200px; bottom:150px; right:-80px;}
    .intro-sestion .wrap-nav .col-nav a{height:55px; line-height:55px;}
    .intro-sestion .row-feature{padding-left:45px; border-radius:15px; height:110px;}
    .intro-sestion .row-feature ul li{margin-right:45px;}

}

@media (min-width: 1200px) and (max-width: 1399px) {
    .intro-sestion .row-feature{padding-left:30px;}
    .intro-sestion .row-feature ul li{margin-right:30px;}
    .intro-sestion .caption{width:500px}
    .intro-sestion .caption h2{font-size:60px;}
}


.ingredient-sestion{}
.ingredient-sestion:before{content:''; background:url(../images/ct-mountain-bg.jpg) no-repeat center 0px; background-size:100% auto; width:100%; height:100%; position:absolute; top:0; left:0; opacity:.5; filter: blur(0px); z-index:1; }
.ingredient-sestion .inner{width:100%; float:left; position:relative; z-index:3; background:#fff; background:none; margin-top:670px; text-align:center; padding: 150px 0px 80px 0px; border-radius:20px 20px 0 0}
.ingredient-sestion .inner:before{content:''; width:100%; height:400px; background:url(../images/ct-mountain.svg) no-repeat center 0; background-size: auto 100%; position:absolute; left:0; bottom:100%; margin-bottom:-70px; z-index:1;}
.ingredient-sestion .inner h2{color:var(--color1); font-weight:900; text-transform:uppercase; font-size:35px;}
.ingredient-sestion .inner h3{font-weight:bold; font-size:22px;}
.ingredient-sestion .inner ul{width:calc(100% + 30px); margin:0 0 0 -15px; padding:0; list-style:none; float:left; }
.ingredient-sestion .inner ul li{width:calc(33.333333333% - 30px); margin: 30px 15px 0 15px; float:left; position:relative;}
.ingredient-sestion .inner ul li .wrap-img{width:100%; float:left; position:relative; margin-bottom:20px; overflow:hidden; border-radius:20px;}
.ingredient-sestion .inner ul li .wrap-img img{width:100%; border-radius:0px;}
.ingredient-sestion .inner ul li h4{width:100%; float:left; text-align:center; color:var(--color1); font-weight:900;}
.ingredient-sestion .inner ul li p{font-size:18px;}
.ingredient-sestion .ct-bottle{width:280px; margin-bottom:-100px; margin-left:-140px; position:absolute; top:150px; left:50%; z-index:5;}
.ingredient-sestion .ct-text{position:absolute; top:100px; right:50%; margin-right:150px; z-index:5; width:100px; }
.ingredient-sestion .ct-text:before{content:'(Cổ Tùng)'; position:absolute; top:0; right:100%; white-space:nowrap; font-weight:500;}
.ingredient-sestion .ct-text img{width:100%;}
.ingredient-sestion .ct-intro{position:absolute; left:50%; top:100px; margin-left:200px; z-index:5; width:350px; font-size:18px; text-align:justify; padding:75px 0}
.ingredient-sestion .ct-intro .box{margin:0; padding:5px 50px; z-index:5; position:relative; overflow:hidden;}
.ingredient-sestion .ct-intro .box .line-left:before{width:800px; height:800px; margin-top:-400px; border:1px solid #000; position:absolute; left:10px; top:50%; display:block; content:''; border-radius:50%; opacity:.3}
.ingredient-sestion .ct-intro .box .line-left:after{width:800px; height:800px; margin-top:-400px; border:1px solid #000; position:absolute; left:14px; top:50%; display:block; content:''; border-radius:50%; opacity:.3}
.ingredient-sestion .ct-intro .box .line-right:before{width:800px; height:800px; margin-top:-400px; border:1px solid #000; position:absolute; right:10px; top:50%; display:block; content:''; border-radius:50%; opacity:.3}
.ingredient-sestion .ct-intro .box .line-right:after{width:800px; height:800px; margin-top:-400px; border:1px solid #000; position:absolute; right:14px; top:50%; display:block; content:''; border-radius:50%; opacity:.3}
.ingredient-sestion .ct-intro .box p{width:100%; float:left; position:relative; margin:0; padding:0; }
.ingredient-sestion .ct-intro:before{content:''; width:100%; height:62px; background:url(../images/ct-title-frame-red-1.svg) no-repeat center; background-size:100% 100%; position:absolute; top:0; left:0; opacity:1 }
.ingredient-sestion .ct-intro:after{content:''; width:100%; height:62px; background:url(../images/ct-title-frame-red-1.svg) no-repeat center; background-size:100% 100%; position:absolute; bottom:0; left:0; opacity:1; -webkit-transform: scale(-1,-1);  transform: scale(-1,-1); }


@media (max-width: 767px) {
    .ingredient-sestion:before{background-size: 800px auto;background-position: center 0px;}
    .ingredient-sestion .inner{padding-bottom:30px; margin-top:550px;}
    .ingredient-sestion .inner:before{ background-size:100% auto; width:calc(100% + 120px); margin-left:-60px;}
    .ingredient-sestion .ct-bottle{width:150px; margin-left:-75px; top:60px}
    .ingredient-sestion .ct-intro{margin-left:50px; width:350px; font-size:16px; top:400px; position:absolute; margin-left:-175px }
    .ingredient-sestion .ct-intro .box{padding: 0 35px;}
    .ingredient-sestion .ct-text{margin-right:50px; width:55px; top:40px;}
    .ingredient-sestion .inner{padding-top:170px;}
    .ingredient-sestion .inner h2{font-size:26px;}
    .ingredient-sestion .inner h3{font-size:20px;}
    .ingredient-sestion .inner ul{width:100%; margin:0;}
    .ingredient-sestion .inner ul li{max-width:370px; margin: 20px auto 0 auto;padding: 0 10px; display:block; float:initial; width:100%;}
    .ingredient-sestion .inner ul li h4{font-size:20px; font-weight:bold}
    .ingredient-sestion .inner ul li .wrap-img{border-radius:10px;}
}

@media (min-width: 768px) and (max-width: 991px) {
    .ingredient-sestion:before{background-size: 1200px auto;background-position: center 50px;}
    .ingredient-sestion .inner{padding-bottom:30px;}
    .ingredient-sestion .inner:before{ background-size:100% auto}
    .ingredient-sestion .ct-bottle{width:200px; margin-left:-100px; top:200px}
    .ingredient-sestion .ct-intro{margin-left:50px; width:320px; font-size:16px; top:50px; }
    .ingredient-sestion .ct-intro .box{padding: 0 35px;}
    .ingredient-sestion .ct-text{margin-right:80px; width:90px;}
    .ingredient-sestion .inner{padding-top:10px;}
    .ingredient-sestion .inner h2{font-size:28px;}
    .ingredient-sestion .inner h3{font-size:20px;}
    .ingredient-sestion .inner ul{width:calc(100% + 20px); margin-left:-10px;}
    .ingredient-sestion .inner ul li{width:calc(33.33333333% - 20px); margin: 30px 10px 0 10px}
    .ingredient-sestion .inner ul li h4{font-size:20px; font-weight:bold}
    .ingredient-sestion .inner ul li .wrap-img{border-radius:15px;}
}

@media (min-width: 992px) and (max-width: 1199px) {
    .ingredient-sestion:before{background-size: 1500px auto;background-position: center 80px;}
    .ingredient-sestion .inner:before{ background-size:100% auto}
    .ingredient-sestion .ct-bottle{width:240px; margin-left:-120px;}
    .ingredient-sestion .ct-intro{margin-left:120px;}
    .ingredient-sestion .ct-text{margin-right:120px;}
    .ingredient-sestion .inner{padding-top:60px;}
    .ingredient-sestion .inner ul li .wrap-img{border-radius:15px;}
}

@media (min-width: 1200px) and (max-width: 1399px) {
    .ingredient-sestion:before{background-size: 1500px auto;background-position: center 80px;}
    .ingredient-sestion .inner:before{ background-size:100% auto}
}




.flavor-sestion{padding:0px 0 ; position:relative}
.flavor-sestion .inner{width:100%; position:relative; float:left; z-index:3; background:url(../images/ct-flavor-bg.jpg) no-repeat center; background-size:cover; border-radius:15px; padding: 0 50px 50px 50px  }
.flavor-sestion .caption{float:left; position:relative; color:#fff; text-align:center; width:360px; background:var(--color1); padding:30px; border-radius: 0 0 10px 10px}
.flavor-sestion .caption:before{content:'';width:100%; height:25px; background:url(../images/ct-pattern-black-bg.svg) repeat-x center 0; background-size: auto 100%; position:absolute; top:0; left:0; opacity:.3}
.flavor-sestion .caption h2{text-transform:uppercase; font-size:35px; font-weight:bold; padding-bottom:10px; padding-top:35px;}
.flavor-sestion .caption h4{font-weight:bold; font-size:20px; position:relative; padding-bottom:15px; }
.flavor-sestion ul{width:100%; margin: 0 0; padding:60px 0 60px 0 ; list-style:none; position:relative; float:left;}
.flavor-sestion ul:before{content:''; width:100%; height:45px; background:url(../images/ct-title-frame-bottom-white.svg) no-repeat center; background-size:auto 100%; position:absolute; top:0; left:0; opacity:.5 }
.flavor-sestion ul:after{content:''; width:100%; height:45px; background:url(../images/ct-title-frame-top-white.svg) no-repeat center; background-size:auto 100%; position:absolute; bottom:0; left:0; opacity:.5; -webkit-transform: scaleX(-1);  transform: scaleX(-1); }
.flavor-sestion ul li{width:100%; margin: 0 ; position:relative; float:left; color:#fff; text-align:center; padding:20px 10px; font-size:17px; font-weight:normal}
.flavor-sestion ul li:before{width:150px; margin-left:-75px; height:1px; background:#fff; content:''; position:absolute; bottom:0; left:50%; opacity:.3; box-shadow: 0 -1px rgba(0,0,0,.8)}
.flavor-sestion ul li:first-child{padding-top:0;}
.flavor-sestion ul li:last-child{padding-bottom:0;}
.flavor-sestion ul li:last-child:before{display:none;}

@media (max-width: 767px) {
    .flavor-sestion{padding-bottom:400px; }
    .flavor-sestion .container{max-width:100%;}
    .flavor-sestion .inner{height:300px; background-position-y:bottom}
    .flavor-sestion .caption{max-width:350px; height:480px; width:100%; display:block; margin:-80px 0 0 -175px ; left:50%; top:100%; position:absolute}
    .flavor-sestion .caption h2{font-size:24px;}
    .flavor-sestion .caption h4{font-size:18px;}
    .flavor-sestion ul{padding: 65px 0}
    .flavor-sestion ul:before,
    .flavor-sestion ul:after{height:55px;}
}

@media (min-width: 768px) and (max-width: 991px) {
    .flavor-sestion .container{max-width:100%;}
    .flavor-sestion .caption{width:380px;}
    .flavor-sestion .caption h2{font-size:28px;}
}


@media (min-width: 992px) and (max-width: 1199px) {
    .flavor-sestion .container{max-width:100%;}
}



/* Quy trình sản xuất */

.manufacture-sestion{}
.manufacture-sestion .wrap-title{width:100%; float:left; position:relative; padding-top:60px; padding-right:200px}
.manufacture-sestion .wrap-title h2{color:var(--color1); font-weight:900; text-transform:uppercase; font-size:35px; padding-bottom:5px;}
.manufacture-sestion .wrap-title h3{font-weight:bold; font-size:20px; max-width:850px;}
.manufacture-sestion .wrap-title .label{position:absolute; top:60px; right:0; background:var(--color1); padding: 0px 25px 20px 25px; color:#fff; text-align:center; border-radius:10px;}
.manufacture-sestion .wrap-title .label b{display:block; font-size:72px; position:relative; font-weight:900; width:100%; padding-right:28px; margin-top:-10px; }
.manufacture-sestion .wrap-title .label b:after{content:'Tháng'; width:50px; font-size:13px; font-weight:bold; text-transform:uppercase; line-height:21px; height:20px; float:left; position:absolute; top:48px; right:-12px; background:rgba(0,0,0,.3); display:block; border-radius:3px; transform:rotate(-90deg)}
.manufacture-sestion .wrap-title .label span{text-transform:uppercase; font-weight:bold; font-size:17px; letter-spacing:1px; margin-top:-20px; display:block; float:left; width:100%;}
.manufacture-sestion ul.procedure{width:100%; margin:50px 0 0 0; padding:10px ; list-style:none; position:relative; z-index:3; }
.manufacture-sestion ul.procedure li{width:calc(25% - 20px); position:relative; float:left; margin: 10px; background:#121212; border-radius:20px 20px; z-index:3;}
.manufacture-sestion ul.procedure li .img{width:100%; position:relative; height:250px; overflow:hidden;  border-radius:20px 20px 0 0;}
.manufacture-sestion ul.procedure li:first-child .img{background:url(../images/ct-quytrinh-tronhonhop.jpg) no-repeat center; background-size:cover}
.manufacture-sestion ul.procedure li:nth-child(2) .img{background:url(../images/ct-quytrinh-lenmen.jpg) no-repeat center; background-size:cover}
.manufacture-sestion ul.procedure li:nth-child(3) .img{background:url(../images/ct-quytrinh-chietxuat.jpg) no-repeat center; background-size:cover}
.manufacture-sestion ul.procedure li:nth-child(4) .img{background:url(../images/ct-quytrinh-loctapchat.jpg) no-repeat center; background-size:cover}
.manufacture-sestion ul.procedure li .caption{width:100%;   padding: 30px 30px; color:#fff; position:relative; z-index:3; margin-top:0px; transition:.3s; border-radius: 0 0 10px 10px }
.manufacture-sestion ul.procedure li .caption h4{color:var(--color1); position:relative; z-index:3; font-weight:bold; font-size:22px; padding-top:5px; text-transform:uppercase}
.manufacture-sestion ul.procedure li .caption p{margin:0; width:100%; text-align:justify; line-height:25px; position:relative; z-index:3; padding-top:20px; margin-top:20px; font-size:18px;}
.manufacture-sestion ul.procedure li .caption p:before{content:''; width:50px; height:2px; background:#fff; display:block; position:absolute; top:0; left:0; display:block; z-index:3; opacity:.5}
.manufacture-sestion ul.procedure li .img:after{content:"01"; position:absolute; bottom:0px; right:25px; z-index:1; font-size:60px; font-weight:bold; text-shadow: 1px 1px 0 #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff; color:#000; opacity:.5}
.manufacture-sestion ul.procedure li:nth-child(2) .img:after{content:'02'}
.manufacture-sestion ul.procedure li:nth-child(3) .img:after{content:'03'}
.manufacture-sestion ul.procedure li:nth-child(4) .img:after{content:'04'}

@media (max-width: 767px) {
    .manufacture-sestion .wrap-title{padding-right:0; text-align:center; padding-top:190px;}
    .manufacture-sestion .wrap-title .label{width:170px; text-align:center; right:50%; margin-right:-85px; padding-bottom:20px;}
    .manufacture-sestion .wrap-title h2{font-size:26px;}
    .manufacture-sestion .wrap-title h3{font-size:18px;}

    .manufacture-sestion ul.procedure{width:350px; margin: 0px auto 0 auto; display:block; padding:0;}
    .manufacture-sestion ul.procedure li{width:100%; margin: 30px 0 0 0; float:left; position:relative; display:block; background:none;}
    .manufacture-sestion ul.procedure li .caption{padding: 15px 0 0 0; color:#000; text-align:center }
    .manufacture-sestion ul.procedure li .caption p{text-align:center;padding-top:0px; margin-top:10px;}
    .manufacture-sestion ul.procedure li .img{border-radius:10px}
    
}

@media (min-width: 768px) and (max-width: 991px) {
    .manufacture-sestion .wrap-title{padding-top:60px;}
    .manufacture-sestion .wrap-title h2{font-size:28px; }

    .manufacture-sestion ul.procedure{max-width: 730px; display:block; margin: 30px auto 0 auto}
    .manufacture-sestion ul.procedure li{width: calc(50% - 20px); border-radius:15px;}
    .manufacture-sestion ul.procedure li .img{border-radius:15px 15px 0 0}
}

@media (min-width: 992px) and (max-width: 1199px) {
    .manufacture-sestion ul.procedure{max-width: 970px; display:block; margin: 50px auto 0 auto}
    .manufacture-sestion ul.procedure li{width: calc(50% - 20px); border-radius:15px;}
    .manufacture-sestion ul.procedure li .img{border-radius:15px 15px 0 0}
}

@media (min-width: 1200px) and (max-width: 1399px) {
    
}

/* So sánh */
.benefit-sestion{}
.benefit-sestion .benefit-title{width:100%; float:left; position:relative; padding-top:70px;}
.benefit-sestion .benefit-title:before{content:'&'; width:200px; font-family:Roboto; margin-left:-100px; text-align:center; position:absolute; top:50px; left:50%; z-index:1; font-weight:bold; font-size:150px; opacity:.07  } 
.benefit-sestion .benefit-title  h3{font-size:32px; text-transform:uppercase; font-weight:900; width:420px; display:inline-block }
.benefit-sestion .benefit-title .col-left{width:50%; text-align:right; float:left; padding-right:25px; color:#000; position:relative; z-index:3;}
.benefit-sestion .benefit-title .col-right{width:50%; text-align:left; float:right; padding-left:25px; color:var(--color1); position:relative; z-index:3;}
.benefit-sestion .benefit-title p{width:100%; margin:0; padding:0; text-align:center; font-size:20px; padding-bottom:30px; float:left; font-weight:bold;}
.benefit-sestion .benefit-content{width:100%; float:left; overflow:hidden; position:relative;  margin-top:0px; padding-top:40px; padding-bottom:65px; background:rgba(0,0,0,.0)}
.benefit-sestion .benefit-content:before{ width:1px; height:calc(100% - 270px); background:#000; position:absolute; top:100px; left:50%; z-index:1; content:''; opacity:.2}
.benefit-sestion .benefit-content:after{content:''; width:100%; height:100%; background:url(../images/ct-pattern-black-bg.svg) repeat center 0; position:absolute; top:0; left:0; opacity:.0; z-index:1; }
.benefit-sestion .benefit-content .container{position:relative; z-index:5;}
.benefit-sestion .benefit-content ul{margin:0 auto; padding:0; list-style:none; width:calc(100% - 280px - 280px - 40px); display:block}
.benefit-sestion .benefit-content ul li{width:100%;  display:block; position:relative; float:left; }
.benefit-sestion .benefit-content ul li h4{font-size:18px; min-height:100px; font-weight:normal; margin:0; color:#000; width: calc(50% - 30px); position:relative; display:flex; align-items:center;}
.benefit-sestion .benefit-content ul li h4:after{content:''; width:calc(100% - 55px); height:1px; background:#000; position:absolute; left:0; bottom:0; opacity:.15}
.benefit-sestion .benefit-content ul li h4:first-child{text-align:right; justify-content:right; padding-right:55px; float:left;}
.benefit-sestion .benefit-content ul li h4:first-child:before{content:''; width:40px; height:40px; margin-top:-20px; background: url(../images/ct-check.png) no-repeat 0 bottom; background-size: 100% auto; position:absolute; top:50%; right:0; opacity:.5}
.benefit-sestion .benefit-content ul li h4:last-child{justify-content:left; padding-left:55px; float:right}
.benefit-sestion .benefit-content ul li h4:last-child:before{content:''; width:40px; height:40px; margin-top:-20px; background: url(../images/ct-check.png) no-repeat 0 0; background-size: 100% auto; position:absolute; top:50%; left:0;}
.benefit-sestion .benefit-content ul li h4:last-child:after{ left:55px;}
.benefit-sestion .benefit-content ul li:last-child{margin-bottom:20px;}
.benefit-sestion .benefit-content ul li:last-child h4:after{display:none;}
.benefit-sestion .benefit-content .wrap-img{position:absolute; left:0px; height:100%; top:0px; width:280px; overflow:hidden; background:url(../images/ct-loiich-tuongcongnghiep.jpg) no-repeat center; background-size:cover; border-radius:10px; box-shadow: 0 0 0 5px #000, 0 20px 30px -10px rgba(0,0,0,.5) }
.benefit-sestion .benefit-content .wrap-img.img-right{background:url(../images/ct-loiich-tuongcotung.jpg) no-repeat center; left:initial; right:0px; background-size:cover; box-shadow: 0 0 0 5px var(--color1),0 20px 30px -10px rgba(0,0,0,.5) }
.benefit-sestion .benefit-content .nav-buy{width:250px; margin: 0px  auto 0 auto; clear:both; background:var(--color1); line-height:55px; display:block; color:#fff; text-decoration:none; padding: 0 25px; text-transform:uppercase; font-weight:bold; letter-spacing:1px; font-size:17px;; transition:.3s; box-shadow: inset 0 0 rgba(0,0,0,0); text-align:center; border-radius:10px; }
.benefit-sestion .benefit-content .nav-buy:hover{box-shadow: inset 250px 0 rgba(0,0,0,.20)}

@media (max-width: 767px) {
   .benefit-sestion .benefit-title{padding-top:40px; padding-left:15px; padding-right:15px;}
   .benefit-sestion .benefit-title p{margin-top:20px; padding-bottom:20px;}
   .benefit-sestion .benefit-title h3{font-size: 22px; width:100%;}
   .benefit-sestion .benefit-title:before{top:initial; bottom:-50px;}
   .benefit-sestion .benefit-title .col-left{padding-right:15px;}
   .benefit-sestion .benefit-title .col-right{padding-left:15px;}
   .benefit-sestion .benefit-content{padding-top:20px; padding-bottom:40px; margin-top:30px;}
   .benefit-sestion .benefit-content:before{display:none;}
   .benefit-sestion .benefit-content .wrap-img{display:none;}
   .benefit-sestion .benefit-content ul{ width:100%; float:left; position:relative;}
   .benefit-sestion .benefit-content ul:before{content:''; width:1px; height:calc(100% - 80px); background:#000; opacity:.15; position:absolute; top:30px; left:50%;}
   .benefit-sestion .benefit-content ul li{padding: 20px 0; position:relative;}
   .benefit-sestion .benefit-content ul li:before{content:''; width:calc(50% - 20px); height:1px; background:#000; position:absolute; left:0; bottom:0; opacity:.15}
   .benefit-sestion .benefit-content ul li:after{content:''; width:calc(50% - 20px); height:1px; background:#000; position:absolute; right:0; bottom:0; opacity:.15}
   .benefit-sestion .benefit-content ul li h4{padding:0!important; min-height:initial!important; line-height:28px; width: calc(50% - 20px);}
   .benefit-sestion .benefit-content ul li h4:before,
   .benefit-sestion .benefit-content ul li h4:after{display:none!important;}
   .benefit-sestion .benefit-content ul li:last-child:before,
   .benefit-sestion .benefit-content ul li:last-child:after{display:none;}
   
}

@media (min-width: 768px) and (max-width: 991px) {

   .benefit-sestion .benefit-title{padding-top:10px;}
   .benefit-sestion .benefit-title p{margin-top:20px; padding-bottom:20px;}
   .benefit-sestion .benefit-title h3{font-size: 28px; width:100%;}
   .benefit-sestion .benefit-title:before{top:0px}
   .benefit-sestion .benefit-content{padding-top:20px; padding-bottom:45px;}
   .benefit-sestion .benefit-content:before{top:50px; height:calc(100% - 200px)}
   .benefit-sestion .benefit-content .wrap-img{display:none;}
   .benefit-sestion .benefit-content ul{ width:100%}
}

@media (min-width: 992px) and (max-width: 1199px) {
   .benefit-sestion .benefit-content .wrap-img{display:none;}
   .benefit-sestion .benefit-content ul{ width:100%}
}

@media (min-width: 1200px) and (max-width: 1399px) {
    .benefit-sestion .benefit-content ul{ width:calc(100% - 230px - 230px - 40px)}
    .benefit-sestion .benefit-content .wrap-img{left:-50px;}
    .benefit-sestion .benefit-content .wrap-img.img-right{right:-50px;}
}

/* Umami  */

.umami-sestion{padding-top:50px;}
.umami-sestion .row-item{width:100%; float:left; position:relative; height:400px; display:flex; align-items:center;}
.umami-sestion .row-item .wrap-img{width:calc(50% - 20px); height:100%; position:absolute; left:20px; top:0; border-radius: 20px 0 0 20px; background:url(../images/ct-umami-1.jpg) no-repeat center; background-size:cover; display:block; overflow:hidden;}
.umami-sestion .row-item .wrap-img:before{content:''; width:200px; height:calc(100% + 2px) ; background:url(../images/ct-umami-bg.svg) no-repeat right center; background-size:auto 100%; position:absolute; top:-1px; right:-2px;}
.umami-sestion .row-item .container{position:relative; z-index:3;}
.umami-sestion .row-item .inner{width:50%; float:right}
.umami-sestion .row-item .inner h2{margin:0; width:100%; text-transform:uppercase; font-weight:bold; font-size:35px; color:var(--color1)}
.umami-sestion .row-item .inner h3{width:100%; float:left; font-size:24px; font-weight:bold; padding-top:5px;}
.umami-sestion .row-item .inner p{width:100%; margin:0; padding:20px 0 0 0; font-size:19px; float:left;}

.umami-sestion .row-right .wrap-img{left:initial; right:20px; border-radius: 0 20px 20px 0; background:url(../images/ct-umami-2.jpg) no-repeat center; background-size:cover;}
.umami-sestion .row-right .wrap-img:before{left:-1px; right:initial; -webkit-transform: scale(-1, -1); transform: scaleY(-1,-1);}
.umami-sestion .row-right .inner{float:left;}

@media (max-width: 767px) {
    .umami-sestion .row-item{display:block; height:auto}
    .umami-sestion .row-item .wrap-img{width:350px; left:50%; margin-left:-175px; position:relative; border-radius:10px; height:250px;}
    .umami-sestion .row-item .wrap-img:before{display:none;}
    .umami-sestion .row-item .inner{width:350px; float:left; left:50%; margin-left:-175px; position:relative;text-align:center; padding-top:15px; }
    .umami-sestion .row-item .inner h2{font-size:24px;}
    .umami-sestion .row-item .inner h3{font-size:20px;}
    .umami-sestion .row-item .inner p{font-size:18px; padding-top:0px;}
    .umami-sestion .row-right{padding-top:30px;}
}



/* Hương vị umami đậm đà */
.processing-sestion{}
.processing-sestion .head-row{width:100%; float:left; position:relative; padding-top:80px;}
.processing-sestion .head-row h2{color:var(--color1); font-weight:900; text-transform:uppercase; text-align:center; font-size:35px;}
.processing-sestion .head-row h3{font-weight:bold; font-size:22px; text-align:center}
.processing-sestion .body-row{width:100%; float:left; position:relative; height:400px; margin-top:400px;}
.processing-sestion .body-row:before{content:''; width:calc(100% - 40px); height:100%; background:url(../images/ct-chebien-bg.jpg) no-repeat center bottom; background-size:cover;  position:absolute; top:0; left:20px;border-radius:20px; }
.processing-sestion .body-row ul{margin:0; padding:0; list-style:none; width:calc(100% + 10px); float:left; margin-left:-5px; position:relative; z-index:3;}
.processing-sestion .body-row ul li{width:calc(25% - 10px); position:relative; display:block; float:left; margin: 0 5px;}
.processing-sestion .body-row ul li .img{width:100%; height:350px; background:url(../images/ct-chebien-montron.jpg) no-repeat center; background-size:cover; position:absolute; left:0; bottom:100%; border-radius:10px 10px 0 0}
.processing-sestion .body-row ul li .caption{width:100%; background:var(--color1); position:relative; padding:20px 15px; text-align:center; color:#fff; float:left; border-radius:0 0 10px 10px}
.processing-sestion .body-row ul li .caption h4{margin:0; padding:0; font-size:20px; text-transform:uppercase; font-weight:bold}
.processing-sestion .body-row ul li .caption p{width:100%; margin:0; line-height:22px; padding-top:7px;}
.processing-sestion .body-row ul li:nth-child(2) .img{background:url(../images/ct-chebien-moncham.jpg) no-repeat center; background-size:cover;}
.processing-sestion .body-row ul li:nth-child(3) .img{background:url(../images/ct-chebien-nemnem.jpg) no-repeat center; background-size:cover;}
.processing-sestion .body-row ul li:nth-child(4) .img{background:url(../images/ct-chebien-phatrabinhminh.jpg) no-repeat center; background-size:cover;}

@media(max-width: 767px) {
    .processing-sestion .head-row{padding-top:50px;}
    .processing-sestion .head-row h2{font-size:26px;}
    .processing-sestion .head-row h3{font-size:20px;}
    .processing-sestion .body-row{background-size: auto 500px; margin-top:220px; height:auto; background:#000 url(../images/ct-chebien-bg-mobile.jpg) no-repeat center bottom; padding-top:0px; padding-bottom:180px; background-size: 780px auto;}
    .processing-sestion .body-row:before{display:none;}
    .processing-sestion .container{max-width:100%}
    .processing-sestion .body-row ul{width:350px; display:block; margin: -220px auto 0 auto; float:initial;}
    .processing-sestion .body-row ul li{width:100%; margin:0; float:left; margin-top:20px}
    .processing-sestion .body-row ul li .img{height:200px; position:relative; display:block; float:left;}
    .processing-sestion .body-row ul li .caption{background:#fff; color:#000}
    .processing-sestion .body-row ul li .caption h4{text-transform:initial; color:var(--color1)}
}

@media (min-width: 768px) and (max-width: 991px) {
    .processing-sestion .head-row{padding-top:50px;}
    .processing-sestion .head-row h2{font-size:28px;}
    .processing-sestion .head-row h3{font-size:20px;}
   .processing-sestion .body-row{margin-top:370px; height:350px;}
   .processing-sestion .body-row:before{width:100%; left:0; border-radius:0; background-size: 1000px auto}
   .processing-sestion .container{max-width:100%}
}

@media (min-width: 992px) and (max-width: 1199px) {

   .processing-sestion .head-row{padding-top:60px;}
   .processing-sestion .body-row{height:350px;}
   .processing-sestion .body-row:before{width:100%; left:0; border-radius:0; background-size: 1300px auto}
   .processing-sestion .container{max-width:100%}
}


/* Ai nên dùng */

.use-sestion{padding-top:80px;  }
.use-sestion h2{color:var(--color1); font-weight:900; text-transform:uppercase; text-align:center; font-size:35px;}
.use-sestion h3{font-weight:bold; font-size:22px; text-align:center}
.use-sestion ul{margin:40px 0 0 -10px; padding:0; width:calc(100% + 20px); float:left; list-style:none;}
.use-sestion ul li{width:calc(50% - 20px); margin:10px; float:left; position:relative; overflow:hidden; border-radius:15px;}
.use-sestion ul li:before{content:''; width:100%; height:100%; border-radius:15px; position:absolute; top:0; left:0; z-index:3; border:3px solid var(--color1)}
.use-sestion ul li .wrap-img{width:calc(50% - 20px); margin:20px; position:relative; float:left; z-index:4}
.use-sestion ul li .wrap-img img{width:100%; border-radius:10px; }
.use-sestion ul li .caption{width:50%; float:right; position:absolute; top:0; right:0; height:100%; background:rgba(0,0,0,.0); padding:30px; text-align:center; display:flex; justify-content:center; align-items:center;}
.use-sestion ul li .caption i{font-size:32px;  color:rgba(0,0,0,.7); width:70px; height:70px; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,.05); margin: 0 auto; border-radius:50%; }
.use-sestion ul li .caption h4{color:var(--color1); font-size:22px; font-weight:bold; text-transform:uppercase; padding-top:10px; width:100%; float:left; }
.use-sestion ul li .caption p{margin:0; padding:0; list-style:none; line-height:24px; padding-top:5px;}
.use-sestion ul li:nth-child(2) .wrap-img{float:right;}
.use-sestion ul li:nth-child(2) .caption{left:0;}
.use-sestion ul li:nth-child(3) .wrap-img{float:right;}
.use-sestion ul li:nth-child(3) .caption{left:0;}

@media (max-width: 767px) {
   .use-sestion{padding-top:50px;}
   .use-sestion h2{font-size:28px;}
   .use-sestion h3{font-size:20px;}
   .use-sestion ul{margin-top:20px; width:350px; position:relative; left:50%; margin-left:-175px; margin:0 0 0 -175px;}
   .use-sestion ul li{width:100%; float:left; margin:30px 0 0 0 ; border-radius:10px;}
   .use-sestion ul li:before{display:none;}
   .use-sestion ul li .wrap-img{width:100%; margin:0; overflow:hidden; height:300px; border-radius:10px;}
   .use-sestion ul li .caption{width:100%; position:relative; height:initial; background:none; padding: 0px 0 0 0; z-index:5;}
   .use-sestion ul li .caption i{margin-top:-35px; background:var(--color1); color:#fff; box-shadow: 0 0 0 5px #fff}
}

@media (min-width: 768px) and (max-width: 991px) {
   .use-sestion{padding-top:50px;}
   .use-sestion h2{font-size:28px;}
   .use-sestion h3{font-size:20px;}
   .use-sestion ul{width:100%; position:relative; margin-top:20px;}
    .use-sestion ul li .wrap-img{width:calc(100% - 40px); overflow:hidden; height:250px;}
    .use-sestion ul li .wrap-img img{object-fit:cover}
    .use-sestion ul li .caption{position:relative; height:auto; width:100%; padding:0 20px 20px 20px;}
    .use-sestion ul li .caption h4{padding-top:15px;}
}

@media (min-width: 992px) and (max-width: 1199px) {
    .use-sestion{padding-top:60px;}
    .use-sestion ul{width:800px; left:50%; margin-left:-400px; position:relative; margin-top:20px;}
    .use-sestion ul li .wrap-img{width:calc(100% - 40px); overflow:hidden; height:250px;}
    .use-sestion ul li .wrap-img img{object-fit:cover}
    .use-sestion ul li .caption{position:relative; height:auto; width:100%; padding:0 20px 20px 20px;}
    .use-sestion ul li .caption h4{padding-top:15px;}
}


/* Quy cách */

.pack-sestion{background:url(../images/ct-pack-bg.jpg) no-repeat center bottom; background-size:100% auto; overflow:initial; z-index:5; width:calc(100% - 40px); margin: 0 20px; border-radius:20px; margin-top:60px; }
.pack-sestion .inner{width:100%;  padding-top:100px; padding-bottom:50px; float:left; position:relative; }
.pack-sestion .ct-bottle{float:left; height:520px; margin-left:0px; position:relative; z-index:5;}
.pack-sestion .ct-box{float:left; position:absolute; bottom:180px; height:340px; left:200px;}
.pack-sestion .caption{position:absolute; right:0; bottom:0; background:var(--color1); color:#fff; width:380px; padding:30px; border-radius:15px 15px 0 0 }
.pack-sestion .caption h3{text-transform:uppercase; font-size:25px; display:block; text-align:center; padding-bottom:15px; padding-top:10px; font-weight:bold }
.pack-sestion .caption ul{margin:0; padding:25px 0 25px 0; list-style:none; width:100%; float:left; position:relative}
.pack-sestion .caption ul:before{content:''; width:100%; height:45px; background:url(../images/ct-title-frame-bottom-white.svg) no-repeat center; background-size:auto 100%; position:absolute; top:0; left:0; opacity:.5 }
.pack-sestion .caption ul:after{content:''; width:100%; height:45px; background:url(../images/ct-title-frame-top-white.svg) no-repeat center; background-size:auto 100%; position:absolute; bottom:0; left:0; opacity:.5; -webkit-transform: scaleX(-1);  transform: scaleX(-1); }
.pack-sestion .caption ul li{width:100%; float:left; position:relative; padding: 20px 0; text-align:center }
.pack-sestion .caption ul li:before{content:''; width:calc(100% - 20px); height:1px; background:#000; box-shadow: 0 1px #fff; position:absolute; left:10px; bottom:0; opacity:.2}
.pack-sestion .caption ul li b{font-weight:bold; width:100%; float:left; text-transform:uppercase; font-size:15px; letter-spacing:1px; color:#000; }
.pack-sestion .caption ul li h4{width:100%; float:left; position:relative; padding-top:10px; font-size:20px; margin:0; font-weight:bold;}
.pack-sestion .caption ul li .specifications{width:50%; float:left; position:relative; padding-top:10px;}
.pack-sestion .caption ul li .specifications label{margin:0; width:100%; float:left; }
.pack-sestion .caption ul li .specifications span{display:block; width:100%; float:left; margin-top:0px; position:relative; font-weight:bold; }
.pack-sestion .caption ul li .specifications:first-of-type:before{content:''; width:1px; height:40px; margin-top:-15px; background:#fff; position:absolute; top:50%; right:0; opacity:.5}
.pack-sestion .caption ul li p{width:100%; margin:0; padding:0; margin-top:5px; float:left; font-weight:500; display:none;}
.pack-sestion .caption ul li svg{width:100px; fill:#fff; margin-top:10px;}
.pack-sestion .caption ul li:last-child:before{display:none;}
.pack-sestion .caption .nav-agency{position:relative; top:100%;left:0; height:45px; width:100%; background:#000; color:#fff; text-decoration:none; padding: 0 25px; display:none; }
.pack-sestion .caption .nav-agency b{text-transform:uppercase; font-size:18px;}
.pack-sestion .caption .nav-agency span{display:block;}

@media (max-width: 767px) {
    .pack-sestion{background-size:1200px auto; background-position:-100px -70px; border-radius:10px; background:none; width:100%; left:0; margin:40px 0 0 0;}  
    .pack-sestion:before{content:''; background:url(../images/ct-pack-bg.jpg) no-repeat center bottom; position:absolute; top:0; left:0; height:500px;background-size:1200px auto; width:100%;}
    .pack-sestion .inner{padding-top:60px;}
    .pack-sestion .ct-bottle{height:380px; margin-left:0px; float:left}
    .pack-sestion .ct-box{height:240px; left:50px; top:140px; }
    .pack-sestion .caption{width:340px; margin-left:-170px; right:initial; position:relative; bottom:initial; clear:both; left:50%; float:left; margin-top:0px; border-radius:10px;}
    .pack-sestion .caption h3{font-size:23px;}
    .pack-sestion .caption ul:before,
    .pack-sestion .caption ul:after{height:48px;}
}

@media (min-width: 768px) and (max-width: 991px) {
    .pack-sestion{background-size:1500px auto; background-position-x:-100px}  
    .pack-sestion .inner{padding-top:150px;}
    .pack-sestion .ct-bottle{height:400px; margin-left:0px;}
    .pack-sestion .ct-box{height:220px; left:0;}
    .pack-sestion .caption{width:350px;}
    .pack-sestion .caption h3{font-size:23px;}
    .pack-sestion .caption ul:before,
    .pack-sestion .caption ul:after{height:48px;}
}

@media (min-width: 992px) and (max-width: 1199px) {
    .pack-sestion{border-radius:15px; background-size:cover}  
    .pack-sestion .inner{padding-top:100px;}
    .pack-sestion .ct-bottle{height:500px; margin-left:0px;}
    .pack-sestion .ct-box{left:100px;}
    .pack-sestion .caption{width:370px;}
    .pack-sestion .caption h3{font-size:23px;}
    .pack-sestion .caption ul:before,
    .pack-sestion .caption ul:after{height:48px;}
}

@media (min-width: 1200px) and (max-width: 1399px) {
    .pack-sestion{background-size:cover; border-radius:15px;}  
    .pack-sestion .inner{padding-top:70px;}
    .pack-sestion .ct-bottle{height:500px; margin-left:100px;}
    .pack-sestion .caption{width:370px;}
    .pack-sestion .caption h3{font-size:23px;}
    .pack-sestion .caption ul:before,
    .pack-sestion .caption ul:after{height:48px;}
}

@media (min-width: 1400px) and (max-width: 1999px) {
    .pack-sestion{background-size:2000px auto}  
}

/* Khách hàng nói gì  */

.review-sestion{}
.review-sestion .inner{width:100%; float:left; position:relative;}
.review-sestion .col-left{width:400px; height:100%; float:left; padding-right:50px;background:rgba(0,0,0,.0); position:absolute; top:0; left:0px; display:flex; align-items:center}
.review-sestion .col-left:after{content:''; width:1000px; height:100%; position:absolute; right:100%; top:0; background:rgba(0,0,0,.05); display:block; display:none;}
.review-sestion .col-left h2{color:#000; font-weight:bold; text-transform:uppercase; text-align:left; font-size:17px;}
.review-sestion .col-left h3{font-weight:bold; font-size:40px; text-align:left; font-weight:900; color:var(--color1)}
.review-sestion .col-right{width:calc(100% - 400px); float:right; position:relative; padding: 60px 0 60px 60px;}


.slider-review{width:100%; float:left; position:relative; }
.slider-review .item{width:100%; float:left; position:relative;}
.slider-review .item .wrap-star{}
.slider-review .item .wrap-star i{font-size:16px; color:var(--color1); margin-right:8px;}
.slider-review .item .comment{width:100%; float:left;margin-top:20px; margin-bottom:30px;}
.slider-review .item .comment p{font-size:21px; font-weight:300; line-height:32px; width:100%; float:left; margin:0; padding-right:80px;}
.slider-review .item .comment .quote{width:100px; position:absolute; top:-10px; right:0; opacity:.1}
.slider-review .item .comment .quote img{width:100%;}
.slider-review .item .author{}
.slider-review .item .author b{font-weight:bold; font-size:20px; color:var(--color1)}
.slider-review .item .author span:before{content:'-'; padding: 0 10px;}
.slider-review .owl-controls{margin:0; position:absolute; right:0; bottom:3px; background:#fff}
.slider-review .owl-controls .owl-page span{opacity:1; border-radius:0; background:#000; width:10px; height:10px; margin: 0 0 0 10px; opacity:.5; transition:.3s;}
.slider-review .owl-controls .owl-page.active span{background:var(--color1);  opacity:1;}

@media (max-width: 767px) {
    .review-sestion .col-left{background:#fff; display:block; width:100%; padding-top:10px; height:initial; position:relative; padding-right:0;}
    .review-sestion .col-left h3{font-size:28px; text-transform:uppercase; padding-top:5px;}
    .review-sestion .col-left:after{display:none;}
    .review-sestion .col-right{width:100%; padding:30px 0; float:left;}
    .slider-review .item .comment{margin-bottom:10px;}
    .slider-review .item .comment p{font-size:18px; font-weight:normal; padding-right:40px;}
    .slider-review .item .comment .quote{width:70px; top:-10px;}
}

@media (min-width: 768px) and (max-width: 991px) {
    .review-sestion .col-left{background:#fff; display:block; width:100%; padding-top:50px; height:initial; position:relative; padding-right:0;}
    .review-sestion .col-left h3{font-size:28px; text-transform:uppercase; padding-top:5px;}
    .review-sestion .col-left:after{display:none;}
    .review-sestion .col-right{width:100%; padding:30px 0; float:left;}
}

/* Đối tác */

.partner-sestion{}
.partner-sestion .inner{width:100%; height:320px; float:left; border-radius:20px; background:url(../images/ct-partner-bg.jpg) no-repeat 0px bottom; background-size:cover}
.partner-sestion .inner .bottle{height:290px; left:550px; position:absolute; bottom:5px;}
.partner-sestion .inner .caption{ position:relative; float:right; text-align:center; padding: 60px 50px 0 0}
.partner-sestion .inner .caption h3{text-transform:uppercase; margin:0; font-weight:bold; font-size:28px;}
.partner-sestion .inner .caption h4{margin:0; font-size:35px; color:var(--color1); font-weight:bold; padding-top:5px;}
.partner-sestion .inner .caption p{width:100%; font-size:20px; font-weight:bold; padding-top:10px; padding-bottom:10px;}
.partner-sestion .inner .caption a{display:block; background:var(--color1); height:50px; line-height:50px; text-decoration:none; text-align:center; width:250px; margin: 0 auto; border-radius:7px; text-transform:uppercase; color:#fff; font-weight:bold; font-size:20px; box-shadow:inset 0 0 rgba(0,0,0,0); transition:.3s;}
.partner-sestion .inner .caption a:hover{box-shadow:inset 0 50px rgba(0,0,0,.2)}

@media (max-width: 767px) {
    .partner-sestion{overflow:initial; margin-bottom:240px; margin-top:20px;}
    .partner-sestion .inner{border-radius:15px;}
    .partner-sestion .inner .bottle{z-index:5; left:initial; right:40px;}
    .partner-sestion .inner .caption{padding:0; width:350px; background:#fff; position:absolute; margin:-50px 0 0 -175px ; padding:50px 20px 20px 20px; left:50%; height:310px; border-radius:10px; top:100%; box-shadow: 0 10px 20px rgba(0,0,0,.1)}
    .partner-sestion .inner .caption h3{font-size:22px;}
    .partner-sestion .inner .caption h4{font-size:30px;}
    .partner-sestion .inner .caption p{font-size:18px; margin:0; padding-bottom:15px;}
}

@media (min-width: 768px) and (max-width: 991px) {
    .partner-sestion{overflow:initial; margin-bottom:170px; margin-top:20px;}
    .partner-sestion .inner{border-radius:15px;}
    .partner-sestion .inner .bottle{z-index:5; left:initial; right:80px;}
    .partner-sestion .inner .caption{padding:0; width:calc(100% - 100px); background:#fff; position:absolute; margin:-70px 0 0 ; padding-top:30px; left:50px; height:230px; border-radius:10px; top:100%; box-shadow: 0 10px 20px rgba(0,0,0,.1)}
    .partner-sestion .inner .caption h3{font-size:22px;}
    .partner-sestion .inner .caption h4{font-size:30px;}
    .partner-sestion .inner .caption p{font-size:18px; margin:0; padding-bottom:15px;}
}

@media (min-width: 991px) and (max-width: 1199px) {
   .partner-sestion .inner{background-position-x:-100px; border-radius:15px;}
   .partner-sestion .inner .bottle{left:200px;}
}

@media (min-width: 1200px) and (max-width: 1399px) {
    
    .partner-sestion .inner .bottle{left:380px;}
}

/* Footer */
.footer-sestion{background:#000; padding: 0 0 0px 0 ; margin-top:50px; width:calc(100% - 40px); margin-left:20px; border-radius:20px 20px 0 0}
.footer-sestion:before{content:''; width:100%; height:100%; background:url(../images/ct-pattern-white-bg.svg) repeat center 0; position:absolute; top:0; left:0; opacity:.02 }
.footer-sestion .inner{width:100%; position:relative; float:left; z-index:1;}
.footer-sestion .caption{width:400px; position:relative; background:var(--color1); float:left; z-index:13; border-radius: 0 0 15px 15px;}
.footer-sestion .caption a{width:100%; height:100%; display:block; position:absolute; top:0; left:0; z-index:3;}
.footer-sestion .caption h4{font-size:17px; margin:0; text-transform:uppercase; padding: 15px 20px; color:#fff; background:rgba(0,0,0,.1); text-align:center; box-shadow: inset 0 -1px rgba(0,0,0,.03); font-weight:bold}
.footer-sestion .caption .logo{width:200px; height:160px; display:block; display:flex; align-items:center; padding:20px 40px; float:left; position:relative;}
.footer-sestion .caption .logo:before{content: ''; height: calc(100% - 60px); width: 1px;background: #000; box-shadow:1px 0 #fff; position: absolute; right: 10px; top: 30px; opacity: .3;}
.footer-sestion .caption .logo svg{fill:#fff;}
.footer-sestion .caption .qr-code{width:200px;  float:left; padding:20px 40px;}
.footer-sestion .caption .qr-code svg{width:100%; fill:#fff; }
.footer-sestion .contact-info{width:calc(100% - 400px); float:right; position:relative; display:block; display:flex; padding: 40px 0 0 50px;}
.footer-sestion .contact-info ul{margin:0; padding:0; list-style:none;}
.footer-sestion .contact-info ul li{color:#fff; width:100%; float:left; position:relative; margin-top:10px; font-size:17px}
.footer-sestion .contact-info ul li.title{font-size:20px; font-weight:bold; padding-bottom:5px;} 
.footer-sestion .contact-info ul li b{opacity:.7; font-weight:500;}
.footer-sestion .contact-info ul li b:after{content:':'; font-weight:normal; padding: 0 10px 0 2px;}
.footer-sestion .row-bottom{width:100%; float:left; position:relative; color:#fff; padding: 25px 0; border-top:1px solid rgba(255,255,255,.1); margin-top:-1px;}
.footer-sestion .row-bottom .copy{float:right; text-align:right; font-size:15px;}
.footer-sestion .row-bottom .copy span{display:block;}
.footer-sestion .row-bottom .copy span:last-child{padding-top:4px; font-size:14px; opacity:.8; font-weight:300}
.footer-sestion .row-bottom ul{margin:0; padding:0; list-style:none; float:left; display:flex;}
.footer-sestion .row-bottom ul:before{content:'Lý Phong trên'; line-height:40px; padding-right:20px; opacity:.7; font-size:16px;}
.footer-sestion .row-bottom ul li{margin-right:10px;}
.footer-sestion .row-bottom ul li a{text-decoration:none; width:40px; height:40px; text-align:center; color:#fff; border:1px solid rgba(255,255,255,.2); display:flex; align-items:center; justify-content:center; transition:.3s; border-radius:5px;}
.footer-sestion .row-bottom ul li a:hover{color:#fff; background:var(--color1)}

@media (max-width: 767px) {
    .footer-sestion{padding-bottom:60px;}
    .footer-sestion .caption{left:50%; margin-left:-170px; width:340px}
    .footer-sestion .caption h4{padding: 10px 0; font-size:14px;}
    .footer-sestion .caption .logo{width:170px; height:130px;}
    .footer-sestion .caption .qr-code{width:170px;}
    .footer-sestion .contact-info{width:340px; padding:20px 0 0 0; left:50%; margin-left:-170px; float:left; display:block; clear:both;}
    .footer-sestion .contact-info ul{padding: 0 0 20px 0; float:left;}
    .footer-sestion .contact-info ul li.title{font-size:18px;}
    .footer-sestion .row-bottom{width:340px; left:50%; margin-left:-170px; clear:both; text-align:center}
    .footer-sestion .row-bottom ul{display:block; margin: 0 auto; display:block; float:initial; position:relative; margin-top:20px; }
    .footer-sestion .row-bottom ul:before{width:100%; text-align:center;position:absolute; left:0; bottom:100%; padding-right:0; opacity:1; font-size:14px;}
    .footer-sestion .row-bottom ul li{margin: 0 5px; display:inline-block}
    .footer-sestion .row-bottom .copy{width:100%; text-align:center; padding-top:15px;}
}

@media (min-width: 768px) and (max-width: 991px) {
    .footer-sestion .caption{left:50%; margin-left:-170px; width:340px}
    .footer-sestion .caption h4{padding: 10px 0; font-size:14px;}
    .footer-sestion .caption .logo{width:170px; height:130px;}
    .footer-sestion .caption .qr-code{width:170px;}
    .footer-sestion .contact-info{width:100%; padding:20px 0;}
    .footer-sestion .contact-info ul li.title{font-size:20px;}
}


/* Popup Đăng ký đại lý */
.open-madalRegister{overflow-y:hidden}
.modal-register{width:100%; height:100%; position:fixed; z-index:105; background:#eed9c0 url(../images/ct-modal-bg.jpg) no-repeat right center; background-size:auto 100%; top:0; right:0; opacity:0; visibility:hidden;  }
.modal-register iframe{height:100%!important; width:100%!important; }
.modal-register .nav-colose{position:absolute; top:20px; right:30px; z-index:5; background:var(--color1); font-size:15px; line-height:36px; padding: 0 15px; color:#fff; text-decoration:none; border-radius:5px; font-weight:500;}

.open-madalRegister .modal-register{opacity:1; visibility:initial}
@media (max-width: 991px) {
    .modal-register{background:#fff;}

}

/* Mobile bar */
.mobile-bar{width:100%; height:70px; background:#fff; position:fixed; z-index:50; left:0; bottom:0; box-shadow: 0 0 20px rgba(0,0,0,.1), 0 -1px rgba(0,0,0,.07); display:none; padding: 0 5px; transition:.3s; bottom:-60px; opacity:0; }
.mobile-bar .col-nav{width:50%; padding: 10px 5px;}
.mobile-bar .col-nav a{width:100%; text-decoration:none; background:var(--color1); display:block;height:50px; line-height:50px; border-radius:4px; padding: 0 15px; color:#fff; text-decoration:none; font-weight:500; position:relative; box-shadow: 0 0 0 1px rgba(255,255,255,.5); transition:.3s;}
.mobile-bar .col-nav a:before{font-family: "Font Awesome 5"; font-weight: 900; content: "\f0da"; font-size:16px; position:absolute; top:0; right:15px;}
.mobile-bar .col-nav span{display:none;}

@media (max-width: 767px) {
    .mobile-bar{display:flex;}
    .mobile-bar.is-view{opacity:1; visibility:initial; bottom:0;}
}


@media (min-width: 1400px) {
    .container{max-width:1320px}
}


.image-anime{ overflow: hidden;}
.image-anime:after {content: "";position: absolute; width: 200%; height: 0%; left: 50%; top: 50%; background-color: rgba(255, 255, 255, .3);transform: translate(-50%, -50%) rotate(-45deg); z-index: 1;}
.image-anime:hover:after{ height: 250%; transition: all 500ms linear; background-color: transparent;}