﻿
* {margin: 0;padding: 0;font-family:'MicrosoftYaHei', sans-serif, "microsoft yahei";font-size:20px;}
ul {list-style: none;}
a{text-decoration:none ; cursor:pointer;outline:none;transition: .5s all;}
body{ color: #f5f5f5}
a:hover{
   color: #db0632;
   text-decoration:none !important;
}


.toggleClass{ display:none;}
.LangM{ display:none;}

@media only screen and (min-width: 450px){
    html {
        font-size: 10px !important; 
    }
}
@media only screen and (min-width: 750px){
    html {
        font-size: 12px !important; 
    }
}
@media only screen and (min-width: 970px){
    html {
        font-size: 16px !important;
    }
} 
@media only screen and (min-width: 1100px){
    html {
        font-size: 20px !important;
    }
}




.flex{
   display: -ms-flexbox;
   display: flex;
   flex-wrap: wrap;
   -ms-flex-wrap: wrap;
   justify-content: space-between;
   -webkit-box-pack: space-between;
   -webkit-justify-content: space-between;}
input{border:none;background: none;}
.fl{
   float: left;
}
.fr{
   float: right;
}
.cl{
   clear: both;
}
.sp_header,.sjj_nav,.lang{
   display: none;
}

/*nav*/
header{
   position: relative;
}
nav{
   position: fixed;
   top: 0;
   left: 0;
   height: 5rem;
   width: 100%;
   background: white;
   z-index: 9999;
   overflow:hidden;
   border-bottom: 1px solid #eee;
}
header .small{
   -webkit-box-shadow: 0px 0px 10px black;  
   -moz-box-shadow: 0px 0px 10px black;
   box-shadow: 0px 0px 10px black;
   border-collapse:separate !important;
}
.navmain{
   width: 65rem;
   margin:0 auto;
}
.navBox li a{
   display: inline-block;
   padding: 0 0.75rem;
   line-height: 5rem;
   color: black;
   font-size: .9rem;
   height: 5rem;
}
.navBox li a:hover{
   /*background: #ac0000;*/
   color: #ac0000;
}
.navBox li a i.fa{
   font-size: 1.1rem;
   transition: 1s;
   margin-left: 5px;
}
.navBox li.active a i.fa{
   -webkit-transform: rotate(180deg);
   -ms-transform: rotate(180deg);
   -o-transform: rotate(180deg);
   transform: rotate(180deg);
}
.lang{
   display: none;
   width: 100%;
   height: 2.5rem;
   text-align: center;
   position: fixed;
   left: 0;
   z-index: 999;
   background-color:#e6e6e6;
   -o-animation: all ease .8s;
   animation: all ease .8s;
   -webkit-animation: all ease .8s;
}
.lang a{
   display: inline-block;
   padding: 0px .75rem;
   color: #595757;
   font-size: 0.8rem;
   line-height: 2.5rem;
}
.lang a:hover{
   color: #db0632;
}
/*footer*/
footer{
  width: 100%;
  background-color: white;
  padding:3rem 0;
  border-top: 1px solid #eee;
}
.footMain{
  width: 62rem;
  margin:0 auto;
}
.footLogo{
  width:7.5rem;
}
.footLogo img{
  max-width:100%;
  height: auto; 
}
.footNav{
  width: 33.5rem;
  color: #fff;
  align-items: center;
}
.footNav p a{
  color: black;
}
.footList {
  margin: 0;
}
.footList li a{
  font-size: 14px;
  line-height: 7px;
  letter-spacing: 0px;
  color: black;
  transition: .5s;
}
.footList li a:hover ,.footNav p a:hover{
  color: #db0632;
}
.footnav1 a{
  font-size: .9rem !important;
}
.Er_code{
  font-size: .7rem;
  color: black;
}
.footNav_m{display: none;}
.Er_code_m{display: none;}
.Er_code p{
	font-size:.8rem;}
.Er_codeImg{
  margin-top: .7rem;
}
/*版權*/
.copyMain,.copyMain a{
  height: 2.5rem;
  line-height: 2.5rem;
  text-align: center;
  background-color: #d7d7d7;
  font-size: .7rem;
  color: #222;
}
/*返回頂部*/
#scrollUp {
   bottom: 4rem;
   right: 1.3rem;
   height: 3.2rem;
   width: 3.2rem;
   background:#fff url(https://srm.dongboauto.com/images/top.png) 0 0 no-repeat;
   background-size: cover;
   opacity: .7;
   border-radius: 50%;
}
#scrollUp:hover {
   opacity: 1;
}
/*移動端導航*/
@media screen and (min-width: 320px)and (max-width: 600px){
.lang{
   top:2.5rem;
}
footer {
    padding: 2rem 0;
}
.footLogo{
   width:6rem;
   margin:0 auto 2rem;
}
.footMain {
    width: 100%;
    margin: 0 auto;
}
.footNav{
   display: none;
}
.footNav_m {
	width: 85%;
	margin:0 auto;
	display: block;
}
.footNav_m p a{
	display: block;
	color: black;
	margin-bottom: 1.3rem;
}
.Er_code{
display: none;
}
.Er_code_m{
	width: 100%;
	display: block;
	text-align: center;
}
.Er_code_m p{
	font-family: "MicrosoftYaHei";
	font-size: 0.9rem;
	font-weight: bold;
	color: black;
}
.Er_code_m p span{
	font-weight: normal;
	margin-left: 6px;
	font-size: 0.8rem;
}
.copyMain,.copyMain a{
   font-size: .5rem;
}
.sp_header,.sjj_nav{display: block;}
.navBox{display: none;}
.slider{margin-top: 44px;}
.head{display:none}
.sp_header{
   overflow:hidden;
   /*background:#fff;*/
   position:fixed;
   z-index:999;
   width:100%;
   top: 0;
   background: white;
   border-bottom: 1px solid #eee;
}
.sp_logo{
   padding:.5rem;
   text-align: center;}
  .sp_logo a{
  	display: block;
  }
.LangM{
   position: absolute;
   top: 13px;
   right: 16px;
   font-size: 22px;
}
.LangM a{
	font-size: .9rem;
	color:#fff;
	display: block;
	position: relative;
	margin-right: 6px;
}
.LangM a i{
	font-size: 1.2rem;
	position: absolute;
	top: 2px;
	transition: 1s;
	right: -0.9rem;
}
.LangM a.active i.fa{
   -webkit-transform: rotate(180deg);
   -ms-transform: rotate(180deg);
   -o-transform: rotate(180deg);
   transform: rotate(180deg);
}
.footNav_m .flex p{width: 33%;text-align: center;}
.sp_logo img{

   width: 2.4rem;}
.sp_nav{
   width:50px;
   float: left;
   position:absolute;
   cursor:pointer;
   height:30px;
   margin-top:15px}
.sp_nav span{
   display:block;
   background:black;
   width:30px;
   height:2px;
   position:absolute;
   left:10px;
   transition:all ease 0.35s;}
.sp_nav span:nth-of-type(1){top:0px}
.sp_nav span:nth-of-type(2){top:10px}
.sp_nav span:nth-of-type(3){top:20px}
.sp_nav_se span:nth-of-type(1){
   top:10px;
   transform:rotate(45deg)}
.sp_nav_se span:nth-of-type(2){width:0}
.sp_nav_se span:nth-of-type(3){
   top:10px;
   transform:rotate(-45deg)}
.sjj_nav{
   position:fixed;
   z-index:9999;
   background:rgba(0,0,0,0.8);
   width:100%;
   height:calc(100% - 104px);
   font-size:14px;
   line-height:40px;
   top:-100%;
   left:0;
   overflow:auto;
   overflow-x:hidden;
   transition:top ease 0.35s;}
.nav_show{top:50px}
.sjj_nav>ul>li:first-child{
   overflow:hidden;
   border-top:0}
.sjj_nav>ul>li:first-child>a{
   float:left;
   width:100%;}
.sjj_nav ul li i{
   position:absolute;
   top:5px;
   right:0px;
   border-left:1px #ddd solid;
   height:30px;
   padding:0px 7px 0 7px;}
.sjj_nav ul li{
   border-bottom:1px #ddd solid;
   position:relative;
   text-align: center;
   line-height:40px;
   font-size:14px;}
.sjj_nav ul li ul{display:none}
.sjj_nav ul li a{
   color:#fff;
   font-size: 15px;
   }
.sjj_nav ul li ul li a{
   color:#999;
   display:block;
   text-align:left;}
.sjj_nav ul li i svg{
   width:20px;
   height:20px;
   fill:#555;}
.sjj_nav ul li .sjj_nav_i_se svg{
   fill:#c9141e}
.sjj_nav ul li ul li>ul{margin-left:10px}
}

