/** header **/
.top-nav{background:none;position:fixed;top:40px;z-index:2000000000;}
.fixed_topnav{background:#fff;top:0px;z-index:2000000000;}

/** banner **/
.banner{padding:130px 0px;background-image:url('../../imgs/blog-detail-banner.png');background-repeat:no-repeat;background-size:cover;}
.banner-txt .banner-bri{font-family: Poppins-Medium;font-weight:500;font-size:16px;color: #FFFFFF;line-height:1.5em;}
.banner-txt .banner-tle{font-family: Poppins-Medium;font-weight: 500;font-size:34px;color: #FF6600;line-height:1.5em;margin-top:10px;}

/** detail **/
.detail{margin-top:10px;margin-bottom:74px;}
.detail .container{background: #FFFFFF;box-shadow: 0px 6px 29px 0px rgba(0,0,0,0.05);}
.detail .main .cover{width:100%;padding:25px 50px;margin-bottom:30px;}
.detail .main .cover img{max-width:100%;}
.detail .main .cnt{width:100%;padding:0px 50px;overflow:hidden;}
.detail .main{padding-bottom:50px;}
.detail .cnt .blog-tle{margin:35px 0px;padding:0px;}
.detail .cnt .blog-tle span{position:relative;font-family:Poppins-MediumItalic;font-weight: normal;font-size: 22px;color: #494949;line-height: 23px;background-image:linear-gradient(0,rgb(242, 235, 55) 36%,transparent -26%);}
.detail .cnt .blog-cnt p{padding:0px;margin-bottom:30px;font-family: Poppins;font-weight: 400;font-size: 15px;color: #767676;line-height:2em;}
.detail .main .cnt img{max-width:100%;}
.author{width:100%;padding:0px 50px;margin-bottom:50px;}
.author ul{width:100%;overflow:hidden;}
.author ul li{width:100%;}
.author ul li span{width:100%;font-family: Poppins;font-weight: 400;font-size: 15px;color:#FF5A00;text-decoration:underline;text-decoration-color:#FF5A00;line-height: 30px;}
.author ul li span a{color:#FF5A00;text-decoration:underline;text-decoration-color:#FF5A00;}
.question{width:100%;padding:0px 50px;margin-bottom:80px;margin-top:50px;}
.qs-tle{font-family:Poppins-MediumItalic;font-weight: normal;font-size: 22px;color: #404040;line-height: 23px;}
.qs-bri{width:100%;max-width:465px;font-family: Poppins;font-weight: 400;font-size: 15px;color: #636363;line-height: 30px;margin-top:25px;}
.qs-bri-cl a{color:#F26F37;}
.qs-btn{margin-top:40px;}
.qs-btn a{font-family:Poppins;font-weight:400;font-size:14px;color:#FFFFFF;display:inline-flex;align-items:center;background:#FF7623;padding:15px 20px;border-radius:44px;}
.qs-btn a i{background-repeat:no-repeat;background-image:url('../../imgs/ql-ico.png');margin-left:5px;background-size:contain;width:15px;height:15px;display:inline-block;}
.tags{display:flex;align-items:center;width:100%;padding:0px 50px;margin-bottom:35px;}
.tags .tag-nm{position:relative;float:left;font-family:Poppins-Medium;padding:0px 20px;margin-right:17px;font-weight:500;font-size:14px;color:#2C2C2C;line-height:30px;}
.tags .tag-nm::after{content:'';width:16px;height:18px;background-repeat:no-repeat;background-size:cover;background-image:url('../../imgs/tag.png');position:absolute;top:0px;transform:translateY(30%);left:0px;}
.tags .tag-ls{padding:0px;width:fit-content;display:inline-block;float:left;}
.tags .tag-ls ul{display:flex;align-items:center;}
.tags .tag-ls li{padding:12px 10px;background:#F7F7F7;font-family:Poppins;font-weight: 400;font-size: 12px;color: #3C3C3C;margin-right:20px;}
.tags .tag-ls li{padding:12px 10px;background:#F7F7F7;font-family:Poppins;font-weight: 400;font-size: 12px;color: #3C3C3C;margin-right:20px;}
.prev_next{width:1000px;max-width:100%;padding:0px 50px;}
.prev,.next{font-size:14px;width:100%;line-height:1.2em;background: #F7F7F7;border-radius: 2px;margin-bottom:20px;padding:14px 18px;}
.prev a,.next a{color:#3C3C3C;}
.prev a:hover,.next a:hover{color:deepskyblue;}
.prev span{padding-left:20px;position:relative;font-family:Poppins-Medium;font-weight:500;font-size:14px;color:#2C2C2C;line-height:30px;}
.next span{padding-left:20px;position:relative;font-family:Poppins-Medium;font-weight:500;font-size:14px;color:#2C2C2C;line-height:30px;}
.related{margin-bottom:125px;}
.rl-tle{font-family: Poppins;font-weight: 400;font-size: 32px;color: #393939;line-height: 24px;}
.rl-da ul{width:100%;margin-bottom:10px;}
.rl-da>ul>li{width:calc((100% - 36px) / 3);margin-bottom:20px;margin-right:18px;background:#FFF;background: #FFFFFF;box-shadow: 0px 6px 29px 0px rgba(0,0,0,0.05);border-radius: 4px;}
.rl-da li:nth-child(3){margin-right:0px;}
.rl-da li{padding:3px 0px 2px 0px;}
.rl-da li .rl-date {font-family: Poppins;font-weight: 400;font-size: 12px;color: #808080;line-height: 18px;}
.rl-da li .rl-nm{font-family: Poppins-Bold;font-weight: 400;font-size: 14px;color:#010101;line-height: 24px;}
.rl-da li .rl-nm a{color:#010101;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;}
.rl-da li .rl-bri {margin-top:10px;font-family: Poppins;font-weight: 400;font-size: 12px;color: #7C8085;line-height: 22px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;}
.rl-tag ul{margin-bottom:18px;overflow:hidden;}
.rl-tag ul li{margin-right:8px;}
.rl-tag ul li a{display:inline-block;background:#FF9537;padding:6px 10px;font-family: Poppins;font-weight: 400;font-size: 12px;color: #FFFFFF;}
.rl-tag ul li a:hover{color:#FFFFFF!important;text-decoration:underline;}
.rl-img img{transition: all 0.8s;}
.rl-img img:hover{transform:scale(1.1);}
.rl-img{width:100%;height:100%;overflow:hidden;margin:10px;}
.rl-info{width:100%;padding:12px 20px;}
.rl-da{margin-top:25px;}
.prev span::after{content:'';width:12px;height:18px;background-repeat:no-repeat;background-size:cover;background-image:url('../../imgs/up.png');position:absolute;top:0px;transform:translateY(10%);left:0px;}
.next span::after{content:'';width:12px;height:18px;background-repeat:no-repeat;background-size:cover;background-image:url('../../imgs/down.png');position:absolute;top:0px;transform:translateY(10%);left:0px;}
.tags .tag-ls li span{font-family:Poppins;}
.tags .tag-ls li span:hover{color:#FF6000;}

/** crumbs **/
.crumbs{width:100%;margin-top:-120px;}
.crumbs ul{padding:20px 0px;overflow:hidden;}
.crumbs .home{width:20px;height:20px;background-repeat:no-repeat;background-size:contain;background-image:url('../../imgs/icons/home.png');}
.crumbs li{margin-right:10px;display:inline;float:initial;}
.crumbs .fa-home{color:#999;}
.crumbs li a span{color:#777;position:relative;font-family:Poppins;font-size:15px;display:inline;}
.crumbs li a span:hover{cursor:pointer;color:deepskyblue;}
.crumbs li .fa-angle-right{color:#777;}
.crumbs li a h2{color:#333;font-family:Poppins-Medium;font-weight:normal;font-size:15px;padding:20px 5px 20px 5px;display:inline;}

.hv-btn{position:relative;cursor:pointer;overflow:hidden;-webkit-transition:border-color 0.4s, color 0.4s;transition: border-color 0.4s, color 0.4s}
.hv-btn::before{content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background:#FF7623;z-index: -1;opacity: 0;-webkit-transform: scale3d(0.7, 1, 1);transform: scale3d(0.7, 1, 1);-webkit-transition: -webkit-transform 0.4s, opacity 0.4s;transition: transform 0.4s, opacity 0.4s;-webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);}
.hv-btn:hover{color:#fff!important;border-color:#FF7623;}
.hv-btn:hover::before{opacity: 1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);}


.hv-btn2{z-index:2;border: 1px solid transparent;position:relative;cursor:pointer;overflow:hidden;-webkit-transition:border-color 0.4s, color 0.4s;transition: border-color 0.4s, color 0.4s}
.hv-btn2::before{content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background:#FFF;z-index: -1;opacity: 0;-webkit-transform: scale3d(0.7, 1, 1);transform: scale3d(0.7, 1, 1);-webkit-transition: -webkit-transform 0.4s, opacity 0.4s;transition: transform 0.4s, opacity 0.4s;-webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);}
.hv-btn2:hover{color:#FF7623!important;border-color:#FF7623!important;}
.hv-btn2:hover::before{opacity:1;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);}


.detail .main .cnt p{margin-bottom:25px;padding:0px;font-family:Poppins;line-height:1.5;}
.detail .main .cnt a{color:#FF6000;font-family:Poppins;}
.detail .main .cnt a:hover{text-decoration:underline;}
.detail .main .cnt h1,.detail .main .cnt h2,.detail .main .cnt h3,.detail .main .cnt h4,.detail .main .cnt h5,.detail .main .cnt h6{font-family:Poppins;margin-bottom:18px;line-height:1.5;}

@media screen and (max-width:1440px) {

}
@media screen and (max-width:1280px) {
    .detail .main .cover{padding:0px;}
}
@media screen and (max-width:1080px){

}
@media screen and (max-width:992px) {
    .top-nav{background:#fff;}
}
@media screen and (max-width: 768px) {
    .top-nav{top:0px;}
    .banner-txt .banner-tle{font-size:28px;line-height:1.3;}
    .tags{flex-wrap:wrap;margin-bottom:25px;}
    .question{margin-bottom:55px;}
    .tags .tag-nm{width:100%;}
    .tags .tag-ls{width:100%;}
    .prev_next,.tags,.question,.author,.detail .main .cnt{padding:0px;}
    .prev,.next{padding:10px;}
    .detail{margin-top:90px;}
    .related{margin-bottom:80px;}
    .tags .tag-ls ul{flex-wrap:wrap;}
    .tags .tag-ls li{margin-right:10px;margin-bottom:5px;padding: 8px 10px;}
    .rl-tle{font-size:28px;}
}
@media screen and (max-width:560px) {
    .banner-txt .banner-tle{font-size:26px;}
    .related{margin-bottom:0px;}
    .crumbs ul{padding:15px 0px;}
    .crumbs li{margin-right:3px;}
    .crumbs li a span{font-size:14px;}
    .crumbs li a span::after{font-size:14px;}
    .crumbs li a h2{font-size:14px;}
    .rl-tle{font-size:26px;}
    .rl-img img{width:100%;}
    .rl-da{margin-top:5px;}
    .tags .tag-ls li{max-width:calc(50% - 10px);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;line-height:27px;}
}
@media screen and (max-width:414px) {
    .qs-btn{margin-top:25px;}
    .author{margin-bottom:35px;}
    .banner-txt .banner-tle{font-size:26px;}
    .crumbs li{margin-right:3px;}
    .detail{margin-top:70px;}
    .detail .cnt .blog-tle{margin:25px 0px;}
    .detail .cnt .blog-tle span{font-size:18px;}
    .detail .cnt .blog-cnt p{font-size:14px;line-height:1.5;margin-bottom:20px;}
    .qs-bri{margin-top:18px;}
    .qs-btn{margin-top:15px;}
    .question{margin-bottom:45px;}
}
