@import url(common.css);
/* ------------------------------------------------------------------------ Layout */
/*
	Name:			mod_header
	Explain:		顶部区域
*/
	header { width: 100%; position: relative; }
		.header { width: 1190px; height: 60px; margin: auto; padding-top: 10px; }
			#logo { float: left; background-position: 0 -38px; width: 124px; height: 38px; font-size: 0; margin: 10px 60px 0 0; display: block; }
				#logo a { display: block; }
			nav { float: left; font-size: 1rem; }
				nav li { float: left; padding: 0 20px; margin: 0 5px; line-height: 60px; font-weight: 700; }
					nav li a { color: #fff; }
		.banner { width: 1190px; height: 360px; margin: auto; position: relative; }
			.slide-option { position: absolute; right: 30px; bottom: -63px; z-index: 1; width: 40px; }
			.slide-option li { background-color: #81bc06; width: 20px; height: 4px; border-radius: 2px; line-height: 0; font-size: 0; margin: 0 0 6px 20px; }
			.slide-option li:first-child { background-color: #f35325; }
			.slide-option li:last-child { background-color: #03a5f0; }
			.slide-option li.on { width: 40px; margin-left: 0; }
			/* 工具菜单 */
			.menu { position: absolute; bottom: 0; right: 0; background-color: rgba(0, 0, 0, .8); width: 300px; height: 276px; padding: 8px 0; -webkit-border-top-left-radius: 30px; -moz-border-top-left-radius: 30px; border-top-left-radius: 30px; -webkit-border-top-right-radius: 230px; -moz-border-top-right-radius: 230px; border-top-right-radius: 230px; }
				.menu li { margin: 0 30px; border-bottom: 1px solid rgba(255, 255, 255, .08); height: 64px; line-height: 64px; font-size: 1rem; position: relative; }
				.menu li:last-child { border-bottom: 0 none; }
				.menu li:hover { border-color: rgba(255, 255, 255, 0.18); }
					.menu a { color: #dcdddd; }
					.menu a:hover { color: #fff; }
					.menu li i { position: absolute; top: 23px; left: 0; width: 18px; height: 18px; display: inline-block; }
					.menu i.one { background-position: -178px -86px; }
					.menu i.two { background-position: -206px -86px; }
					.menu i.three { background-position: -178px -114px; }
					.menu i.four { background-position: -206px -114px; }
					.menu i.five { background-position: -178px -142px; }
					.menu h4 { margin-left: 34px; font-size: .875rem; }
		#banner { width: 100%; height: 420px; position: absolute; top: 0; left: 0; z-index: -1; }
		/* 二级导航 */
		.navigation { background-color: #fff; width: 1190px; height: 90px; -webkit-border-bottom-left-radius: 10px; -moz-border-bottom-left-radius: 10px; border-bottom-left-radius: 10px; -webkit-border-bottom-right-radius: 10px; -moz-border-bottom-right-radius: 10px; border-bottom-right-radius: 10px; margin: auto; position: relative; }
		.shadow { width: 1200px; height: 110px; position: absolute; left: -5px; top: 0; z-index: -1; }
			.navigation li { float: left; width: 175px; margin: 23px 0 23px 30px; }
			.navigation li:last-child { width: 240px; }
				.navigation-box i { float: left; width: 44px; height: 44px; display: block; }
				.navigation li div { float: left; margin-left: 15px; }
					.navigation-box h4 { font-size: 1rem; font-weight: bold; line-height: 26px; }
					.navigation-box p { font-size: 12px; color: #7f7f7f; }
				.morning-paper { background-position: 0 -32px; }
				.morning-axure { background-position: -54px -32px; }
				.morning-word { background-position: -108px -32px; }
				.morning-image { background-position: -162px -32px; }
				.morning-image { background-position: -162px -32px; }
				.morning-tool { background-position: -216px -32px; }
/*
	Name:			mod_section
	Explain:		内容区域
*/
	section { width: 1190px; margin: auto; }
	.recommend { margin-top: 50px; }
		.recommend .label {}
			.recommend .label h4 { font-size: 24px; display: inline; }
			.recommend .label span { background-color: #03a5f0; height: 28px; line-height: 28px; padding: 0 14px; border-radius: 500px; color: #fff; display: inline-block; }
		.recommend .box {}
			.recommend .box li { float: left; width: 222px; margin-right: 20px; }

/*
	Name:			mod_background
	Explain:		背景图片
*/
	#logo { background-image: url(../image/logo.png); background-repeat: no-repeat; }
	#banner { background: url(../image/banner.png) center no-repeat; }
	.shadow { background: url(../image/shadow.png) no-repeat; }
	.navigation-box i, .menu i { background-image: url(../image/spirit.png); background-repeat: no-repeat; }
