
.H120 { height: 120px; }
.header { position: fixed; flex-direction: row; z-index: 99; width: 100%; top: 0px; left: 0px;  background: #fff;  }
.header.active { box-shadow: 0px 2px 5px 5px rgba(0, 0, 0, 0.05); }

.header .tit {  display: flex; flex-direction: row; justify-content: flex-end; height: 40px; align-items: center; }
.header .tit span { margin-right: 30px; }
.header .tit span a { color: #727272; }
.header .tit span a:hover { color: #1e376d; text-decoration: underline; }
.header .tit strong a { margin: 0px 5px; }
.header .tit strong a:hover { color: #1e376d; text-decoration: underline; }
.header .tit .fom { width: 255px; background: #1e376d; padding-left: 20px; margin-left: 20px; }
.header .tit .fom .txt { height: 40px; background: url('../images/icon1.png') no-repeat left center; color: #fff; padding: 0px 30px; }
.header .tit .fom input::-moz-placeholder, textarea::-moz-placeholder { color: #fff; font-weight: normal; }
.header .tit .fom input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #fff; font-weight: normal; }
.header .tit .fom input::-ms-input-placeholder,textarea::-ms-input-placeholder { color: #fff; font-weight: normal; }
.header .item { display: flex; flex-direction: row; justify-content: space-between; } 

.header .header-nav { display: inline-block; vertical-align:top; margin-right: 20px; }
.header .header-nav .nav-ul>li { display: inline-block; vertical-align: top;  color: #fff; position: relative; }
.header .header-nav .nav-ul>li>a { line-height: 80px; font-size: 16px; color: #1e376d; font-weight: bold; text-transform: uppercase; 
	margin-left: 45px; position: relative; display: inline-block; vertical-align: top; 
	transition: all .6s; -webkit-transition: all .6s; }
.header .header-nav .nav-ul>li>a:after { content: '';  position: absolute; bottom: 5px; left: 50%; width: 6px; height: 6px; border-radius: 50%; transition: all 0.6s; -webkit-transition: all 0.6s; }
.header .header-nav .nav-ul>li:hover>a:after { bottom: 15px; background: #3cb83c;  }
.header .header-nav .nav-ul>li:hover>a { color: #3cb83c; }
.header .header-nav .nav-ul>li.active>a { color: #e91d2d !important; }
.header .header-nav .nav-ul>li:hover>a { color: #3cb83c !important;}
.header .header-nav .nav-ul>li:hover .nav-ul2 { animation: navUp 0.5s 0s forwards; display: block; } 
.header .header-nav .nav-ul2 { position: absolute; top:78px; left: 20px; text-align: left; display: none; background: #fff; min-width: 100%;
box-shadow: 0px 0px 6px 6px rgba(29,29,29,0.08); border-top: 2px solid #3cb83c; }
.header .header-nav .nav-ul2 li a { display: block; font-size: 16px; color: #333; padding: 12px 20px;  border-bottom: 1px solid #d9d9d9;  white-space: nowrap; cursor: pointer; }
.header .header-nav .nav-ul2 li a:hover { background: #3cb83c; color: #fff; border-bottom: 1px solid #3cb83c; } 

.phone_nav { display: none; }


@keyframes navUp {
    from {
        opacity: 0.6;
        transform: translateY(15px);
    } to {
        opacity: 1;
        transform: translateY(0px);
    }
}

@media screen and (max-width: 1220px) {
    .header .header-nav .nav-ul>li>a {
        margin-left: 25px;
    }
}


@media screen and (max-width:1200px) {

.H50 { height: 50px; }
.phone_nav { display: block; }
.pc_header { display: none; }
.phone_header {  box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.1); display: block; position: fixed; left: 0px; top: 0px; width: 100%; left: 0px; top: 0px; z-index:99; background: #fff; padding: 0px 30px; height: 50px; }
.phone_header .logo img { height: 36px; margin-top: 7px; }
.phone_header .nav-open { position: absolute; right: 30px; top: 50%; margin-top: -15px; display: block; cursor: pointer; }
.phone_header .nav-open span { display: block; background-color: #000; height: 2px; width: 30px; margin: 6px auto; border-radius: 50px; }
.phone_header .close { background: url('../images/close.png') no-repeat center center;  position: absolute; right: 0px; top: 0px; width: 50px; height: 50px; display: block; }
.phone_header .header-nav { position: fixed;width: 60%;height: 100%;float: none;top: 0;left: -60%;background-color: #202020;transition: all 0.6s;-webkit-transition: all 0.6s; -moz-transition: all 0.6s; padding-top: 50px; overflow-y: auto; }
.phone_header .header-nav .nav-ul { padding: 10px; padding-top: 0px; }
.phone_header .header-nav .nav-ul>li { float: none; align-items: center; padding:0px;  position: relative; }
.phone_header .header-nav .nav-ul>li .line { margin: 0 6px; }
.phone_header .header-nav .nav-ul>li img { margin-right: 6px; }
.phone_header .header-nav .nav-ul>li>a { font-size: 14px; color: #fff; text-transform: uppercase; }
.phone_header .header-nav .nav-ul>li>a { font-size: 15px; padding: 15px 0px;  border-bottom: 1px solid #303030;  }
.phone_header .header-nav .nav-ul>li>a { display: block; margin-right: 0px; }
.phone_header .header-nav .nav-ul>li .icon { position: absolute; right: 0px; width: 46px; height: 51px;  z-index: 3; top: 0px; display: block; cursor: pointer; } 
.phone_header .header-nav .nav-ul1>li{width: 150px; display: flex; margin-top: 25px;}
.phone_header .header-nav .nav-ul1>li a{margin-left: 10px;}

.phone_header .header-nav .lang { display: flex; flex-direction: row; margin-left: 5px; margin-top: 10px; }
.phone_header .header-nav .lang a { font-size: 16px; color: #fff; background: #fff; color: #666; padding: 6px 15px; }
.phone_header .header-nav .lang a.active { background: #1e376d; color: #fff; }


.phone_header .header-nav .nav-ul>li .icon:after { content: ''; display: block; width: 9px; height: 9px; top: 0px; right: 15px; border: 2px solid rgba(255,255,255,.3); border-top: 0; border-left: 0; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); position: absolute; top: 20px; transition: all 0.6s; -webkit-transition: all 0.6s; -moz-transition: all 0.6s; }
.phone_header .header-nav .nav-ul>li .icon.active:after { content: ''; transform: rotate(45deg); -webkit-transform: rotate(45deg); top: 20px; }   
.phone_header .header-nav .nav-ul2 { display: none; padding-left: 15px; }
.phone_header .header-nav .nav-ul2 li a { font-size: 14px; color: #a6a6a6; display: block; padding: 10px 0px; border-bottom: 1px solid #303030; position: relative; padding-left: 12px;}
.phone_header .header-nav .nav-ul2 li a:after { content: ''; width: 4px; height: 4px; position: absolute; left: 0px; top: 0px; background: #4c4c4c; top: 50%; margin-top: -2px;  }
.phone_header .header-nav.active { left: 0; }
.phone_header .nav-back.active { right: 0px; } 
.phone_header .nav-back { position: fixed;top: 0; width: 40%;height: 100%; right: -40%;background-color: rgba(0,0,0,0.4);z-index: 100;transition: all 0.6s; -webkit-transition: all 0.6s; -moz-transition: all 0.6s; }
}


@media screen and (max-width:750px) {

.H50 { height: 50px; }
.phone_nav { display: block; }
.pc_header { display: none; }
.phone_header {  box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.1); display: block; position: fixed; left: 0px; top: 0px; width: 100%; left: 0px; top: 0px; z-index:99; background: #fff; padding: 0px 10px; height: 50px; }
.phone_header .logo img { height: 36px; margin-top: 7px; }
.phone_header .nav-open { position: absolute; right: 10px; top: 50%; margin-top: -12px; display: block; cursor: pointer; }
.phone_header .nav-open span { display: block; background-color: #000; height: 2px; width: 30px; margin: 6px auto; border-radius: 50px; }
.phone_header .close { background: url('../images/close.png') no-repeat center center;  position: absolute; right: 0px; top: 0px; width: 50px; height: 50px; display: block; }
.phone_header .header-nav { position: fixed;width: 60%;height: 100%;float: none;top: 0;left: -60%;background-color: #202020;transition: all 0.6s;-webkit-transition: all 0.6s; -moz-transition: all 0.6s; padding-top: 50px; overflow-y: auto; }
.phone_header .header-nav .nav-ul { padding: 10px; padding-top: 0px; }
.phone_header .header-nav .nav-ul>li { float: none; align-items: center; padding:0px;  position: relative; }
.phone_header .header-nav .nav-ul>li .line { margin: 0 6px; }
.phone_header .header-nav .nav-ul>li img { margin-right: 6px; }
.phone_header .header-nav .nav-ul>li>a { font-size: 14px; color: #fff; text-transform: uppercase; }
.phone_header .header-nav .nav-ul>li>a { font-size: 15px; padding: 15px 0px;  border-bottom: 1px solid #303030;  }
.phone_header .header-nav .nav-ul>li>a { display: block; margin-right: 0px; }
.phone_header .header-nav .nav-ul>li .icon { position: absolute; right: 0px; width: 46px; height: 51px;  z-index: 3; top: 0px; display: block; cursor: pointer; } 

.phone_header .header-nav .lang { display: flex; flex-direction: row; margin-left: 5px; margin-top: 10px; }
.phone_header .header-nav .lang a { font-size: 16px; color: #fff; background: #fff; color: #666; padding: 6px 15px; }
.phone_header .header-nav .lang a.active { background: #1e376d; color: #fff; }


.phone_header .header-nav .nav-ul>li .icon:after { content: ''; display: block; width: 9px; height: 9px; top: 0px; right: 15px; border: 2px solid rgba(255,255,255,.3); border-top: 0; border-left: 0; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); position: absolute; top: 20px; transition: all 0.6s; -webkit-transition: all 0.6s; -moz-transition: all 0.6s; }
.phone_header .header-nav .nav-ul>li .icon.active:after { content: ''; transform: rotate(45deg); -webkit-transform: rotate(45deg); top: 20px; }   
.phone_header .header-nav .nav-ul2 { display: none; padding-left: 15px; }
.phone_header .header-nav .nav-ul2 li a { font-size: 14px; color: #a6a6a6; display: block; padding: 10px 0px; border-bottom: 1px solid #303030; position: relative; padding-left: 12px;}
.phone_header .header-nav .nav-ul2 li a:after { content: ''; width: 4px; height: 4px; position: absolute; left: 0px; top: 0px; background: #4c4c4c; top: 50%; margin-top: -2px;  }
.phone_header .header-nav.active { left: 0; }
.phone_header .nav-back.active { right: 0px; } 
.phone_header .nav-back { position: fixed;top: 0; width: 40%;height: 100%; right: -40%;background-color: rgba(0,0,0,0.4);z-index: 100;transition: all 0.6s; -webkit-transition: all 0.6s; -moz-transition: all 0.6s; }
}