@charset "utf-8";
@import url("./base.css");
/*header*/
header{}
header > .top{height: 120px;background: url(../images/topba.jpg) repeat-x;border-top: #1b8b7d solid 5px;}
/*logo*/
header .logo{z-index: 2;position: absolute;left: 0;top: 50%;transform: translateY(-50%);} 
header .logo img{max-width: 800px;max-height: 100px;transition: 0.5s;}
/*移动端导航按钮*/
header .menu-btn{display: none;z-index: 1;position: absolute;right: 0;top: 50%;width: 20px;height: 18px;cursor: pointer;transform: translateY(-50%);}
header .menu-btn span{display: block;height: 2px;background-color: #048E45;transition: 0.3s;}
header .menu-btn span:nth-child(2){margin: 6px 0;}
/*搜索栏*/
header .search-wrap{position: absolute;right: 0;top: 50%;transform: translateY(-50%);width: 210px;height: 44px;box-sizing: border-box;border: 1px solid #048E45;border-radius: 22px;}
header .search-wrap .text-input{width: 100%;height: 100%;box-sizing: border-box;padding: 0 90px 0 30px;background-color: transparent;}
header .search-wrap .text-input::-webkit-input-placeholder{color: #048E45;}
header .search-wrap .sub-btn{position: absolute;right: 20px;top: 0;width: 44px;height: 100%;background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxOCAxOCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjMDQ4RTQ1IiBmaWxsLXJ1bGU9Im5vbnplcm8iPjxwYXRoIGQ9Ik05LjY1NCAzLjI3NWEuNDUuNDUgMCAxIDAtLjI3NC44NTUgNC4xODQgNC4xODQgMCAwIDEgMi43IDIuNjYzLjQ1LjQ1IDAgMSAwIC44NTQtLjI4NCA1LjA4OCA1LjA4OCAwIDAgMC0zLjI4LTMuMjM0eiIvPjxwYXRoIGQ9Ik0xNy44NyAxNy4yM2wtMy43NC0zLjcyOWE4LjA5OCA4LjA5OCAwIDEgMC0uNjI5LjYzbDMuNzM5IDMuNzM5YS40NS40NSAwIDAgMCAuNjM0LS42MzVsLS4wMDQtLjAwNHpNOC4xMDIgMTUuM2E3LjE5OCA3LjE5OCAwIDEgMSAwLTE0LjM5NiA3LjE5OCA3LjE5OCAwIDAgMSAwIDE0LjM5N3oiLz48L2c+PC9zdmc+') center no-repeat;background-size: 40% 40%;}
/*语言*/
header .language{position: absolute;right: 230px;top: 50%;transform: translateY(-50%);font-size: 16px;line-height: 20px;text-transform: capitalize;transition: 0.3s;}
header .language:hover{color: #048E45;}
/*导航*/
.nav-box{background-color: #00706B;}
.nav-box .nav-1st{display: flex;justify-content: space-between;}
.nav-box .nav-1st > li{position: relative;margin: 0 20px;font-size: 16px;}
.nav-box .nav-1st > li > a{position: relative;display: block;font-size: 20px;line-height: 50px;font-weight: bold;color: #fff;transition: 0.5s;}
.nav-box .nav-1st > li > a::after{content: '';position: absolute;left: 0;right: 0;bottom: 0;height: 2px;background-color: #FFD53F;animation: menu_fill_left_out 0.3s cubic-bezier(.7,0,.3,1) forwards;}
.nav-box .nav-1st > li:hover > a::after{animation: menu_fill_left_in 0.3s cubic-bezier(.7,0,.3,1) forwards;}
.nav-box .nav-1st > li.on > a{font-weight: bold;color: #FFD53F;}
.nav-box .nav-1st > li.on > a::after{animation: none;}
.nav-box .nav-2nd{display: none;z-index: 2;position: absolute;left: 50%;top: 100%;width: 100%;min-width: 140px;padding: 8px 0;background-color: rgba(0,0,0,.5);border-radius: 4px;transform: translateX(-50%);}
.nav-box .nav-2nd > li{position: relative;}
.nav-box .nav-2nd > li > a{position: relative;display: block;padding: 10px;line-height: 16px;text-align: center;color: #fff;}
.nav-box .nav-2nd > li > a::before{content: '';position: absolute;left: 0;top: 0;bottom: 0;width: 3px;background-color: #fff;transform: scaleY(0);transition: 0.3s;}
.nav-box .nav-2nd > li > a:hover{background-color: #00706B;}
.nav-box .nav-2nd > li > a:hover::before{transform: scaleY(1);}

.nav-box .nav-3nd{display: none;z-index: 2;position: absolute;left: 50%;top: 100%;width: 100%;min-width: 140px;padding: 8px 0;background-color: rgba(0,0,0,.5);border-radius: 4px;transform: translateX(-50%);}
.nav-box .nav-3nd > li{position: relative;}
.nav-box .nav-3nd > li > a{position: relative;display: block;padding: 10px;line-height: 16px;text-align: center;color: #fff;}
.nav-box .nav-3nd > li > a::before{content: '';position: absolute;left: 0;top: 0;bottom: 0;width: 3px;background-color: #fff;transform: scaleY(0);transition: 0.3s;}
.nav-box .nav-3nd > li > a:hover{background-color: #00706B;}
.nav-box .nav-3nd > li > a:hover::before{transform: scaleY(1);}
@keyframes menu_fill_left_in{
    0%{
		transform: scale3d(0, 1, 1);
        transform-origin: 0 50%;
    }
    100%{
        transform: scale3d(1, 1, 1);
		transform-origin: 0 50%;
	}
}
@keyframes menu_fill_left_out{
    0% {
        transform: scale3d(1, 1, 1);
        transform-origin: 100% 50%;
    }
    100% {
        transform: scale3d(0, 1, 1);
        transform-origin: 100% 50%;
    }
}
/*手机端搜索按钮*/
header .phone-search-btn{display: none;position: absolute;right: 40px;top: 50%;width: 20px;height: 20px;border-radius: 50%;background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxOCAxOCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjMDQ4RTQ1IiBmaWxsLXJ1bGU9Im5vbnplcm8iPjxwYXRoIGQ9Ik05LjY1NCAzLjI3NWEuNDUuNDUgMCAxIDAtLjI3NC44NTUgNC4xODQgNC4xODQgMCAwIDEgMi43IDIuNjYzLjQ1LjQ1IDAgMSAwIC44NTQtLjI4NCA1LjA4OCA1LjA4OCAwIDAgMC0zLjI4LTMuMjM0eiIvPjxwYXRoIGQ9Ik0xNy44NyAxNy4yM2wtMy43NC0zLjcyOWE4LjA5OCA4LjA5OCAwIDEgMC0uNjI5LjYzbDMuNzM5IDMuNzM5YS40NS40NSAwIDAgMCAuNjM0LS42MzVsLS4wMDQtLjAwNHpNOC4xMDIgMTUuM2E3LjE5OCA3LjE5OCAwIDEgMSAwLTE0LjM5NiA3LjE5OCA3LjE5OCAwIDAgMSAwIDE0LjM5N3oiLz48L2c+PC9zdmc+') center no-repeat;background-size: 100% 100%;cursor: pointer;transform: translateY(-50%);transition: 0.5s;}
/*弹窗内容-搜索栏*/
.popup-top-search{position: relative;margin: 30px;}
.popup-top-search .text-input{box-sizing: border-box;width: 100%;height: 40px;padding: 0 50px 0 10px;border: 1px solid #eee;}
.popup-top-search .sub-btn{position: absolute;right: 0;top: 0;width: 40px;height: 40px;background: #048E45 url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIHN0cm9rZT0iIzk3OTc5NyIgZmlsbD0iI0Q4RDhEOCIgb3BhY2l0eT0iLjAxIiBkPSJNLjUuNWgxOXYxOUguNXoiLz48Y2lyY2xlIHN0cm9rZT0iI0ZGRiIgc3Ryb2tlLXdpZHRoPSIyIiBjeD0iOSIgY3k9IjkiIHI9IjgiLz48cGF0aCBzdHJva2U9IiNGRkYiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBkPSJNMTUgMTVsNCA0Ii8+PC9nPjwvc3ZnPg==') center no-repeat;background-size: 20px 20px;}
/*头部-页面滚动样式*/
header.fixed{}

/*footer*/
footer{position: relative;background: #00706B;background-size: cover;color: #fff;overflow: hidden;}
footer .w1400{padding: 40px 0;text-align: center;}
/*logo*/
footer .logo{display: block;margin-bottom: 30px;} 
footer .logo img{max-width: 650px;max-height: 90px;}
/*版权*/
footer .cr{margin-top: 15px;line-height: 20px;}
footer .cr span{display: inline-block;vertical-align: top;margin: 0 6px;}
footer .cr span:first-child{margin-left: 0;}
footer .cr a{color: #fff;transition: 0.3s;}
footer .cr .icon{vertical-align: middle;width: 20px;height: 20px;margin: -.25em .25em 0 0;}
footer .cr .logo{width: 64px;height: 64px;}
footer .cr a:hover{text-decoration: underline;}


/*笔记本1920*1080显示放大比例为125%，实际分辨率为1920/1.25=1536*/
@media screen and (max-width: 1550px){
	footer .click {display: none;}
}

/*中屏PC，分辨率1366*/
@media screen and (max-width: 1440px){
	footer .click {display: none;}
}

/*小屏PC，分辨率1280*/
@media screen and (max-width: 1300px){
	/*header*/
	header > .top{height: 120px;}
	header .logo img{max-width: 500px;max-height: 80px;}
	header .search-wrap{width: 240px;height: 36px;}
	header .search-wrap .text-input{padding: 0 60px 0 20px;}
	header .search-wrap .sub-btn{right: 10px;}
	header .language{right: 260px;font-size: 14px;}
	.nav-box .nav-1st > li{margin: 0 15px;}
	.nav-box .nav-1st > li > a{font-size: 16px;line-height: 50px;}
	
	/*footer*/
	footer .w1400{padding: 30px 0;}
	footer .logo{margin-bottom: 20px;}
	footer .logo img{max-width: 500px;max-height: 80px;}
	footer .cr{margin-top: 10px;}
        footer .click {display: none;}
}

/*pad横屏，分辨率1024*/
@media screen and (max-width: 1024px){
	/*header*/
	header > .top{height: 100px;}
	header .logo img{max-width: 400px;max-height: 60px;}
	.nav-box .nav-1st > li > a{font-size: 14px;}
	
	/*footer*/
	footer .w1400{padding: 20px 0;}
	footer .logo img{max-width: 400px;max-height: 50px;}
        footer .click {display: none;}
}

/*phone和pad竖屏，分辨率820*/
@media screen and (max-width: 820px){
	/*header*/
	header > .top{height: 60px;}
	header .logo img{max-width: 300px;}
	header .menu-btn{display: block;}
	header .search-wrap{display: none;}
	header .language{display: none;}
	.nav-box{display: none;}
	header .phone-search-btn{display: block;}
	/*手机菜单-语言栏*/
	.mm-menu .icon{vertical-align: middle;width: 16px;height: 16px;margin: -.25em .4em 0 0;}
	
	/*footer*/
	footer .w1400{padding: 15px 0;}
	footer .logo{display: none;}
	footer .cr{margin-top: 0;font-size: 13px;}
	footer .cr span{display: block;margin: 0;}
	footer .cr .icon{width: 16px;height: 16px;}
        footer .click {display: none;}
}