File: /www/wwwroot/www.scdc-marine.com/wp-content/themes/heku-cms/TempParts/assets/css/postcss-heku.css
:root{
/* 配色原理,网站中尽量不用出现 多余5种颜色 此处的配色 尽量以前后反色为主
参考网址2:https://huemint.com/website-1/
参考网址2:https://color.review/
*/
--font-default: "Microsoft YaHei", "微软雅黑", Arial, "sans-serif";
--deep_background: #4b4b4b; /* 深色背景色 */
--deep_background_translucent: rgba(75, 75, 75, 0.7); /* 深色透明背景 主要用于banner,或是过渡层 一般为0.7透明度,rgb色标 */
--deep_background_translucent_3: rgba(75, 75, 75, 0.25);
--deep_color_main:#b7bfc3; /* 深色背景的主色调,一般对应为 浅色背景 如白色*/
--deep_color_subs:#10d237; /* 深色背景的 辅助色不常用,一般为主色调的同类色、相邻色 */
--deep_color_eye:#250dbb; /* 支持深色的 点睛色 与别的主色调反差大,具有引导视线作用,一般可以为主色调的对比色或互补色,或是公司的logo主色 */
--background: #dcdcdc; /* 背景色 var(--background) */
--background_translucent: rgba(220, 220, 220, 0.7); /* 透明背景 var(--background_translucent) 主要用于banner,或是过渡层 一般为0.7透明度,rgb色标 */
--background_translucent_3: rgba(220, 220, 220, 0.21); /* 透明背景 var(--background_translucent_3) 透明度 较低,作为 背景色叠层 */
--forecolor:#4b4b4b; /* 前景色,主色调 var(--forecolor) 如默认文字颜色(与背景色 对比度要求大于 4.5 WCAG 规范 AAA 级别) */
--forecolor_translucent:rgba(75, 75, 75, 0.7); /* 透明前景色 var(--forecolor_translucent) 主要用于banner,或是过渡层 一般为0.7透明度,如白色*/
--forecolor_translucent_3:rgba(75, 75, 75, 0.21); /* 透明前景色 var(--forecolor_translucent_3) 透明度 较低,作为 背景色叠层 */
--color_eye:#0065a3; /* 点睛色 var(--color_eye) 与别的主色调反差大,具有引导视线作用,一般可以为主色调的对比色或互补色,或是公司的logo主色 */
--color_subs:#10d237; /* 辅助色不常用 var(--color_subs) 一般为主色调的同类色、相邻色 */
--boder_line:1px solid rgb(208 229 239 / 25%);
--light_background: #dff2ff; /* 浅色背景 */
--light_background_translucent:rgba(223, 242, 255, 0.7); /* 浅色透明背景 主要用于banner,或是过渡层*/
--light_color_main:#4b4b4b; /* 浅色背景的主色调,一般对应为 深色背景 如黑色*/
--light_color_subs:#10d237; /* 深色背景的 辅助色不常用,一般为主色调的同类色、相邻色 */
--light_color_eye:#250dbb; /* 支持深色的 点睛色 与别的主色调反差大,具有引导视线作用,一般可以为主色调的对比色或互补色,或是公司的logo主色 */
--radius_big: 6px; /* 大圆角默认 设置 */
--radius_small: 4px; /* 小圆角默认 设置 */
--radius_img: 5px; /* 图片圆角 设置 */
--box_shadow: 0px 2px 8px 0px rgba(75, 75, 75, 0.21); /* 边框 阴影效果 */
--box_deep_shadow:0px 2px 8px 0px rgba(75, 75, 75, 0.21) /* 深色背景的 边框 阴影效果 */
--text_shadow: 0 1px 2px rgba(75, 75, 75, 0.25); /* 文字 阴影效果 */
--text_deep_shadow: 2px 2px 4px rgba(0,0,0,0.5); /* 深色背景的文字 阴影效果 */
}
/* ----------------------------------------------------
--- 01 - 19) 公共 全局相关的 CSS样式
-- 00) heku-color 模板颜色管理
-- 01) @font-face 字体图标库,iconfont加载的字体图标,让网站更加独立自主,注意需要加载对应的字体库和对应的字体路径
-- 02) #single_bar_line 10-20 面包屑 导航 公共样式 顶部导航
-- 04) start .heku-btn 10-20 css 按钮的 图标样式
--- 10 - 29) 首页相关 CSS样式
--- 30 - 39) 分类页面相关 CSS样式
--- 40 - 49) 详情页相关 CSS样式
-- 43) 新闻详情页 ,展示模板: css样式
--- 50 - 59) 部分单页相关 CSS样式
--- 70 - 80) 第三方插件相关 CSS样式
-- 70). Viewer.js js 支持的css 用于点击放大图片使用
------------------------------------------------------- */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
a,.btn,button,span,p,i,input,select,textarea,li,img,*::after,*::before,.transition-3,h1,h2,h3,h4,h5,h6{-webkit-transition:all 0.3s ease-out 0s;-moz-transition:all 0.3s ease-out 0s;-ms-transition:all 0.3s ease-out 0s;-o-transition:all 0.3s ease-out 0s;transition:all 0.3s ease-out 0s;}
/* ----------------------------------------------------
00) heku-color 模板颜色管理
------------------------------------------------------- */
p,span,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6{text-shadow:var(--text_shadow);}
a{color:var(--forecolor);text-shadow: var(--text_shadow);text-decoration:none}
a:focus,a:hover{color:var(--color_eye)}
/* ----------------------------------------------------
01) @font-face 字体图标库,iconfont加载的字体图标,让网站更加独立自主,注意需要加载对应的字体库和对应的字体路径
------------------------------------------------------- */
@font-face {
font-family: "iconfont";
src: url('../fonts/iconfont.woff2?t=1684371808307') format('woff2'),
url('../fonts/iconfont.woff?t=1684371808307') format('woff'),
url('../fonts/iconfont.ttf?t=1684371808307') format('truetype');
}
.iconfont{font-family:"iconfont" !important;font-size:16px;font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
.icon-fuwu:before{content:"\e704";}
.icon-gongju1:before{content:"\e615";}
.icon-gongju:before{content:"\e73f";}
.icon-miaozhun:before{content:"\e635";}
.icon-miaozhun1:before{content:"\e65c";}
.icon-erji:before{content:"\e65f";}
.icon-fuwu1:before{content:"\e694";}
.icon-peixun:before{content:"\e6cf";}
.icon-peixun1:before{content:"\efc2";}
.icon-zhenduan-01:before{content:"\e621";}
.icon-fuwu2:before{content:"\e66f";}
.icon-gongju-copy:before{content:"\efc3";}
/* ----------------------------------------------------
02) #single_bar_line 10-20 面包屑 导航 公共样式 顶部导航
------------------------------------------------------- */
.heku-breadcrumb a,.heku-breadcrumb span{padding:5px 3px;line-height:40px;opacity:0.78;}
.heku-breadcrumb a:hover{color:var(--color_eye);opacity:1;}
.heku-breadcrumb a.home-bar .icon{padding-right:8px;font-size:18px;}
.heku-breadcrumb .icon-right{font-size:12px;line-height:43px;}
/* ----------------------------------------------------
02) .index-title 10-20 Title 导航 公共样式 顶部导航
------------------------------------------------------- */
.index-title {
text-align:center;
}
.index-title span {
display:block;
padding:10px 0;
}
.index-title span.a {
line-height:34px;
font-size:3rem;
font-weight:600;
color:var(--color_eye);
padding:20px 40px 20px 0;
float:left;
}
.index-title span.b {
font-family:"Noto Sans",Sans-serif;
font-size:1.2rem;
font-weight:400;
letter-spacing:1px;
padding:32px 0 10px 0;
float:left;
}
.index-title span.c {
font-family:"Noto Sans",Sans-serif;
font-size:18px;
font-weight:100;
line-height:2rem;
letter-spacing:0px;
text-align:left;
clear:both;
}
/*--------------------------------------------------
02 #Carousel_Banner banner图片 Css样式 内敛 bootstrast 轮播插件
----------------------------------------------------*/
.heku-btn {text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);display: inline-block;height: 48px;line-height: 44px;border: 2px solid #4636ff;background: #4636ff;color: #ffffff;padding: 0 30px;-webkit-border-radius: 40px;-moz-border-radius: 40px;border-radius: 40px;font-weight: 600;text-transform: capitalize;min-width: 140px;text-align: center;}
.heku-btn:hover {background: #ffffff;color: #4636ff;}
.heku-btn-transparent{background: transparent;border-color: rgba(255, 255, 255, 0.2);}
.heku-btn-transparent:hover{background: #dffbe2ad;color: var(--color_eye);border-color: rgb(35 144 197 / 60%);text-shadow: 0.5px 0.5px 0.5px rgb(199 196 196);}
.heku-btn-focus{background: #3bb16f;border-color: rgba(255, 255, 255, 0.2);}
.heku-btn-focus:hover {background: #fbfbfb;color: var(--color_eye);border-color: rgb(92 133 94); text-shadow: 0.5px 0.5px 0.5px rgb(255 255 255); font-weight: bold;}
/* ----------------------------------------------------
03) start .heku-btn 10-20 css 按钮的 图标样式
------------------------------------------------------- */
/* .heku-btn{display:inline-block;line-height: 36px;border: 0px solid #ffffff;color:#235bb8;padding: 1px 20px;border-radius: 4px;box-shadow: 0px 2px 5px rgba(0,0,0,0.26);}
.heku-btn:hover{color:#ffffff;border: 0px solid #ffffff;background: rgb(35 91 184);}
.heku-btn.heku-btn-black{line-height:36px;border:1px solid #fff;background:#235bb8;color:#ffffff;padding:0px 15px 0px 20px;}
.heku-btn.heku-btn-black:hover{border:1px solid #fff;background:#ffffff;color:#235bb8;font-weight:bold;}
.heku-btn.heku-btn-transparent{letter-spacing:4px;line-height:32px;border:1px solid #fff;background:none;color:#26230e;padding:0px 15px 0px 12px;margin-left:10px;}
.heku-btn.heku-btn-transparent:hover{border:1px solid #265db9;background:#265db9;color:#ffffff;font-weight:initial;}
.heku-btn:focus{outline: 0px dotted;outline: 0px auto -webkit-focus-ring-color;} */
/* ----------------------------------------------------
01.1) #heku_top .heku-top-topbar 顶部 topbar
-------------------------------------------------------*/
#heku_top{position: absolute;top: 0;left: 0;right: 0;width: 100%;z-index: 11;}
.heku-top-topbar{border-bottom: 1px solid rgb(208 229 239 / 55%);}
.heku-top-topbar .topbar-left-social ul li {display: inline-block;margin-left: -4px;}
.heku-top-topbar .topbar-left-social ul li:last-child {border-right: 0;}
.heku-top-topbar .topbar-left-social ul li a {display: inline-block;width: 50px;height: 40px;line-height: 40px;text-align: center;font-size: 18px;}
.heku-top-topbar .topbar-left-social ul li a:hover {background: rgb(46 185 199 / 30%);}
.heku-top-topbar .topbar-right-info ul li {display: inline-block;padding:0 15px;}
.heku-top-topbar .topbar-right-info ul li:last-child {border-right: 0;}
.heku-top-topbar .topbar-right-info ul li a {display: inline-block;font-size: 14px;height: 40px;line-height: 40px;}
.heku-top-topbar .topbar-right-info ul i {margin-right: 8px;}
.heku-top-topbar .topbar-left-social ul li,.heku-top-topbar .topbar-right-info ul li {border-right: 1px solid rgb(208 229 239 / 55%);}
.heku-top-topbar .topbar-right-info ul li a,.heku-top-topbar .topbar-left-social ul li a {color: #ffffff;}
.heku-top-topbar .topbar-right-info ul li a:hover,.heku-top-topbar .topbar-left-social ul li a:hover{color: #d4ffd9;}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.heku-top-topbar .topbar-right-info ul li {margin-left: 15px;}
}
/* ----------------------------------------------------
01.2) #heku_top_menu .heku-top-menu 顶部 menu 菜单导航
------------------------------------------------------- */
.heku-top-menu{width: 100%;}
.heku-top-menu .top-menu-logo{overflow: visible;width: auto;}
.heku-top-menu .top-menu-logo .logo-pr,.heku-top-menu.header-is-visible .top-menu-logo .logo-bg{display:block}
.heku-top-menu .top-menu-logo .logo-bg,.heku-top-menu.header-is-visible .top-menu-logo .logo-pr{display:none}
.heku-top-menu .top-menu-logo img{height: 54px;}
.heku-top-menu .top-logo-font{float: left;padding-left: 10px;margin: 14px 0px;font-size: 32px;font-weight: 600;line-height: 20px;letter-spacing: 2px;text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);}
.heku-top-menu .top-logo-font a,.header-is-visible .top-logo-font a{display: block;}
.heku-top-menu .nav-menu > li:last-child{padding-right: 0px;}
.heku-top-menu .nav-menu > li{float: left;display: block;line-height: 54px;padding: 20px 36px;text-align: center;transition: .5s;position: relative;}
.heku-top-menu .nav-menu > li a{font-size: 18px;font-weight: 600;text-transform: capitalize;display: inline-block;}
.heku-top-menu .nav-menu .sub-menu {display: none;width:286px;left: -80px;position: relative;border-radius: 0 0 8px 8px;top: 80px;}
.heku-top-menu .nav-menu .sub-menu li{list-style: none;padding: 18px 20px}
.heku-top-menu .nav-menu .sub-menu li a{display:block;line-height: 20px;text-align: center;transition: .5s;opacity: 1;font-size: 14px;filter:alpha(opacity=100,style=100);}
.heku-top-menu .nav-menu .sub-menu li a span{font-size: 16px;font-weight: bold;}
.heku-top-menu .nav-menu li:hover .sub-menu{display: block;height: auto;transition: .5s;overflow: hidden;position: absolute;}
.heku-top-menu .nav-menu .sub-menu a:hover,.heku-top-menu .nav-menu > li:hover > a,.heku-top-menu .nav-menu li .sub-menu li:hover a,.header-is-visible .nav-menu > li:hover a{color: #0187c3;}
.header-is-visible .top-logo-font span,.header-is-visible .sub-menu > li a,.heku-top-menu .sub-menu > li:hover .sub-menu a{color: var(--color_eye);}
.heku-top-menu .nav-menu > li a,.heku-top-menu .top-logo-font span{color: #FFFFFF;text-shadow: 0.5px 0.5px 0.5px rgba(0, 0, 0, 0.5);}
.heku-top-menu .top-logo-font:hover span{color: #d4ffd9;}
.heku-top-menu .nav-menu .sub-menu{background:rgba(255,255,255,0.65);-webkit-background:rgba(255,255,255,0.65);-o-background:rgba(255,255,255,0.65);-moz-background:rgba(255,255,255,0.65);}
.heku-top-menu .nav-menu .sub-menu li:hover{background:rgba(128,128,128,0.35);-webkit-background:rgba(128,128,128,0.35);-o-background:rgba(128,128,128,0.35);-moz-background:rgba(128,128,128,0.35);}
.heku-top-menu .icon-navicon{position: absolute;font-size: 24px;color: #fff;right: 5px;top: 14px;}
.header-is-visible{left: 0;margin: auto;position: fixed !important;top: 0;width: 100%;box-shadow: 0 0 60px 0 rgba(0, 0, 0, 0.07);z-index: 9999;-webkit-animation: 300ms ease-in-out 0s normal none 1 running fadeInDown;animation: 300ms ease-in-out 0s normal none 1 running fadeInDown;-webkit-box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);background: #dffbe2ad;background: #d4ffd9c4;}
.header-is-visible.heku-top-menu .icon-navicon{color: var(--color_eye);}
.header-is-visible .nav-menu .sub-menu {top: 70px;}
.header-is-visible .nav-menu > li{padding: 10px 24px;}
.header-is-visible .top-logo-font span,.header-is-visible .nav-menu > li a,.nav-menu > li:hover .sub-menu a{color:var(--color_eye);text-shadow: 0.5px 0.5px 0.5px rgb(255 255 255);}
.header-is-visible li.depth-0.heku-menu-type2:hover>.sub-menu{top:75px}
@media(max-width: 768px) {
.heku-top-menu .nav-menu > li:first-child{padding-right: 10px;}
.heku-top-menu.header-is-visible .nav-menu > li{padding: 10px 16px;}
.heku-top-menu .top-menu-logo{padding: 12px;}
.heku-top-menu .top-menu-logo img{height: 42px;}
.heku-top-menu .top-logo-font{font-size: 24px;margin: 22px 0px;padding-left: 0px;}
.heku-top-menu .nav-menu{left: 0px;display: none;}
.heku-top-menu .nav-menu > li a {color: var(--color_eye);font-size: 14px;}
.heku-top-menu .nav-menu li:hover .sub-menu{display: none;}
.heku-top-menu .nav-menu > li{padding: 15px 16px;float: initial;padding: 0px 16px;background: rgba(255,255,255,0.65);-webkit-background: rgba(255,255,255,0.65);-o-background: rgba(255,255,255,0.65);-moz-background: rgba(255,255,255,0.65);}
}
/* ----------------------------------------------------
11) 显示规定 不同屏幕的显示尺寸 大于760px尺寸 小于1000px时候使用 min
------------------------------------------------------- */
@media(min-width:768px) {
.heku-top-menu.header-is-visible .nav-menu > li{padding: 10px 16px;}
.heku-top-menu .top-menulogo img{height: 42px;}
.heku-top-menu .top-logo-font{font-size: 16px;line-height: 30px;}
.heku-top-menu .nav-menu > li a{font-size: 16px;}
.heku-top-menu .nav-menu > li{padding: 15px 12px;}
}
/* ----------------------------------------------------
12) 显示规定 不同屏幕的显示尺寸 大于1000px尺寸 小于1200px时候使用 mid
------------------------------------------------------- */
@media(min-width:992px) {
.heku-top-menu.header-is-visible .nav-menu > li{padding: 8px 24px;}
.heku-top-menu .top-menu-logo img{height: 54px;}
.heku-top-menu .top-logo-font{font-size: 20px;line-height: 32px;}
.heku-top-menu .nav-menu > li a{font-size: 18px;}
.heku-top-menu .nav-menu > li{padding: 15px 24px;}
}
/* ----------------------------------------------------
13) 显示规定 不同屏幕的显示尺寸 大于1200尺寸时候使用 max
------------------------------------------------------- */
@media(min-width:1200px) {
.heku-top-menu.header-is-visible .nav-menu > li{padding: 10px 32px;}
.heku-top-menu .nav-menu > li{padding: 15px 36px;}
}
/* ----------------------------------------------------
01.2) #Carousel_Banner 顶部 banner 图片
------------------------------------------------------- */
.banner-video video{width: 100%;height: auto;}
#Carousel_Banner .banner-indicators{bottom: 20px;}
#Carousel_Banner .banner-indicators li {width: 45px;height: 6px;display: inline-block;background: rgba(255,255,255,0.5);position: relative;overflow: hidden;border-top: 0px solid transparent;border-bottom: 0px solid transparent;border-radius: 2px;margin-right: 4px;margin-left: 4px;}
#Carousel_Banner .banner-indicators .active:after{content: "";width: 0px;height: 100%;position: absolute;left: 0;top: 0;animation: my_carousel_indicators 9.5s;-webkit-animation: my_carousel_indicators 9.5s;background: #fff;}
@keyframes my_carousel_indicators{from {width: 0;}to {width: 100%;}}
@-webkit-keyframes my_carousel_indicators{from {width: 0;}to {width: 100%;}}
.carousel-control-prev,.carousel-control-next{opacity: .3;transition: opacity .15s ease;z-index:10;}
#Carousel_Banner .carousel-item .banner-video{position: absolute;z-index: 4;width: 100%;}
#Carousel_Banner .carousel-item{width: 100%;height: 100%;height: 780px;background-size: cover;background-position: center center;}
#Carousel_Banner .banner-content .container{z-index: 10;}
/* #Carousel_Banner .carousel-item::before {
position:absolute;
content:"";
top:0;
left:0;
width:100%;
height:100%;
opacity:0.72;
z-index:8;
background-image:-moz-linear-gradient(-60deg,#00a0e9 0%,#003d58 100%);
background-image:-ms-linear-gradient(-60deg,#00a0e9 0%,#003d58 100%);
background-image:-webkit-linear-gradient(-60deg,#00a0e9 0%,#003d58 100%);
background-image:linear-gradient(-60deg,#00a0e9 0%,#003d58 100%);
} */
#Carousel_Banner .banner-content{padding: 110px 0 50px;height: 100%;color: #fff;}
#Carousel_Banner .banner-content{padding: 310px 0 250px;}
/* #Carousel_Banner .banner-content.banner_one_content{padding: 310px 0 250px;}
#Carousel_Banner .banner-content.banner_two_content{padding: 310px 0 250px;} */
#Carousel_Banner .banner-content .slider-content-h1{text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);}
#Carousel_Banner .banner-content .slider-content-text1{color:#c8dbca;padding-top:10px;text-shadow:0.5px 0.5px 0.5px rgba(0,0,0,0.5);width:300px;overflow:hidden;text-align:left;float:left;}
#Carousel_Banner .banner-content .slider-img{width: 100%;display: inline-table;}
#Carousel_Banner .banner-content .slider_img img{width: 620px;position: absolute;right: -50px;top:-60px;}
#Carousel_Banner .banner-content.banner_two_content .slider-content-text1{text-align:right;float:right;}
#Carousel_Banner .banner-content.banner_two_content .slider-content{text-align: center;}
#Carousel_Banner .carousel-item.news-banner{height: 240px;}
#Carousel_Banner .carousel-item.news-banner .banner-content{position: absolute;width: 100%;height: 100%;z-index: 8;}
#Carousel_Banner .carousel-item.news-banner .banner-content .slider-content-title{float: left;}
#Carousel_Banner .carousel-item.news-banner .banner-content .slider-content-des{text-align: right;font-size: 18px;}
#Carousel_Banner .carousel-item.news-banner .banner-min-bg{width: 100%;height: 100%;}
#Carousel_Banner .carousel-item.post-banner{height: 140px;}
#Carousel_Banner .carousel-item.post-banner .banner-min-bg{width: 100%;height: 100%;}
#Carousel_Banner .banner-content.banner_two_content .banner-content-h1{font-size:3.6rem;text-align: center;text-transform: capitalize;text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);}
#Carousel_Banner .banner-content.banner_two_content .banner-text1 span{font-size:2.2rem;text-align: center;font-size:2rem;color:#00abff;font-weight: 600;text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);}
#Carousel_Banner .banner-content.banner_one_content .banner-content-h1{font-size: 66px;text-transform: uppercase;text-shadow: 4px 4px 8px rgba(0, 0, 0, 0.8);}
#Carousel_Banner .banner-content.banner_one_content .banner-text1 span{font-size:2.2rem;text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);}
#Carousel_Banner .banner-content.banner_one_content .banner-text1 .focus{font-size:3.2rem;color:#00abff;text-shadow: var(--text_shadow);text-transform:uppercase;font-weight: 600;text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);}
#Carousel_Banner .banner-content.banner_one_content .banner-text2{font-size:1.2rem;text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);}
/* --- 1) 小于780尺寸时候使用 手机 mobile --- */
@media(max-width: 768px) {
#Carousel_Banner .carousel-item{height:350px;}
#Carousel_Banner .carousel-item.post-banner{height: 75px;}
#Carousel_Banner .banner-content{padding: 70px 0 50px;}
#Carousel_Banner .banner-content .slider-content-h1{font-size: 20px;}
.slider-img .s-img-1,.slider-img .s-img-3,.slider-img .s-img-4{width: 44px;}
.slider-img .s-img-2{width: 50px;}
.slider-img .s-img-5{width: 70px;display: none;}
.heku-btn{height: 34px;line-height: 30px;padding: 0px 18px;min-width: 132px;margin-top: 8px;}
#Carousel_Banner .banner-content .slider_img img{width: 260px;position: absolute;right: -26px;top:-18px;}
#Carousel_Banner .banner-content.banner_two_content .slider_img img{width:300px;position:absolute;right:-140px;top:0px;}
#Carousel_Banner .banner-content{padding: 120px 10px 20px;}
#Carousel_Banner .banner-content.banner_one_content .banner-content-h1{font-size: 24px;}
#Carousel_Banner .banner-content.banner_one_content .banner-text1{font-size:1.2rem;}
#Carousel_Banner .banner-content.banner_one_content .banner-text1 .focus{font-size:1.2rem;}
#Carousel_Banner .banner-content.banner_one_content .banner-text2{font-size:0.8rem;}
#Carousel_Banner .heku-btn{height: 38px;line-height: 32px;padding: 0 21px;}
#Carousel_Banner .banner-content.banner_two_content .banner-content-h1{font-size:1.8rem;}
#Carousel_Banner .banner-content.banner_two_content .banner-text1{font-size:1.2rem;}
}
/* --- 2) 大于768px尺寸 min --- */
@media(min-width:768px){
#Carousel_Banner .carousel-item{height:100%;}
#Carousel_Banner .carousel-item.post-banner{height: 75px;}
#Carousel_Banner .banner-content .slider-content-h1{font-size: 24px;}
.slider-img .s-img-1,.slider-img .s-img-3,.slider-img .s-img-4{width: 64px;}
.slider-img .s-img-2{width: 70px;}
.slider-img .s-img-5{width: 90px;}
#Carousel_Banner .banner-content .slider_img img{width: 420px;position: absolute;right: -32px;top:-18px;}
#Carousel_Banner .banner-content.banner_two_content .slider_img img{width: 420px;position: absolute;right: -200px;top:-18px;}
#Carousel_Banner .banner-content{padding: 150px 10px 20px;}
#Carousel_Banner .banner-content.banner_one_content .banner-content-h1{font-size: 24px;}
#Carousel_Banner .banner-content.banner_one_content .banner-text1{font-size:1.2rem;}
#Carousel_Banner .banner-content.banner_one_content .banner-text1 .focus{font-size:1.2rem;}
#Carousel_Banner .banner-content.banner_one_content .banner-text2{font-size:0.8rem;}
#Carousel_Banner .heku-btn{height: 38px;line-height: 32px;padding: 0 21px;}
#Carousel_Banner .banner-content.banner_two_content .banner-content-h1{font-size:2rem;}
#Carousel_Banner .banner-content.banner_two_content .banner-text1{font-size:1.5rem;}
}
/* --- 3) 大于992px尺寸 mid --- */
@media(min-width:992px){
#Carousel_Banner .carousel-item{height:100%;}
#Carousel_Banner .carousel-item.post-banner{height: 140px;}
#Carousel_Banner .banner-content .slider-content-h1{font-size: 30px;}
.slider-img .s-img-1,.slider-img .s-img-3,.slider-img .s-img-4{width: 64px;}
.slider-img .s-img-2{width: 70px;}
.slider-img .s-img-5{width: 90px;}
#Carousel_Banner .banner-content .slider_img img{width: 540px;position: absolute;right: -13px;top:-56px;}
#Carousel_Banner .banner-content.banner_two_content .slider_img img{width: 540px;position: absolute;right: -13px;top:-56px;}
#Carousel_Banner .banner-content{padding: 200px 0 60px;}
#Carousel_Banner .banner-content.banner_one_content .banner-content-h1{font-size: 48px;}
#Carousel_Banner .banner-content.banner_one_content .banner-text1{font-size:1.8rem;}
#Carousel_Banner .banner-content.banner_one_content .banner-text1 .focus{font-size:2.4rem;}
#Carousel_Banner .banner-content.banner_one_content .banner-text2{font-size:1rem;}
#Carousel_Banner .heku-btn {height: 48px;line-height: 44px;padding: 0 30px;}
#Carousel_Banner .banner-content.banner_two_content .banner-content-h1{font-size:2.2rem;}
#Carousel_Banner .banner-content.banner_two_content .banner-text1{font-size:1.7rem;}
}
/* --- 4) 大于1200尺寸时候使用 max --- */
@media(min-width:1200px){
#Carousel_Banner .carousel-item{height:100%;}
#Carousel_Banner .banner-content .slider-content-h1{font-size: 36px;}
.slider-img .s-img-1,.slider-img .s-img-3,.slider-img .s-img-4{width: 80px;}
.slider-img .s-img-2{width: 90px;}
.slider-img .s-img-5{width: 120px;}
#Carousel_Banner .banner-content .slider_img img{width: 620px;position: absolute;right: -50px;top:-60px;}
#Carousel_Banner .carousel-item .banner-video{position: absolute;z-index: 4;height: 100%;}
#Carousel_Banner .banner-content{padding: 210px 0 150px;}
#Carousel_Banner .banner-content.banner_one_content .banner-content-h1{font-size: 48px;}
#Carousel_Banner .banner-content.banner_one_content .banner-text1{font-size:2rem;}
#Carousel_Banner .banner-content.banner_one_content .banner-text1 .focus{font-size:2.8rem;}
#Carousel_Banner .banner-content.banner_one_content .banner-text2{font-size:1rem;}
#Carousel_Banner .banner-content.banner_two_content .banner-content-h1{font-size:2.8rem;}
#Carousel_Banner .banner-content.banner_two_content .banner-text2{font-size:2rem;}
}
@media(min-width:1667px) {
#Carousel_Banner .carousel-item .banner-video video{width: 100%;}
#Carousel_Banner .banner-content{padding: 280px 0 220px;}
#Carousel_Banner .banner-content.banner_one_content .banner-content-h1{font-size: 66px;}
#Carousel_Banner .banner-content.banner_one_content .banner-text1{font-size:2.2rem;}
#Carousel_Banner .banner-content.banner_one_content .banner-text1 .focus{font-size:3.2rem;}
#Carousel_Banner .banner-content.banner_one_content .banner-text2{font-size:1.2rem;}
#Carousel_Banner .banner-content.banner_two_content .banner-content-h1{font-size:3.2rem;}
#Carousel_Banner .banner-content.banner_two_content .banner-text1{font-size:2.2rem;}
}
/* ----------------------------------------------------
6.1 ) #index_product_line 首页 Why Choose Us 模块 CSS
------------------------------------------------------- */
/* #index_product_line{background: #e0e7ff;} */
#index_product_line .project-box .project-item{/* box-shadow:1px 1px 8px 0px hsla(0, 0%, 0%, 0.2); */position:relative;background-color: #fff;box-shadow: 0 3px 40px rgba(36,36,36,.1);float:left;/* margin-right: 0.5%; *//* margin-left: 0.5%; */margin-bottom:30px;border-radius: 12px;overflow: hidden;/* background:#f6f6f6; */transition:.3s ease;position:relative;}
#index_product_line .project-box .project-item:hover{box-shadow:2px 2px 12px 0px hsla(0, 0%, 0%, 0.8)}
#index_product_line .project-box .project-item:hover .project-content .t{color:var(--color_eye);}
#index_product_line .project-box .project-item .project-img{width: 100%;height: 250px;overflow: hidden;}
#index_product_line .project-box .project-item .project-img img{width: 100%;}
#index_product_line .project-box .project-item .project-content{padding: 20px 10px 22px 20px;}
#index_product_line .project-box .project-item .project-content .t{margin-bottom:12px;font-size:1.8rem;}
#index_product_line .project-box .project-item .project-content .c{color:#666;height:200px;overflow:hidden;font-size:16px;line-height:1.7;}
#index_product_line .project-box .project-item .project-content .more{float:right;color:#666;}
#index_product_line .project-box .project-item .li-line{width:0;height:5px;background: var(--color_eye);position:absolute;left:0;bottom:0;transition:all 0.5s ease;}
#index_product_line .project-box .project-item:hover .li-line{ width:100%;}
.imgZoom{overflow:hidden;-webkit-transform:rotate(0);transform:rotate(0);}
.imgZoom img{width:100%;height:100%;vertical-align:bottom;-o-object-fit:cover;object-fit:cover;-moz-transition:all .8s ease 0s;-ms-transition:all .8s ease 0s;-o-transition:all .8s ease 0s;-webkit-transition:all .8s ease 0s;transition:all .8s ease 0s;}
.imgZoom:hover img{-moz-transform:scale(1.2,1.2);-ms-transform:scale(1.2,1.2);-o-transform:scale(1.2,1.2);-webkit-transform:scale(1.2,1.2);transform:scale(1.2,1.2);}
/* ----------------------------------------------------
6.1 ) #index_project_line 首页 Why Choose Us 模块 CSS
------------------------------------------------------- */
#index_project_line{background: #F7F8F8;}
#index_product_line .project-box .project-item{/* box-shadow:1px 1px 8px 0px hsla(0, 0%, 0%, 0.2); */position:relative;background-color: #fff;box-shadow: 0 3px 40px rgba(36,36,36,.1);float:left;/* margin-right: 0.5%; *//* margin-left: 0.5%; */margin-bottom:30px;border-radius: 12px;overflow: hidden;/* background:#f6f6f6; */transition:.3s ease;position:relative;}
#index_product_line .project-box .project-item:hover{box-shadow:2px 2px 12px 0px hsla(0, 0%, 0%, 0.8)}
#index_product_line .project-box .project-item:hover .project-content .t{color:var(--color_eye);}
#index_product_line .project-box .project-item .project-img{width: 100%;height: 250px;overflow: hidden;}
#index_product_line .project-box .project-item .project-img img{width: 100%;}
#index_product_line .project-box .project-item .project-content{padding: 20px 10px 22px 20px;}
#index_product_line .project-box .project-item .project-content .t{margin-bottom:12px;font-size:1.8rem;}
#index_product_line .project-box .project-item .project-content .c{color:#666;height:200px;overflow:hidden;font-size:16px;line-height:1.7;}
#index_product_line .project-box .project-item .project-content .more{float:right;color:#666;}
#index_product_line .project-box .project-item .li-line{width:0;height:5px;background: var(--color_eye);position:absolute;left:0;bottom:0;transition:all 0.5s ease;}
#index_product_line .project-box .project-item:hover .li-line{ width:100%;}
.imgZoom{overflow:hidden;-webkit-transform:rotate(0);transform:rotate(0);}
.imgZoom img{width:100%;height:100%;vertical-align:bottom;-o-object-fit:cover;object-fit:cover;-moz-transition:all .8s ease 0s;-ms-transition:all .8s ease 0s;-o-transition:all .8s ease 0s;-webkit-transition:all .8s ease 0s;transition:all .8s ease 0s;}
.imgZoom:hover img{-moz-transform:scale(1.2,1.2);-ms-transform:scale(1.2,1.2);-o-transform:scale(1.2,1.2);-webkit-transform:scale(1.2,1.2);transform:scale(1.2,1.2);}
/* ----------------------------------------------------
06) start #heku-top #heku-top-topbar 顶部 topbar 模板:menu_banner 文件:heku-menu-1.php
-------------------------------------------------------*/
/* #heku_top_menu{height:70px;width:100%;position:relative;}
#heku_top_menu.header-is-visible{left:0;margin:auto;position:fixed !important;top:0;width:100%;z-index:99;-webkit-animation:300ms ease-in-out 0s normal none 1 running fadeInDown;animation:300ms ease-in-out 0s normal none 1 running fadeInDown;} */
/* ---06.1) heku-color 模板颜色管理 ------------- */
/* #heku_top_menu{background:var(--background_translucent);box-shadow:0px 3px 8px 0px rgba(0,0,0,0.16);}
#heku_top_menu.header-is-visible{box-shadow:0 0 60px 0 rgba(0,0,0,0.07);-webkit-box-shadow:0 10px 15px rgba(25,25,25,0.1);background:var(--background_translucent);}
#heku_top_menu.header-is-visible a{color:var(--background);}
#heku_top_menu.header-is-visible a:hover{color:var(--color_eye);}
.nav-logo .header-logo .logo{line-height:70px;} */
/* --- 06.2) nav-menu ------------- */
/* .nav-menu>li{line-height:70px;position:relative;display:inline-block;}
.nav-menu>li>a{display:block;text-transform:capitalize;letter-spacing:1px;padding:0px 28px 0;height:70px;line-height:70px;}
.nav-menu>li::after{z-index:100;height:3px;content:" ";position:absolute;width:0%;margin-left:10%;display:inherit;}
.nav-menu>li:hover::after{height:3px;content:" ";position:absolute;width:40%;margin-left:30%;display:inherit;}
.nav-menu .sub-menu li{list-style:none;position:inherit;}
.nav-menu .sub-menu li a{display:block;line-height:40px;height:40px;padding-left:20px;text-align:left;transition:.5s;letter-spacing:1px;opacity:1;font-size:14px;filter:alpha(opacity=100,style=100);}
.nav-menu>li:hover>.sub-menu{display:block;transition:1.5s;z-index:90;}
.nav-menu .sub-menu .sub-menu{top:3px;position:absolute;display:none;}
.nav-menu>li>.sub-menu{display:none;padding-top:3px;width:100%;left:0;position:absolute;}
.nav-menu>li::after{background:var(--forecolor);}
.nav-menu>li:hover a,.nav-menu li:focus a{color:var(--forecolor);}
.nav-menu>li:hover::after{background:var(--forecolor);}
.nav-menu>li>.sub-menu{background:rgba(255,255,255,0.85);-webkit-background:rgba(255,255,255,0.85);-o-background:rgba(255,255,255,0.85);-moz-background:rgba(255,255,255,0.85);box-shadow:0 3px 6px -4px rgba(0,0,0,0.12),0 6px 16px 0 rgba(0,0,0,0.08),0 9px 28px 8px rgba(0,0,0,0.05);} */
/* --- 06.2) nav-menu - ------------- */
.sub-menu-0:hover li:first-child>.sub-menu,.depth-0:hover .sub-menu-0 li:first-child>.sub-menu{display:block;}
/* --- 1) 下拉菜单 展示模板 1 heku-menu-type2 --- */
li.depth-0.heku-menu-type2 li.depth-1{display:none;}
li.depth-0.heku-menu-type2:hover li.depth-1{display:block;}
li.depth-0.heku-menu-type2 ul.sub-menu-0 .container li.depth-1:hover>a:after,li.depth-0.heku-menu-type2:hover li.depth-1:first-child>a:after{content:"➤";float:right;padding-right:12px;color:#235bb8;position:relative;top:0px;line-height:60px;display:block}
li.depth-0.heku-menu-type2 ul.sub-menu-0 .container:hover li .sub-menu,li.depth-0.heku-menu-type2 .container:hover li.depth-1>a:after{display:none;}
li.depth-0.heku-menu-type2 ul.sub-menu-0 .container li:hover>.sub-menu{display:block;}
li.depth-0.heku-menu-type2 ul.sub-menu-0 li.depth-1>a{width: 250px;border-bottom:1px solid #5a87d0;line-height:60px;height:60px;padding-left:0px;position:inherit;}
li.depth-0.heku-menu-type2 ul.sub-menu-0 li.depth-1:hover>a span{color:#235bb8;font-weight:bold;}
li.depth-0.heku-menu-type2 ul.sub-menu-0 li.depth-1>a span{line-height:60px;height:60px;font-size:16px;padding-left:10px;color:#333;}
li.depth-0.heku-menu-type2 ul.sub-menu-0 li.depth-1 .catimg{display:inline-block;vertical-align:middle;margin-right:0px;width:50px;height:50px;margin-left:5px;}
li.depth-0.heku-menu-type2:hover>.sub-menu{height:100%;transition:1.5s;position:fixed;}
li.depth-0.heku-menu-type2>.sub-menu-1{height:200px}
li.depth-0.heku-menu-type2 ul.sub-menu-0 .sub-menu-1{top:3px;margin-left:250px;position:absolute;display:none;}
li.depth-0.heku-menu-type2 ul.sub-menu li.depth-1{list-style:none;width:250px;position:absolute;}
li.depth-0.heku-menu-type2 ul.sub-menu li.depth-1:nth-child(1) a{top:0px}
li.depth-0.heku-menu-type2 ul.sub-menu li.depth-1:nth-child(2) a{top:60px}
li.depth-0.heku-menu-type2 ul.sub-menu li.depth-1:nth-child(3) a{top:120px}
li.depth-0.heku-menu-type2 ul.sub-menu li.depth-1:nth-child(4) a{top:180px}
li.depth-0.heku-menu-type2 ul.sub-menu li.depth-1:nth-child(5) a{top:240px}
li.depth-0.heku-menu-type2 ul.sub-menu li.depth-1:nth-child(6) a{top:300px}
li.depth-0.heku-menu-type2 ul.sub-menu li.depth-1:nth-child(7) a{top:360px}
li.depth-0.heku-menu-type2 ul.sub-menu li.depth-1:nth-child(8) a{top:420px}
li.depth-0.heku-menu-type2 ul.sub-menu-0 li .sub-menu-1 li{width:800px}
li.depth-0.heku-menu-type2:hover>.sub-menu {
width:1200px;
left:calc((100% - 1200px) / 2 );
border-radius:0 0 8px 8px;
top:126px;
background: rgb(208 229 239 / 55%);
-webkit-background:rgb(208 229 239 / 55%);
-o-background:rgb(208 229 239 / 55%);
-moz-background:rgb(208 229 239 / 55%);
box-shadow:0 3px 6px -4px rgba(0,0,0,0.12),0 6px 16px 0 rgba(0,0,0,0.08),0 9px 28px 8px rgba(0,0,0,0.05);
}
/* ----------------------------------------------------
6.1 ) #index_partner_line 首页 Why Choose Us 模块 CSS
------------------------------------------------------- */
#index_partner_line{background:#e1f5f5;}
#index_partner_line .partner-div .img{padding:15px 30px;background:#fff;border-radius:10px;overflow:hidden;box-shadow:1px 1px 8px 0px hsla(0,0%,0%,0.2);}
#index_partner_line .partner-div .img img{width:100%;height:auto;}
#index_service_line{background-image:url(../img/service-bg.jpg);background-position:center center;background-repeat:no-repeat;background-size:cover;background-attachment:fixed;position:relative;}
#index_service_line .background-overlay{background-color:#00A0E9;opacity:0.8;transition:background 0.3s,border-radius 0.3s,opacity 0.3s;height:100%;width:100%;top:0;left:0;position:absolute;}
.service-left-title{font-size:3rem;color:#fff;text-shadow:2px 2px 4px rgba(0,0,0,0.5);}
.service-left-text{padding:30px 30px 15px 0px;display:block;color:#fff;font-size:1.2rem;}
.service-right-title{font-size:1.5rem;padding-bottom:15px;color:#fff;text-shadow:2px 2px 4px rgba(0,0,0,0.5);}
.service-right-text{color:#fff;height:200px;overflow:hidden;}
.service-right-icon i{font-size:3.6rem;color:#fff;}
#index_project_line .project-item .project-img{width:100%;height:360px;overflow:hidden;border-radius:10px 10px 10px 10px;align-items:flex-end;height:450px;}
#index_project_line .project-content{z-index:99;text-align:left;position:relative;opacity:0;}
.project-background-overlay{background-color:#00A0E9;opacity:0;transition:background 0.3s,border-radius 0.3s,opacity 0.3s;height:450px;width:100%;top:0;left:0;position:absolute;z-index:100;border-radius:10px;}
#index_project_line .project-content .t{font-size:2rem;padding:10px 0px;}
#index_project_line .project-item:hover .project-background-overlay{opacity:0.4;}
#index_project_line .project-item:hover .project-content{opacity:1;-webkit-transition-delay:.1s;transition-delay:.1s;-webkit-transform:translate(0,-16px);-ms-transform:translate(0,-16px);transform:translate(0,-16px);top:-250px;z-index:101;padding:25px;color:#fff;}
/* .service-right-icon {margin:0} */
/* --- 1) 下拉菜单 展示模板 3 heku-menu-type3 --- */
/* li.depth-0.heku-menu-type3 ul.sub-menu-0{width:270px}
li.depth-0.heku-menu-type3 ul.sub-menu-0 li.depth-1>a span{line-height:60px;height:60px;font-size:16px;padding-left:10px;color:#333;}
li.depth-0.heku-menu-type3 ul.sub-menu-0 li.depth-1 .catimg{display:inline-block;vertical-align:middle;margin-right:0px;width:50px;height:50px;margin-left:5px;}
li.depth-0.heku-menu-type3 ul.sub-menu-0 li.depth-1>a{line-height:60px;height:60px;padding-left:10px;}
li.depth-0.heku-menu-type3 ul.sub-menu-0 li.depth-1:hover>a span{color:#235bb8;font-weight:bold;}
.list-style01 li .list-img a{height:140px;display:initial;padding:0;}
.list-style01 li .list-summary{line-height:32px;}
.sub-menu .list-style01 a.more{text-align:center;padding-left:0px;display:inline-block;width:122px;height:40px;border:1px solid #235ab7;border-radius:20px 20px;color:#235bb7;margin-top:15px;margin-left:30px;}
.sub-menu .list-style01 a.more:hover{background:rgba(35,91,184,0.65);-webkit-background:rgba(76,81,216,0.65);-o-background:rgba(76,81,216,0.65);-moz-background:rgba(76,81,216,0.65);color:#fff;}
.sub-menu .list-style01 a.more:hover i{display:none;}
li.depth-0.heku-menu-type2:hover>.sub-menu{height:440px;}
#heku_top_menu .search-info{line-height:70px;padding-right:20px;} */
/* @media only screen and (min-width:768px) and (max-width:991px) {
.nav-menu>li>a{padding:0px 17px 0;}
} */
/* --- 1) 小于780尺寸时候使用 手机 mobile --- */
/* @media only screen and (max-width:768px){
.top_menu_logo img{font-size:36px;padding:10px;height:70px;}
.mob-button i{font-size:40px;line-height:70px;}
.nav-menu li:hover>.sub-menu{display:none;}
.nav-menu>li{border-bottom:1px solid #235bb8b8;height:55px;}
.nav-menu>li:nth-child(7){border-bottom:0px solid #235bb8b8;}
.nav-menu>li::after,.nav_menu .menu-item-has-children:after,.nav_menu>li:hover::after{width:20px;content:"➤";float:right;padding-right:12px;color:#171a89;position:absolute;top:0;right:40px;line-height:55px;background:none;}
.nav-menu>li>a{padding:0;padding-left:32px;height:55px;line-height:55px;}
.nav-menu>li{background-image:none;display:block;text-align:left;}
.nav-menu{display:none;background:rgba(255,255,255,0.9);z-index:100;}
.nav-menu li:hover>.sub-menu{position:initial;}
.nav-menu .sub-menu .sub-menu{top:auto;left:auto;}
.nav-menu .sub-menu{width:auto;}
.nav-menu .sub-menu li{width:auto;}
.nav-menu .sub-menu .sub-menu li a{padding-left:80px;}
.nav-menu .sub-menu li a{width:240px;padding-left:50px;}
.search-info{display:none;}
} */
/* --- 2) 大于768px尺寸 min --- */
/* @media(min-width:768px){
.nav-menu>li>a{padding:0px 6px 0;font-size:13px;}
.nav-menu>li:nth-child(6):hover .sub-menu .sub-menu{top:0px;left:-180px;}
} */
/* --- 3) 大于992px尺寸 mid --- */
/* @media(min-width:992px){
.search-info,.menu_right{display:block;}
.nav-menu>li>a{padding:0px 17px 0;font-size: 14px;}
} */
/* --- 4) 显示规定 大于1200尺寸时候使用 max --------- */
/* @media(min-width:1200px){
.nav-menu>li>a{padding:0px 28px 0;font-size: 16px;}
} */
/* --- 06.3) #heku-search-info #heku-search-info 顶部 搜索 -----*/
#heku_search_info{background:rgba(35,91,184,0.65);-webkit-background:rgba(76,81,216,0.65);-o-background:rgba(76,81,216,0.65);-moz-background:rgba(76,81,216,0.65);}
#heku_search_info{position:fixed;top:70px;width:0%;height:54px;z-index:11;-webkit-transition:all 0.3s ease-out 0s;-moz-transition:all 0.3s ease-out 0s;-ms-transition:all 0.3s ease-out 0s;-o-transition:all 0.3s ease-out 0s;transition:all 0.3s ease-out 0s;visibility:hidden;}
#heku_search_info.opened{width:100%;left:auto;right:0;visibility:visible;opacity:1;}
#heku_search_info .head-search-from input{width:100%;padding:0px 24px;border:none;height:54px;color:#ffffff;font-size:24px;font-weight:400;background-color:transparent;}
#heku_search_info .head-search-from input::placeholder{color:#fff;text-transform:capitalize;font-size:20px;}
#heku_search_info .head-search-from input:focus{border:none;outline:none;}
#heku_search_info .head-search-from input:focus::placeholder{opacity:0;}
#heku_search_info .head-search-from button{position:absolute;top:50%;right:50px;-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);background:transparent;font-size:20px;font-weight:100;color:#fff;outline:none;border:none;}
#heku_search_info .head-search-from .delete-ico{position:absolute;top:50%;right:20px;-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);background:transparent;font-size:20px;font-weight:100;color:#fff;}
/* ----------------------------------------------------
06) end #heku-top #heku-top-topbar 顶部 topbar 模板:menu_banner 文件:heku-menu-1.php
-------------------------------------------------------*/
/* ----------------------------------------------------
07) end #Carousel_Banner 公共样式 顶部导航 banner 内敛 bootstrast 轮播插件 模板:menu_banner 文件:heku-banner-1.php
------------------------------------------------------- */
/* ----------------------------------------------------
12) start # 分页 css
------------------------------------------------------- */
.page_bar_1 .page_arr_left{text-align: left}
.page_bar_1 .page_arr_center{text-align: center}
.page_bar_1 .page_arr_center a{padding: 1px 10px;}
.page_bar_1 .page_arr_center a.current,.page_bar_1 .page_arr_center a:hover{background:#4473c3;color:#fff;border-radius:50% 50%;}
.page_bar_1 .page_arr_center a{font-size: 18px;color: #323232;}
.page_bar_1 .page_arr_right{text-align: right}
.page_bar_1 .pages-row{line-height:30px}
.page_bar_1 .transition{-webkit-transition:all 0.4s ease;transition:all 0.4s ease;}
.page_bar_1 .pages-row b{width:10%;height:1px;background-color:#000;display:inline-block;display:inline;zoom:1;vertical-align:middle;margin:0 10px;}
.page_bar_1 a:hover b{width:40%;background-color: #235bb8;}
.page_bar_1 a{margin: 0 6px;}
.page_bar_1 .pointernone{pointer-events:none;color:#ddd;}
.page_bar_1 .pages-row .pointernone b{background-color:#ddd; }
.page_bar_1 a{color: #666;}
.page_bar_1 a:hover{color: #235bb8;}
.page_bar_2 .page_arr_left,.page_bar_2 .page_arr_center,.page_bar_2 .page_arr_right{display: inline-block;}
.page_bar_2 .page_arr_center a.current,.page_bar_2 .page_arr_center a:hover{background:#4473c3;color:#fff;border-radius:50% 50%;}
.page_bar_2 a{font-size: 18px;color: #323232;}
.page_bar_2 a{padding: 1px 10px;}
.page_bar_2 .pages-row{line-height:30px;text-align: center}
.page_bar_2 a{margin: 0 6px;}
.page_bar_2 a{color: #666;}
.page_bar_2 .page_arr_left a:hover,.page_bar_2 .page_arr_right a:hover{color:#4473c3;}
/* ----------------------------------------------------
12) end # 分页 css
------------------------------------------------------- */
/* ----------------------------------------------------
41) .single-title 详情单页 分栏布局,顶部布局,列表
---------------------------------------------------- */
.single-title{font-size:24px;color:var(--forecolor);text-shadow:var(--text_shadow);line-height:1.5em;text-align:center;padding:10px 10px;}
.single-meta-row{border-bottom:1px solid var(--deep_background_translucent);padding-bottom:12px;text-align:center;margin:0 30px 20px 30px;}
.single-meta-row .single-meta-ul{display:flex;align-items:center;color:#666;border-bottom:1px solid rgb(224 214 214);padding-bottom:12px;}
.single-meta-row .single-meta-ul li{margin-right:24px;list-style:none;}
.single-meta-row li{padding:0 10px 0 10px;font-weight:600;opacity:0.7;}
.single-meta-row li .icon{padding:0 5px 0 0px}
.single-meta-row li:hover{color:var(--color_eye);font-weight:600;opacity:1;}
.single-meta-row .single-meta-post{display:inline-block;}
.single-meta-row .single-meta-post li{list-style:none;display:inline-block;line-height:25px;}
.single-meta-row .single-meta-cat{display:inline-block;}
.single-meta-row .single-meta-cat li{list-style:none;display:inline-block;opacity:1;}
/* ----------------------------------------------------
42) .single-info 详情单页 分栏布局,内容详情 Css
---------------------------------------------------- */
.single-info{position:relative;margin-bottom:24px;padding:20px 25px;}
.single-info p{line-height:1.6em;font-size:1.1em;padding:0px 5px 10px 5px;color:var(--forecolor);text-shadow:var(--text_shadow);}
.single-info img{max-width:100%;display:inline-block;max-width:100% !important;height:auto;cursor:-webkit-zoom-in;cursor:zoom-in;margin:5px 0;border-radius:var(--radius-img);-webkit-transition:-webkit-transform 0.35s,-webkit-box-shadow 0.35s;transition:transform 0.35s,box-shadow 0.35s;transition:transform 0.35s,box-shadow 0.35s,-webkit-transform 0.35s,-webkit-box-shadow 0.35s;}
.single-info img:hover{-webkit-transform:translateY(-5px);transform:translateY(-5px);-webkit-box-shadow:0 34px 20px -24px rgba(136,161,206,0.3);box-shadow:0 34px 20px -24px rgba(136,161,206,0.3);}
.single-info .hekutitle01{margin:8px 0 10px;font-weight:500;font-size:1.5em;line-height:1.6em;}
.single-info .hekutitle01{color: var(--forecolor);text-shadow: var(--text_shadow);}
.single-info .hekutitle01::before{position:relative;display:inline-block;vertical-align:middle;content:" ";margin-right:8px;background-position:center;background-repeat:none;top:-2px;left:0;width:20px;height:20px;background-size:auto 100%;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAVJJREFUWEftl7FKw1AUhv9rbmf1PRw6utkHEOoi6WPoE1ifQJ8gySKCOtRFRBKsDuIiDdZAURBFF50M2sFIzpGogVK03JA2cbh3S/i55zvfvYETgRyLj5erIKOO949FyKm5eHvvHEBV2jyruq1QDQ7n2DNXALEx+D7e2vl6lBYp76scHCzErtmCEPVhqEIAfus8BZk4wM+Zd/46tskDeI0mgLUyAdoAFsoDcM0XCDFdHoDX4FGfbRF3QANoA9qANqANaAPawD82EEWId1sAOJQWz6iO+5nGch41kDw9I3bbYOaTis21wgG4G4AuAzCwXrEoGV6V1ngMJPoPjoB+PzSIa8KBr1QdwFgA6KID7t1AgFYNC5uqxZNcbgB+eASdngHM+9LmpSzF8wFEEagbgHvXoQA3s3aegmYz8P1f4NNVME+39z5e3w4lkSMc3GXtPM1/AjYDFjDGddN5AAAAAElFTkSuQmCC);}
.entry-content {position:relative;}
.entry-content p{line-height:1.6em;font-size:1.1em;padding:0px 5px 10px 5px;color:var(--forecolor);text-shadow:var(--text_shadow);}
.entry-content img{max-width:100%;display:inline-block;max-width:100% !important;height:auto;cursor:-webkit-zoom-in;cursor:zoom-in;margin:5px 0;-webkit-transition:-webkit-transform 0.35s,-webkit-box-shadow 0.35s;transition:transform 0.35s,box-shadow 0.35s;transition:transform 0.35s,box-shadow 0.35s,-webkit-transform 0.35s,-webkit-box-shadow 0.35s;}
.entry-content img:hover{-webkit-transform:translateY(-5px);transform:translateY(-5px);-webkit-box-shadow:0 34px 20px -24px rgba(136,161,206,0.3);box-shadow:0 34px 20px -24px rgba(136,161,206,0.3);}
.entry-content img{max-width:100% !important;}
.entry-content .single-meta-cat{display:inline-block;padding:5px 2px 10px 0px;}
.entry-content .single-meta-cat li{list-style:none;display:inline-block;opacity:1;background:var(--background_translucent);border-radius:18px;-webkit-box-shadow:0px 2px 4px 1px rgb(75 75 75 / 21%);box-shadow:0px 2px 4px 1px rgb(75 75 75 / 21%);padding:3px 18px 3px 10px;font-weight:500;margin-right:8px;}
.entry-content .single-meta-cat li .icon{padding:0px 6px 0px 0px;}
.entry-content table{margin:8px auto;border-spacing:0;border-collapse:unset !important;max-width:100%;background:var(--background_translucent_3);border-radius:var(--radius_big);}
.entry-content table th{line-height:36px;}
.entry-content table td{text-align:center;line-height:36px;border:1px solid #fff;padding: 0px 8px;}
.entry-content table tr:first-child td:first-child{border-top-left-radius:6px;}
.entry-content table tr:first-child td:last-child{border-top-right-radius:6px;}
.entry-content table tr:last-child td:first-child{border-bottom-left-radius:6px;}
.entry-content table tr:last-child td:last-child{border-bottom-right-radius:6px;}
.entry-content table tr:nth-child(2n+1){background:var(--background_translucent);}
/* ----------------------------------------------------
43) .single-sidebar 新闻侧边栏 ,展示模板:Sing-news-temp01 css样式
------------------------------------------------------- */
.single-sidebar.sidebar-right{padding:0px 0px 0px 32px;width:320px;}
.single-sidebar{padding:0px 32px 0px 0px;width:320px;}
.about-header,.toc-header{font-size:24px;padding:15px 15px 12px 25px;border-bottom:1px solid var(--forecolor);border-bottom-style:dashed;color:var(--forecolor);}
.about-header .icon,.toc-header .icon{font-size:24px;padding:0 12px 0 0px;}
/* --- 1) .sidebar-nav-menu 产品列表 css --- */
.sidebar-nav-menu > li .sidebar-cat-img{width: 72px;padding: 0 10px;}
.sidebar-nav-menu > li{list-style: none;line-height:60px;overflow: hidden;}
.sidebar-nav-menu .current-menu-item .sub-menu-0{max-height: 500px;overflow: hidden;}
.sidebar-nav-menu > li .icon:before{content:"\e615";}
.sidebar-nav-menu li.current-menu-item .icon:before{content:"\e617";}
.sidebar-nav-menu > li .icon{float: right;padding-right:12px;}
.sidebar-nav-menu .sub-menu-0 {padding: 0 20px;max-height: 0px;-webkit-transition:all 0.7s ease-out 0s;-moz-transition:all 0.7s ease-out 0s;-ms-transition:all 0.7s ease-out 0s;-o-transition:all 0.7s ease-out 0s;transition:all 0.7s ease-out 0s;}
.sidebar-nav-menu .sub-menu-0 > li{border-bottom:1px solid var(--forecolor);border-bottom-style:dashed;color:var(--forecolor);list-style:none;}
.sidebar-nav-menu li.current-menu-item .sidebar-menu-li,.sidebar-nav-menu > li:hover .sidebar-menu-li{background:var(--forecolor_translucent_3) ;border:1px solid #ceb4b4;border-right:3px solid #e32626;border-left:3px solid #e32626;}
.sidebar-nav-menu li.current-menu-item .sidebar-menu-li a span,.sidebar-nav-menu > li:hover .sidebar-menu-li a span{font-size:20px;color:var(--color_eye);}
.sidebar-nav-menu li .sidebar-menu-li a span{font-size:18px;}
.sidebar-nav-menu li .sidebar-menu-li{padding: 0 6px;}
.sidebar-nav-menu .sub-menu-0 > li:last-child{border-bottom: none;}
/* --- 2) .about-sidebar 相关推荐 新闻列表 css --- */
.about-sidebar{position:sticky;overflow:hidden;margin-bottom:24px;}
.about-container{padding: 10px 8px 8px 12px;}
.about-container .news-img img{width:100px;height:64px;border-radius:var(--radius_img);display:block;cursor:pointer;}
.about-container .news-item{visibility:visible;animation-name:fadeInUp;padding:8px 0px;font-weight:400;display:-webkit-box;display:-ms-flexbox;display:flex;}
.about-container .news-item:hover,.about-sidebar .news-item:hover a{color:var(--color_eye);}
.about-container .news-comt{-webkit-box-orient:vertical;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;margin-left:12px;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;}
.about-container .news-comt .news-tit a{font-family:PingFangSC-Regular;font-weight:400;font-size:16px;line-height:22px;letter-spacing:0;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;cursor:pointer;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-box-orient:vertical;}
.about-container .news-comt .news-attribute{font-size: 14px;opacity: 0.6;padding-right: 8px;}
.about-container .news-comt .news-attribute .single-eye .icon{font-size:14px;padding-right:6px;}
/* --- 3) .toc-sidebar 自动文章目录 css --- */
.toc-sidebar{position:sticky;z-index:2;top:91px;-webkit-transition:top 0.35s;transition:top 0.35s;overflow:hidden;margin-bottom:30px;}
.toc-container{padding:10px 15px 18px 25px;}
.toc-container .toc-list{margin:0;padding-left:10px}
.toc-container .toc-list li{list-style:circle;padding:5px 0px 5px 0px;}
.toc-container .toc-list > li.is-active-li{color:var(--color_eye);}
.toc-container .toc-list li ol.toc-list li{list-style:disc;opacity:0.86;}
.toc-container .toc-list>li a.toc-link{font-size:18px;width:200px;}
.toc-container .toc-list ol.toc-list{padding-left:20px;}
.toc-container .toc-link{color:currentColor;height:100%}
.toc-container .is-collapsible{max-height:1000px;overflow:hidden;transition:all 300ms ease-in-out}
.toc-container .is-collapsed{max-height:0}
.toc-container .is-position-fixed{position:fixed !important;top:0}
.toc-container .is-active-link{font-weight:600}
.toc-container .toc-link::before{background-color:rgb(248,248,248);content:' ';display:inline-block;height:inherit;left:0;margin-top:-1px;position:absolute;width:2px}
.toc-container .is-active-link::before{background-color:var(--color_eye);}
/* --- 1) 小于780尺寸时候使用¸ --- sm --- */
@media only screen and (max-width:768px){
.single-sidebar{padding:0px 32px 0px 0px;width:320px;}
}
/* --- 1) 小于780尺寸时候使用 手机 mobile --- */
@media (max-width:576px){
.single-sidebar{padding:0px 32px 0px 0px;width:320px;}
}
/* --- 2) 大于768px尺寸 min --- */
@media(min-width:768px){
.single-sidebar{padding:0px 0x 0px 0px;width:0px;}
}
/* --- 3) 大于992px尺寸 mid --- */
@media(min-width:992px){
.single-sidebar{padding:0px 32px 0px 0px;width:320px;}
}
/* --- 4) 显示规定 大于1200尺寸时候使用 max --------- */
@media(min-width:1200px){
.single-sidebar{padding:0px 32px 0px 0px;width:320px;}
}
/* ----------------------------------------------------
49) .post-pre 下一页,上一页 Css样式
------------------------------------------------------- */
.post-pre-next{margin-bottom:25px;}
.post-pre-next > div{width:49%;}
.post-pre-next-tit a{font-weight:400;font-size:20px;line-height:32px;letter-spacing:0;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;cursor:pointer;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-box-orient:vertical;}
.post-pre-next-info{position:relative;z-index:2;}
.post-pre-next-info{width:100%}
.post-next .post-pre-next-info{text-align:right;padding:10px 60px 8px 8px;}
.post-pre .post-pre-next-info{padding:10px 8px 8px 60px;}
.post-pre .next-jt{left:10px;}
.post-next .next-jt{right:16px}
.next-jt{position:absolute;top:calc(50% - 15px);color:#ccc}
.next-jt .icon{font-size:30px;background-color:rgba(255,255,255,0.45);line-height:34px;height:30px;width:30px;display:block;}
.post-pre-next-time{font-size:14px;padding:10px 2px;opacity:0.9;}
/* --------------------------------------------------------------------------
70). Viewer.js js 支持的css 用于点击放大图片使用
-------------------------------------------------------------------------- */
.viewer-zoom-in::before,.viewer-zoom-out::before,.viewer-one-to-one::before,.viewer-reset::before,.viewer-prev::before,.viewer-play::before,.viewer-next::before,.viewer-rotate-left::before,.viewer-rotate-right::before,.viewer-flip-horizontal::before,.viewer-flip-vertical::before,.viewer-fullscreen::before,.viewer-fullscreen-exit::before,.viewer-close::before{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAARgAAAAUCAYAAABWOyJDAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNui8sowAAAQPSURBVHic7Zs/iFxVFMa/0U2UaJGksUgnIVhYxVhpjDbZCBmLdAYECxsRFBTUamcXUiSNncgKQbSxsxH8gzAP3FU2jY0kKKJNiiiIghFlccnP4p3nPCdv3p9778vsLOcHB2bfveeb7955c3jvvNkBIMdxnD64a94GHMfZu3iBcRynN7zAOI7TG15gHCeeNUkr8zaxG2lbYDYsdgMbktBsP03jdQwljSXdtBhLOmtjowC9Mg9L+knSlcD8TNKpSA9lBpK2JF2VdDSR5n5J64m0qli399hNFMUlpshQii5jbXTbHGviB0nLNeNDSd9VO4A2UdB2fp+x0eCnaXxWXGA2X0au/3HgN9P4LFCjIANOJdrLr0zzZ+BEpNYDwKbpnQMeAw4m8HjQtM6Z9qa917zPQwFr3M5KgA6J5rTJCdFZJj9/lyvGhsDvwFNVuV2MhhjrK6b9bFiE+j1r87eBl4HDwCF7/U/k+ofAX5b/EXBv5JoLMuILzf3Ap6Z3EzgdqHMCuF7hcQf4HDgeoHnccncqdK/TvSDWffFXI/exICY/xZyqc6XLWF1UFZna4gJ7q8BsRvgd2/xXpo6P+D9dfT7PpECtA3cnWPM0GXGFZh/wgWltA+cDNC7X+AP4GzjZQe+k5dRxuYPeiuXU7e1qwLpDz7dFjXKRaSwuMLvAlG8zZlG+YmiK1HoFqT7wP2z+4Q45TfEGcMt01xLoNZEBTwRqD4BLpnMLeC1A41UmVxsXgXeBayV/Wx20rpTyrpnWRft7p6O/FdqzGrDukPNtkaMoMo3FBdBSQMOnYBCReyf05s126fU9ytfX98+mY54Kxnp7S9K3kj6U9KYdG0h6UdLbkh7poFXMfUnSOyVvL0h6VtIXHbS6nOP+s/Zm9mvyXW1uuC9ohZ72E9uDmXWLJOB1GxsH+DxPftsB8B6wlGDN02TAkxG6+4D3TWsbeC5CS8CDFce+AW500LhhOW2020TRjK3b21HEmgti9m0RonxbdMZeVzV+/4tF3cBpP7E9mKHNL5q8h5g0eYsCMQz0epq8gQrwMXAgcs0FGXGFRcB9wCemF9PkbYqM/Bas7fxLwNeJPdTdpo4itQti8lPMqTpXuozVRVXPpbHI3KkNTB1NfkL81j2mvhDp91HgV9MKuRIqrykj3WPq4rHyL+axj8/qGPmTqi6F9YDlHOvJU6oYcTsh/TYSzWmTE6JT19CtLTJt32D6CmHe0eQn1O8z5AXgT4sx4Vcu0/EQecMydB8z0hUWkTd2t4CrwNEePqMBcAR4mrBbwyXLPWJa8zrXmmLEhNBmfpkuY2102xxrih+pb+ieAb6vGhuA97UcJ5KR8gZ77K+99xxeYBzH6Q3/Z0fHcXrDC4zjOL3hBcZxnN74F+zlvXFWXF9PAAAAAElFTkSuQmCC");background-repeat:no-repeat;background-size:280px;color:transparent;display:block;font-size:0;height:20px;line-height:0;width:20px}
.viewer-zoom-in::before{background-position:0 0;content:"Zoom In"}
.viewer-zoom-out::before{background-position:-20px 0;content:"Zoom Out"}
.viewer-one-to-one::before{background-position:-40px 0;content:"One to One"}
.viewer-reset::before{background-position:-60px 0;content:"Reset"}
.viewer-prev::before{background-position:-80px 0;content:"Previous"}
.viewer-play::before{background-position:-100px 0;content:"Play"}
.viewer-next::before{background-position:-120px 0;content:"Next"}
.viewer-rotate-left::before{background-position:-140px 0;content:"Rotate Left"}
.viewer-rotate-right::before{background-position:-160px 0;content:"Rotate Right"}
.viewer-flip-horizontal::before{background-position:-180px 0;content:"Flip Horizontal"}
.viewer-flip-vertical::before{background-position:-200px 0;content:"Flip Vertical"}
.viewer-fullscreen::before{background-position:-220px 0;content:"Enter Full Screen"}
.viewer-fullscreen-exit::before{background-position:-240px 0;content:"Exit Full Screen"}
.viewer-close::before{background-position:-260px 0;content:"Close"}
.viewer-container{bottom:0;direction:ltr;font-size:0;left:0;line-height:0;overflow:hidden;position:absolute;right:0;-webkit-tap-highlight-color:transparent;top:0;-ms-touch-action:none;touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.viewer-container::-moz-selection,.viewer-container *::-moz-selection{background-color:transparent}
.viewer-container::selection,.viewer-container *::selection{background-color:transparent}
.viewer-container:focus{outline:0}
.viewer-container img{display:block;height:auto;max-height:none !important;max-width:none !important;min-height:0 !important;min-width:0 !important}
.viewer-canvas{bottom:0;left:0;overflow:hidden;position:absolute;right:0;top:0}
.viewer-canvas>img{height:auto;margin:15px auto;max-width:90% !important;width:auto}
.viewer-footer{bottom:0;left:0;overflow:hidden;position:absolute;right:0;text-align:center}
.viewer-navbar{background-color:rgba(0,0,0,0.66);overflow:hidden;padding:20px 0px}
.viewer-next{left:70%;position:relative}
.viewer-prev{left:27%;position:relative}
.viewer-next:hover,.viewer-prev:hover{color:#fff;text-decoration:none;outline:0;opacity:0.9}
.viewer-list{box-sizing:content-box;height:120px;margin:auto !important;overflow:hidden;padding:1px 0;width:auto !important;transform:none !important}
.viewer-list>li{color:transparent;cursor:pointer;font-size:0;height:120px;line-height:0;opacity:0.5;overflow:hidden;transition:opacity 0.15s;width:120px;display:inline-block}
.viewer-list>li:focus,.viewer-list>li:hover{opacity:0.75}
.viewer-list>li:focus{outline:0}
.viewer-list>li+li{margin-left:30px}
.viewer-list>.viewer-loading{position:relative}
.viewer-list>.viewer-loading::after{border-width:2px;height:20px;margin-left:-10px;margin-top:-10px;width:20px}
.viewer-list>.viewer-active,.viewer-list>.viewer-active:focus,.viewer-list>.viewer-active:hover{opacity:1}
.viewer-player{background-color:#000;bottom:0;cursor:none;display:none;left:0;position:absolute;right:0;top:0;z-index:1}
.viewer-player>img{left:0;position:absolute;top:0}
.viewer-toolbar>ul{position:absolute;top:40%;width:100%}
.viewer-toolbar>ul>li{background-color:rgba(0,0,0,0.5);border-radius:50%;cursor:pointer;float:left;height:24px;overflow:hidden;transition:background-color 0.15s}
.viewer-toolbar>ul>li:focus,.viewer-toolbar>ul>li:hover{background-color:rgba(0,0,0,0.8)}
.viewer-toolbar>ul>li:focus{box-shadow:0 0 3px #fff;outline:0;position:relative;z-index:1}
.viewer-toolbar>ul>li::before{margin:2px}
.viewer-toolbar>ul>li+li{margin-left:1px}
.viewer-toolbar>ul>.viewer-small{height:18px;margin-bottom:3px;margin-top:3px;width:18px}
.viewer-toolbar>ul>.viewer-small::before{margin:-1px}
.viewer-toolbar>ul>.viewer-large{height:30px;margin-bottom:-3px;margin-top:-3px;width:30px}
.viewer-toolbar>ul>.viewer-large::before{margin:5px}
.viewer-tooltip{background-color:rgba(0,0,0,0.8);border-radius:10px;color:#fff;display:none;font-size:12px;height:20px;left:50%;line-height:20px;margin-left:-25px;margin-top:-10px;position:absolute;text-align:center;top:50%;width:50px}
.viewer-title{color:#ccc;display:inline-block;font-size:12px;line-height:1.2;margin:0 5% 5px;max-width:90%;opacity:0.8;overflow:hidden;text-overflow:ellipsis;transition:opacity 0.15s;white-space:nowrap}
.viewer-title:hover{opacity:1}
.viewer-button{background-color:rgba(0,0,0,0.5);border-radius:50%;cursor:pointer;height:80px;overflow:hidden;position:absolute;right:-40px;top:-40px;transition:background-color 0.15s;width:80px}
.viewer-button:focus,.viewer-button:hover{background-color:rgba(0,0,0,0.8)}
.viewer-button:focus{box-shadow:0 0 3px #fff;outline:0}
.viewer-button::before{bottom:15px;left:15px;position:absolute}
.viewer-fixed{position:fixed}
.viewer-open{overflow:hidden}
.viewer-show{display:block}
.viewer-hide{display:none}
.viewer-backdrop{background-color:rgba(0,0,0,0.66)}
.viewer-invisible{visibility:hidden}
.viewer-move{cursor:move;cursor:-webkit-grab;cursor:grab}
.viewer-fade{opacity:0}
.viewer-in{opacity:1}
.viewer-transition{transition:all 0.3s}
.viewer-loading::after{-webkit-animation:viewer-spinner 1s linear infinite;animation:viewer-spinner 1s linear infinite;border:4px solid rgba(255,255,255,0.1);border-left-color:rgba(255,255,255,0.5);border-radius:50%;content:"";display:inline-block;height:40px;left:50%;margin-left:-20px;margin-top:-20px;position:absolute;top:50%;width:40px;z-index:1}
@-webkit-keyframes viewer-spinner{
0%{transform:rotate(0deg)}
100%{transform:rotate(360deg)}
}
@keyframes viewer-spinner{
0%{transform:rotate(0deg)}
100%{transform:rotate(360deg)}
}
@media (max-width:767px){
.viewer-hide-xs-down{display:none}
}
@media (max-width:991px){
.viewer-hide-sm-down{display:none}
}
@media (max-width:1199px){
.viewer-hide-md-down{display:none}
}
/* --------------------------------------------------------------------------
70). Viewer.js js 支持的css 用于点击放大图片使用
-------------------------------------------------------------------------- */
.heku-box{background:var(--background_translucent_3);border-radius:var(--radius_big);-webkit-box-shadow:var(--box_shadow);box-shadow:var(--box_shadow);}
.heku-img-box{background:var(--background_translucent_3);border-radius:var(--radius_big);}
/* ----------------------------------------------------
14-15) #Heku_Form_Model 表单 模板:TempParts/From/model-from 文件:TempParts/From/heku-model-from-1.php
------------------------------------------------------- */
#Heku_Form_Model .modal-content{border:0px solid rgba(0,0,0,.2);border-radius:.6rem;background:#dddddd73;box-shadow:2px 5px 15px rgb(0 0 0 / 0.8)}
#Heku_Form_Model .modal-content{background:#ddddddd6;}
#Heku_Form_Model .modal-header{padding:0.6rem 1rem;letter-spacing:1px;font-size:20px;text-shadow:var(--text_shadow);}
#Heku_Form_Model .modal-header button:focus{outline:0px auto #FFF}
#Heku_Form_Model .canvasreset{line-height:40px;display:inline-block;position:absolute;padding-left:8px;color:#5a5c67;}
#Heku_Form_Model .form-control{box-shadow:0px 0px 6px rgb(40 40 40);}
/* ----------------------------------------------------
14-15) #Heku_Form 表单 模板:TempParts/From/model-from 文件:TempParts/From/heku-model-from-1.php
------------------------------------------------------- */
#Heku_Form .needs-validation .invalid-feedback{margin-top: -16px;padding-left: 10px;margin-bottom: 10px;}
#Heku_Form #from_code.input-val{height: 38px;}
#Heku_Form input.input-val ,#Heku_Form .post-input input,#Heku_Form .post-input textarea,#Heku_Form .post-input select{font-size: 14px;width: 100%;height: 42px;line-height: 42px;padding: 0 20px;border: 1px solid #f5f5f5;box-shadow: 0px 1px 4px rgba(0,0,0,0.16);text-shadow: var(--text_shadow);}
#Heku_Form input.input-val:focus,#Heku_Form .post-input input:focus,#Heku_Form .post-input textarea:focus,#Heku_Form .post-input select:focus{border-color: #efefef;outline: none;background: #fafafa;box-shadow: 0px 2px 4px rgba(0,0,0,0.16);}
#Heku_Form .post-input input::placeholder,#Heku_Form .post-input textarea::placeholder{font-weight: 500;color: #686777;}
#Heku_Form .post-input input:focus::placeholder,#Heku_Form .post-input textarea:focus::placeholder{opacity: 0;}
#Heku_Form .post-input textarea{height: 160px;line-height: 32px;resize: none;padding: 10px 20px;}
.canvasreset{line-height: 40px;display: inline-block;position: absolute;padding-left: 8px;color: #b8b7b2;}
#canvas{background:#ddd;display:inline-block;border:0.5px solid #fff;cursor:pointer;border-radius:6px;margin-left:10px;}
/* ----------------------------------------------------
25) .contact-info 联系我们 模板:TempParts/From/page-contact.php 文件:TempParts/From/page-contact-1.php
------------------------------------------------------- */
.contact-info-left .contact-info-li{padding:10px 0px;}
.contact-info-left .contact-info-box{width: 94%;padding: 10px 32px;border-radius: 6px;box-shadow: 0px 1px 4px rgba(0,0,0,0.16);}
.contact-info-left .contact-info-tit{font-family: sans-serif;font-size: 24px;letter-spacing: 2px;line-height: 60px;}
.contact-info-left .heku-icons li:before{content:"";position:absolute;left:0;top: 2px;width: 28px;height: 28px;display:block;}
.contact-info-left .heku-icons li.contact-addr:before{background:url(/wp-content/themes/heku-cms/assets/img/dizhiguanli-lan.svg);background-size: 30px auto;}
.contact-info-left .heku-icons li.contact-addr .add_logo{width:25px;margin:0px 5px 0px 18px;top:2px;position:absolute;}
.contact-info-left .heku-icons li.contact-addr .addr_mapbtn{font-size:16px;color:#b8b8b9;line-height:18px;padding-left:50px;}
.contact-info-left .heku-icons li.contact-phone:before{background:url(/wp-content/themes/heku-cms/assets/img/dianhua-lan.svg);background-size: 30px auto;}
.contact-info-left .heku-icons li.contact-email:before{background:url(/wp-content/themes/heku-cms/assets/img/youxiang-lan.svg);background-size:30px auto;}
.contact-info-left .heku-icons li.contact-email a{color: #107abd;}
.contact-info-left li{list-style: none;position: relative;padding-left: 45px;margin: 10px 0px;font-size: 18px;color: #107abd;line-height: 32px;}
.contact-info-left .info-zaixian-bg{background-color: #5882ed;background-repeat: no-repeat;background-image: url(/wp-content/themes/heku-cms/assets/img/top.png);background-position: right;background-size: cover;height: 64px;position: relative;border-radius: 6px;}
.contact-info-left .info-zaixian-bg .logo{padding:8px;height:64px;}
.contact-info-left .info-zaixian-span{position:absolute;right:20px;top:14px;border:1px solid #FFF;background:transparent;color:#FFF;font-size:16px;padding:6px 16px;border-radius:5px;}
.contact-info-right .post-comment-tit{font-size: 28px;padding-bottom: 20px;}
/* ----------------------------------------------------
14-15) #heku_footer 表单 TempParts/Footer/footer 模板:TempParts/Footer/heku-footer-3.php
------------------------------------------------------- */
#heku_footer{background:#181b22 url(../img/footer-back.jpg) no-repeat top center;height:auto;position:relative;color:var(--deep_color_main);}
.footer-one-left{border-right:var(--boder_line);padding-right: 40px;padding: 13px 36px 12px 10px;max-width: 300px;}
.footer-one-left .footer-logo img{width: 50px;}
.footer-one-left .footer-logo .top-logo-font{padding-left:60px;font-size:30px;color:var(--deep_color_main);}
.footer-one-left .footer-logo .top-logo-font:hover{color: var(--color_eye);}
.footer-one-left .footer-logo-title:hover{font-size: 16px;color: var(--color_eye);}
.footer-one-left .footer-logo-title{font-size:18px;color:var(--deep_color_main);padding:10px 20px;display:block;text-align:center;}
.footer-one-left .footer-contact-ul li{list-style: none;color:var(--deep_color_main);padding: 6px 0px;}
.footer-one-left .footer-contact-ul li a span{font-size: 16px;font-weight: bold;}
.footer-one-left .footer-contact-ul li a:hover,.footer-contact-ul li:hover i,.footer-contact-ul li:hover span{color: var(--color_eye);}
.footer-one-left .footer-contact-ul li i{margin-right: 8px;}
.footer-one-left .footer-contact-ul li a {color: var(--deep_color_main);}
.footer-one-right li a{color:var(--deep_color_main);display:block;line-height:34px;}
.footer-one-right .foot-link-title{font-size: 20px;font-weight: 500;width:auto;display:inline-block;margin-bottom:10px;color:var(--deep_color_main);line-height:48px;border-bottom:#a0a0a0 1px solid;cursor:text}
.footer-one-right .footer-product-link a{color:var(--deep_color_main);display:block;line-height:34px;}
.footer-one-right .footer-product-link{width:auto;display:inline-table;/* margin:0 58px; */}
.footer-one-right .footer-product-link:first-child{margin-left: 0px;}
.footer-one-right .footer-product-link:last-child{margin-right: 0px;}
.footer-two{position: relative;margin-top:25px;padding-top:15px;border-top:var(--boder_line);color:#a0a0a0;line-height: 36px;}
.footer-two .footer-copyright a{margin: 0 8px;color: #a0a0a0;}
.footer-two .footer-social li {display: inline-block;margin-left: 15px;}
.footer-two .footer-social li a {position: relative;display: inline-block;width: 32px;height: 32px;line-height: 32px;text-align: center;background: #f1f1f1;-webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 6px;}
.footer-two .footer-social li a:hover {background: var(--color_eye);color: var(--deep_color_main);}
.footer-two .footer-social li a {color: #86878a;}
.footer-one-right li a:hover,.footer-one-right li a:hover span{color: var(--color_eye);}
.footer-one-right li:hover .foot-link-title{border-bottom: var(--color_eye) 1px solid;color: var(--color_eye);}
/* --- 1) 小于780尺寸时候使用¸ --- sm --- */
@media only screen and (max-width:768px){
.footer-one{font: 1em sans-serif;}
.footer-one-left{max-width: 100%;border-right:0px;}
.footer-one-left .footer-logo-title{text-align: left;}
.footer-one-right{display: none;}
}
/* --- 1) 小于780尺寸时候使用 手机 mobile --- */
@media (max-width:576px){
.footer-one{font: 1em sans-serif;}
.footer-one-left{max-width: 100%;border-right:0px;}
.footer-one-left .footer-logo-title{text-align: left;}
.footer-one-right{display: none;}
}
/* --- 2) 大于768px尺寸 min --- */
@media(min-width:768px){
.footer-one{font: 1em sans-serif;}
.footer-one-left{max-width: 100%;border-right:0px;}
.footer-one-left .footer-logo-title{text-align: left;}
.footer-one-right{display: none;}
}
/* --- 3) 大于992px尺寸 mid --- */
@media(min-width:992px){
.footer-one-left .footer-logo .top-logo-font{padding-left:62px;line-height:50px;font-size:18px;color:var(--deep_color_main);}
.footer-one-left .footer-logo-title{font-size:14px;padding:12px 5px;}
.footer-one{font: 14px sans-serif;}
.footer-one-left{padding: 13px 24px 12px 10px;max-width: 280px;}
.footer-one-right{display: block;}
}
/* --- 4) 显示规定 大于1200尺寸时候使用 max --------- */
@media(min-width:1200px){
.footer-one{font: 1em sans-serif;}
.footer-one-left{border-right:var(--boder_line);padding-right: 40px;padding: 13px 36px 12px 10px;max-width: 300px;}
}
/* ----------------------------------------------------
14-15) #heku_footer 表单 TempParts/Footer/footer 模板:TempParts/Footer/heku-footer-3.php
------------------------------------------------------- */