@charset "utf-8";
/* CSS Document */
/*all*/
@media screen and (max-width: 1024px) {
	.mune,.xxl,.footer,.header .munes .share{ display:none;}
	#hamburger,.xl{ display:block;}
	.bottomlist{ display:block;}
	.footer-tit{  margin-bottom:65px;}
	.footer-tit .right{ display:none;}
	.footer-tit{ text-align:center;}
	.footer-tit p{float: none;}
}

/*index*/
@media screen and (max-width: 1750px) {
	.warp{ width:1500px;}
	.header .logo { padding: 10px 15px;}
	.header .munes .m-list a{ padding:41px 20px;}
	.header .munes .share .search { padding: 34px 22px;}
	.header .munes .share .tel{ padding: 36px 20px;}
	.ia .ia2 .iar { padding: 50px 65px;}
	.ia .tr .dots { padding-top: 150px; padding-right: 0px;}
	.ia .tr { margin-bottom: -45px;}
	.footer .d3{ width:fit-content;}
}
@media screen and (max-width: 1550px) {
	.warp{ width:1200px;}
	.icoo-slider .swiper-slide{ padding:40px 0;}
	.header .logo { padding: 4px 5px;}
	.header .logo img{ height:50px;}
	.header .munes .m-list a{ padding:22px 14px;}
	.header .munes .share .search { padding: 19px 20px;}
	.header .munes .share .tel{ padding: 19px 14px;}
	.header .munes .m-list a{ font-size:1.4em;}
	.header .munes .share .search img{ width:20px;}
	.header .munes .share .tel span img{ width:20px;}
	.header .munes .share .tel>*{ line-height:20px;}
	.header .munes .share .tel h3{ font-size:1.4em;}
	.header .munes .share .tel p{ font-size:1.6em;}
	.ip{ padding:60px 0;}
	.ip .dot{margin: 20px 15px;}
	.ia .tl img{ width:350px;}
	.ia .tr .img img{ width:240px;}
	.ia .tr .dots{ width:400px;}
	.ia .tr .dots { padding-right: 60px;}
	.ia .tr .dot { width: 160px; margin: 0 20px 50px 20px;}
	.ia .tr .dot h3 {font-size: 2em; padding-bottom: 15px; margin-bottom: 10px;}
	.ia .ia2 .iar { width:50%; padding: 40px 25px;}
	.ia .ia2 .ial { width:48%;}
	.ia .ia2 .iar h3{ font-size:8.5em;}
	.ia .ia2 .iar span{ margin-bottom:20px; font-size:4em; margin-top: 0px;}
	.ia .ia2 .iar h4 { font-size: 2.4em !important; padding: 40px 0 60px 0;}
	.ia .ia2 .iar p { font-size: 1.4em; line-height: 24px; margin-bottom: 20px;}
	.ia .ia2 .iar a { margin-top: 20px;}
	.inews { padding: 180px 0 60px 0;}
	.inews .txt{ padding-top:50px;}
	.inews .txt .dot { width: calc(25% - 20px); margin:0 10px;}
	.inews .txt { width: calc(100% + 20px); margin-left: -10px;}
	.inews .txt .dot .tt .t1{ margin-bottom:20px;}
}
@media screen and (max-width: 1250px) {
	.warp{ width:960px;}
	.ip .dot .txt h3{ font-size:1.6em;}
	.ip .dots{ width:calc(100% + 20px); margin-left:-10px;}
	.ip .dot { margin: 20px 10px; width: calc(25% - 20px);}
	.ip .dot .txt { padding: 0px 10px;}
	.i-tit h4 {font-size: 2em;}
	.i-tit h3{ font-size:2.4em;}
	.ia .tr .dots { padding-top: 100px;}
	.ia .ia2 .iar h3{ font-size:6em;}
	.ia .ia2 .iar span{ margin-bottom:10px; font-size:2.4em;}
	.ia .ia2 .iar h4 { font-size: 1.8em !important; padding: 20px 0 40px 0;}
	.ia .ia2 .iar a { width: 160px; height: 40px; line-height: 40px;}
	.inews .txt .dot .tt {   padding: 10px 20px 20px 20px;}
	.inews .txt .dot { width: calc(33.33% - 20px);}
	.inews .txt .dot:nth-child(4){ display:none;}
}
@media screen and (max-width: 1024px) {
	.warp{ width:96%;}
	.ia .tl{position:none !important; float:left;}
	.ia .tr .dots { padding-right: 0px; padding-top: 200px;}
	.ia .tl {  top: 480px;}
	.ia .ia2 .ial{ padding-top:180px;}
	.ia .ia2 .ial .i-tit { padding-bottom: 40px;}
	.ip .dot .txt h3 {  font-size: 1.4em;}
	.bans{ height:300px !important;}
	.icoo-slider .ip-p, .icoo-slider .ip-n{ opacity:1 !important;}
}
@media screen and (max-width: 800px) {
	.icoo .i-tit{ margin-bottom:30px;}
	.icoo{ padding:40px 0 45px 0;}
	.ip .dot { width: calc(50% - 20px);}
	.ia .tl{ display:none;}
	.ia .tr{ position:relative;}
	.ia .tr .img{position:absolute;right:0;z-index: 0;}
	.ia .tr .dots{ position:relative; z-index:1; width:100%;}
	.ia .tr .dot{background:rgba(40,40,40,0.8); width:50%; padding:20px; margin:0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
	.ia .tr .img img{ width:380px; max-width:100%;}
	.ia .ia1{ position:relative; z-index:1;}
	.ia .ia2 .ial { width:100%; padding-top: 0px;}
	.ia .i-tit{ padding:40px 0 20px 0;}
	.ia .ia2 .iar { width: 100%; padding: 40px 25px;}
	.inews .txt .dot { width: calc(50% - 20px);}
	.inews .txt .dot:nth-child(3){ display:none;}
	.ia .i-tit{ position:relative; z-index:1;}
}
@media screen and (max-width: 500px) {
	.inews .txt .dot,.ip .dot { width:100%; max-width: 350px; float:none; margin:10px auto;}
	.ip { padding: 40px 0;}
	.ip .dots{ padding:20px 0;}
	.inews .txt { padding-top: 20px;}
	.inews { padding: 160px 0 40px 0;}
	.ia .tr .img{ float:right;}
	.ia .tr .img img{ width:200px;}
	.ia .ia2 .iar{ padding:20px 15px;}
	.ia .tr { margin-top: -125px;}
	.ia .tr .dots{ padding-top:160px;}
	.ia .tr .dot h3 {font-size: 1.6em;}
	.ia .tr .dot{ padding:15px;}
	.ia .tr { margin-bottom: -120px;}
	.ia .ia2 .iar h4 { padding: 10px 0 20px 0;}
	.ia .ia2 .iar p {  margin-bottom: 10px;}
	.bans{ height:200px !important;}
}

/*about*/
@media screen and (max-width: 1550px) {
	.warp2{ width:1200px;}
	.about .txt2 .left { padding: 35px 25px;}
	.about .txt2 .right {padding: 35px 25px;}
}
@media screen and (max-width: 1250px) {
	.warp2{ width:960px;}
	.about .txt2 .right{ background-size:contain;}
	.about .txt2 .left .dot .d2 p{ line-height:24px;}
	.about .txt2 .left .dot { margin-bottom: 50px;}
}
@media screen and (max-width: 1024px) {
	.warp2{ width:96%;}
	.tits{ padding:40px 0;}
	.tits h3{ font-size:2.4em;}
	.tits h3:after,.tits h3:before{ top:12px;}
	.tits h4{ font-size:1.6em;}
	.about .txt img{ margin-bottom:20px;}
	.about .txt{ padding-bottom:30px;}
	.about .txt2>*{ width:100%; display:block;}
	.about .txt2{ padding-bottom:40px;}
}
@media screen and (max-width: 600px) {
	.about .txt2 .left .dot{ margin-bottom:20px;}
	.about .txt2 .left .dot .d2 h3{ font-size:1.6em;}
	.about .txt2 .left .dot .d1{ width:70px;}
	.about .txt2 .left .dot .d2{ width:calc(100% - 70px);}
	.about .txt p{ line-height:24px;}
	.about .txt2 .right .tit>*{ display:block;}
	.about .txt2 .right .tit h3{ width:100%; margin-left:0; margin-top:15px; display:block; font-size:1.6em;}
}

/*contact*/
@media screen and (max-width: 1250px) {
	.contact2 .left .dot{ width:100%; padding: 20px 0;}
	.contact2 .right .ic-input { width: calc(100% - 40px); padding:6px 10px;}
}
@media screen and (max-width: 1024px) {
	#container{ height:500px !important;}
	.contact2 .left,.contact2 .right{ width:100%;}
	.contact2 .bl { width: 100%; height: 40%;}
	.contact2 .left .dot{ width:50%; padding: 20px 0;}
}
@media screen and (max-width: 600px) {
	.contact2 .left .dot>*{display:inline-block;margin:0 auto;}
	.contact2 .left .dot .d{ width:100%; padding: 25px 18px 0 18px;}    
	.contact2 .left .dot img{ width:35px;}
	.contact2 .bl {height: 45%;}
}
@media screen and (max-width: 400px) {
	.contact2 .left .dot{ width:100%; text-align:center; padding: 10px 0;}
	.contact2 .left .dot span{ float:none; padding:10px;}
	.contact2 .bl {height: 50%;}
	.contact2 .left .dot img{ width:25px;}
	.contact2 .left .dot .d{ padding: 15px 18px 0 18px;} 
	.contact2 .right .ic-btn { font-size: 1.6em;}
	#container{ height:350px !important;}
}

/*news*/
@media screen and (max-width: 1024px) {
	.news .dot a .img{ padding:30px 25px; width:430px;}
	.news .dot a .txt{ padding:15px 25px 15px 0; width:calc(100% - 430px);}
}
@media screen and (max-width: 800px) {
	.news .dot a>*{ width:100% !important; padding:20px 25px !important;}
	.news .dot a .img{ text-align:center; max-width:100%; padding:20px 25px 0 25px !important;}
	.news .dot a .img img{ max-width:100%;}
	.news .dot a .txt .tit{ margin:0px 0 20px 0;}
	.news .dot a .txt>p{ margin-bottom:20px;}
	.news .dot a .txt h3{ font-size:2em;}
	.news .dot a .txt>p{ line-height:20px; height:80px;}
}

/*product*/
@media screen and (max-width: 1300px) {
	.warp3{ width:960px;}
	.product .dot .txt .right span{ padding:8px 12px;}
}
@media screen and (max-width: 1024px) {
	.warp3{ width:96%;}
	.ip-slider .ip-p,.ip-slider .ip-n{ opacity:1 !important;}
	.product{ padding:120px 0 50px 0}
}
@media screen and (max-width: 900px) {
	.product .dot { width: calc(50% - 40px);}
}
@media screen and (max-width: 600px) {
	.product .dots{ width:100%; margin-left:0;}
	.product .dot { width:100%;  max-width: 400px; float:none; margin:20px auto;}
}