/*  -------------------------------------------------------- */

* {
    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; */
}

: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;
}