/* 在 CSS 文件顶部或 <style> 标签内 */
@font-face {
  font-family: "bahnschrift"; /* 自定义字体名称 */
  src: url("../fonts/bahnschrift.ttf") format("ttf");
  font-weight: normal;
  font-style: normal;
}

/* 头部css */
:root {
  --back_color_red: #ff2044;
  --fontColor_main: #333;
  --fontColor_minor: #797979;
  --fontColor_gray: #999;
  --web_width: 60.2rem;
}

body {
  color: var(--fontColor_main);
}
#header{
  box-shadow: 0 5px 5px -5px #ddd;
  padding-bottom: 1px;
  margin-bottom: 1rem;
}
.header_box {
  width: 100%;
  height: 4.6rem;
  background-color: #fff;
  color: var(--fontColor_main);
}
.header_box_main {
  width: var(--web_width);
  height: 100%;
  margin: 0 auto;
  display: flex;
  align-items: center;
}
.header_bM_logo {
  width: 8.5rem;
  height: 3.4rem;
  /*background-color: var(--back_color_red);*/
  background-image: url('../images/logo.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
.header_bM_logo > img {
  width: 100%;
  height: 100%;
}
.header_bM_address {
  width: 5.8rem;
  padding-left: 1.2rem;
  font-size: 0.6rem;
}
.header_bM_address > div {
  display: flex;
  align-items: center;
  height: 2rem;
  cursor: pointer;
}
.svg_arrows {
  transform: rotate(180deg);
  margin-left: 0.3rem;
  /* transition: all 0.3s ease-out; */
  font-size: 0.6rem;
}
.header_bM_address > div:hover {
  /*color: var(--back_color_red);*/
}
.header_bM_address > div:hover svg,
.header_bM_search_top > div:hover svg {
  transform: rotate(0);
}
.header_bM_tabs {
  font-size: 0.9rem;
}
.header_bM_tabs > a {
  line-height: 2rem;
  width: 3.5rem;
  text-align: center;
  display: inline-block;
}
.header_bM_tabs > a:hover {
  color: var(--back_color_red);
}
.header_bM_tabs_color {
  color: var(--back_color_red);
}
.header_bM_search {
}
.header_bM_search_top {
  display: flex;
  height: 1.8rem;
  border: 0.1rem solid var(--back_color_red);
  font-size: 0.8rem;
}
.header_bM_search_top > div {
  display: flex;
  align-items: center;
  color: var(--fontColor_minor);
  cursor: pointer;
  width: 4rem;
  justify-content: center;
  position: relative;
}
.header_bM_search_top > div::after {
  content: "";
  position: absolute;
  width: 1px;
  height: 1rem;
  background-color: var(--back_color_red);
  left: 100%;
  top: calc(50% - 0.5rem);
}
.header_bM_search_top > input {
  width: 14.45rem;
  border: 0;
  padding: 0 0.6rem;
  box-shadow: none;
  height: 100%;
}
.header_bM_search_top > input:focus {
  box-shadow: none;
}
.header_bM_search_top > button {
  background-color: var(--back_color_red);
  border: 0;
  color: #fff;
  width: 4rem;
  cursor: pointer;
  font-size: 0.8rem;
}
.header_bM_search_top > button:hover {
  opacity: 0.8;
}
.header_bM_search_top > button:active {
  opacity: 1;
}
.header_bM_search_list {
  display: flex;
  align-items: center;
  font-size: 0.6rem;
  color: var(--fontColor_gray);
  margin-top: 0.4rem;
}
.header_bM_search_list > li {
  margin-left: 0.6rem;
  cursor: pointer;
}
.header_bM_search_list > li:nth-child(1) {
  color: var(--back_color_red);
  margin-left: 0;
}
.header_bM_search_list > li:hover {
  color: var(--back_color_red);
}
.header_bM_right {
  display: flex;
  align-items: center;
  width: 5.6rem;
  justify-content: right;
  font-size: 0.8rem;
  cursor: pointer;
}
.header_bM_right > svg {
  font-size: 1rem;
  margin-right: 0.2rem;
}
.header_bM_app {
  margin-left: 1rem;
  color: var(--fontColor_minor);
}
.header_bM_login {
  color: var(--back_color_red);
}
.header_bM_login > img {
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  background-color: #000;
  margin-right: 0.2rem;
}
/* banner通用数据 */
.banner_box {
  width: 100%;
  height: 25.2rem;
  position: relative;
}
/* 通用基本盒子 */
.basics_box {
  width: var(--web_width);
  margin: 0 auto;
}
/* 通用箭头 */
.arrows {
  --arrows_rotate: 45deg;
  width: var(--arrows_length);
  height: var(--arrows_length);
  border-top: var(--arrows_borderLength) solid var(--arrows_color);
  border-right: var(--arrows_borderLength) solid var(--arrows_color);
  transform: rotate(var(--arrows_rotate));
  display: inline-block;
  margin: var(--arrows_margin);
}
/* 数字字体 */
.number_fonts {
  font-family: "bahnschrift", sans-serif;
}

/* 底部 */
.footer_box {
  background-color: #e5e5e5;
}
.footer_box_nav {
  height: 11.5rem;
  display: flex;
  align-items: center;
  column-gap: 2.4rem;
}

.footer_bN_list {
  display: flex;
  flex-grow: 1;
  justify-content: space-between;
  padding-left: 2.1rem;
}
.footer_bN_qr {
  text-align: center;
  font-size: 0.7rem;
  color: var(--fontColor_main);
}
.footer_bN_qr > img {
  width: 4.8rem;
  height: 5.5rem;
  margin-bottom: 0.5rem;
}
.footer_bN_list_main > p {
  font-size: 0.7rem;
  color: var(--fontColor_main);
  line-height: 1rem;
}
.footer_bN_lM_list {
  color: var(--fontColor_gray);
  font-size: 0.6rem;
}
.footer_bN_lM_list > li {
  margin-top: 0.5rem;
}
.footer_bN_lM_list > li > a:hover {
  color: var(--back_color_red);
}
.footer_box_archival {
  background-color: #3e3e3e;
  height: 4.1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.6rem;
  color: #fff;
  text-align: center;
  line-height: 1.2rem;
}

/* 通用热门演出 */

.hot_main_right {
  width: 12.3rem;
  flex-shrink: 0;
  color: var(--fontColor_main);
  border: 1px solid #eeeeee;
}

.hot_mR_bottom {
  font-size: 0.8rem;
  font-weight: normal;
  line-height: 2rem;
  padding: 0 0.6rem;
  background-color: #f8f8f8;
}
.hot_one_right {
  padding: 0 0.6rem 0.8rem;
}
.hot_one_right > li > a {
  display: flex;
  column-gap: 0.6rem;
  height: 6.4rem;
  width: 100%;
  margin-top: 0.8rem;
}
.hot_one_right_img {
  width: 4.8rem;
  height: 100%;
  flex-shrink: 0;
}
.hot_one_right_main {
  padding: 0.2rem 0;
  display: flex;
  flex-direction: column;
  --row_number: 3;
}

.hot_one_rm_title {
  font-size: 0.7rem;
  color: var(--fontColor_main);
  margin-bottom: 0.2rem;
}
.hot_one_rm_score {
  font-size: 0.7rem;
  margin-top: 0.4rem;
  color: #dddada;
}
.hot_one_rm_time {
  color: var(--fontColor_gray);
  font-size: 0.6rem;
}

.hot_one_rm_button > p {
  font-size: 0.8rem;
  color: var(--back_color_red);
}
.hot_one_rm_button > p > span {
  font-size: 0.7rem;
}
.hot_one_rm_button > button {
  font-size: 0.7rem;
  color: #fff;
  background-color: var(--back_color_red);
  border: 0;
  height: 1.6rem;
  width: 4.4rem;
  border-radius: 0.2rem;
  display: none;
  cursor: pointer;
}
.hot_one_right > li:hover .hot_one_rm_title {
  color: var(--back_color_red);
}
.hot_one_right > li:hover .hot_one_rm_button > button {
  display: block;
}
.hot_one_rm_button > button:hover {
  opacity: 0.8;
}

.hot_title_button {
  display: flex;
  align-items: center;
  color: var(--fontColor_gray);
  flex-shrink: 0;
  /* 箭头样式 */
  --arrows_length: 0.2rem;
  --arrows_color: var(--fontColor_gray);
  --arrows_borderLength: 1px;
  --arrows_margin: 0 0 0 0.2rem;
  cursor: pointer;
}

.hot_title_button:hover {
  --fontColor_gray: var(--back_color_red);
  border: 0;
}
.hot_title_button > i {
  transform: rotate(135deg);
  margin-top: -0.1rem;
  margin-left: 0.3rem;
}

/* 分页 */

.list_box_paging {
  height: 4.4rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  column-gap: 0.5rem;
  padding: 0 1.3rem;
  font-size: 0.7rem;
  color: #666;
}
.list_box_paging > li {
  width: 1.6rem;
  height: 1.6rem;
  background-color: #f4f4f5;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.list_box_paging > li:nth-of-type(1) i {
  --arrows_length: 0.3rem;
  --arrows_color: var(--fontColor_gray);
  --arrows_borderLength: 1px;
  --arrows_rotate: -135deg;
}
.list_box_paging > li:nth-last-of-type(1) i {
  --arrows_length: 0.3rem;
  --arrows_color: var(--fontColor_gray);
  --arrows_borderLength: 1px;
}
.list_bP_click {
  background-color: var(--back_color_red) !important;
  color: #fff;
}
.list_box_paging > li:hover {
  color: #fff;
  background-color: var(--back_color_red);
  --fontColor_gray: #fff;
}

/* input */
input,
textarea {
  border: 0px;
  box-shadow: 0 0 0 1px #dcdcdc inset;
  height: 1.8rem;
  padding: 0 0.8rem;
  flex-grow: 1;
  width: 100%;
  transition: all 0.2s ease;
  box-sizing: border-box;
  min-width: 0;
}
textarea {
  min-height: 4rem;
}
input:focus,
textarea:focus {
  box-shadow: 0 0 0 1px #4096ef inset;
}
.input_list {
  display: flex;
  font-size: 0.7rem;
  margin-bottom: 1.2rem;
}
.input_list > p {
  width: 4.4rem;
  position: relative;
  text-align: right;
  line-height: 1.8rem;
  flex-shrink: 0;
}
.required > p::before {
  content: "*";
  color: red;
}
.input_list_password {
  display: flex;
  align-items: center;
  font-size: 0.6rem;
  color: #666;
  column-gap: 0.2rem;
  margin-top: 0.6rem;
}
.input_list_password > p:not(:nth-of-type(1)) {
  width: 2.2rem;
  height: 1rem;
  background-color: #d0d0d0;
  text-align: center;
  color: #aaa;
}
.input_lP_yes {
  background-color: var(--back_color_red) !important;
  color: #fff !important;
}
.input_list_yzm {
  display: flex;
  flex-grow: 1;
  column-gap: 0.4rem;
}
.input_list_yzm > div {
  width: 5.6rem;
  height: 1.8rem;
  background-color: #f1f1f1;
  flex-shrink: 0;
}

.input_list_tongy {
  display: flex;
  align-items: center;
  font-size: 0.6rem;
  margin-top: 0.6rem;
}
.input_list_tongy > div {
  width: 0.6rem;
  height: 0.6rem;
  border: 1px dashed #dcdcdc;
  margin-right: 0.4rem;
}
.input_list_tongy a {
  color: #3a8bff;
}
.disabled_input {
  box-shadow: none;
  background-color: #eaeaec;
}

.input_choice {
  display: flex;
  line-height: 1.8rem;
}
.input_choice > div {
  margin-right: 1.2rem;
  display: flex;
  align-items: center;
  cursor: pointer;
  --border: #eee;
  --borderPx: 1px;
}
.input_choice > div:hover {
  color: var(--back_color_red);
  --border: var(--back_color_red);
}
.input_choice > div > div {
  width: 0.7rem;
  height: 0.7rem;
  border-radius: 50%;
  border: var(--borderPx) solid var(--border);
  margin-right: 0.4rem;
}
.input_choice_click {
  --border: var(--back_color_red) !important;
  --borderPx: 0.2rem !important;
  color: var(--back_color_red);
}
table {
  width: 100%;
  margin-top: 0.8rem;
}
table,
th,
td {
  border: 1px solid #ebeef5;
  border-collapse: collapse; /* 合并相邻单元格的边框 */
  padding: 0.8rem;
  font-size: 0.7rem;
  text-align: left;
  font-weight: normal;
  box-sizing: border-box;
}
th {
  background-color: #f8f8f8;
  height: 2.4rem;
}
td {
}
td time {
  font-size: 0.6rem;
  color: #606266;
}

/* 登陆页面 */
.login_box {
  position: fixed;
  width: 100%;
  height: 100%;
  background-color: #00000060;
  display: flex;
  align-items: center;
  justify-content: center;
}
.login_box_main {
  width: 20rem;
  height: 21.6rem;
  background-color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 1.5rem;
  color: var(--fontColor_main);
}
.login_box_main > div {
  width: 100%;
}
.login_box_main_title {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 3.4rem;
  font-size: 0.9rem;
  color: #999;
}
.login_box_main_title > p {
  padding: 0.4rem 0;
  border-bottom: 0.1rem solid transparent;
  cursor: pointer;
}
.click_tabs {
  color: var(--fontColor_main);
  border-color: var(--back_color_red) !important;
}
.click_form {
  margin-top: 2.4rem;
}
.click_form input {
  height: 2.2rem;
  padding-left: 2rem;
  font-size: 0.7rem;
}
.click_form > div {
  position: relative;
  display: flex;
  margin-bottom: 1.6rem;
}
.click_form > div > svg {
  position: absolute;
  top: 0.7rem;
  left: 0.8rem;
  font-size: 0.8rem;
}
.click_form_tongyi {
  font-size: 0.6rem;
  color: #9fa19f;
  align-items: center;
  line-height: 0.6rem;
}
.click_form_tongyi a {
  color: #3a8bff;
}
.click_form_tongyi > div {
  margin-right: 0.2rem;
  display: block;
  height: 0.6rem;
  cursor: pointer;
}
.login_button {
  width: 100%;
  border: 0;
  height: 2.2rem;
  background-color: var(--back_color_red);
  color: #fff;
  font-size: 0.8rem;
  cursor: pointer;
}
.login_button:hover {
  opacity: 0.8;
}
.login_button:active {
  opacity: 1;
}
.click_form_buttom {
  display: flex;
  align-items: center;
  justify-content: right;
  column-gap: 1.2rem;
  margin-top: 1.2rem;
  font-size: 0.6rem;
  color: #999;
}
.click_form_buttom > a {
  color: #3a8bff;
}
.click_form_buttom > p {
  width: 100%;
  text-align: center;
}
.click_form_qr {
  color: var(--back_color_red);
  width: 5rem;
  font-size: 0.7rem;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  border: 1.5px solid #dcdcdc;
  border-left: 0;
  cursor: pointer;
}