* { font-family: "微软雅黑", "microsoft yahei"; } @media screen and (min-width: 1401px) { .index_foot { box-sizing: border-box; width: 1400PX; margin: 0 auto; } .foot_title { width: 100%; height: 40PX; overflow: hidden; border-bottom: solid 2PX #b41c2a; margin-bottom: 10PX; span { display: block; width: 107PX; height: 40PX; line-height: 40PX; background: #b41c2a; text-align: center; color: #fff; font-size: 20PX; font-weight: bold; border-top-left-radius: 10PX; border-top-right-radius: 10PX; } } .index_foot_name_box { margin: 10PX auto 0PX; text-align: center; font-size: 0PX; } .index_foot_name { display: inline-block; height: 67PX; line-height: 67PX; color: #f2f9f4; font-size: 51PX; font-weight: bold; overflow: hidden; } .index_foot_name:nth-of-type(even) { color: #333; font-size: 32PX; } .foot_img_box { overflow: hidden; display: block; margin: 20PX auto 0; width: 100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; a { font-size: 14PX; width: 180PX; height: 62PX; float: left; padding: 0 10PX; margin: 10PX 0; overflow: hidden; img { width: 180PX; height: 60PX; border: solid 1PX #ccc; } } } .foot_img_box>* * { display: block; width: 100%; height: 100%; } .foot_img_box>*:nth-of-type(7n) { margin-right: 0PX; } .foot_frind_box { display: block; margin: 11PX auto; overflow: hidden; display: flex; width: 100%; border-bottom: solid 3PX #ff0024; div { width: 100%; overflow: hidden; padding: 0 10PX; margin-bottom: 20PX; a { float: left; height: 30PX; line-height: 30PX; padding: 0 10PX; font-size: 16PX; color: #333; font-family: "微软雅黑", "microsoft yahei"; } } } .call_us_box { display: block; width: 100%; height: 52PX; margin: 25PX auto 0; overflow: hidden; text-align: center; font-size: 0PX; background: #ff0024; a { color: #fff; } } .call_us_box>* { height: 18PX; line-height: 18PX; padding: 0 20PX; line-height: 50PX; text-align: center; background: #ff0024; margin: 0PX auto; font-size: 18PX; color: #fff; box-sizing: border-box; position: relative; } .call_us_box>*::after { content: ""; position: absolute; right: 0; top: 20%; width: 1PX; height: 60%; background-color: #fff; } .call_us_box>*:last-child::after { display: none; } .foot_text_box { margin: 20PX auto 0PX; text-align: center; color: #333; font-size: 16PX; line-height: 30PX; a { color: #333; font-size: 16PX; } } .foot_text_box_green { color: #40663B; } .foot_text_box img { display: inline-block; height: 20PX; vertical-align: middle; } .foot_logo_out { position: relative; margin: 0PX auto; width: 100%; height: 0PX; } .foot_logo_out * { width: 120PX; display: block; } .foot_logo_out>* { position: absolute; top: -166PX; } .foot_logo_out>*:nth-of-type(1) { left: 0PX; } .foot_logo_out>*:nth-of-type(2) { right: 0PX; } .foot_last_img_box { margin: 40PX auto 10PX; text-align: center; overflow: hidden; width: 100%; font-size: 0PX; padding-bottom: 40PX; } .foot_last_img_box>* { height: 50PX; width: 150PX; display: inline-block; overflow: hidden; } .foot_last_img_box img { width: 120PX; height: 50PX; } .foot_text_html_css :deep(a) { color: #333; } .foot_text_html_css :deep(img) { margin: 0 5PX; } //添加在线客服 .kefu { position: fixed; top: 320PX; right: 0PX; z-index: 999999; .kefu_itemKf { background-color: #0099cc; border-radius: 10PX; width: 64PX; height: 64PX; margin-bottom: 15PX; text-align: center; box-sizing: border-box; position: relative; cursor: pointer; a { >p { color: #fff; font-size: 12PX; font-weight: 500; line-height: 16PX; } >img { margin: 8PX auto 0PX; width: 30PX; height: 30PX; } } } .kefu_itemQQ { background-color: #fff; border-radius: 10PX; box-shadow: 0 4PX 16PX #0000001a; height: 100PX; margin-bottom: 15PX; text-align: center; width: 100PX; box-sizing: border-box; position: relative; cursor: pointer; >p { color: #666; font-size: 14PX; font-weight: 500; line-height: 16PX; } >img { margin-top: 10PX; width: 60PX; height: 60PX; } &:hover { .kefu_item_content_QQ { display: block; } } } .kefu_itemPhone { background-color: #fff; border-radius: 10PX; box-shadow: 0 4PX 16PX #0000001a; height: 100PX; margin-bottom: 15PX; text-align: center; width: 100PX; box-sizing: border-box; position: relative; cursor: pointer; >p { color: #666; font-size: 14PX; font-weight: 500; line-height: 16PX; } >img { margin-top: 10PX; width: 60PX; height: 60PX; } &:hover { .kefu_item_content_phone { display: block; } } } .kefu_item_content_QQ { position: absolute; top: -100PX; right: 100PX; background: #fff; border-radius: 10PX; display: none; width: 190PX; height: 330PX; background: #fff; box-shadow: 0 4PX 16PX #0000001a; z-index: 99; box-sizing: border-box; padding: 20PX; img { margin-bottom: 10PX; } .qqfs { margin-bottom: 20PX; font-size: 14PX; color: #333; } .arrow { width: 0; height: 0; width: 0; border-top: 20PX solid transparent; border-bottom: 20PX solid transparent; border-left: 20PX solid #fff; position: absolute; top: 120PX; right: -20PX; transform: translateX(-50%); z-index: 100; } } .kefu_item_content_phone { position: absolute; top: 0; right: 100PX; background: #fff; border-radius: 10PX; display: none; width: 190PX; height: 80PX; background: #fff; box-shadow: 0 4PX 16PX #0000001a; z-index: 99; box-sizing: border-box; padding: 20PX; text-align: left; color: #333; .kefu_item_content_phone_title { margin-bottom: 5PX; font-weight: bold; } .arrow { width: 0; height: 0; width: 0; border-top: 20PX solid transparent; border-bottom: 20PX solid transparent; border-left: 20PX solid #fff; position: absolute; top: 20PX; right: -20PX; transform: translateX(-50%); z-index: 100; } } } // 关联网站 .websiteLink { position: fixed; left: 45PX; bottom: 10PX; .websitelist { width: 210PX; height: 27PX; line-height: 27PX; color: #ee6363; margin-bottom: 5PX; border: 1PX solid #ccc; text-align: center; background-color: #fff; font-size: 14PX; a { color: #ee6363; } } } // 你问我答 .questionAnswer { width: 300PX; height: auto; overflow: hidden; position: fixed; bottom: 0; right: 0; background: #fff; border: 1PX solid #7ab9dd; padding: 10PX; box-shadow: 0PX 1PX 8PX #888; z-index: 99999999; .title { height: 40PX; line-height: 40PX; span { font-size: 22PX; color: #0a78d7; } } .content { height: 300PX; overflow: auto; } } } @media screen and (min-width: 801px) and (max-width: 1400px) { .index_foot { box-sizing: border-box; width: 100%; margin: 0 auto; } .foot_title { width: 100%; height: 40PX; line-height: 40PX; overflow: hidden; background-color: #f4f4f4; margin-bottom: 10PX; font-size: 20PX; color: #022a7a; padding-left: 10PX; box-sizing: border-box; } .index_foot_name_box { margin: 10PX auto 0PX; text-align: center; font-size: 0PX; } .index_foot_name { display: inline-block; height: 67PX; line-height: 67PX; color: #f2f9f4; font-size: 51PX; font-weight: bold; overflow: hidden; } .index_foot_name:nth-of-type(even) { color: #333; font-size: 32PX; } .foot_img_box { overflow: hidden; display: block; margin: 20PX auto 0; width: 100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; a { font-size: 14PX; width: 14%; height: 64PX; float: left; padding: 0 10PX; margin: 10PX 0; box-sizing: border-box; overflow: hidden; img { width: 99%; height: 97%; border: solid 1PX #ccc; } } } .foot_img_box>* * { display: block; width: 100%; height: 100%; } .foot_img_box>*:nth-of-type(7n) { margin-right: 0PX; } .foot_frind_box { display: block; margin: 11PX auto; overflow: hidden; display: flex; width: 100%; border-bottom: solid 3PX #ff0024; div { width: 100%; overflow: hidden; padding: 0 10PX; margin-bottom: 20PX; a { float: left; height: 30PX; line-height: 30PX; padding: 0 10PX; font-size: 16PX; color: #333; font-family: "微软雅黑", "microsoft yahei"; } } } .call_us_box { display: block; width: 100%; height: 52PX; margin: 25PX auto 0; overflow: hidden; text-align: center; font-size: 0PX; background: #ff0024; a { color: #fff; } } .call_us_box>* { height: 18PX; line-height: 18PX; padding: 0 20PX; line-height: 50PX; text-align: center; background: #ff0024; margin: 0PX auto; font-size: 18PX; color: #fff; box-sizing: border-box; position: relative; } .call_us_box>*::after { content: ""; position: absolute; right: 0; top: 20%; width: 1PX; height: 60%; background-color: #fff; } .call_us_box>*:last-child::after { display: none; } .foot_text_box { margin: 20PX auto 0PX; text-align: center; color: #333; font-size: 16PX; line-height: 30PX; a { color: #333; font-size: 16PX; } } .foot_text_box_green { color: #40663B; } .foot_text_box img { display: inline-block; height: 20PX; vertical-align: middle; } .foot_logo_out { position: relative; margin: 0PX auto; width: 100%; height: 0PX; } .foot_logo_out * { width: 120PX; display: block; } .foot_logo_out>* { position: absolute; top: -166PX; } .foot_logo_out>*:nth-of-type(1) { left: 0PX; } .foot_logo_out>*:nth-of-type(2) { right: 0PX; } .foot_last_img_box { margin: 40PX auto 10PX; text-align: center; overflow: hidden; width: 100%; font-size: 0PX; padding-bottom: 40PX; } .foot_last_img_box>* { height: 50PX; width: 150PX; display: inline-block; overflow: hidden; } .foot_last_img_box img { width: 120PX; height: 50PX; } .foot_text_html_css :deep(a) { color: #333; } .foot_text_html_css :deep(img) { margin: 0 5PX; } //添加在线客服 .kefu { position: fixed; top: 320PX; right: 0PX; .kefu_itemKf { background-color: #0099cc; border-radius: 10PX; width: 64PX; height: 64PX; margin-bottom: 15PX; text-align: center; box-sizing: border-box; position: relative; cursor: pointer; a { >p { color: #fff; font-size: 12PX; font-weight: 500; line-height: 16PX; } >img { margin: 8PX auto 0PX; width: 30PX; height: 30PX; } } } .kefu_itemQQ { background-color: #fff; border-radius: 10PX; box-shadow: 0 4PX 16PX #0000001a; height: 100PX; margin-bottom: 15PX; text-align: center; width: 100PX; box-sizing: border-box; position: relative; cursor: pointer; >p { color: #666; font-size: 14PX; font-weight: 500; line-height: 16PX; } >img { margin-top: 10PX; width: 60PX; height: 60PX; } &:hover { .kefu_item_content_QQ { display: block; } } } .kefu_itemPhone { background-color: #fff; border-radius: 10PX; box-shadow: 0 4PX 16PX #0000001a; height: 100PX; margin-bottom: 15PX; text-align: center; width: 100PX; box-sizing: border-box; position: relative; cursor: pointer; >p { color: #666; font-size: 14PX; font-weight: 500; line-height: 16PX; } >img { margin-top: 10PX; width: 60PX; height: 60PX; } &:hover { .kefu_item_content_phone { display: block; } } } .kefu_item_content_QQ { position: absolute; top: -100PX; right: 100PX; background: #fff; border-radius: 10PX; display: none; width: 190PX; height: 330PX; background: #fff; box-shadow: 0 4PX 16PX #0000001a; z-index: 99; box-sizing: border-box; padding: 20PX; img { margin-bottom: 10PX; } .qqfs { margin-bottom: 20PX; font-size: 14PX; color: #333; } .arrow { width: 0; height: 0; width: 0; border-top: 20PX solid transparent; border-bottom: 20PX solid transparent; border-left: 20PX solid #fff; position: absolute; top: 120PX; right: -20PX; transform: translateX(-50%); z-index: 100; } } .kefu_item_content_phone { position: absolute; top: 0; right: 100PX; background: #fff; border-radius: 10PX; display: none; width: 190PX; height: 80PX; background: #fff; box-shadow: 0 4PX 16PX #0000001a; z-index: 99; box-sizing: border-box; padding: 20PX; text-align: left; color: #333; .kefu_item_content_phone_title { margin-bottom: 5PX; font-weight: bold; } .arrow { width: 0; height: 0; width: 0; border-top: 20PX solid transparent; border-bottom: 20PX solid transparent; border-left: 20PX solid #fff; position: absolute; top: 20PX; right: -20PX; transform: translateX(-50%); z-index: 100; } } } // 关联网站 .websiteLink { position: fixed; left: 45PX; bottom: 10PX; .websitelist { width: 210PX; height: 27PX; line-height: 27PX; color: #ee6363; margin-bottom: 5PX; border: 1PX solid #ccc; text-align: center; background-color: #fff; font-size: 14PX; a { color: #ee6363; } } } // 你问我答 .questionAnswer { width: 300PX; height: auto; overflow: hidden; position: fixed; bottom: 0; right: 0; background: #fff; border: 1PX solid #7ab9dd; padding: 10PX; box-shadow: 0PX 1PX 8PX #888; z-index: 99999999; .title { height: 40PX; line-height: 40PX; span { font-size: 22PX; color: #0a78d7; } } .content { height: 300PX; overflow: auto; } } } @media screen and (max-width: 800px) { .index_foot { box-sizing: border-box; width: 100%; margin: 0 auto; } .foot_title { width: 96%; height: 80px; line-height: 80px; overflow: hidden; background-color: #f4f4f4; margin-bottom: 20px; font-size: 40px; color: #022a7a; padding: 0 10px; box-sizing: border-box; margin: 0 20px; } .index_foot_name_box { margin: 20px auto 0px; text-align: center; font-size: 0px; } .index_foot_name { display: inline-block; height: 67px; line-height: 67px; color: #f2f9f4; font-size: 51px; font-weight: bold; overflow: hidden; } .index_foot_name:nth-of-type(even) { color: #333; font-size: 32px; } .foot_img_box { overflow: hidden; display: block; margin: 20px auto 0; width: 100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; padding: 0 20px; box-sizing: border-box; a { width: 45%; height: 100px; float: left; padding: 0 10px; margin: 20px 0; img { width: 100%; height: 100%; border: solid 1px #ccc; font-size: 24px; } } } .foot_img_box>* * { display: block; width: 100%; height: 100%; } .foot_img_box>*:nth-of-type(7n) { margin-right: 0px; } .foot_frind_box { display: block; margin: 22px auto; overflow: hidden; display: flex; width: 100%; border-bottom: solid 3px #ff0024; div { width: 100%; overflow: hidden; padding: 0 20px; margin-bottom: 20px; a { float: left; height: 60px; line-height: 60px; padding: 0 20px; font-size: 32px; color: #333; font-family: "微软雅黑", "microsoft yahei"; } } } .call_us_box { display: block; width: 100%; margin: 40px auto 0; overflow: hidden; text-align: center; font-size: 0px; background: #ff0024; a { color: #fff; } } .call_us_box>* { height: 40px; line-height: 40px; padding: 0 20px; line-height: 50px; text-align: center; background: #ff0024; margin: 0px auto; font-size: 32px; color: #fff; box-sizing: border-box; position: relative; } .call_us_box>*::after { content: ""; position: absolute; right: 0; top: 20%; width: 1px; height: 60%; background-color: #fff; } .call_us_box>*:last-child::after { display: none; } .foot_text_box { margin: 40px auto 0px; text-align: center; color: #333; font-size: 30px; line-height: 60px; padding: 0 20px; a { color: #333; font-size: 16px; } } .foot_text_box_green { color: #40663B; } .foot_text_box img { display: inline-block; height: 20px; vertical-align: middle; } .foot_logo_out { position: relative; margin: 0px auto; width: 100%; height: 0px; } .foot_logo_out * { width: 120px; display: block; } .foot_logo_out>* { position: absolute; top: -166px; } .foot_logo_out>*:nth-of-type(1) { left: 0px; } .foot_logo_out>*:nth-of-type(2) { right: 0px; } .foot_last_img_box { margin: 40px auto 10px; text-align: center; overflow: hidden; width: 100%; font-size: 0px; padding-bottom: 40px; } .foot_last_img_box>* { height: 50px; width: 45%; display: inline-block; overflow: hidden; } .foot_last_img_box img { width: 120px; height: 50px; } .foot_text_html_css :deep(a) { color: #333; } .foot_text_html_css :deep(img) { margin: 0 5px; } //添加在线客服 .kefu { position: fixed; top: 320px; right: 0px; .kefu_itemKf { background-color: #0099cc; border-radius: 20px; width: 128px; height: 128px; margin-bottom: 30px; text-align: center; box-sizing: border-box; position: relative; cursor: pointer; a { >p { color: #fff; font-size: 24px; font-weight: 500; line-height: 32px; } >img { margin: 16px auto 0px; width: 60px; height: 60px; } } } .kefu_itemQQ { background-color: #fff; border-radius: 10px; box-shadow: 0 4px 16px #0000001a; height: 100px; margin-bottom: 15px; text-align: center; width: 100px; box-sizing: border-box; position: relative; cursor: pointer; >p { color: #666; font-size: 14px; font-weight: 500; line-height: 16px; } >img { margin-top: 10px; width: 60px; height: 60px; } &:hover { .kefu_item_content_QQ { display: block; } } } .kefu_itemPhone { background-color: #fff; border-radius: 10px; box-shadow: 0 4px 16px #0000001a; height: 100px; margin-bottom: 15px; text-align: center; width: 100px; box-sizing: border-box; position: relative; cursor: pointer; >p { color: #666; font-size: 14px; font-weight: 500; line-height: 16px; } >img { margin-top: 10px; width: 60px; height: 60px; } &:hover { .kefu_item_content_phone { display: block; } } } .kefu_item_content_QQ { position: absolute; top: -100px; right: 100px; background: #fff; border-radius: 10px; display: none; width: 190px; height: 330px; background: #fff; box-shadow: 0 4px 16px #0000001a; z-index: 99; box-sizing: border-box; padding: 20px; img { margin-bottom: 10px; } .qqfs { margin-bottom: 20px; font-size: 14px; color: #333; } .arrow { width: 0; height: 0; width: 0; border-top: 20px solid transparent; border-bottom: 20px solid transparent; border-left: 20px solid #fff; position: absolute; top: 120px; right: -20px; transform: translateX(-50%); z-index: 100; } } .kefu_item_content_phone { position: absolute; top: 0; right: 100px; background: #fff; border-radius: 10px; display: none; width: 190px; height: 80px; background: #fff; box-shadow: 0 4px 16px #0000001a; z-index: 99; box-sizing: border-box; padding: 20px; text-align: left; color: #333; .kefu_item_content_phone_title { margin-bottom: 5px; font-weight: bold; } .arrow { width: 0; height: 0; width: 0; border-top: 20px solid transparent; border-bottom: 20px solid transparent; border-left: 20px solid #fff; position: absolute; top: 20px; right: -20px; transform: translateX(-50%); z-index: 100; } } } // 关联网站 .websiteLink { position: fixed; left: 16px; bottom: 10px; .websitelist { width: 420px; height: 54px; line-height: 54px; color: #ee6363; margin-bottom: 10px; border: 2px solid #ccc; text-align: center; background-color: #fff; font-size: 28px; a { color: #ee6363; } } } // 你问我答 .questionAnswer { width: 300px; height: auto; overflow: hidden; position: fixed; bottom: 0; right: 0; background: #fff; border: 1px solid #7ab9dd; padding: 10px; box-shadow: 0px 1px 8px #888; z-index: 99999999; .title { height: 40px; line-height: 40px; span { font-size: 22px; color: #0a78d7; } } .content { height: 300px; overflow: auto; } } }