@charset "utf-8";
/* CSS Document */
@import url(//fonts.googleapis.com/css?family=Frijole|Anton|Slabo+27px);
@import url(../css/headhesive.css);
body{background:url(../images/pageBG.jpg) repeat;}
.header{position:relative; box-shadow:none; border-bottom:1px solid #ddd; box-sizing:border-box}
.footer{background:#26211f; color:#fff; overflow:hidden;}

.page_content{margin-top:50px;}

.crumb{margin:10px 0px; font-size:0.85em;}
.crumb li{display:inline-block; margin:0 3px;}
.crumb li i{margin-left:7px;}
.crumb li a{color:#616161;}
.crumb li a.homepage{color:#000;}
.crumb li a:hover{text-decoration:underline;}
.pageTitle{text-align:center;}
.pageTitle p{font-size:2.2em; font-weight:bold; letter-spacing:0.2em; border-bottom:3px solid #1a1a12; display:inline-block; padding:0.15em 0.5em;}
.pageTitle h3{margin-top:0.4em; font-size:1em;}
.bar{background:#1a1a12; min-height:68px; line-height:68px; text-align:center; margin:30px 0px 0; color:#fff;}
.bar li{margin:0 0.5em; position: relative; display:inline-block;background:url(../images/dot.jpg) no-repeat right center; padding-right:1.3em; font-size:1.1em;}
.bar li:last-child{background-image:none;}
.bar li a{position: relative; outline: none; color: #fff; letter-spacing: 1px; padding:7px 0;}
.bar li a.navOn{border-top:1px solid #696969 ;border-bottom:1px solid #696969; padding:7px 5px;}
.bar li a.navOn::before, .bar li a.navOn::after{position:fixed;}
.bar li .bar_on{background:url(../images/arrow.png) no-repeat; position:absolute; width:20px; height:10px; bottom:-10px; left:35%;}
.bar li a:hover, .bar li a:focus {outline: none;}
.toggleMenu{display:none; width:100%; text-align:center; color:#fff; font-size:1.1em;}
.toggleMenu span{float:right; margin:0px 20px 0 0; font-size:1em;}
.cl-effect-21 a {-webkit-transition: color 0.3s; -moz-transition: color 0.3s; transition: color 0.3s;}
.cl-effect-21 a::before, .cl-effect-21 a::after {
	position: absolute;
	left: 0;
	width: 100%;
	height: 1px;
	background: #fff;
	content: '';
	opacity: 0;
	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
	-moz-transition: opacity 0.3s, -moz-transform 0.3s;
	transition: opacity 0.3s, transform 0.3s;
	-webkit-transform: translateY(-10px);
	-moz-transform: translateY(-10px);
	transform: translateY(-10px);
}
.cl-effect-21 a::before {
	top: 0;
	-webkit-transform: translateY(-10px);
	-moz-transform: translateY(-10px);
	transform: translateY(-10px);
}
.cl-effect-21 a::after {
	bottom: 0;
	-webkit-transform: translateY(10px);
	-moz-transform: translateY(10px);
	transform: translateY(10px);
}
.cl-effect-21 a:hover::before,
.cl-effect-21 a:focus::before,
.cl-effect-21 a:hover::after,
.cl-effect-21 a:focus::after {
	opacity: 1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	transform: translateY(0px);
}
.pink{color:#ff3434;}

/*about*/
.about_content{margin:90px 20px 0;}
.about01{background:url(../images/about_bg.png) repeat; padding:0 30px 20px; margin-bottom:30px; opacity:0;}
.about01 .about01_img{overflow:hidden; float:left; z-index:1; margin:-27px 0 30px; width:51.5%; height:483px; position:relative;}
.about01 .about01_img img{position:absolute; left:50%;margin-left:-340px;}
.about01 .about01_soul{float:right; width:46%;}
.about01 .about01_title{font-size:2.2em; font-weight:bold; padding-top:50px; margin-bottom:20px;}
.about01 .about01_word{text-align:justify; font-size:1.2em;padding:30px 25px 0; height:290px; margin-top:40px; line-height:1.8em; background:#fff; }
.about_title02{font-size:2.2em; font-weight:bold; padding:20px; opacity:0;}
.about_word02{text-align:justify; font-size:1.2em; line-height:1.6em; margin-bottom:50px; padding:20px; opacity:0;}
.big_word{font-size:2em; font-weight:bold; padding-left:40px;}
.a_icon_l{left:-62px; top:20%; position:absolute;}
.a_icon_r{right:-62px; top:30%; position:absolute;}
.a_icon_l img, .a_icon_r img{width:100%;}
.about_block01{border-left:10px solid #000; border-bottom:10px solid #000; margin:20px 60px 0; position:relative; padding:6%; padding-right:0; min-height:100px; opacity:0;}
.about_block02{border-right:10px solid #000; border-bottom:10px solid #000; margin:0 60px; position:relative; padding:6%; padding-left:0; opacity:0;}
.about_block02  .big_word{text-align:right; padding-left:0; padding-right:40px; line-height:1.7em;}
.about_block03{border-left:10px solid #000; border-bottom:10px solid #000; margin:0 60px; position:relative; padding:6%; padding-right:0; line-height:3.5em; font-size:0.8em; margin-bottom:50px; opacity:0;}
.about_block03 .a_icon_l{left:-62px; top:30%; position:absolute;}
.about_block03 .a03_tit{font-size:1.2em;}
.about_block03 p{margin-bottom:2%; font-size:1em;}
.about_block03 span{display:inline-block;}
.about02{opacity:0;}
.about02 .about02_tit{font-size:2.2em; font-weight:bold; float:left; width:25%; text-align:center}
.about02 .about02_content{float:right; width:75%; font-size:1.25em; line-height:1.8em;}
.about_service{background:url(../images/about02_bg.jpg) no-repeat; background-size:100% auto; margin-top:5em; padding:2em; margin:5em 0; opacity:0;}
.about_service .service_tit{color:#fff; font-size:2.2em; padding:0.5em 1em 1.6em; text-transform:uppercase; font-weight:bold;}
.three_box li{float:left; width:33%; text-align:center; padding:0 5%; box-sizing:border-box; color:#fff;}
.three_box li img{width:70%;}
.three_box li .a_en{color:#ff7800; font-size:0.75em; margin:20px 0 5px; font-family:"Lucida Console", Monaco, monospace}
.three_box li .a_name{font-size:1.5em;}
.three_box li .a_texts{font-size:1em; color:#aaa; margin:15px auto; width:100%;}
.about03{background:url(../images/about_bg.png) repeat; padding:0 30px 40px; height:330px; margin-bottom:80px; opacity:0;}
.about03 .about03_img{overflow:hidden; z-index:1; float:left;margin:-45px 0 0px; width:35%;}
.about03 .about03_img img{ width:100%;}
.about03 .about03_soul{float:right;width:60%;}
.about03 .about03_title{font-size:2.2em; font-weight:bold; padding-top:50px; margin-bottom:20px;}
.about03 .about03_word{padding:30px 25px; margin-top:40px; line-height:1.8em; text-align:justify; font-size:1.2em; background:#fff;}
.insist1234{margin:40px 0;}
.insist1234 .insist{width:24.5%; padding:0 2%; display:inline-block; vertical-align:top; margin-bottom:50px; box-sizing:border-box; opacity:0;}
.insist1234 .insist .insist_num{font-family: 'Frijole', cursive; font-size:5em; text-align:center;}
.insist1234 .insist .insist_name{font-size:1.4em; margin:7% 0 10%; font-weight:bold; text-align:center;}
.insist1234 .insist .insist_word{font-size:1.2em; line-height:1.8em;}
.about04 .ourGroup{width:48%; display:inline-block; vertical-align:top; float:left; margin-bottom:5%; opacity:0;}
.about04 .ourGroup:nth-child(2n){float:right;}
.about04 .ourGroup .ourName{font-size:1.3em; line-height:57px; margin-bottom:10px; font-weight:bold;}
.about04 .ourGroup .ourName img{float:left; margin-right:10px;}
.about04 .ourGroup .ourName .circle{background:url(../images/circle.jpg) no-repeat left; padding-left:15px; margin-left:10px;}
.about04 .ourGroup .ourName .jobTitle{float:right; font-size:0.8em; text-transform:uppercase;}
.about04 .ourGroup .ourImg{width:100%;}
.about04 .ourGroup .ourContent{background:#fff; font-size:1.05em;}
.about04 .ourGroup .ourContent .our_list{ padding:20px 30px;}
.about04 .ourGroup .ourContent .our_list .our_list_row{ margin-bottom:10px; line-height:1.8em;}
.about04 .ourGroup .ourContent .our_list .our_list_row p{display:inline-block; vertical-align:top; width:84%;}
.about04 .ourGroup .ourContent .our_list .our_list_row .our_title{font-weight:bold; letter-spacing:2px; color:#000; width:13%;}
.about04 .ourGroup .ourContent .our_list .our_list_row a{color:#006cff;}
.about04 .ourGroup .ourContent .our_list .our_list_row a:hover{text-decoration:underline;}
.about04 .ourGroup .ourContent .our_list .our_word{border-top:1px solid #d9d9d9; padding-top:20px; margin-top:20px; line-height:1.8em; color:#555;}

/*profitio*/
.wrok_items{margin:0 -18px;}
.wrok_items .work{padding:0 18px; width:25%; float:left; box-sizing:border-box; opacity:0;}
.wrok_items .work .work_item{height:400px; margin-bottom:35px; background:#fff; border:1px solid #eaeaea;}
.wrok_items .work .work_item .work_img{width:100%; overflow:hidden; position:relative;}
.wrok_items .work .work_item .work_img .img{width:100%; transition:all ease 0.5s;}
.wrok_items .work .work_item .work_img .icons{position:absolute; bottom:10px; right:10px;}
.wrok_items .work .work_item .work_content{padding:15px; font-size:0.75em;}
.wrok_items .work .work_item .work_content h3{background:url(../images/line02.jpg) no-repeat left top; padding-top:4px; font-size:1.6em; white-space:nowrap;}
.wrok_items .work .work_item .work_content h3 a{color:#000;}
.wrok_items .work .work_item .work_content h3 a:hover{ text-decoration:underline;}
.wrok_items .work .work_item .work_content .en{color:#c4972c; width:100%; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; overflow:hidden;}
.wrok_items .work .work_item .work_content .work_descript{color:#8c8c8c; margin:10px 0 15px 0; height:34px; overflow:hidden;}
.wrok_items .work .work_item .work_content .work_type{border-top:1px solid #e4e4e4; padding-top:7px; color:#686868; text-align:right;}
.wrok_items .work:hover .work_img .img{opacity:0.7;}
.myWork{margin:2em 0;}
.myWork h4{font-size:1.2em; margin-left:15%; float:left; line-height:34px;}
.myWork h4 span{color:#df0000; margin:0 2px;}
.myWork .skill{float:right; margin-right:15%;}
.wall{background:url(../images/woodBg.jpg) no-repeat center 70px; opacity:0;}
.wall .screen_img{width:961px; margin:0px auto;}
.wall .screen_img img{width:100%;}
.work_intro{margin:0 15%; opacity:0;}
.work_intro ul li{width:33%; height:130px; padding:2%; box-sizing:border-box; border-right:1px solid #b4b4b4; text-align:center; font-size:1.1em; float:left;}
.work_intro ul li:last-child{border:0;}
.work_intro ul li .theTitle{border-bottom:2px solid #000; padding-bottom:5px; display:inline-block; margin:10px 0 30px;}
.work_intro .work_description{margin:2em 0; font-size:1.1em; line-height:1.8em;}
.work_intro .work_description .theTitle2{background:url(../images/icon3.jpg) no-repeat left; padding-left:15px; margin-bottom:10px;}
.work_intro .button--wayra {color:#000; border-color:#ffcc00; background:#ffcc00; width:auto; text-align:center; font-weight:bold;}
.work_intro .button--wayra::before {background: #fff;}
.work_intro .button--wayra:hover {color: #000;	border-color: #000;}
.work_intro .button--wayra.button--inverted:hover {color: #fff;	border-color: #000;}
.work_intro .button--wayra.button--inverted:hover::before {background-color: #000;}
.profitio{margin:3em 0;}
.profitio .three_img{margin:0 -20px; margin-bottom:1.8em; opacity:0;}
.profitio .three_img div{width:33.33%; float:left; padding:0 20px; box-sizing:border-box;}
.profitio .big_img{width:920px; height:545px; margin-bottom:1.8em; opacity:0;}
.profitio .sml_img{width:436px; height:545px; margin-bottom:1.8em; opacity:0;}
.profitio .sml_img .smll{margin-bottom:6%; height:260px;}
.profitio .large_img{width:100%; margin-bottom:1.8em; opacity:0;}
.profitio .float_right{float:right; opacity:0;}
.profitio .float_left{float:left; opacity:0;}
.profitio .big_img, .profitio .large_img, .profitio .three_img, .profitio .sml_img .smll{overflow:hidden;}
.profitio .big_img img, .profitio .sml_img img, .profitio .three_img img, .profitio .large_img img{width:100%; height:100%;}
.other_works{margin:3em 0;}
.other_works .other_works_title{border:1px solid #000; border-width: 1px 0; line-height:2.5em; text-align:center; font-size:1.3em; font-weight:bold; margin-bottom:2em}
.other_works .other_work_list{width:48%; float:left;}
.other_works .other_work_list:last-child{border-left:1px solid #cacaca; float:right; padding-left:2%;}
.other_works .other_work_list .other_img{ width:243px; float:left; margin-right:1em; overflow:hidden;}
.other_works .other_work_list .other_img img{width:100%; transition:all ease 0.5s; transform: scale(1.15)}
.other_works .other_work_list .other_img:hover img{transform:scale(1.1) translateX(-10px); opacity:0.8;}
.other_works .other_work_list .work_type02{color:#686868; font-size:0.75em;}
.other_works .other_work_list h5{font-size:1.1em;}
.other_works .other_work_list h5 a{color:#000000;}
.other_works .other_work_list .en02{color:#c4972c; font-size:0.75em; margin:5px 0 10px;}
.other_works .other_work_list .icons{margin-bottom:1em;}
.other_works .other_work_list .view_work{font-size:0.75em; color:#000;}
.other_works .other_work_list .view_work i{margin-left:10px;}
.other_works .other_work_list .view_work:hover{text-decoration:underline;}

/*project*/
.grid{margin-bottom:2em; margin-top:-18px; width:100%;}
.project_list{padding:18px; box-sizing:border-box; max-width:280px; position:relative; transition:all ease 0.8s;}
.project_list:hover{background:#e2e2e2}
.project_list .project_img{border:1px solid #e9e9e9;}
.project_list .project_img img{width:100%;}
.project_list h3{font-size:1.1em; margin:15px 0; text-align:center;}
.project_list .p_descript{ color:#4f4f4f; line-height:1.7em; font-size:0.95em; text-align:justify;}
.project_list a{position:absolute; display:block; left:0; top:0; right:0; bottom:0; text-indent:-9999px;}

.project_detail{margin:2em 0;}
.project_detail .detail_img{width:100%;}
.project_detail .detail_img img{width:100%;}
.project_detail .detail_words{font-size:1.2em; margin:2.3em 0; line-height:1.7em;}
.bg_black{background:#000;}
.bg_black  .detail_words{ color:#fff;}

/*article+qa*/
.article{background:#fff; margin-bottom:3em;}
.article .article_list{float:left; width:50%; height:350px; padding:30px; box-sizing:border-box; transition:all ease 1.5s; opacity:0;}
.article .article_list:hover .list_top h3 a{ color:#ff8400;}
.article .article_list .list_top{border-bottom:2px solid #ededed; display:table; width:100%; padding-bottom:20px; margin-bottom:20px;}
.article .article_list .list_date{color:#fff; text-align:center; position:relative; float:left; width:119px; margin-right:20px; transition:all ease 1.5s;}
.article .article_list .list_date .dateImg{width:100%;}
.article .article_list .list_date .date{position:absolute; left:0; top:0; width:100%; z-index:1;}
.article .article_list .list_date .date .list_type{font-size:0.75em; border-bottom:1px dotted #fff; width:60px; margin:25px auto 5px; padding-bottom:5px; font-family: 'Slabo 27px', serif;}
.article .article_list .list_date .date .list_num{font-size:2em; font-weight:bold;}
.article .article_list:nth-child(2n){float:right;}
.article .article_list .list_top h3{font-size:1.3em; display:table-cell; vertical-align:middle; height:131px; }
.article .article_list .list_top h3 a{color:#000; transition:all ease 1.5s;}
.article .article_list .desciption{height:110px; overflow:hidden; /**/color:#4e4e4e; line-height:1.8em;}
.article_detail{padding:40px; margin-bottom:50px; background:#fff; opacity:1;}
.article_detail .article_title{border:2px solid #000; border-width:2px 0; padding:1em 0; font-size:1.5em;}
.article_detail .edit{margin:30px 0; font-size:1.2em; color:#4c4c4c; line-height:1.7em;}
.more_articles{margin-bottom:30px;}
.more_articles .more_title{font-size:1.2em; font-weight:bold; border-bottom:2px solid #000; padding-bottom:2px; margin-bottom:15px; display:inline-block;}
.more_articles h3{margin-bottom:10px;}
.more_articles i{margin-right:10px;}
.more_articles a{color:#cd2d2d; font-size:0.8em; font-weight:normal; text-decoration:underline;}
.article_detail .button--wayra {color:#000; border-color:#000; text-align:center; width:auto;}
.article_detail .button--wayra::before {background: #000;}
.article_detail .button--wayra:hover {color: #fff;	border-color: #000;}
.article_detail .button--wayra.button--inverted:hover {color: #fff;	border-color: #000;}
.article_detail .button--wayra.button--inverted:hover::before {background-color: #000;}

/*seo*/
.orange{color:#ff8400;}
.blue{color:#0060fe;}
.seo_word{line-height:1.7em; font-size:1.2em; padding:0 2%; opacity:0;}
.seo_section{margin:3em 0 5em; opacity:0;}
.seo_section .seo_top{border:solid #000; border-width:1px 0; padding:10px 0 13px;}
.seo_section .seo_top .seoImg{float:left; box-shadow:3px 3px 0 rgba(0, 0, 0, 0.2);}
.seo_section .seo_top .seo_type{float:right; font-size:1.2em; margin-top:20px; font-weight:bold;}
.seo_section .seo_top .seo_type .seo_type_title{background:url(../images/icon.jpg) no-repeat right 15px; padding-right:10px; margin-right:7px;}
.seo_section .seo_content{background:url(../images/seoBG.jpg) repeat; padding:20px; margin-top:25px;}
.seo_section .seo_content td{text-align:center; padding:12px 5px;}
.seo_section .seo_content thead{font-size:1.3em;}
.seo_section .seo_content tbody tr{background:#fff;font-size:1.1em;}
.seo_section .seo_content tbody tr.second{background:#e8e8e8;}
.seo_section .seo_content tbody td:first-child{font-weight:bold;}

/*template*/
.template-banner{ background: url(../images/template-banner.jpg) no-repeat; background-size: cover; position: relative; height: 600px; }
.template-banner__text{ position: absolute; left: 5%; top: 20%; color: #fff; letter-spacing: 0.05rem; box-sizing: border-box; }
.template-banner__text h5{ font-size: 50px; letter-spacing: 0.05rem; }
.template-banner__text > span{ font-size: 35px; border: 1px solid #fff; padding: 5px 15px; text-align: center; margin: 10px auto; display: block; }
.template-banner__text p{ line-height: 36px; letter-spacing: 0.05rem; font-size: 24px; }
.template-intro{ background-color: #f4f4f4; padding: 50px 0; text-align: center; }
.template-intro__wrapper{ display: flex; justify-content: space-evenly; flex-wrap: wrap; }
.template-intro h4{ font-size: 45px; font-weight: bold; text-align: center; letter-spacing: 0.2rem; margin-bottom: 40px; }
.template-intro h4::after{ content: ''; display: block; background-color: #93bfe5; width: 60px; height: 8px; margin: 15px auto 0; }
.template-intro__article{ display: inline-block; width: 600px; vertical-align: top; }
.template-intro__item:hover .template-intro__img img{ transform:scale(1.1); opacity: 0.5;}
.template-intro__item:hover .template-intro__title{ background-color: #000; color: #fff;}
.template-intro__item:hover .template-intro__title span{ color: #00d8ff; }
.template-intro__article h5{ font-size: 36px; text-align: center; margin-bottom: 20px; letter-spacing: 0.1rem; }
.template-intro__item{ margin-bottom: 40px; box-shadow: 0 0 12px 5px rgba(0, 0, 0, 0.1);}
.template-intro__item a{ display: block;  color: #000; }
.template-intro__title{ background-color: #fff; padding: 15px; font-size: 26px; text-align: left; letter-spacing: 0.05rem; }
.template-intro__title span{ font-size: 22px; color: #2987b9;}
.template-intro__article:last-of-type .template-intro__title span{ color: #cd63f5;}
.template-intro__item:hover .template-intro__article:last-of-type .template-intro__title span{ color: #d877fc; }
.template-intro__img{ display: block; font-size: 0; overflow: hidden; background-color: #000;}
.template-intro__img img{ width: 100%; height: auto; transition: all 1s ease-in-out; }
.template-link{ display: block; margin: 25px auto; text-align: center; font-size: 24px; background-color: #f24a1f; color: #fff; font-weight: bold; width: 210px; height: 65px; line-height: 65px;}
.template-link:hover{ background-color: #000; }

/*contact*/
.contact_ework{width:27%; float:left; background:#fff; margin-bottom:50px; opacity:0;}
.contact_ework img{width:100%;}
.contact_ework .eworkInfomation{padding:20px; text-align:center;}
.contact_ework .eworkInfomation .eworkName{font-size:1.5em; font-weight:bold; margin-bottom:30px;}
.contact_ework .eworkInfomation .phones{margin:20px 0; font-size:1.2em;}
.contact_ework .eworkInfomation .phones p:first-child{color:#6e6d6d; font-size:0.8em;}
.contact_ework .eworkInfomation .phones a{text-decoration:underline; color:#000;}
.contact_right{float:right; width:70%; margin-bottom:50px; margin-right:1%; opacity:0;}
.form_row{width:50%; float:left; box-sizing:border-box; padding-left:4%; margin-bottom:3em;}
.form_row .button{width: 100%; margin-top:1em;}
.form_row2{width:100%; margin-bottom:3em; box-sizing:border-box; padding-left:4%;}
.form_row2 .text_box{border:0; background:#d7d7d7; color:#000; height:150px; width:100%; margin-top:0.5em;}
.form_row3{width:30%; float:left; box-sizing:border-box; padding-left:4%; margin-bottom:3em;}
.form_row4{width:30%; float:right; box-sizing:border-box; padding-left:4%; margin-bottom:3em;}
.form_row4 .button--wayra {color:#000; border-color:#000;}
.form_row4 .button--wayra::before {background: #000;}
.form_row4 .button--wayra:hover {color: #fff;	border-color: #000;}
.form_row4 .button--wayra.button--inverted:hover {color: #fff;	border-color: #000;}
.form_row4 .button--wayra.button--inverted:hover::before {background-color: #000;}
.input__label {color: #000; font-size: 1.2em;}
.input__field--ruri {color: #000;}
.input__label--ruri::after {background: #d7d7d7;}
.input__field--ruri:focus + .input__label--ruri::after,
.input--filled .input__label--ruri::after {	background: #d7d7d7;}
.input__field--ruri:focus + .input__label--ruri .input__label-content--ruri,
.input--filled .input__label--ruri .input__label-content--ruri {color: #777;}

/* ---- Pagination ---- */
.text-center {text-align: center; margin:20px 0;}

.pagin{ margin:40px 0;}
.pagin ul {list-style: none; margin: 0; padding: 0;}
.pagin li {display: inline;}
.pagin a {
	        border-radius: 3px;
		-ms-border-radius: 3px;
	   -moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	margin: 1px 2px;
	width:24px;
	height:24px;
	line-height:24px;
	display: inline-block;
	border-top: 1px solid #fff;
	text-decoration: none !important;
	color: #333 !important;
	font-size: 12px;
	font-family: "Helvetica Neueu", Helvetica, Arial, sans-serif;
	text-shadow: white 0 1px 0;
	background-color: #f5f5f5;
	background-image: linear-gradient(top, #f9f9f9, #eaeaea);
	background-image: -ms-linear-gradient(top, #f9f9f9, #eaeaea);
	background-image: -moz-linear-gradient(top, #f9f9f9, #eaeaea);  
	background-image: -webkit-linear-gradient(top, #f9f9f9, #eaeaea);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f9f9f9', EndColorStr='#eaeaea');
}
.pagin a:hover, .pagin a:focus {
	border-color: #fff;
	background-color: #333333;
	background-image: linear-gradient(top, #fefefe, #fafafa);
	background-image: -ms-linear-gradient(top, #fefefe, #fafafa);
	background-image: -moz-linear-gradient(top, #fefefe, #fafafa);
	background-image: -webkit-linear-gradient(top, #fefefe, #fafafa);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#fefefe', EndColorStr='#fafafa');  
}
.pagin a.more {
	        box-shadow: none;
	   -moz-box-shadow: none;
	-webkit-box-shadow: none;
	border: 0 none !important;
	background: transparent !important;
	margin-left: 0;
	margin-right: 0;
}
.pagin-dark a {
	border-top: 1px solid #575e63;
	text-shadow: rgba(0, 0, 0, 0.75) 0 1px 0;
	color: #fff !important;
	background-color: #4e5458;
	background-image: linear-gradient(top, #575e63, #3f4347);
	background-image: -ms-linear-gradient(top, #575e63, #3f4347);
	background-image: -moz-linear-gradient(top, #575e63, #3f4347);
	background-image: -webkit-linear-gradient(top, #575e63, #3f4347);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#575e63', EndColorStr='#3f4347');
}
.pagin-dark a:hover, .pagin-dark a:focus {
	border-color: #575e63;
	background-color: #4d6374;
	background-image: linear-gradient(top, #333333, #05571c);
	background-image: -ms-linear-gradient(top, #333333, #05571c);
	background-image: -moz-linear-gradient(top, #333333, #05571c);
	background-image: -webkit-linear-gradient(top, #333333, #05571c);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#333333', EndColorStr='#05571c');
}
.pagin a, .pagin-dark a {
		    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2);
	   -moz-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2);
	-webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2);
}
.pagin a.active, .pagin-dark a.active {
	        box-shadow: inset 0 0 0 0 rgba(0, 0, 0, 0.75);
	   -moz-box-shadow: inset 0 0 0 0 rgba(0, 0, 0, 0.75);
	-webkit-box-shadow: inset 0 0 0 0 rgba(0, 0, 0, 0.75);
	border-color: #333333 !important;
	color: #fff !important;
	text-shadow: black 0 1px 0;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e52733+0,e60013+100 */
background: #cc2226; /* Old browsers */
}

@media only screen 
and (max-width : 1400px) {
.page_content{ padding: 0 20px;}
/*profito*/
.wrok_items .work .work_item{height: 28.5vw;}
.about04 .ourGroup .ourContent{height: 46vw;}
.wall{background-position: center 70px;}
.wall .screen_img{width:70%;}
.profitio .big_img{width:66%;}
.profitio .sml_img{width:31.6%;}
.profitio .three_img{margin:0 -12px; margin-bottom:1.8em;}
.profitio .three_img div{padding:0 12px;}

/*template*/
.template-intro__article{ width: 48%; }
}

@media only screen and (max-width : 1200px) {
/*about*/
.about01 .about01_word{line-height:1.6em;}
.about_service{background-position: center center;}
.about03{padding:0 30px 30px; height:300px;}
.about03 .about03_soul{width:62%;}
.about03 .about03_title{padding-top:40px; margin-bottom:10px;}
.about03 .about03_word{padding:30px 25px; margin-top:20px; font-size:1.05em;}
.about04 .ourGroup .ourContent{height: 53vw;}
.about04 .ourGroup .ourName{font-size:1.3em;}
.about04 .ourGroup .ourName .jobTitle{ font-size:0.6em;}

/*profito*/
.wrok_items .work{width:33.33%;}
.wrok_items .work .work_item{height: 37vw;}
.wall{background-position: center 40px; height: 46vw; margin-bottom:100px;}
.other_works .other_work_list .other_img{ width:195px;} 
.other_works .other_work_list .icons{margin-bottom:0.6em;}
.profitio .big_img, .profitio .sml_img, .profitio .sml_img .smll, .profitio .three_img div{height:auto;}

/*contact*/
.form_row, .form_row2, .form_row3, .form_row4{margin-bottom:1.5em;}
}
@media only screen and (max-width : 979px) {
.bar li{font-size:1em;}
/*about*/
.about01 .about01_img{margin:-40px 0 0px; width:100%; height:auto;}
.about01 .about01_img img{width:100%; position:inherit; left:0; margin:0; z-index:0}
.about01 .about01_soul{width:100%;}
.about01 .about01_title{padding-top:0px; margin-top:-150px; color:#fff; text-align:center; text-shadow:0 0 5px rgba(0, 0, 0, 0.5); position:relative; z-index:2;}
.about01 .about01_word{padding:20px 25px 30px; height:auto; width:90%; margin:40px auto 0; line-height:1.6em; background-color:#fff; background-color:rgba(255, 255, 255, 0.9); position:relative; z-index:2;}
.big_word{font-size:1.8em;}
.about02 .about02_tit{width:30%;}
.about02 .about02_content{width:70%;font-size:1em;}
.about_service .service_tit{font-size:1.8em; padding:0.5em 1em 1em;}
.about03{padding:0 20px 30px; height:220px; margin-bottom:65px;}
.about03 .about03_img{margin:-25px 0 0px;}
.about03 .about03_title{font-size:1.8em; padding-top:25px;}
.about03 .about03_word{padding:15px 20px; font-size:1em;}
.insist1234 .insist .insist_num{font-size:4em;}
.insist1234 .insist .insist_name{font-size:1.3em;}
.insist1234 .insist .insist_word{font-size:1em;}
.about04 .ourGroup .ourName{font-size:1.1em; line-height:20px; margin-bottom:13px;}
.about04 .ourGroup .ourName img{width:10%;}
.about04 .ourGroup .ourName .jobTitle{ font-size:0.7em; display:block; float:none;}
.about04 .ourGroup .ourContent{font-size:0.95em; height:auto;}
.about04 .ourGroup .ourContent .our_list .our_list_row p{display:block;width:100%;}
.about04 .ourGroup .ourContent .our_list .our_list_row .our_title{width:100%;}

/*profito*/
.wrok_items .work .work_item{height: 40vw;}
.work_intro{margin:0 2%;}
.other_works .other_work_list .other_img{ width:100%; float:none; margin-bottom:1em;} 
.other_works .other_work_list .icons{margin-bottom:0.5em;}

/*project*/
.project_list .p_descript{line-height:1.5em; font-size:0.9em;}
.project_detail .detail_words{font-size:1em;}

/*articel*/
.article .article_list{height:300px;}
.article .article_list .list_date{width:95px;}
.article .article_list .list_date .date .list_type{margin:20px auto 5px;}
.article .article_list .list_date .date .list_num{font-size:1.5em;}
.article .article_list .list_top h3{font-size:1.1em; height:95px; }

/*contact*/
.contact_ework{width:32%;}
.contact_ework .eworkInfomation .eworkName{font-size:1.4em;}
.contact_ework .eworkInfomation .phones{ font-size:1.05em;}
.contact_right{float:right; width:65%; margin-bottom:50px; margin-right:1%;}
.form_row, .form_row2, .form_row3, .form_row4{margin-bottom:1.4em;}
.form_row3, .form_row4{width:40%;}
.input__label {font-size: 1em;}

/*template*/
.template-intro__article h5{ font-size: 30px; }
.template-banner__text h5{ font-size: 45px; }
.template-banner__text h5 span{ font-size: 55px; }
.template-banner__text > span{ font-size: 36px; }
}

@media only screen and (max-width : 767px) {
.bar li{margin:0; display:block; background:#fff; padding-right:0; font-size:1.1em; line-height:55px; border-bottom:1px solid #ddd}
.bar li .bar_on{display:none;}
.bar li a.navOn{border:0; padding:0;}
.bar li a{padding:0; color:#000; display:block;}
/*about*/
.about01 .about01_word{font-size:1.05em;}
.big_word{font-size:1.5em;}
.about_block01, .about_block02, .about_block03{border-width:8px;}
.a_icon_l, .a_icon_r{width:100px;}
.about_block03 span{display:block;}
.about_block03{line-height:2.5em;}
.about02 .about02_tit{width:100%; float:none; text-align:left; margin-bottom:3%; font-size:2em;}
.about02 .about02_content{width:100%;}
.about_service .service_tit{font-size:1.7em; padding:0 0 0.8em ;}
.three_box li .a_name{font-size:1.3em;}
.three_box li .a_texts{font-size:0.8em;}
.about03{padding:0 20px; margin-bottom:25px;height:280px;}
.about03 .about03_img{margin:-10px 0 0px; width:44%; }
.about03 .about03_soul{width:52%;}
.about03 .about03_title{padding-top:20px;}
.about03 .about03_word{padding:15px; margin-top:25px; line-height:1.6em; font-size:0.95em;}
.insist1234 .insist{float:none; width:100%; padding:2%; margin:0px; box-sizing:border-box;}
.insist1234 .insist .insist_num{font-size:4em; float:left; width:20%;}
.insist1234 .insist div{float:right; width:77%;}
.insist1234 .insist .insist_name{font-size:1.2em; text-align:left; margin:2% 0;}
.insist1234 .insist .insist_word{font-size:0.95em;}
.about04 .ourGroup{float:none;}

/*profito*/
.wrok_items .work{width:50%;}
.wrok_items .work .work_item{height: 55vw;}
.wall{background-position: center 10px;}
.work_intro ul li{font-size:1em;}
.work_intro .work_description{font-size:1em;}
.profitio .big_img, .profitio .sml_img, .profitio .three_img div{ float:none; width:100%;height:auto;}
.profitio .big_img img, .profitio .sml_img img, .profitio .three_img img{width:100%; height:auto;}
.profitio .three_img{margin:0;}
.profitio .three_img div{padding:0; margin-bottom:1.8em;}

/*articel*/
.article .article_list{height:250px;}
.article .article_list .list_date{width:70px;}
.article .article_list .list_date .date .list_type{margin:10px auto 0px;}
.article .article_list .list_date .date .list_num{font-size:1.5em;}
.article .article_list .list_top h3{font-size:1em; height:70px; }
.article .article_list .desciption{height:90px; font-size:0.9em; line-height:1.6em;}
.article_detail{padding:40px 30px;}
.article_detail .article_title{padding:0.8em 0; font-size:1.3em;}
.article_detail .edit{font-size:1em;}

/*project*/
.project_list .p_descript{line-height:1.5em; font-size:0.85em;}

/*contact*/
.contact_ework .eworkInfomation .eworkName{font-size:1.3em;}
.contact_ework .eworkInfomation .phones{ font-size:1em;}
.contact_ework .eworkInfomation .phones p:first-child{font-size:0.9em;}
.form_row, .form_row2, .form_row3, .form_row4{margin-bottom:1.2em;}
.form_row3, .form_row4{width:45%;}
.form_row4 .button {font-size: 1em;}
.form_row2 .text_box{height:120px;}

/*template*/
.template-banner{ background-position: 85%; background-blend-mode: multiply; background-color: rgba(0, 0, 0, 0.2); height: 500px;}
.template-banner__text{ background-color: rgba(0, 0, 0, 0.6); padding: 25px; left: 0; right: 0; bottom: 0; text-align: center; }
.template-intro h4{ font-size: 40px; }
.template-intro h4::after{ width: 55px; margin: 10px auto 0; }
}
@media only screen and (max-width : 639px) {
.pageTitle p{font-size:1.7em;}
.pageTitle h3{font-size:0.9em;}
.bar{min-height:55px; line-height:55px;}
.bar li{margin:0; display:block; background:#fff; padding-right:0; font-size:1.1em; line-height:55px; border-bottom:1px solid #ddd}
.bar li .bar_on{display:none;}
.bar li a.navOn{border:0; padding:0;}
.bar li a{padding:0; color:#000;}
/*about*/
.about01{padding:0 0 20px;}
.about01 .about01_word{font-size:0.95em; padding:15px;}
.about_block03 span{font-size:0.8em;}
.about02 .about02_tit{margin-bottom:4%; font-size:1.8em;}
.about02 .about02_content{font-size:0.95em;}
.about_service{margin:2em 0; padding:0; background:none;}
.about_service .service_tit{font-size:1.6em; color:#000; padding:0 0 1em 0;}
.three_box li{float:none; width:100%; text-align:left; margin-bottom:2em; overflow:hidden;}
.three_box li img{width:25%;margin-right:1em; float:left;}
.three_box li .a_en{margin:10px 0 5px;}
.three_box li .a_name{font-size:1.2em; color:#000;}
.three_box li .a_texts{font-size:0.8em; margin:5px auto; color:#888;}
.about03{padding:20px; height:auto; margin-bottom:0px;}
.about03 .about03_img{ display:none; }
.about03 .about03_soul{width:100%;}
.about03 .about03_title{font-size:1.8em;}
.insist1234 .insist{padding:3% 2%;}
.insist1234 .insist .insist_num{font-size:3.5em;}
.about04 .ourGroup .ourName .jobTitle{float:right; font-size:0.8em; text-transform:uppercase;}
.about04 .ourGroup{width:100%; float:none;}
.about04 .ourGroup .ourName{line-height:39px;}
.about04 .ourGroup .ourName img{width:7%;}

/*profito*/
.wrok_items .work{width:50%;}
.wrok_items .work .work_item{height: 59vw;}
.wrok_items .work .work_item .work_content h3{font-size:1.4em;}
.wrok_items .work .work_item .work_content .en{font-family: 'Slabo 27px', serif;}
.myWork{margin:1.5em 0; text-align:center;}
.myWork h4{font-size:1.1em; float:none; margin-left:0; margin-bottom:0.5em;}
.myWork .skill{float:none; margin-right:0;}


/*.profitio .sml_img .smll{float:left; width:48%;}
.profitio .sml_img .smll:last-child{ float:right;}*/

/*project*/
.grid{margin-top:-20px;}
.project_list h3{font-size:1em; margin:10px 0;}
.project_list{padding:12px;}
.project_detail .detail_words{font-size:0.9em; margin-top:1em; line-height:1.5em;}

/*articel*/
.article .article_list{height:210px;}
.article .article_list .list_top{margin-bottom:8px; padding-bottom:10px;}
.article .article_list .list_date{width:60px; margin-right:15px;}
.article .article_list .list_date .date .list_type{margin:10px auto 0px;}
.article .article_list .list_date .date .list_num{font-size:1.2em;}
.article .article_list .list_top h3{font-size:0.95em;}
.article .article_list .desciption{height:70px; font-size:0.9em; line-height:1.6em;}
.article_detail{padding:30px 20px;}

/*seo*/
.seo_word{font-size:1em;}
.seo_section .seo_content thead{font-size:1.2em;}
.seo_section .seo_content tbody tr{font-size:1em;}

/*contact*/
.contact_ework{width:100%; float:none; height:auto;}
.contact_ework img{width:40%; float:left;}
.contact_ework .eworkInfomation{float:right; padding:0; text-align:left; width:57%}
.contact_ework .eworkInfomation .eworkName{font-size:1.3em; margin:8% 0 1% 0;}
.contact_ework .eworkInfomation .phones{margin:10px 0; font-size:1em;}
.contact_ework .eworkInfomation .phones p{display:inline-block;}
.contact_ework .eworkInfomation .phones p:first-child{font-size:0.9em; width:80px;}
.contact_right{float:none; width:100%; margin-right:0%;}
.form_row, .form_row2, .form_row3, .form_row4{margin-bottom:1.2em;  padding:0 2%;}
.form_row3, .form_row4{width:45%;}
.form_row4 .button {font-size: 1em;}
.form_row2 .text_box{height:120px;}

/*template*/
.template-banner{ height: 450px; }
.template-banner__text h5{ font-size: 40px; }
.template-banner__text h5 span{ font-size: 50px; }
.template-banner__text > span{ font-size: 30px; }
.template-banner__text p{ line-height: 36px; font-size: 22px; }

}

@media only screen and (max-width : 480px) {
.page_content{padding:0;}
.bar{margin:30px 0 0;}
.about_content{margin:90px 0 0;}
/*about*/
.about01 .about01_title{ font-size:1.8em;}
.about01 .about01_word{padding:15px;}
.about_title02{font-size:1.8em; font-weight:bold; padding:10px 20px;}
.about_word02{text-align:justify; font-size:0.95em; margin-bottom:50px; padding:10px 20px;}
.about_block03 span{display:block; font-size:0.65em;}
.about_block03{line-height:2em;}
.about_block03 p{font-size:0.9em;}
.three_box li img{width:40%;}
.insist1234 .insist .insist_num{font-size:2.5em;}
.about04 .ourGroup .ourName{font-size:1.2em; line-height:25px;}
.about04 .ourGroup .ourName img{width:11%;}
.about04 .ourGroup .ourName .jobTitle{ font-size:0.7em; display:block; float:none;}

/*profito*/
.wrok_items .work{width:100%;}
.wrok_items .work .work_item{height: auto; width: calc(100% - 20px); padding: 0 10px;}
.wrok_items .work .work_item .work_content h3{font-size:1.6em;}
.wall{height: 60vw;}
.wall .screen_img{width:90%;}
.work_intro ul li{font-size:0.9em;}
.work_intro .work_description{font-size:0.9em;}

/*project*/
.project_list .p_descript{line-height:1.5em; font-size:0.8em;}

/*articel*/
.article .article_list{height:200px; width:100%; float:none;}
.article .article_list:nth-child(2n){float:none;}
.article .article_list .list_date{width:70px;}
.article .article_list .list_date .date .list_type{margin:10px auto 3px;}
.article .article_list .list_date .date .list_num{font-size:1.2em;}
.article .article_list .list_top h3{font-size:1em;}
.article .article_list .desciption{height:60px; font-size:0.85em; line-height:1.6em;}

/*seo*/
.seo_section .seo_top{ text-align:center;}
.seo_section .seo_top .seoImg{float:none;}
.seo_section .seo_top .seo_type{float:none; margin-top:10px;}
.seo_section .seo_content thead{font-size:1.1em;}
.seo_section .seo_content tbody tr{font-size:0.9em;}

/*contact*/
.contact_ework img{width:40%; height:130px; float:left;}
.contact_ework .eworkInfomation .eworkName{font-size:1em; margin:5% 0 1% 0;}
.contact_ework .eworkInfomation .phones{font-size:0.8em;}
.contact_ework .eworkInfomation .phones p:first-child{font-size:0.9em; width:50px;}
.form_row3, .form_row4{width:100%;}

/*template*/
.template-intro__article{ width: 90%; }
}

/*tags*/
.tag-content{ width:100%; margin-bottom:50px; padding:30px; background-color:#fff; box-sizing:border-box} 
.tag-title{ margin-bottom:30px; display:block; font-size:30px; font-weight:bold} 
.tag-article{ margin-bottom:80px; padding-bottom:20px; border-bottom:2px solid #1f0404; position:relative} 
.tag-article__item{width:100%; padding:10px; display:flex; flex-wrap:wrap; align-content:flex-start} 
.tag-article__item:hover{ background-color:#fff} 
.tag-article__type{width:135px;align-self:flex-start; background-image:linear-gradient(to left, #1e0303, #6f6666); text-align:center}
.tag-argicle__item:hover .tag-article__type{background-image:linear-gradient(to right, #1e0303, #6f6666)}
.tag-article__type a{padding:5px; display:block; color:#fff} .tag-article__link{ width:calc(100% - 135px); padding:0 0 0 20px; box-sizing:border-box}
.tag-article__link a{font-weight:bold; font-size:21px; display:block; color:#1e0303; transition:transform .3s ease-out}
.tag-article__item:hover .tag-article__link a{transform:translateX(5px)}
.tag-web{width:calc(100% + 20px); margin-left:-10px; margin-right:-10px; margin-bottom:50px; display:flex; flex-wrap:wrap}
.tags-box{width:100%; padding:40px 0; background-color:#fff}.tags-list{display:flex; flex-wrap:wrap; justify-content:space-between}
.tags-list__item{flex:1 auto; margin:5px 5px; padding:5px 15px; text-align:center; background-image:linear-gradient(to left,#958b8b,#b3afaf); color:#fff; border-radius:99px}
.tags-list__item:hover{background-image:linear-gradient(to right,#958b8b,#b3afaf)}
@media only screen and (max-width:960px){
	.work_item{width:calc(33.333% - 20px)}
}
@media only screen and (max-width:768px){
	.tag-article__item{border-bottom:1px solid rgba(30, 3, 3,0.3)}
	.tag-article__item:last-child{border-bottom-width:0}
	.tag-article__type{width:100px; margin-bottom:5px; font-size:0.25rem; border-radius:99px; background-image:linear-gradient(to left,#958b8ba8,#b3afafb7)}
	.tag-article__type a{padding:2px}
	.tag-article__link{width:100%; padding:0}
	.work_item{width:calc(50% - 20px)}
}

@media only screen and (max-width : 420px) {
/*template*/
	.template-banner__text{ top: 5%; }
	.template-banner__text h5{ font-size: 35px; }
	.template-banner__text > span{ font-size: 24px; }
	.template-banner__text p{font-size: 20px; }
}