.serviceDetail-page{width:100%; float:left; position:relative; padding-top:0px;}
.serviceDetail-page .left-detail-info{width:calc(100% - 360px); float:right; position:relative; padding: 0px 0px 20px 0;}
.serviceDetail-page .left-detail-info .main-info{width:100%; float:left; position:relative}
.serviceDetail-page .left-detail-info .main-info .main-head{width:100%; float:left; position:relative; margin-bottom:20px; border-bottom:1px solid var(--color-border); padding-bottom:25px;}
.serviceDetail-page .left-detail-info .main-info .main-head h1{margin:0 0 3px 0; padding:0; font-weight:bold; font-size:25px; color:#000; width:100%; float:left;}
.serviceDetail-page .left-detail-info .main-info .main-head .wrap-attr{width:100%; float:left; position:relative; margin: 10px 0 0px 0; top:0; left:0; color:#000}
.serviceDetail-page .left-detail-info .main-info .main-head .wrap-attr .ele{display:block; float:left; position:relative; margin-right:30px; font-size:13px;}
.serviceDetail-page .left-detail-info .main-info .main-head .wrap-attr .ele b{padding: 0 3px; font-size:14px;}
.serviceDetail-page .left-detail-info .main-info .main-head .wrap-attr .ele span{opacity:.75}
.serviceDetail-page .left-detail-info .main-info .main-head .wrap-attr .ele:after{content:''; width:5px; height:5px; border-radius:50%; background:var(--color2); position:absolute; right:-18px; top:8px;}
.serviceDetail-page .left-detail-info .main-info .main-head .wrap-attr .ele:last-of-type{margin-right:0;}
.serviceDetail-page .left-detail-info .main-info .main-head .wrap-attr .ele:last-of-type:after{display:none;}
.serviceDetail-page .left-detail-info .main-info .main-head .utiliLg{height:40px; margin-bottom:15px;}
.serviceDetail-page .left-detail-info .main-info .main-head .utiliLg .link-main{height:40px;}
.serviceDetail-page .left-detail-info .main-info .main-head .utiliLg .link-main i,
.serviceDetail-page .left-detail-info .main-info .main-head .utiliLg .link-main span{line-height:40px;}
.serviceDetail-page .left-detail-info .main-info .main-body{width:100%; float:left; position:relative;}
.serviceDetail-page .left-detail-info .main-info .main-body .col-left{width:70px; float:left; position:relative; display:none;}
.serviceDetail-page .left-detail-info .main-info .main-body .col-right{width:calc(100% - 0px); float:left; position:relative;  overflow:hidden; line-height:26px; font-size:15px}
.serviceDetail-page .left-detail-info .main-info .main-body .col-right img{ max-width:100%; height:initial!important; display:block; margin: 20px auto; border-radius:7px 7px 0 0;}
.serviceDetail-page .left-detail-info .main-info .main-body .col-right .detail-info{width:100%; float:left; position:relative; font-size:16px; line-height:30px;}
.serviceDetail-page .left-detail-info .main-info .main-body .col-right .detail-info h4{font-size:18px; line-height:30px}
.serviceDetail-page .left-detail-info .main-info .main-body .col-right .detail-info h3{font-size:20px; line-height:30px}
.serviceDetail-page .left-detail-info .main-info .main-body .col-right .detail-info h2{font-size:22px; line-height:30px}
.serviceDetail-page .left-detail-info .main-info .main-body .col-right .detail-info h1{font-size:25px; line-height:30px}

.socialBottom{width:100%; float:left; position:relative; margin-top:30px;}
.socialBottom .socialShare{display:block; font-size:17px; font-weight:500; color:#000; padding-bottom:15px;}
.socialBottom ul{margin: 0 -5px; padding:0; list-style:none; clear:both;}
.socialBottom ul li{padding:0 5px; display:block; float:left; position:relative; width:20%; }
.socialBottom ul li a{display:flex; align-items:center; justify-content:center; border-radius:5px; height:40px; padding: 0 10px; text-decoration:none; color:#fff; text-align:center; font-size:16px; transition:.3s; box-shadow: inset 0 0 rgba(0,0,0,0)}
.socialBottom ul li a:hover{box-shadow:inset 0 40px rgba(0,0,0,.15)}
.socialBottom ul li a i{font-size:20px;}
.socialBottom ul li a span{padding-left:8px; font-size:14px; font-weight:500; display:inline-block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.socialBottom ul li a.navFacebook{background:#1873eb}
.socialBottom ul li a.navTwitter{background:#1c9cea}
.socialBottom ul li a.navTelegram{background:#32afed}
.socialBottom ul li a.navWhatsapp{background:#00ba3a}
.socialBottom ul li a.navPinterest{background:#e60023}

.wrap-tags{width:100%; float:left; position:relative; margin-top:40px; margin-bottom:20px;}
.wrap-tags .title-tags{display:block; text-transform:uppercase; font-weight:900; color:var(--color2); margin-bottom:5px;}
.wrap-tags .title-tags:before{font-family: "Font Awesome 5"; font-weight: 900; font-size:16px; margin-right:10px; content: "\f02c";}
.wrap-tags a{line-height:32px; height:32px; border:1px solid var(--border-color); padding: 0 15px; display:inline-block; margin: 5px 5px 0 0; border-radius:5px; transition:.3s;}
.wrap-tags a:hover{color:var(--color2)}


.serviceDetail-page .right-detail-info{width:320px; padding:0px 0px 0px 0px; position:relative; float:left;}
.serviceDetail-page .right-detail-info .group-catalog{width:100%; float:left; position:relative; margin-bottom:20px;}
.serviceDetail-page .right-detail-info .group-catalog .title{display:block; font-weight:900; color:#000; font-size:16px; padding-bottom:10px; text-transform:uppercase; letter-spacing:1px; border-bottom:1px solid var(--border-color); margin-bottom:15px; position:relative;}
.serviceDetail-page .right-detail-info .group-catalog .title:before{content:''; width:12px; height:12px; background:#fff; transform:rotate(45deg); display:block; position:absolute; left:20px; bottom:-6px; border-bottom:1px solid var(--border-color); border-right:1px solid var(--border-color)}
.serviceDetail-page .right-detail-info .group-catalog ul{margin:0; padding:0; list-style:none; width:100%;}
.serviceDetail-page .right-detail-info .group-catalog ul li{width:100%; float:left; position:relative;}
.serviceDetail-page .right-detail-info .group-catalog ul li a{text-decoration:none; color:#000; font-size:16px; position:relative; padding:6px 20px 6px 25px; display:block; font-weight:500; }
.serviceDetail-page .right-detail-info .group-catalog ul li a:before{content:''; width:12px; height:12px; margin-top:-7px; border:3px solid rgba(0,0,0,.15); border-radius:0px; display:block; position:absolute; top:50%; left:0;}
.serviceDetail-page .right-detail-info .group-catalog ul li a:hover,
.serviceDetail-page .right-detail-info .group-catalog ul li a.current{color:var(--color2)}
.serviceDetail-page .right-detail-info .group-catalog ul li a.current:before{border-color:var(--color2)}

.serviceDetail-page .right-detail-info .title-group{display:block; width:100%; float:left; margin-top:20px; font-weight:900; color:#000; font-size:16px; padding-bottom:10px; text-transform:uppercase; letter-spacing:1px; border-bottom:1px solid var(--border-color); margin-bottom:15px; position:relative;}
.serviceDetail-page .right-detail-info .title-group:before{content:''; width:12px; height:12px; background:#fff; transform:rotate(45deg); display:block; position:absolute; left:20px; bottom:-6px; border-bottom:1px solid var(--border-color); border-right:1px solid var(--border-color)}
.serviceDetail-page .right-detail-info .title-group.red{color:var(--color3)}

.serviceDetail-page .right-detail-info ul.listItemSm{width:100%; float:left; position:relative; margin:0 0; padding:0; list-style:none;}
.serviceDetail-page .right-detail-info ul.listItemSm li{position:relative; z-index:2; width:100%; float:left; padding: 15px 0; border-top:1px solid var(--border-color)}
.serviceDetail-page .right-detail-info ul.listItemSm li .wrap-img{position:relative; width: 110px; float:left; margin: 0 15px 0px 0;}
.serviceDetail-page .right-detail-info ul.listItemSm li .wrap-img:before{content:''; display:block; padding-bottom:67%;}
.serviceDetail-page .right-detail-info ul.listItemSm li .wrap-img .link-img{position:absolute; top:0; left:0; overflow:hidden; width:100%; height:100%; border-radius:7px;}
.serviceDetail-page .right-detail-info ul.listItemSm li .wrap-img .link-img img{object-fit:cover; width: inherit; height: inherit;}
.serviceDetail-page .right-detail-info ul.listItemSm li .name{text-decoration:none; color:#000; transition:.3s; }
.serviceDetail-page .right-detail-info ul.listItemSm li .name:hover{color:var(--color2)}
.serviceDetail-page .right-detail-info ul.listItemSm li .name h3{font-size:15px; font-weight:500; line-height:23px; margin-top:-5px;}
.serviceDetail-page .right-detail-info ul.listItemSm li p{display:none;}
.serviceDetail-page .right-detail-info ul.listItemSm li:first-child{padding-right:0; min-height:initial; margin-bottom:5px; border:none;}
.serviceDetail-page .right-detail-info ul.listItemSm li:first-child .wrap-img{position:relative!important; width:100%; margin-bottom:15px; overflow:hidden; border-radius:7px;}
.serviceDetail-page .right-detail-info ul.listItemSm li:first-child .wrap-img .link-img{}
.serviceDetail-page .right-detail-info ul.listItemSm li:first-child .utiliSm{}
.serviceDetail-page .right-detail-info ul.listItemSm li:first-child h3{font-size:16px; padding-top:15px;}
.serviceDetail-page .right-detail-info ul.listItemSm li:first-child p{display:block; line-height:24px; margin:0px 0 0 0; padding:0; display:block; float:left; }
.serviceDetail-page .right-detail-info ul.listItemSm li:nth-child(n+6){display:none;}


ul.list-hotNews{width:100%; float:left; position:relative; margin:0; padding:0; list-style:none; clear:both;}
ul.list-hotNews li{width:100%; float:left; position:relative; margin-top:15px; padding:15px 15px 60px 15px; border:1px solid var(--color-border); border-radius:7px;}
ul.list-hotNews li .wrap-img{width:100px; float:left; position:relative;} 
ul.list-hotNews li .wrap-img:before{content:''; display:block; padding-top:66.66666666666%;}
ul.list-hotNews li .wrap-img a{width:100%; height:100%; display:block; position:absolute; overflow:hidden; border-radius:5px; top:0; left:0; text-align:center;}
ul.list-hotNews li .wrap-img a img{object-fit:cover; width:100%; height:100%;}
ul.list-hotNews li .wrap-info{width:calc(100% - 100px); float:right;padding-left:15px;}
ul.list-hotNews li .wrap-info h3{margin:0 0 0; font-size:15px; font-weight:bold; line-height:22px; padding:0; float:left; clear:both ;display:block; width:100%; }
ul.list-hotNews li .wrap-info h3 a{text-decoration:none; color:#000; transition:.3s; -webkit-line-clamp: 3; -webkit-box-orient: vertical; white-space: normal;  overflow: hidden; text-overflow: ellipsis; display: -webkit-box;}
ul.list-hotNews li .wrap-info h3 a:hover{color:var(--color2)}
ul.list-hotNews li .wrap-info .wrap-attr{width:calc(100% - 30px); float:left; position:relative; margin: 10px 0 0px 0; bottom:0; left:0; color:#000; position:absolute; left:15px; bottom:15px; background:rgba(0,0,0,.05); border-radius:5px; padding:5px 10px;}
ul.list-hotNews li .wrap-info .wrap-attr .ele{display:block; float:left; position:relative; margin-right:30px; font-size:13px;}
ul.list-hotNews li .wrap-info .wrap-attr .ele b{padding: 0 3px; font-size:14px;}
ul.list-hotNews li .wrap-info .wrap-attr .ele span{opacity:.75}
ul.list-hotNews li .wrap-info .wrap-attr .ele:first-child:after{content:''; width:5px; height:5px; border-radius:50%; background:var(--color2); position:absolute; right:-18px; top:8px;}
ul.list-hotNews li .wrap-info .wrap-attr .ele:last-of-type{margin-right:0;}
ul.list-hotNews li .wrap-info p{width:100%; margin:0; padding:0; line-height:24px; float:left; padding-top:10px; color:#000; display:none;}

ul.list-hotNews li:first-child{padding: 0; border:none;}
ul.list-hotNews li:first-child .wrap-img{width:100%;}
ul.list-hotNews li:first-child .wrap-img a{border-radius:7px;}
ul.list-hotNews li:first-child .wrap-info{width:100%; padding-left:0; padding-top:15px;}
ul.list-hotNews li:first-child .wrap-info h3{font-size:18px;}
ul.list-hotNews li:first-child .wrap-attr{position:relative; width:100%; padding:0; left:0; bottom:0; background:none;}
ul.list-hotNews li:first-child .wrap-info p{-webkit-line-clamp: 3; -webkit-box-orient: vertical; white-space: normal;  overflow: hidden; text-overflow: ellipsis; display: -webkit-box;}


.wrap-slider-info-more{width:100%; float:left; display:block; position:relative; margin-top:40px;}
.wrap-slider-info-more .title{width:100%; float:left; position:relative;}
.wrap-slider-info-more .title span{font-size:16px; font-weight:normal; padding-bottom:3px; display:block; color:rgba(0,0,0,.85)}
.wrap-slider-info-more .title label{text-transform:uppercase; font-size:18px; font-weight:900; margin:0;  color:#000; clear:left; display:block;}

.thumb-info-more{margin:-10px 0 0 -10px; padding:0; list-style:none; clear:both; width:calc(100% + 20px); float:left; }
.thumb-info-more li{padding:0 10px; position:relative; margin-top:30px; }
.thumb-info-more li:nth-child(n+7){display:none;}
.thumb-info-more li .inner{width:100%; float:left; position:relative; transition:.3s; }
.thumb-info-more li .wrap-img{width:100%; float:left; position:relative;}
.thumb-info-more li .wrap-img:before{content:''; padding-top:67%; display:block;}
.thumb-info-more li .wrap-img a{width:100%; height:100%; position:absolute; top:0; left:0; display:block; overflow:hidden; border-radius:7px; text-align:center;}
.thumb-info-more li .wrap-img a img{object-fit:cover;}
.thumb-info-more li .wrap-info{width:100%; float:left; position:relative;}
.thumb-info-more li .wrap-info h3{margin:0; font-size:16px; font-weight:500; line-height:22px;}
.thumb-info-more li .wrap-info h3 a{text-decoration:none; color:#000; display:block; width:100%; float:left; margin-top:15px; transition:.3s; }
.thumb-info-more li .wrap-info h3 a:hover{color:var(--color2)}
.thumb-info-more li .wrap-info p{width:100%; margin:0; padding:0; line-height:22px; float:left; padding-top:10px; color:#000; font-size:15px; -webkit-line-clamp: 3; -webkit-box-orient: vertical; white-space: normal;  overflow: hidden; text-overflow: ellipsis; display: -webkit-box;}
.thumb-info-more li .wrap-info .wrap-attr{width:100%; float:left; position:relative; margin: 10px 0 0px 0; bottom:0; left:0; color:#000;}
.thumb-info-more li .wrap-info .wrap-attr .ele{display:block; float:left; position:relative; margin-right:30px; font-size:13px;}
.thumb-info-more li .wrap-info .wrap-attr .ele b{padding: 0 3px; font-size:14px;}
.thumb-info-more li .wrap-info .wrap-attr .ele span{opacity:.75}
.thumb-info-more li .wrap-info .wrap-attr .ele:first-child:after{content:''; width:5px; height:5px; border-radius:50%; background:var(--color2); position:absolute; right:-18px; top:8px;}
.thumb-info-more li .wrap-info .wrap-attr .ele:last-of-type{margin-right:0;}

@media (max-width:767px) {
    .thumb-info-more{width:100%; margin:0px 0 20px 0;}
    .thumb-info-more li{border-bottom:1px solid var(--color-border); padding:20px 0; margin:0;}
    .thumb-info-more li:last-child{padding-bottom:0; border:none;}
    .thumb-info-more li .inner{ margin:0; box-shadow:none!important; padding:0 0 45px 0;}
    .thumb-info-more li .wrap-img{width:130px; margin: 0 15px 0px 0; float:left;}
    .thumb-info-more li .wrap-info{width:initial; float:initial; position:initial!important}
    .thumb-info-more li h3 a{width:inherit!important; display:inherit!important; float:initial!important; margin:0!important; padding-bottom:10px; }
    .thumb-info-more li p{width:initial!important;  float:initial!important; margin-top:0; padding-top:10px; white-space:initial; overflow:initial!important; display:inline!important}
    .thumb-info-more li .wrap-attr{width:100%; position:absolute!important; left:0; bottom:0; background:rgba(0,0,0,.05); border-radius:5px; padding: 5px 10px;}
}












@media (max-width:991px) {
    .serviceDetail-page{margin-bottom:0;}
    .serviceDetail-page .left-detail-info{width:100%; float:left; padding:10px 0 0 0;}
    .serviceDetail-page .left-detail-info .main-info .main-body .col-left{width:100%; float:left; margin-bottom:25px;}
    .serviceDetail-page .left-detail-info .main-info .main-body .col-right{width:100%; float:left;}
    .serviceDetail-page .left-detail-info .main-info .main-head{margin-bottom:15px;}
    .serviceDetail-page .right-detail-info{display:none;}

    ul.listSocial li{width:50px; float:left; margin:0 10px 0 0;}
}

/* Comment */
.wrap-comment{width:100%; float:left; position:relative; margin-top:30px;}
.wrap-comment .total-comment{display:block; font-weight:bold; font-size:18px; color:rgba(0,0,0,.85)}
.wrap-comment .wrap-write-comment{width:100%; float:left; position:relative; border:1px solid rgba(0,0,0,.1); border-radius:5px; margin-top:5px; background:#fff;}
.wrap-comment .wrap-write-comment .input-comment{width:100%; border:none; font-size:14px; height:100px; background:none; padding:8px 10px; resize:none; background:rgba(0,0,0,.015); border-radius:5px 5px 0 0; transition:.3s; overflow-y:auto;}
.wrap-comment .wrap-write-comment .input-comment:focus{outline:none; background:#fff;}
.wrap-comment .wrap-write-comment .foot-write{width:100%; float:left; position:relative; border-top:1px solid rgba(0,0,0,.1); padding: 5px 10px; transition:.3s;}
.wrap-comment .wrap-write-comment .foot-write a.link{float:left; line-height:32px; text-decoration:none; color:rgba(0,0,0,.75)}
.wrap-comment .wrap-write-comment .foot-write a.link:hover{color:var(--color1);}
.wrap-comment .wrap-write-comment .foot-write a.send{line-height:30px; height:32px; padding: 0 10px; border-radius:4px; color:#fff; text-decoration:none; background:rgba(0,0,0,.75); float:right; transition:.3s;}
.wrap-comment .wrap-write-comment .foot-write a.send:hover{background:var(--color1)}
.wrap-comment .list-comment{width:100%; float:left; position:relative; margin:20px 0;}
.wrap-comment .list-comment .comment_ask{width:100%; margin:15px 0 0 0; padding:0; float:left; position:relative;} 
.wrap-comment .list-comment .comment_ask .name{display:block;}
.wrap-comment .list-comment .comment_ask .name span{line-height:30px; font-size:14px; font-weight:bold; color:rgba(0,0,0,.8); text-transform:capitalize; display:inline-block;}
.wrap-comment .list-comment .comment_ask .name .label-admin{display:inline-block; font-size:9px; text-transform:uppercase; margin-left:10px; padding: 0 5px; line-height:20px; height:17px; color:#fff; background:var(--color2); border-radius:3px; }
.wrap-comment .list-comment .comment_ask .name .avatar{width:30px; height:30px; border-radius:3px; overflow:hidden; margin-right:5px; float:left;}
.wrap-comment .list-comment .comment_ask .name .avatar img{width: inherit; height: inherit;object-fit: cover;}
.wrap-comment .list-comment .comment_ask .name .textavatar{display:table; background:rgba(0,0,0,.1); float:left; margin-right:5px; border-radius:3px;}
.wrap-comment .list-comment .comment_ask .name .textavatar abbr{cursor:default; text-decoration:none; border-bottom:none; font-weight:bold; color:rgba(0,0,0,.85); display:table-cell; text-align:center; vertical-align:middle; text-transform:uppercase; }
.wrap-comment .list-comment .comment_ask .infocom_ask{width:100%; float:left; position:relative; padding-left:35px; font-size:14px; padding-top:3px; margin-bottom:10px;}
.wrap-comment .list-comment .comment_ask .relate-ask{width:100%; float:left; position:relative; padding-left:35px; padding-top:2px; }
.wrap-comment .list-comment .comment_ask .relate-ask .btn-reply{text-decoration:none; color:var(--color1); float:left; transition:.3s; font-weight:500; text-decoration:none; padding-right:10px; margin-right:10px; position:relative;}
.wrap-comment .list-comment .comment_ask .relate-ask .btn-reply:before{font-family: "Font Awesome 5"; font-weight: 900; font-size:14px; content:"\f3e5"; margin-right:3px;}
.wrap-comment .list-comment .comment_ask .relate-ask .btn-reply:hover{text-decoration:underline;}
.wrap-comment .list-comment .comment_ask .relate-ask .btn-reply:after{content:''; width:1px; height:12px; background:rgba(0,0,0,.3); position:absolute; top:5px; right:0;}
.wrap-comment .list-comment .comment_ask .relate-ask .date-ask{float:left; opacity:.75; position:relative;}
.wrap-comment .list-comment .comment_reply{width:calc(100% - 35px); float:left; position:relative; margin-left:35px; background:rgba(0,0,0,.06); padding:0 10px 10px 10px; margin-top:15px; border-radius:4px;}
.wrap-comment .list-comment .comment_reply:before{content:''; border-bottom: 8px solid rgba(0,0,0,.06); border-left:10px solid transparent; border-right:10px solid transparent; bottom:100%; left:10px; position:absolute;}
.wrap-comment .list-comment .comment_reply .wrap-write-comment{margin-top:10px;}
.view-more{text-decoration:none; width:100%; max-width:400px; border:1px solid rgba(0,0,0,.1); line-height:38px; border-radius:5px; text-align:center; display:block; margin: 0 auto; clear:both; font-weight:500; color:var(--color1); text-decoration:none; background:rgba(0,0,0,.02); }
.view-more:hover{text-decoration:none; background:#fff;}

/*****************************************************************************************/
/*                               Elemenet Content                                        */
/*****************************************************************************************/

/* lightbox */
.wrap-lightbox{display:block;  position:relative; text-align:center; padding: 20px 0; }
.wrap-lightbox .inner{display:inline-block; margin: 0 auto; max-width: 100%; position:relative;border-radius:7px; overflow:hidden; }
.wrap-lightbox .inner .wrap-img{display:inline-block; position:relative;}
.wrap-lightbox .inner .wrap-img:before{content:"\f31e"; font-family:"Font Awesome 5"; font-size:14px; background: rgba(0,0,0,.7);position:absolute; left:50%; bottom:50%; z-index:2; font-weight:900; width:32px; height:32px; margin: -16px 0 0 -16px; display:flex; align-items:center; justify-content:center; transition:.3s; opacity:0; border-radius:3px; color:#fff;}
.wrap-lightbox .inner .wrap-img:hover:before{opacity:1;}
.wrap-lightbox .inner .wrap-img img{margin:0!important; display:initial;}
.wrap-lightbox .inner .note-img{text-align:center; text-decoration:none; background:var(--color-bg); color:rgba(0,0,0,.95); font-size:14px; line-height:20px; font-weight:500; padding: 7px 10px;clear:both; word-break:break-word; font-style:italic;}

/* Responsive Youtube */
.video-youtube{ position: relative;  padding-bottom: 56.25%;  height: 0; overflow: hidden; margin: 20px 0}
.video-youtube iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border:none}
.video-youtube .id-youtube{display:none;}

/* fixed Youtube */
.video-youtube.fixed .close-fixed{position:fixed; z-index:12; right: 20px; bottom:130px; background:#ec1f26; width:30px; height:30px; display:flex; align-items:center; justify-content:center; color:#fff; }
.video-youtube.fixed iframe{position:fixed; left:initial!important; top:initial!important; right:5px; bottom:5px; width:350px!important; height:175px!important; z-index:10;}    

@media (max-width:991px) {
    .video-youtube.fixed iframe{bottom:55px;}
    .video-youtube.fixed .close-fixed{bottom: 185px}
}

/* Play part Youtube */
.partTime-Youtube{width:100%; float:left; position:relative;}
.partTime-Youtube .title{display:block; float:left; }
.partTime-Youtube .title div:first-child{font-weight:bold; font-size:20px; display:block;}
.partTime-Youtube .title div:last-child{font-style:italic; display:inline-block}
.partTime-Youtube ul{margin:0; padding:0; list-style:none; width:100%;}
.partTime-Youtube ul li{width:100%; position:relative; float:left; cursor:pointer; padding: 10px 0; border-top:1px solid rgba(0,0,0,.07); padding-left:30px;}
.partTime-Youtube ul li:first-child{border:none;}
.partTime-Youtube ul li:before{font-family:"Font Awesome 5 Brands"; font-weight:400; content: "\f167"; font-size:16px; color:#ec1f26; position:absolute; top:9px; left:0;}
.partTime-Youtube ul li div:first-child{font-weight:bold; color:var(--color1);}
.partTime-Youtube ul li div:last-child{width:100%; float:left; position:relative;}

/* table */
.table-responsive{border:none!important}
.table{width:100%; float:left; margin: 20px 0}
.table thead th{border:none!important; background:var(--color2); color:#fff!important; padding:10px 15px!important}
.table thead th:first-child{border-radius: 6px 0 0 6px;}
.table thead th:last-child{border-radius: 0 6px 6px 0;}
.table tbody tr td{padding: 10px 15px!important; border:none!important; font-size:15px;text-align:left;}
.table tbody tr:nth-child(2n+2) td{background:#dfedfb}
.table tbody tr:nth-child(2n+2) td:first-child{border-radius: 6px 0 0 6px;}
.table tbody tr:nth-child(2n+2) td:last-child{border-radius: 0 6px 6px 0;}

/*
   https://clb100.com/trong-cay-voi-clb100/lich-ho-tro-trong-he-thong-clb100-60703.html 
*/

.timelineSupport{width:100%; float:left; position:relative; overflow:hidden; line-height:initial!important; margin: 20px 0;}
.timelineSupport .titleSupport{width:100%; float:left; position:relative; font-weight:bold; font-size:25px; color:#000; padding-bottom:10px;}
.timelineSupport .dateRow{width:100%; float:left; position:relative; display:table; padding:0 20px 0 115px; margin: 10px 0; border-radius:8px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.1); transition:.3s;}
.timelineSupport .dateRow:hover{box-shadow:inset 0 0 0 1px var(--color2), 0 5px 20px rgba(0,0,0,.07)}
.timelineSupport .dateRow .date{position:absolute; top:0; left:0; color:#fff; text-align:center ; height:100%; width:95px; background:var(--color2); border-radius: 8px 15px 0 8px;}
.timelineSupport .dateRow .date div:first-child{font-weight:bold; text-transform:uppercase; padding:20px 0 3px 0; font-size:15px;}
.timelineSupport .dateRow .date div:nth-child(2){opacity:.7; font-size:13px;}
.timelineSupport .dateRow .date div:last-child{font-weight:500; font-size:35px; opacity:.5; position:absolute; left:0; bottom:5px; width:100%;}
.timelineSupport .dateRow .rowItem{width:100%; position:relative; float:left; display:table; border-bottom:1px solid rgba(0,0,0,.1); padding: 14px 0}
.timelineSupport .dateRow .rowItem:last-child{border:none;}
.timelineSupport .dateRow .rowItem .col{display:block; width:calc(50% - 90px); position:relative; vertical-align:middle; text-align:left; float:left;}
.timelineSupport .dateRow .rowItem .col ul{margin:0; padding:0 0 0 55px; list-style:none; width:100%; float:left; position:relative;}
.timelineSupport .dateRow .rowItem .col ul li{width:100%; float:left; position:relative; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.timelineSupport .dateRow .rowItem .col ul li:first-child{font-weight:500; opacity:.7}
.timelineSupport .dateRow .rowItem .col ul li:last-child{font-weight:bold; font-size:16px; padding-top:3px; color:var(--color1)}
.timelineSupport .dateRow .rowItem .col ul li:last-child a{text-decoration:none; color:#000; font-size:15px; transition:.3s;}
.timelineSupport .dateRow .rowItem .col ul:before{font-family:"Font Awesome 5"; font-weight:900; font-size:20px; position:absolute; top:1px; left:0; background:rgba(0,0,0,.07); display:flex; align-items:center; justify-content:center; width:40px; height:42px; border-radius:5px; opacity:.4}
.timelineSupport .dateRow .rowItem .col.user ul:before{content:"\f590"}
.timelineSupport .dateRow .rowItem .col.web ul:before{content:"\f7a2"}
.timelineSupport .dateRow .rowItem .col.web ul li:last-child a:hover{color:var(--color1)}
.timelineSupport .dateRow .rowItem .col.mobile{width:180px;}
.timelineSupport .dateRow .rowItem .col.mobile ul:before{content:"\f3cd"}
.timelineSupport .dateRow .rowItem .col.mobile ul li:last-child a{color:#ec1f26}

@media (max-width:767px) {
    .timelineSupport .dateRow{padding-left:20px; padding-top:70px;}
    .timelineSupport .dateRow .date{width:100%; height:60px; text-align:left; padding-left:20px; border-radius: 8px 8px 0 15px;}
    .timelineSupport .dateRow .date div:first-child{padding-top:12px;}
    .timelineSupport .dateRow .date div:last-child{right:20px; width:initial; left:initial; bottom:10px; font-weight:500;}
    .timelineSupport .dateRow .rowItem .col{width:100%!important; margin-bottom:14px;}
    .timelineSupport .dateRow .rowItem .col:last-child{margin-bottom:0;}
}

@media (min-width:768px) and (max-width:1199px) {
    .timelineSupport .dateRow .rowItem .col.user{width:100%!important; margin-bottom:14px;}
    .timelineSupport .dateRow .rowItem .col.web{width:calc(100% - 180px)!important}
}