@charset "utf-8";
html {
  margin: 0;
  height: 100%;
}
body {
  font-family: "PingFang", "Microsoft JhengHei", Arial, Helvetica;
  font-size: 16px;
  color: #333333;
  line-height: 1.5;
  margin: 0;
  height: 100%;
}
a {
  text-decoration: none;
  color: #3981e6;
}
a:hover {
  color: #66a6ff;
}
h1,
h2,
h3,
h4,
h5,
p {
  margin-bottom: 0;
}
button {
  border: 0;
  background-color: transparent;
}
button:focus {
  outline: none !important;
  box-shadow: none !important;
}
input,
textarea {
  box-shadow: none;
  -webkit-appearance: none; /* Safari*/
  -moz-appearance: none; /* FireFox */
  appearance: none;
}
input:focus {
  outline: none !important;
  box-shadow: none !important;
}
input::-webkit-input-placeholder {
  color: #b3b3b3 !important;
}
input::-moz-placeholder {
  color: #b3b3b3 !important;
}
input:-ms-input-placeholder {
  color: #b3b3b3 !important;
}
select:focus {
  outline: none !important;
  box-shadow: none !important;
}
.btn-check:focus + .btn,
.btn:focus {
  box-shadow: none;
}
.bg {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
.bg img {
  display: none;
}
.row.p12 {
  margin-left: -12px;
  margin-right: -12px;
}
.row.p12 > * {
  padding-left: 12px;
  padding-right: 12px;
}
.between_date::before {
  content: "-";
  margin-left: 4px;
  margin-right: 4px;
}
/*頁面載入loading*/
#loading {
  background-color: rgba(51, 51, 51, 0.5);
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100vh;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  display: none;
}
.loadingImg {
  position: relative;
  width: 100px;
  height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  /* background-image: url(../img/loading.gif); */
  background-size: 60px;
  background-position: center center;
  background-repeat: no-repeat;
  border-radius: 50%;
}
.loadingImg > div {
  z-index: -1;
}
/*頁面載入失敗*/
#Loadingfail {
  background-color: #f8f9fa;
  position: fixed;
  left: 225px;
  top: 0;
  width: 100%;
  max-width: calc(100% - 225px);
  height: 100vh;
  align-items: center;
  justify-content: center;
  z-index: 1;
  display: none;
}
.loadingfail_content {
  text-align: center;
}
.loadingfail_content > img {
  width: 100px;
  margin-bottom: 24px;
}
.loadingfail_content > p {
  margin-bottom: 20px;
  font-size: 14px;
  color: #666;
}
/*存檔中*/
#archiving {
  background-color: rgba(51, 51, 51, 0.5);
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100vh;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  display: none;
}
.archiving_content {
  text-align: center;
}
.archiving_content p {
  margin-top: 24px;
  font-size: 14px;
  color: #fff;
}
/*狀態*/
.status-btn {
  padding: 0 8px;
  width: fit-content;
  border-radius: 3px;
  font-size: 14px;
  line-height: 24px;
}

.status-btn.red {
  background-color: rgb(219 40 40 / 10%);
  color: #db2828;
}

.status-btn.yellow {
  background-color: rgb(245 154 30 / 10%);
  color: #f59a1e;
}

.status-btn.green {
  background-color: rgb(33 186 69 / 10%);
  color: #21ba45;
}

.status-btn.grey {
  background-color: #e3e3e3;
  color: #b3b3b3;
}

.status-btn.blue {
  background-color: rgb(102 166 255 / 10%);
  color: #66a6ff;
}

.status_red {
  padding: 0 8px;
  width: fit-content;
  background-color: rgb(219 40 40 / 10%);
  border-radius: 3px;
  font-size: 14px;
  color: #db2828;
  line-height: 24px;
}
.status_yellow {
  padding: 0 8px;
  width: fit-content;
  background-color: rgb(245 154 30 / 10%);
  border-radius: 3px;
  font-size: 14px;
  color: #f59a1e;
  line-height: 24px;
}
.status_green {
  padding: 0 8px;
  width: fit-content;
  background-color: rgb(33 186 69 / 10%);
  border-radius: 3px;
  font-size: 14px;
  color: #21ba45;
  line-height: 24px;
}
.status_grey {
  padding: 0 8px;
  width: fit-content;
  background-color: #e3e3e3;
  border-radius: 3px;
  font-size: 14px;
  color: #b3b3b3;
  line-height: 24px;
}
.status_blue {
  padding: 0 8px;
  width: fit-content;
  background-color: rgb(102 166 255 / 10%);
  border-radius: 3px;
  font-size: 14px;
  color: #66a6ff;
  line-height: 24px;
}
/*藍色按鈕-大*/
.hushop_btn_big {
  border: none;
  border-radius: 5px;
  background-color: #66a6ff;
  color: #fff;
  font-size: 14px;
  line-height: 24px;
  padding: 12px;
  margin: 0;
  text-align: center;
  width: 200px;
  height: 48px;
}
.hushop_btn_big:hover {
  opacity: 0.8;
  color: #fff;
}
.hushop_btn_big:disabled {
  background-color: #e9e9e9;
  color: #b3b3b3;
}
/*藍色按鈕-中*/
.hushop_btn_md {
  border: none;
  border-radius: 5px;
  background-color: #66a6ff;
  color: #fff;
  font-size: 14px;
  line-height: 24px;
  padding: 8px 12px;
  text-align: center;
  width: 140px;
}
.hushop_btn_md:hover {
  opacity: 0.8;
  color: #fff;
}
.hushop_btn_md:disabled {
  background-color: #e9e9e9;
  color: #b3b3b3;
}
/*藍色按鈕-小*/
.hushop_btn_small {
  border: none;
  border-radius: 5px;
  background-color: #66a6ff;
  color: #fff;
  font-size: 14px;
  line-height: 24px;
  padding: 8px 12px;
  text-align: center;
  width: 100px;
}
.hushop_btn_small:hover {
  opacity: 0.8;
  color: #fff;
}
.hushop_btn_small:disabled {
  background-color: #e9e9e9;
  color: #b3b3b3;
}
/*白色按鈕*/
.hushop_btn_sub {
  border: solid 2px #f0f1f3;
  border-radius: 5px;
  background-color: #fff;
  color: var(--font-color2);
  font-size: 14px;
  line-height: 20px;
  padding: 12px;
  text-align: center;
  width: 200px;
  height: 48px;
}
.hushop_btn_sub:hover {
  background-color: #f3f3f3;
  color: var(--font-color2);
}
.hushop_btn_sub:disabled {
  background-color: #fff;
  color: #b3b3b3;
}
/*白色按鈕-小*/
.hushop_btn_sub_small {
  border: solid 2px #f0f1f3;
  border-radius: 5px;
  background-color: #fff;
  color: var(--font-color2);
  font-size: 14px;
  line-height: 20px;
  padding: 8px 12px;
  text-align: center;
  width: 100px;
}
.hushop_btn_sub_small:hover {
  background-color: #f3f3f3;
  color: var(--font-color2);
}
.hushop_btn_sub_small:disabled {
  background-color: #fff;
  color: #b3b3b3;
}
/*兩個按鈕並排*/
.two_btn {
  display: flex;
  justify-content: flex-end;
  margin-top: 0;
  margin-bottom: 0;
  margin-left: -12px;
  margin-right: -12px;
}
.two_btn > div {
  padding-left: 12px;
  padding-right: 12px;
}
.two_btn_dropdown {
  position: relative;
}
/*藍色按鈕下拉*/
.hushop_btn_big.dropdown-toggle {
  position: relative;
}
.hushop_btn_big.dropdown-toggle::after {
  content: url(../img/down2-white.svg);
  position: absolute;
  top: 10px;
  right: 12px;
  margin: 0;
  width: 24px;
  border: none;
}
.hushop_dropdown_list {
  margin-top: 4px !important;
  padding: 0;
  min-width: 100%;
  border: none;
  box-shadow: 0 3px 6px rgb(0 0 0 / 16%);
  border-radius: 5px;
  overflow: hidden;
  font-size: 14px;
}
.hushop_dropdown_list .dropdown-item {
  color: var(--font-color2);
  line-height: 36px;
  padding: 0 21px;
}
.hushop_dropdown_list .dropdown-item:focus,
.hushop_dropdown_list .dropdown-item:hover,
.hushop_dropdown_list .dropdown-item:active {
  background-color: #f3f3f3;
}
/*關閉按鈕*/
.hushop_close_btn {
  box-sizing: content-box;
  width: 13px;
  height: 13px;
  padding: 0;
  /* background: url(../img/x-black.svg); */
  border: 0;
  border-radius: 0;
}
/*純文字按鈕*/
.hushop_txt_btn {
  color: #3981e6;
  padding: 0;
  border: none;
  background-color: transparent;
}
/*checkbox*/
.form-check {
  display: flex;
  /*height: 20px;*/
  min-height: auto;
  margin-bottom: 0;
}
.hushop_check {
  margin-top: 0px;
  background-color: #fff;
  border: solid 2px #f0f1f3;
  border-radius: 2px !important;
  width: 20px;
  min-width: 20px;
  height: 20px;
  background-size: 12px;
}
.hushop_check:active {
  filter: none;
}
.hushop_check:focus {
  border: solid 2px #f0f1f3;
}
.hushop_check:checked {
  border: solid 2px #66a6ff;
  background-color: #66a6ff;
  background-image: url(../img/checked.svg) !important;
}
.hushop_check:disabled {
  border: solid 2px #e3e3e3;
  background-color: #e3e3e3;
  opacity: 1;
}
.hushop_check ~ label {
  font-size: 16px;
  color: var(--font-color2);
  padding-left: 16px;
  line-height: 20px;
}
.hushop_check:disabled ~ .form-check-label,
.hushop_check[disabled] ~ .form-check-label {
  opacity: 1;
}
/*checkbox-多個*/
.form_check_group .form-check {
  display: inline-flex;
  margin-bottom: 8px;
  margin-right: 86px;
}
.form_check_group + hr {
  margin-top: 24px;
  margin-bottom: 32px;
  background-color: #e3e3e3;
  opacity: 1;
}
.form_check_group .form-check-lv1 {
  width: 100%;
}
/*checkbox-帶下拉且可增加行數*/
.form_check_group .form_check_takeinput {
  display: flex;
  flex-wrap: wrap;
  margin-right: 0;
  margin-right: 0;
}
.form_check_takeinput .hushop_check {
  margin-top: 10px;
  margin-bottom: 10px;
}
.form_check_takeinput label {
  word-break: keep-all;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-right: 12px;
}
.form_check_takeinput .form_check_input_group {
  margin-left: 12px;
  flex: 1;
}
.hushop_form_control_row
  .form_check_group
  .form_check_takeinput
  + .form_check_takeinput {
  margin-top: 24px;
}
.form_check_input_group {
  margin-left: 24px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.form_check_input_group > input {
  width: 100px;
}
.hour_add_btn {
  background-image: url(../img/plus-white.svg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 20px;
  width: 36px;
  height: 36px;
  margin-left: 16px;
  background-color: #66a6ff;
  border-radius: 3px;
}
.hour_close_btn {
  background-image: url(../img/minus-white.svg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 20px;
  width: 36px;
  height: 36px;
  margin-left: 16px;
  background-color: #66a6ff;
  border-radius: 3px;
}
.hour_row_1,
.hour_row_2 {
  width: 100%;
  display: flex;
  align-items: center;
}
.hour_row_2 {
  margin-top: 8px;
  display: none;
}
.hour_row_2.show {
  display: flex;
}
/*Radio*/
.hushop_radio {
  width: 20px;
  height: 20px;
  margin-top: 0px;
  border: solid 2px #f0f1f3;
}
.hushop_chhushop_radioeck:active {
  filter: none;
}
.hushop_radio:focus {
  border: solid 2px #f0f1f3;
}
.hushop_radio:checked {
  border: solid 2px #66a6ff;
  background-color: #66a6ff;
  background-size: 20px;
}
.hushop_radio:disabled {
  border: solid 2px #e9e9e9;
  background-color: #e9e9e9;
  opacity: 1;
}
.hushop_radio ~ label {
  font-size: 16px;
  color: var(--font-color2);
  padding-left: 16px;
  line-height: 20px;
}
.form_radio_group .form-check {
  display: inline-flex;
  margin-bottom: 8px;
  margin-right: 86px;
}
.form_radio_group.oneitemarow .form-check {
  width: 100%;
  margin: 0;
  min-height: 40px;
}
.form_check_second {
  padding-left: 20px;
  margin-top: 16px;
  display: none;
}
.form_check_second.show {
  display: block;
}
/*switch*/
.hushop_switc {
  margin-left: 16px;
}
.hushop_switc .form-check-input {
  height: 20px;
  width: 40px;
  margin-top: 0;
}
.hushop_switc .form-check-input:focus {
  background-image: url(../img/circle-solid.svg);
  border: 1px solid rgba(0, 0, 0, 0.25);
}
.hushop_switc .form-check-input:checked {
  background-color: #66a6ff;
  border-color: #66a6ff;
}
.hushop_switc .form-check-input:checked:focus {
  background-image: url(../img/circle-white.svg);
}
.hushop_switc > label {
  font-size: 16px;
  color: var(--font-color2);
  margin-left: 16px;
  line-height: 20px;
}
.hushop_switc .form-check-input + label::before {
  content: "下架";
}
.hushop_switc .form-check-input:checked:checked + label::before {
  content: "上架";
}
/*彈窗*/
.hushop_modal .modal-content {
  border: none;
  border-radius: 5px;
  overflow: hidden;
}
.hushop_modal .modal-body {
  padding: 0;
}
.hushop_modal .modal-body .content_txt {
  padding-bottom: 48px;
  text-align: justify;
  line-height: 1.6;
}
.hushop_modal_close_btn {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
}
.hushop_modal_close_btn > button {
  width: 62px;
  height: 62px;
  background-size: 13px;
  background-repeat: no-repeat;
  background-position: center;
}
/*有標題的彈窗*/
.hushop_modal_complete .modal-header {
  display: flex;
  padding: 32px 48px;
  font-size: 20px;
  border: none;
}
.hushop_modal_complete .modal-header .modal_header_link {
  display: flex;
  justify-content: flex-end;
  font-size: 14px;
}
.hushop_modal_complete .modal-body {
  padding: 0px 48px;
}
.hushop_modal_complete .modal-footer {
  padding: 0 48px 32px 48px;
  border: none;
}
.hushop_modal_complete .modal-footer .two_btn {
  margin: 0;
  padding: 0;
  margin-left: -12px;
  margin-right: -12px;
}
.hushop_modal_complete .two_btn button,
.hushop_modal_complete .two_btn a {
  width: 140px;
}
.hushop_modal_complete .hushop_check ~ label {
  color: #333;
}
.hushop_modal_complete .page_list {
  margin-bottom: 48px;
}
/*簡單的彈窗*/
.hushop_modal_simple section,
.hushop_modal_simple .content {
  padding: 72px 0;
  text-align: center;
  font-size: 20px;
}
.hushop_modal_simple .modal-footer {
  margin: 0;
  padding: 0;
  border: none;
}
.modal_footer_btn {
  margin-top: 0;
  margin-bottom: 0;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 32px;
}
.modal-footer .two_btn {
  margin-top: 0;
  margin-bottom: 0;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 32px;
}
/*裁切圖片*/
.hushop_choose_pic_box {
  position: relative;
  width: 100%;
  min-height: 50px;
  border: solid 1px #f0f1f3;
  overflow: hidden;
}
.hushop_choose_pic {
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
.hushop_choose_pic_btn {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  font-size: 16px;
}
.cancel_choose_pic {
  position: absolute;
  align-items: center;
  justify-content: center;
  padding: 0;
  top: 8px;
  right: 8px;
  width: 28px;
  height: 28px;
  border-radius: 2px;
  background-color: #fff;
  box-shadow: 0 0 3px rgb(0 0 0 / 16%);
  opacity: 0.9;
  display: none;
}
.cancel_choose_pic img {
  width: 13px;
}
.cancel_choose_pic:hover {
  opacity: 1;
}
.hushop_choose_pic_box.chosen_pic .hushop_choose_pic_btn {
  display: none;
}
.hushop_choose_pic_box.chosen_pic .cancel_choose_pic {
  display: flex;
}
.upload_img_tip {
  text-align: center;
  margin-bottom: 8px;
}
.upload_img_box {
  text-align: center;
}
.upload_img_box .hushop_btn_big span::before {
  content: "選擇圖檔";
}
.reupload_img .hushop_btn_big {
  padding: 0;
  background-color: transparent;
  height: 24px;
  color: var(--main-color);
  margin-bottom: 8px;
}
.reupload_img .hushop_btn_big span::before {
  content: "重新選擇圖檔";
}
.cut_img_box {
  text-align: center;
}
/*儀表板*/
.board-con {
  padding: 0px 13px;
}

.dashboard_style {
  box-shadow: 0 0px 3px rgb(0 0 0 / 16%);
  border-radius: 5px;
  background-color: #fff;
  overflow: hidden;
}
.dashboard_header {
  padding: 16px 24px;
  border-bottom: solid 1px #e3e3e3;
  line-height: 1.3;
}
.dashboard_title > span {
  font-size: 14px;
  color: #b3b3b3;
  margin-left: 16px;
}
.dashboard_edit_btn {
  text-align: right;
}
.dashboard_edit_btn a {
  width: 14px;
  height: 14px;
  display: inline-flex;
}
.dashboard_edit_btn > div {
  margin-left: auto;
  margin-right: 0;
  margin-top: -2px;
  margin-bottom: -1px;
}
/*搜尋列*/
.search_box {
  display: flex;
  padding-bottom: 16px;
  margin-right: -16px;
}
.search_box_item {
  margin-bottom: 8px;
}
.searchway {
  display: none;
  width: 100%;
  max-width: 300px;
}
.searchway.active {
  display: block;
}
.search_box_item {
  margin-right: 16px;
}
.hushop_search_dropdown > button,
.hushop_search_dropdown {
  min-width: 140px;
}
.hushop_search_input_group {
  position: relative;
  padding: 8px 12px 7px 16px;
  width: 300px;
  height: 40px;
  border: solid 2px #f0f1f3;
  border-radius: 5px;
  background-color: #fff;
  box-shadow: none;
  transition:
    border-color 0.15s ease-in-out,
    box-shadow 0.15s ease-in-out;
}
.hushop_search_input_group:hover {
  border: solid 1px #d3d3d3;
  padding: 9px 13px 8px 17px;
}
.hushop_search_input,
.hushop_search_input:focus {
  border: none;
  padding: 0;
  font-size: 14px;
  color: #333333;
}
.hushop_search_btn {
  padding: 0;
  position: absolute;
  right: 16px;
  top: 5px;
}
.hushop_search_input_group:hover .hushop_search_btn {
  right: 17px;
  top: 6px;
}
.searchway .hushop_dropdown {
  min-width: 300px;
}
.searchway .hushop_dropdown > button {
  width: 100%;
}
/*小分頁*/
.tab_window {
  margin-bottom: 16px;
}
.tab_search .tab_window {
  margin-bottom: 20px;
}
.tab_window .navbar-nav {
  flex-direction: row;
}
.tab_window .nav-item:not(:last-child) {
  margin-right: 48px;
}
.tab_window .nav-link {
  padding: 0;
  margin-bottom: 8px;
  font-size: 14px;
  color: var(--font-color2);
  cursor: pointer;
  line-height: 1;
}
.tab_window .nav-link span {
  font-size: 12px;
}
.tab_window .nav-link.active,
.tab_window .nav-link:hover {
  color: #3981e6;
}
.tab_window .nav-link.warning {
  color: #db2828;
}
/*小分頁和搜尋列都有*/
.tab_search .search_box {
  justify-content: flex-end;
  margin-top: -14px;
}
/*沒有項目時頁面樣式*/
.vacancy_page {
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 15%;
}
.vacancy_page_content {
  text-align: center;
}
.vacancy_page_content > img {
  width: 80px;
  margin-bottom: 24px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.vacancy_page_content h5 {
  margin-bottom: 8px;
}
.vacancy_page_content > p {
  margin-bottom: 20px;
  font-size: 14px;
  color: #666;
  text-align: center;
}
/*表單row*/
.hushop_form_title {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 48px;
}
.hushop_form_title_c {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 48px;
  text-align: center;
}
.hushop_form_control_row {
  margin-bottom: 24px;
}
.hushop_form_control_row .form-label {
  color: var(--font-color2);
  margin-bottom: 16px;
}
.hushop_form_control_row .form_check_group {
  margin-bottom: 4px;
  margin-left: 20px;
}
.hushop_form_control_row .form_check_group .form-check {
  margin-top: 8px;
  margin-bottom: 0;
}
.hushop_form_control_row .form_radio_group {
  margin-bottom: 4px;
  margin-left: 20px;
}
.hushop_form_control_row .form_radio_group .form-check {
  margin-top: 8px;
  margin-bottom: 0;
  align-items: center;
}
.hushop_form_control_row .form_radio_group.oneitemarow .form-check {
  margin-top: 0;
  flex-wrap: wrap;
}
.hushop_form_control_row > .input-group + .input-group {
  margin-top: 24px;
}
.hushop_form_control_txt {
  line-height: 40px;
}
.hushop_form_dropdown,
.hushop_form_dropdown > button,
.hushop_form_control_row .hushop_select {
  width: 200px;
}
.hushop_form_dropdown > button {
  width: 100%;
}
.hushop_form_control_row input[type="date"] {
  max-width: 200px;
}
.tip_icon {
  margin-left: 4px;
  display: inline-flex;
}
.tip_icon .btn {
  padding: 0;
  color: var(--font-color2);
}
.tip_icon .btn:focus {
  box-shadow: none;
}
.popover {
  font-size: 14px;
  border: 1px solid #d3d3d3;
  border-radius: 3px;
  max-width: 200px;
}
.popover-body {
  color: #333;
  padding: 12px 16px;
}
.bs-popover-auto[data-popper-placement^="right"] > .popover-arrow,
.bs-popover-end > .popover-arrow {
  top: -5px !important;
}
.form_input_group {
  max-width: 731px;
}
.form_input_group + .form_input_group {
  margin-top: 8px;
}
.form_input_group .d-flex {
  margin-bottom: -8px;
}
.cate-list.form_input_group .d-flex {
  margin-bottom: 0px;
}
.form_input_group .d-flex > .form_input_group_item:not(:last-child) {
  margin-right: 16px;
}
.form_input_group_item {
  margin-bottom: 8px;
  width: 200px;
}
.form_input_group_item:last-child {
  width: 100%;
  flex: 1;
}
.form_input_group .d-flex + .form_input_group_item {
  margin-top: 8px;
}
.hushop_form_control_row > .d-flex {
  align-items: center;
}
.side_label {
  margin-left: 48px;
  margin-bottom: 16px;
}
.control_row_input_group > div:not(:last-child) {
  margin-right: 16px;
}
.add_sort_btn {
  display: inline-block;
  margin-left: 48px;
  margin-top: -8px;
  margin-bottom: 16px;
}
.form_itme_Remark {
  margin-top: 8px;
  margin-left: 16px;
  font-size: 14px;
}
/*表單內的關聯下拉*/
.form_dropdown_associate {
  margin-bottom: 8px;
}
.dropdown_associate_item {
  display: none;
  margin-bottom: 8px;
  margin-left: 24px;
}
.dropdown_associate_item input {
  min-width: 200px;
}
.dropdown_associate_item.active {
  display: block;
}
.dropdown_associate_item .data_validate::after {
  padding: 0;
}
/*表單內的table*/
.form_dashboard {
  border: solid 2px #f0f1f3;
  border-radius: 5px;
  overflow: hidden;
}
.form_list {
  width: 100%;
  font-size: 14px;
}
.form_dashboard .form_list_header {
  border-bottom: solid 1px #e3e3e3;
}
.form_list th {
  padding: 16px;
  text-align: center;
  vertical-align: middle;
  font-weight: 400;
}
.form_list td {
  padding: 8px 16px;
  text-align: center;
  vertical-align: middle;
  font-weight: 400;
}
.form_list > tbody > tr:nth-child(2) > td {
  padding: 16px 16px 8px 16px;
}
.form_list > tbody > tr:last-child > td {
  padding: 8px 16px 16px 16px;
}
/*拖曳型列表*/
.form_list_box {
  overflow-x: auto;
}
.drap_list_header {
  display: flex;
  align-items: center;
}
.drap_list_header > div:not(:empty) {
  padding: 16px;
}
.drap_list_item {
  display: flex;
  align-items: center;
  border-top: solid 1px #e3e3e3;
}
.drap_list_item:not([class*="hushop_list_checked"]):hover {
  background-color: #fcfcfc;
}
.drap_list_item > div:not(:empty) {
  padding: 16px;
}
.drap_list_item > div > div {
  margin-left: auto;
  margin-right: auto;
}
.list_con {
  flex: 1;
  display: flex;
  justify-content: flex-end;
  font-size: 16px;
}
/*拖曳時效果*/
.sortable-chosen {
  box-shadow: 0 3px 6px -3px rgba(102, 166, 255, 0.27);
  -webkit-box-shadow: 0 3px 6px -3px rgba(102, 166, 255, 0.27);
  -moz-box-shadow: 0 3px 6px -3px rgba(102, 166, 255, 0.27);
  border-bottom: 1px solid #9dd7ff;
}
/*table內的輸入框*/
.hushop_input_fortable {
  padding: 0 16px;
  font-size: 14px;
  line-height: 24px;
  border-radius: 0;
  border: solid 2px #f0f1f3;
  background-color: #fff;
  margin-left: auto;
  margin-right: auto;
  width: 100px;
}
.hushop_input_fortable:focus,
.hushop_input_fortable:hover {
  border: solid 1px #d3d3d3;
  padding: 1px 17px;
}
/*小select*/
.hushop_select_fortable {
  padding: 0 32px 0 16px;
  font-size: 14px;
  line-height: 24px;
  border-radius: 0;
  border: solid 2px #f0f1f3;
  background-color: #fff;
  /*移除箭頭樣式*/
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  /*改變右邊箭頭樣式*/
  background-image: url("../img/down2.svg");
  background-repeat: no-repeat;
  background-size: 24px;
  background-position-y: center;
  background-position-x: calc(100% - 8px);
}
.hushop_select_fortable:focus,
.hushop_select_fortable:hover {
  border: solid 1px #d3d3d3;
  padding: 1px 33px 1px 17px;
  background-position-x: calc(100% - 9px);
}
/*單行輸入框*/
.hushop_input_txt,
.hushop_input_txt[readonly] {
  border: solid 2px #f0f1f3;
  color: #333333;
  height: 40px;
  line-height: 20px;
  padding: 0 16px;
  max-width: 731px;
  border-radius: 5px;
  background-color: #ffffff;
}
.hushop_input_txt:disabled,
.hushop_input_txt:disabled:hover {
  background-color: #e9e9e9;
  border: 0;
  padding: 2px 18px;
  color: #b3b3b3;
}
.data_validate .hushop_input_txt,
.data_validate .hushop_count_input_txt {
  border: solid 1px #db2828;
  padding: 1px 17px;
}
.data_validate::after {
  display: block;
  margin-left: 16px;
  padding-top: 8px;
  content: attr(data-validate);
  font-size: 14px;
  color: #db2828;
}
.hushop_input_txt:focus,
.hushop_input_txt:hover {
  border: solid 1px #d3d3d3;
  padding: 1px 17px;
}
.hushop_input_txt.w-200 {
  max-width: 200px;
}
/*算字數的單行輸入框*/
.hushop_count_input_group {
  position: relative;
  align-items: center;
  max-width: 731px;
}
.hushop_count_input_txt {
  border: solid 2px #f0f1f3;
  color: #333333;
  height: 40px;
  line-height: 40px;
  padding: 0 37px 0 16px;
  border-radius: 5px;
}
.hushop_count_input_txt:focus,
.hushop_count_input_txt:hover {
  border: solid 1px #d3d3d3;
  padding: 1px 37px 1px 17px;
}
.hushop_count_input_num {
  position: absolute;
  right: 16px;
  font-size: 12px;
  color: #b3b3b3;
  background-color: #fff;
}
/*後面有按鈕的輸入框*/
.input-group {
  flex-wrap: nowrap;
  align-items: center;
}
.input-group .hushop_count_input_group {
  flex: 1;
  margin-right: -2px;
}
.input-group .input_group_input {
  flex: 1;
  max-width: 731px;
}
.input-group .hushop_dropdown {
  flex: 1;
  max-width: 731px;
}
.input-group .hushop_dropdown > * {
  width: 100%;
}
.input-group .form-check {
  margin-left: 24px !important;
  align-items: center;
}
/*多行輸入框*/
.hushop_input_textarea {
  border: solid 2px #f0f1f3;
  color: #333333;
  padding: 8px 16px;
  border-radius: 5px;
  line-height: 1.5;
}
.hushop_input_textarea.form-control {
  min-height: 80px;
}
.hushop_input_textarea:focus,
.hushop_input_textarea:hover {
  border: solid 1px #d3d3d3;
  padding: 9px 17px;
  box-shadow: none;
}
.data_validate .hushop_input_textarea {
  border: solid 1px #db2828;
  padding: 9px 17px;
}
/*算字數的單行輸入框-數字在框外*/
.hushop_count_input_group.count_2row {
  max-width: none;
}
.hushop_count_input_group.count_2row .hushop_count_input_num {
  position: inherit;
  right: 0;
  text-align: right;
  padding-top: 8px;
  background-color: transparent;
}
.hushop_count_input_group.count_2row .data_validate + .hushop_count_input_num {
  padding-bottom: 29px;
}
.hushop_count_input_group.count_2row .data_validate::after {
  margin-bottom: -29px;
}
/*有單位的輸入框*/
.hushop_unit_input_group {
  position: relative;
  align-items: center;
  width: 100%;
  max-width: 731px;
}
.hushop_input_unit_txt {
  border: solid 2px #f0f1f3;
  color: #333333;
  height: 40px;
  line-height: 40px;
  padding: 0 37px 0 16px;
  border-radius: 5px;
}
.hushop_input_unit_txt:focus,
.hushop_input_unit_txt:hover {
  border: solid 1px #d3d3d3;
  padding: 1px 37px 1px 17px;
}
.hushop_input_unit_txt:disabled {
  border: 0;
  padding: 0 37px 0 16px;
}
.hushop_input_unit {
  position: absolute;
  right: 16px;
  font-size: 16px;
  color: #333333;
}
/*日期區間輸入框*/
.betweeninput {
  color: #d3d3d3;
  line-height: 40px;
  margin-left: 8px;
  margin-right: 8px;
}
.during .hushop_input_txt {
  max-width: calc(50% - 12px);
}
.during .hushop_dropdown {
  max-width: calc(50% - 8px);
  min-width: auto;
  width: 100%;
}
.during .hushop_dropdown + .hushop_dropdown {
  margin-left: 16px;
}
input[type="date"]::-webkit-datetime-edit {
  color: #333;
  font-size: 14px;
}
input[type="date"]::-webkit-calendar-picker-indicator {
  display: inline-block;
  width: 14px;
  height: 14px;
  margin: 0;
  padding: 0;
}
/*密碼輸入框*/
.password_input {
  position: relative;
  max-width: 731px;
}
.password_eye {
  position: absolute;
  right: 16px;
  top: 0;
  padding: 7px 0;
  height: 100%;
  cursor: pointer;
}
.password_eye img {
  width: 20px;
  opacity: 0.75;
}
.password_eye:hover img {
  opacity: 1;
}
.password_input .eye_open {
  display: none;
}
.password_input.open .eye_open {
  display: initial;
}
.password_input.open .eye_close {
  display: none;
}
/*下拉*/
.hushop_dropdown > button {
  position: relative;
  padding: 8px 12px 7px 16px;
  text-align: left;
  font-size: 14px;
  color: #333333;
  border: solid 2px #f0f1f3;
  border-radius: 5px;
  background-color: #fff;
  box-shadow: none;
}
.hushop_dropdown .dropdown-toggle::after {
  content: url(../img/down2.svg);
  position: absolute;
  top: 6px;
  right: 10px;
  margin: 0;
  width: 24px;
  border: none;
}
.hushop_dropdown .dropdown-menu {
  margin-top: 4px !important;
  margin-bottom: 4px !important;
  padding: 0;
  min-width: 100%;
  border: none;
  box-shadow: 0 3px 6px rgb(0 0 0 / 16%);
  border-radius: 5px;
  overflow: hidden;
  font-size: 14px;
}
.hushop_dropdown .dropdown-item {
  color: var(--font-color2);
  line-height: 36px;
  padding: 0 21px;
}
.hushop_dropdown .dropdown-item:focus,
.hushop_dropdown .dropdown-item:hover,
.hushop_dropdown .dropdown-item:active {
  background-color: #f3f3f3;
}
/*下拉.真select*/
.hushop_select {
  padding: 8px 32px 7px 16px;
  font-size: 14px;
  text-align: left;
  color: #333333;
  border: solid 2px #f0f1f3;
  border-radius: 5px;
  background-color: #fff;
  box-shadow: none;
  /*移除箭頭樣式*/
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  /*改變右邊箭頭樣式*/
  background-image: url("../img/down2.svg");
  background-repeat: no-repeat;
  background-size: 24px;
  background-position-y: center;
  background-position-x: calc(100% - 8px);
  width: 100%;
  transition:
    border-color 0.15s ease-in-out,
    box-shadow 0.15s ease-in-out;
}
.hushop_select:hover {
  border: solid 1px #d3d3d3;
  padding: 9px 33px 8px 17px;
  background-position-x: calc(100% - 9px);
}
.hushop_select:disabled {
  background-color: #e9e9e9;
  border: 0;
  padding: 10px 34px 9px 18px;
  color: #b3b3b3;
  background-position-x: calc(100% - 10px);
}
.hushop_select::-ms-expand {
  display: none;
}
.hushop_select:focus {
  border-color: #f0f1f3;
}
/*台灣縣市區域下拉*/
.hushop_cityselect select {
  padding: 8px 12px 7px 16px;
  font-size: 14px;
  text-align: left;
  color: #333333;
  border: solid 2px #f0f1f3;
  border-radius: 5px;
  background-color: #fff;
  box-shadow: none;
  /*移除箭頭樣式*/
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  /*改變右邊箭頭樣式*/
  background-image: url("../img/down2.svg");
  background-repeat: no-repeat;
  background-size: 24px;
  background-position-y: center;
  background-position-x: calc(100% - 8px);
  width: 200px;
  margin-bottom: 8px;
}
.hushop_cityselect select:not(:last-child) {
  margin-right: 16px;
}
.hushop_cityselect select:disabled {
  background-color: #e9e9e9;
  border: 0;
  padding: 10px 14px 9px 18px;
  color: #b3b3b3;
  background-position-x: calc(100% - 14px);
  opacity: 1;
}
/*編輯器*/
.hushop_editor + .ck-editor .ck-content {
  font-size: 16px;
  color: #333;
}
.hushop_editor + .ck-editor .ck-content p {
  line-height: 1.8;
  letter-spacing: 0.9px;
  text-align: justify;
}
.hushop_editor + .ck-editor .ck-content h3 {
  color: #eab52a;
  text-align: center;
  font-weight: 600;
  font-size: 28px;
  letter-spacing: 1px;
}
.hushop_editor + .ck-editor .ck-content h4 {
  color: #eab52a;
  text-align: center;
  font-weight: 600;
  font-size: 20px;
  letter-spacing: 1px;
}
.hushop_editor + .ck-editor .ck-content img,
.hushop_editor + .ck-editor .ck-content figure {
  width: 100%;
  max-width: 700px;
}
.hushop_editor + .ck-editor .ck-content blockquote {
  background-color: rgba(234, 181, 42, 0.05);
  padding: 16px;
  border-left: 4px solid #eab52a;
  font-style: initial;
  color: #323a3f;
}
.hushop_editor + .ck-editor .ck-content a {
  color: #eab52a;
}
.hushop_editor + .ck-editor .ck-content a:hover {
  font-weight: 600;
}
/*列表*/
.hushop_list {
  width: 100%;
  font-size: 14px;
  border-radius: 0 0 5px 5px;
  overflow: hidden;
}
.hushop_list
  > tbody
  > tr:not([class="hushop_list_header"]):not(
    [class*="hushop_list_checked"]
  ):hover {
  background-color: #fcfcfc;
}
.hushop_list > tbody > tr:not(:last-child),
.hushop_list > thead > tr {
  border-bottom: solid 1px #e3e3e3;
}
.hushop_list th,
.hushop_list td {
  padding: 16px;
  vertical-align: middle;
  font-weight: 400;
}
.hushop_list_checked {
  background-color: rgba(102, 166, 255, 0.2);
}
.hushop_list_toggle {
  justify-content: center;
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
}
.hushop_list_toggle > li {
  display: inline-block;
  cursor: pointer;
}
.hushop_list_toggle > li:not(:last-child) {
  padding-right: 16px;
}
.hushop_list_sort {
  display: flex;
  align-items: center;
  justify-content: center;
}
.hushop_list_sort_btn {
  margin-left: 8px;
  width: 16px;
  padding: 0;
}
.hushop_list_box {
  overflow-x: auto;
}
.hushop_list_date,
.hushop_list_time {
  display: block;
  line-height: 1.4;
}
.form_operate {
  justify-content: center;
  width: 100px;
  margin-left: auto;
  margin-right: auto;
}
.hushop_list .hushop_btn_small {
  padding: 4px 8px;
  width: 80px;
}
.hushop_list .hushop_btn_sub_small {
  padding: 4px 8px;
  width: 80px;
}
.toggle_modal_title {
  font-size: 20px;
  padding: 32px 0;
}
.list_toggle_list {
  list-style: none;
  padding: 0 24px;
  margin: 0;
}
.list_toggle_list .dropdown-item {
  padding: 0;
  height: 52px;
}
.list_toggle_list > li {
  line-height: 36px;
  font-size: 14px;
}
.list_toggle_list > li {
  border-bottom: solid 1px #e3e3e3;
}
.list_toggle_list > li .dropdown-item:active {
  color: #1e2125;
  background-color: #f8f9fa;
}
.list_toggle_list > li img {
  width: 17px;
}
.list_toggle_list .page_sidebar_nav_icon {
  width: auto;
  margin-right: 20px;
}
.list_function_right {
  padding-bottom: 16px;
}
.list_function_right .list_function_item {
  padding-bottom: 8px;
}
.list_function_right .input-group {
  justify-content: flex-end;
}
.list_function_item .hushop_input_txt {
  width: 100%;
  max-width: 400px;
  flex: 1;
}
.list_function_item .hushop_btn_small {
  word-break: keep-all;
  min-width: 140px;
}
/*列表功能icon*/
.hushop_list_toggle_btn {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  height: 20px;
  width: 20px;
  opacity: 0.75;
  font-size: 17px;
}
.hushop_list_toggle_btn:hover {
  opacity: 1;
}
.hushop_list_toggle_btn > img {
  max-width: 100%;
  max-height: 100%;
}
.hushop_list_toggle_shrink_td {
  display: none;
}
.hushop_list_toggle_shrink {
  margin-left: auto;
  margin-right: auto;
  width: fit-content;
}
/*列表分頁*/
.page_list {
  display: flex;
  justify-content: center;
  margin-top: 32px;
  margin-bottom: 80px;
}
.page_list .pagination {
  margin-left: -4px;
  margin-right: -4px;
  margin-bottom: 0;
}
.page-link {
  font-size: 14px;
  color: var(--font-color2);
}
.page_list .page-link {
  padding: 9px 12px 8px 12px;
  margin: 0 4px;
  min-width: 42px;
  text-align: center;
  border: solid 1px var(--ban-color);
  border-radius: 5px;
  background-color: transparent;
}
.page-item:not(:first-child) .page-link {
  margin: 0 4px;
}
.page_list .page-item:hover .page-link {
  color: var(--main-color);
  background-color: rgba(255, 255, 255, 0.6);
}
.page_list .page-link:focus {
  box-shadow: none;
}
.page_list .page-item.active .page-link,
.page_list .page-item.active:hover .page-link {
  color: #fff;
  background-color: var(--main-color);
  border: solid 1px var(--main-color);
}
.page_list .page-item.disabled .page-link {
  color: var(--font-ban);
  background-color: transparent;
}
.page_list .page-item.ellipsis .page-link {
  border: none;
  pointer-events: none;
  color: var(--font-ban);
}
.page_list .page-item.ellipsis:hover .page-link {
  background-color: transparent;
  color: var(--font-ban);
}
/*列表分頁顯示筆數*/
.show_count {
  margin-left: 48px;
  margin-right: -156px;
}
.show_count_dropdown > button,
.show_count .hushop_select {
  width: 108px;
}
.show_count_dropdown .dropdown-toggle::after {
  right: 8px;
}
/*有框線的table樣式*/
.table_border_style {
  width: 100%;
}
.table_border_style,
.table_border_style th,
.table_border_style td {
  font-size: 14px;
  vertical-align: middle;
  border: 1px solid #f0f1f3;
  border-collapse: collapse;
}
.table_border_style td {
  padding: 16px;
}
.table_border_style th {
  padding: 16px;
  font-size: 16px;
  font-weight: 500;
}
.table_border_style .td_title {
  font-size: 16px;
  width: 140px;
  color: var(--font-color2);
}
.table_border_style .td_title .d-flex {
  align-items: center;
}
.table_edit_btn {
  width: 14px;
  height: 14px;
  display: inline-flex;
  margin-left: 8px;
}
.table_edit_btn > a,
.table_edit_btn > button {
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  display: flex;
}
.table_edit_btn img {
  width: 100%;
}
.under_table_btn {
  margin-top: 16px;
  text-align: right;
}
/*小列表*/
.data_item {
  padding: 16px 24px;
}
.data_title {
  margin-bottom: 8px;
  display: inline-flex;
  line-height: 1.3;
}
.data_content {
  font-size: 14px;
}
.data_content > span + span {
  margin-left: 8px;
}
.data_content_row + .data_content_row {
  margin-top: 8px;
}
.data_content_row > div:nth-child(2) {
  text-align: right;
}
/*全屏*/
#toggle_exitfullscreen_button {
  display: none;
}
html:-moz-full-screen #toggle_fullscreen_button {
  display: none;
}
html:-webkit-full-screen #toggle_fullscreen_button {
  display: none;
}
html:fullscreen #toggle_fullscreen_button {
  display: none;
}
html:-moz-full-screen #toggle_exitfullscreen_button {
  display: block;
}
html:-webkit-full-screen #toggle_exitfullscreen_button {
  display: block;
}
html:fullscreen #toggle_exitfullscreen_button {
  display: block;
}
/*header*/
.page_header {
  position: fixed;
  box-shadow: 0 2px 6px rgb(0 0 0 / 16%);
  width: 100%;
  background-color: #fff;
  z-index: 1000;
}
.header_box {
  display: flex;
}
.mobile_header_navbar,
.mobile_member_toggle {
  display: none;
}
.logo_box {
  padding-top: 20px;
  padding-bottom: 16px;
  width: 225px;
  text-align: center;
}
.logo_box img {
  height: 40px;
}
.logo_box img[src*="logo-collapsed.svg"] {
  display: none;
}
.under_page_header {
  height: 80px;
}
/*左側欄收窄時的logo*/
.logo_box.collapsed {
  width: 64px;
  padding-left: 12px;
  padding-right: 12px;
  padding-top: 20px;
  padding-bottom: 20px;
}
.logo_box.collapsed img[src*="logo.svg"] {
  display: none;
}
.logo_box.collapsed img[src*="logo-collapsed.svg"] {
  display: block;
  width: 100%;
  height: 40px;
}
/*左側欄收窄時的logo end*/
.header_navbar {
  flex: 1;
}
.header_navbar .navbar {
  padding: 0;
}
.header_navbar .container-fluid {
  padding-left: 24px;
  padding-right: 28px;
}
.header_toggle {
  margin-left: -15px;
  margin-right: -15px;
}
.header_toggle > li > div {
  padding: 0 15px;
  height: 80px;
  line-height: 80px;
  cursor: pointer;
}
.member_toggle .dropdown-item {
  color: var(--font-color2);
  line-height: 36px;
  padding: 0 21px;
}
.member_toggle .dropdown-item:focus,
.member_toggle .dropdown-item:hover,
.member_toggle .dropdown-item:active {
  background-color: #f3f3f3;
  border-radius: 100px;
  color: #333;
}
.member_toggle .dropdown-item .page_sidebar_nav_link {
  padding: 8px 0;
  font-size: 14px;
  line-height: 16px;
}
.member_toggle .dropdown-item .page_sidebar_nav_icon {
  width: 16px;
  margin-right: 16px;
}
/*左側欄和main的外框*/
.page-content {
  display: flex;
  min-height: calc(100vh - 80px);
}
/*左側欄*/
.page_sidebar {
  width: 100%;
  max-width: 225px;
  height: 100vh;
  position: fixed;
  box-shadow: 0 0px 3px rgb(0 0 0 / 16%);
  z-index: 999;
  overflow-y: scroll;
  padding-bottom: 48px;
}
.page_sidebar_user {
  padding-top: 32px;
  padding-bottom: 32px;
  font-size: 14px;
  text-align: center;
}
.page_sidebar_shop_info {
  padding: 24px 20px 16px 20px;
  display: flex;
  border-bottom: 1px solid #efefef;
}
.page_sidebar_shop_photo {
  margin-left: auto;
  margin-right: auto;
  width: 56px;
}
.page_sidebar_shop_photo .bg {
  padding-bottom: 100%;
}
.page_sidebar_shop_txt {
  flex: 1;
  padding-left: 12px;
}
.page_sidebar_shop_name {
  font-size: 14px;
  margin-top: 6px;
}
.user_name {
  margin-bottom: 16px;
}
/*.page_sidebar_menu{
	margin-bottom: 84px;
}*/
.page_sidebar_menu .nav-link {
  display: block;
  padding: 0;
  height: 52px;
  width: 100%;
  color: #333333;
  font-size: 14px;
}
.page_sidebar_menu .nav-item.logout {
  display: none;
}
.page_sidebar_nav_link {
  display: flex;
  align-items: center;
  height: 100%;
}
.page_sidebar_nav_icon {
  /*	width:64px;*/
  width: 45px;
  margin-left: 6px;
  text-align: center;
  font-size: 16px;
}
.page_sidebar_nav_icon img {
  max-width: 16px;
}
.page_sidebar_second_btn {
  position: relative;
  cursor: pointer;
}
.page_sidebar_nav_arrow {
  position: absolute;
  right: 28px;
  top: calc(50% - 10px);
}
.page_sidebar_nav_arrow img {
  transition: transform 0.3s;
}
.page_sidebar_menu .nav-link.active,
.page_sidebar_menu .nav-link:hover {
  background: -moz-linear-gradient(
    left,
    rgba(102, 166, 255, 1) 0%,
    rgba(137, 247, 254, 0.21) 79%,
    rgba(137, 247, 254, 0) 100%
  ); /* FF3.6-15 */
  background: -webkit-linear-gradient(
    left,
    rgba(102, 166, 255, 1) 0%,
    rgba(137, 247, 254, 0.21) 79%,
    rgba(137, 247, 254, 0) 100%
  ); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(
    to right,
    rgba(102, 166, 255, 1) 0%,
    rgba(137, 247, 254, 0.21) 79%,
    rgba(137, 247, 254, 0) 100%
  ); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.page_sidebar_menu .nav-link.active::before,
.page_sidebar_menu .nav-link:hover::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  top: 0;
  left: 0;
  background-color: #fff;
}
.page_sidebar_second_btn.open .page_sidebar_nav_arrow img {
  transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
}
.page_sidebar_second_nav .navbar-nav {
  position: relative;
}

.page_sidebar_second_nav .navbar-nav::before {
  content: "";
  position: absolute;
  top: 0;
  left: 32px;
  width: 1px;
  height: 100%;
  background-color: #e3e3e3;
}

.page_sidebar_second_nav .nav-item a {
  display: block;
  color: #333333;
  font-size: 14px;
  padding-top: 13px;
  padding-bottom: 14px;
  padding-left: 51px;
  border-top: solid 1px #fff;
}

.page_sidebar_second_nav .nav-item a:hover,
.page_sidebar_second_nav .nav-item.active a {
  background-color: #f8f9fa;
  color: #66a6ff;
}

.page_sidebar_second_nav .nav-item.active a::before {
  content: "";
  position: absolute;
  top: 7px;
  left: -16px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: #66a6ff;
}
#mobile_nav {
  display: none;
}
#close_mobile_nav {
  display: none;
  position: fixed;
  top: 0;
  bottom: 0;
  width: 100%;
  right: -225px;
  z-index: 1;
}
.page_copyright {
  font-size: 14px;
  padding: 32px 24px;
  color: var(--font-color2);
  width: 100%;
  margin-bottom: 32px;
}
.call_attention {
  width: 4px;
  height: 4px;
  background-color: #db2828;
  border-radius: 50%;
  margin-left: 12px;
}
/*縮窄後的左側欄*/
.page_sidebar.collapsed {
  width: 64px;
}
.page_sidebar.collapsed .page_sidebar_user {
  display: none;
}
.page_sidebar.collapsed .page_sidebar_menu .nav-item {
  position: relative;
}
.page_sidebar.collapsed .page_sidebar_second_nav {
  display: block !important;
  position: absolute;
  left: 64px;
  top: 0px;
  padding-left: 12px;
  opacity: 0;
  z-index: -1;
}
.page_sidebar.collapsed .page_sidebar_second_nav .navbar-nav {
  background: #fff;
  box-shadow: 0 3px 6px rgb(0 0 0 / 16%);
  border-radius: 5px;
}
.page_sidebar.collapsed .page_sidebar_second_nav ul {
  width: 0;
  height: 0;
  overflow: hidden;
}
.page_sidebar.collapsed .page_sidebar_second_nav .navbar-nav {
  margin: 0;
  padding: 0;
}
.page_sidebar.collapsed .page_sidebar_second_nav .nav-item a {
  line-height: 36px;
  padding: 0 21px;
}
.page_sidebar.collapsed .page_sidebar_second_nav .nav-item:hover {
  background-color: #f3f3f3;
}
.page_sidebar.collapsed .page_sidebar_menu .nav-link span {
  display: none;
}
.page_sidebar.collapsed
  .nav-item:hover
  .page_sidebar_second_btn
  + .page_sidebar_second_nav {
  opacity: 1;
  z-index: 999;
  width: auto;
}
.page_sidebar.collapsed
  .nav-item:hover
  .page_sidebar_second_btn
  + .page_sidebar_second_nav
  ul {
  width: 150px;
  height: auto;
}
.page_sidebar.collapsed
  .nav-item:hover
  .page_sidebar_second_btn
  + .page_sidebar_second_nav
  .navbar-nav:before {
  position: absolute;
  top: 15px;
  left: 4px;
  right: auto;
  display: inline-block !important;
  border-top: 8px solid transparent;
  border-right: 8px solid #e5e9ec;
  border-bottom: 8px solid transparent;
  content: "";
}
.page_sidebar.collapsed
  .nav-item:hover
  .page_sidebar_second_btn
  + .page_sidebar_second_nav
  .navbar-nav:after {
  position: absolute;
  top: 16px;
  left: 5px;
  right: auto;
  display: inline-block !important;
  border-top: 7px solid transparent;
  border-right: 7px solid #fff;
  border-bottom: 7px solid transparent;
  content: "";
}
.page_sidebar.collapsed .page_copyright {
  display: none;
}
/*主要內容main*/
main {
  position: relative;
  background-color: #f8f9fa;
  width: 100%;
  max-width: calc(100% - 225px);
  padding: 32px 12px 64px 12px;
  margin-left: 225px;
}
main > .container-fluid {
  padding-left: 12px;
  padding-right: 12px;
}
main > .container-fluid > .row {
  margin-left: -12px;
  margin-right: -12px;
}
main > .container-fluid > .row > * {
  padding-left: 12px;
  padding-right: 12px;
}
.page_sidebar.collapsed ~ main {
  max-width: 100%;
}
/*麵包屑*/
.page_breadcrumb {
  font-size: 14px;
  max-width: 50%;
}
.page_breadcrumb.w-70 {
  max-width: 70%;
}
.page_breadcrumb .breadcrumb {
  margin-bottom: 16px;
}
.page_breadcrumb .breadcrumb-item a,
.page_breadcrumb .breadcrumb-item {
  color: var(--font-color2);
}
.breadcrumb-item:hover a,
.breadcrumb-item.active a {
  color: #333333;
}
.page_breadcrumb .breadcrumb-item + .breadcrumb-item {
  padding-left: 8px;
  max-width: 400px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
}
.page_breadcrumb .breadcrumb-item + .breadcrumb-item::before {
  content: ">";
  padding-right: 8px;
}
.breadcrumb-item:hover::before,
.breadcrumb-item.active::before {
  color: #333333;
}
/*頁面標題*/
.page_title {
  /*	margin-bottom:40px;*/
}
.page_title_variable {
  display: flex;
  align-items: flex-start;
}
.page_title h1 {
  font-size: 20px;
  line-height: 1.5;
  margin-bottom: 4px;
  display: inline-flex;
  text-align: justify;
}
.page_title h2 {
  font-size: 16px;
  margin-bottom: 16px;
  color: var(--font-color2);
}
.page_title h2 a {
  word-break: keep-all;
}
.page_title_pic {
  width: 32px;
  margin-right: 8px;
}
.pictxt_inline {
  display: flex;
  align-items: center;
  margin-bottom: 16px;
}
.pictxt_inline h2 {
  margin-bottom: 0;
}
.page_title_info {
  color: #b3b3b3;
  font-size: 14px;
  margin-top: -12px;
  margin-bottom: -25px;
}
.page_title_info > span:not(:last-child) {
  margin-right: 32px;
}
.mobile_back_page {
  display: none;
  margin-left: 4px;
  margin-right: 16px;
}
.mobile_back_page a {
  color: #333;
  font-size: 16px;
}
.edit_page_title {
  display: inline-flex;
  margin-left: 16px;
  margin-top: 4px;
}
.page_title .hushop_txt_btn {
  margin-top: -3px;
}
/*前往新增按鈕*/
.main_add_box {
  position: absolute;
  top: 32px;
  right: 24px;
  max-width: 60%;
}
.main_add_box.bottom {
  position: initial;
  max-width: 100%;
}
/*只有藍字的按鈕*/
.clean_btn {
  padding: 0;
  background-color: #fff;
  border: none;
  color: #3981e6;
}
/*欄位填寫錯誤提示*/
.error_mag {
  display: block;
  margin-left: 16px;
  padding-top: 8px;
  font-size: 14px;
  color: #db2828;
}
/*登入*/
.login_form_page {
  position: relative;
  background-color: #66a6ff;
  background-image: linear-gradient(135deg, #66a6ff 0%, #89f7fe 100%);
  height: 100%;
}
.login_form_bg {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}
.login_page_title {
  position: absolute;
  top: calc(50% - 96px);
  left: -64px;
  color: #fff;
  font-size: 96px;
  font-weight: 700;
  opacity: 0.6;
  -moz-transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  transform: rotate(-90deg);
  -webkit-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;
}
.login_form_box {
  width: 100%;
  max-width: 468px;
}
.login_circle1 {
  position: absolute;
  top: 9%;
  right: calc(50% - 234px - 92px);
  width: 250px;
  height: 250px;
  border-radius: 250px;
  background-color: #9dd7ff;
}
.login_circle2 {
  position: absolute;
  bottom: 14%;
  left: calc(50% - 234px - 92px);
  width: 250px;
  height: 250px;
  border-radius: 250px;
  background-color: #9dd7ff;
}
.login_form {
  position: relative;
  padding: 32px;
  background-color: #fff;
  border-radius: 5px;
  box-shadow: 0 3px 24px rgb(0 0 0 / 24%);
  z-index: 1;
}
.login_form .hushop_form_control_row {
  margin-bottom: 32px;
}
.login_img {
  text-align: center;
  margin-bottom: 24px;
}
.login_img img {
  height: 46px;
}
.login_title {
  text-align: center;
  margin-bottom: 48px;
  font-size: 24px;
}
.login_title + .error_mag {
  margin: -20px 0 16px 0;
  padding: 0;
  text-align: center;
}
.login_btn {
  text-align: right;
  margin-top: 72px;
}
.login_ip {
  position: relative;
  padding-top: 32px;
  text-align: center;
  font-size: 14px;
  color: #666666;
  z-index: 1;
}
.form_input_group.verification .d-flex > .form_input_group_item:first-child {
  flex: 1;
}
.form_input_group.verification .d-flex > .form_input_group_item:last-child {
  flex: initial;
}
.form_input_group.verification .d-flex > .form_input_group_item {
  width: auto;
}
.form_input_group.verification .data_validate::after {
  position: absolute;
}
.verification_code {
  width: 140px;
  height: 40px;
  border-radius: 5px;
  text-align: center;
  line-height: 40px;
  letter-spacing: 5px;
  background-color: #e3e3e3;
  color: #fff;
  font-style: italic;
  font-weight: 500;
  background-image: url(../img/verification-bg.png);
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;
}
.verification_btn {
  font-size: 14px;
  display: flex;
  align-items: center;
  height: 40px;
}
/*總覽*/
.overview_num {
  padding: 24px 12px;
  margin-bottom: 24px;
}
.overview_num_header {
  text-align: center;
  margin-bottom: 14px;
  color: var(--font-color);
}
.overview_num_body {
  text-align: center;
  font-size: 30px;
  color: #3981e6;
  line-height: 36px;
}
.overview_chart {
  margin-bottom: 24px;
}
.overview_chart_header {
  padding: 16px 24px;
  border-bottom: solid 1px #e3e3e3;
}
.overview_chart_select {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-top: -2px;
  margin-bottom: -2px;
}
.overview_chart_body {
  min-height: 250px;
  padding: 16px 24px 20px 24px;
}
/*爬蟲資料列表*/
.spider_list .hushop_list {
  min-width: 520px;
}
.spider_list .hushop_list > thead > tr > th:nth-child(1),
.spider_list .hushop_list > tbody > tr > td:nth-child(1) {
  padding-left: 40px;
  text-align: left;
  width: 100px;
}
.spider_list .hushop_list > thead > tr > th:nth-child(3),
.spider_list .hushop_list > tbody > tr > td:nth-child(3) {
  text-align: center;
  width: 12%;
}
.spider_list .hushop_list > tbody > tr > td:nth-child(3) > div {
  margin-left: auto;
  margin-right: auto;
}
.spider_list .hushop_list > thead > tr > th:nth-child(4),
.spider_list .hushop_list > tbody > tr > td:nth-child(4) {
  text-align: center;
  width: 12%;
}
.spider_list .hushop_list > tbody > tr > td:nth-child(4) > div {
  margin-left: auto;
  margin-right: auto;
}
.spider_list .hushop_list > thead > tr > th:nth-child(5),
.spider_list .hushop_list > tbody > tr > td:nth-child(5) {
  padding-right: 40px;
  width: 160px;
  text-align: center;
}
/*編輯爬蟲資料*/
.spider_form {
  padding: 32px 48px 16px 48px;
  margin-bottom: 16px;
}
.bill_img_box {
  max-width: 272px;
}
.bill_img_box .bg {
  padding-bottom: 150%;
}
.spider_form .ck-content {
  min-height: 500px;
}
.chose_item_box {
  display: flex;
  flex-wrap: wrap;
  margin-left: 20px;
  margin-right: 20px;
}
.chose_item {
  display: flex;
  margin-right: 8px;
  margin-bottom: 8px;
  padding: 0px 8px;
  font-size: 14px;
  background-color: #66a6ff;
  color: #fff;
  border-radius: 3px;
  line-height: 24px;
  min-width: fit-content;
}
.chose_item_btn {
  display: flex;
  margin-left: 8px;
}
.chose_item_btn > img {
  width: 8px;
}
.add_tag_box {
  display: flex;
  flex-wrap: wrap;
  margin-top: 8px;
  margin-bottom: -8px;
}
.addtag_item {
  display: flex;
  margin-right: 8px;
  margin-bottom: 8px;
  padding: 0px 8px;
  font-size: 14px;
  background-color: #66a6ff;
  color: #fff;
  border-radius: 3px;
  line-height: 24px;
  min-width: fit-content;
}
.choose_creation_bg {
  max-width: 500px;
}
.choose_creation_bg .hushop_choose_pic {
  padding-bottom: 62%;
}
#creation_bg_modal .modal-dialog {
  max-width: 600px;
}
#creation_bg_modal .hushop_modal_complete .modal-header {
  justify-content: center;
}
.choose_poster {
  max-width: 200px;
}
.choose_poster .hushop_choose_pic {
  padding-bottom: 150%;
}
#poster_modal .hushop_modal_complete .modal-header {
  justify-content: center;
}
/*創作列表*/
.creation_list .hushop_list {
  min-width: 600px;
}
.creation_list .hushop_list > thead > tr > th:nth-child(1),
.creation_list .hushop_list > tbody > tr > td:nth-child(1) {
  padding-left: 40px;
  text-align: left;
  width: 100px;
}
.creation_list .hushop_list > thead > tr > th:nth-child(3),
.creation_list .hushop_list > tbody > tr > td:nth-child(3) {
  text-align: center;
  width: 18%;
}
.creation_list .hushop_list > thead > tr > th:nth-child(4),
.creation_list .hushop_list > tbody > tr > td:nth-child(4) {
  text-align: center;
  width: 12%;
}
.creation_list .hushop_list > tbody > tr > td:nth-child(4) > div {
  margin-left: auto;
  margin-right: auto;
}
.creation_list .hushop_list > thead > tr > th:nth-child(5),
.creation_list .hushop_list > tbody > tr > td:nth-child(5) {
  padding-right: 40px;
  width: 160px;
  text-align: center;
}
/*編輯創作*/
.creation_form {
  padding: 32px 48px 16px 48px;
  margin-bottom: 16px;
}
.creation_form .ck-content {
  min-height: 500px;
}
.creation_form .hushop_count_input_group {
  max-width: 731px;
}
/*404*/
.error_page {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #f8f9fa;
  position: fixed;
  left: 225px;
  top: 0;
  width: 100%;
  max-width: calc(100% - 225px);
  height: 100vh;
  z-index: 1;
}
.error_content {
  text-align: center;
}
.error_content > img {
  width: 200px;
  margin-bottom: 24px;
}
.error_content > p {
  margin-bottom: 20px;
  font-size: 14px;
  color: #666;
}
/*分類管理*/
.sort_manage {
  padding: 32px 48px 48px 48px;
}
.sort_lv1_item {
  display: flex;
  align-items: center;
  padding: 8px 24px 8px 12px;
  margin-bottom: 16px;
  border: solid 1px #d3d3d3;
  border-radius: 5px;
}
.sort_lv1_item .list_con {
  justify-content: flex-start;
  flex: initial;
  margin-right: 12px;
}
.sort_txt {
  flex: 1;
}
.sort_list_toggle > li:not(:last-child) {
  margin-right: 16px;
}
/*管理員列表*/
.admin_list .hushop_list {
  min-width: 450px;
}
.admin_list .hushop_list > thead > tr > th:nth-child(1),
.admin_list .hushop_list > tbody > tr > td:nth-child(1) {
  padding-left: 40px;
  text-align: left;
  width: 150px;
}
.admin_list .hushop_list > thead > tr > th:nth-child(2),
.admin_list .hushop_list > tbody > tr > td:nth-child(2) {
  text-align: left;
}
.admin_list .hushop_list > thead > tr > th:nth-child(3),
.admin_list .hushop_list > tbody > tr > td:nth-child(3) {
  text-align: center;
  width: 150px;
}
.admin_list .hushop_list > thead > tr > th:nth-child(4),
.admin_list .hushop_list > tbody > tr > td:nth-child(4) {
  text-align: center;
  width: 10%;
}
.admin_list .hushop_list > tbody > tr > td:nth-child(4) > div {
  margin-left: auto;
  margin-right: auto;
}
.admin_list .hushop_list > thead > tr > th:nth-child(5),
.admin_list .hushop_list > tbody > tr > td:nth-child(5) {
  padding-right: 40px;
  text-align: center;
  width: 140px;
}
/*新增管理員*/
.admin_info {
  padding: 32px 48px 16px 48px;
  margin-bottom: 16px;
}
/*作者列表*/
.author_list .hushop_list {
  min-width: 350px;
}
.author_list .hushop_list > thead > tr > th:nth-child(1),
.author_list .hushop_list > tbody > tr > td:nth-child(1) {
  padding-left: 40px;
  text-align: left;
  width: 150px;
}
.author_list .hushop_list > thead > tr > th:nth-child(2),
.author_list .hushop_list > tbody > tr > td:nth-child(2) {
  text-align: left;
}
.author_list .hushop_list > thead > tr > th:nth-child(3),
.author_list .hushop_list > tbody > tr > td:nth-child(3) {
  text-align: center;
  width: 100px;
}
.author_list .hushop_list > tbody > tr > td:nth-child(3) > div {
  margin-left: auto;
  margin-right: auto;
}
.author_list .hushop_list > thead > tr > th:nth-child(4),
.author_list .hushop_list > tbody > tr > td:nth-child(4) {
  padding-right: 40px;
  text-align: center;
  width: 140px;
}
.choose_author_photo {
  max-width: 300px;
  border-radius: 100%;
  overflow: initial;
}
.choose_author_photo .hushop_choose_pic {
  padding-bottom: 100%;
  border-radius: 100%;
}
#author_photo_modal .hushop_modal_complete .modal-header {
  justify-content: center;
}
/*新增作者*/
.author_info {
  padding: 32px 48px 16px 48px;
  margin-bottom: 16px;
}
.author_info .hushop_count_input_group {
  max-width: 731px;
}
.author_info .hushop_input_textarea {
  line-height: 1.8;
}
/*影評管理*/
.article_list .hushop_list {
  min-width: 1000px;
}
.article_list .hushop_list > thead > tr > th:nth-child(1),
.article_list .hushop_list > tbody > tr > td:nth-child(1) {
  padding-left: 40px;
  text-align: left;
  width: 100px;
}
.article_list .hushop_list > thead > tr > th:nth-child(2),
.article_list .hushop_list > tbody > tr > td:nth-child(2) {
  text-align: center;
  width: 10%;
}
.article_list_pic {
  width: 103px;
  /*	margin: 0 auto;*/
}
.article_list_pic .bg {
  padding-bottom: 62%;
  border-radius: 3px;
}
.article_list .hushop_list > thead > tr > th:nth-child(3),
.article_list .hushop_list > tbody > tr > td:nth-child(3) {
  text-align: left;
}
.article_list .hushop_list > thead > tr > th:nth-child(4),
.article_list .hushop_list > tbody > tr > td:nth-child(4) {
  text-align: center;
  width: 10%;
}
.article_list .hushop_list > thead > tr > th:nth-child(5),
.article_list .hushop_list > tbody > tr > td:nth-child(5) {
  text-align: center;
  width: 14%;
}
.article_list .hushop_list > thead > tr > th:nth-child(6),
.article_list .hushop_list > tbody > tr > td:nth-child(6) {
  text-align: center;
  width: 10%;
}
.article_list .hushop_list > tbody > tr > td:nth-child(6) > div {
  margin-left: auto;
  margin-right: auto;
}
.article_list .hushop_list > thead > tr > th:nth-child(7),
.article_list .hushop_list > tbody > tr > td:nth-child(7) {
  text-align: center;
  width: 160px;
}
.article_list .hushop_list > thead > tr > th:nth-child(8),
.article_list .hushop_list > tbody > tr > td:nth-child(8) {
  padding-right: 40px;
  text-align: center;
  width: 160px;
}
/*新增/編輯影評*/
.article_form {
  padding: 32px 35px 16px 35px;
  margin-bottom: 16px;
}
.article_form .hushop_count_input_group {
  max-width: 731px;
}
.article_form .hushop_input_textarea {
  line-height: 1.8;
}
.img_preview {
  max-width: 500px;
}
.choose_article_img {
  max-width: 500px;
}
.choose_article_img .hushop_choose_pic {
  padding-bottom: 62%;
}
.article_form .ck-content {
  min-height: 500px;
}
.article_form .hushop_input_textarea.form-control {
  min-height: 100px;
}
#article_img_modal .modal-dialog {
  max-width: 600px;
}
#article_img_modal .hushop_modal_complete .modal-header {
  justify-content: center;
}
#addcreation_modal .modal-dialog {
  max-width: 700px;
}
.creationadd_noitem {
  margin-top: 48px;
  margin-bottom: 48px;
}
.creationadd_list {
  margin-top: 24px;
  margin-left: -48px;
  margin-right: -48px;
}
.creationadd_list th:nth-child(1),
.creationadd_list td:nth-child(1) {
  width: 88px;
  text-align: left;
  padding-left: 48px;
}
.creationadd_list th:nth-child(2),
.creationadd_list td:nth-child(2) {
  width: 100px;
  text-align: left;
}
.creationadd_list th:nth-child(3),
.creationadd_list td:nth-child(3) {
  text-align: left;
  padding-right: 48px;
}
.a_creation_list {
  min-width: 500px;
}
.a_creation_list .drap_list_header > div:nth-child(1),
.a_creation_list .drap_list_item > div:nth-child(1) {
  padding-left: 40px;
}
.a_creation_list .drap_list_header > div:nth-child(2),
.a_creation_list .drap_list_item > div:nth-child(2) {
  width: 120px;
}
.a_creation_list .drap_list_header > div:nth-child(3),
.a_creation_list .drap_list_item > div:nth-child(3) {
  flex: 1;
}
.a_creation_list .drap_list_header > div:nth-child(4),
.a_creation_list .drap_list_item > div:nth-child(4) {
  width: 140px;
  text-align: center;
}
.a_creation_list .drap_list_header > div:nth-child(5),
.a_creation_list .drap_list_item > div:nth-child(5) {
  padding-right: 40px;
  flex: initial;
  width: 80px;
}
#adddrink_modal .modal-dialog {
  max-width: 700px;
}
.drinkadd_noitem {
  margin-top: 48px;
  margin-bottom: 48px;
}
.drinkadd_list {
  margin-top: 24px;
  margin-left: -48px;
  margin-right: -48px;
}
.drinkadd_list th:nth-child(1),
.drinkadd_list td:nth-child(1) {
  width: 88px;
  text-align: left;
  padding-left: 48px;
}
.drinkadd_list th:nth-child(2),
.drinkadd_list td:nth-child(2) {
  width: 100px;
  text-align: left;
}
.drinkadd_list th:nth-child(3),
.drinkadd_list td:nth-child(3) {
  text-align: left;
  padding-right: 48px;
}
.article_drink {
  margin-top: 8px;
  margin-bottom: 24px;
  display: flex;
  flex-wrap: wrap;
  padding-left: 16px;
}
.cancel_drink {
  margin-left: 48px;
}
/*新增/編輯影評-投票*/
.article_vote_form {
  padding: 32px 48px 16px 48px;
  margin-bottom: 16px;
}
.article_vote_form .hushop_input_textarea {
  max-width: 731px;
}
.vote_time_group {
  display: flex;
  align-items: center;
  padding-left: 20px;
  margin-bottom: -8px;
  margin-left: -12px;
  margin-right: -12px;
}
.vote_time_group > * {
  padding-bottom: 8px;
  padding-left: 12px;
  padding-right: 12px;
}
.vote_time_group + .vote_time_group {
  margin-top: 24px;
}
.vote_notime {
  margin-bottom: 24px;
}
.vote_time_item {
  display: flex;
  align-items: center;
}
.vote_time_item .hushop_select {
  max-width: 100px;
}
.article_vote_item_box {
  display: flex;
  flex-wrap: wrap;
  padding-top: 8px;
}
.article_vote_item {
  padding: 0 20px 32px 20px;
}
.article_vote_item_content {
  width: 100%;
  max-width: 100px;
}
.article_vote_item_img_box {
  margin: 0 auto;
  padding-bottom: 16px;
}
.article_vote_item_img .bg {
  padding-bottom: 100%;
  border-radius: 100%;
}
.article_vote_item_txt .hushop_input_fortable {
  text-align: center;
}
.article_vote_btn {
  padding-top: 12px;
  text-align: center;
}
.article_vote_item .list_con {
  justify-content: center;
  margin-top: 12px;
}
#addvoteitem_modal .modal-header {
  justify-content: center;
}
#addvoteitem_modal .croppie-container .cr-viewport {
  border-radius: 100%;
}
.havevote_form {
  display: none;
}
.havevote_form.show {
  display: block;
}
.for_lottery {
  display: none;
}
.for_lottery.show {
  display: block;
}
/*投票活動管理*/
.vote_info {
  margin-bottom: 24px;
  padding-bottom: 32px;
}
.vote_info_status {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.win_count {
  color: var(--font-color2);
  text-align: right;
  font-size: 14px;
}
.vote_member .hushop_list_box {
  max-height: 770px;
}
.vote_member .hushop_list {
  min-width: 600px;
}
.vote_member.no_lottery .hushop_list {
  min-width: 500px;
}
.vote_member .hushop_list > thead > tr > th:nth-child(1),
.vote_member .hushop_list > tbody > tr > td:nth-child(1) {
  padding-left: 24px;
  width: 80px;
}
.vote_member .hushop_list > tbody > tr > td:nth-child(1) > div {
  justify-content: center;
}
.vote_member .hushop_list > thead > tr > th:nth-child(2),
.vote_member .hushop_list > tbody > tr > td:nth-child(2) {
  text-align: left;
  width: 160px;
}
.vote_member .hushop_list > thead > tr > th:nth-child(3),
.vote_member .hushop_list > tbody > tr > td:nth-child(3) {
  text-align: center;
  width: 100px;
}
.vote_member_pic {
  width: 64px;
}
.vote_member_pic .bg {
  padding-bottom: 100%;
  border-radius: 3px;
}
.vote_member .hushop_list > tbody > tr > td:nth-child(3) > div {
  margin-left: auto;
  margin-right: auto;
}
.vote_member .hushop_list > thead > tr > th:nth-child(4),
.vote_member .hushop_list > tbody > tr > td:nth-child(4) {
  text-align: left;
}
.vote_member .hushop_list > thead > tr > th:nth-child(5),
.vote_member .hushop_list > tbody > tr > td:nth-child(5) {
  padding-right: 24px;
  text-align: left;
  width: 130px;
}
.vote_member.no_lottery .hushop_list > thead > tr > th:nth-child(1),
.vote_member.no_lottery .hushop_list > tbody > tr > td:nth-child(1) {
  display: none;
}
.vote_member.no_lottery .hushop_list > thead > tr > th:nth-child(2),
.vote_member.no_lottery .hushop_list > tbody > tr > td:nth-child(2) {
  padding-left: 24px;
}
.vote_member .hushop_list_box::-webkit-scrollbar {
  width: 14px;
  box-sizing: inherit;
}
.vote_member .hushop_list_box::-webkit-scrollbar-thumb {
  background-color: #c4c4c4;
  border-radius: 8px;
  border: 3px solid transparent;
  border-left-width: 4px;
  background-clip: padding-box;
}
.vote_member .hushop_list_box::-webkit-scrollbar-track-piece {
  background-color: #fff;
  padding-left: 1px;
  border-left: solid 1px #e8e8e8;
}
.vote_member .hushop_list_box::-webkit-scrollbar-button {
  display: none;
}
#winmember_modal .modal-dialog {
  max-width: 700px;
}
.winmember_table > thead > tr > th:nth-child(1),
.winmember_table > tbody > tr > td:nth-child(1) {
  width: 30%;
}
.winmember_table > thead > tr > th:nth-child(2),
.winmember_table > tbody > tr > td:nth-child(2) {
  width: 30%;
}
/*飲品列表*/
.drinks_list .hushop_list {
  min-width: 700px;
}
.drinks_list .hushop_list > thead > tr > th:nth-child(1),
.drinks_list .hushop_list > tbody > tr > td:nth-child(1) {
  padding-left: 40px;
  text-align: left;
  width: 120px;
}
.drinks_list .hushop_list > thead > tr > th:nth-child(2),
.drinks_list .hushop_list > tbody > tr > td:nth-child(2) {
  width: 12%;
  text-align: center;
}
.drinks_list_pic {
  width: 64px;
  margin: 0 auto;
}
.drinks_list_pic .bg {
  padding-bottom: 100%;
  border-radius: 3px;
}
.drinks_list .hushop_list > thead > tr > th:nth-child(3),
.drinks_list .hushop_list > tbody > tr > td:nth-child(3) {
  text-align: left;
}
.drinks_list .hushop_list > thead > tr > th:nth-child(4),
.drinks_list .hushop_list > tbody > tr > td:nth-child(4) {
  text-align: center;
  width: 12%;
}
.drinks_list .hushop_list > thead > tr > th:nth-child(5),
.drinks_list .hushop_list > tbody > tr > td:nth-child(5) {
  text-align: center;
  width: 12%;
}
.drinks_list .hushop_list > tbody > tr > td:nth-child(5) > div {
  margin: 0 auto;
}
.drinks_list .hushop_list > thead > tr > th:nth-child(6),
.drinks_list .hushop_list > tbody > tr > td:nth-child(6) {
  width: 160px;
  padding-right: 40px;
  text-align: center;
}
/*新增/編輯飲品*/
.drink_form {
  padding: 32px 48px 16px 48px;
  margin-bottom: 16px;
}
.drink_form .hushop_count_input_group {
  max-width: 731px;
}
.drink_form .hushop_input_textarea.form-control {
  min-height: 100px;
}
.drink_form .hushop_input_textarea {
  line-height: 1.8;
}
.choose_drink {
  max-width: 300px;
}
.choose_drink .hushop_choose_pic {
  padding-bottom: 100%;
}
.drink_form .ck-content {
  min-height: 400px;
}
#drink_modal .hushop_modal_complete .modal-header {
  justify-content: center;
}
/*系列管理*/
.series_list .hushop_list > thead > tr > th:nth-child(1),
.series_list .hushop_list > tbody > tr > td:nth-child(1) {
  padding-left: 40px;
}
.series_list .hushop_list > thead > tr > th:nth-child(2),
.series_list .hushop_list > tbody > tr > td:nth-child(2) {
  padding-right: 40px;
  width: 160px;
  text-align: center;
}
/*系列關聯創作*/
.series_creation_list .hushop_list > thead > tr > th:nth-child(1),
.series_creation_list .hushop_list > tbody > tr > td:nth-child(1) {
  padding-left: 40px;
  width: 70px;
}
.series_creation_list .hushop_list > thead > tr > th:nth-child(3),
.series_creation_list .hushop_list > tbody > tr > td:nth-child(3) {
  padding-right: 40px;
  width: 100px;
  text-align: center;
}
/*操作紀錄*/
.record_list .hushop_list > thead > tr > th:nth-child(1),
.record_list .hushop_list > tbody > tr > td:nth-child(1) {
  padding-left: 40px;
  width: 160px;
}
.record_list .hushop_list > thead > tr > th:nth-child(2),
.record_list .hushop_list > tbody > tr > td:nth-child(2) {
  text-align: center;
  width: 12%;
}
.record_list .hushop_list > thead > tr > th:nth-child(4),
.record_list .hushop_list > tbody > tr > td:nth-child(4) {
  padding-right: 40px;
  width: 120px;
}
/*首頁設定*/
.home_form {
  padding: 32px 48px 16px 48px;
  margin-bottom: 16px;
}
.home_article_list {
  min-width: 700px;
}
.home_article_list .drap_list_header > div:nth-child(1),
.home_article_list .drap_list_item > div:nth-child(1) {
  padding-left: 40px;
}
.home_article_list .drap_list_header > div:nth-child(2),
.home_article_list .drap_list_item > div:nth-child(2) {
  width: 120px;
}
.home_article_list .drap_list_header > div:nth-child(3),
.home_article_list .drap_list_item > div:nth-child(3) {
  flex: 1;
}
.home_article_list .drap_list_header > div:nth-child(4),
.home_article_list .drap_list_item > div:nth-child(4) {
  width: 140px;
  text-align: center;
}
.home_article_list .drap_list_header > div:nth-child(5),
.home_article_list .drap_list_item > div:nth-child(5) {
  padding-right: 40px;
  flex: initial;
  width: 80px;
}
.home_activity_list {
  min-width: 700px;
}
.home_activity_list .drap_list_header > div:nth-child(1),
.home_activity_list .drap_list_item > div:nth-child(1) {
  padding-left: 40px;
}
.home_activity_list .drap_list_header > div:nth-child(2),
.home_activity_list .drap_list_item > div:nth-child(2) {
  flex: 1;
}
.home_activity_list .drap_list_header > div:nth-child(3),
.home_activity_list .drap_list_item > div:nth-child(3) {
  width: 200px;
  text-align: center;
}
.home_activity_list .drap_list_header > div:nth-child(4),
.home_activity_list .drap_list_item > div:nth-child(4) {
  width: 140px;
  text-align: center;
}
.home_activity_list .drap_list_header > div:nth-child(5),
.home_activity_list .drap_list_item > div:nth-child(5) {
  padding-right: 40px;
  flex: initial;
  width: 80px;
}
.home_selected_list {
  min-width: 700px;
}
.home_selected_list .drap_list_header > div:nth-child(1),
.home_selected_list .drap_list_item > div:nth-child(1) {
  padding-left: 40px;
}
.home_selected_list .drap_list_header > div:nth-child(2),
.home_selected_list .drap_list_item > div:nth-child(2) {
  width: 120px;
}
.home_selected_list .drap_list_header > div:nth-child(3),
.home_selected_list .drap_list_item > div:nth-child(3) {
  flex: 1;
}
.home_selected_list .drap_list_header > div:nth-child(4),
.home_selected_list .drap_list_item > div:nth-child(4) {
  width: 140px;
  text-align: center;
}
.home_selected_list .drap_list_header > div:nth-child(5),
.home_selected_list .drap_list_item > div:nth-child(5) {
  padding-right: 40px;
  flex: initial;
  width: 80px;
}
#addarticle_modal .modal-dialog {
  max-width: 800px;
}
.articleadd_noitem {
  margin-top: 48px;
  margin-bottom: 48px;
}
.articleadd_list {
  margin-top: 24px;
  margin-left: -48px;
  margin-right: -48px;
}
.articleadd_list th:nth-child(1),
.articleadd_list td:nth-child(1) {
  width: 88px;
  text-align: left;
  padding-left: 48px;
}
.articleadd_list th:nth-child(2),
.articleadd_list td:nth-child(2) {
  width: 100px;
  text-align: left;
}
.articleadd_list th:nth-child(3),
.articleadd_list td:nth-child(3) {
  text-align: left;
  padding-right: 48px;
}
#addselected_modal .modal-dialog {
  max-width: 800px;
}
.selectedadd_noitem {
  margin-top: 48px;
  margin-bottom: 48px;
}
.selectedadd_list {
  margin-top: 24px;
  margin-left: -48px;
  margin-right: -48px;
}
.selectedadd_list th:nth-child(1),
.selectedadd_list td:nth-child(1) {
  width: 88px;
  text-align: left;
  padding-left: 48px;
}
.selectedadd_list th:nth-child(2),
.selectedadd_list td:nth-child(2) {
  width: 100px;
  text-align: left;
}
.selectedadd_list th:nth-child(3),
.selectedadd_list td:nth-child(3) {
  text-align: left;
  padding-right: 48px;
}
#addactivities_modal .modal-dialog {
  max-width: 800px;
}
.activitiesadd_noitem {
  margin-top: 48px;
  margin-bottom: 48px;
}
.activitiesadd_list {
  margin-top: 24px;
  margin-left: -48px;
  margin-right: -48px;
}
.activitiesadd_list th:nth-child(1),
.activitiesadd_list td:nth-child(1) {
  width: 88px;
  text-align: left;
  padding-left: 48px;
}
.activitiesadd_list th:nth-child(2),
.activitiesadd_list td:nth-child(2) {
  text-align: left;
}
.activitiesadd_list th:nth-child(3),
.activitiesadd_list td:nth-child(3) {
  text-align: center;
  width: 180px;
  padding-right: 48px;
}
/*活動管理*/
.activities_list .hushop_list {
  min-width: 1000px;
}
.activities_list .hushop_list > thead > tr > th:nth-child(1),
.activities_list .hushop_list > tbody > tr > td:nth-child(1) {
  padding-left: 40px;
  text-align: left;
  width: 100px;
}
.activities_list .hushop_list > thead > tr > th:nth-child(2),
.activities_list .hushop_list > tbody > tr > td:nth-child(2) {
  text-align: center;
  width: 10%;
}
.activities_list_pic {
  width: 103px;
  margin: 0 auto;
}
.activities_list_pic .bg {
  padding-bottom: 62%;
  border-radius: 3px;
}
.activities_list .hushop_list > thead > tr > th:nth-child(4),
.activities_list .hushop_list > tbody > tr > td:nth-child(4) {
  text-align: center;
  width: 140px;
}
.activities_list .betweendate {
  display: inline-flex;
  transform: rotate(90deg);
}
.activities_list .hushop_list > thead > tr > th:nth-child(5),
.activities_list .hushop_list > tbody > tr > td:nth-child(5) {
  padding-right: 40px;
  text-align: center;
  width: 160px;
}
/*新增/編輯活動*/
.activities_form {
  padding: 32px 48px 16px 48px;
  margin-bottom: 16px;
}
.activities_form .hushop_count_input_group {
  max-width: 731px;
}
.activities_form .hushop_input_textarea.form-control {
  min-height: 100px;
}
.activities_form .hushop_input_textarea {
  line-height: 1.8;
}
.choose_activities_img {
  max-width: 500px;
}
.choose_activities_img .hushop_choose_pic {
  padding-bottom: 62%;
}
.activities_form .ck-content {
  min-height: 500px;
}
#activities_img_modal .modal-dialog {
  max-width: 600px;
}
#activities_img_modal .hushop_modal_complete .modal-header {
  justify-content: center;
}
/*會員列表*/
.member_list .hushop_list {
  min-width: 700px;
}
.member_list .hushop_list > thead > tr > th:nth-child(1),
.member_list .hushop_list > tbody > tr > td:nth-child(1) {
  padding-left: 40px;
  width: 180px;
}
.member_list .hushop_list > thead > tr > th:nth-child(2),
.member_list .hushop_list > tbody > tr > td:nth-child(2) {
  width: 10%;
  text-align: center;
}
.member_list .hushop_list > tbody > tr > td:nth-child(2) > div {
  margin-left: auto;
  margin-right: auto;
}
.member_list .hushop_list > thead > tr > th:nth-child(3),
.member_list .hushop_list > tbody > tr > td:nth-child(3) {
  width: 15%;
}
.member_list .hushop_list > thead > tr > th:nth-child(5),
.member_list .hushop_list > tbody > tr > td:nth-child(5) {
  width: 120px;
  text-align: center;
}
.member_list .hushop_list > tbody > tr > td:nth-child(5) > div {
  margin-left: auto;
  margin-right: auto;
}
.member_list .hushop_list > thead > tr > th:nth-child(6),
.member_list .hushop_list > tbody > tr > td:nth-child(6) {
  padding-right: 40px;
  text-align: center;
  width: 140px;
}
/*會員資料*/
.mamber_info {
  padding-bottom: 32px;
  margin-bottom: 24px;
}
.mamber_record .hushop_list {
  min-width: 600px;
}
.mamber_record .hushop_list > thead > tr > th:nth-child(1),
.mamber_record .hushop_list > tbody > tr > td:nth-child(1) {
  padding-left: 24px;
  width: 140px;
}
.mamber_record .hushop_list > thead > tr > th:nth-child(2),
.mamber_record .hushop_list > tbody > tr > td:nth-child(2) {
  width: 20%;
}
.mamber_record .hushop_list > thead > tr > th:nth-child(3),
.mamber_record .hushop_list > tbody > tr > td:nth-child(3) {
  padding-right: 24px;
}
/*聯絡我們*/
.contact_list .hushop_list {
  min-width: 600px;
}
.contact_list .hushop_list > thead > tr > th:nth-child(1),
.contact_list .hushop_list > tbody > tr > td:nth-child(1) {
  padding-left: 40px;
  width: 100px;
}
.contact_list .hushop_list > thead > tr > th:nth-child(2),
.contact_list .hushop_list > tbody > tr > td:nth-child(2) {
  width: 15%;
}
.contact_list .hushop_list > thead > tr > th:nth-child(4),
.contact_list .hushop_list > tbody > tr > td:nth-child(4) {
  width: 15%;
}
.contact_list .hushop_list > thead > tr > th:nth-child(5),
.contact_list .hushop_list > tbody > tr > td:nth-child(5) {
  width: 15%;
}
.contact_list .hushop_list > thead > tr > th:nth-child(6),
.contact_list .hushop_list > tbody > tr > td:nth-child(6) {
  padding-right: 40px;
  text-align: center;
  width: 140px;
}
/*聯絡我們內容*/
.contactus_content,
.contactus_reply {
  padding-bottom: 32px;
  margin-bottom: 24px;
}
.contactus_reply {
  padding: 32px 48px 16px 48px;
  margin-bottom: 16px;
}
/*圖庫*/
#gallery_modal .modal-dialog {
  max-width: 100%;
  /* margin: 0;
    min-height: 100vh; */
}
#gallery_modal .modal-content {
  border-radius: 0;
  overflow-y: auto;
}
.gallery_lv .breadcrumb {
  margin-bottom: 0;
  display: inline-flex;
}
.gallery_lv .breadcrumb-item + .breadcrumb-item::before {
  content: ">";
}
.gallery_lv .breadcrumb-item.active,
.gallery_lv .breadcrumb-item:hover::before,
.gallery_lv .breadcrumb-item.active::before {
  color: #333333;
}
.gallery_lv .gallery_file_btn {
  position: relative;
  display: inline-flex;
}
.gallery_noitem {
  margin-top: 48px;
  margin-bottom: 48px;
}
.gallery_nav {
  font-size: 16px;
  margin-top: 4px;
}
.gallery_nav .nav {
  justify-content: flex-end;
}
.gallery_nav .nav-item + .nav-item {
  margin-left: 48px;
}
.gallery_list {
  margin-top: 24px;
  display: flex;
  flex-wrap: wrap;
  margin-left: -12px;
  margin-right: -12px;
}
.gallery_item_box {
  width: 12.5%;
  padding-left: 12px;
  padding-right: 12px;
}
.gallery_item {
  padding-bottom: 36px;
  position: relative;
}
.gallery_file_icon img {
  width: 100%;
}
.gallery_item_txt {
  margin-top: 8px;
  word-break: break-all;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}
.gallery_name {
  word-break: break-all;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}
.gallery_open_add {
  position: relative;
  width: 100%;
  min-height: 50px;
  border: solid 1px #f0f1f3;
  overflow: hidden;
  border-radius: 3px;
}
.gallery_open_add_h {
  padding-bottom: 100%;
}
.gallery_pic {
  position: relative;
  border-radius: 3px;
  overflow: hidden;
}
.gallery_pic .bg {
  width: 100%;
  height: 0;
  padding-bottom: 100%;
  border-radius: 3px;
}
.choose_gallery_pic {
  position: absolute;
  top: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  background-color: rgb(000 000 000 / 50%);
  opacity: 0;
}
.gallery_pic_btn {
  position: absolute;
  top: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  background-color: rgb(0 0 0 / 30%);
  opacity: 0;
  /*transition-duration: .2s;*/
}
.gallery_pic_btn:hover {
  opacity: 1;
}
.gallery_pic_btn.copyok::before {
  position: absolute;
  bottom: 16px;
  content: "複製成功";
  color: #fff;
}
.gallery_time {
  display: block;
  margin-top: 4px;
  color: #666666;
  font-size: 14px;
}
.gallery_pic_btn_icon {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 12px;
  width: 32px;
  height: 32px;
  border-radius: 100%;
  background-color: #fff;
  opacity: 0.9;
}
.gallery_pic_btn_icon:hover {
  opacity: 1;
}
.gallery_pic_btn_icon img {
  width: 18px;
}
.gallery_file_btn {
  position: absolute;
  top: 0;
  right: -8px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.gallery_file_btn_icon {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 12px;
  padding: 0;
  opacity: 0.9;
}
.gallery_file_btn_icon:hover {
  opacity: 1;
}
.gallery_file_btn_icon img {
  width: 18px;
}
.pic_link_forcopy {
  position: absolute;
  top: 0;
  left: 0;
  font-size: 1px;
  border: none;
  color: transparent;
  background-color: transparent;
  z-index: -1;
}
.have_backbtn {
  display: flex;
  align-items: center;
}
.gallery_backbtn {
  width: 40px;
  height: 40px;
  background-color: #66a6ff;
  color: #fff;
  border-radius: 100%;
  margin-right: 16px;
}
.pic_upload_choose_file input[type="file"] {
  display: none;
}
.upload_zone {
  border-radius: 5px;
  background-color: #f3f3f3;
  border: dashed 2px #d3d3d3;
  background-clip: padding-box;
}
.upload_zone_txt {
  margin-top: 32px;
  text-align: center;
}
.upload_zone_icon {
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 8px;
  width: 60px;
}
.upload_zone_txt > span {
  font-size: 14px;
  display: block;
  margin-top: 8px;
}
.upload_zone .two_btn {
  margin-left: -24px;
  margin-right: -24px;
  margin-top: 16px;
  margin-bottom: 44px;
  justify-content: center;
}
.pic_upload_filename {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  word-break: break-all;
}
.choose_file_btn span::before {
  content: "選擇圖片";
}
#upload_count {
  display: none;
}
.preview_box {
  display: flex;
  flex-wrap: wrap;
}
.pic_upload {
  position: relative;
  display: flex;
  margin-left: 24px;
  padding-top: 24px;
  padding-bottom: 24px;
  width: calc(33% - 24px);
}
.pic_upload {
  border-bottom: solid 1px #e3e3e3;
}
.pic_upload_pic {
  width: 96px;
  height: 96px;
  border-radius: 5px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
}
.pic_upload_info_box {
  display: grid;
  flex: 1;
  padding-left: 24px;
  max-width: calc(100% - 96px);
  overflow: hidden;
}
.pic_upload_progress {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
}
.pic_upload_progressline {
  width: 100%;
}
.pic_upload_progressline .progress {
  height: 4px;
  border-radius: 3px;
}
.pic_upload_progressline .progress-bar {
  border-radius: 3px;
  background-color: #66a6ff;
}
.pic_upload_progressnum {
  margin-top: 8px;
  width: 100%;
  font-size: 14px;
  color: #3981e6;
}
.pic_upload_progressnum {
  margin-top: 8px;
  width: 100%;
  font-size: 14px;
  color: #3981e6;
}
.progressnum_icon {
  display: inline-block;
  margin-left: 8px;
  width: 13px;
}
.modal-backdrop + .modal-backdrop {
  z-index: 1056;
}
#upload_file_oversize,
#addfile_modal,
#editfile_modal {
  z-index: 1057;
}
/*影評分類*/
.article_sort_manage {
  padding: 32px 48px 48px 48px;
}