﻿@charset "utf-8";
/* CSS Document */

*{ padding:0; margin:0; list-style:none; text-decoration:none; border:none; font-family:"微软雅黑"}
.bfSnBanner{ height:700px; width:100%; min-width:1200px; position:relative; overflow:hidden; perspective: 800px;}
.bfSnBanner > img{ display:block; position:absolute; left:50%; margin-left:-960px;}
.bfSnBanner .ceng{ position:absolute; left:50%; margin-left:-425px; top:50%; margin-top:-254px; width:850px; height:508px;  background:rgba(255,255,255,0.5); text-align:center;}
.bfSnBanner h3{ color:#000; font-size:46px; font-weight:400; letter-spacing:3px; padding-top:70px;}
.bfSnBanner h2{ color:#ff8400; font-size:86px; padding:5px 0 10px; line-height: 150px;}
.bfSnBanner .box{ font-size:28px; color:#333; width:500px; display:inline-block}
.bfSnBanner .row{ display:flex;justify-content:space-between; line-height:1.6em; padding:0;}
.bfSnBanner .btn{ display:inline-block; background:#ff8400; padding:0px 60px; line-height:45px; color:#fff; border-radius:100px; font-size:22px; position:relative; margin-top:40px; }
.bfSnBanner .btn::after{ display:block; content:""; width:0; height:0; border:8px solid transparent; border-left-color:#fff; position:absolute; top:15px; left:210px;}
.bfSnBanner .btn::before{ display:block; content:""; width:100%; height:100%; position:absolute; top:0; left:0; border: 1px solid #ff8400; border-radius:100px; box-sizing:border-box; transform:scale(1); transition:0.3s}
.bfSnBanner .btn:hover::before{ transform:scale(1.03,1.15); border-color:#f35000;}





.bfSnRen{ background:url(../images/bfsnkcbg.jpg) repeat-y center; padding:90px 0; }
.bfSnRenTitle{ text-align:center; color:#fff;}
.bfSnRenTitle h2{ font-size:40px; line-height:50px;}
.bfSnRenTitle p{ font-size:30px; padding-top:10px;}
@keyframes snLine{
	0%{ transform:rotate(0)}
	100%{ transform:rotate(360deg)}	
}
@keyframes snLine2{
	0%{ transform:rotate(0)}
	100%{ transform:rotate(-360deg)}	
}
.bfSnRenCon{ width:1200px;  margin:0 auto; margin-top:70px; height:600px; position:relative;}
.bfSnRenCon .line{ width:600px; height:600px; position:absolute; left:300px; top:0;}
.bfSnRenCon .line i{ display:block; border:1px solid #fff; border-radius:50%; position:absolute; animation:snLine 30s linear infinite}
.bfSnRenCon .line i:nth-child(1){ width:600px; height:600px; top:0; left:0;}
.bfSnRenCon .line i:nth-child(2){ width:500px; height:500px; top:50px; left:50px; animation:snLine2 30s linear infinite}
.bfSnRenCon .line i:nth-child(3){ width:400px; height:400px; top:100px; left:100px; animation-duration:10s}
.bfSnRenCon .line i::before{ display:block; width:6px; height:6px; content:""; background:#fff; border-radius:50%; box-shadow:0 0 13px 2px rgba(255,255,255,1); position:absolute;}
.bfSnRenCon .line i:nth-child(1)::before{ left:50%; margin-left:-3px; top:-3px;}
.bfSnRenCon .line i:nth-child(2)::before{ top:50%; margin-top:-3px; left:-3px; }
.bfSnRenCon .line i:nth-child(3)::before{ top:50%; margin-top:-3px; right:-3px; }
.bfSnRenCon .line i:nth-child(1)::after{display:block; width:6px; height:6px; content:""; background:#fff; border-radius:50%; box-shadow:0 0 13px 2px rgba(255,255,255,1); position:absolute; left:108px; top:530px;}
.bfSnRenCon .line i:nth-child(2)::after{display:block; width:6px; height:6px; content:""; background:#fff; border-radius:50%; box-shadow:0 0 13px 2px rgba(255,255,255,1); position:absolute; top:424px; left:424px;}


.bfSnRenCon .zi{  background:linear-gradient(90deg,#fff 0,#def1ff 100%); width:260px; height:260px; border-radius:50%; position:absolute; top:50%; margin-top:-130px; left:50%; margin-left:-130px; color:#6176e4; text-align:center; padding-top:86px; box-sizing:border-box;  font-size:36px; font-weight:600; line-height:45px;}
.bfSnRenCon .zi::after,.bfSnRenCon .zi::before{ display:block; width:260px; height:260px; border:1px solid #fff; border-radius:50%; position:absolute; top:0; left:0; content:""; box-sizing:border-box; opacity:0; transition:0.5s}
.bfSnRenCon .zi:hover::after{transform:scale(1.2); opacity:0.2; transition-delay:0.1s}
.bfSnRenCon .zi:hover::before{  transform:scale(1.1); opacity:0.6}




.bfSnRenCon .item{ height:50px; padding:0 40px; border-radius:30px; 
background:linear-gradient(90deg,#fff 0,#e3f3ff 100%); display:inline-block; font-size:23px; color:#6176e4; line-height:50px; position:absolute;}
.bfSnRenCon .item:nth-child(1){ top:130px; left:260px;}
.bfSnRenCon .item:nth-child(2){ top:230px; left:180px;}
.bfSnRenCon .item:nth-child(3){ top:330px; left:140px;}
.bfSnRenCon .item:nth-child(4){ top:430px; left:220px;}
.bfSnRenCon .item:nth-child(5){ top:180px; left:720px;}
.bfSnRenCon .item:nth-child(6){ top:280px; left:830px;}
.bfSnRenCon .item:nth-child(7){ top:380px; left:790px;}


.bfSnKc{ padding:100px 0 0}
.bfSnKcTitle { text-align:center;}
.bfSnKcTitle h2{ font-size:40px; color:#333;line-height:50px;}
.bfSnKcTitle p{ font-size:20px; padding-top:20px; color:#777; line-height:1.6em;}

.bfSnKcJdOne{ background:url(../images/bfsnjdbg.jpg) repeat-y center; padding:60px 0; margin-top:40px;}
.bfSnKcJdTitle{ text-align:center; color:#fff;}
.bfSnKcJdTitle h3{ font-size:30px; line-height:45px;}
.bfSnKcJdTitle p{ font-size:16px; line-height:1.6em; padding-top:15px; opacity:0.8}

.bfSnKcJdOneCon{ text-align:center; margin-top:60px;}
.bfSnKcJdOneCon .item{ display:inline-block; margin:0 20px;}
.bfSnKcJdOneCon .item span{ display:block; font-size:18px; color:#fff; padding:10px 0}

.bfSnKcJdTwo{ padding:70px 0 10px}
.bfSnKcJdTwo .bfSnKcJdTitle{ color:#555}


.bfSnKcBox{ height:570px; width:100%; min-width:1200px; background:#6772e5; margin-top:40px; margin-bottom:120px; position:relative;}
.bfSnKcBox .pic{ width:58%; height:570px; position:relative; overflow:hidden;}
.bfSnKcBox .pic img{ position:absolute; right:0; top:0; position:absolute; display:none;}
.bfSnKcBox .txt{ width:42%; height:570px; color:#fff; position:absolute; top:0; left:58%; padding:80px 60px 0 40px; box-sizing:border-box;}
.bfSnKcBox .txt h4{ font-size:28px; font-weight:400; padding-bottom:40px;}
.bfSnKcBox .txt p{ font-size:16px; text-align:justify; line-height:1.8em; text-indent:2em; padding-bottom:15px;}
.bfSnKcBox .list{ font-size:0; padding:5px; background:#fff; position:absolute; left:50%; margin-left:-96px; bottom:-30px; box-shadow:0 5px 15px rgba(0,0,0,0.2)}
.bfSnKcBox .list img{ width:220px; margin:3px; cursor:pointer; opacity:0.6}
.bfSnKcBox .list img.active{ opacity:1}
.bfSnKcBox:nth-child(odd){ background:#0cb7d3;}
.bfSnKcBox:nth-child(odd) .pic{ float:right;}
.bfSnKcBox:nth-child(odd) .pic img{right:auto; left:0;}
.bfSnKcBox:nth-child(odd) .txt{ left:0}
.bfSnKcBox:nth-child(odd) .list{ margin-left:-600px;}


.bfSnKcJdThree{ background:url(../images/bfsnkcbg3.jpg) repeat-y center; padding:80px 0;}
.bfSnKcJdPic { width:1200px; margin:0 auto; margin-top:50px;}
.bfSnKcJdPic .row{ margin-bottom:10px; display: flex;justify-content:space-between}
.bfSnKcJdPic .item{ position:relative; cursor:default}
.bfSnKcJdPic .item span{ width:70%; height:50%; position:absolute; background:rgba(255,255,255,0.8); top:25%;
left:15%; text-align:center; transform:rotate(-150deg) scale(0); opacity:0; transition:0.3s}
.bfSnKcJdPic .item b{ display:block; font-size:18px; color:#000; padding:20px 0 10px;}
.bfSnKcJdPic .item i{ font-style:normal; font-size:14px; color:#444; display:block; padding:0 20px;}
.bfSnKcJdPic .item:hover span{ transform:rotate(0) scale(1); opacity:1}


.bfSnKcFore{ background:url(../images/bfsnfourbg.jpg) no-repeat center; padding:80px 0 100px}
.bfSnKcForeTitle{ text-align:center; color:#fff;}

.bfSnKcForeTitle h3{font-size:30px; line-height:45px;}
.bfSnKcForeTitle h4{ font-size:26px; color:#7eddeb; font-weight:400; padding:10px 0 20px;}
.bfSnKcForeTitle p{font-size:16px; line-height:1.7em; padding-top:15px; opacity:0.8}
.bfSnKcForeImg{ width:1200px; height:560px; /*background:url(../images/bfsnfourpic.jpg) no-repeat center;*/ margin:50px auto 0}
.bfSnKcForeImg iframe{ border:none;}
.bfSnKcForeImg p{ text-align:center; color:#fff; font-size:20px; padding:10px 0; opacity:0.8}



.snXinZi{ padding:90px 0; background:#3f3b5c;}
.snXzTitle{ text-align:center}
.snXzTitle h2{ font-size:36px; color:#fff; margin-bottom:10px; line-height: 45px;}
.snXzTitle p{ font-size:26px; color:#ff9b00;}
.snDiXin{ width:1200px; margin:0 auto;}
.snDxPic{ height:329px; width:100%; background:url(../images/snxzline1.png) no-repeat; margin-top:60px; position:relative;}

.snDxPic .zhe { width:0px; overflow:hidden; height:309px; position:absolute; left:64px; top:-23px; transition:0.8s}
.snDxPic.active .zhe{ width:1200px;}

.snDiXin p{ text-align:center}
.snDiXin p span{ display:inline-block; border-radius:50px; border:1px solid #6176e4; padding:0 40px; line-height:45px; font-size:22px; color:#6176e4; margin:40px auto; }

.snTiCeng{ width:1200px; margin:50px auto 20px; }
.snTiCeng ul::after{ display:block; content:""; clear:both;}
.snTiCeng li{ width:200px; float:left; margin:0 50px;}
.snTiCeng .line{ width:200px; height:200px; border:2px solid #797979; border-radius:50%; position:relative;}
.snTiCeng .num{ font-size:60px; color:#45adc2; text-align:center; line-height:200px;}
.snTiCeng  li p{ font-size:20px; opacity:0.8; padding:10px 0; color:#fff; text-align:center;}
.snTiCeng .line svg{ position:absolute; top:0px; left:0px; transform:scale(1.1) rotate(-90deg)}
.snTiCeng .line circle{ stroke-dasharray:1000; stroke-dashoffset:1000; transition:1.2s;}

.snTiCeng.active li:nth-child(1) .line circle{stroke-dashoffset:950; }
.snTiCeng.active li:nth-child(2) .line circle{stroke-dashoffset:900;}
.snTiCeng.active li:nth-child(3) .line circle{stroke-dashoffset:850; }
.snTiCeng.active li:nth-child(4) .line circle{stroke-dashoffset:800; }

.snTiCengTxt{text-align:center}
.snTiCengTxt span{display:inline-block; border-radius:50px;border:1px solid #6176e4; padding:0 40px; line-height:45px; font-size:22px; color:#6176e4; margin:40px auto; }




/*室内课程*/

.sn_course{ min-width:1200px; height:1080px; background:url(../images/sn_coursebg.jpg) no-repeat center;}
.sn_course2{ min-width:1200px; height:1080px; background:url(../images/sn_course2bg.jpg) no-repeat center; overflow:hidden;}
.sn_course3{ min-width:1200px; height:1080px; background:url(../images/sn_course3bg.jpg) no-repeat center; overflow:hidden;}
.sn_courseCon{ width:1200px; margin:0 auto;}
.sn_courseCon .title{width:487px;height:153px; background:url(../images/sn_titlebg.png); margin:0 auto; text-align:center; padding-top:30px; box-sizing:border-box;}
.sn_courseCon .title h2{ font-size:40px; font-weight:900; color:#434343; line-height: 50px;}
.sn_courseCon .title span{ display:block; margin-top:15px; color:#707070; font-size: 16px;}
.detailCon{ width:100%; height:780px;  margin-top:40px;}
.detailCon.con2,.detailCon.con3{ height:975px;}

.detailCon .float_L{ float:left}
.detailCon .float_R{ float:right}

.detailConL{ width:360px; height:100%; background:#3f3b5c; padding:30px 0px 0 24px;box-sizing:border-box;  }
.detailConL li{ margin-top:15px;}
.detailConR{ width:840px; height:100%; background:#fff; padding:60px 0 0 36px; box-sizing:border-box; line-height:1.7em;}
.detailConR li{ margin-bottom:30px; color:#707070;}
.detailConR h3{ margin-bottom:10px; font-size:18px;}
.detailConR p{ font-size:16px; width:760px;}

/*室内课程结束*/



/*室内设计作品*/

.sn_Works{ min-width:1200px; padding-bottom:80px;  background:url(../images/sn_worksbg.png) no-repeat center; text-align:center;}
.sn_Works h2{ padding:80px 0 40px 0; font-size:36px; color:#434343;}
.sn_Works img{width:100%;}
.sn_Works .more{ display:block; text-align:center; line-height:60px;width:300px; height:60px; background:#fba724;   border-radius:30px; font-size:18px; color:#fff; margin:68px  auto 0;}
.sn_Works .more:hover{ background:#ff9b00}


/*室内就业学员*/
.sn_Student{ width:1200px; margin:0 auto; padding-top:100px; padding-bottom:80px; text-align:center; overflow:hidden}
.sn_Student .title h2{ color:#434343; font-size:36px; line-height: 45px;}
.sn_Student .title b{ color:#707070; font-size:24px; display:block; margin:20px auto 58px; font-weight:100;}
.sn_Student ul::after{ display:block; content:""; clear:both;}
.sn_Student li{ float:left; width:240px; margin-bottom:47px; color:#a3a3a3;}
.sn_Student li h4{ margin-top:30px; color:#8b8686;}
.sn_Student li p{ line-height:1.7em; }
.sn_Student .more{ display:block; text-align:center; line-height:60px;width:300px; height:60px; background:#fba724;   border-radius:30px; font-size:18px; color:#fff; margin:30px  auto 0;}
.sn_Student .more:hover{ background:#ff9b00}

/*合作企业*/
.cooperate{min-width:1200px; text-align:center; background:url(../images/qi_bg.png) no-repeat center; height:750px;}
.cooperate h2{ font-size:36px; color:#fff; padding:77px 0 20px 0; line-height: 45px;}
.cooperate p{ color:#fff; font-size:24px; margin-bottom:50px;}

/*试听留言*/
.sn_liuyan{ min-width:1200px; height:608px; background:url(../images/sn_liuyan.png) no-repeat center;}
.sn_liuyanC{ width:1200px; margin:0 auto;}
.sn_liuyanL{ padding-top:250px; float:left; margin-left:150px; }
.sn_liuyanL h2{font-size:48px; color:#ffae00; line-height: 50px;}
.sn_liuyanL span{ font-size:36px; color:#fff; font-weight:100;}
.sn_liuyanR{ width:460px; height:500px; /*background:url(../images/sn_liuyanbg.png);*/ float:left ; margin:108px 0 0 80px; padding:50px 0 0 60px; box-sizing:border-box;}
.sn_liuyanR h4{ font-weight:100; color:#fff; font-size:20px; }
.sn_liuyanR input{ width:350px; height:40px; display:block; border:1px solid #c7c7c7; border-radius:10px; margin-top:30px; padding-left:45px; box-sizing:border-box; outline:none; font-size:14px;}
.sn_liuyanR input:nth-child(1){ background:url(../images/ly_user.png) no-repeat 10px;}
.sn_liuyanR input:nth-child(2){ background:url(../images/ly_tel.png) no-repeat 10px;}
.sn_liuyanR input:nth-child(3){ background:url(../images/ly_wx.png) no-repeat 10px;}
.sn_liuyanR input:nth-child(4){ background:url(../images/ly_zy.png) no-repeat 10px;}
.sn_liuyanR #course_submit{ display:block; width:180px; height:45px; background:#fba724; color:#fff; text-align:left; line-height:45px; border-radius:25px; margin:50px 0 0 0;}
.sn_liuyanR a:hover{ background:#ff9b00}

