@charset "utf-8";

/* reset */
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
input,
textarea,
button,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
menu,
nav,
section {
  display: block;
}
html,
body {
  height: auto;
  min-height: 100vh;
  -webkit-text-size-adjust: none;
  -moz-text-size-adjust: none;
  -ms-text-size-adjust: none;
  background-color: var(--normal-bg) !important;
}
ol,
ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
a {
  text-decoration: none;
  color: inherit;
}
a:hover {
  text-decoration: none;
}
legend,
caption,
hr {
  display: none;
}
th {
  font-weight: inherit;
}
em {
  font-style: normal;
}
input {
  vertical-align: middle;
}
p,
h3,
h2,
h1 {
  letter-spacing: normal;
}
input,
textarea,
button,
select {
  font-family: "SDGothic", sans-serif;
  color: #222;
}
body {
  font-family: "SDGothic", sans-serif;
  width: 100%;
  height: 100%;
  color: #222;
  background-color: #fff;
  font-weight: 400;
}
video {
  object-fit: fill;
}

.fclear {
  *zoom: 1;
}
.fclear:after {
  display: block;
  content: "";
  clear: both;
}
.ir_text {
  text-indent: -9999px;
  overflow: hidden;
  font-size: 0;
  height: 0;
}
.ir_text > * {
  text-indent: -9999px;
  overflow: hidden;
  font-size: 0;
  height: 0;
}

.ellipsis {
  display: inline-block;
  max-width: 100%;
  white-space: nowrap;
  -ms-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  overflow: hidden;
}
.ellipsis_line {
  /* font-size, line-height, max-height,-webkit-line-clamp : 개별적용(2줄이상) */
  position: relative;
  font-size: 16px;
  transition: all 0.3s;
  white-space: normal;
  word-wrap: break-word;
  line-height: 30px;
  max-height: 60px;
  -webkit-line-clamp: 2;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ================================ desktop css ================================== */
.oneDot {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.twoDot {
  display: -webkit-box; /* 必须指定display属性 */
  overflow: hidden; /* 必须指定overflow属性 */
  text-overflow: ellipsis; /* 显示省略号 */
  line-height: 1.5em; /* 每行的高度 */
  max-height: 3em; /* 最大高度（根据需求调整）*/
  -webkit-line-clamp: 2; /* 最多显示的行数 */
  -webkit-box-orient: vertical; /* 必须指定box-orient属性 */
}
.threeDot {
  display: -webkit-box; /* 必须指定display属性 */
  overflow: hidden; /* 必须指定overflow属性 */
  text-overflow: ellipsis; /* 显示省略号 */
  line-height: 1.5em; /* 每行的高度 */
  max-height: 4.5em; /* 最大高度（根据需求调整）*/
  -webkit-line-clamp: 3; /* 最多显示的行数 */
  -webkit-box-orient: vertical; /* 必须指定box-orient属性 */
}
.fourDot {
  display: -webkit-box; /* 必须指定display属性 */
  overflow: hidden; /* 必须指定overflow属性 */
  text-overflow: ellipsis; /* 显示省略号 */
  line-height: 1.5em; /* 每行的高度 */
  max-height: 6em; /* 最大高度（根据需求调整）*/
  -webkit-line-clamp: 4; /* 最多显示的行数 */
  -webkit-box-orient: vertical; /* 必须指定box-orient属性 */
}
.fiveDot{
  display: -webkit-box; /* 必须指定display属性 */
  overflow: hidden; /* 必须指定overflow属性 */
  text-overflow: ellipsis; /* 显示省略号 */
  line-height: 1.5em; /* 每行的高度 */
  max-height: 7.5em; /* 最大高度（根据需求调整）*/
  -webkit-line-clamp:5; /* 最多显示的行数 */
  -webkit-box-orient: vertical; /* 必须指定box-orient属性 */
}

/* form样式 */
.form-select{
  color:#333333;
  --bs-form-select-bg-img:url('../images/down-arrow-icon.svg')
}
.form-select:focus {
  border-color: none;
  outline: 0;
  box-shadow: none;
}
/* 为了更好的浏览器兼容性，使用带有浏览器前缀的样式 */
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color: #939396!important;
}

input:-moz-placeholder,
textarea:-moz-placeholder {
  color: #939396!important;
}

input::-moz-placeholder,
textarea::-moz-placeholder {
  color: #939396!important;
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  color: #939396!important;
}

/* 顶部开始 */
.header-container{
  background-color: var(--header-bg);
}
.header-container-logo{

}
.header-container-logo-img1{
  height: 56px;
  width: auto;
}
.header-container-title{
  height: 40px;
  border-left:1px solid #D8D8D8;
  font-size: var(--font-18-size);
  font-family: var(--font-main-family);
  font-weight: var(--font-weight-400);
  color:var(--font-white-color);
  padding-left:24px;
  margin-left:24px;
  line-height: 22px;
}
.english-title{
  font-size: var(--font-12-size);
}
.header-container-logo-img2{
  height: 40px;
  width: auto;
  margin-left:15%;
}
.nav-item{
  margin-right:10%;
}
.nav-item .line{
  width:16px;
  height: 2px;
  background-color: var(--content-bg);
  margin:0 auto;
}
.nav-link{
  font-size: var(--font-16-size);
  color:var(--sub-color);
  line-height: 30px;
}
.navbar-nav .nav-link:hover{
  color:var(--font-red-color);
}
.navbar-nav .nav-link.active, .navbar-nav .show>.nav-link{
  color:var(--font-red-color);
  font-weight: var(--font-weight-600);
}
.navbar-nav .nav-link.active .line{
  background-color: var(--font-red-color);
}
/* 登录 */
.header-login{
  min-width:110px;
}
/* 头像 */
.default-headpic{
  width:32px;
  height: auto;
}
/* 路由导航 */
.breadcrumb-container{
  --bs-breadcrumb-divider: url('../images/breadcrumb-right-icon.svg') !important;    
  margin-bottom:78px;
}
.breadcrumb{
  font-size: var(--font-14-size) !important;
}
.breadcrumb-item+.breadcrumb-item::before{
  padding-top:2px;
  box-sizing: border-box;
}
/* 底部开始 */
.footer{
  background-color: var(--footer-bg);
}
.footer-logo{
  margin-right:10%;
}
.footer-logo-img{
  width:80px;
  height: auto;
}
.footer-list-title{
  font-size: var(--font-18-size);
  font-family: var(--font-main-family);
  font-weight: var(--font-weight-600);
  color:var(--font-white-color);
}
.footer-list-item{
  font-size: var(--font-18-size);
  font-family: var(--font-main-family);
  font-weight: var(--font-weight-400);
  color:rgba(255,255,255,0.8);
}
.footer-list-item-span{
  font-size: var(--font-14-size);
  font-family: var(--font-main-family);
  font-weight: var(--font-weight-400);
  color:rgba(255,255,255,0.8);
  margin-right:2%;
}
.border-bottom{
  border-bottom: 1px solid rgba(255,255,255,0.3) !important;
}

/* ================================== web css ================================== */
@media all and (max-width: 1400px) {
}

@media all and (min-width: 1400px) {

}
/* ================================== 1200 css ================================== */
@media all and (max-width: 1200px) {

}

/* ================================== ipad css ================================== */
@media all and (max-width: 1000px) {
  .header-container-logo-img1{
    height: 48px;
  }
  .header-container-logo-img2{
    height: 26px;
    margin-left:20%;
  }
  .footer-logo{
    margin-right:1%;
  }
  .footer-list-title{
    font-size: var(--font-14-size);
  }
  .footer-list-item{
    font-size: var(--font-14-size);
    margin-right:18px !important;
  }
  .footer-list-item-span{
    font-size: var(--font-12-size);
    margin-right:6px !important;
  }
  .footer-list-item-span:nth-last-of-type(1){
    margin-right:0 !important;
  }
}
@media all and (max-width: 991px) {
 
}
@media all and (max-width: 900px) {
 
}
/* ================================== Mobile css ================================== */
@media all and (max-width: 767px) {
  .line{
    display: none !important;
  }
  .header-container-logo-img2{
    display: none !important;
  }
  .footer-logo-img{
    display: none !important;
  }
  .footer-list{
    flex-direction: column;
    align-items: flex-start !important;
   
  }
}
/* ================================== Mobile css ================================== */
@media all and (max-width: 375px) {
  
}
