.hc_head{position: fixed;top: 0;left: 0;right: 0;z-index: 10;}
.hc_head_top{background-color: var(--base);height: 100px;transition: .3s;}
.hc_head_top_cont{width: 1200px;height: 100%;margin: 0 auto;display: flex;justify-content: space-between;align-items: center;}
.hc_head_top_left{display:flex;align-items: center;height: 100%;}
.hc_head_top_left>a>img{transition: .3s;height: 78px;}
.hc_head_top_left>img{margin-left: 32px;transition: .3s;width: 297px;}
.hc_head_tm{margin-left: 200px;}
.hc_head_tm>a{color: #fff;}
.hc_head_top_right{display: flex;flex-direction: column;align-items: center;}
.hc_head_top_right>div{color: #fff;font-size: 16px;}
.hc_head_top_right>div>img{margin-right: 10px;}
.hc_head_top_right>h1{color: #fff;font-size: 34px;}
.hc_head_bottom{background-color: #282c30;}
.hc_head_bottom_cont{width: 1200px;margin: 0 auto;height: 50px;display: flex;align-items: center;position: relative;}
.hc_head_item{flex: 1;text-align: center;position: relative;height: 100%;display: flex;align-items: center;}
.hc_head_item>a{color: #fff;font-size: 16px;line-height: 30px;display: inline-block;height: 30px;width: 100%;border-right: 1px solid #797979;}
.hc_head_item:first-child>a{border-left: 1px solid #797979;}
.hc_head_item>span{position: absolute;bottom: 0 ;left: 50%;transform: translateX(-50%);height: 3px;width: 18px;background-color: #fff;transition: .3s;opacity: 0;}
.hc_head_item:hover span{opacity: 1;}
.hc_head_active>span{opacity: 1;}
.hc_head_exc{position: absolute;top: 100%;left: 0;right: 0;z-index: 2;background-color: rgba(0,0,0,.5);display: none;overflow: hidden;}
.hc_head_exc>a{color: #fff;font-size: 13px;display: block;text-align: center;height: 40px;line-height: 40px;}
.hc_head_exc>a:hover{background-color: var(--base)}

.hc_head_short .hc_head_top{height: 50px;}
.hc_head_short .hc_head_top_left>a>img{height: 40px;}
.hc_head_short .hc_head_top_left>img{width: 200px;}
.hc_head_short .hc_head_top_right>div{display: none;}
.hc_head_short .hc_head_top_right>h1{font-size: 28px;}

.hc_foot{background-color: #282c30;}
.hc_foot_cont{width: 1200px;margin: 0 auto;padding: 50px 0;display: flex;justify-content: space-between;color: #fff;align-items: center;}
.hc_foot_one{text-align: center;}
.hc_foot_one>h1{color: var(--base);font-weight: 600;padding: 15px 0;}
.hc_foot_one>a{display: flex;align-items: center;justify-content: center;font-size: 20px;}
.hc_foot_one>a>img{margin-right: 10px;}
.hc_foot_two{display: flex;flex-direction: column;align-items: center;padding: 0 50px;border-left: 1px solid #6b6b6b;border-right: 1px solid #6b6b6b;}
.hc_foot_two>h1{font-size: 24px;font-weight: 600;margin-bottom: 26px;}
.hc_foot_two>div{display: flex;width: 210px;justify-content: space-between;flex-wrap: wrap;}
.hc_foot_two>div>a{width: 50%;text-align: center;margin-bottom: 25px;font-size: 16px;}
.hc_foot_three>p{line-height: 30px;}
.hc_foot_four{text-align: center;}
.hc_foot_four>h1{font-size: 14px;line-height: 50px;}

@media screen and (max-width:766px){
    .hc_head_top{height: 50px;}
    .hc_head_top_left>a>img{height: 40px;}
    .hc_head_bottom{display: none;position: fixed;top: 0;left: 0;right: 0;height: 100vh;background-color: #fff;overflow-y: auto;}
    .hc_head_bottom_cont{padding: 50px 0 0;width: 100%;height: 100%;display: block;}
    .hc_head_item{height: auto;flex: unset;width: 100%;overflow: hidden;display: block;}
    .hc_head_item>span{display: none;}
    .hc_head_item>a{position: relative}
    .hc_head_item>a>i{font-style: normal;font-weight: bold;position: absolute;right: 0;}
    .hc_head .hc_head_item>a{color: #333;border: 0;font-size: 1.6rem;width: 100%;height: 45px;line-height: 45px;}
    .hc_head .hc_head_active>a{color: var(--base);}
    .hc_head_exc{position: unset;background-color: #fff;width: 100%;}
    .hc_head_exc>a{color: #666;font-size: 1.2rem;}
    .hc_head_menu{padding: 2px 8px;border-radius: 10px;border: 2px solid #bbb;width: 40px;margin: 10px 0;}
    .hc_head_menu>img{width: 100%;}
    .hc_head_bottom_cont>i{position: absolute;top: 20px;right: 15px;font-size: 30px;font-weight: bold;font-style: normal;line-height: 1;color: #666;}

    .hc_foot_cont{flex-direction: column;}
    .hc_foot_three>p:nth-child(n+4){text-align: center;}
    .hc_foot_four{margin-top: 20px;}
    .hc_head_short .hc_head_top_right>div{display: block;}
    
}