@charset "utf-8";
/* CSS Document */
html {-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;}/* 防自定义背景色对网页的影响 */
body{background: #FFF; font-size:13px;color:#646464;font-family:"微软雅黑",Arial; }
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, hr, button, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section
{margin:0;padding:0;}/* 内外边距通常让各个浏览器样式的表现位置不同 */
body, button, input, select, textarea {font-family: "微软雅黑",Arial;}/* 表单元素并不继承父级font */
input, select, textarea {margin:0px;padding:0px;border:none;border:0;font-size:100%;}
table {border-collapse:collapse;border-spacing:0;}/* 去掉各Table cell 的边距并让其边重合 */
th {text-align:inherit;}/* IE bug fixed: th 不继承 text-align*/
img {border: 0px ;margin:0;padding:0;}/* 去除默认边框,消除下边距 */
iframe {display:block;}/* ie6 7 8(q) bug 显示为行内表现 */
button { cursor: pointer; }
ul,li{list-style:none;margin:0;padding:0; }/* 去掉列表前的标识, li 会继承，解决.ul标签在Mozilla中默认是有padding值的 */
li{list-style-position:outside;vertical-align:middle;}/*IE6 问题解决：ul左浮动后，内部li出现左边距,li内有div浮动时，li出现4px间距，这是IE6的bug*/
p{margin:0px;padding:0px;}
/*字体所有*/
h1, h2, h3, h4, h5, h6 {font-size:100%; }/* 标题自定义, 适应多个系统应用*/
em{float:left;font-style:normal;}
.f_12 {font-size:12px;}
.f_14 {font-size:14px;}
/*浮动和左中右对齐*/
.f_l{float:left;display: inline;}
.f_r {float:right;display: inline;}
.f_c{clear:both;}
.blank0{width:100%;height:0px;clear:both;overflow:hidden;}
/*超链接*/
a {text-decoration:none;color:#757575;}
a:hover {text-decoration:none;}
a:focus { outline: none; } /*点击链接时出现的虚线框消失，（消除焦点）*/
a:link,a:visited,a:active {text-decoration: none;}
a:hover {color:#6f3479;text-decoration: none;cursor:pointer}
input,textarea {border:1px #999999 solid;}
.f_a { width:1000px; margin:0px auto;}
/*首页样式*/
.zitiao{width:100%;background: linear-gradient(90deg, #6510ad 60%, #104fad);height: 6px}
.top{position:relative; z-index:1}
.top_box{width:1200px; margin: 0 auto;}
.top_l,.top_m{float: left}
.top_r{float:right}
.top_m ul li{float: left;padding-left: 40px;padding-right:40px}
.top_m ul li a{font-size: 20px;line-height: 92px}
.banners{width: 100%; position:relative; z-index:0; margin:0px auto;overflow: hidden }
.banners img{width:100%}
.bottom_m{width:100%;overflow: hidden; background:#362248}
.bottom_m_box{width: 1200px;margin: 0 auto}
.bottom_m_l{float:right;overflow: hidden;padding-top:30px;padding-right:25px}
.bottom_m_m{width:600px;float: left;overflow: hidden; padding-top:25px;padding-bottom:25px}
.bottom_m_m li{line-height:25px;color:#848484}
.b_zhinan,.b_fuwu,.b_zhifu,.b_lianxi{float: left;padding-left:33px;padding-right:33px}
.bottom_m_r{width:106px;height: 106px; float: right;padding-top:41px}
.erweima{float: right;width: 106px;}
.sao{float:left;width:80px;line-height:30px;}
.sao p{font-size: 15px;color:#848484}
.bottom_b{width: 100%;background:#2e1e3d;overflow: hidden;border-top: 1px #323232 solid}
.bottom_b_box{width: 1200px;margin: 0 auto;}
.bottom_b_box p{font-size: 13px;color: #8c8b8b;line-height:40px}
/*我们开始*/
.our{overflow:hidden;padding-top:25px}
.our_box{width:1200px;overflow: hidden;margin:0 auto;}
.our_l{float:left;width:70%;padding-right:20px}
.our_l p{font-size:15px;text-indent : 25px;line-height:35pt}
.our_l p span{font-weight: bold}
.our_r{float:left;width:30%}
.our_r img{width:100%;padding-top:14px}
/*我们结束*/
/*简介开始*/
.licheng,.yuanzhang{float:left;width:100%}
.licheng_bt,.yuanzhang_bt{font-size:18px;font-weight: bold;float:left;width:100%;padding-top:30px}
.licheng_nr{padding-top:8px;float:left;width:100%}
.licheng_nr p{}
.team_t {padding-top:76px;float:left;width:100%}
.team_t p{line-height:28px;font-size:16px;}
.team_b{padding-top:8px;float:left;width:100%;padding-bottom:15px}
.team_b li{width:239px;float:left;padding-left:2px;padding-top:8px}
.team_b li img{width:100%}
.yuanzhang_nr{width:80%;float:left;padding-top:27px;padding-right:10px}
.photo{width:20%;float:left}
.photo img{width:100%;padding-top:27px}
.xianrne_bt p {line-height:35px;text-indent:2em;}
.huashu{padding-top:20px;width:100%;line-height:33px;overflow:hidden;text-indent:2em;padding-bottom:25px}
.riqi {float:right}
/*简介结束*/
/*关于我们开始*/
.c_hang{ height:50px; border-bottom:#d9d9d9 2px solid;}
.c_hang_box{width:1200px;margin: 0 auto;text-align: center;}
.c_hang_l{float:left}
.women{float:left;height:50px;background-color:#52396c; width:100px}
.women p{font-size:18px;padding-top:12px;color:#f1f1f1}
.xiaohang{float: left; height:50px}
.xiaohang li{font-size:17px;float: left;padding-top:15px;width:130px}
.xiaohang li a:hover{color:#82428d;cursor:pointer}
.c_hang_z{float:right}
.c_hang_r{float:left;}
.c_hang_r p,.c_hang_z p{font-size:18px;padding-top:12px;color:#fff}
.c_hang_r p span,.c_hang_z p span{width:40px;padding-left:10px;padding-right:10px}
.c_hang_r p span a,.c_hang_z p span a{color:#fff}
.c_hang_r p span:hover,.c_hang_z p span:hover{color:#82428d;cursor:pointer}
.c_hang_r p span a:hover,.c_hang_z p span a:hover{color:#82428d;}
.c_hanghui_r{float:right;}
.c_hanghui_r p{font-size:18px;padding-top:12px;color:#fff}
.c_hanghui_r p span{width:40px;padding-left:10px;padding-right:10px}
.c_hanghui_r p span a{color:#fff}
.c_hanghui_r p span:hover{color:#82428d;cursor:pointer}
.c_hanghui_r p span a:hover{color:#82428d;}
.about{}
.about_box{width:1200px;overflow: hidden;margin:0 auto;}
.about_box_title{overflow: hidden;margin:0 auto;border-bottom:1px solid #d9d9d9}
.about_box_title p{font-size:20px;padding-bottom:9px;font-weight:550;color:#562363}
.about_box_nr{overflow: hidden;padding-bottom:30px;padding-top:5px;float:left;width:100%}
.about_box_nr p{font-size:15px;text-indent : 25px;line-height:22pt}
.about_box_tu{}
.Designer{float:left;padding-top:15px}
.Designer img{ width:600px;float:left}
.Designer_nr{width:600px;height:347px;float:left; background-color:#f6f6f6;margin-top:15px}
.Designer_nr_t{float:left;padding-left:30px;padding-top:30px;width:540px}
.Designer_nr_t span{font-size:18px;float:left}
.Designer_nr_t p
.Designer_nr_m{float:left;padding-left:30px;padding-top:10px;font-size:15px;}
.Designer_nr_m li{float:left;height:25px;width:507px}
.Designer_nr_b{float:left;border:1px solid #adadad;margin-left:30px;margin-top:77px;font-size:15px}
.Designer_nr_b p a:hover{background-color:#82428d;color:#fff;cursor:pointer}
.service_l{width:600px;height:347px;float:left; background-color:#f6f6f6}
.service_l_t{float:left;padding-left:30px;padding-top:30px;width:540px}
.service_l_t p,.Designer_nr_t p {font-size:18px;float:left}
.service_l_m,.Designer_nr_m{float:left;padding-left:30px;padding-top:10px;font-size:15px;}
.service_l_m li,.Designer_nr_m li{float:left;height:28px;width:507px}
.service_l_b{float:left;border:1px solid #adadad;margin-left:30px;margin-top:44px;font-size:15px;color:#adadad}
.service_l_b p a:hover{background-color:#82428d;color:#fff;cursor:pointer}
/*关于我们结束*/
/*工作室开始*/
.Studio{width:100%}
.Studio_box{width:1200px;margin: 0 auto;}
.Studio_box_title{border-bottom: 1px solid #d9d9d9;padding-bottom: 9px}
.Studio_box_title p{font-size: 20px;font-weight: 550;color: #562363;}
.Studio_box_nr{float:left;padding-top:20px}
.Studio_box_nr ul li{float:left;padding-top:15px}
.Studio_l{float:left;width:200px;text-align: center}
.Studio_l img{width:200px;height:198.5px}
.Studio_l p{ background-color:#95719b;width:200px;font-size:18px;height:42px;line-height:45px;width:200px;color:#fff}
.Studio_l p a{color:#fff}
.Studio_l p a:hover {color:#6f3479}
.Studio_r{float:left;width:1000px;height:240.5px;background-color:#f6f6f6}
.jianjie {padding-top:15px;float:left}
.jianjie span{width:1000px;padding-left:25px;font-size:17px;line-height:30px;font-weight:800}
.jianjie p{font-size:15px;line-height:25px;width:950px;padding-left:25px}
.zhicheng{float:left;padding-left:25px;padding-top:15px;width:700px}
.zhicheng ul li{float:left;line-height:13px;width:700px}
.zhicheng ul li p{float:left;font-size:15px;font-weight:800}
.zhicheng ul li span{float:left;padding-left:15px;font-size:15px;font-weight:800}
.gengduo{float:right;padding-right:57px;padding-top:75px;}
.gengduo p{font-size:15px;border: 1px solid #adadad;}
.gengduo p a:hover{background-color:#82428d;color:#fff;cursor:pointer}
/*联系开始*/
.contact{width:100%;padding-bottom:20px}
.contact_box{width:1200px;margin: 0 auto;padding-top:20px;}
.contact_box_t{overflow: hidden;margin:0 auto;padding-bottom:15px; border-bottom: 1px solid #d9d9d9;}
.contact_box_t p{font-size: 20px; font-weight: 550;color: #562363;}
.contact_box_d {padding-top:20px}
.contact_box_d img{width:1200px}
.message_b{width: 100%;background:url(/wp-content/themes/qingchuang/images/tubiao_2.jpg) ;overflow: hidden;padding-bottom:60px;background-size:100% 100%}
.message{width: 100%;background:url(../images/tubiao.jpg);overflow: hidden;padding-bottom:60px}
.message_box{width:1200px;margin:0 auto;}
.message_box_l{float:left;margin-left:200px;padding-top:50px;width:300px}
.liu{float:left;width:400px}
.liu p{float:left;font-size:17px;color:#e2e2e2}
.name{float:left;width:600px;padding-top:15px}
.name p{float:left;font-size:15px;color:#e2e2e2}
.phone{float:left;width:600px;padding-top:15px}
.phone p{float:left;font-size:15px;color:#e2e2e2}
.liuyan{float:left;width:600px;padding-top:15px}
.liuyan p{float:left;font-size:15px;color:#e2e2e2}
.message_box_r{float:left;margin-left:80px;padding-top:50px;width:400px}
.lianxi{float:left;width:400px}
.lianxi p{float:left;font-size:17px;color:#e2e2e2}
.lianxinr{float:left;padding-top:20px;width:400px}
.lianxinr li{float:left;font-size:15px;height:34px;width:400px;color:#e2e2e2}
.banshichu{float:left;width:100%;border-bottom: 1px dotted #d9d9d9;padding-bottom:8px}
.banshichu_l{float:left;width:70%}
.didian{font-size:19px;float:left;padding-top:15px;width:100%;font-weight: 550;color:#1e1e1e;padding-bottom:8px}
.banshichu_name{font-size:19px;float:left;width:100%}
.banshichu_nr{line-height:36px}
.banshichu_r{float:left;width:30%;padding-left:175px}
.banshichu_r img{width:185px;padding-bottom:15px;padding-top:21px}
/*联系结束*/
/*服务详页开始*/
.fwxy_box{width:1200px; margin:0 auto;padding-bottom:45px; padding-top:45px}
.fwxy_box p{font-size:17px;line-height:30px}
/*服务详页结束*/
/*设计开始*/
.designer{width:100%;padding-bottom:30px;}
.designer_bt{text-align: center;padding-bottom:15px}
.designer_bt p{font-size: 20px; padding-top: 30px; height: 50px;}
.designer_nr{width:100%;margin: 0 auto;background:#f6f6f6;overflow: hidden;padding-bottom:35px}
.designer_nr_box{width:1200px;margin:0 auto;}
.designer_l{float:left;width:450px;padding-top:20px}
.designer_l_t{float:left;font-size:16px; margin-left:15px;width:450px}
.designer_l_m{float:left;width:450px;margin-left:15px;padding-top:15px}
.designer_l_m li{float:left;height:25px;font-size:15px;width:450px}
.designer_l_m li span{float:left}
.designer_l_m li p{float:right}
.designer_l_b{float:left;width:450px;margin-left:15px;padding-top:60px}
.designer_l_b li{float:left;height:25px;font-size:15px;width:450px}
.designer_l_b li span{float:left}
.designer_l_b li p{float:right}
.designer_m{float:left; padding-left:50px;padding-top:50px;font-size:15px;width:297px}
.designer_m_bt{float:left;}
.designer_m_nr{float:left;padding-top:25px}
.designer_m_nr li{height:25px;}
.designer_r{float:left;padding-top:94px;font-size:15px;padding-left:20px}
.designer_r li{height:25px}
/*设计结束*/
/*案例开始*/
.c_hang_hui{height:50px; background-color:#1c1c1c}
.anli{float:left;height:50px;}
.anli p{font-size:18px;padding-top:14px;color:#f1f1f1}
.case{overflow: hidden;background-color:#3f2b52;width:100%;padding-bottom:25px}
.case_box{width:1200px;overflow:hidden;margin:0 auto;padding-top:50px}
.btn a{color:#dddddd}
.btn a:hover:{color:#6f229b}
.btn:hover a{color:#fff}
/*案例结束*/
/*案例详页开始*/
.anli_x{float: left; height:50px;padding-left:27px}
.anli_x li{font-size:17px;float: left;padding-top:15px;padding-left:12px; padding-right:12px}
.anli_x li:hover{color:#82428d;cursor:pointer}
.anli_x li a{color:#d2d2d2}
.anli_x li a:hover{color:#82428d;cursor:pointer}
.anli_xy{width:100%;overflow:hidden;margin:0 auto}
.anli_xy_box{width:1200px;margin:0 auto}
.anli_nr{padding-top:30px;background-color:#3f2b52}
.yema{width:100%;overflow:hidden;margin:0 auto;background-color:#3f2b52}
.page{width:1200px;overflow: hidden;padding-left:236px; padding-top:50px;padding-bottom: 40px;float:right}
.page_box{width: 800px;float:right}
.page_box a.current {background: #6f3479;color: #FFF;}
.page_box a { display: inline-block; width: 65px;text-align: center; background: #3f2b52;height: 48px;vertical-align: middle; line-height: 48px;font-size: 14px;border: 1px solid #955d9e;margin-left: -1px;float: left;text-decoration: none;color: #955d9e;outline: none;}
.page_box :hover a{background:#6f3479;color: #ffffff}
/*案例详页结束*/
/*案例具体开始*/
.case_jt{overflow: hidden;background-color:#3f2b52;width:100%;padding-bottom:25px}
.case_jt_box{width:1200px;overflow:hidden;margin:0 auto;padding-top:50px}
.case_jt_bt{overflow:hidden;text-align: center;font-size:18px;border-bottom: 1px #323232 dashed;padding-bottom:20px}
.case_jt_bt p{color:#ffffff}
.case_jt_tu{width:100%;text-align: center;margin:0 auto;padding-top:50px}
.case_jt_tu p{color:#fff;float:left}
.case_jt_tu ul li{padding-bottom:18px}
.case_jt_tu ul li img{width:1200px}
.case_jt_tu img{width:100%}
/*案例具体结束*/
/*新闻开始*/
.nwes{width:100%;margin: 0 auto;text-align: center;}
.remen_nr{width:1200px;overflow: hidden; margin:0 auto;padding-top:30px;padding-bottom:30px}
.remen_nr ul li{width:100%;border-bottom: dotted 1px #000000;float: left}
.remen_nr ul li img{width: 220px; padding-top: 18px;overflow: hidden}
.remen_zi{width:80%;float:left}
.bt{width: 100%;float:left; font-size: 16px;color: #595959;font-family:"黑体";font-weight: bolder;line-height: 30px;padding-top: 5px;height: 36px;display: inline-block;-webkit-box-orient: vertical; -webkit-line-clamp:1;overflow: hidden;}
.xw{width: 100%;float:left;font-size:15px;color: #787878;line-height: 25px;height:57px;display: inline-block;-webkit-box-orient: vertical; -webkit-line-clamp:1;overflow: hidden;}
.remen_c{width:120px;float:right;height: 30px ;background-color: #e6e6e6;margin-top:21px;margin-bottom: 10px;text-align: center}
.remen_c a{width:120px;font-size: 16px;color: #787878; font-family:"黑体";font-weight: bolder;line-height: 30px }
.remen_c:hover {background-color:#a87daf;cursor:pointer}
.remen_c:hover a{color:#ffff}
/*新闻结束*/
/*新闻具体开始*/
.news_jt{overflow: hidden;background-color:#ffffff;width:100%;padding-bottom:25px}
.news_jt_bt{overflow:hidden;text-align: center;font-size:18px;border-bottom: 1px #323232 dashed;padding-bottom:20px}
.news_jt_tu{margin:0 auto;text-align:center;padding-top:20px}
.news_jt_tu img{width:400px}
.news_wenzi{padding-top:15px;float:left}
.news_wenzi p{font-size: 15px; text-indent: 25px; line-height: 27px}
/*新闻具体结束*/
/*招聘开始*/
.recruit{overflow: hidden;background-color:#ffffff;width:100%;padding-bottom:25px}
.recruit_box{width:1200px;overflow:hidden;margin:0 auto;padding-top:50px;padding-bottom:15px}
.recruit_box_bt p{font-size:20px;padding-bottom:10px}
.recruit_box_nr li{font-size:17px;height:36px}
/*招聘结束*/
/*工作室开始*/
.Studioa{float:left;height:50px;background-color:#95719b; width:180px}
.Studioa p{font-size:20px;padding-top:12px;color:#f1f1f1;letter-spacing:10px}
.studioa_l{float: left;width:100%;overflow: hidden;}
.studioa_l{float: left;width: 200px;overflow: hidden;padding-top:15px}
.studioa_l li{width: 180px;text-align: center;float:left;overflow: hidden;background: #b597ba; margin-top: 8px;}
.studioa_l li:hover{background: #784c7f}
.studioa_l li:hover a{color: #e2cff7}
.studioa_l li p a{font-size: 20px;color:#ffffff;line-height: 46px;letter-spacing:10px}
.studioa_r{width:900px;float:right;padding-top:20px}
.studioa_r_s{width: 900px;float: left;border-bottom: 1px #dddddd solid;padding-bottom:40px}
.studioa_r_s_l{width:154px;text-align: center;float: left;}
.studioa_r_s_l span{font-size: 18px;line-height: 50px}
.studioa_r_s_r{width:500px;float: left;padding-left: 25px}
.studioa_bt p{font-size: 22px;line-height: 40px;}
.studioa_nr {float:left}
.studioa_nr ul li{width:500px;font-size: 16px;line-height:28px;overflow:hidden}
.studioa_nr ul li p{float:left;}
.studioa_nr ul li span{float:right}
.studioa_x{float: left;padding-bottom:20px}
.studioa_x_bt p{font-size: 18px;line-height: 25px;padding-left: 15px;padding-top: 15px}
.news_3_nr_r{ float: left;width: 947px;overflow: hidden; padding-left: 41px;padding-bottom: 35px;}
.news_3_nr_r ul li{ width: 820px;border-bottom: 1px #626262 dotted;float: left;line-height: 39px;padding-top: 5px;}
.news_3_nr_r ul li a{float: left}
.news_3_nr_r ul li a img,.news_3_nr_r ul li a p {float: left}
.news_3_nr_r ul li span{float: right}
.caption-style-2{overflow: hidden;list-style-type: none;margin: 0px;padding: 0px;}
.caption-style-2 li{margin-left: 5px;margin-right: 5px;float: left;padding: 0px;position: relative;overflow: hidden;padding-top: 15px}
.caption-style-2 li:hover .caption{opacity: 1;}
.caption-style-2 img{width:290px;height: 240px; margin: 0px;padding: 0px;float: left;z-index: 4;}
.caption-style-2 .caption{cursor: pointer;position: absolute;opacity: 0;-webkit-transition:all 0.45s ease-in-out;-moz-transition:all 0.45s ease-in-out;-o-transition:all 0.45s ease-in-out;-ms-transition:all 0.45s ease-in-out;
transition:all 0.45s ease-in-out;}
.caption-style-2 .blur{background-color: rgba(82,34,127,0.65);height:240px;width:290px;z-index: 5;position: absolute;}
.caption-style-2 .caption-text_2 h1{text-transform: uppercase;font-size:18px;letter-spacing: 3px;padding-bottom:6px}
.caption-style-2 .caption-text_2{z-index: 10;color: #fff;position: absolute;width:280px;height:240px;text-align: center;top:14px;}
.caption-text_2 p{width:250px;height:240px;line-height: 240px; font-size:16px;margin:0 auto;text-align: center}
.yema_b{width:100%;overflow:hidden;margin:0 auto;background-color:#fff}
.page_b{width:1200px;overflow: hidden;padding-left:236px; padding-top:50px;padding-bottom: 40px;float:right}
.page_b_box{width: 800px;float:right}
.page_b_box a.current {background: #6f3479;color: #FFF;}
.page_b_box a { display: inline-block; width: 65px;text-align: center; background: #fff;height: 48px;vertical-align: middle; line-height: 48px;font-size: 14px;border: 1px solid #955d9e;margin-left: -1px;float: left;text-decoration: none;color: #955d9e;outline: none;}
.page_b_box a:hover{background:#6f3479;color: #ffffff}
/*工作室结束*/
ul,ol,li{list-style:none;margin:0;padding:0;}
#top_list{float: left;padding-top: 23px;padding-left:18px}
#top_list>li{
width:150px;
height:55px;
float:left;
text-align:center;
}
#top_list>li p{
width:150px;
}
#top_list>li>p>a{
padding-left:23px;
padding-right: 23px;
font-size: 20px;
font-family: "微软雅黑";
display:block;
color:#3c3c3c;
height:30px;
text-decoration:none
}
#top_list>li>p>span{
padding-left:23px;
padding-right: 23px;
font-size: 13px;
font-family: "微软雅黑";
display:block;
color:#3c3c3c;
height:27px;
text-decoration:none
}
#top_list>li>a:hover{color:#894195}
#top_list>li:hover{
}
#top_list>li p:hover{cursor:pointer;
color: #82428d
}
#top_list>li p a:hover{
color: #82428d
}
#top_list>li p span:hover{cursor:pointer;
color: #82428d
}
#top_list>li>ol{
width: 150px;
overflow:hidden;
display:none;
position:relative;
}
#top_list>li>ol>li{
background:rgba(63,43,82,0.7);
float:left;
text-align:center;
overflow:hidden;
width: 150px;
}
#top_list>li>ol>li>a{
font-size: 19px;
line-height: 35px;
color: #ffffff;
padding-left: 23px;
padding-right: 23px;
display: block;
}
#top_list>li>ol>li:hover{
background:rgba(63,43,82,0.4);
}
#top_list>li>ol>li:hover a{
color: #cfb4d4
}
.container-a1{width:1200px;overflow: hidden;margin:0 auto;}
.caption-style-1{overflow: hidden;list-style-type: none;margin: 0px;padding: 0px;}
.caption-style-1 li{margin-left: 5px;margin-right: 5px;float: left;padding: 0px;position: relative;overflow: hidden;}
.caption-style-1 li:hover .caption{opacity: 1;}
.caption-style-1 img{margin: 0px;padding: 0px;float: left;z-index: 4;}
.caption-style-1 .caption{cursor: pointer;position: absolute;opacity: 0;-webkit-transition:all 0.2s ease-in-out;-moz-transition:all 0.2s ease-in-out;-o-transition:all 0.2s ease-in-out;-ms-transition:all 0.2s ease-in-out;
transition:all 0.2s ease-in-out;}
.caption-style-1 .blur{background-color: rgba(0,0,0,0.65);height: 343px;width: 229px;z-index: 5;position: absolute;}
.caption-style-1 .caption-text h1{text-transform: uppercase;font-size: 24px;letter-spacing: 3px;padding-bottom:6px}
.caption-style-1 .caption-text{z-index: 10;color: #fff;position: absolute;width: 229px;height:343px;text-align: center;top:100px;}
.caption-text p{font-size: 18px}
/*案例样式*/
/*案例样式开始*/
:root {
--d: 700ms;
--e: cubic-bezier(0.19, 1, 0.22, 1);
--font-sans: 'Rubik', sans-serif;
--font-serif: 'Cardo', serif;
}
* {
box-sizing: border-box;
}
.page-content {
display: grid;
grid-gap: 1rem;
max-width: 1200px;
margin: 0 auto;
font-family: var(--font-sans);
}
@media (min-width: 700px) {
.page-content {
grid-template-columns: repeat(2, 1fr);
}
}
@media (min-width:1200px) {
.page-content {
grid-template-columns: repeat(4, 1fr);
}
}
.card {
position: relative;
display: -webkit-box;
display: flex;
-webkit-box-align: end;
align-items: flex-end;
overflow: hidden;
padding: 1rem;
width: 100%;
text-align: center;
color: whitesmoke;
background-color: whitesmoke;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1), 0 2px 2px rgba(0, 0, 0, 0.1), 0 4px 4px rgba(0, 0, 0, 0.1), 0 8px 8px rgba(0, 0, 0, 0.1), 0 16px 16px rgba(0, 0, 0, 0.1);
}
@media (min-width: 600px) {
.card {
height: 350px;
}
}
.card:before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 110%;
background-size: cover;
background-position: 0 0;
-webkit-transition: -webkit-transform calc(var(--d) * 1.5) var(--e);
transition: -webkit-transform calc(var(--d) * 1.5) var(--e);
transition: transform calc(var(--d) * 1.5) var(--e);
transition: transform calc(var(--d) * 1.5) var(--e), -webkit-transform calc(var(--d) * 1.5) var(--e);
pointer-events: none;
}
.card:after {
content: '';
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 200%;
pointer-events: none;
background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), color-stop(11.7%, rgba(0, 0, 0, 0.009)), color-stop(22.1%, rgba(0, 0, 0, 0.034)), color-stop(31.2%, rgba(0, 0, 0, 0.072)), color-stop(39.4%, rgba(0, 0, 0, 0.123)), color-stop(46.6%, rgba(0, 0, 0, 0.182)), color-stop(53.1%, rgba(0, 0, 0, 0.249)), color-stop(58.9%, rgba(0, 0, 0, 0.32)), color-stop(64.3%, rgba(0, 0, 0, 0.394)), color-stop(69.3%, rgba(0, 0, 0, 0.468)), color-stop(74.1%, rgba(0, 0, 0, 0.54)), color-stop(78.8%, rgba(0, 0, 0, 0.607)), color-stop(83.6%, rgba(0, 0, 0, 0.668)), color-stop(88.7%, rgba(0, 0, 0, 0.721)), color-stop(94.1%, rgba(0, 0, 0, 0.762)), to(rgba(0, 0, 0, 0.79)));
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.009) 11.7%, rgba(0, 0, 0, 0.034) 22.1%, rgba(0, 0, 0, 0.072) 31.2%, rgba(0, 0, 0, 0.123) 39.4%, rgba(0, 0, 0, 0.182) 46.6%, rgba(0, 0, 0, 0.249) 53.1%, rgba(0, 0, 0, 0.32) 58.9%, rgba(0, 0, 0, 0.394) 64.3%, rgba(0, 0, 0, 0.468) 69.3%, rgba(0, 0, 0, 0.54) 74.1%, rgba(0, 0, 0, 0.607) 78.8%, rgba(0, 0, 0, 0.668) 83.6%, rgba(0, 0, 0, 0.721) 88.7%, rgba(0, 0, 0, 0.762) 94.1%, rgba(0, 0, 0, 0.79) 100%);
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: -webkit-transform calc(var(--d) * 2) var(--e);
transition: -webkit-transform calc(var(--d) * 2) var(--e);
transition: transform calc(var(--d) * 2) var(--e);
transition: transform calc(var(--d) * 2) var(--e), -webkit-transform calc(var(--d) * 2) var(--e);
}
.card:nth-child(1):before {
background-image: url(/wp-content/themes/qingchuang/images/1.jpg);
}
.card:nth-child(2):before {
background-image: url(/wp-content/themes/qingchuang/images/2.jpg);
}
.card:nth-child(3):before {
background-image: url(/wp-content/themes/qingchuang/images/3.jpg);
}
.card:nth-child(4):before {
background-image: url(/wp-content/themes/qingchuang/images/4.jpg);
}
.content {
position: relative;
display: -webkit-box;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column;
-webkit-box-align: center;
align-items: center;
width: 100%;
padding: 1rem;
-webkit-transition: -webkit-transform var(--d) var(--e);
transition: -webkit-transform var(--d) var(--e);
transition: transform var(--d) var(--e);
transition: transform var(--d) var(--e), -webkit-transform var(--d) var(--e);
z-index: 1;
}
.content > * + * {
margin-top: 1rem;
}
.title {
font-size: 1.3rem;
font-weight: bold;
line-height: 1.2;
}
.copy {
font-family: var(--font-serif);
font-size: 1.125rem;
font-style: italic;
line-height: 1.35;
}
.btn {
cursor: pointer;
margin-top: 1.5rem;
padding: 0.75rem 1.5rem;
font-size: 0.65rem;
font-weight: bold;
letter-spacing: 0.025rem;
text-transform: uppercase;
color: white;
background-color: black;
border: none;
}
.btn:hover {
background-color: #3f2b52;
}
.btn:focus {
outline: 1px dashed yellow;
outline-offset: 3px;
}
@media (hover: hover) and (min-width: 600px) {
.card:after {
-webkit-transform: translateY(0);
transform: translateY(0);
}
.content {
-webkit-transform: translateY(calc(100% - 4.5rem));
transform: translateY(calc(100% - 4.5rem));
}
.content > *:not(.title) {
opacity: 0;
-webkit-transform: translateY(1rem);
transform: translateY(1rem);
-webkit-transition: opacity var(--d) var(--e), -webkit-transform var(--d) var(--e);
transition: opacity var(--d) var(--e), -webkit-transform var(--d) var(--e);
transition: transform var(--d) var(--e), opacity var(--d) var(--e);
transition: transform var(--d) var(--e), opacity var(--d) var(--e), -webkit-transform var(--d) var(--e);
}
.card:hover,
.card:focus-within {
-webkit-box-align: center;
align-items: center;
}
.card:hover:before,
.card:focus-within:before {
-webkit-transform: translateY(-4%);
transform: translateY(-4%);
}
.card:hover:after,
.card:focus-within:after {
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.card:hover .content,
.card:focus-within .content {
-webkit-transform: translateY(0);
transform: translateY(0);
}
.card:hover .content > *:not(.title),
.card:focus-within .content > *:not(.title) {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
-webkit-transition-delay: calc(var(--d) / 8);
transition-delay: calc(var(--d) / 8);
}
.card:focus-within:before, .card:focus-within:after,
.card:focus-within .content,
.card:focus-within .content > *:not(.title) {
-webkit-transition-duration: 0s;
transition-duration: 0s;
}
}
/*次导航开始*/
#mynav{ width:100%; height:50px; background:#ffffff; border-bottom:2px solid #d9d9d9; position:relative; z-index:99; color:#fff; line-height:40px;}
.mynav_box {width:1200px; padding:0; margin:0 auto; list-style-type:none;}
.mynav_l{float:left}
.mynav_r{float:right;background-color:#95719b;line-height:50px;font-size:18px;color:#fff;}
#mynav ul li{height:50px; float:left; margin：0px 50px; border-right:1px solid #fff;background:#95719b}
#mynav ul li a{ display:block; padding:0px 50px; height:50px; line-height:50px; color:#fff; font-size:19px; }
#mynav ul li:hover{border-bottom:5px solid #6f3479}
#mynav ul li a:hover{color:#5d2567}
.mynav_r span{width:40px;padding-left:10px;padding-right:10px;background-color:#95719b}
.mynav_r span a{color:#fff;}
.mynav_r span:hover{color:#82428d;cursor:pointer}
.mynav_r span a:hover{color:#82428d;}
#mynav ol{background-color:#95719b}
.fuwu_zz{float:left;color:#562363;font-size:20px;line-height:50px;font-weight: 550;}
/* banner */
.banner{ width:100%; height:750px; overflow:hidden; position:relative;font-size:0}
.b-img{ height:500px; position:absolute; left:0; top:0;}
.b-img a{ display:block; height:750px; float:left;}
.b-list{ height:50px; padding-top:700px; position:relative; margin:0 auto;}
.b-list span{ display:block;cursor:pointer; width:14px; height:14px; border-radius:50%; border:3px solid #fff; float:left; margin:0 5px; _margin:0 3px;}
.b-list .spcss{border:3px solid #6f3479;}
.bar-left{ position:absolute; z-index:1; display:block; width:100px; height:100%; left:0px; background:none; top:0px; }
.bar-right{ position:absolute;z-index:1; display:block; width:100px; height:100%; right:0px; background:none; top:0px; }
.bar-left em{ display:block; width:50px; height:100px; background:url(../qingchuang/images/arrow.png) 0px 0px no-repeat; margin:0 auto; margin-top:325px;}
.bar-right em{ display:block; width:50px; height:100px; background:url(../qingchuang/images/arrow.png) -50px 0px no-repeat; margin:0 auto; margin-top:325px;}
.bar-left .emcss{ background-position:0px -100px;}
.bar-right .emcss{ background-position:-50px -100px;}
/* daohang */
.index-nav{width: 100%;height: 50px;box-sizing: border-box;background:white;}
.index-nav-frame{width: 1200px;margin: 0 auto;}
.index-nav-frame-line{color: #333333;background: white;float: left;position: relative;outline: none;cursor: pointer;width:159px;line-height: 32px;text-align: center;font-size: 20px;padding-top:16px;}
.index-nav-frame-line p{font-size:13px;}
.index-nav-frame-line .active{color: rgb(60, 60, 60)}
.index-nav-frame-line-center{opacity: 0;height: 0;position: absolute; overflow: hidden;width: 100%;transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s;/* Firefox 4 */-o-transition: all 0.5s; /* Opera */}
.index-nav-frame-line-li {width: 100%;font-weight: 500;text-align: center;background: white;font-size: 18px;background:rgba(63,43,82,0.7);color: #ffffff}
.index-nav-frame-line-li a{color: #ffffff}
.index-nav-frame-line-li:hover{background: #444359;color: white;}
.index-nav-frame-line-li:hover a{background: #444359;color: white;}
.index-nav-frame-line-focus:focus{display: none;}
.index-nav-frame-line:hover .index-nav-frame-line-center{height:auto;opacity: 1;}
.index-nav-frame-line a:hover{color:#943dcb;text-decoration:none}
.nav-line{height: 50px;width: 100%;position: relative;display: none;outline: none;}
.nav-small{width: 30px;height: 30px;position: absolute;right: 10px;top:10px;cursor: pointer;display: none;outline: none;}
.nav-small img{width: 100%;height: 100%;object-fit: cover;}
.nav-small-focus{position: absolute;width: 100%;height: 100%;display: none;}
.nav-small-focus:focus{display: none;}
@media only screen and (max-width:1200px) {
.index-nav-frame-line-li a{display: block;color: white;}
.nav-line{display: block;border-bottom: 1px solid #eeeeee;}
.nav-small{display: block;}
.nav-small:focus~.index-nav-frame-line{height: auto;border-bottom: 1px solid #ccc;}
.nav-small:focus .nav-small-focus{display: block;}
.index-nav-frame{width: 100%;}
.index-nav-frame-line{width: 100%;height: 0;overflow: hidden;}
.index-nav-frame-line-center{position: relative;background: #444359;}
.index-nav-frame-line:hover .index-nav-frame-line-center{height:0;opacity: 0;}
.index-nav-frame-line-li{border-bottom: 1px solid #4b4a5e;color: #d9d9d9;background: #444359;}
.index-nav-frame-line-li:hover{background: #b63b4d;}
.index-nav-frame-line:focus{height: auto;border-bottom: 1px solid #ccc;}
.index-nav-frame-line:focus>.index-nav-frame-line-center{height:auto;opacity: 1;}
.index-nav-frame-line:focus .index-nav-frame-line-header{color: #B63B4D;}
.index-nav-frame-line-focus{display: none;width: 100%;height: 50px;position: absolute;left: 0;top: 0;}
.index-nav-frame-line:focus .index-nav-frame-line-focus{display: block;}
/* tab切换 */