/*  -------------------------------------------------------- */

* {
  margin: 0;
  padding: 0;
  /* list-style: none; */
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-family: "Noto Sans TC", "Microsoft JhengHei", sans-serif;
}

/* listNone */
.listNone li {
  list-style: none !important;
  padding: 0px !important;
}

.uk-subnav > * {
  padding: 0px !important;
}

body {
  margin: 0;
  padding: 0;
  /* font-family: '微軟正黑體', 'Microsoft JhengHei', Arial, Helvetica, sans-serif; */
  /* -ms-overflow-style: none; */
  /* height: 100%; */
  /* width: calc(100vw + 18px); */
  /* overflow: auto; */
}

body::-webkit-scrollbar {
  display: none;
}

:before,
:after {
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}

header,
footer,
div,
nav,
article,
h2,
h3,
h4,
h5,
h6,
hr,
p,
form,
label,
input,
textarea,
ul,
li,
img,
span,
font,
strong,
b,
a,
i {
  text-align: left;
  vertical-align: middle;
  margin: 0;
  padding: 0;
  line-height: 170%;
  border-width: 0;
  font-family: "Noto Sans", "Noto Sans TC", "Noto Sans SC", sans-serif;
  font-size: 16px;
  word-wrap: break-word;
  word-break: break-word;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}

p {
  margin: 0 !important;
}

/* 通用 -------------------------------------------------------- */

/* 遊戲背景 */

.bgc-flex {
  position: relative;
  background: no-repeat;
  display: flex;
  background-size: cover;
}

.bgc-flex-v {
  position: relative;
  background: no-repeat fixed center;
  /* background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat; */
  background-size: cover;
}

.bgc_center {
  background: contain center top repeat-y !important;
}

.bgc-flex-bs {
  background-repeat: no-repeat !important;
  background-size: contain !important;
  background-position: center !important;
  height: 44px;
  width: 146px;
}

/* 遊戲背景 */

.game-flex {
  position: relative;
  background: no-repeat;
  background-size: 100% 100%;
}

.game-v-flex {
  position: relative;
  background: no-repeat;
  background-size: 100% auto;
}

/*  */
.centerCenter {
  text-align: center !important;
  justify-content: center !important;
  justify-self: center !important;
  justify-items: center !important;
  align-self: center !important;
  align-items: center !important;
  align-content: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.lp12 {
  letter-spacing: 1.2rem;
}
.lp05 {
  letter-spacing: 0.05em;
}
.lp1 {
  letter-spacing: 0.1em;
}

.lp2 {
  letter-spacing: 0.2em;
}

.textPink {
  color: #fb98ac;
}

.textPurple {
  color: #9383f3;
}

.textOrange {
  color: #ffbe67;
}

.textOrange {
  color: #ffbe67;
}

.textCoffee {
  color: #365a97;
}

.textCoffee2 {
  color: #bcad93;
}

.textWhite {
  color: #efeee0;
}

.bgWhite {
  background: #efeee0;
}

.bgCoffee {
  background: #365a97;
}

.bgCoffee2 {
  background: #bcad93;
}
/* body -------------------------------------------------------- */

.breadcrumb-item + .breadcrumb-item::before {
  color: #fff;
  content: "/";
}

.text-theme {
  color: #365a97;
}

.text-theme2 {
  color: #2abf6f;
}
.text-theme3 {
  color: #ff5f7b;
}
.text-theme5 {
  color: #f8c725;
}

.green_txt {
  color: #2abf6f;
}

.bg-theme {
  background-color: #f1f8ff;
}
.bg-theme2 {
  background-color: #eee;
}
.bg-theme3 {
  background-color: #365a97;
}
.bg-theme4 {
  background-color: #ebf5ff;
}
.bg-theme5 {
  background-color: #2abf6f;
}

.bg-theme2-hover:hover {
  background-color: #365a97;
  color: #fff;
}

.bg-linear-theme {
  background: linear-gradient(180deg, #edf6ff, #fff 53.65%, #f0f7ff);
}

.bg-gradient-theme {
  background: linear-gradient(180deg, #ffffff 0%, #eeeeee 100%);
}

.bd-theme {
  border-color: #365a97 !important;
}

.Blog-name-active:hover {
  background-color: #fd788e !important;
  color: #fff !important;
}

.Blog-name-active-a {
  background-color: #fd788e !important;
  color: #fff !important;
}

.fsz-08 {
  font-size: 0.8em !important;
}

.fsz-06 {
  font-size: 0.6em !important;
}
.fsz-1 {
  font-size: 1rem !important;
}

/* MD breadcrumb -------------------------------------------------------- */

.breadcrumb {
  background-color: transparent;
}

/* Blog -------------------------------------------------------- */

.BlogGameBg {
  background: linear-gradient(180deg, #fff4e5 0%, #ffe9cc 100%);
  color: #ffffff;
}

.BlogGameTColor {
  color: #fd788e;
}

.pt-2 a .BlogGameTColor:hover {
  color: red;
}

.rowEllipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  /* 多行加下列 */
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  white-space: normal;
}

.rowBlogEllipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  /* 多行加下列 */
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  white-space: normal;
}

.btn-blog-active:hover {
  background-color: #fd788e;
  border-radius: 5px;
  color: #fff !important;
}

/* index -------------------------------------------------------- */

.bgc-header-color {
  background-color: #bcad93;
}

.bgc-body-color {
  background-color: #eee;
}

.gradientBtnA {
  background: linear-gradient(180deg, #eecda3 0%, #ef629f 100%);
}

.border-bottom-title {
  border-bottom: 2px solid #365a97;
}

.rowEllipsis2 {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  white-space: normal;
}

.rowEllipsis3 {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  white-space: normal;
}

.rowEllipsis5 {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  white-space: normal;
}
