@charset "utf-8";
/* CSS Document */
* {margin: 0;padding: 0;font-family: 微软雅黑;color: #333; -webkit-tap-highlight-color:transparent;font-size: 16px;background-repeat: no-repeat}
a {display:block;text-decoration: none;
}
img { border:0px; display: block}
body {margin: 0 auto;background-repeat: repeat;}
ul, li { list-style-type:none; }
button {border: none;outline: none;background-color: transparent;box-sizing: content-box;}
p {line-height: 2em;text-align: justify;}
table {border: none;border-collapse: collapse;border:0 }
tr {border: none;}
td {border: none;}
input {outline: none;border: none;}
.yx {width:1300px;margin: 0 auto;}
.fancybox-container * {color: #fff;}



/* -----------------------------------全部公共部分----------------------------------- */
/*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/ 
::-webkit-scrollbar {
    width: 4px;
    height: 4px
}
/*定义滚动条轨道*/ 
::-webkit-scrollbar-track {
    background-color: transparent;
    -webkit-border-radius: 2em;
    -moz-border-radius: 2em;
    border-radius: 2em
}
/*定义滑块 内阴影+圆角*/ 
::-webkit-scrollbar-thumb {
    background-color: #e09e21;
    border-radius: 2em
}

.hotsearch {display: flex;}
.hotsearch li {color: #fff;opacity: .7;margin: 0 10px;cursor: pointer;}
.search-box .div>div {display: flex;margin-top: 40px;}
.search-box .div>div strong {color: #fff;font-size: 16px;}
/* -----------------------------------全部公共部分----------------------------------- */



/* -----------------------------------首页----------------------------------- */


/* 首页公共 */
.fp-tooltip {font-size: 14px;left: 0;padding: 0;width: 100%;text-align: center;height: 35px;position: unset;display: flex;
    align-items: center;
    justify-content: center;background-color: rgba(0,0,0,.5);border-radius: 100px;}
    #fp-nav {left: -70px;transition: all .5s;}
#fp-nav li {margin: 10px;}
#fp-nav li.on .fp-tooltip {background-color: #e09e21;}
#fp-nav li a {width: 100px;height: unset;}
#fp-nav li a:hover .fp-tooltip {background-color: #e09e21;}

.cout {position: relative;z-index: 1;}
.inx-title {margin: 60px 0;display: flex;flex-direction: column;align-items: center;}
.inx-title .title {font-size: 44px;font-weight: bold;}
.inx-title i {display: block;width: 40px;height: 6px;border-radius: 3px;background-color: #e09e21;font-weight: bold;margin-top: 18px;}
/* 首页公共 */


/* 关于童圣  */
.sec2-cont {background-color: #fffffff0;border-radius: 20px;}
/* 关于童圣  */

/* 首页导航 */
.barwrap .logo {flex-grow: unset;display: flex;align-items: center;height: 100%;}
.barwrap .logo img {margin-right: 20px;
    max-height: 70%;
    width: auto;}
.navbar {flex-grow: unset;}
.barwrap {display: flex;justify-content: space-between;background-color: rgba(0,0,0,.5);}
.barwrap>div {display: flex;align-items: center;}
.barwrap .div2 h3 {margin-left: 20px;}
.navbar li {margin: 20px;}
.navbar li a:hover {color: #e09e21;}
.navbar li.on a {color: #e09e21;}
.barwrap .logo span {font-size: 22px;color: #fff;font-family: cursive;}
/* 首页导航 */

/* 产品展示 */
.sec3-cont .swiper-slide {flex: 1;width: unset!important;}
.sec3-cont .jianjie {width: 80%;
    color: #fff;
    margin: 0 auto;
    text-align: center;
    line-height: 2em;
    font-size: 14px;
    margin-bottom: 50px;}
.sec3-cont h3 {font-size: 34px;}
.sec3-cont .cp-text {padding: unset;}
.index-sec3 {background-position: center;background-size: cover;}
.index-sec3>div {background-color: rgba(0,0,0,.4);}
.sec3-cont .cp-tu {z-index: 1;bottom: unset;top: 20px}
.sec3-cont .cp-tu {max-height: 300px;width: auto;}
.sec3-cont .swiper-slide:hover .cp-text {margin-top: unset;transform: translateY(180px);}
/* 产品展示 */

/* 工艺流程 */
.inx-liucheng {padding-top: 100px;position: relative;background-image: url(../img/ggbg.jpg);flex-wrap: wrap;background-repeat: repeat;width: 100%;height: 100%;}
.inx-liucheng>img {position: absolute;width: 100%;height: 100%;top: 0;z-index: 0;opacity: 0.2;object-fit: cover;}
.inx-liucheng .cout {display: flex;flex-direction: column;align-items: center;}

#liucout {width: 100%;}
#liucout .box {width: 90%;margin: 0 auto;display: flex;flex-direction: column;align-items: center;}

#liucout .box .miaoshu {height: 200px;width: 100%;background-color: #e09e21;border-radius: 20px;padding: 20px;box-sizing: border-box;;display: flex;align-items: center;flex-direction: column;transition: .5s all;}
#liucout .box:hover .miaoshu {background-color: #39a783;}

#liucout .box .tu {width: 200px;height: 200px;border-radius: 50%;margin: 0 auto;object-fit: cover;overflow: hidden;background-position: center;background-size: cover;}
#liucout .box .tu>div {width: 100%;height: 100%;transition: all .5s;position: relative;padding: 10px;box-sizing: border-box;background-color: rgba(0,0,0,.5);opacity: 0;}
#liucout .box .tu .xuxiank {width: 100%;height: 100%;transition: ease-in .5s;border-radius: 50%;border: 1px dashed #fff;;animation: zhuanquan 40s linear 0s infinite normal;}
#liucout .box .tu .liuchennum {font-size: 50px;font-weight: bold;position: absolute;color: #fff;top: 50%;left: 50%;transform: translate(-50%,-50%);}


#liucout {cursor: url('../img/gongyi0mouse.png'), auto;}

#liucout .box:hover .tu>div {opacity: 1;}
@keyframes zhuanquan{
    0% {transform: rotate(0deg);}
    100% {transform: rotate(360deg);}
}
#liucout .box .name {font-size: 20px;
    margin: 10px 0;
    font-weight: bold;
    color: #fff;}
#liucout .swiper-wrapper {position: relative;}
#liucout .box .miaoshu p {font-size: 15px;text-indent: 2em;color: #fff;line-height: 1.8em;}
#liucout li:nth-child(2n) .box {flex-direction: column-reverse;}
#liucout .box .xian {height: 70px;width: 1px;background-color: #e09e21;display: flex;flex-direction: column;align-items: center;justify-content: center;}
#liucout .box .xian>o {display: block;width: 12px;height: 12px;background-color: #e09e21;border-radius: 50%;}
.inx-liucheng .hengxian {width: 600px;height: 1px;background-color: #e09e21;position: absolute;top: 50%;transition: .5s all;}
/* 工艺流程 */


/* 童圣优势 */


.xilie {width: 100%;height: 100%;position: relative;}
.xilie .bgimg {position: relative;width: 100%;height: 100%;overflow: hidden;}
.xilie .bgimg li {position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: 0;transform: scale(1.025);transition: all 1000ms ease 0ms;}
.xilie .bgimg .img {width: 100%;height: 100%;background-size: cover;background-position: center;}
.xilie .bgimg .mask {width: 100%;height: 100%;background-color: rgba(0,0,0,.3);}
.xilie .xiliebox {position: absolute;top: 0;left: 50%;width: 84%;transform: translateX(-50%);height: 100%;display: flex;padding-top: 100px;box-sizing: border-box;}
.xilie .xiliebox>li {flex: 1;height: 100%;border-right: 1px solid rgba(255,255,255,.3);transition: all .5s;cursor: pointer;;transition-timing-function:cubic-bezier(0.68, -0.55, 0.265, 1.55);}
.xilie .xiliebox>li:first-child {border-left: 1px solid rgba(255,255,255,.3)}
.xilie .bgimg .on{opacity: 1;transform: scale(1);}
.xilie .xiliebox .on {background-color: rgba(0,0,0,.5);}
.xiliebox * {color: #fff;}
.xiliebox li h1 {font-size: 26px;color: #fff;margin-bottom: 10px;}
.xiliebox li>div {margin-top: 80px;width: 80%;justify-content: space-between;display: flex;flex-direction: column;align-items: center;}
.xiliebox .xlcout>span {text-indent: 0;
    background-color: #f13d41;
    padding: .5vw 1vw;
    font-size: .8vw;
    width: 90%;
    text-align: center;
    border-radius: 1vw;margin: 1vw 0 2vw}
.xiliebox>li {display: flex;flex-direction: column;align-items: center;justify-content: center;}



.xilie-list {margin-top: 20px;width: 100%;}
.xilie-list li span {font-size: 14px;}
.xilie-list li {border-bottom: 1px dashed rgba(255,255,255,.6);padding: 10px 0;}

.xiliebox li>div>div {display: flex;flex-direction: column;align-items: center;width: 100%;}


.xlcout {opacity: 0;transition-timing-function:cubic-bezier(0.68, -0.55, 0.265, 1.55);transition: all 1s;height: 0;transition-delay: 300ms}
.xiliebox .on .xlcout {opacity: 1;height: 300px;width: 100%;}
.xiliebox .on .more {opacity: 1;}

.xilie .inx-title {position: absolute;top: 120px;left: 50%;transform: translateX(-50%);}
.xilie .inx-title .title {color: #fff;}
/* 童圣优势 */

/* 为何选择童圣 */
.whychse {position: relative;width: 100%;height: 100%;padding-top: 100px;}
.whychse>img {position: absolute;width: 100%;height: 100%;top: 0;z-index: 0;opacity: 0.2;object-fit: cover;}
.whychse .cout {width: 100%;height: 100%;position: relative;z-index: 1;display: flex;flex-direction: column;align-items: center;}
.whychse .bijiao {width: 800px;height: 140px;border-radius: 70px;background-image: url(../img/why01.jpg);overflow: hidden;}
.whychse .bijiao>div {width: 100%;height: 100%;background-color: rgba(0,0,0,.6);display: flex;align-items: center;justify-content: center;color: #fff;font-size: 22px;text-align:center;line-height: 40px;}

.whychse .whycout {width: 90%;display: flex;align-items: center;margin-top: 100px;}
.whychse .whycout li {flex: 1;}
.whychse .whycout li .box {transition: all .5s;width: 90%;margin: 0 auto;}
.whychse .whycout li .box:hover {transform: translateY(-20px);}


.whychse .whycout li .box span {height: 100px;display: flex;}
.whychse .whycout img {width: 100%;height: 10vw;margin-bottom: 20px;}
/* 为何选择童圣 */

/* 合作案例 */
.inx-case {padding-top: 100px;}
.inx-case .inx-title .title {color: #fff;}
.inx-case .inx-title {margin: 0;}
.index-sec4 {background-position: center;background-size: cover;}
.index-sec4 .fp-tableCell {padding: unset;}
.index-sec4 figure span img {opacity: .6;height: auto;}
.index-sec4 figure, .index-sec4 figure img {height:20vw;object-fit:cover}

.index-sec4 .swiper-button-next:after {content: unset;}
.index-sec4 .swiper-button-prev:after {content: unset}

.index-sec4 .swiper-button-disabled {opacity: .5!important;}
/* 合作案例 */

/* 新闻中心 */
.index-sec5>div {background-color: rgba(0,0,0,.3);}
.index-sec5 a.more span {color: #fff;} 
.index-sec5 p {overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;transition: all .5s;width: 84%;}
    .index-sec5 li h3 {width: 84%;}
    .index-sec5 li:hover figcaption {padding-left:90px;}
.index-sec5 li:hover p {transform: translateX(16%);}
.index-sec5 li:hover h3 {transform: translateX(16%);}
.index-sec5 figcaption {border-radius: 10px;}
.index-sec5 .time {border-radius: 10px;}
.index-sec5 ul {padding-top: 0;}
.index-sec5 .inx-title .title {color: #fff;}
/* 新闻中心 */

/* 联系我们 */
.sec6-cont {position: relative;height: 100%;display: flex;flex-direction: column;align-items: center;justify-content: center;}
.sec6-cont ul {justify-content: space-between;}
.sec6-cont ul li {justify-content: center;}
.sec6-cont ul li:nth-child(2n+1) {width: 33%;}
.copyright {position: absolute;bottom: 0;width: 100%;left: 0;}

.inxfootnav ul {display: flex;align-items: center;}
.inxfootnav ul li {margin: 0 10px;}
.inxfootnav ul a:hover {color: #ffcd8c;}
.inxfootnav ul a {color: #fff;width: max-content;transition: all .5s;}


.sec6-cont ul li>span {background-color: #e09e21;border-radius: 50%;width: 60px;height: 60px;display: flex;align-items: center;justify-content: center;}
.sec6-cont ul li>span img {width: 60%;height: 60%;object-fit: contain;}
/* 联系我们 */

/* -----------------------------------首页----------------------------------- */


/* -----------------------------------二级----------------------------------- */


/* 二级公共 */
.weibu {display: flex;justify-content: center;}

.pbanner .text {top: 65%;}
.pbanner {height: 400px;background-position: center;background-size: cover;width: 100%;}
.pbanner figure {width: 100%;height: 100%;background-color: rgba(0,0,0,.5);}
.listnav {display: flex;align-items: center;justify-content: center;}
.listnav li {margin: 0 10px}
.listnav a {width: 130px;height: 50px;background-color: #f5f5f5;border-radius: 8px;color: #333;display: flex;align-items: center;justify-content: center;transition: all .5s;font-size: 16px;}
.listnav li.on a {background-color: #e09e21;color: #fff;}
.listnav a:hover {background-color: #e09e21;color: #fff;}

.fenye2 {display: flex;align-items: center;margin-bottom: 100px;justify-content: center;}
.fenye2 * {transition: all .3s ease;}
.fenye2 a {width: 40px;height: 40px;background-color: #fff;border-radius: 50%;box-shadow: 1px 1px 10px #eee;margin: 0 10px;display: flex;flex-direction: column;align-items: center;justify-content: center;}
.fenye2 .page-num-current {background-color: #e09e21;color: #fff;}
.fenye2 a:hover {background-color: #e09e21;}
.fenye2 .page-pre a {background-image: url(../img/fenye-left-n.png);background-size: contain;}
.fenye2 .page-pre a:hover {background-image: url(../img/fenye-left-y.png);}
.fenye2 .page-next a {background-image: url(../img/fenye-right-n.png);background-size: contain;}
.fenye2 .page-next a:hover {background-image: url(../img/fenye-right-y.png)}
.fenye2 .page-numbar {display: flex;}


.pbanner h3 {font-variant: initial;}
/* 二级公共 */


/* 联系我们 */
.contactpage .res:nth-child(1) {background-color: #eaeaea;color: #333;}
.contactpage .res:nth-child(2) {color: #fff;background-color: #e09e21;}
.contactpage .sub {margin: 0;}
.contactpage .btn-div1 {margin-top: 40px;}
.contactpage .ul1 li {flex: 1;}
/* 联系我们 */

/* 合作案例 */
.casepage ul {justify-content: unset;margin-top: 100px;}
.casepage li {width: 33.3333%;}
.casepage li img {max-width: 80%;}
.casepage li p {line-height: 2em;height: unset;margin-top: 20px;}
.casepage li figure {width: 100%;height: 100%;}
/* 合作案例 */

/* 产品中心 */
.productpage {background-color: #efeeee;padding: 80px 0;}
.towproduct .box {
	display: flex;
	justify-content: space-around;
	align-items: center;
	/* 让元素垂直排列 这里就是让包含图片的div和文字垂直排列 */
	flex-direction: column;
	width: 100px;
	height: 140px;
	margin: 20px;
	/* 鼠标放上去变成小手 */
	
}
.towproduct .box .cout {
	/* 这里让图片在盒子里垂直+水平居中 */
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100px;
	height: 100px;
	/* 圆角属性 */
	border-radius: 20px;cursor: pointer;
	/* 盒子阴影 */
	box-shadow: 18px 18px 30px rgba(0, 0, 0, 0.2),
		-18px -18px 30px rgba(255, 255, 255, 1);
	/* 过渡时间 ease-out是指先快速 后慢速 */
	transition: all 0.2s ease-out;
}

.towproduct .box p {
	color: slategrey;font-size: 20px;margin-top: 40px;transition: all .5s;
}
.towproduct .box .cout:hover {
	/* inset 是内部阴影 默认是外部阴影outset */
	box-shadow: 0 0 0 rgba(0, 0, 0, 0.2), 0 0 0 rgba(255, 255, 255, 0.8),
		inset 18px 18px 30px rgba(0, 0, 0, 0.1),
		inset -18px -18px 30px rgba(255, 255, 255, 1);
        transform: translateY(-10px);
}

.towproduct .box .cout:hover+p{transform: translateY(-20px) scale(1.1);transition-delay: .2s;}

.towproduct {display: flex;}
.towproduct .box .cout {width: 80%;height: 28vw;}
.towproduct .box {width: 50%;height: unset;}
.towproduct .box .cout img {width: 90%;object-fit: contain;height: 90%;}

/* 产品中心 */


/* 关于我们 */
.about-honey {margin-bottom: 100px;}
.about-honey .swiper-slide>a {width:100%;display:flex;flex-direction:column;align-items:center;height:20vw;padding:1vw;box-sizing:border-box;height: 18vw;justify-content:space-between;border-radius:20px;background-color: #f3f3f3;}
.about-honey .swiper-slide>a>div {width:100%;height:15vw;background-size:contain;background-position: center;}
.about-honey #swiper_zs {height:24vw}

.about-honey .swiper-pagination-bullet {width:20px;height:4px;border-radius:2px;background-color: #e09e21;}
/*.about-honey .swiper-pagination-bullet-active {background-color:#e09e21}*/
.about-honey .swiper-zhengshu {position:relative}
.about-honey .swiperzs-button-prev {width: 12px;
    height: 14px;
    clip-path: polygon(100% 0%, 100% 100%, 0% 50%);
    background-color: #e09e21;
    position: absolute;
    left: 50%;
    transform: translate(-110px,-22px);
    z-index: 1;cursor:pointer;transition: all .5s;
    
}
.about-honey .swiperzs-button-next {width: 12px;
    height: 14px;
    clip-path: polygon(0% 0%, 100% 50%, 0% 100%);
    background-color: #e09e21;
    position: absolute;
    right: 50%;
    transform: translate(110px,-22px);
    z-index: 1;cursor:pointer;transition: all .5s;
}
.about-honey .swiperzs-button-prev:hover {background-color:#e09e21}
.about-honey .swiperzs-button-next:hover {background-color:#e09e21}
.about-honey .title {font-size: 24px;font-weight: bold;text-align: center;margin-bottom: 40px;}

.video {
    width: 75%;
    border: 10px solid #f5f5f5;
    text-align: center;
    margin: 0 auto 80px;
}
@media only screen and (max-width: 900px){
    .video {
        width: 90%;
        border: 5px solid #f5f5f5;
        text-align: center;
    }
}

/* 关于我们 */


/* 搜索结果 */
.searchbt,.searchbt span {text-align: center;font-size: 30px;font-weight: bold;}
.searchbt span {color: red;}


.searchList {margin-top: 60px;}
.searchList li {margin-bottom: 60px;}
.searchList a {width: 100%;padding: 20px 40px;box-sizing: border-box;background-color: #fff;border-radius: 10px;transition: all .5s;}
.searchpage {padding:50px 0 100px 0;background-color: #f3f3f3;}
.searchpage .fenye2 {margin-bottom: 0;}
.searchList a .title,.searchList a .title span {font-size: 26px;font-weight: bold;}
.searchList a .title {margin-bottom: 10px;}
.searchpage .w1200 {max-width: 1000px;}
.searchList a .info {margin-top: 10px;display: flex;}
.searchList a .info span {display: block;padding: 0 10px;font-size: 14px;color: #999;border-right: 1px solid #ccc;}
.searchList a .info span:first-child {border-left: 1px solid #ccc;}
.searchList a:hover {transform: translateY(-10px);box-shadow: 2px 2px 20px rgba(0, 0, 0, 0.1);}
.searchList a p {font-size: 16px;}
/* 搜索结果 */


/* -----------------------------------二级----------------------------------- */


/* -----------------------------------三级----------------------------------- */

/* 产品详情 */
.proneirong .det-tit {display: flex;flex-direction: column;align-items: center;}

.proneirong .det-tit img {margin-bottom: 40px;height: 300px;}
/* 产品详情 */

/* -----------------------------------三级----------------------------------- */


/*ewm*/

.ewmbox{
    text-align: center;
    padding: 30px 0 0 0 ;
}
.ewmbox .img img{
    width: 150px;
    height: auto;
}
.ewmbox span{
    color: #fff;
    font-size: 14px;
    margin: 8px 0 0 0;
    display: block;
}






