html,
body {
    overflow: hidden !important;
    overflow-y: auto !important;
}

body {
    margin: 0px auto;
    padding: 0;
    overflow-x: hidden;
    color: #333333;
    font-size: 12px;
    font-family: "微軟正黑體";
}

div,
dl,
dt,
dd,
ul,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
form,
fieldset,
input,
textarea,
blockquote,
p {
    padding: 0;
    margin: 0;
}

table,
td,
tr,
th {
    font-size: 16px;
}

li {
    list-style: none;
    vertical-align: bottom;
}

img {
    Vertical-aliagn: top;
    border: 0;
}

ol,
ul {
    list-style: none;
}

a {
    color: #333333;
    text-decoration: none;
}

.clear {
    clear: both;
}

.left {
    float: left;
}

.right {
    float: right;
}

.dis {
    display: none;
}

.block {
    display: block;
}

.line {
    width: 100%;
    height: 1px;
    border-bottom: #ccc 1px solid;
    float: left;
    margin: 5px 0 5px 0;
}

.dotted {
    width: 100%;
    height: 1px;
    border-bottom: #999 1px dashed;
    float: left;
    margin: 5px 0 5px 0;
}

.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}

/* Hides from IE-mac \*/
*:first-child+html .clearfix {
    zoom: 1;
}

/* IE7 */
* html .clearfix {
    height: 1%;
    zoom: 1;
}

.clearfix {
    display: block;
}

.left {
    float: left;
}

.right {
    float: right;
}

h3 {
    font-size: 14px;
}

h2 {
    font-size: 16px;
}

h1 {
    font-size: 18px;
}

b {
    font-weight: 700;
}

em {
    font-style: normal;
}

select:focus,
input:focus,
textarea:focus {
    outline: none;
}

.heads {
    position: fixed;
    left: 0;
    top: 0;
    background: #1a1a1a;
    width: 100%;
    z-index: 1001;
}

.heads-logo {
    display: inline-block;
    margin: 13px 0px 0px 40px;
}

.heads-logo img {
    height: 68px;
    vertical-align: middle;
}

.heads-icon a {
    display: inline-block;
    margin-right: 10px;
    margin-top: 37px;
}

.heads-icon img {
    height: 34px;
    vertical-align: middle;
}

.heads-menu li {
    float: left;
}

.heads-menu li a {
    display: inline-block;
    color: #fff;
    text-align: center;
    padding-top: 27px;
    padding-bottom: 27px;
}

.heads-menu li a p {
    color: #fff;
    font-size: 15px;
    font-weight: bold;
}

.heads-menu {
    padding-left: 270px;
    padding-right: 280px;
}

.heads-menu .english {
    font-size: 12px;
}

body {
    font-family: "微軟正黑體" !important;
}

.heads-menu .chinese {
    border-right: 2px solid #918c8a;
    padding: 0px 38px;
}

.heads-menu li:last-child .chinese {
    border: none;
}

.heads-phone {
    display: none;
    text-align: center;
    position: relative;
}

.heads-phone-logo {
    display: inline-block;
    padding: 10px 0px;
}

.heads-phone-logo img {
    height: 36px;
    vertical-align: middle;
}

.heads-menu-button {
    display: block;
    background: url(/assets/images/menu-arrow-down.svg) no-repeat;
    height: 25px;
    width: 25px;
    position: absolute;
    left: 10px;
    top: 15.5px;
    z-index: 10;
    background-size: 100% 100%;
}

.heads-menu-buttons {
    background: url(/assets/images/menu-arrow-up.svg) no-repeat;
    background-size: 100% 100%;
}

.heads-phone-icon {
    position: absolute;
    right: 10px;
    top: 8px;
}

.heads-phone-icon a {
    display: inline-block;
    margin-left: 7px;
    font-size: 12px;
    color: #fff;
}

.heads-phone-icon img {
    height: 24px;
    vertical-align: middle;
}

.heads-phone-menu {
    position: fixed;
    width: 100%;
    left: 0;
    top: 50px;
    background: #1a1a1a;
    display: none;
    z-index: 1001;
}

.heads-phone-hide {
    max-height: 400px;
    overflow-y: auto;
}

.heads-phone-title {
    padding: 12px 10px;
    border-bottom: 1px solid #807475;
}

.heads-phone-title span {
    font-size: 15px;
    color: #fff !important;
    display: block;
    font-weight: bold;
}

.heads-phone-titles span {
    background: url(/assets/images/headsup.png) no-repeat right center;
}

.heads-phone-menus a {
    font-size: 14px;
    color: #fff;
    display: block;
    line-height: 40px;
    padding: 0px 10px;
}

.heads-phone-menus {
    background: #4a4a4a;
    border-bottom: 1px solid #807475;
    padding: 10px 0px;
    display: none;
}

.heads-phone-trace {
    background: none !important;
}

.heads-phone-traces {
    text-align: center;
    padding: 10px 0px;
}

.heads-phone-traces a {
    display: block;
    width: 20%;
    float: left;
}

.heads-phone-traces img {
    height: 32px;
    vertical-align: middle;
}

.mains {
    margin-top: 100px;
}

.mains.top-socialite-notify {
    margin-top: 128px;
}

.main-container {
    margin: 30px auto;
}

i {
    font-style: normal;
}

.right-fixs {
    position: fixed;
    right: 10px;
    bottom: 80px;
    z-index: 999;
}

.right-fixs a {
    display: inline-block;
    width: 72px;
    height: 72px;
    font-size: 12px;
    color: #fff;
    margin-bottom: 5px;
    text-align: center;
    background-color: #9f353a;
    border-radius: 5px;
}

.right-fixs a img {
    vertical-align: middle;
}

.nav-cart {
    margin-top: 38px;
}

/* CSS used here will be applied after bootstrap.css */

.dropdown {
    display: inline-block;
    margin-left: 20px;
    padding: 10px;
}


.glyphicon-bell {

    font-size: 1.5rem;
}

.notifications {
    min-width: 420px;
}

.notifications-wrapper {
    overflow: auto;
    max-height: 250px;
}

.menu-title {
    color: #ff7788;
    font-size: 1.5rem;
    display: inline-block;
}

.glyphicon-circle-arrow-right {
    margin-left: 10px;
}


.notification-heading,
.notification-footer {
    padding: 2px 10px;
}


.dropdown-menu .divider {
    margin: 5px 0;
}

.item-title {

    font-size: 1.3rem;
    color: #000;

}

.notifications a.content {
    text-decoration: none;
    background: #ccc;

}

.notification-item {
    padding: 10px;
    margin: 5px;
    background: #ccc;
    border-radius: 4px;
}




.login-text {
    line-height: 43px;
}

@media (min-width: 1080px) {
    .heads a:hover {
        opacity: 0.8;
    }
}

@media (max-width: 1630px) {
    .heads-menu .chinese {
        padding: 0px 20px;
    }
}

@media (max-width: 1400px) {
    .heads-icon a {
        margin-right: 5px;
    }

    /* .heads-icon-per{margin-left: 5px;} */
    .heads-menu .chinese {
        padding: 0px 14px;
    }

    .heads-menu {
        padding-right: 225px;
        padding-left: 230px;
    }

    .heads-logo {
        margin-left: 20px;
    }

    .heads-icon img {
        height: 30px;
    }

    .heads-icon a {
        margin-top: 39px;
    }
}

@media (max-width: 1199px) {
    .heads-pc {
        display: none;
    }

    .heads-phone {
        display: block;
        height: 50px;
    }

    .mains {
        margin-top: 50px;
    }

    .mains.top-socialite-notify {
        margin-top: 78px;
    }
}

@media (max-width: 350px) {
    .mains.top-socialite-notify {
        margin-top: 98px;
    }
}

.footer-background-top img {
    width: 100%;
    vertical-align: middle;
}

.footers-bottom {
    background: #1a1a1a;
    padding-top: 45px;
}

.containers {
    width: 1200px;
    margin: 0px auto;
}

.heads-phone-footer {
    display: none;
}

.footers-pc-groups-small {
    width: 25%;
    box-sizing: border-box;
    float: left;
}

.footers-pc-groups-big {
    width: 33.33%;
    box-sizing: border-box;
    float: left;
}

@media (max-width: 1280px) {
    .containers {
        width: 100%;
        box-sizing: border-box;
        padding: 0px 10px;
    }
}

@media (min-width: 1200px) {
    .heads-phone-menu {
        display: none !important;
    }
}

@media (max-width: 991px) {
    .footers-pc-groups-small {
        width: 25%;
    }

    .footers-pc-groups-big {
        width: 50%;
    }
}

@media (max-width: 767px) {
    .heads-phone-footer {
        display: block !important;
        position: static;
    }

    .footers-bottom {
        padding: 0px;
    }

    .footers-pc-groups-small {
        width: 100%;
    }

    .footers-pc-groups-big {
        width: 100%;
    }

    .right-fixs {
        margin-bottom: 100px;
    }

    .footers {
        padding-bottom: 60px;
    }
}

.footers-pc-title {
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 15px;
}

.footers-pc-link a,
.footers-pc-link p {
    color: #fff;
    font-size: 14px;
}

.footers-pc-link {
    margin-bottom: 25px;
}

.footers-pc-link p {
    margin-bottom: 10px;
}

.footers-tracking a {
    display: inline-block;
    width: 33px;
    margin-right: 10px;
}

.footers-tracking a img {
    width: 100%;
}

.footers-cooperation a {
    display: inline-block;
    width: 80px;
    margin-right: 10px;
    margin-bottom: 10px;
}

.footers-cooperation a img {
    width: 100%;
}

@media (min-width: 1080px) {
    .footers-bottom a:hover {
        color: #ff5d5d
    }
}

.footer-phone-fix {
    display: none;
    position: fixed;
    width: 100%;
    padding: 10px 0;
    left: 0;
    bottom: 0;
    z-index: 1001;
    background: #1a1a1a;
}

@media (max-width: 767px) {
    .footer-phone-fix {
        display: block;
    }
}

.footer-phone-fix li {
    float: left;
    width: 25%;
    text-align: center;
}

.footer-phone-fix li a {
    display: inline-block;
    position: relative;
    color: #fff;
    font-size: 12px !important;
    text-align: center;
}

.footer-phone-fix li img {
    max-width: 100%;
}

.nav-fix-number {
    font-style: normal;
    border-radius: 50%;
    display: inline-block;
    background: #f14950;
    color: #fff;
    line-height: 16px;
    width: 16px;
    text-align: center;
    position: absolute;
    margin-left: 17px;
    font-size: 12px;
}

.sites {
    background: #fff;
    border-bottom: 1px solid #e6e6e6;
    padding: 10px 0px;
    color: #9f353a;
    font-size: 13px;
}

.sites a {
    color: #808080;
}

.sites i {
    color: #808080;
}

.pages {
    text-align: center;
    padding: 60px 0px;
}

.pages .ahover {
    background: #9f353a;
    color: #fff;
}

.inside-title {
    background: #f8f8f8;
    padding: 30px 0px;
    border-bottom: 1px solid #e6e6e6;
    margin-bottom: 20px;
    text-align: center;
}

.inside-title h1 {
    color: #4D4D4D;
    font-size: 28px;
    font-weight: bold;
    letter-spacing: 3px;
    margin: auto;
}

.inside-title .article-title {
    text-align: left;
}

.text-red-color {
    color: #9f353a;
}

@media (min-width: 1080px) {
    .sites a:hover {
        color: #9f353a;
    }

    .pages a:hover {
        background: #9f353a;
        color: #fff;
    }
}

@media (max-width: 991px) {
    .sites {
        font-size: 12px;
        padding: 6px 0px;
    }

    .pages {
        padding: 30px 0px;
    }

    .inside-title {
        font-size: 24px;
        padding: 14px 0px;
    }
}

.content-share-button,
.article_icon-share {
    display: none
}

.content-share a {
    display: inline-block;
    position: relative;
    margin-left: 10px
}

.content-share a img {
    vertical-align: middle
}

.content-share {
    text-align: right
}

.content-share .images-after {
    display: none
}

.content-share a p {
    position: absolute;
    width: 100%;
    text-align: center;
    font-size: 14px;
    left: 0;
    bottom: 5px;
    color: #4D4D4D;
    font-weight: 700;
    line-height: 20px;
    height: 20px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

@media (min-width: 1080px) {
    .content-share a:hover .images-after {
        display: inline-block
    }

    .content-share a:hover .images-before {
        display: none
    }
}

.content-share-fix a {
    display: block;
    margin-bottom: 10px
}

.content-share-fix {
    position: fixed;
    top: 260px;
    z-index: 10
}

@media (min-width: 768px) {
    .content-share-fix {
        left: 0 !important
    }
}

@media (max-width: 767px) {

    .content-share-button,
    .article_icon-share {
        display: block
    }

    .content-share-fix {
        background: rgba(230, 230, 230, 0.6);
        padding: 5px;
        top: 100px;
        left: -50px
    }

    .content-share-fix a {
        margin-left: 0;
        margin-bottom: 5px
    }

    .content-share-button {
        cursor: pointer;
        width: 22px;
        background: rgba(230, 230, 230, 0.6);
        position: absolute;
        top: 50px;
        right: -22px;
        text-align: center;
        line-height: 14px;
        font-size: 12px;
        font-weight: 700;
        padding: 5px 0
    }

    .content-share-button img {
        margin-top: 5px
    }

    .article_icon-share {
        text-align: center;
        line-height: 10px;
        padding-bottom: 5px
    }
}

.heads-operating {
    float: right;
}

.hello-text {
    display: inline-block;
    color: #fff;
}

.fa-bell {
    font-size: 20px;
    width: 25px;
    height: 25px
}

.header-icon-item {
    position: relative;
    display: inline-block;
    margin-top: 38px;
    font-size: 12px;
    margin: 28px 10px;
    text-align: center;
    vertical-align: top;
    color: #fff;
}

.header-icon-item img {
    vertical-align: middle;
}

.header-icon-item a {
    color: #fff;
}

.header-icon-item p {
    color: #fff;
}

.heads-phone .member-center-btn p {
    width: 40px;
    height: 18px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 1199px) {
    .fa-bell {
        width: 24px;
        height: 24px;
    }
}


@media (max-width: 1024px) {
    .header-icon-item {
        margin: 0;
    }
}

/* nav search區塊 */
.heads-search {
    width: 70%;
    margin: auto;
    padding: 0px 0px 10px 0px;
}

.heads-search .index-forms-big,
.heads-search .index-forms-small {
    width: 290px !important;
}

.heads-search select,
.heads-search .choice-city,
.heads-search select span {
    width: 285px !important;
}

.heads-search .index-forms-search {
    height: 35px;
    line-height: 35px;
}

.heads-search .index-forms-main {
    margin-right: 150px;
}

@media (max-width: 1024px) {
    .nav-search-btn {
        font-size: 10px;
        border-radius: 5px;
        background: #9f353a;
        color: #fff;
        text-align: center;
        display: block;
        position: absolute;
        left: 44px;
        top: 14.5px;
        padding: 4px;
    }

    .nav-search-phone-block {
        display: none;
        position: fixed;
        width: 100%;
        left: 0;
        top: 50px;
        background: #1a1a1a;
        z-index: 1001;
        padding: 0px 6px;
        padding-bottom: 5px;
    }

    .heads-search .choice-city {
        width: 222px !important;
        margin-left: 2px;
        height: 30px;
        line-height: 30px;
    }

    .heads-search .select2-container {
        width: 211px !important;
    }

    .heads-search .select2-container--default .select2-selection--multiple {
        width: 209px;
        height: 30px !important;
        line-height: 17px;
        min-height: 30px
    }

    .heads-search .index-forms-main {
        margin-right: 0px;
    }

    .heads-search .index-forms-search {
        padding: 0px;
        height: 30px;
        line-height: 30px;
        font-size: 13px;
        width: 100px;
    }

    .search-phone-item {
        width: 226px;
    }
}

@media (max-width: 770px) {
    .nav-search-phone-block {
        display: none;
        position: fixed;
        width: 100%;
        left: 0;
        top: 50px;
        background: #1a1a1a;
        z-index: 1001;
        padding: 0px 6px;
        padding-bottom: 5px;
    }

    .heads-search .choice-city {
        width: 157px !important;
    }

    .heads-search .select2-container {
        width: 170px !important;
    }

    .heads-search .select2-container--default .select2-selection--multiple {
        width: 161px;
    }

    .search-phone-item {
        width: 163px;
    }
}

@media (max-width: 450px) {

    .heads-search .choice-city,
    .search-phone-item,
    .heads-search .select2-container,
    .heads-search .select2-container--default .select2-selection--multiple {
        width: 100% !important;
    }

    .search-phone-item {
        margin-top: 5px;
    }

    .heads-search .index-forms-search {
        width: 100%;
        height: 30px;
        line-height: 30px;
        margin-top: 5px;
    }
}

/* nav search區塊 END */

/* nav notice區塊 */

/* 調卷軸樣式 */
.notice-menu-block::-webkit-scrollbar {
    width: 5px;
    margin-left: 0px;
    background-color: #f8f8f8;
}

.notice-menu-block::-webkit-scrollbar-track {
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

.notice-menu-block::-webkit-scrollbar-thumb {
    -webkit-border-radius: 4px;
    border-radius: 4px;
    background: rgb(219, 219, 219);
}

.notice-menu-block {
    position: fixed !important;
    top: 0;
    z-index: 1;
    border: none;
    background-color: #f8f8f8;
    padding: 0px;
    left: unset !important;
    right: 0 !important;
    width: 0px;
    max-width: 400px !important;
    height: 100%;
    transform: none !important;
    overflow-x: hidden;
    overflow: auto !important;
    border-radius: 0px;
}

.notice-menu-block i {
    color: #444 !important;
}

.notice-menu-block .fa-times {
    position: absolute;
    right: 10px;
    top: 10px;
    font-size: 20px;
    cursor: pointer;
}

.heads-phone .notice-menu-block .fa-close {
    position: absolute;
    right: 10px;
    top: 10px;
    font-size: 20px;
    cursor: pointer;
}

.notice-item {
    font-size: 12px;
    color: #444 !important;
    display: block !important;
    margin: 2px 0;
    padding: 10px 10px 0 10px;
    border-bottom: #e0e0e0 1px solid;
    text-align: left
}

.notice-item-btn {
    cursor: pointer;
}

.notice-item-btn:hover {
    opacity: 0.8;
    color: #9f353a !important;
}

.notice-menu {
    margin-top: 40px;
}

.notice-menu-content {
    padding: 24px 10px;
}

.notify-all-read {
    color: #9f353a !important;
    display: block;
    float: right;
    margin-right: 10px;
}

#notify-bell-btn {
    outline: none;
}

.notice-item-notread {
    background-color: #faeaeb;
}

.notice-item-notread .circle {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #9f353a;
    float: right;
}

.header-notice-center .fa-bell {
    margin: 0px;
}

.header-notice-center .fa-times {
    margin: 0px;
    font-size: 20px;
    text-align: right;
    position: absolute;
    top: 10px 10px 0px 10px;
    right: 10px;
    color: #999999;
    cursor: pointer;
}






.notify-class-title {
    position: relative;
    color: #444 !important;
    font-weight: bold;
    background-color: #eeeded;
    cursor: pointer;
    font-size: 14px;
    text-align: left;
    height: 25px;
    line-height: 25px;
    margin: 5px 0;
}

.notify-class-title .fa {
    float: right;
    line-height: 25px;
}

.notice-item-created-at {
    font-size: 12px;
    color: #b7b7b7;
    display: flex;
    justify-content: flex-end;
}

.clock {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 5px;
}

@media (max-width: 450px) {
    .footer-phone-fix .notice-menu-block {
        top: unset !important;
        bottom: 58px !important;
        left: 10px !important;
        transform: none !important;
        position: fixed !important;
    }

    .notice-menu-block {
        top: 49px !important;
        max-width: 100% !important;
    }
}

/* nav notice區塊 END */

/* nav 會員中心 */

.member-center-btn {
    cursor: pointer;
    display: inline-block;
    margin-left: 5px;
}

.member-center-menu-block {
    position: absolute;
}

.member-center-menu-block .arrow {
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0px 5px 5px 5px;
    border-color: transparent transparent #eee transparent;
    margin: auto;
}

.member-center-menu {
    width: 200px;
    text-align: center;
    background-color: #f8f8f8;
    box-shadow: 0px 0px 10px rgba(180, 180, 180, 0.7);
}

.member-center-menu-item {
    padding: 7px 10px;
    border-bottom: 1px solid #ddd;
}

.member-center-menu-item a {
    color: #444;
    display: block;
}

.member-center-menu-item:hover {
    background-color: #e4e4e4;
}

.member-center-menu-item em {
    border-radius: 50%;
    display: inline-block;
    background: #bd454b;
    color: #fff;
    line-height: 16px;
    width: 16px;
    text-align: center;
    font-size: 12px;
}

.member-center-alert {
    color: #9f353a;
}

.heads-phone-item {
    display: inline-block;
    margin-left: 7px;
    font-size: 12px;
    color: #fff;
}

@media (max-width: 1024px) {
    .member-center-menu {
        width: 180px;
    }

    .member-center-menu-block {
        top: 45px;
        right: 0px !important;
    }
}

/* nav 會員中心 END */


/* Footer */
.footers-pc-menus {
    width: 17%;
}

.footers-pc-googles {
    width: 35%;
    margin-right: 34px;
}

.footers-pc-googles .footers-pc-link {
    display: flex !important;
}

.footers-pc-copyright-announcement {
    width: 19%;
    text-align: justify;
}

.footers-pc-copyright-announcement p {
    font-size: 12px;
    line-height: 23px;
    color: #fff;
}

.footers-pc-title {
    color: #fff;
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 15px;
}

.footers-pc-title span {
    font-size: 15px;
}

.footers-pc-title .fa-angle-down {
    display: none;
}

.footers-pc-title .fa-angle-up {
    display: none;
}

.footers-pc-link a {
    color: #fff;
    font-size: 14px;
}

.footers-pc-link i {
    margin-right: 8px;
}

.footers-pc-link {
    margin-bottom: 25px;
}

.footers-pc-link p {
    margin-bottom: 10px;
}

.footers-tracking a {
    display: inline-block;
    width: 33px;
    margin-right: 10px;
}

.footers-tracking a img {
    width: 100%;
}

.footers-cooperation a {
    display: inline-block;
    width: 80px;
    margin-right: 10px;
    margin-bottom: 10px;
}

.footers-cooperation a img {
    width: 100%;
}

.footers-pc-link li {
    float: left;
    margin-right: 20px;
}

.footer-Follow-li {
    display: inline-block;
    text-align: center;
}

.footer-language {
    color: #FFFFFF;
    font-size: 12px;
    margin-bottom: 15px;
}

.footer-language a {
    display: inline-block;
    margin-left: 10px;
}

.footer-language a img {
    vertical-align: middle;
}

.images-after {
    display: none;
}

.footer-texts {
    font-size: 12px;
    text-align: center;
    color: #fff;
    padding-bottom: 10px;
}

@media (min-width: 1080px) {
    .footer-language a:hover .images-after {
        display: inline-block;
    }

    .footer-language a:hover .images-before {
        display: none;
    }
}

@media (min-width: 992px) {
    .footers-pc-link {
        display: block !important;
    }
}

@media (max-width: 991px) {
    .footers-pc-copyright-announcement {
        width: 100%;
    }

    .footers-pc-menus {
        width: 100%;
    }

    .footers-pc-googles {
        width: 100%;
        margin-right: unset;
    }

    .footers-pc-googles .footers-pc-link {
        display: flex !important;
    }

    .heads-phone-footer {
        display: block !important;
        position: static;
    }

    .footers-bottom {
        padding: 0px;
        padding: 10px 0px;
    }

    .footers-pc-groups-small {
        width: 100%;
    }

    .footers-pc-groups-big {
        width: 100%;
    }

    .footers-pc-link {
        display: none;
    }

    .footers-pc-title {
        line-height: 18px;
        border-top: 1px solid #fff;
        padding: 13px 10px;
        margin: 0px;
    }

    .footers-pc-title i {
        display: inline-block;
        line-height: 18px;
    }

    .footers-pc-title,
    .footers-pc-title span {
        font-size: 14px;
    }

    .footers-pc-title .fa-angle-down {
        display: block;
    }

    .footers-pc {
        padding: 0px;
    }

    .footer-texts {
        border-top: 1px solid #fff;
        padding-top: 10px;
    }

    .footers-pc-link {
        background: #111111;
        margin-bottom: 0px;
        padding: 0px 10px 13px 10px;
    }

    .footers-pc-link p:last-child {
        margin-bottom: 0px;
    }

    .footers-pc-title-hover {
        background: #111111;
    }

    .footers-pc-title-hover .fa-angle-down {
        display: none;
    }

    .footers-pc-title-hover .fa-angle-up {
        display: block;
    }

    .footers-pc-link li {
        margin: 0px;
        width: 25%;
        text-align: center;
    }
}

.footers-pc-link iframe {
    width: 450px;
    height: 300px;
}

@media (max-width: 450px) {

    .fix-fb-btn,
    .fix-line-btn,
    .fix-top {
        display: none;
    }

    .footer-fix-login-students li {
        width: 20%;
    }
}

.select2-container--open {
    z-index: 9999999
}

/* 2021 02 18 新加樣式 */
.footer-background-gray {
    background: #cfd0d0;
    height: 50px;
}

.footer-background-red {
    background: #ad1729;
    height: 50px;
}

.footers {
    margin-top: 50px;
}

@media (max-width: 767px) {
    .footer-background-gray {
        height: 10px;
    }

    .footer-background-red {
        height: 10px;
    }
}

/* Footer END*/


/* All */
.compensate-for-scrollbar {
    margin: 0px !important;
}

a:hover {
    text-decoration: none !important;
    opacity: 0.8;
}

.swal2-styled.swal2-confirm {
    background-color: #b95755 !important;
}

.swal2-container {
    z-index: 1100 !important;
}

.btn-red {
    background: #9f353a;
    color: #fff !important;
    border-radius: 2rem;
    padding: 0.375rem 0.5rem;
}

.btn-red:hover {
    color: #fff !important;
}

.btn-black {
    background: #494949;
    color: #fff;
}

.btn:hover {
    opacity: 0.8 !important;
    color: #fff;
}

.btn-smail {
    padding: 0rem 0.7rem;
}

.bold-text {
    font-weight: bold;
}

.under-line {
    text-decoration: underline;
}

i {
    margin-right: 5px;
}

.price-text {
    font-size: 22px;
    font-weight: bold;
    color: #9f353a;
}

.currency {
    font-size: 0.5em;
    color: #444;
}

.more-btn {
    background: #9f353a;
    color: #fff !important;
    border-radius: 2rem;
    padding: 0px 20px;
    font-size: 12px;
    line-height: 25px;
}

.tag-block {
    line-height: 25px;
    color: #666;
    font-size: 12px;
    width: 100%;
    display: inline-block;
    margin-top: 5px;
}

.tag-block .visit-tag {
    margin-left: 15px;
}

.info-contact {
    background: #f3f3f3;
    border-radius: 5px;
    padding: 3%;
    margin: 2% 0;
}

.info-contact h2 {
    text-align: left !important;
    font-size: 18px !important;
    font-weight: bold !important;
    color: #555 !important;
    margin: 0px !important;
    padding: 0px !important;
    background: none !important;
}

.info-contact p {
    font-size: 15px;
    margin: 0;
}

.info-contact a {
    font-size: 15px !important;
    color: #333333;
    text-decoration: underline;
}

.reply-arrow {
    max-width: 20px;
}

.reply-img {
    max-width: 75px;
    display: inline-block;
    vertical-align: middle;
}

.pre-next-btn-block button {
    border: unset;
    margin: 5px;
    color: #fff !important;
    background-color: unset;
    font-size: 14px;
}

.pre-next-btn-block .pre-btn a,
.pre-next-btn-block .next-btn a {
    color: #fff !important;
}

.unit {
    font-size: 0.8rem;
}

.prompt-text {
    text-align: center;
    color: #AD1729;
    font-size: 16px;
    font-weight: bold;
    padding: 14px 0px 10px 0px;
}

.rest-password-block {
    max-width: 680px !important;
}

.img-block {
    position: relative;
}

.tag {
    position: absolute;
    right: 0;
    padding: 5px 6px;
    background-color: #9f353a;
    border-radius: 5px;
    color: white;
}

.alert-span {
    color: #AD1729;
    font-weight: bold;
    font-size: 18px;
}

.tag-index {
    position: absolute;
    right: 0;
    top: 0;
    padding: 5px 6px;
    background-color: #9f353a;
    border-radius: 5px;
    color: white;
}

@media (max-width: 767px) {
    .prompt-text {
        font-size: 14px;
        padding: 10px 0px;
    }
}


@media (max-width: 450px) {
    .pre-next-btn-block button {
        width: 47%;
        float: left;
        display: flex;
    }
}

/* 分頁 */
@media (max-width: 450px) {
    .page-link {
        padding: 0.3rem 0.52rem;
    }

}

.page-item.active .page-link {
    background: #af4d52;
    border-color: #af4d52;
}

.page-link {
    color: #444;
}

/* All END */

.index-video-swiper {
    position: relative;
}

.index-video-swiper iframe {
    width: 100%;
    height: 248px !important;
    vertical-align: middle;
}

.index-video-bottom {
    background: #d8d9d9;
    padding: 10px 50px;
    color: #3E3A39;
    font-size: 18px;
    font-weight: bold;
}

.index-video-bottom span {
    display: block;
    line-height: 20px;
    height: 40px;
    overflow: hidden;
}

.logo-title {
    text-align: center;
    margin-bottom: 40px;
}

.logo-title img {
    height: 37px;
    vertical-align: -5px;
}

.logo-title h2 {
    display: inline-block;
    font-weight: bold;
    color: #232121;
    font-size: 28px;
    border-bottom: 1px solid #6e6b6a;
    padding: 0px 15px 5px 15px;
}

.index-video {
    padding: 100px 0px;
}

.index-swiper .swiper-button-next {
    right: -10px;
}

.index-swiper .swiper-button-prev {
    left: -10px;
}

.index-swiper .swiper-button-next,
.index-swiper .swiper-button-prev {
    font-size: 40px;
    opacity: 0.7;
    color: #b6b6b6;
    width: 40px;
    height: 40px;
    line-height: 40px;
    margin-top: -20px;
    text-align: center;
}

.index-swiper .swiper-button-next:focus,
.index-swiper .swiper-button-prev:focus {
    outline: none;
}

.index-swiper .swiper-pagination {
    position: absolute;
    width: 100%;
    text-align: center;
    bottom: -40px;
}

.index-swiper .swiper-pagination-bullet {
    width: 14px;
    height: 14px;
    background: #a6a6a7;
    margin: 0px 10px;
    opacity: 1;
}

.index-swiper .swiper-pagination-bullet-active {
    background: #9f353a;
}

.index-video-swiper .swiper-button-next,
.index-video-swiper .swiper-button-prev {
    margin-top: -36px;
}

.index-more {
    text-align: center;
    margin-top: 60px;
}

.index-more a {
    display: inline-block;
    border-radius: 15px;
    background: #d0d0d0;
    padding: 15px 70px;
    color: #727171;
    font-size: 16px;
    font-weight: bold;
}

@media (min-width: 1080px) {

    .index-more a:hover,
    .btn-red:hover,
    .btn-black:hover,
    .index-lecture-ul li a:hover {
        opacity: 0.8;
    }

    .news-article-group:hover .news-article-images img {
        transform: scale(1.1);
    }
}

.index-numbers {
    background: url(/assets/images/backgorund-darks.png) no-repeat center;
    background-size: cover;
    padding: 374px 0px;
}

.index-numbers-images {
    height: 68px;
    text-align: center;
}

.index-numbers-images img {
    vertical-align: middle;
}

.index-numbers-number {
    color: #ffbe2d;
    font-size: 30px;
    font-weight: bold;
    text-align: center;
    margin: 14px 0px;
}

.index-numbers-name {
    color: #FFFFFF;
    font-size: 18px;
    text-align: center;
}

.index-numbers li {
    float: left;
    width: 33.33%;
    text-align: center;
}

.index-join {
    background: url(/assets/images/indexjoin.png) no-repeat center;
    padding: 120px 0px 64px 0px;
}

.swiper-container {
    padding: 0px;
}

.index-join-main {
    width: 480px;
}

.index-join-title {
    text-align: right;
}

.index-join-title img {
    max-width: 100%;
}

.index-join-title p span {
    display: inline-block;
    font-size: 24px;
    font-weight: bold;
    border-bottom: 1px solid #6e6b6a;
    padding-bottom: 5px;
    padding-left: 34px;
}

.index-join-text {
    color: #969697;
    font-size: 14px;
    line-height: 25px;
    height: 100px;
    overflow: hidden;
    margin-top: 20px;
    margin-bottom: 70px;
}

.index-join-link {
    text-align: right;
}

.index-join-link a {
    display: inline-block;
    line-height: 40px;
    width: 180px;
    margin-left: 25px;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
}

.index-join-link a img {
    display: inline-block;
    vertical-align: -5px;
    margin-right: 10px;
}

.index-join-link .btn-red img {
    vertical-align: -8px;
}

.index-join-contents {
    position: relative;
}

.index-join-images {
    width: 650px;
    left: 0;
    bottom: -170px;
    position: absolute;
    max-width: 600px;
}

.index-lecture-main {
    background: url(/assets/images/background-grey.png) no-repeat center bottom;
    background-size: cover;
    padding: 180px 0px 220px 0px;
}

.index-lecture-ul li {
    float: left;
    width: 33.33%;
}

.news-article-group {
    margin: 0px 5px;
    position: relative;
    background: #fff;
    margin-bottom: 58px;
}

.news-article-images {
    overflow: hidden;
    display: block;
}

.news-article-images img {
    width: 100%;
    vertical-align: middle;
    transition: all 0.6s;
}

.news-article-bottom {
    padding: 20px;
}

.news-article-title a {
    display: block;
    color: #3E3A39;
    font-size: 18px;
    font-weight: bold;
    line-height: 22px;
    height: 44px;
    overflow: hidden;
}

.news-article-content {
    color: #969697;
    font-size: 14px;
    line-height: 22px;
    height: 66px;
    overflow: hidden;
    margin: 15px 0px 10px 0px;
}

.class-tag a,
.visit-tag a {
    color: #666;
    font-size: 12px;
}

.class-tag i,
.visit-tag i {
    color: #666;
    font-size: 12px;
}

.index-lecture-link {
    line-height: 25px;
    color: #B4B5B5;
}

.index-lecture-link .index-lecture-more {
    display: inline-block;
    font-size: 12px;
    padding: 0px 20px;
}

.index-lecture-link .visit-tag {
    margin-left: 10px;
}

.news-article-author {
    display: block;
    position: absolute;
    left: 10px;
    top: -35px;
    z-index: 1;
}

.news-article-author img {
    width: 86px;
    height: 86px;
    vertical-align: middle;
    border-radius: 50%;
    border: 2px solid #fff;
    background: #9f353a;
}

.index-lecture .index-more a {
    background: #9f353a;
    color: #fff;
}

.index-news {
    padding: 100px 0px;
}

.index-news .news-article-title {
    border-bottom: 1px solid #3e3a39;
    padding-bottom: 10px;
}

.index-news .class-tag {
    margin-left: 10px;
}

.index-news-phone {
    display: none;
}

.index-news-phone-swiper {
    position: relative;
}

.index-special {
    background: url(/assets/images/background-grey.png) no-repeat center bottom;
    background-size: cover;
    padding: 60px 0px 230px 0px;
}

.index-special ul li {
    float: left;
    width: 25%;
}

.index-special-group {
    margin: 0px 40px;
    text-align: center;
}

.index-special-group img {
    transition: all 0.6s;
}

.index-special-group .title {
    color: #9f353a;
    font-size: 18px;
    font-weight: bold;
    line-height: 24px;
    margin: 30px 0px 20px 0px;
}

.index-special-group .texts {
    color: #3E3A39;
    font-size: 15px;
    line-height: 24px;
    text-align: left;
}

.index-special-phone {
    display: none;
}

.index-special-phone .index-special-group {
    margin: 0px;
}

.index-teacher {
    padding: 80px 0;
}

.index-teacher-swiper {
    position: relative;
}

.index-teachers {
    display: block;
    position: relative;
    border-radius: 10px;
    overflow: hidden;
}

.index-teachers-images {
    width: 100%;
    vertical-align: middle;
}

.index-teachers-bottom {
    background: rgba(0, 0, 0, 0.7);
    position: absolute;
    width: 100%;
    left: 0;
    bottom: 0;
    padding: 20px 30px;
    box-sizing: border-box;
    border-radius: 0 0 10px 10px;
}

.index-teachers-name {
    color: #FFFFFF;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
}

.index-teachers-stars {
    display: inline-block;
    width: 25px;
    height: 24px;
    background: url(/assets/images/star.svg) no-repeat;
    vertical-align: middle;
}

/* .index-teachers-star{text-align: center;font-size: 12px;color: #fff;margin: 10px 0px;} */
.index-teachers-star {
    text-align: center;
    font-size: 16px;
    color: #fff;
    margin: 10px 0px;
    font-weight: bold;
}

.index-teachers-texts {
    color: #fff;
    font-size: 16px;
    text-align: center;
}

.index-teachers-place {
    font-size: 16px;
    color: #fff;
    font-weight: bold;
    text-align: center;
    margin-top: 10px;
}

.index-teachers-place img {
    vertical-align: middle;
    margin-right: 5px;
}

.index-scores {
    margin-left: 66px;
    margin-right: 30px;
    padding-top: 2px;
}

.index-score {
    font-size: 14px;
    color: #fff;
    line-height: 18px;
    margin-top: 10px;
}

.index-score-line {
    height: 14px;
    border-radius: 50px;
    background: #9f353a;
    display: inline-block;
    width: 0;
    transition: width 2s;
}

.index-teacher-links {
    text-align: center;
    margin-top: 12px;
}

.index-teacher-links span {
    display: inline-block;
    color: #9f353a;
    font-size: 14px;
    font-weight: bold;
    background: #fff;
    line-height: 34px;
    border-radius: 10px;
    padding: 0px 20px;
}

.index-teachers-first {
    width: 60px;
    height: 60px;
    background: url(/assets/images/award-1.png) no-repeat;
    position: absolute;
    left: 10px;
    top: 20px;
    z-index: 10;
}

.index-teachers-second {
    width: 60px;
    height: 60px;
    background: url(/assets/images/award-2.png) no-repeat;
    position: absolute;
    left: 10px;
    top: 20px;
    z-index: 10;
}

.index-teachers-three {
    width: 60px;
    height: 60px;
    background: url(/assets/images/award-3.png) no-repeat;
    position: absolute;
    left: 10px;
    top: 20px;
    z-index: 10;
}

.index-teacher-none {
    display: none;
}

.index-teacher-nones {
    display: block;
}

.index-banner {
    position: relative;
}

.index-banner-images {
    width: 100%;
    vertical-align: middle;
}

.index-banner .swiper-button-next {
    right: 20px;
}

.index-banner .swiper-button-prev {
    left: 20px;
}

.index-banner .swiper-button-next i,
.index-banner .swiper-button-prev i {
    color: #fff;
}

.index-banners {
    position: relative;
}

.index-forms {
    position: absolute;
    width: 100%;
    z-index: 999;
    left: 0;
    bottom: 16%;
}

.index-forms-titles {
    text-align: center;
    color: #FFFFFF;
    font-size: 30px;
    font-weight: bold;
    margin-bottom: 50px;
}

.index-forms-search {
    display: block;
    width: 142px;
    height: 48px;
    line-height: 48px;
    border-radius: 5px;
    background: #9f353a;
    color: #fff;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
}

.index-forms-search i {
    margin-right: 10px;
}

.index-forms-main {
    margin-right: 152px;
}

.index-forms-big {
    width: 36%;
    box-sizing: border-box;
}

.index-forms-small {
    width: 28%;
    box-sizing: border-box;
}

.choice-number {
    color: #FFFFFF;
    font-size: 16px;
    text-align: center;
    padding-top: 5px;
}

.choice-city {
    font-family: "微軟正黑體" !important;
    height: 48px;
    -webkit-appearance: none;
    width: 100%;
    background: #aaabab;
    color: #fff;
    border-radius: 5px;
    font-size: 16px;
    border: none;
    cursor: pointer;
    display: block;
}

.choice-sports-input {
    font-size: 16px;
    height: 48px;
    -webkit-appearance: none;
    width: 100%;
    border-radius: 5px;
    font-size: 16px;
    border: none;
    background: #fff;
    box-sizing: border-box;
    padding: 0 10px;
    font-family: "微軟正黑體" !important
}

.choice-sports {
    position: relative;
}

.choice-sports-mains {
    position: absolute;
    width: 100%;
    z-index: 1001;
    left: 0;
    display: none;
    padding-top: 5px;
}

.choice-sports-main {
    box-shadow: 0px 0px 5px #333;
    background: rgba(204, 204, 204, 0.9);
    box-sizing: border-box;
    padding: 10px;
    border-radius: 5px;
    color: #535151;
    font-size: 14px;
}

.choice-sports-name {
    display: block;
    width: 60%;
    cursor: pointer;
}

.choice-sports-number {
    display: block;
    width: 40%;
    text-align: right;
    font-size: 12px;
}

.choice-sports-main li {
    line-height: 18px;
    margin-top: 10px;
}

.index-forms-search-phone {
    display: none;
}

.index-banner .swiper-button-next,
.index-banner .swiper-button-prev {
    margin-top: -120px;
}

.banner-title {
    color: #fff;
    background-color: #333333;
    z-index: 1;
    width: 100%;
    text-align: center;
    padding: 20px 0;
    box-shadow: 0px 9px 0px #9f353a;
    position: relative;
}

.banner-title h1 {
    font-size: 40px;
    font-weight: bold;
    letter-spacing: 10px;
}

.banner-title p {
    font-size: 20px;
    letter-spacing: 4px;
}

.index-teachers-star .rating-container {
    display: inline-block;
    font-size: 20px;
}

.index-teachers-star .rating-container .star {
    margin: 0 0.5px;
}

.index-teachers-star .rating-container .filled-stars {
    color: #fed400;
    -webkit-text-stroke: unset;
    text-shadow: unset;
}

.index-swiper .swiper-pagination-bullet {
    width: 18px;
    height: 18px;
    background: url(/assets/images/dumbell-grey.svg) no-repeat;
    margin: 0px 3px;
    opacity: 1;
}

.index-swiper .swiper-pagination-bullet-active {
    background: url(/assets/images/dumbell-red.svg) no-repeat;
}

.index-swiper .swiper-pagination-bullet:focus {
    outline: none;
}

.index-teacher-phone {
    display: none;
}

.star-block {
    display: inline-block;
}

.green-star {
    color: #38c172;
}

.orange-star {
    color: #ffa824;
}

.black-star {
    color: #969494;
}

@media (min-width: 1080px) {
    .choice-sports:hover .choice-sports-mains {
        display: block;
    }

    .index-special-group:hover img {
        -webkit-transform: rotateY(360deg);
    }

    .choice-sports-ul li:hover .choice-sports-name {
        color: #9f353a;
    }

    .choice-sports-ul li:hover .choice-sports-number {
        color: #9f353a;
    }
}

@media (max-width: 1600px) {
    .index-forms-titles {
        margin-bottom: 20px;
    }
}

@media (max-width: 1280px) {
    .containers {
        box-sizing: border-box;
    }

    .index-join-images {
        display: none;
    }

    .index-join-main {
        width: 100%;
    }

    .index-join-title {
        text-align: center;
    }

    .index-join-text {
        text-align: left;
        height: auto;
        margin: 22px 0px;
    }

    .index-join-link {
        text-align: center;
    }

    .index-join-title p {
        display: inline-block;
    }

    .index-join-title img {
        height: 37px;
        vertical-align: middle;
    }

    .index-join-title p span {
        padding: 0px 15px 5px 15px;
        font-size: 23px;
    }

    .index-join {
        padding: 45px 0px;
    }
}

@media (max-width: 1000px) {
    .index-forms {
        position: static;
        background: #dedfdf;
        padding: 30px 0px;
    }

    .index-forms-big,
    .index-forms-small {
        width: 100%;
        margin-bottom: 5px;
    }

    .index-forms-titles {
        color: #595757;
        font-size: 18px;
        font-weight: bold;
    }

    .index-forms-search-phone {
        display: block;
        width: 106px;
        line-height: 28px;
        height: 28px;
        border-radius: 50px;
        margin: 0px auto;
    }

    .index-forms-search-pc {
        display: none;
    }

    .index-forms-main {
        margin: 0px;
    }

    .index-forms-search i {
        margin-right: 5px;
    }

    .choice-sports-input {
        height: 34px;
        line-height: 34px;
        font-size: 15px;
    }

    .choice-city {
        height: 34px;
        line-height: 34px;
        font-size: 15px;
    }
}

@media (max-width: 767px) {
    .index-video {
        padding: 20px 0px;
    }

    .index-special-group .title {
        font-size: 16px;
    }

    .index-swiper .swiper-button-next {
        right: 0px;
    }

    .index-swiper .swiper-button-prev {
        left: 0px;
    }

    .index-video-bottom span {
        font-size: 17px;
    }

    .index-video-bottom {
        padding: 10px 20px;
    }

    .index-video-swiper iframe {
        height: 200px !important;
    }

    .index-swiper .swiper-pagination-bullet {
        width: 17px;
        height: 17px;
        margin: 0px 5px;
    }

    .index-more a {
        font-size: 14px;
    }

    .index-more {
        margin-top: 30px;
    }

    /* .index-swiper .swiper-pagination{bottom: 5px;} */
    .index-special-phone .swiper-pagination {
        bottom: -37px;
    }

    .index-numbers li {
        width: 100%;
        margin-bottom: 25px;
    }

    .index-numbers-images {
        display: inline-block;
    }

    .index-numbers-bottom {
        display: inline-block;
        min-width: 120px;
        margin-left: 15px;
        vertical-align: -20px;
    }

    .index-numbers {
        padding: 150px 0px 75px 0px;
    }

    .index-numbers-number {
        font-size: 22px;
        margin: 0px 0px 5px 0px;
    }

    .index-numbers-name {
        font-size: 14px;
    }

    .index-numbers-images img {
        width: 50px;
    }

    .index-numbers-images {
        height: 42px;
    }

    .index-join-link a {
        font-size: 14px;
        margin-left: 0px;
        margin: 0px 2px;
        width: 140px;
    }

    .index-join-link a img {
        margin-right: 5px;
    }

    .index-lecture-ul li {
        width: 100%;
        margin-bottom: 25px;
    }

    .news-article-author img {
        width: 60px;
        height: 60px;
    }

    .news-article-author {
        top: -18px;
    }

    .news-article-bottom {
        padding: 10px;
    }

    .news-article-title a {
        font-size: 17px;
    }

    .news-article-content {
        margin: 5px 0px;
    }

    .index-lecture-main {
        padding: 40px 0px 20px 0px;
        background: #d8d9d9;
    }

    .index-lecture-link .index-lecture-more {
        display: block;
        padding: 0px;
        width: 100%;
        text-align: center;
    }

    .index-lecture .index-more {
        margin-top: 0px;
    }

    .index-news-pc {
        display: none;
    }

    .index-news-phone {
        display: block;
    }

    .index-news {
        padding: 50px 0px;
    }

    /* .index-news-phone .swiper-button-next, .index-news-phone .swiper-button-prev{margin-top: -119px;} */
    .index-news-phone .swiper-button-next {
        right: 5px;
    }

    .index-news-phone .swiper-button-prev {
        left: 5px;
    }

    .index-news-phone .news-article-group {
        margin: 0px;
    }

    .index-special-pc {
        display: none;
    }

    .index-special-phone {
        display: block;
        position: relative;
    }

    .index-special {
        padding: 20px 0px 100px 0px;
    }

    .index-special .swiper-button-next {
        right: -10px;
    }

    .index-special .swiper-button-prev {
        left: -10px;
    }

    .index-special-title {
        font-size: 16px;
        margin: 5px 0px;
    }

    .index-special-texts {
        font-size: 14px;
        line-height: 18px;
    }

    .index-teacher {
        padding: 30px 0px
    }

    .index-teacher-pc {
        display: none;
    }

    .index-teacher-phone {
        display: block;
    }

    .index-special-group img {
        width: 60px;
    }

    .index-banner .swiper-button-next,
    .index-banner .swiper-button-prev {
        font-size: 25px;
        margin-top: -40px;
    }
}

@media (max-width: 1080px) {
    .fancybox-container {
        display: block !important;
    }

    .quick-menu {
        width: 539px;
        padding-left: 54px;
    }

    .quick-menu-item {
        width: 35%;
        float: left;
        text-align: center;
        margin: 20px;
        padding: 15px;
        margin-left: 30px;
    }

    .quick-menu-item {
        background-color: #d64541;
    }

    .quick-menu-item:nth-child(3n) {
        background-color: #666666;
    }

    .quick-menu-item:nth-child(3n+1) {
        background-color: #666666;
    }

    .quick-menu-item a {
        display: block;
    }

    .quick-menu-item p {
        color: #fff;
        font-size: 16px;
        margin-top: 10px;
    }

    .quick-menu-title {
        text-align: center;
        font-size: 20px;
        font-weight: bold;
        margin-bottom: 10px;
    }

    .banner-title {
        bottom: 21%;
    }

    .banner-title h1 {
        font-size: 29px;
    }

    .banner-title p {
        font-size: 6px;
    }
}

@media (max-width: 450px) {
    .quick-menu {
        padding-left: 43px;
    }

    .quick-menu-item {
        width: 44%;
        margin: 6px;
    }

    .quick-menu-item img {
        width: 61%;
    }

    .quick-menu-item p {
        font-size: 13px;
    }

    .quick-menu-title {
        font-size: 15px;
    }

    .banner-title {
        bottom: 20%;
        padding: 7px 0;
    }

    .banner-title h1 {
        font-size: 16px;
        letter-spacing: 6px;
    }

    .banner-title p {
        font-size: 12px;
        letter-spacing: 0px;
    }

}

.recruit-banners img {
    width: 100%;
    vertical-align: middle;
}

.recruit-title {
    text-align: center;
    margin-bottom: 40px;
}

.recruit-title img {
    height: 37px;
    vertical-align: -5px;
}

.recruit-title i {
    display: inline-block;
    font-weight: bold;
    color: #232121;
    font-size: 28px;
    border-bottom: 1px solid #6e6b6a;
    padding: 0px 15px 5px 15px;
}

.recruit-form {
    padding: 60px 0px;
}

.recruit-message-title {
    background: #9f353a;
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    padding: 8px 0px;
}

.recruit-message-content {
    padding: 40px 0px 25px 0px;
}

.recruit-name {
    color: #2D2D2D;
    font-size: 16px;
    font-weight: bold;
}

.recruit-name i {
    display: inline-block;
    width: 12px;
    font-size: 16px !important;
}

.stars {
    color: #B71729 !important;
}

.recruit-name-small {
    font-size: 16px;
    font-weight: normal;
}

.recruit-upload-group {
    height: 184px;
    background: #e5e5e5;
    text-align: center;
    position: relative;
    cursor: pointer;
}

.recruit-upload-main {
    margin-right: 25px;
    margin-bottom: 30px;
    width: 184px;
}

.recruit-upload-btn {
    display: inline-block;
    width: 60px;
    height: 60px;
    line-height: 60px;
    text-align: center;
    background: #f5f5f5;
    border-radius: 50%;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -30px;
    margin-top: -30px;
}

.recruit-upload-btn i {
    color: #b3b3b3;
    font-size: 24px !important;
}

.recruit-upload-group img {
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 7;
    display: none;
}

.recruit-upload-group input {
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 5;
    opacity: 0;
    cursor: pointer;
}

.recruit-upload-delete {
    position: absolute;
    right: 5px;
    top: 5px;
    z-index: 10;
    color: #b11729 !important;
    font-size: 20px !important;
}

.recruit-images .recruit-upload-main:first-child .recruit-upload-delete {
    display: none;
}

.recruit-upload-add {
    width: 60px;
    height: 60px;
    line-height: 70px;
    text-align: center;
    background: #f5f5f5;
    border-radius: 50%;
    margin-top: 62px;
    cursor: pointer;
    overflow: hidden;
}

.recruit-uploads {
    margin-top: 30px;
}

.recruit-upload-add i {
    color: #b3b3b3;
    font-size: 24px !important;
}

.login-input .form-height-input input {
    padding-right: 35px;
}

.form-height-input {
    position: relative;
    width: 49%;
}

.form-height-unit {
    color: #868585;
    font-size: 16px;
    position: absolute;
    top: 0;
    right: 10px;
    line-height: 42px;
}

.form-radio-input .form-other-inputs {
    width: 300px;
    border: none;
    border-bottom: 1px solid #c6c5c5;
}

.form-inputs textarea {
    -webkit-appearance: none;
    border: 1px solid #c6c5c5;
    width: 100%;
    font-size: 16px;
    height: 188px;
    box-sizing: border-box;
    padding: 10px;
    resize: none;
}

@media (min-width: 1080px) {

    .recruit-upload-add:hover,
    .recruit-send a:hover {
        opacity: 0.8;
    }
}

.recruit-form-groups .recruit-name {
    display: block;
    width: 120px;
    line-height: 44px;
}

.recruit-form-groups-right {
    margin-left: 130px;
}

.recruit-form-groups-small {
    padding: 0px 3px;
}

.recruit-form-input {
    border: 1px solid #c6c6c6;
    display: block;
    margin-bottom: 10px;
    height: 44px;
    line-height: 44px;
    box-sizing: border-box;
    padding: 0px 10px;
    font-size: 14px;
    width: 100%;
    -webkit-appearance: none;
}

.recruit-form-input::-webkit-input-placeholder {
    /* WebKit browsers */
    color: #bbb;
}

.recruit-form-input:-moz-placeholder {
    /* Mozilla Firefox 4 to 18 */
    color: #bbb;
}

.recruit-form-input::-moz-placeholder {
    /* Mozilla Firefox 19+ */
    color: #bbb;
}

.recruit-form-input:-ms-input-placeholder {
    /* Internet Explorer 10+ */
    color: #bbb;
}

.recruit-sex .recruit-name {
    width: 65px;
}

.recruit-sex .recruit-form-groups-right {
    margin-left: 65px;
}

.recruit-sex-groups {
    margin-right: 15px;
    line-height: 44px;
}

.recruit-sex-groups label {
    font-size: 14px;
    color: #3F3F3F;
    font-weight: normal;
    display: inline;
}

.recruit-sex-groups input {
    width: 15px;
    height: 15px;
    vertical-align: -3px;
}

.recruit-form-weight .recruit-name {
    width: 45px;
}

.recruit-form-weight .recruit-form-groups-right {
    margin-left: 45px;
}

.recruit-form-position {
    position: relative;
}

.recruit-form-unit {
    position: absolute;
    right: 8px;
    top: 0px;
    line-height: 44px;
    color: #A3A3A3;
    font-size: 16px;
}

.recruit-form-position input {
    padding-right: 40px;
}

.recruit-select {
    width: 100%;
    height: 44px;
    border: none;
    background: #e5e5e5;
    font-size: 14px;
    padding: 0px 5px;
}

.recruit-form-times {
    position: relative;
    padding-right: 20px;
    margin-bottom: 10px;
}

.recruit-time-unit {
    line-height: 44px;
    color: #3F3F3F;
    font-size: 16px;
    font-weight: bold;
    position: absolute;
    right: 0;
    top: 0;
}

.choice-city {
    border: none;
    height: 35px;
    line-height: 35px;
    background: #333333;
    font-size: 14px;
    color: #fff;
}

.have-choice-city {
    line-height: 44px;
    color: #A3A3A3;
    font-size: 14px;
}

.recruit-major-title {
    background: #9f353a;
}

.recruit-major-content .recruit-name {
    width: 245px;
}

.recruit-major-content .recruit-form-groups-right {
    margin-left: 245px;
}

.recruit-major-add {
    display: none;
}

.recruit-major-groups:first-child .recruit-major-add {
    display: block;
}

.recruit-major-groups .recruit-major-del {
    display: block;
}

.recruit-major-groups:first-child .recruit-major-del {
    display: none;
}

.recruit-major-icons i {
    cursor: pointer;
    color: #b11729;
}

.recruit-major-groups-right {
    margin-left: 30px;
}

.recruit-major-icons {
    margin-top: 15px;
}

.recruit-start {
    padding-right: 17px;
    position: relative;
}

.recruit-end {
    padding-left: 17px;
}

.recruit-time-icon {
    line-height: 44px;
    color: #A3A3A3;
    font-size: 16px;
    position: absolute;
    right: -8px;
    top: 0px;
}

.recruit-images .recruit-name {
    width: 100% !important;
}

.recruit-upload-main input {
    margin-top: 5px;
    text-align: center;
}

.recruit-form-checkbox .recruit-name {
    width: 100%;
}

.recruit-form-checkbox .recruit-form-groups-right {
    float: left;
    width: 100%;
    margin: 0px;
    box-sizing: border-box;
    padding: 0px 10px;
}

.recruit-form-checkbox input[type="text"] {
    border: none;
    border-bottom: 1px solid #969696;
    border-radius: 0;
    -webkit-appearance: none;
    width: 280px;
    font-size: 14px;
    height: 24px;
    line-height: 24px;
    vertical-align: 1px;
}

.recruit-textarea {
    width: 100%;
    height: 185px;
    box-sizing: border-box;
    border: 1px solid #d4d4d4;
    margin-top: 15px;
    resize: none;
    overflow: auto;
    padding: 10px;
    font-size: 16px;
}

.recruit-agrees {
    text-align: center;
    padding: 44px 0px 178px 0px;
}

.recruit-agrees label {
    color: #2D2D2D;
    font-size: 14px;
    display: inline;
}

.recruit-agrees input {
    width: 12px;
    display: inline-block;
    height: 12px;
    vertical-align: -1px;
    margin-right: 5px;
}

.recruit-send {
    text-align: center;
}

.recruit-send a {
    display: inline-block;
    font-size: 14px;
    font-weight: bold;
    background: #9f353a;
    color: #fff;
    line-height: 44px;
    width: 184px;
    border-radius: 10px;
}

.recruit-expire {
    margin-left: 189px;
    padding-top: 144px;
}

.recruit-expire-name {
    color: #3F3F3F;
    font-size: 16px;
    line-height: 44px;
}

.recruit-expire-rt {
    margin-left: 124px;
}

.recruit-form-groups-years {
    width: 16.66%;
    float: left;
    box-sizing: border-box;
}

.recruit-form-groups-middle {
    width: 25%;
    box-sizing: border-box;
    float: left;
}

.recruit-form-groups-big {
    width: 50%;
    box-sizing: border-box;
    float: left;
}

.recruit-form-groups-places {
    width: 16.66%;
    box-sizing: border-box;
    float: left;
}

.recruit-form-groups-citys {
    width: 16.66%;
    box-sizing: border-box;
    float: left;
}

.recruit-form-groups-address {
    width: 50%;
    box-sizing: border-box;
    float: left;
}

.recruit-form-groups-sexs {
    width: 33.33%;
    box-sizing: border-box;
    float: left;
}

.recruit-form-groups-unit {
    width: 25%;
    box-sizing: border-box;
    float: left;
}

.recruit-form-groups-times {
    width: 25%;
    box-sizing: border-box;
    float: left;
}

@media (max-width: 991px) {
    .recruit-form-groups-years {
        width: 22.22%;
    }

    .recruit-form-groups-middle {
        width: 33.33%;
    }

    .recruit-form-groups-big {
        width: 66.66%;
    }

    .recruit-form-groups-places {
        width: 16.66%;
    }

    .recruit-form-groups-citys {
        width: 25%;
    }

    .recruit-form-groups-address {
        width: 33.33%;
    }

    .recruit-form-groups-sexs {
        width: 33.33%;
    }

    .recruit-form-groups-unit {
        width: 25%;
    }

    .recruit-form-groups-times {
        width: 33.33%;
    }

}

@media (max-width: 767px) {
    .recruit-form-groups-sexs {
        width: 100%;
    }

    .recruit-form-groups-times {
        width: 33.33%;
    }

    .recruit-form-groups-years {
        width: 33.33%;
    }

    .recruit-form-groups-address {
        width: 100%;
    }

    .recruit-form-groups-places {
        width: 33.33%;
    }

    .recruit-form-groups-citys {
        width: 33.33%;
    }

    .recruit-form-groups-big {
        width: 100%;
    }

    .recruit-form-groups-unit {
        width: 50%;
    }

    .recruit-form {
        padding: 20px 0px;
    }

    .recruit-form-groups-middle {
        width: 50%;
    }

    .recruit-title i {
        font-size: 23px;
    }

    .recruit-title {
        margin-bottom: 15px;
    }

    .recruit-message-content {
        padding: 15px 0px 5px 0px;
    }

    .recruit-name {
        font-size: 16px;
        width: 100%;
        line-height: 30px;
    }

    .recruit-name-small {
        font-size: 14px;
    }

    .recruit-uploads {
        margin-top: 0px;
    }

    .recruit-upload-group {
        height: 136px;
    }

    .recruit-upload-main {
        margin-right: 10px;
        margin-bottom: 10px;
        width: 136px;
    }

    .recruit-upload-add {
        margin-top: 38px;
        margin-bottom: 38px;
    }

    .recruits-main {
        padding: 10px 0px;
    }

    .recruit-form-groups-right {
        margin-left: 0px;
        float: left;
        width: 100%;
    }

    .recruit-form-groups .recruit-name,
    .recruit-sex-groups {
        line-height: 30px;
    }

    .recruit-sex .recruit-form-groups-right {
        float: none;
        width: auto;
    }

    .recruit-form-weight .recruit-form-groups-right {
        margin-left: 0px;
        float: left;
        width: 100%;
    }

    .recruit-form-weight {
        margin-top: -30px;
    }

    .choice-city {
        width: 125px;
        font-size: 14px;
        margin-right: 7px;
        height: 33px;
        line-height: 33px;
    }

    .recruit-form-input {
        font-size: 14px;
        height: 30px;
        line-height: 30px;
        padding: 0px 5px;
    }

    .recruit-select {
        font-size: 14px;
        height: 30px;
        padding: 0px;
    }

    .recruit-time-unit {
        font-size: 12px;
    }

    .recruit-form-times {
        padding-right: 15px;
    }

    .recruit-name i {
        width: auto;
    }

    .recruit-form-unit,
    .recruit-time-unit {
        line-height: 30px;
    }

    .have-choice-city {
        line-height: 33px;
        font-size: 14px;
    }

    .recruit-major-content .recruit-name {
        width: 100%;
    }

    .recruit-major-content .recruit-form-groups-right {
        margin-left: 0px;
        float: left;
        width: 100%;
    }

    .recruit-major-icons {
        margin-top: 3px;
    }

    .recruit-expire-main .recruit-uploads-content {
        float: none;
        margin: 0px auto;
        width: 136px;
    }

    .recruit-expire {
        float: left;
        margin: 0px;
        width: 100%;
        padding: 0px;
    }

    .recruit-expire-name {
        line-height: 33px;
        font-size: 12px;
    }

    .recruit-expire-rt {
        margin-left: 80px;
    }

    .recruit-expire-rt .recruit-select {
        font-size: 12px;
    }

    .recruit-form-checkbox input[type="text"] {
        width: 100px;
    }

    .recruit-sex-groups label {
        font-size: 14px;
    }

    .recruit-textarea {
        font-size: 14px;
    }

    .recruit-agrees label {
        font-size: 14px;
    }

    .recruit-time-icon {
        line-height: 30px;
    }

    .form-height-input {
        position: relative;
        width: 100%;
    }
}

div.thr-linkage {
    position: fixed;
    top: 50%;
    left: 50%;
    width: 888px;
    margin: -248px 0px 0px -444px;
    background-color: rgb(255, 255, 255);
    z-index: 2;
    overflow-y: auto;
    height: 496px;
}

@media (max-width: 991px) {
    div.thr-linkage {
        left: 3%;
        width: 94%;
        margin: -200px 0px 0px 0px;
        height: 450px;
    }
}

.thr-linkage .thr-areas dl dd,
.thr-linkage .hot_city dl dd,
.thr-linkage .thr-check-box dl dd,
.thr-linkage .thr-check-box dl dt {
    display: inline-block;
    padding: 2px 10px 2px 16px;
    background-image: url(/assets/images/thr-checkbox.png);
    background-repeat: no-repeat;
    background-position: left 7px;
    cursor: pointer;
}

.thr-linkage .thr-areas h4 button {
    display: inline-block;
    padding: 5px 10px;
    background-color: #dc402a;
    color: #fff;
    border-radius: 3px;
    border: none;
    outline: none;
    cursor: pointer;
    font-size: 13px
}

.thr-linkage .thr-areas h4 button:hover {
    opacity: 0.9;
}

.thr-linkage dd.on {
    background-position: left -22px !important;
}

.thr-linkage .thr-header {
    background-color: #eee;
    line-height: 36px;
    padding: 0 10px;
    font-size: 15px;
    text-align: left;
}

.thr-linkage .thr-header i {
    line-height: 36px;
    color: #fff;
    cursor: pointer;
    padding: 0 5px;
    height: 36px;
    width: 38px;
    background-size: 27%;
}

.thr-linkage .thr-list-area {
    width: 150px;

}

.thr-areas>h4,
.thr-areas>dl,
.thr-check-box {
    text-align: left;
}

.thr-check-box dd {
    margin-left: 10px;
    padding: 2px 3px 2px 16px !important;
}

.thr-linkage .thr-list-area ul li:first-child {
    background-color: #e4e4e4;
    border-bottom: 1px solid #eee;
    padding-left: 10px;
}

.thr-linkage .thr-list-area ul li {
    border-bottom: 1px solid #eee;
    line-height: 26px;
    cursor: pointer;
    padding-left: 10px;
}

.thr-linkage .thr-list-area ul li:hover {
    background-color: #efefef;
}

.thr-linkage .thr-list-area ul li.on {
    background-color: #fd8340;
    color: white;
}

.thr-linkage .thr-check-box {
    border-top: 1px solid #eee;

}

.thr-linkage .thr-select-area {
    min-height: 26px;
}

.thr-linkage .thr-close {
    background: url(/assets/images/thr-close-1.png) center;
    background-repeat: no-repeat;
}

.thr-linkage .fr {
    float: right;
}

.thr-linkage .mtb5 {
    margin-top: 5px;
    margin-bottom: 5px;
}

.thr-linkage .fw {
    font-weight: normal;
}

.thr-linkage .fz12 {
    font-size: 12px;
}

.thr-linkage .fz14 {
    font-size: 14px;
}

.thr-linkage .mt10 {
    margin-top: 10px;
}

.thr-linkage .fl {
    float: left;
}

.thr-linkage .pd10 {
    padding: 10px !important;
}

.thr-linkage .fz16 {
    font-size: 16px;
}

.thr-linkage-shade {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: none;
    overflow: hidden;
}

.instructor-images-swiper .swiper-container {
    width: 100% !important;
    padding: 0px !important;
    margin-left: auto;
    margin-right: auto;
}

.instructor-images-swiper .swiper-slide {
    background-size: cover;
    background-position: center;
}

.instructor-images-swiper .gallery-top {
    width: 100%;
}

.instructor-images-swiper .gallery-thumbs {
    box-sizing: border-box;
    padding: 10px 0;
    margin-top: 10px;
}

.instructor-images-swiper .gallery-thumbs .swiper-slide {
    width: 20%;
    height: 100%;
    opacity: 0.4;
}

.instructor-images-swiper .gallery-thumbs .swiper-slide-active {
    opacity: 1;
}

.instructor-images-swiper .swiper-button-next {
    right: 10px;
    background: url(/assets/images/new-page-37.png) no-repeat;
}

.instructor-images-swiper .swiper-button-prev {
    left: 10px;
    background: url(/assets/images/new-page-36.png) no-repeat;
}

.instructor-images-swiper .swiper-button-next,
.instructor-images-swiper .swiper-button-prev {
    width: 15px;
    height: 24px;
    margin-top: -20px;
}

@media (max-width:767px) {

    .instructor-images-swiper .swiper-button-next,
    .instructor-images-swiper .swiper-button-prev {
        margin-top: -12px;
    }
}

/**
 * Swiper 4.2.0
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * http://www.idangero.us/swiper/
 *
 * Copyright 2014-2018 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: March 16, 2018
 */

.swiper-container {
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0px 15px;
    z-index: 1
}

.swiper-container-no-flexbox .swiper-slide {
    float: left
}

.swiper-container-vertical>.swiper-wrapper {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    -o-transition-property: transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    -webkit-box-sizing: content-box;
    box-sizing: content-box
}

.swiper-container-android .swiper-slide,
.swiper-wrapper {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.swiper-container-multirow>.swiper-wrapper {
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.swiper-container-free-mode>.swiper-wrapper {
    -webkit-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    margin: 0 auto
}

.swiper-slide {
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    -o-transition-property: transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform
}

.swiper-invisible-blank-slide {
    visibility: hidden
}

.swiper-container-autoheight,
.swiper-container-autoheight .swiper-slide {
    height: auto
}

.swiper-container-autoheight .swiper-wrapper {
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-transition-property: height, -webkit-transform;
    transition-property: height, -webkit-transform;
    -o-transition-property: transform, height;
    transition-property: transform, height;
    transition-property: transform, height, -webkit-transform
}

.swiper-container-3d {
    -webkit-perspective: 1200px;
    perspective: 1200px
}

.swiper-container-3d .swiper-cube-shadow,
.swiper-container-3d .swiper-slide,
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-wrapper {
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d
}

.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 10
}

.swiper-container-3d .swiper-slide-shadow-left {
    background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0)));
    background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
    background-image: -o-linear-gradient(right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
    background-image: linear-gradient(to left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-container-3d .swiper-slide-shadow-right {
    background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0)));
    background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
    background-image: -o-linear-gradient(left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
    background-image: linear-gradient(to right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-container-3d .swiper-slide-shadow-top {
    background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0)));
    background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
    background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
    background-image: linear-gradient(to top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-container-3d .swiper-slide-shadow-bottom {
    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0)));
    background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
    background-image: -o-linear-gradient(top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-container-wp8-horizontal,
.swiper-container-wp8-horizontal>.swiper-wrapper {
    -ms-touch-action: pan-y;
    touch-action: pan-y
}

.swiper-container-wp8-vertical,
.swiper-container-wp8-vertical>.swiper-wrapper {
    -ms-touch-action: pan-x;
    touch-action: pan-x
}

.swiper-button-next,
.swiper-button-prev {
    position: absolute;
    top: 50%;
    width: 27px;
    height: 44px;
    margin-top: -22px;
    z-index: 10;
    cursor: pointer;
    background-size: 27px 44px;
    background-position: center;
    background-repeat: no-repeat
}

.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
    /* opacity: .35; */
    display: none !important;
    cursor: auto;
    pointer-events: none;
}



.swiper-button-lock {
    display: none
}

.swiper-pagination {
    position: absolute;
    text-align: center;
    -webkit-transition: .3s opacity;
    -o-transition: .3s opacity;
    transition: .3s opacity;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    z-index: 10
}

.swiper-pagination.swiper-pagination-hidden {
    opacity: 0
}

.swiper-container-horizontal>.swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
    bottom: 10px;
    left: 0;
    width: 100%
}

.swiper-pagination-bullets-dynamic {
    overflow: hidden;
    font-size: 0
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    -webkit-transform: scale(.33);
    -ms-transform: scale(.33);
    transform: scale(.33);
    position: relative
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
    -webkit-transform: scale(.66);
    -ms-transform: scale(.66);
    transform: scale(.66)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
    -webkit-transform: scale(.33);
    -ms-transform: scale(.33);
    transform: scale(.33)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
    -webkit-transform: scale(.66);
    -ms-transform: scale(.66);
    transform: scale(.66)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
    -webkit-transform: scale(.33);
    -ms-transform: scale(.33);
    transform: scale(.33)
}

.swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    display: inline-block;
    border-radius: 100%;
    background: #000;
    opacity: .2
}

button.swiper-pagination-bullet {
    border: none;
    margin: 0;
    padding: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

.swiper-pagination-clickable .swiper-pagination-bullet {
    cursor: pointer
}

.swiper-pagination-bullet-active {
    opacity: 1;
    background: #007aff
}

.swiper-container-vertical>.swiper-pagination-bullets {
    right: 10px;
    top: 50%;
    -webkit-transform: translate3d(0, -50%, 0);
    transform: translate3d(0, -50%, 0)
}

.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 6px 0;
    display: block
}

.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 8px
}

.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    display: inline-block;
    -webkit-transition: .2s top, .2s -webkit-transform;
    transition: .2s top, .2s -webkit-transform;
    -o-transition: .2s transform, .2s top;
    transition: .2s transform, .2s top;
    transition: .2s transform, .2s top, .2s -webkit-transform
}

.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 4px
}

.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    white-space: nowrap
}

.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    -webkit-transition: .2s left, .2s -webkit-transform;
    transition: .2s left, .2s -webkit-transform;
    -o-transition: .2s transform, .2s left;
    transition: .2s transform, .2s left;
    transition: .2s transform, .2s left, .2s -webkit-transform
}

.swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    -webkit-transition: .2s right, .2s -webkit-transform;
    transition: .2s right, .2s -webkit-transform;
    -o-transition: .2s transform, .2s right;
    transition: .2s transform, .2s right;
    transition: .2s transform, .2s right, .2s -webkit-transform
}

.swiper-pagination-progressbar {
    background: rgba(0, 0, 0, .25);
    position: absolute
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background: #007aff;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: left top;
    -ms-transform-origin: left top;
    transform-origin: left top
}

.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    -webkit-transform-origin: right top;
    -ms-transform-origin: right top;
    transform-origin: right top
}

.swiper-container-horizontal>.swiper-pagination-progressbar {
    width: 100%;
    height: 4px;
    left: 0;
    top: 0
}

.swiper-container-vertical>.swiper-pagination-progressbar {
    width: 4px;
    height: 100%;
    left: 0;
    top: 0
}

.swiper-pagination-white .swiper-pagination-bullet-active {
    background: #fff
}

.swiper-pagination-progressbar.swiper-pagination-white {
    background: rgba(255, 255, 255, .25)
}

.swiper-pagination-progressbar.swiper-pagination-white .swiper-pagination-progressbar-fill {
    background: #fff
}

.swiper-pagination-black .swiper-pagination-bullet-active {
    background: #000
}

.swiper-pagination-progressbar.swiper-pagination-black {
    background: rgba(0, 0, 0, .25)
}

.swiper-pagination-progressbar.swiper-pagination-black .swiper-pagination-progressbar-fill {
    background: #000
}

.swiper-pagination-lock {
    display: none
}

.swiper-scrollbar {
    border-radius: 10px;
    position: relative;
    -ms-touch-action: none;
    background: rgba(0, 0, 0, .1)
}

.swiper-container-horizontal>.swiper-scrollbar {
    position: absolute;
    left: 1%;
    bottom: 3px;
    z-index: 50;
    height: 5px;
    width: 98%
}

.swiper-container-vertical>.swiper-scrollbar {
    position: absolute;
    right: 3px;
    top: 1%;
    z-index: 50;
    width: 5px;
    height: 98%
}

.swiper-scrollbar-drag {
    height: 100%;
    width: 100%;
    position: relative;
    background: rgba(0, 0, 0, .5);
    border-radius: 10px;
    left: 0;
    top: 0
}

.swiper-scrollbar-cursor-drag {
    cursor: move
}

.swiper-scrollbar-lock {
    display: none
}

.swiper-zoom-container {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center
}

.swiper-zoom-container>canvas,
.swiper-zoom-container>img,
.swiper-zoom-container>svg {
    max-width: 100%;
    max-height: 100%;
    -o-object-fit: contain;
    object-fit: contain
}

.swiper-slide-zoomed {
    cursor: move
}

.swiper-lazy-preloader {
    width: 42px;
    height: 42px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -21px;
    margin-top: -21px;
    z-index: 10;
    -webkit-transform-origin: 50%;
    -ms-transform-origin: 50%;
    transform-origin: 50%;
    -webkit-animation: swiper-preloader-spin 1s steps(12, end) infinite;
    animation: swiper-preloader-spin 1s steps(12, end) infinite
}

.swiper-lazy-preloader:after {
    display: block;
    content: '';
    width: 100%;
    height: 100%;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
    background-position: 50%;
    background-size: 100%;
    background-repeat: no-repeat
}

.swiper-lazy-preloader-white:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")
}

@-webkit-keyframes swiper-preloader-spin {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes swiper-preloader-spin {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

.swiper-container .swiper-notification {
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
    opacity: 0;
    z-index: -1000
}

.swiper-container-fade.swiper-container-free-mode .swiper-slide {
    -webkit-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out
}

.swiper-container-fade .swiper-slide {
    pointer-events: none;
    -webkit-transition-property: opacity;
    -o-transition-property: opacity;
    transition-property: opacity
}

.swiper-container-fade .swiper-slide .swiper-slide {
    pointer-events: none
}

.swiper-container-fade .swiper-slide-active,
.swiper-container-fade .swiper-slide-active .swiper-slide-active {
    pointer-events: auto
}

.swiper-container-cube {
    overflow: visible
}

.swiper-container-cube .swiper-slide {
    pointer-events: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: 1;
    visibility: hidden;
    -webkit-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    transform-origin: 0 0;
    width: 100%;
    height: 100%
}

.swiper-container-cube .swiper-slide .swiper-slide {
    pointer-events: none
}

.swiper-container-cube.swiper-container-rtl .swiper-slide {
    -webkit-transform-origin: 100% 0;
    -ms-transform-origin: 100% 0;
    transform-origin: 100% 0
}

.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-active .swiper-slide-active {
    pointer-events: auto
}

.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-next,
.swiper-container-cube .swiper-slide-next+.swiper-slide,
.swiper-container-cube .swiper-slide-prev {
    pointer-events: auto;
    visibility: visible
}

.swiper-container-cube .swiper-slide-shadow-bottom,
.swiper-container-cube .swiper-slide-shadow-left,
.swiper-container-cube .swiper-slide-shadow-right,
.swiper-container-cube .swiper-slide-shadow-top {
    z-index: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.swiper-container-cube .swiper-cube-shadow {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: .6;
    -webkit-filter: blur(50px);
    filter: blur(50px);
    z-index: 0
}

.swiper-container-flip {
    overflow: visible
}

.swiper-container-flip .swiper-slide {
    pointer-events: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: 1
}

.swiper-container-flip .swiper-slide .swiper-slide {
    pointer-events: none
}

.swiper-container-flip .swiper-slide-active,
.swiper-container-flip .swiper-slide-active .swiper-slide-active {
    pointer-events: auto
}

.swiper-container-flip .swiper-slide-shadow-bottom,
.swiper-container-flip .swiper-slide-shadow-left,
.swiper-container-flip .swiper-slide-shadow-right,
.swiper-container-flip .swiper-slide-shadow-top {
    z-index: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.swiper-container-coverflow .swiper-wrapper {
    -ms-perspective: 1200px
}

.validator-item {
    list-style: none;
    margin: 5px 0px;
    padding: 0;
}

.validator-item .invalid {
    padding-left: 20px;
    color: #c5c5c5;
}

.validator-item .valid {
    padding-left: 20px;
    color: #40972b;
    font-weight: bold;
}

.password-strength {
    font-size: 13.5px;
    padding: 5px 10px;
    color: #000000;
    border-radius: 4px;
    margin-top: 5px;
    font-weight: bold;
}

.veryweak-password {
    color: #FF0000;
}

.weak-password {
    color: #d35400;
}

.medium-password {
    color: #f39c12;
}

.average-password {
    color: #f1c40f;
}

.strong-password {
    color: #229954;
}

/*
 *
 *
 *
 * Bootstrap 4 Component - Chosen
 * Version: 1.0.8
 * Copyright (c) 2017-18 Martin Haubek
 *
 *
 *
 */
.chosen-select,
.chosen-select-deselect {
    width: 100%;
}

.chosen-container {
    display: inline-block;
    position: relative;
    width: 100% !important;
    font-size: 1rem;
    text-align: left;
    vertical-align: middle;
}

.chosen-container .chosen-drop {
    background: #fff;
    border: 1px solid #ccc;
    border-bottom-right-radius: 0.25rem;
    border-bottom-left-radius: 0.25rem;
    margin-top: -1px;
    position: absolute;
    top: 100%;
    left: -9000px;
    z-index: 1060;
}

.chosen-container.chosen-with-drop .chosen-drop {
    left: 0;
    right: 0;
}

.chosen-container .chosen-results {
    margin: 0;
    position: relative;
    max-height: 15rem;
    padding: .5rem 0 0 0;
    color: #6c757d;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.chosen-container .chosen-results li {
    display: none;
    line-height: 1.5;
    list-style: none;
    margin: 0;
    padding: .25rem .25rem .25rem 1.5rem;
}

.chosen-container .chosen-results li em {
    font-style: normal;
    color: #6c757d;
}

.chosen-container .chosen-results li.group-result {
    display: list-item;
    cursor: default;
    padding-left: .75rem;
    color: #adb5bd;
    font-weight: normal;
    text-transform: uppercase;
}

.chosen-container .chosen-results li.group-option {
    padding-left: 1.5rem;
}

.chosen-container .chosen-results li.active-result {
    cursor: pointer;
    display: list-item;
}

.chosen-container .chosen-results li.result-selected {
    color: #495057;
}

.chosen-container .chosen-results li.result-selected:before {
    display: inline-block;
    position: relative;
    top: .3rem;
    width: 1.25rem;
    height: 1.25rem;
    margin-left: -1.25rem;
    content: "";
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23495057' d='M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E");
    background-size: 1.25rem 1.25rem;
    background-position: center center;
    background-repeat: no-repeat;
}

.chosen-container .chosen-results li.highlighted {
    background-color: #007bff;
    background-image: none;
    color: white;
}

.chosen-container .chosen-results li.highlighted:before {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E");
}

.chosen-container .chosen-results li.highlighted em {
    background: transparent;
    color: rgba(255, 255, 255, 0.8);
}

.chosen-container .chosen-results li.disabled-result {
    display: list-item;
    color: #ced4da;
}

.chosen-container .chosen-results .no-results {
    display: list-item;
    padding: .25rem 0 1rem 1.065rem;
    color: #dc3545;
}

.chosen-container .chosen-results-scroll {
    background: white;
    margin: 0 .25rem;
    position: absolute;
    text-align: center;
    width: 20rem;
    z-index: 1;
}

.chosen-container .chosen-results-scroll span {
    display: inline-block;
    height: 1.5;
    text-indent: -5000px;
    width: .5rem;
}

.chosen-container-single .chosen-single {

    background-clip: padding-box;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    color: #6c757d;
    display: block;
    height: calc(2.25rem + 2px);
    overflow: hidden;
    line-height: calc(2.25rem + 2px);
    padding: 0 0 0 .75rem;
    position: relative;
    text-decoration: none;
    white-space: nowrap;
}

.chosen-container-single .chosen-single abbr {
    display: inline-block;
    position: absolute;
    top: .45rem;
    right: 2.5rem;
    width: 1.5rem;
    height: 1.5rem;
    cursor: pointer;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23dc3545' d='M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/%3E%3C/svg%3E");
    background-size: 1.5rem 1.5rem;
    background-position: center center;
    background-repeat: no-repeat;
}

.chosen-container-single .chosen-single abbr:hover {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23921925' d='M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/%3E%3C/svg%3E");
}

.chosen-container-single .chosen-single span {
    display: block;
    margin-right: 1.5rem;
    text-overflow: ellipsis;
}

.chosen-container-single .chosen-single.chosen-disabled .chosen-single abbr:hover {
    background-position: right 2px;
}

.chosen-container-single .chosen-single div {
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 2rem;
    height: 100%;
    padding-left: .5rem;
}

.chosen-container-single .chosen-single div:after {
    display: inline-block;
    position: relative;
    top: .25rem;
    left: -1rem;
    width: 2rem;
    height: 2rem;
    content: "";
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23adb5bd' d='M7.41 7.84L12 12.42l4.59-4.58L18 9.25l-6 6-6-6z'/%3E%3C/svg%3E");
    background-size: 2rem 2rem;
    background-position: center center;
    background-repeat: no-repeat;
}



.chosen-container-single a:not([href]):not([tabindex]).chosen-single:not(.chosen-default) {
    color: #6c757d !important;
}

.chosen-container-single .chosen-search-input {
    display: none;
    border: none;
}

.chosen-container-single .chosen-search {
    box-sizing: border-box;
    margin: 0;
    padding: .5rem .5rem 0 .5rem;
    position: relative;
    white-space: nowrap;
    z-index: 1000;
}

.chosen-container-single .chosen-search:after {
    display: inline-block;
    position: relative;
    top: .365rem;
    left: -1.75rem;
    width: 1.25rem;
    height: 1.25rem;
    content: "";
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23adb5bd' d='M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z'/%3E%3C/svg%3E");
    background-size: 1.25rem 1.25rem;
    background-position: center center;
    background-repeat: no-repeat;
}

.chosen-container-single .chosen-search input[type="text"] {
    box-sizing: border-box;
    background-color: #f8f9fa;
    border: 1px solid #ced4da;
    outline: none;
    border-top-left-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
    border-bottom-right-radius: 0.25rem;
    border-bottom-left-radius: 0.25rem;
    padding: .25rem 1rem .25rem .5rem;
    width: 100%;
}

.chosen-container-single .chosen-drop {
    margin-top: -1px;
    border-bottom-right-radius: 0.25rem;
    border-bottom-left-radius: 0.25rem;
    background-clip: padding-box;
}

.chosen-container-single-nosearch .chosen-search {
    display: none;
}

.chosen-container-multi .chosen-choices {
    border-bottom: 1px solid #ccc;
    border-top: 1px solid #ccc;

    cursor: text;
    height: 40px !important;
    overflow: hidden;
    overflow-y: auto;
    margin: 0;

    padding: 0;
    position: relative;
}

.chosen-container-multi .chosen-choices li {
    float: left;
    list-style: none;
}

.chosen-container-multi .chosen-choices .search-field {
    margin: 0;
    padding: 0;
    white-space: nowrap;
}

.chosen-container-multi .chosen-choices .search-field input[type="text"] {

    background: transparent !important;
    border: 0 !important;
    font-size: 16px;
    color: #808080;
    height: calc(2.25rem + 2px);
    margin: 0;
    padding: 0 0 0 .75rem;
    outline: 0;
    width: 100% !important;
}

.chosen-container-multi .chosen-choices .search-field .default {
    color: #ced4da;
}

.chosen-container-multi .chosen-choices .search-choice {
    background-clip: padding-box;
    position: relative;
    margin: .35rem 0 0 .5rem;
    padding: .25rem 1.5rem .25rem .25rem;
    border: 1px solid #ced4da;
    background-color: #f8f9fa;
    border-top-left-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
    border-bottom-right-radius: 0.25rem;
    border-bottom-left-radius: 0.25rem;
    cursor: default;

    line-height: 1;
}

.chosen-container-multi .chosen-choices .search-choice .search-choice-close {
    display: inline-block;
    position: absolute;
    top: .2rem;
    right: .125rem;
    width: 1rem;
    height: 1rem;
    cursor: pointer;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23dc3545' d='M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/%3E%3C/svg%3E");
    background-size: 1rem 1rem;
    background-position: center center;
    background-repeat: no-repeat;
}

.chosen-container-multi .chosen-choices .search-choice .search-choice-close:hover {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23921925' d='M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/%3E%3C/svg%3E");
}

.chosen-container-multi .chosen-choices .search-choice-focus {
    background: #dee2e6;
}

.chosen-container-multi .chosen-choices .search-choice-focus .search-choice-close {
    background-position: right -11px;
}

.chosen-container-multi .chosen-drop .result-selected {
    display: none;
}

.chosen-container-active .chosen-single {

    transition: border linear 0ms, box-shadow linear 0ms;
}

@media screen and (prefers-reduced-motion: reduce) {
    .chosen-container-active .chosen-single {
        transition: none;
    }
}



.chosen-container-active .chosen-choices {

    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    transition: border linear 0ms, box-shadow linear 0ms;
}

@media screen and (prefers-reduced-motion: reduce) {
    .chosen-container-active .chosen-choices {
        transition: none;
    }
}

.chosen-container-active .chosen-choices .search-field input[type="text"] {
    color: #6c757d !important;
}

.chosen-container-active.chosen-with-drop .chosen-choices {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.chosen-container-active.chosen-with-drop .chosen-search-input {
    display: inline-block;
}

.chosen-disabled {
    cursor: default;
    opacity: .5 !important;
}

.chosen-disabled .chosen-single {
    cursor: default;
}

.chosen-disabled .chosen-choices .search-choice .search-choice-close {
    cursor: default;
}

.chosen-container-optgroup-clickable li.group-result {
    text-transform: none !important;
}

.chosen-container-optgroup-clickable li.group-result:hover {
    background-color: #007bff;
    color: white;
    cursor: pointer;
}

.chosen-container.is-valid .chosen-single,
.chosen-container.is-valid .chosen-choices,
.chosen-container.is-valid .chosen-drop,
.chosen-container:valid .chosen-single,
.chosen-container:valid .chosen-choices,
.chosen-container:valid .chosen-drop {
    border-color: #28a745;
}

.chosen-container.is-invalid .chosen-single,
.chosen-container.is-invalid .chosen-choices,
.chosen-container.is-invalid .chosen-drop,
.chosen-container:invalid .chosen-single,
.chosen-container:invalid .chosen-choices,
.chosen-container:invalid .chosen-drop {
    border-color: #dc3545;
}

body {
    font-family: "微軟正黑體";
    padding: 0px !important;
    background-color: #fff;
}

.sites {
    background: #fff;
    border-bottom: 1px solid #e6e6e6;
    padding: 10px 0px;
    color: #9f353a;
    font-size: 13px;
}

.sites a {
    color: #808080;
}

@media (min-width: 1080px) {
    .sites a:hover {
        color: #9f353a;
    }

    .pages a:hover {
        background: #9f353a;
        color: #fff;
    }
}

.instructor-title {
    text-align: center;
    color: #4D4D4D;
    font-size: 28px;
    font-weight: bold;
    background: #f8f8f8;
    padding: 30px 0px;
    border-bottom: 1px solid #e6e6e6;
    letter-spacing: 3px;
}

.appointment-search-pc {
    background: #eeeeee;
    padding: 6px 0px;
    display: none;
}

.appointment-search-group {
    width: 25%;
    box-sizing: border-box;
    padding: 0 5px;
}

.appointment-search-group select {
    display: none;
    border: none;
    height: 38px;
    width: 100%;
    border-top: 1px solid #cccccc;
    border-bottom: 1px solid #cccccc;
    font-size: 16px;
    color: #808080;
    background: none;
}

.appointment-search-group select:focus {
    outline: none;
}

.appointment-search-group input {
    font-size: 16px;
    height: 38px;
    line-height: 38px;
    -webkit-appearance: none;
    width: 100%;
    border-radius: 5px;
    font-size: 16px;
    border: none;
    background: #fff;
    box-sizing: border-box;
    padding: 0 10px;
    font-family: "微軟正黑體" !important;
    background: #aaabab;
}

.appointment-search-pc .form-div input {
    padding-right: 1.5rem;
    border-radius: 0;
    background: none;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    text-align: left;
    color: #6c757d !important;
    background-image: url(/assets/images/down1.svg);
    background-repeat: no-repeat;
    background-position: 94% center;
}

.chosen-container-multi b {
    display: inline-block;
    position: absolute;
    top: .25rem;
    right: 1rem;
    width: 2rem;
    height: 2rem;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23adb5bd' d='M7.41 7.84L12 12.42l4.59-4.58L18 9.25l-6 6-6-6z'/%3E%3C/svg%3E");
    background-size: 2rem 2rem;
    background-position: center center;
    background-repeat: no-repeat;
}

.material-number {
    text-align: center;
    padding: 15px 0px;
    color: #666666;
    font-size: 14px;
}

.material-number i {
    font-style: normal;
    color: #9f353a;
}

.instructor-list li {
    float: left;
    width: 50%;
    box-sizing: border-box;
    padding: 0 15px;
    display: inline-table;
}

.instructor-block {
    padding: 20px 0px;
    border-bottom: 1px solid #cccccc;
    height: 418px;
    display: inline-flex;
}

.course-species-buttons {
    float: left;
    line-height: 35px;
}

.course-species-buttons a {
    border: 1px #ccc solid;
    padding: 4px 7px;
    margin-left: 5px;
    cursor: pointer;
    border-radius: 2rem;
    font-size: 13px;
}

.course-species-buttons a:hover {
    color: #9f353a;
}

.course-species-buttons .class-active {
    background-color: #9f353a;
    color: #fff !important;
}

.price,
.total-price,
.related-price,
.related-total-price {
    margin: 0px;
}

@media (max-width: 1080px) {
    .instructor-block {
        height: auto;
        display: block;
    }
}

.instructor-image {
    display: block;
    width: 249px;
    border-radius: 10px;
    overflow: hidden;
}

.instructor-image img {
    width: 100%;
    vertical-align: middle;
}

.instructor-list .instructor-image img {
    height: 373px;
}

@media (max-width: 770px) {
    .instructor-list .instructor-image img {
        height: unset;
    }
}

.instructor-information {
    margin-left: 20px;
    width: 50%;
    float: left;
}

.instructor-name {
    color: #4D4D4D;
    font-size: 24px;
}

.instructor-name a {
    color: #4D4D4D;
    font-size: 24px;
    font-weight: bold;
}

.man-icon {
    display: inline-block;
    background: url(/assets/images/male-icon.svg) no-repeat;
    width: 23px;
    height: 23px;
    vertical-align: middle;
    margin-left: 10px;
}

.woman-icon {
    display: inline-block;
    background: url(/assets/images/female-icon.svg) no-repeat;
    width: 23px;
    height: 23px;
    vertical-align: middle;
    margin-left: 10px;
}

.instructor-score {
    color: #000000;
    font-size: 25px;
    font-weight: bold;
    margin: 5px 0px;
}

.instructor-star {
    display: inline-block;
    background: url(/assets/images/star-red.svg) no-repeat;
    width: 25px;
    height: 24px;
    margin: 0px 4px;
}

.instructor-star-no {
    display: inline-block;
    background: url(/assets/images/star-grey.svg) no-repeat;
    width: 25px;
    height: 24px;
    margin: 0px 4px;
}

.information-groups .groups-label {
    color: #4D4D4D;
    font-weight: bold;
    margin-right: 10px;
}

.information-groups .groups-label i {
    font-size: 13px;
    margin-left: 5px;
}

.information-groups .groups-texts {
    margin-left: 76px;
    color: #999999;
}

.information-groups {
    line-height: 25px;
    margin-bottom: 5px;
    font-size: 16px;
    display: inline-block;
    width: 100%;
}

.information-link {
    color: #999999;
}

.information-link span {
    text-decoration: underline;
}

.information-link i {
    color: #4D4D4D;
    margin-left: 5px;
    font-size: 16px;
}

.course-species-label {
    display: inline-block;
    background: #e6e6e6;
    padding: 0px 5px;
    color: #666666;
    font-size: 16px;
    margin-right: 5px;
    margin-bottom: 8px;
}

.instructor-blocks {
    position: relative;
}

.instructor-block-bottom {
    position: absolute;
    right: 0;
    bottom: 0;
    box-sizing: border-box;
    width: 55%;
}

.instructor-block-bottom-item {
    width: 100%;
    clear: both;
    display: block;
    text-align: left;
}

.instructor-block-bottom-item .label-title {
    font-size: 15px;
    display: inline-block;
    float: left;
    width: 20%;
    text-align: right;
    line-height: 35px;
    font-weight: bold;
    margin-right: 5px;
}

.instructor-block-price .label-title,
.instructor-price-block .label-title {
    padding-top: 2px;
}

.instructor-price-block span {
    font-size: 13px;
}

.instructor-price-block .total-price,
.instructor-price-block .related-total-price {
    font-size: 22px;
}

.instructor-price-block .total-price,
.instructor-price-block .price,
.instructor-price-block .related-total-price,
.instructor-price-block .related-price {
    color: #9f353a;
    font-weight: bold;
}

.instructor-price-block i {
    font-size: 13px;
}

.instructor-price-block {
    color: #4D4D4D;
    font-size: 15px;
    font-weight: bold;
}

/* .instructor-price-block i{font-size: 22px;} */
.know-instructor-button {
    display: inline-block;
    color: #5B5B5B;
    font-size: 14px;
    line-height: 40px;
    width: 100%;
    text-align: center;
    border-radius: 2rem;
    background: #cccccc;
}

.know-instructor-button:hover {
    background: #c7c4c4;
    color: #5B5B5B;
    text-decoration: none;
}

.know-instructor-button i {
    margin-right: 10px;
}

.appointment-search-phone {
    display: none;
    position: relative;
}

.appointment-search-phone {
    background: #eeeeee;
    padding: 6px 0px;
}

.appointment-search-phone a {
    display: block;
    width: 50%;
    line-height: 24px;
    text-align: center;
    border-right: 1px solid #cccccc;
    color: #4D4D4D;
    font-size: 16px;
    box-sizing: border-box;
}

.appointment-search-phone a:last-child {
    border: none;
}

.appointment-search-phone a i {
    margin-left: 6px;
}

.appointment-search-down {
    position: absolute;
    width: 100%;
    left: 0;
    top: 36px;
    background: #f8f8f8;
    z-index: 1000;
    display: none;
}

.appointment-search-down li {
    border-bottom: 1px solid #e6e6e6;
    text-align: center;
    color: #808080;
    font-size: 16px;
    padding: 10px 0px;
}

.pages {
    text-align: center;
    padding: 60px 0px;
}

.pages a {
    display: inline-block;
    width: 44px;
    height: 44px;
    line-height: 44px;
    border-radius: 50%;
    background: #f0f0f0;
    text-align: center;
    color: #808080;
    margin: 0px 2px;
    margin-bottom: 4px;
}

.pages .ahover {
    background: #9f353a;
    color: #fff;
}

.instructor-score .instructor-score-number {
    vertical-align: 5px;
    display: contents;
}

.instructor-score .rating-container {
    display: inline-block;
}

.instructor-score .rating-container .star {
    margin: 0 0.5px;
}

.instructor-score .rating-container .filled-stars {
    color: #9f353a;
    -webkit-text-stroke: unset;
    text-shadow: unset;
}

.instructor-score .star-score-text {
    line-height: 48px;
    vertical-align: middle;
}

.related_coach_block .rating-container {
    font-size: 17px;
}

.related_coach_block .star i {
    margin-right: 3px;
}

@media (max-width: 1079px) {
    .instructor-list li {
        width: 100%;
    }

    .instructor-block-bottom {
        width: 32%;
    }
}

@media (max-width: 991px) {
    .sites {
        font-size: 12px;
        padding: 6px 0px;
    }

    .instructor-title {
        font-size: 24px;
        padding: 14px 0px;
    }

    .appointment-search-pc {
        display: none;
    }

    /* .appointment-search-phone{display: block;} */
    .instructor-image {
        width: 100%;
    }

    .instructor-information {
        margin-left: 0;
        float: left;
        padding-top: 25px;
        width: 100%;
    }

    .instructor-block-bottom {
        padding: 0;
        text-align: center;
        width: 46%;
    }

    .instructor-name {
        text-align: center;
        font-size: 20px;
    }

    .instructor-name a {
        font-size: 20px;
    }

    .instructor-score {
        text-align: center;
    }

    .instructor-block-bottoms {
        display: inline-block;
        float: none;
    }

    .instructor-block-bottoms .instructor-price-block {
        line-height: 16px;
    }

    .material-number {
        padding: 12px 0px 0px 0px;
    }

    .pages {
        padding: 30px 0px;
    }

    .appointment-search-conditions li {
        padding: 0px;
    }

    .appointment-search-phone .form-div input {
        -webkit-appearance: none;
        width: 100%;
        border: none;
        background: none;
        height: 42px;
        line-height: 42px;
        font-size: 16px;
        color: #808080;
    }

    .appointment-search-phone select {
        -webkit-appearance: none;
        border: none;
        background: none;
        height: 42px;
        display: block;
        margin: 0 auto;
        text-align: center;
        font-size: 16px;
        color: #808080;
    }
}

@media (max-width: 450px) {
    .instructor-block-bottom {
        position: static;
        width: 100%;
    }
}

@media (max-width: 320px) {
    .instructor-block-bottom-item .label-title {
        line-height: unset;
        font-size: 14px;
        width: 14%;
    }

    .instructor-block-price .label-title {
        line-height: 35px;
    }

    .course-species-buttons {
        line-height: 43px;
    }
}

.information-content {
    padding: 40px 0px;
}

.instructor-images {
    width: 350px;
    position: relative;
}

.instructor-images .swiper-slide img {
    width: 100%;
    vertical-align: middle;
    border-radius: 10px;
    padding: 5px;
}

.swiper-container {
    padding: 0px;
}

.index-teacher-swiper .swiper-slide {
    margin-top: 10px;
}

/* .instructor-images .swiper-button-next{right: 5px;}
.instructor-images .swiper-button-prev{left: 5px;}
.instructor-images .swiper-button-next,.instructor-images .swiper-button-prev{font-size: 25px;opacity: 1;color: #b6b6b6;width: 40px;height: 40px;line-height: 40px;margin-top: -20px;text-align: center;color: #fff;}
.instructor-images .swiper-button-next:focus,.instructor-images .swiper-button-prev:focus{outline: none;}
.instructor-images .swiper-pagination{position: absolute;width: 100%;text-align: center;bottom: -40px;}
.instructor-images .swiper-pagination-bullet{width: 18px;height: 18px;background: url(/assets/images/dumbell-grey.svg) no-repeat;margin: 0px 3px;opacity: 1;}
.instructor-images .swiper-pagination-bullet-active{background: url(/assets/images/dumbell-red.svg) no-repeat;}
.instructor-images .swiper-pagination-bullet:focus{outline: none;} */
.swiper-pagination.swiper-button-disabled {
    display: none !important;
}

.information-content-right {
    width: 820px;
    float: left;
    margin-left: 30px;
}

.information-content-texts {
    color: #999999;
    font-size: 16px;
    margin: 10px 0px;
}

.content-title {
    color: #4D4D4D;
    font-size: 17px;
    font-weight: bold;
    margin-bottom: 5px;
}

.information-content-left {
    width: 50%;
}

.instructor-score-number {
    color: #999999;
    font-size: 12px;
}

.instructor-score-look {
    font-size: 12px;
    color: #666666;
    background: #e6e6e6;
    display: inline-block;
    line-height: 20px;
    padding: 0px 5px;
    border-radius: 3px;
}

.information-content-uls li {
    display: inline-block;
    text-align: center;
    margin-right: 30px;
    color: #4D4D4D;
    font-size: 14px;
}

.information-content-uls li p {
    color: #999999;
    font-size: 15px;
    font-weight: bold;
    margin-bottom: 10px;
}

.information-content-uls {
    margin-top: 15px;
}

.information-content-rights .instructor-block-price i {
    color: #808080;
    font-size: 13px;
}

.information-content-rights .know-instructor-button {
    background: #9f353a;
    color: #fff;
    margin-top: 5px;
}

.information-content-rights .know-instructor-button img {
    display: inline-block;
    vertical-align: -5px;
    margin-right: 6px;
}

.content-details {
    border-top: 1px solid #cccccc;
    margin-top: 20px;
    padding-top: 20px;
}

.information-content-top {
    display: inline-block;
    width: 100%;
}

.content-details-left {
    width: 61%;
}

.appointment-specialty-group {
    color: #999999;
    font-size: 16px;
    display: inline-block;
    margin-bottom: 10px;
}

.content-details-right,
.information-content-rights {
    width: 42%;
}

.content-details-right .information-groups .groups-label {
    color: #999999;
    font-size: 15px;
}

.content-details-right .information-link span {
    color: #4D4D4D;
    font-size: 15px;
}

.information-content-right .instructor-name {
    font-weight: bold;
}

.information-content-link li {
    float: left;
    text-align: center;
    margin-right: 5px;
}

.information-content-link li a {
    display: inline-block;
    max-width: 100%;
    width: 30px;
    height: 30px;
}

.information-content-link li a img {
    width: 100%;
    vertical-align: middle;
}

.information-label {
    font-weight: bold;
    margin-right: 10px;
    font-size: 14px !important;
}


.content-titles {
    color: #4D4D4D;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    border-bottom: 1px solid #cccccc;
    padding-bottom: 10px;
    margin-bottom: 25px;
    margin-top: 25px;
}

.content-video {
    margin: 60px 0;
}

.content-video-name {
    color: #555555;
    font-size: 17px;
    font-weight: bold;
    line-height: 20px;
    height: 40px;
    overflow: hidden;
    margin: 8px 0px;
}

.content-video-text {
    color: #999999;
    font-size: 14px;
    line-height: 18px;
    height: 36px;
    overflow: hidden;
}

.instructor-article-pc {
    display: flex;
}

.instructor-article-pc li {
    float: left;
    width: 33.33%;
    box-sizing: border-box;
    padding: 0 5px;
}

.instructor-article {
    padding: 50px 0px;
    display: flex;
}

.instructor-article .content-titles {
    margin-bottom: 50px;
}

.instructor-article-phone {
    display: none;
}

.calendar-block {
    width: 80%;
    margin: 0 auto;
    text-align: center;
    margin-top: 20px;
}

.content-students-main {
    background: #f7f7f7;
    padding: 50px 200px;
}

.content-leave {
    background: #fff;
    padding: 20px 20px;
    margin-bottom: 5px;
}

.content-leave-top {
    color: #4D4D4D;
    font-size: 16px;
    font-weight: bold;
}

.content-leave-top img {
    margin-right: 5px;
}

.content-leave-top .man-icon,
.content-leave-top .woman-icon {
    width: 15px;
    height: 15px;
    background-size: 100% 100%;
    margin-right: 10px;
}

.content-leave-top .instructor-star,
.content-leave-top .instructor-star-no {
    width: 18px;
    height: 18px;
    background-size: 100% 100%;
    margin: 0 1px;
}

.content-leave-texts {
    color: #999999;
    font-size: 15px;
    line-height: 20px;
    margin: 10px 0px;
}

.content-leave-date {
    text-align: right;
    color: #B3B3B3;
    font-size: 12px;
}

.content-replay {
    position: relative;
    background: #f2f2f2;
    padding: 15px;
    margin-top: 18px;
}

.content-leave-top img {
    display: inline-block;
    vertical-align: middle;
}

.content-students {
    padding: 50px 0px;
}

.related-instructor-groups {
    width: 33.33%;
    box-sizing: border-box;
    padding: 0 5px;
}

.related-instructor-groups .instructor-image {
    width: 40%;
}

.related-instructor-groups .instructor-information {
    margin-left: 0;
    float: right;
    width: 58%;
}

.related-instructor-groups .instructor-block-bottom {
    padding-left: 0;
    position: static;
}

.related-instructor-groups .instructor-name a {
    font-size: 18px;
}

.related-instructor-groups .instructor-score {
    font-size: 20px;
    height: 35px;
    margin: 0px;
}
}

.related-instructor-groups .instructor-star,
.related-instructor-groups .instructor-star-no {
    width: 18px;
    height: 18px;
    background-size: 100% 100%;
    margin: 0px 1px;
}

.related-instructor-groups .man-icon {
    width: 15px;
    height: 15px;
    background-size: 100% 100%;
}

.related-instructor-groups .woman-icon {
    width: 15px;
    height: 15px;
    background-size: 100% 100%;
}

.related-instructor-groups .groups-texts {
    margin-left: 40px;
}

.related-instructor-groups .instructor-block-price span {
    margin-right: 5px;
}

.related-instructor-groups .information-groups,
.related-instructor-groups .course-species-label,
.related-instructor-groups .instructor-price-block {
    font-size: 14px;
}

.related-instructor-groups .know-instructor-button {
    margin-top: 10px;
}

/* .related-instructor-groups .instructor-price-block i{font-size: 18px;} */
.related-instructor-groups .instructor-price-block i {
    margin-right: unset;
}

.content-leave-button {
    text-align: center;
}

.content-leaves {
    margin-bottom: 30px;
}

.content-leave-button .content-leave-button-before {
    display: inline-block;
    padding: 6px 20px;
    border: 1px solid #999999;
    border-radius: 50px;
    font-size: 15px;
    color: #797979;
}

.content-leave-button .content-leave-button-before {
    display: none;
}

.content-leave-button a em {
    display: inline-block;
    width: 10px;
    height: 6px;
    background: url(/assets/images/review-arrow-down.svg) no-repeat;
    vertical-align: 3px;
    margin-left: 5px;
}

.content-leave-button .content-leave-button-after {
    background: #999999;
    color: #fff;
    display: inline-block;
    padding: 6px 20px;
    border-radius: 50px;
    font-size: 15px;
}

.content-leave-button .content-leave-button-after em {
    background: url(/assets/images/review-arrow-up.svg) no-repeat;
}

.content-video .swiper-button-next,
.content-video .swiper-button-prev {
    margin-top: -56px;
}

.information-tabs-block-title {
    border-bottom: 1px solid #cccccc;
}

.information-tabs-block-title a {
    display: block;
    text-align: center;
    padding: 10px 0px;
    font-size: 20px;
    color: #4D4D4D;
    font-weight: bold;
    float: left;
}

.information-tabs-block-title .ahover {
    border-bottom: 2px solid #9f353a;
    color: #9f353a;
}

.information-tabs-block-group {
    display: none;
    color: #999999;
    font-size: 17px;
    line-height: 24px;
    word-wrap: break-word;
}

.booking-tabs-block-group {
    display: none;
}

.display-block {
    display: block;
}

.pt-containers {
    border-bottom: 1px solid #ccc;
}

.booking-tabs-block-group {
    display: none;
}

.booking-tabs-block-group.ahover {
    display: block;
}

.booking-tabs-block-title a {
    display: block;
    text-align: center;
    padding: 10px 0;
    font-size: 18px;
    color: #4d4d4d;
    font-weight: 700;
    float: left;
}

.booking-tabs-block-title .ahover {
    border-bottom: 2px solid #9f353a;
    color: #9f353a;
}

.information-tabs-block {
    padding: 50px 0px;
}

.sticky {
    background: #fff;
    position: fixed;
    width: 100%;
    left: 0;
    top: 99px;
    z-index: 2;
}

.related-instructor .instructor-block {
    padding: 0px;
    border: none;
}

.information-content-uls li i {
    font-size: 13px;
    margin-left: 5px;
}

.information-content-link {
    padding-top: 5px;
}

.related-instructor .know-instructor-button {
    font-size: 12px;
    line-height: 25px;
    margin-top: 5px;
}

.related-instructor-groups .course-species-label {
    margin-bottom: 5px;
}

.instructor-block-bottoms .instructor-block-price .information-label {
    width: 100%;
}

.content-details .information-groups-course {
    margin-bottom: 12px;
}

.chosen-container-single .chosen-single abbr {
    display: none !important;
}

.nickname {
    font-size: calc(1em - 3px);
}

.booking-btn {
    width: 100%;
    float: left;
}

@media (max-width: 320px) {
    .chose-time-btn {
        width: 49%;
    }

    .chose-time-btn i {
        width: 100%;
    }
}

/* 訓練專長 */
.pt-expertise {
    max-width: 1200px;
    margin: auto;
}

.pt-expertise h2 {
    text-align: center;
    background: #444;
    border-radius: 5px;
    color: #ffffff;
    font-size: 22px;
    line-height: 33px;
    font-weight: 700;
    padding: 5px 10px;
}

.content-icon-li {
    float: left;
    width: 12.5%;
    margin-top: 22px;
}

.content-icon-main {
    margin: 0 7px;
    border: 3px solid #727272;
    overflow: hidden;
    background: #eaeaea;
    padding: 5px;
    text-align: center;
    border-radius: 5px;
    overflow: hidden;
}

.content-icon-name {
    font-size: 16px;
    font-weight: bold;
    color: #3a3a3a;
    margin: 10px 0px;
    line-height: 44px;
}

.content-icon-main-top {
    background: #9f353a;
}

.content-icon-li:nth-child(7) .content-icon-name {
    line-height: 22px;
}

.content-icon-li:nth-child(8) .content-icon-name {
    line-height: 22px;
}

/* .content-icon-li:nth-child(2n) .content-icon-main{border-color: #9f353a;} */

@media (max-width: 1024px) {
    .content-icon-name {
        font-size: 14px;
        line-height: 24px;
    }
}

@media (max-width: 768px) {
    .pt-expertise {
        width: 100%;
    }

    .content-icon-li {
        width: 25%;
    }

    .content-icon-main {
        margin: 0 2px;
        border: 1px solid #727272;
    }

    .content-icon-li {
        margin-top: 10px;
    }

    .content-icon-name {
        font-size: 14px;
        margin: 5px 0px 0px 0px;
        line-height: 20px;
        height: 50px;
    }
}

/* 訓練專長 END */

/* 訂課行事曆 */

#calendar {
    margin-top: 30px;
}

.booking-num {
    font-size: 17px;
    margin-top: 20px;
    padding: 5px;
    font-weight: bold;
    color: #444444;
}

#totalprice {
    color: #9f353a;
}

.fc-event {
    display: flex !important;
    align-items: center;
    justify-content: center;
}

.fc-event::before {
    content: '';
    width: 0;
    height: 100%;
    display: inline-block;
    position: relative;
    vertical-align: middle;
}

.fc-event {
    background-color: #acacac;
    border: #acacac !important;
}

.fc-ltr .fc-time-grid .fc-event-container {
    margin: unset !important;
}

#allclear {
    border-color: #c2c2c2;
    color: #acacac;
}

.addcheck .fc-title {
    display: inline-block;
    cursor: pointer;
}

.addcheck .fa-times,
#calendar .fa-times {
    top: 2px;
    -webkit-transform: scale(0.75)
}

#price {
    color: #9f353a;
    font-weight: bold;
}

#calendar td {
    font-size: 13px;
}

.prev-next-group {
    margin-top: 10px;
}

.prev-week-range,
.next-week-range {
    width: 35%;
    line-height: 16px;
    height: 32px;
}

.fc-event-container .fc-content {
    position: relative !important;
}

.fc-event-container .overtime {
    background-color: #f2f2f2 !important;
    color: #ccc !important;
}

.fc-event-container .bookable,
.vipbooking {
    background-color: #398e5f !important;
    color: #fff !important;
}

.fc-event-container .vipapply {
    background-color: #e8994b !important;
    color: #fff !important;
}

.fc-event-container .booked {
    background-color: #e1e1e1 !important;
    color: #999 !important;
}

.fc-event-container .addcheck,
#allcheck {
    background-color: #b95755 !important;
    color: #fff !important;
}

.fc-event-container .addcheck>i {
    padding-right: 5px;
}

.fc-event-container .addcheck .fc-content {
    position: unset !important;
}



@media (max-width: 450px) {

    /* .fc-event{height: 39px;} */
    .fc-event-container .long-text {
        padding: 0 9px;
    }
}

@media (max-width: 400px) {
    .fc-event-container .long-text {
        padding: 0 7px;
    }
}

@media (max-width: 375px) {
    .fc-event-container .long-text {
        padding: 0 5px;
    }
}

.fc-button {
    z-index: 0 !important;
}

/* 訂課行事曆 END */

/* 訂課行事曆彈跳視窗 */
.choose-course-block .form-group label {
    font-size: 20px;
}

.choose-course-block label {
    font-size: 15px;
}

.choose-course-block #price {
    font-size: 20px;
}

.choose-course-block .course-block .btn-group {
    font-size: 15px;
    display: block;
}

.choose-course-block .course-items {
    width: 100%;
    display: block;
    margin-bottom: 5px;
}

.choose-course-block .course-items .btn-class {
    padding: 0px 10px;
    border-radius: 2rem;
    margin: 0;
}

.choose-course-block .course-block {
    text-align: left;
}

#currency {
    font-size: calc(1em - 3px);
}

#swal2-title {
    font-size: 24px;
    margin-bottom: 20px;
}

.booking-num .cart-count,
.booking-num .price {
    color: #9f353a;
    font-size: 20px;
}

.btn-class {
    border-color: #c2c2c2;
    color: #acacac;
    font-size: 15px !important;
}

.btn-class:hover {
    color: #b95755;
}

.btn-class.active {
    background-color: #b95755;
    color: #fff;
}

.choose-course-block .btn-info {
    background-color: #b95755;
    color: #fff;
    margin-right: 16px;
}

#s_date,
#e_date {
    background-color: #fff;
}

.go-shopping-cart-btn {
    margin: 20px;
    padding: 10px 40px;
}

.choose-course-block .table th,
.choose-course-block .table td {
    border-bottom: 1px solid #d4d4d4;
    vertical-align: middle;
}

/* 訂課行事曆彈跳視窗 END */

/* 上方fix條*/
#booking-fix-block {
    display: none;
    box-shadow: 0px 5px 10px #ddd;
    background-color: #f8f8f8;
    border-bottom: 1px solid #e6e6e6;
    margin-top: 0px;
    width: 100%;
    text-align: center;
}

.booking-num .sticky {
    display: inline-block;
}

.booking-fix-content {
    width: 50%;
    margin: auto;
    display: inline-block;
    padding-top: 5px;
}

.booking-fix-item {
    line-height: 40px;
    display: inline-block;
}

.booking-fix-item>div {
    float: left;
    display: inline-block;
    margin-left: 10px;
}

.booking-fix-select p {
    display: inline-block;
    margin-right: 5px;
}

.booking-fix-select .btn {
    margin-left: 5px;
}

.booking-fix-content .btn,
.booking-fix-block-phone .btn {
    color: #fff;
}

.clear-chose-time-btn {
    height: 27px;
    border-radius: 2rem;
    background-color: #717071;
    color: #fff;
    padding: 0px 8px;
}

.booking-fix-btn .btn {
    height: 44px;
    line-height: 16px;
    border-radius: unset;
    float: left;
    margin-right: 3px;
}

.booking-fix-btn .chose-time-btn {
    background-color: #3e3a39;
}

.booking-fix-btn .go-shopping-cart-btn {
    background-color: #9d343a;
    padding: 10px 11px;
}

.booking-fix-block-phone {
    display: none;
}

.clear-chose-time-btn {
    display: none;
}

.booking-num .w-40 {
    width: 40%;
}

.booking-num .w-60 {
    width: 60%;
}

#booking-fix-block #totalprice {
    font-size: 20px;
}

#booking-fix-block .cart-count {
    color: #fff;
    font-size: 14.4px;
}

#booking-fix-block .go-shopping-cart-btn {
    margin: 0px auto;
}

.holiday {
    background-color: #05b396;
    font-size: 14px;
    color: #fff;
    border-radius: 15px;
    margin-top: 7px;
    margin: auto;
    display: inline-block;
    padding: 0px 10px;
}

.booking-success {
    background-color: #dbf4d3;
}

.booking-fail {
    background-color: #e6e6e8;
}

.thead-dark {
    text-align: center;
}

/* 上方fix條 END */


/* 側邊茅點 */
.fixs-rights {
    transition: all 0.6s;
    width: 103px;
    position: fixed;
    right: -103px;
    top: 50%;
    z-index: 1100;
    margin-top: -60px;
}

.fixs-rights ul {
    padding: 0;
    margin: 0;
}

.fixs-rights li {
    list-style: none;
}

.fixs-rights li a {
    display: block;
    background: rgba(51, 51, 51, 0.9);
    font-size: 14px;
    color: #fff !important;
    padding-left: 10px;
    line-height: 28px;
    border: 1px solid #fff;
    font-weight: bold;
    text-decoration: none !important;
}

.fixs-rights li a img {
    margin-right: 5px;
    display: inline-block;
    font-size: 14px;
    width: 16px;
    text-align: center;
    vertical-align: -3px;
}

@media (min-width: 1080px) {
    .fixs-rights li a:hover {
        background: #9F353A;
    }
}


.fixs-rights-button {
    display: block;
    width: 25px;
    color: #fff !important;
    font-size: 14px;
    position: absolute;
    left: -25px;
    top: 0;
    background: rgba(51, 51, 51, 0.8);
    padding: 5px 0px;
    text-align: center;
    border: 1px solid #fff;
}

@media (max-width: 767px) {

    .fixs-rights li a,
    .fixs-rights-button {
        font-size: 12px;
    }

    .fixs-rights {
        width: 80px;
        right: -80px;
    }

    .fixs-rights-button {
        width: 20px;
        left: -22px;
    }

    .fixs-rights li a {
        padding-left: 3px;
    }

    .fixs-rights li a i {
        margin-right: 3px;
    }
}

.fixs-rights-hover {
    right: 0px;
}

.fixs-rights .anchor-ahover {
    background: #9F353A;
}

.fixs-rights-button i {
    display: block;
    text-align: center;
}

.fixs-rights-button span {
    line-height: 15px;
}

.fixs-rights-button em {
    display: block;
    font-style: normal;
}

.fixs-rights-other ol {
    margin: 0;
}

.fixs-rights-other {
    width: 210px;
    right: -210px;
}

.article-fixs {
    width: 350px;
    right: -350px;
}

.fixs-rights-other li a {
    line-height: 16px;
    padding-top: 3px;
    padding-bottom: 3px;
}

.fixs-rights-other.fixs-rights-hover {
    right: 0;
}








/* 側邊茅點 END */

/* 已選取的彈跳視窗 */
.booking-alert-title {
    font-size: 24px;
    margin-bottom: 20px;
    font-weight: bold;
    text-align: center;
    color: #444;
}

.booking-alert-btn {
    width: 100%;
    text-align: center;
}

#to-cart {
    margin: 20px auto;
    padding: 10px 41px;
    font-size: 18px;
    border: 0px;
    background-color: #b95755;
    color: #fff;
    border-radius: 5px;
}

@media (max-width: 450px) {
    #booking-fix-block {
        display: none !important;
    }

    .fancybox-content {
        padding: 15px;
    }

    .booking-alert-title {
        font-size: 20px;
    }

    #to-cart {
        font-size: 15px;
    }

    .booking-fix-goto-calendar-phone {
        display: block !important;
    }

    .booking-fix-block-phone,
    .booking-fix-btn-phone {
        z-index: 4
    }

    .booking-fix-block-phone .booking-fix-select {
        position: fixed;
        top: 50px;
        width: 100%;
        background-color: #fff;
        z-index: 3;
        padding: 3px 10px;
        border: 1px solid #c5c6c7;
    }

    .booking-fix-block-phone .clear-chose-time-btn {
        float: right;
        font-size: 12px;
        height: 24px;
    }

    .booking-fix-btn-phone .booking-fix-btn,
    .booking-fix-goto-calendar-phone {
        position: fixed;
        bottom: 64px;
        width: 100%;
        z-index: 11;
    }

    .booking-fix-btn-phone .booking-fix-btn {
        background-color: #fff;
    }

    .booking-fix-btn-phone .booking-fix-btn .btn {
        width: 49.6%;
        color: #fff;
    }

    .booking-fix-btn-phone .go-shopping-cart-btn {
        margin: unset;
    }

    .booking-fix-goto-calendar-phone .goto_calendar {
        width: 100%;
        background-color: #9d343a;
        border-radius: unset;
        color: #fff;
        line-height: 42px;
        padding: unset;
    }
}

@media (max-width: 320px) {
    .booking-alert-title {
        font-size: 17px;
        margin-bottom: 10px;
    }

    .choose-course-block th {
        font-size: 14px !important;
    }

    .choose-course-block td {
        font-size: 12px !important;
    }
}

/* 已選取的彈跳視窗 END*/

/* 批次選課彈跳視窗 */
.multi-select-block {
    width: 670px;
}

.multi-select-table {
    max-height: 300px;
    overflow-y: auto;
    overflow-x: hidden;
}

.multi-select-block .booking-num {
    margin-top: 0px;
}

.multi-select-total-price {
    width: 100% !important;
    background-color: #eee;
    margin-top: 10px;
    padding: 10px 0px;
}

.booking-num .multi-select-result {
    width: 33%;
}

.multi-select-table-btn {
    text-align: center;
}

.multi-select-total {
    background-color: #eee;
    padding: 10px 0px;
}

.multi-select-total p {
    font-size: 20px;
    font-weight: bold;
    text-align: center;
}

.multi-select-table-btn button {
    margin: 20px auto;
    padding: 10px 41px;
    font-size: 18px;
    border: 0px;
    background-color: #b95755;
    color: #fff;
    border-radius: 5px;
}

@media (max-width: 450px) {

    .multi-select-table .booking-num p,
    .multi-select-table .booking-num a {
        width: calc(100%/3);
    }

    .multi-select-table th {
        font-size: 14px !important;
    }

    .multi-select-table td {
        font-size: 12px !important;
    }

    .multi-select-table th,
    .multi-select-table td {
        padding: 0.5rem !important;
    }

}

@media (max-width: 320px) {

    .multi-select-table th,
    .multi-select-table td {
        padding: 0.2rem !important;
    }
}


/* 批次選課彈跳視窗 END*/


/* 學員回饋 */
.content-students-main .rating-container {
    display: inline-block;
    font-size: 17px;
}

.content-students-main .rating-container .star {
    margin: 0 0.5px;
}

.content-students-main .rating-container .filled-stars {
    color: #9f353a;
    -webkit-text-stroke: unset;
    text-shadow: unset;
}

.content-students-main .star-score-text {
    line-height: 48px;
    vertical-align: middle;
}

/* 學員回饋 END*/

@media (max-width: 1199px) {
    .sticky {
        top: 50px;
    }
}

@media (max-width: 1024px) {
    .information-content-right {
        width: 620px;
    }

    .content-details-right,
    .information-content-rights,
    .content-details-left {
        width: 50%;
    }

    #booking-fix-block p,
    #booking-fix-block a {
        width: 30%;
    }

    #booking-fix-block .visitors {
        width: 40%;
    }

    #booking-fix-block .go-shopping-cart-btn {
        padding: 10px 8px;
    }

    .visitors {
        display: none;
    }
}

@media (max-width: 991px) {
    .instructor-images {
        width: 100%;
    }

    .information-content-right {
        float: left;
        width: 100%;
        margin-left: 0px;
        margin-top: 50px;
    }

    .content-title {
        text-align: center;
    }

    .information-content-left {
        width: 100%;
    }

    .information-content-uls li {
        float: left;
        display: block;
        width: 33.33%;
        margin: 0px;
        box-sizing: border-box;
        border-right: 1px solid #cccccc;
    }

    .information-content-uls li:last-child {
        border: none;
    }

    .information-content-rights {
        text-align: center;
        margin-top: 25px;
    }

    .information-content-rights .know-instructor-button {
        width: 80%;
        margin: 0 auto;
        margin-top: 10px;
    }

    .content-details-left {
        width: 100%;
    }

    .content-details-right,
    .information-content-rights {
        width: 100%;
    }

    .information-content {
        padding-bottom: 0px;
    }

    .information-tabs-block {
        padding: 30px 0px;
    }

    .instructor-article-phone {
        display: block;
        position: relative;
    }

    .instructor-article-pc {
        display: none;
    }

    .instructor-article-phone .news-article-group {
        padding-top: 36px;
    }

    .instructor-article-phone .news-article-author {
        top: 0px;
    }

    .instructor-article-phone.index-swiper .swiper-pagination {
        bottom: 29px;
    }

    .instructor-article-phone.index-swiper .swiper-button-prev,
    .instructor-article-phone.index-swiper .swiper-button-next {
        margin-top: -118px;
    }

    .instructor-article .content-titles {
        margin-bottom: 20px;
    }

    .instructor-article,
    .content-students {
        padding: 30px 0px;
    }

    .calendar-block {
        width: 100%;
    }

    .content-students-main {
        padding: 30px 5px 30px 5px;
    }

    .content-leave {
        padding: 10px;
    }

    .related-instructor-groups {
        width: 100%;
        padding: 0px;
    }

    .related-instructor-groups .instructor-image {
        width: 100%;
    }

    .related-instructor-groups .instructor-information {
        width: 100%;
    }

    .related-instructor-groups .instructor-block-bottoms {
        width: 100%;
        margin-bottom: 10px;
    }

    .related-instructor-groups .know-instructor-button {
        margin: 0 auto;
        margin-top: 10px;
        font-size: 14px;
        padding: 5px 0;
    }

    .related-instructor .instructor-information {
        padding-top: 5px;
    }

    .related-instructor-groups .instructor-block-bottoms .instructor-block-price .information-label {
        width: unset;
    }

}

@media (max-width: 450px) {

    #booking-fix-block p,
    #booking-fix-block a {
        width: 50%;
    }

    #booking-fix-block .visitors,
    #booking-fix-block .btn {
        width: 49%;
    }

    .booking-num .total_price {
        width: 67%;
    }
}

@media (max-width: 320px) {
    #booking-fix-block .go-shopping-cart-btn {
        padding: 10px 2px;
    }

    #booking-fix-block p,
    #booking-fix-block a {
        font-size: 15px;
    }
}

/* 包課彈跳視窗*/
.packclass-block {
    width: 49%;
    border: #ddd 1px solid;
}

.class-num-btn:hover {
    color: #fff !important;
}

.packclass-block .class-title {
    font-size: 20px;
    font-weight: bold;
}

.packclass-block p {
    margin: 8px 0px;
    font-size: 15px;
}

.total-block {
    background-color: #eee;
    display: flex;
    padding: 10px 0px;
}

.total-block p {
    float: left;
    width: 50%;
}

.total-block .price-text {
    font-size: 1em;
}

.packclass_num {
    width: 100%;
    text-align: center;
    border: 1px solid #ced4da;
    font-size: 0.9rem;
    display: block;
    height: 40px;
    font-weight: 400;
    line-height: 1.6;
}

.alert-text {
    font-size: 15px;
    font-weight: bold;
    color: #9f353a;
    margin: 10px 0px;
    display: none;
}



/* .packclass-choose-block{display: flex; margin-left: 10px;}
.class-num-btn{background-color: #9f353a;color: #fff!important;font-weight: bold;border: none;float: left;width: 40px;height: 40px;line-height: 40px;cursor: pointer;} 
.packclass-block .plus{border-radius: 0px 5px 5px 0px;}
.packclass-block .minus{border-radius: 5px 0px 0px 5px;}
.packclass_num{width: 100px;text-align: center; border: 1px solid #ced4da;font-size: 0.9rem;display: block;height: 40px; font-weight: 400; line-height: 1.6;}
.class-num-btn[disabled]{background-color: #d4d4d4;}
.packclass_num::-webkit-outer-spin-button,
.packclass_num::-webkit-inner-spin-button {
  -webkit-appearance: none;
}
 @media (max-width: 450px){
	.packclass_num{width: 60px;}
	.packclass-block p{font-size: 14px;}
}

@media (max-width: 320px){
	.packclass_num{width: 50px;}
	.packclass-block p{font-size: 14px;}
	.total-block p{font-size: 15px;}

} */



/*END*/

/* 教練介紹區塊 */
.pt-containers .content-main img {
    max-width: 100%;
}

.pt-containers .content-main img {
    text-align: center;
    margin: auto;
    display: block;
}

.pt-containers .content-img-center {
    text-align: center;
}

.pt-containers .content-main strong {
    font-weight: bold;
    color: #333;
    font-size: 16px;
}

.pt-containers .content-main p em {
    font-size: 25px;
    color: #888;
    font-weight: bold;
    font-style: normal;
}

.pt-containers .content-main strong em {
    color: #888
}

.pt-containers .content-main h2 {
    background: #444;
    border-radius: 5px;
    color: #ffffff;
    font-size: 19px;
    line-height: 33px;
    font-weight: 700;
    padding: 5px 10px;
    margin: 5% 0 2% 0;
}

.pt-containers .content-main {
    padding: 20px 0px;
}

.pt-containers .content-main blockquote p {
    background: #f1f1f1;
    padding: 1%;
    border-left: 3px solid #bfa67a;
}

.pt-containers .content-main h3 {
    font-size: 18px;
    line-height: 33px;
    margin: 5% 0 1.5% 0;
    color: #9f353a;
    font-weight: bold;
}

.pt-containers .content-main h4 {
    font-size: 17px;
    line-height: 33px;
    margin: 5% 0 1.5% 0;
    color: #555;
    font-weight: bold;
}

.pt-containers .content-main a {
    color: #333 !important;
    font-size: 16px !important;
    text-decoration: underline !important;
}

.pt-containers .content-main li {
    font-weight: bold;
    list-style: disc;
    margin-left: 23px;
    color: #888;
    line-height: 30px;
    font-size: 17px;
}

.pt-containers .content-main #content-table {
    height: 322px;
    width: 100%;
}

.pt-containers .content-main .major-item {
    background-color: #9f353a;
    height: 55px;
    text-align: center;
    font-weight: bold;
}

.pt-containers .content-main .major-item p,
.content-main .major-item td {
    color: #fff;
}

.pt-containers .content-main .minor-item {
    background-color: #dcdcdc;
}

.pt-containers h2 {
    text-align: center;
}

.pt-containers ul,
.pt-containers ol {
    text-align: center;
    width: fit-content;
    margin: 3% auto !important;
}

.pt-containers li {
    text-align: left;
}

@media (max-width: 450px) {
    .information-tabs-block-title a {
        font-size: 19px;
    }

    .pt-containers .content-main h2 {
        font-size: 18px;
    }

    .pt-containers .content-main h3 {
        font-size: 17px;
    }

    .pt-containers .content-main h4 {
        font-size: 16px;
    }

    .information-tabs-block-group,
    .pt-containers .content-main strong {
        font-size: 15px;
    }

    .pt-containers .content-main li {
        font-size: 15px;
    }
}

/* 教練介紹區塊 END*/

.instructor-images-swiper .gallery-thumbs .swiper-slide {
    margin: 0 3px;
}



body {
    font-family: "微軟正黑體";
}

.car-inside-title {
    padding-top: 60px;
    padding-bottom: 60px;
}

.step-block {
    text-align: center;
    margin-bottom: 30px;
    padding-right: 70px;
}

.step-group {
    box-sizing: border-box;
    padding: 0px 35px;
    position: relative;
    display: inline-block;
}

.step-number {
    display: inline-block;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    text-align: center;
    line-height: 30px;
    background: #e2e3e3;
    color: #868585;
    position: relative;
    z-index: 2;
}

.step-group p {
    color: #868585;
    font-size: 16px;
    margin-top: 10px;
    min-width: 176px;
}

.step-block .line {
    position: absolute;
    width: 130px;
    height: 24px;
    background: url(/assets/images/grey-arrow.svg) no-repeat;
    background-size: 100% 100%;
    right: -30px;
    top: 3px;
    z-index: 1;
    border-bottom: unset;
    float: unset;
    margin: unset;
}

.step-group-active .step-number {
    background: #a71e2a !important;
    color: #fff !important;
}

.step-group-active .step-block .line {
    background: url(/assets/images/gradient-arrow.svg) no-repeat;
    background-size: 100% 100%;
}

.car-inside-title-img {
    max-width: 800px;
    margin: 0px auto;
    width: 100%;
    box-sizing: border-box;
}

.car-inside-title-img img {
    width: 100%;
    vertical-align: middle;
}

.car-tables th {
    border-bottom: 1px solid #e9eaea;
    border-top: 1px solid #e9eaea;
    padding: 15px 10px;
    color: #595757;
    font-size: 16px;
    font-weight: bold;
}

.car-tables th:first-child {
    border-left: 1px solid #e9eaea;
}

.car-tables th:last-child {
    border-right: 1px solid #e9eaea;
}

.cars-phone {
    display: none;
}

.car-tables td {
    text-align: center;
    border-bottom: 1px solid #e9eaea;
    padding: 30px 10px;
    color: #2C2D2D;
    font-size: 16px;
}

.car-tables td a {
    color: #2C2D2D;
    text-decoration: underline;
}

.car-product {
    display: inline-block;
}

.car-product img {
    display: block;
    width: 80px;
    height: 80px;
    vertical-align: middle;
}

.car-product-text {
    margin-left: 100px;
    line-height: 20px;
    padding-top: 30px;
}

.color-red {
    color: #A71F2A !important;
}

.car-tables td .small-font {
    font-size: 14px;
    font-style: normal;
}

.car-delete {
    font-size: 16px;
    display: none;
}

.car-bodys-table-tr .car-delete {
    display: block;
}

.car-td-phone-hover .car-delete {
    display: block;
}

.car-delete:hover {
    cursor: pointer;
    color: #A71F2A;
}

.car-delete i {
    margin-right: 1px;
}

.car-delete-text {
    font-size: 12px;
    display: block;
    line-height: 10px;
}

.cars-phone li {
    border-top: 1px solid #e9eaea;
    padding: 15px 0px;
}

.car-phone-top-group {
    width: 50%;
}

.car-phone-top-group.right {
    text-align: right;
}

.car-phone-delete {
    display: inline-block;
    font-size: 12px;
    color: #231815;
    line-height: 20px;
    padding: 0 5px;
    border: 1px solid #e2e3e3;
    border-radius: 3px;
}

.car-phone-delete i {
    vertical-align: 1px;
}

.car-phone-top-group .small-font {
    font-size: 14px;
}

.car-phone-top-group .car-phone-delete {
    margin-bottom: 24px;
}

.car-amounts {
    display: inline-block;
    margin-top: 20px;
    min-width: 200px;
}

.car-amount-top {
    padding: 20px 30px;
    border-bottom: 1px solid #e9eaea;
    box-sizing: border-box;
    width: 510px;
}

.car-amount-group {
    width: 33.33%;
    color: #2C2D2D;
    font-size: 16px;
    margin-bottom: 20px;
    float: left;
}

.car-amount-price {
    text-align: right;
}

.car-amount-middle {
    text-align: center;
}

.car-course-number {
    margin: 0px 10px;
}

.car-blod {
    font-weight: bold;
}

.car-coupons {
    font-size: 16px;
    line-height: 28px;
}

.car-coupons-main input {
    -webkit-appearance: none;
    height: 28px;
    line-height: 28px;
    box-sizing: border-box;
    border: none;
    font-family: "微軟正黑體";
}

.car-coupons-main input[type="text"] {
    width: 150px;
    text-align: center;
    background: #e2e3e3;
    font-size: 16px;
    padding: 0px 10px;
}

.car-coupons-main {
    margin-left: 10px;
}

.car-coupons-main input[type="button"] {
    background: #a71e2a;
    color: #fff;
    width: 62px;
    text-align: center;
    margin-left: 2px;
}

.car-coupons-right {
    margin-left: 309px;
    text-align: right;
}

.car-amount-total {
    color: #2C2D2D;
    font-size: 26px;
    text-align: right;
    padding-top: 10px;
}

.car-amount-total .total-price {
    color: #A71F2A;
    font-size: 26px;
    font-weight: bold;
    margin-left: 10px;
}

.car-form-title {
    border: 1px solid #e9eaea;
    padding: 15px 30px;
    color: #231815;
    font-size: 17px;
    font-weight: bold;
    margin-top: 45px;
}

.car-form-group li {
    padding: 0 30px;
    margin-top: 20px;
    color: #231815;
    font-size: 16px;
    line-height: 22px;
}

.car-form-group input {
    width: 22px;
    height: 22px;
}

.car-form-group-right {
    margin-left: 32px;
}

.car-input-group {
    padding: 0px 30px;
    margin-top: 15px;
    line-height: 34px;
    font-size: 16px;
}

.car-input-group-input {
    margin-left: 90px;
}

.car-input-group-input input {
    -webkit-appearance: none;
    height: 34px;
    border: 1px solid #e9eaea;
    box-sizing: border-box;
    width: 100%;
    max-width: 360px;
    font-size: 16px;
    font-family: "微軟正黑體";
    padding: 0px 10px;
}

.car-agree {
    border-bottom: 1px solid #e9eaea;
    border-top: 1px solid #e9eaea;
    padding: 12px 30px;
    line-height: 22px;
    margin: 40px 0px;
}

.car-agree input {
    width: 18px;
    height: 18px;
    display: block;
}

.car-agree-text {
    margin-left: 30px;
    color: #231815;
    font-size: 12px;
}

.car-agree-text a {
    color: #3490dc;
    text-decoration: underline;
}

.cars-pc .cars-next a {
    display: block;
    line-height: 42px;
    font-size: 16px;
    font-weight: bold;
    width: 140px;
    text-align: center;
    border-radius: 10px;
}

.button-gray {
    background: #878687;
    color: #fff;
}

.button-red {
    background: #aa3d4e;
    color: #fff;
}

.cars-phone-fix {
    position: fixed;
    width: 100%;
    left: 0;
    bottom: 60px;
    background: #fff;
    border-top: 1px solid #e9eaea;
    z-index: 1000;
}

.cars-phone-fix a {
    display: block;
    width: 84px;
    line-height: 48px;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
}

.cars-phone-fix-text {
    margin-left: 86px;
    margin-right: 86px;
    text-align: center;
    line-height: 44px;
    text-align: center;
    color: #231815;
    font-size: 14px;
}

.cars-phone-fix-price {
    font-size: 16px;
    font-weight: bold;
}

.cars-phone-fix-price i {
    font-size: 14px;
}

.price-minute {
    color: #444;
    font-size: 0.8em !important;
}

.information-course {
    line-height: 29px;
    margin-left: 5px;
    position: absolute;
}

.information-course i {
    font-size: 12px !important;
    cursor: pointer;
}

.information-course p {
    font-size: 12px !important;
    background-color: #ffe9e6;
    padding: 5px !important;
    position: absolute;
    bottom: 24px;
    line-height: 19px !important;
    border: 1px solid #e0b9b4;
    border-radius: 5px;
    min-width: 235px;
    display: none;
    text-align: justify;
    color: #474747;
}

.pack-td label {
    margin-bottom: unset;
}


@media (min-width: 1080px) {

    .button-gray,
    .button-red:hover {
        opacity: 0.8;
    }
}

@media (max-width: 1080px) {
    .cars-pc .car-tables th {
        padding: 5px 5px;
        font-size: 12px;
    }

    .cars-pc .car-tables td {
        font-size: 12px;
        padding: 5px 5px;
        border-bottom: none;
    }

    .cars-pc a {
        font-size: 12px;
    }

    .car-product img {
        width: 60px;
        height: 60px;
    }

    .car-product-text {
        margin-left: 70px;
        padding-top: 20px;
    }

    .car-tables td .small-font {
        font-size: 12px;
    }

    .first-class-phone {
        position: absolute;
        right: 8px;
        font-size: 12px;
    }
}

@media (max-width: 767px) {
    .car-inside-title {
        padding-top: 25px;
        padding-bottom: 25px;
    }

    .step-block {
        display: none;
    }

    .car-inside-title-img {
        box-sizing: border-box;
    }

    .cars-phone {
        display: block;
    }

    .cars-pc {
        display: none;
    }

    .car-product img {
        width: 60px;
        height: 60px;
    }

    .car-product-text {
        margin-left: 70px;
        padding-top: 20px;
    }

    .cars-phone .car-tables th {
        padding: 5px 5px;
        font-size: 12px;
    }

    .cars-phone .car-tables td {
        font-size: 12px;
        padding: 5px 5px;
        border-bottom: none;
    }

    .cars-phone .car-tables {
        margin-top: 10px;
    }

    .cars-phone .car-product-text,
    .car-phone-top-group.right {
        font-size: 16px;
    }

    .car-amount-top {
        width: 100%;
        box-sizing: border-box;
        padding: 15px 0px;
    }

    .car-amount-group {
        font-size: 14px;
        margin-bottom: 10px;
    }

    .car-coupons-main input[type="text"] {
        width: 110px;
        font-size: 14px;
    }

    .car-coupons-main input[type="button"] {
        width: 46px;
        font-size: 14px
    }

    .car-coupons-right {
        margin-left: 233px;
    }

    .car-coupons {
        font-size: 14px;
    }

    .car-coupons-main {
        margin-left: 5px;
    }

    .car-amount-total {
        font-size: 18px;
        padding-top: 12px;
    }

    .car-amount-total .total-price {
        margin-left: 10px;
    }

    .car-amount-total .total-price {
        font-size: 18px;
    }

    .car-form-title {
        margin-top: 25px;
        font-size: 16px;
        padding: 8px 6px;
    }

    .car-form-group input {
        width: 18px;
        height: 18px;
    }

    .car-form-group li {
        font-size: 14px;
        line-height: 18px;
        padding: 0px 6px;
    }

    .car-form-group-right {
        margin-left: 22px;
    }

    .car-input-group-input input {
        font-size: 14px;
    }

    .car-agree input {
        width: 18px;
        height: 18px;
    }

    .car-agree-text {
        margin-left: 22px;
    }

    .car-agree {
        padding: 5px 6px;
        margin: 20px 0px;
    }

    .car-containers {
        margin-bottom: 44px;
    }

    .car-amounts {
        min-width: 150px;
    }

    .information-course p {
        min-width: 150px;
    }
}

/*7月27日*/
.car-bodys {
    background: #f7f7f7;
    padding: 20px 0px 55px 0px;
    border-top: 2px solid #d5d6d7;
}

.car-title {
    color: #222120;
    font-size: 23px;
    font-weight: bold;
    margin-bottom: 10px;
}

.car-lists {
    background: #fff;
    margin-bottom: 10px;
    border: 1px solid #eeeeef;
}

.car-checkbox-lable {
    color: #555555;
    font-size: 13px;
    margin-bottom: unset;
    margin-left: 11px;
}

.car-checkbox-all {
    margin-top: 5px;
    margin-left: 17px;
}

.car-checkbox {
    width: 15px;
    height: 15px;
    border: 1px solid #959696;
    display: inline-block;
    margin-right: 5px;
    vertical-align: middle;
}

.car-item-title .car-checkbox {
    margin-top: 18.5px;
}

.car-item-title {
    line-height: 52px;
    border-bottom: 1px solid #eeeeef;
    padding: 10px 20px;
}

.pt-images {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    vertical-align: middle;
    margin-right: 10px;
}

.pt-name {
    font-size: 15px;
    color: #555555;
}

.car-bodys-table thead {
    display: table;
    table-layout: fixed;
    width: calc(100% - 1em);
}

.car-bodys-table tbody {
    display: block;
    max-height: 300px;
    overflow: auto;
    overflow-x: hidden;
}

.car-bodys-table th {
    border-bottom: 1px solid #eeeeef;
    padding: 10px 0px;
    color: #555555;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
}

.car-bodys-table td {
    padding: 10px 0;
    color: #555555 !important;
    font-size: 15px;
    text-align: center;
}

.car-table-more th,
.car-table-more td {
    width: 230px;
}

.car-table-more th:first-child,
.car-table-more td:first-child {
    width: 40px;
}

.car-table-more select {
    padding: 0 20px;
}

.car-selects {
    text-align: center;
    text-align-last: center;
    border: none;
    border-bottom: 1px solid #a5a5a5;
    border-radius: 0px;
    display: inline-block;
    color: #555555;
    font-size: 13px;
    height: 25px;
    line-height: 25px;
    background: none;
}

.car-select-class {
    font-size: 15px;
}

.car-appointment {
    color: #A71F2A;
    font-size: 12px;
    font-weight: bold;
    margin-top: 5px;
}

.car-tables-price {
    color: #A71F2A !important;
    font-size: 13px !important;
}

.car-tables-price i {
    font-size: 15px !important;
}

.car-remaining {
    font-size: 13px;
    color: #A71F2A;
}

.car-selects-date {
    width: 150px;
}

.car-content-phone {
    display: none;
}

.sum-main {
    display: inline-block;
}

.min,
.add {
    width: 25px;
    height: 25px;
    border: none;
    border: 1px solid #cccccc;
    background: none;
    box-sizing: border-box;
}

.text_box {
    border: none;
    width: 50px !important;
    text-align: center;
    background: none;
    margin: 0px 5px;
    height: 25px;
    border: 1px solid #cccccc;
    box-sizing: border-box;
}

.text_box:focus {
    background: #ddd;
}

.min:focus,
.add:focus {
    outline: none;
}

.car-bodys-table tbody tr {
    width: 100%;
    display: inline-table;
}

.car-bodys-table ::-webkit-scrollbar {
    width: 5px;
    margin-left: 0px;
    background-color: #f8f8f8;
}

.car-bodys-table ::-webkit-scrollbar-track {
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

.car-bodys-table ::-webkit-scrollbar-thumb {
    -webkit-border-radius: 4px;
    border-radius: 4px;
    background: rgb(219, 219, 219);
}

.car-bodys-table-tr td,
.car-td-phone-hover {
    background: #f8edee;
}

.table-class-name {
    width: 280px;
}

.coupon-use {
    text-decoration: 1px #444 solid !important;
    text-decoration: underline !important;
}

.original-price-group {
    display: inline-block;
    float: left;
}

.coupon-group p {
    display: inline-block;
    float: left;
    margin-left: 10px;
}

.discount-block {
    font-size: 15px;
    border-bottom: 1px solid #e9eaea;
    display: flex;
    padding-bottom: 10px;
}

.discount-block p {
    width: 50%;
    text-align: left;
    float: left;
}

.discount-block span {
    width: 50%;
    text-align: right;
    display: block;
    float: left;
}

.coupon-group span {
    margin-left: 10px;
}


@media (max-width: 1079px) {
    .car-content-phone {
        display: block;
    }

    .car-content-pc {
        display: none;
    }

    .step-group {
        padding: 0px;
    }

    .car-title {
        text-align: center;
        font-size: 20px;
    }

    .car-item-title {
        line-height: 30px;
        padding: 5px;
    }

    .pt-images {
        width: 30px;
        height: 30px;
        margin-left: 10px;
    }

    .car-item-title .car-checkbox {
        margin-top: 7.5px;
    }

    .car-td-phone {
        padding: 5px;
        border-bottom: 1px solid #eeeeef;
        position: relative;
    }

    .car-td-right {
        margin-left: 20px;
    }

    .car-td-group {
        font-size: 12px;
        line-height: 25px;
        margin-bottom: 6px;
    }

    .car-td-phone .car-checkbox {
        margin-top: 5px;
    }

    .car-selects {
        font-size: 12px;
        width: 100px;
        background: url("/assets/images/select-arrow.svg") no-repeat scroll right center transparent;
        background-size: 8px 8px;
        text-align: left;
        padding-left: 5px;
        appearance: none;
        -moz-appearance: none;
        -webkit-appearance: none;
    }

    .car-select-class {
        width: 135px;
    }

    .car-checkbox-lable {
        font-size: 12px;
    }

    .pt-name {
        font-size: 12px;
    }

    .car-tables-price {
        font-size: 12px !important;
    }

    .car-td-group .car-checkbox {
        vertical-align: middle;
        margin-top: 0px;
    }

    .car-td-phone .car-delete {
        position: absolute;
        bottom: 10px;
        right: 8px;
        font-size: 15px;
        text-align: center;
    }

    .car-td-phone .sum-main {
        vertical-align: middle;
    }

    .car-checkbox-all {
        margin-left: unset;
    }

    .car-checkbox-lable {
        margin-left: unset;
    }
}

.car-bottoms {
    padding: 15px 0px;
    line-height: 32px;
    border-top: 2px solid #d5d6d7;
    color: #555555;
    font-size: 15px;
}

.car-bottoms .car-checkbox {
    margin-top: 9px;
}

.car-bottoms-right a {
    display: inline-block;
    background: #a71f2a;
    color: #fff;
    border-radius: 50px;
    padding: 0px 15px;
    margin-left: 15px;
}

.car-bottoms-right a i {
    margin-right: 5px;
}

.car-bottoms-main {
    padding: 0px 20px;
    display: flow-root;
}

.car-bottoms-content {
    position: fixed;
    width: 100%;
    left: 0;
    bottom: 0;
    z-index: 1100;
    background: #fff;
    display: none;
}

.car-bottom-phone {
    display: none;
}

.car-bottom-phone {
    border-top: 2px solid #d5d6d7;
    line-height: 40px;
    background: #f7f7f7;
    text-align: center;
    color: #231815;
    font-size: 12px;
}

.car-bottom-phone-price {
    color: #A71F2A;
}

.car-bottom-phone a {
    display: block;
    width: 105px;
    color: #fff;
    background: #868585;
    font-size: 16px;
    font-weight: bold;
}

.car-bottom-phone-mains {
    margin-left: 105px;
    margin-right: 105px;
}

.car-bottom-phone a.right {
    background: #aa3d4e;
}

.car-bottom-phone-price i {
    font-size: 16px;
}

@media (min-width: 1080px) {
    .car-bottoms-right a:hover {
        opacity: 0.8;
    }
}

@media (max-width: 1079px) {
    .car-bottoms-main {
        padding: 0px;
    }

    .car-bottoms {
        font-size: 12px;
        padding: 10px 0px;
        line-height: 28px;
    }

    .car-bottoms-right a {
        margin-left: 5px;
        padding: 0px 8px;
    }

    .car-bottoms .car-checkbox {
        margin-top: 6px;
    }

    .car-bottom-phone {
        display: block;
    }

    .car-containers {
        margin-bottom: 92px;
    }
}

@media (max-width: 767px) {
    .car-containers {
        margin-bottom: 92px;
    }

    .car-bottoms-content {
        bottom: 109px
    }

    #triple-invoice-content input {
        width: 100% !important;
        height: 34px !important;
    }

}

.phone-verified-alert-block .input-code {
    padding: 10px;
    width: 100%;
    margin: 10px 0;
    border: 1px solid #d9d9d9;
}

.check-verify-code {
    border-radius: 5px;
    border: none;
    background-color: #b95755;
    color: #fff;
    padding: 10px;
    font-size: 15px;
    width: 33%;
}

.send-verify-code {
    border-radius: 5px;
    border: none;
    background-color: #8b8b8b;
    color: #fff;
    font-size: 15px;
    width: 65%;
    margin-right: 3px;
    padding: 10px 0;
    margin: auto;
}

.send-verify-code:disabled {
    background-color: rgba(130, 130, 130, 0.5);
    color: rgba(130, 130, 130, 0.5);
}


.profile-content {
    margin: 40px auto;
    max-width: 1450px;
}

.profile-content th,
.profile-content td {
    text-align: center;
    vertical-align: middle;
}

.profile-content .form-row {
    margin: 8px 0px;
}

.alert-message {
    font-size: 15px;
    color: rgb(211, 28, 49);
    font-weight: bold;
}

table,
td,
tr,
th {
    font-size: 15px;
}

.rwd-table th,
td {
    text-align: center;
}

.phone_verify .row {
    margin: 0px;
}

#send {
    margin: 20px 0px;
}

.license {
    width: fit-content;
    padding: 5px 10px;
    float: left;
    background-color: #ddd;
    margin: 5px;
    border-radius: 35px;
}

.edit-btn {
    width: 150px;
}

.profile-left-block {
    flex: 17%;
    max-width: 17%;
    padding-right: 15px;
    padding-left: 15px;
}

.profile-right-block {
    flex: 80%;
    max-width: 80%;
    padding-right: 15px;
    padding-left: 15px;
}

.send_float {
    display: none;
}

.btn-float {
    background: #9f353a;
    color: #fff !important;
    padding: 0.375rem 0.5rem;
}

.greetings-block p {
    font-size: 16px;
    font-weight: bold;
    background-color: #fde7e9;
    padding: 10px;
}

@media screen and (max-width: 451px) {
    #send-verify-code-phone {
        margin-top: 10px;
    }

    #send-verify-code-email {
        margin-top: 10px;
    }

    .rwd-table th {
        display: none;
    }

    .rwd-table td {
        display: block;
        border: none;
    }

    .rwd-table td:before {
        content: attr(data-th) " ";
        float: left;
        font-weight: bold;
    }

    .p-l-15 {
        padding-left: 15px;
    }

    #send_float {
        position: fixed;
        bottom: 64px;
        left: 0;
        border-radius: 0;
    }

    .greetings-block p {
        font-size: 12px;
        padding: 1px 5px;
    }
}

.quick-login-btn-block {
    width: 65%;
    margin: auto;
}

.quick-login-btn-block .login-button {
    width: 32%;
}

@media screen and (max-width: 1024px) {
    .quick-login-btn-block {
        width: 67%;
    }

    .quick-login-btn-block .login-button {
        width: 30%;
    }
}

@media screen and (max-width: 450px) {
    .quick-login-btn-block {
        width: 100%;
    }

    .swal2-content {
        padding: 0 1.2em !important;
    }
}

@media screen and (max-width: 320px) {
    .swal2-content {
        padding: 0 !important;
    }
}



/* 選單 */
.profile-left-block,
.profile-right-block {
    margin-top: 20px;
}

.profile-right-block form {
    font-size: 16px;
    margin-top: 20px;
}

.profile-right-block .label-title {
    font-weight: bold;
}

#left-menu-block-pc .profile-left-block {
    padding: 10px 0;
}

#left-menu-block-phone {
    display: none;
}

#left-menu-block-pc {
    background: #f7f7f7;
    border-top: 1px solid #e6e6e6;
    border-bottom: 1px solid #e6e6e6;
}

#left-menu-block-pc .title {
    padding: 5px 0;
    font-size: 17px;
    text-align: center;
    font-weight: bold;
}

#left-menu-block-pc .nav-link {
    color: #444;
    padding: unset;
    padding-left: 15px;
    text-align: left;
}

#left-menu-block-pc .nav-item {
    padding: 0.5rem 1rem;
}

.menu-active {
    color: #9f353a !important;
}

#left-menu-block-pc .menu-active {
    border-left: 3px solid #bd454b;
}

.profile-left-block em {
    border-radius: 50%;
    display: inline-block;
    background: #bd454b;
    color: #fff;
    line-height: 16px;
    width: 16px;
    text-align: center;
    font-size: 12px;
}

.now-time {
    text-align: center;
}


@media screen and (max-width: 770px) {

    .profile-left-block,
    .profile-right-block {
        margin-top: 0px;
    }

    #left-menu-block-pc {
        display: none;
    }

    #left-menu-block-phone {
        display: block;
    }

    #left-menu-block-phone select {
        width: 100%;
        padding: 10px;
    }

    .profile-left-block {
        max-width: 100%;
        position: fixed;
        top: 48px;
        z-index: 4;
        background-color: #4d4d4d;
    }

    .profile-right-block {
        max-width: 100%;
        flex: auto;
        margin-top: 60px;
    }

    /* new */
    .head-person-fix {
        position: fixed;
        width: 100%;
        z-index: 1001;
        top: 50px;
        left: 0px;
    }

    .head-person-fix li {
        float: left;
        width: 33.33%;
    }

    .head-person-fix ul {
        height: 31px;
        overflow: hidden;
        transition: all 0.8s;
        background-color: rgba(51, 51, 51, 0.8);
    }

    .head-person-fix li a {
        display: block;
        color: #CCCCCC;
        font-size: 13px;
        font-weight: bold;
        line-height: 18px;
        padding: 6px 0px;
        text-align: center;
        border-right: 1px solid #ccc;
        border-bottom: 1px solid #ccc;
        background: rgba(51, 51, 51, 0.8);
    }

    .head-person-fix li a.not-complete {
        background-color: rgba(144, 8, 6, 0.8);
    }

    .showdown {
        display: block;
        background: rgba(0, 0, 0, 0.9);
        ;
        line-height: 25px;
        color: #fff !important;
        font-size: 12px;
        text-align: center;
    }

    .showdown i {
        margin-left: 5px;
    }

    .head-person-fix .ul-hight {
        height: auto;
    }

    .now-time {
        display: none;
    }

}

/* 選單 END */

/* 教練行事曆 */
.fancybox-is-open .fancybox-bg {
    opacity: .4;
}

.fancybox-can-swipe .fancybox-content,
.fancybox-can-pan .fancybox-content {
    padding: 1.25em;
    border-radius: .3125em;
}

.fancybox-content .fancy-title {
    font-weight: 600;
    color: #595959;
    font-size: 24px;
    margin-bottom: 20px;
    text-align: center;
}

.fancybox-content .fancy-btn {
    outline: none;
    box-shadow: none;
    border-radius: .25em;
    font-size: 1.0625em;
    margin: .3125em;
    padding: .625em 2em;
    font-weight: 500;
    border: none;
    color: #fff;
}

.fancybox-content .del-class {
    background-color: rgb(185, 87, 85);
}

.fancybox-content .select-user {
    background-color: #444444;
}

.fancybox-content .fancy-booking-text {
    color: #fff;
    text-align: center;
    font-size: 15px;
    padding: 5px 0;
}

.fancybox-content .booking-time {
    text-align: center;
    margin-top: 5px;
}

.fancybox-content .booking-time span {
    font-size: 14px;
    margin-right: 5px;
}

.fancybox-content .booking-time .booking_time_up,
.booking-time .booking_time_down {
    color: blue;
}

.fancybox-content .fancy-booking-text.completed {
    background-color: #2e8b60;
}

.fancybox-content .fancy-booking-text.punchnotyet {
    background-color: #ff7600;
}

.fancybox-content .fancy-booking-text.booked {
    background-color: #e1e1e1;
    color: #999;
}

#calendar .fc-more {
    display: block;
    background-color: rgb(58, 114, 167);
    color: #fff;
    line-height: 40px;
    border-radius: 3px;
}

.booking .fc-content .fa-times {
    display: none;
}

.coach-calendar .explanation-btn {
    border: 1px #444 solid;
    background: none;
    border-radius: 4px;
    font-size: 12px;
}

.explanation-block-phone {
    display: none;
}

.explanation-content {
    display: none;
}

.checked {
    background-color: #444444 !important;
}

.explanation-left-block {
    width: 60%;
    float: left;
}

.color-icon {
    border: 1px #ddd solid;
    display: inline-block;
    padding: 5px 15px;
    margin-bottom: 10px;
    margin-right: 10px;
    font-size: 13px;
}

.color-icon li {
    float: left;
    margin-right: 8px;
}

.color-icon li span {
    width: 10px;
    height: 10px;
    line-height: 10px;
    display: inline-block;
    margin-right: 5px;
    margin-right: 3px;
}

.analysis-block {
    display: inline-block;
    border: 1px #ddd solid;
    padding: 5px 15px;
    line-height: 28px;
    float: left;
}

.analysis-block p {
    width: 100%;
    clear: both;
}

.analysis-block input {
    height: 28px;
    margin-right: 5px;
    border-radius: 5px;
    border: 1px #afacac solid;
}

.analysis-block button {
    background-color: #444444;
    color: #fff;
    padding: 0 10px;
    font-size: 13px;
}

.analysis-block .submit-button {
    text-align: right;
}

.analysis-block .submit-button #search {
    background-color: #2d9559;
    color: #fff;
}

.analysis-block .submit-button #clearDate {
    background-color: #9f353a;
    color: #fff;
}

.analysis-block label {
    float: left;
    font-weight: bold;
    margin-right: 5px;
    margin-bottom: unset;
}

.analysis-block label .analysis-box {
    float: left;
}

.analysis-block .analysis-box ul {
    display: flow-root;
}

.analysis-block .analysis-box label {
    line-height: 20px;
}

.analysis-block .analysis-box li {
    width: 34%;
    float: left;
    font-size: 13px;
    line-height: 20px;
}

.profile-right-block .coach-calendar #calendar {
    margin-top: unset;
}

.coach-calendar .operating-block {
    display: inline-block;
    width: 65%;
}

.coach-calendar .operating-block .set-class {
    width: 33%;
    float: left;
    text-align: left;
}

.coach-calendar .operating-block .choose-class-operating {
    width: 67%;
    float: left;
    text-align: left;
}

.coach-calendar .operating-block button {
    display: inline-block;
    border: 0px;
    border-radius: 3px;
    cursor: pointer;
    font-size: 14px;
    height: 36px;
}

.coach-calendar .operating-block .set-class-btn {
    background-color: #315481;
    color: #fff;
    width: 48%;
}

.coach-calendar .operating-block .set-class-btn:hover {
    opacity: 0.8;
}

.coach-calendar .operating-block .choose-class-btn {
    background-color: #f78849;
    color: #fff;
    width: 32%;
}

.coach-calendar .operating-block .choose-class-btn:hover {
    opacity: 0.8;
}

.coach-calendar .unbooking .fc-content {
    position: unset !important;
}

.coach-calendar .unbooking .fc-content .fa-times {
    top: 0 !important;
}

.coach-calendar .fc-content {
    color: #fff;
}

.coach-calendar .unbooking {
    background-color: rgb(172, 172, 172);
}

.coach-calendar .rolebooking {
    background-color: #247BA0 !important;
}

.coach-calendar .checked {
    background-color: #eb5050 !important;
}

.coach-calendar .booked {
    background-color: #717271 !important;
}

.coach-calendar .setuserclass {
    background-color: #ffc400 !important;
    color: #444 !important;
}

.coach-calendar .setuserclass .fc-content {
    color: #444 !important;
}

.coach-calendar .overtime {
    background-color: #e6e3e3 !important;
    color: #ccc !important;
}

.coach-calendar .completed {
    background-color: #36ad71 !important;
}

.coach-calendar .punchnotyet {
    background-color: #ff8800 !important;
}

.coach-calendar .editclass {
    background-color: #8554b3 !important;
}

.course-type-item {
    display: inline-block;
}

.course-type-item .course-name {
    width: 30%;
    display: inline-block;
    float: left;
    text-align: right;
    padding-right: 8px;
}

.course-type-item .time-option {
    float: left;
}

@media screen and (max-width: 1024px) {
    .coach-calendar .operating-block .set-class {
        width: 50%;
    }

    .explanation-left-block {
        width: 44%;
    }
}

@media screen and (max-width: 770px) {
    .explanation-left-block {
        width: 40%;
    }

    .profile-right-block .card-body {
        padding: 10px;
    }

    .open-class-block {
        padding-left: unset;
    }

    .course-type-item {
        padding: unset;
    }

    .course-type-item .course-name {
        width: 40%;
    }
}

@media screen and (max-width: 450px) {
    .fc-center {
        display: none;
    }

    .fc-toolbar {
        display: block !important;
    }

    .explanation-block-phone {
        display: inline-block;
    }

    .explanation-block-pc {
        display: none;
    }

    .profile-right-block #calendar td,
    .profile-right-block #calendar th {
        font-size: 12px;
    }

    .profile-right-block #calendar .fc-more {
        line-height: 17px;
        height: 53px;
    }

    .profile-right-block .card {
        border: unset;
    }

    .profile-right-block .card-body {
        padding: 0px;
    }

    .profile-right-block .fc-time-grid .fc-slats td {
        height: 49px;
    }

    /* .profile-right-block .fc-event{height: 48px;} */
    .profile-right-block .fc-event-container .long-text {
        line-height: 13px !important;
        padding: 0px;
    }

    .profile-right-block #calendar .fa-times {
        -webkit-transform: scale(0.5);
    }

    .color-icon,
    .analysis-box {
        width: 100%;
        margin-bottom: 10px;
        margin-top: 10px;
    }

    .analysis-box {
        margin-right: 0px;
    }

    .color-icon p,
    .analysis-box p {
        font-size: 12px;
        float: left;
        margin-left: 10px;
    }

    .analysis-box-phone {
        margin-top: 10px;
    }

    #coach-calendar .coach-calendar-s-time {
        background-color: #fff !important;
    }

    .explanation-content div {
        width: 100%;
        padding: unset;
        display: inline-block;
        margin: unset;
        font-size: 12px;
        padding: 0 5px;
    }

    .coach-calendar .operating-block {
        width: 100%;
    }

    .coach-calendar .operating-block .set-class {
        width: 100%;
        text-align: center;
    }

    .coach-calendar .operating-block .choose-class-operating {
        width: 100%;
        text-align: center;
        margin-top: 10px;
    }

    .coach-calendar .fc-content .fa-times {
        right: -5px;
    }

    .analysis-block {
        margin-top: 10px;
    }

    .analysis-block label {
        width: 100%;
        margin-top: 5px;
    }

    .analysis-block button {
        padding: 0 5px;
    }

    .analysis-block .analysis-box ul {
        display: block;
    }

}

@media screen and (max-width: 350px) {
    .analysis-block input[type=date] {
        width: 48%;
        float: left;
    }

    .analysis-block button {
        padding: 0 4px;
    }
}

/* 社群管理 */
#videoform {
    margin-top: 20px;
}

.form-check-inline {
    display: inline-block;
}

.form-check-label {
    margin-left: 10px;
    font-weight: bold;
}

.form-group {
    margin-top: 20px;
}

/* 教練新增文章 */
.upload-img img {
    width: 100%;
}

/* 搜尋區塊 */
.search-block {
    width: 100%;
    background-color: #eee;
    padding: 10px;
    border: 1px #d4d2d2 solid;
    border-radius: 5px;
}

.search-text {
    font-size: 17px;
    font-weight: bold;
    margin: 10px;
    margin: 2px 10px;
}

.booking-search-input {
    width: 24% !important;
}

.search-block .search-input {
    width: 32%;
    float: left;
    margin: 2px;
    margin-bottom: 5px;
}

.search-block .search-datetime {
    width: 38%;
    float: left;
    margin: 2px;
}

.search-block .search-datetime .input-group {
    width: 100%;
}

.search-calendar-datetime {
    width: 100%;
    margin: 15px 0px;
}

.search-btn {
    background-color: #5d5d5d;
    color: #fff;
    border-radius: 40px;
    margin-left: 10px;
    padding: 2px 15px;
}

.user-cancel-list-block .search-block .search-input {
    width: 24%;
}


@media screen and (max-width: 1024px) {
    .search-block .search-datetime {
        width: 43%;
    }
}

@media screen and (max-width: 450px) {
    .fix-search-block-btn {
        line-height: 15px;
        font-weight: bold;
        display: block !important;
        width: 25px;
        color: #fff !important;
        font-size: 12px;
        position: fixed;
        right: 0;
        top: 300px;
        background: #333333;
        padding: 5px 0px;
        text-align: center;
        border: 1px solid #fff;
        z-index: 2;
        opacity: 0.8;
    }

    .search-block {
        display: none;
    }

    .search-block .search-input,
    .search-block .search-datetime {
        width: 100%;
    }

    .search-btn {
        margin-left: 0px;
        margin-top: 10px;
        width: 49%;
        padding: unset;
        font-size: 13px;
    }

    .search-calendar-datetime a {
        font-size: 14px;
    }

    .booking-search-input {
        width: 48% !important;
    }

}

@media screen and (max-width: 365px) {
    .search-calendar-datetime i {
        width: 100%;
    }

    .search-calendar-datetime a {
        font-size: 11px;
        width: 32%;
        padding: 3px 6px;
    }
}

/* 搜尋區塊 END */

/* 上課劵管理 */
.class-ticket-title {
    font-size: 20px;
    background-color: #ddd;
    padding: 5px 10px;
    font-weight: bold;
    margin: 10px 0;
    cursor: pointer;
}

.class-ticket-title span {
    float: right;
}

/* .class-ticket-item{padding: 5px 10px;} */
.class-ticket-item .coach-name {
    padding: 10px;
    background-color: #eee;
    color: #444;
}

.class-ticket-item .coach-name img {
    width: 55px;
}

.class-ticket-item .coach-name p {
    display: inline-block;
    font-size: 15px;
    font-weight: bold;
}

.class-ticket-item a {
    color: #3490dc;
}

.buy-items {
    font-size: 15px;
    background-color: #ddd;
    padding: 5px 10px;
    font-weight: bold;
    margin: 10px 0;
    cursor: pointer;
}

.use-over {
    opacity: 0.5;
}

.buy-items .time {
    float: right;
    color: rgb(180, 180, 180);
}

.buy-items p {
    display: inline-block;
}

.buy-items .class_time {
    color: rgb(22, 78, 233);
}

.user-use-list {
    display: none;
}

.ticket-block .search-input {
    font-size: 15px;
}

.ticket-block .status {
    width: 30px;
    height: 15px;
    vertical-align: middle;
}

.ticket-block .user-name {
    font-size: 20px;
    font-weight: bold;
}

.blue {
    color: blue
}

@media screen and (max-width: 450px) {
    .class-ticket-item {
        padding: 0px;
    }

    .class-ticket-title {
        font-size: 16px;
    }

    .user-use-list table,
    td,
    tr,
    th {
        font-size: 14px;
    }

    .buy-items {
        font-size: 12px;
    }
}

/* 上課劵管理 END */

/* 課程管理 */
.qrtimes-block {
    text-align: center;
    color: #9f353a;
    font-size: 16px;
    font-weight: bold;
    width: 100%;
    display: inline-block;
}

.edittime-block h2 {
    width: 100%;
    font-size: 20px;
    text-align: center;
    margin: 9px 0px;
}

.edittime-block p {
    width: 100%;
    font-size: 16px;
    margin: 5px 0px;
    text-align: left;
}

.course-block-pc .smail-text {
    font-size: 14px;
}

.course-block-pc .table td,
.course-block-pc .table th {
    padding: .75rem .35rem;
}

.star-score-comment {
    margin-top: 25px;
    font-size: 15px;
    border: 1px solid #ddd;
    padding: 10px;
    text-align: left;
}

.star-score-comment .title {
    font-weight: bold;
    margin-bottom: 10px;
    font-size: 16px;
}

#qrcode-button {
    display: none;
}

.signature-bg {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: rgba(0, 0, 0, 0.7);
    z-index: 100000;
    display: none;
}

.signature-bg #close-btn {
    color: #fff;
    font-size: 40px;
    position: absolute;
    top: 5%;
    right: 5%;
    cursor: pointer;
}

.signature-container {
    position: fixed;
    left: 16%;
    top: 18%;
    z-index: 100000;
    width: 70%;
    display: none;
}

.signature-container button {
    width: 42%;
    float: left;
    margin: 0 50px;
}

.signature-container #save {
    background-color: #9f353a;
}

.signature-container #clear {
    background-color: #222222;
    margin: unset;
    color: #fff;
}

.signature-container {
    height: 65%;
}

#signature {
    height: 100%;
}

#signature canvas {
    height: 100% !important;
}

#signatureparent {
    height: 100%;
}

.qrcode-block {
    text-align: center;
}

.booking-sign-block {
    width: 100%;
    margin-top: 25px;
}

.booking-sign-block button {
    background-color: #2085bc;
    color: #fff;
    width: 100%;
}

.booking-sign-block .booking-button {
    width: 47%;
    float: left;
    margin: 0 5px;
}

#submit-booking-sign {
    display: none;
}

/* .booking-sign-block .autograph{width: 100%;max-width: 500px;} */
/* .booking-sign-block .autograph img{width: 100%;} */
#submit-booking-sign {
    background-color: #9f353a;
}

.operating-badge {
    font-weight: bold;
    font-size: 14px;
    border-radius: unset;
    padding: unset;
}


@media screen and (max-width: 1024px) {
    .signature-container {
        width: 90%;
        left: 6%;
    }
}

@media screen and (max-width: 450px) {
    .signature-bg #close-btn {
        font-size: 30px;
        top: 1%;
    }

    .signature-container {
        top: 8%;
    }

    .signature-container button {
        margin: 0 20px;
    }

    .signature-container {
        height: 80%;
    }

    #signature canvas {
        height: 95% !important;
    }
}

@media screen and (max-width: 320px) {
    .booking-sign-block .booking-button {
        width: 46%;
        padding: 5px;
    }

    #signature canvas {
        height: 93% !important;
    }
}

/* 課程管理 END*/

/* 課程管理手機版 */
.course-block-phone {
    display: none;
}

.course-block-title p,
.course-block-item-information p {
    font-size: 14px;
    display: inline-block;
    padding: 10px;
    width: 22.2%;
    text-align: center;
    vertical-align: middle;
}

.course-block-title p {
    background-color: #5d5d5d;
    color: #fff;
}

.course-block-item-information .operating {
    width: 100%;
}

.course-block-item-btn {
    border-bottom: solid 1px #d4d4d4;
    height: 39px;
    background-color: #ebecec;
    color: #4d4d4d;
    font-size: 14px;
    text-align: center;
    line-height: 39px;
    font-weight: bold;
}

.course-block-item-btn i {
    color: #4d4d4d;
    margin-left: 10px;
}

.course-block-detail {
    background-color: #f1f2f4;
}

.course-block-detail div {
    display: flex;
    border-bottom: 1px solid #ccc;
}

.course-block-detail .detail-title {
    width: 48%;
    text-align: right;
    margin-right: 20px;
}

.course-block-detail span {
    display: block;
    float: left;
    text-align: left;
    padding: 10px 0px;
    font-size: 13px;
    color: #5d5d5d;
}

.course-block-detail div a {
    margin: 7px 0px;
}

.operating-block {
    padding: 10px 0px;
    text-align: center;
}

.review-btn-groups {
    display: inline-block;
}

.review-btn {
    width: 74px;
    border: none;
    border-radius: 2rem;
    display: block;
    float: left;
}

.review-btn,
.review-btn a {
    color: #fff;
    margin-top: 3px;
}

.review-yes {
    background-color: #398e5f;
    margin-right: 5px;
}

.review-no {
    background-color: #9f353a;
}

.course-block-phone button {
    margin: auto;
}

.course-block-phone .review-btn-groups {
    width: 100%;
    display: flex;
}

.course-block-phone .review-btn {
    width: 70px;
}

.course-block-phone .review-yes {
    margin-left: 24px;
}

.course-block-phone .course-block-item {
    box-shadow: 1px 0px 5px 1px #d4d4d4;
    margin-bottom: 10px;
}

.change-review-btn-groups .review-yes {
    margin: unset;
}


.class-time {
    width: 32.3% !important;
}

.choose-course-block #makeuptime {
    background-color: #fff !important;
}

@media screen and (max-width: 770px) {
    .course-block-pc {
        display: none;
    }

    .course-block-phone {
        display: block !important;
    }

    .course-block-item {
        box-shadow: 0px 0px 5px -1px rgba(0, 0, 0, 0.3);
        margin-top: 8px;
    }

    .class-time {
        width: 32% !important;
    }
}

@media screen and (max-width: 450px) {

    .course-block-title p,
    .course-block-item-information p {
        font-size: 12px;
        width: 21.2%;
    }
}

@media screen and (max-width: 320px) {

    .course-block-title p,
    .course-block-item-information p {
        width: 19.75%;
        padding: 10px 4px;
        font-size: 12px;
    }

    .class-time {
        width: 37% !important;
    }
}

/* 課程管理按鈕們 */
.operating-btn {
    display: inline-block;
    height: 28px;
    line-height: 28px;
    border: 0px;
    border-radius: 26px;
    color: #fff;
    cursor: pointer;
    padding: 0px 6px;
    font-size: 14px;
}

.operating-btn:hover {
    color: #fff;
}

.operating-btn i {
    margin-right: 6px;
}

.punch-btn {
    background-color: #2085bc;
}

.make-up-btn {
    background-color: #ffa300;
    margin: 0px !important;
}

.noshow-btn {
    background-color: #db6646;
}

.modify-btn {
    background-color: #3b9363;
}

.check-btn {
    background-color: #9f353a;
}

.score-btn {
    background-color: #f5e021;
    color: #4e4040;
}

/* 課程管理按鈕們 END */


/* 請假管理 */
.hint-word {
    color: #b1263b;
    font-weight: bold;
}

.profile-content {
    font-size: 14px;
}

.class-info {
    background-color: #eee;
    padding: 10px;
    border-radius: 5px;
}

.class-info p {
    margin-left: 10px;
}

.leave-status p {
    padding: 10px;
    margin: 10px 0px;
    color: #fff;
}

.leave-status .notyet {
    background-color: rgb(128, 127, 127);
}

.leave-status .success {
    background-color: rgb(31, 148, 89);
}

.leave-status .reject {
    background-color: rgb(255, 135, 36);
}

.return-button {
    float: right;
    margin-top: 5px;
    border-radius: 2rem;
}

.leave-reason {
    max-width: 300px;
    font-size: 14px;
    text-align: justify !important;
}

.leave-time {
    max-width: 100px;
    font-size: 14px;
}

.show-proof-button {
    font-size: 12px;
    padding: unset;
    display: block;
    margin: auto;
}

.show-proof-button:hover {
    color: #292524;
}

.show-proof {
    max-width: 80%;
    text-align: center;
}

.show-proof img {
    max-width: 80%;
}

@media (max-width: 768px) {
    .leave-reason {
        max-width: unset;
        text-align: center !important;
    }

    .leave-time {
        max-width: unset;
    }

    .show-proof {
        width: 100%;
    }

    .show-proof img {
        max-width: 90%;
    }

}


.return-button {
    float: right;
    margin-top: 5px;
    border-radius: 2rem;
}

/* 請假管理 END */

/* 健康諮詢表 */
.health-block {
    flex: 100%;
    max-width: 100%;
}

.form-items {
    line-height: 42px;
    display: inline-block;
}

.form-items input {
    width: 20px;
    height: 20px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 3px;
}

.form-items label {
    margin-right: 10px;
}

.health-main .form-short-input input {
    width: 49%;
}

.health-main {
    padding: 20px 0;
    width: 80%;
    margin: auto;
}

.health-main.form-inputs {
    line-height: 42px;
}

.health-block .step-group {
    width: 18%;
    padding: unset;
}

.health-block .step-block {
    padding: unset;
}

.health-block .en-text {
    height: 14px;
    display: inline-block;
    color: #868585;
    font-weight: bold;
}

.form-label {
    font-size: 16px;
    color: #231815;
    line-height: 42px;
    font-weight: bold;
}

.user-info .user-info-data {
    height: 42px;
    font-size: 16px;
    line-height: 42px;
    display: inline-block;
    width: 76%;
}

.user-info .user-info-data .form-birthday-input {
    display: inline-block;
}

.user-info {
    max-width: 750px;
    margin: 0px auto;
}

.user-info>.clearfix {
    padding: 10px 0px;
}

.user-info .form-label {
    width: 150px;
    text-align: right;
    margin-right: 30px;
}

.user-info .form-inputs {
    width: 75%;
    display: inline-block;
}

.user-info .explanation-btn {
    margin: unset;
    font-size: 13px;
}

.user-info .explanation-block {
    display: inline-block;
    margin-top: 5px;
    font-size: 13px;
}

.explanation-text {
    word-break: break-all;
    color: #9f353a;
    display: none;
}

.user-info .reminder-text {
    color: #9f353a;
}

.user-info .reminder-text a {
    color: #9f353a;
}

.user-info .user-info-data .explanation-block {
    display: inline;
}

.user-info .user-info-data .explanation-text {
    display: inline-block;
    font-size: 13px;
}

.form-unit-text {
    color: #868585;
    position: absolute;
    top: 0;
    right: 32px;
    line-height: 42px;
}

.form-sort-input {
    width: 34%;
}

.health-main .invalid-feedback {
    font-weight: bold;
    display: inline;
    line-height: 20px;
}

#ecp_phone-error {
    display: flex;
}

.input-text {
    position: relative;
}

.user-info-btn {
    font-size: 14px;
    font-weight: bold;
    background-color: #fd7d28ee;
    color: #fff;
    max-width: 750px;
    margin: auto;
    text-align: center;
    padding: 3px;
    border-radius: 2rem;
    cursor: pointer;
}

.errorClass {
    outline-color: rgb(185, 44, 40);
}

select.error {
    border: 2px solid rgb(185, 44, 40);
    margin: 0px;
    color: rgb(185, 44, 40);
}

.health-block .pre-next-btn-block {
    width: 100%;
    text-align: right;
}

.pre-next-btn-block input[type="submit"] {
    border: unset;
}

.pre-next-btn-block .health-btn {
    color: #fff !important;
    padding: 10px 0px;
    width: 143px;
    height: 42px;
    text-align: center;
    margin: 3px;
    border-radius: 0px;
    display: inline-block;
    font-size: 14px;
}

.pre-next-btn-block .pre-btn {
    background-color: rgb(173, 173, 173);
}

.pre-next-btn-block .next-btn {
    background-color: #b1263b;
}

.health-btn.save-btn {
    background-color: #359f6a;
}

.agree_checkbox_label {
    display: unset;
}

.health-block input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.health-main .instructions {
    text-align: center;
    color: #AD1729;
    font-size: 16px;
    font-weight: bold;
    padding: 14px 0px 10px 0px;
}

.health-main .recruit-message-title {
    margin: 10px 0px;
}

.health-main .form-question {
    width: 100%;
    clear: both;
}

.health-main .sub-question .form-label {
    font-size: 15px;
}

.health-main .sub-question .form-radio-input label {
    font-size: 15px;
}

.health-main label {
    margin-bottom: 0px;
}

.health-title {
    margin-bottom: 38px;
}

.health-condition-main {
    max-width: 640px;
    margin: 0 auto;
}

.health-main .login-input,
.health-main .form-radio-input-no,
.health-main .forms-channel {
    margin-left: auto;
    margin-right: auto;
    max-width: 800px;
}

.health-main .form-names {
    width: 128px;
}

.health-main .form-inputs {
    margin-left: 50px;
}

.health-main .forms-channel .form-inputs {
    margin-left: 62px;
}

.health-main .name-input input {
    width: 100%;
}

.health-main .sub-question-block {
    margin-left: 50px;
    display: none;
}

.health-condition .form-names {
    width: 100%;
    text-align: left;
}

.health-condition .form-short-title {
    width: 16%;
}

.health-condition .form-inputs {
    margin-left: 0;
}

.verified {
    color: #9F353A;
    font-size: 18px;
    font-weight: bold;
    border: 1px solid #9F353A;
    margin: 20px 0px;
    display: inline-block;
    padding: 8px;
}

.recruits-last .send-submit {
    width: 200px;
}

.explanation-btn {
    border: 1px solid #444;
    cursor: pointer;
    border-radius: 5px;
    padding: 0px 5px;
    font-size: 14px;
}

.mhr-ehr-block {
    display: none;
}

.thank-content .user-info {
    background-color: #eee;
    padding: 10px;
    margin: 15px 0;
    border-radius: 5px;
    font-size: 16px;
    display: flex;
}

.thank-content .user-info p {
    margin: 10px 0;
}

.thank-content .user-info span {
    font-weight: bold;
    font-size: 17px;
    margin-right: 20px;
    width: 150px;
    display: inline-block;
    text-align: right;
}

.thank-content .user-info div {
    width: 50%;
    float: left;
}

.thank-content .ecp-info span {
    width: 100px;
}

.thank-content .ecp-info h3 {
    margin: 10px 0;
}

.thank-content .unit {
    font-size: 0.5rem;
}

.health-block .step-sticky {
    position: fixed;
    top: 100px;
    left: 0;
    background-color: #fff;
    width: 100%;
    padding: 10px 10px;
    box-shadow: 0px 5px 10px #ddd;
    z-index: 1;
}

.health-block .step-sticky .step-group {
    width: 12.5%;
}

.health-block.top-socialite-notify .step-sticky {
    top: 128px;
}

.health-block .completed-step {
    background: rgb(53, 159, 106) !important;
    color: rgb(255, 255, 255) !important;
}

.user-health-block {
    width: 80%;
    margin: auto;
}

.user-health-block .health-block {
    display: inline-block;
    width: 100%;
    position: relative;
    min-height: 100px;
}

.user-health-block .health-block h2 {
    background-color: #9f353a;
    color: #fff;
    padding: 7px 10px;
    margin: 10px 0px;
    font-weight: bold;
    font-size: 18px;
    text-align: center;
    width: 100%;
    display: inline-block;
}

.user-health-block .health-block.basic-info .items {
    width: 45%;
    float: left;
}

.user-health-block .health-block .items {
    padding: 5px 0;
    margin-left: 20px;
    min-height: 30px;
}

.user-health-block .health-block .items ul {
    padding: 5px 0;
    clear: both;
}

.user-health-block .health-block label {
    font-size: 17px;
    font-weight: bold;
}

.user-health-block .health-block h3 {
    font-size: 17px;
    font-weight: bold;
    float: left;
}

.user-health-block .health-block .condition-good {
    color: #359f6a;
    font-size: 17px;
    font-weight: bold;
    text-align: center;
    width: 100%;
    line-height: 44px;
}

.user-health-block .health-block .edit-button {
    position: absolute;
    top: 58px;
    right: 0;
    border: 1px solid #9f353a;
    border-radius: 2rem;
    background-color: #ffeced;
    color: #9f353a;
    padding: 5px 15px;
}

.user-health-block .health-block .no-completed {
    color: #9f353a;
    font-size: 17px;
    font-weight: bold;
    text-align: center;
    width: 100%;
}

.input-text {
    line-height: 36px;
}

.short-line-height .form-label {
    line-height: 20px;
    font-size: 14px;
}

.short-column .form-inputs input {
    width: 68%;
}

.short-column>.clearfix {
    padding: 0;
}

.short-column {
    display: flex;
    margin-bottom: 10px;
}

@media (max-width: 1024px) {
    .step-block .line {
        width: 95px;
    }

    .thank-content .user-info span {
        width: 130px;
    }

    .user-info .user-info-data,
    .user-info .form-inputs {
        width: 70%;
    }

    .health-block .step-sticky {
        top: 49px;
    }

    .health-block.top-socialite-notify .step-sticky {
        top: 77px;
    }

    .short-column .form-inputs input {
        width: 70%;
    }

    .form-question.user-info {
        display: flex;
    }

    .short-column .form-inputs {
        width: 80%;
    }
}

@media (max-width: 768px) {
    .health-block {
        margin-top: unset;
    }

    .health-main {
        padding: unset;
        width: 100%;
    }

    .health-main .recruit-images .form-names {
        padding-left: 0;
    }

    .health-main .forms-channel .form-inputs {
        margin-left: 0;
    }

    .health-title {
        margin-bottom: 10px;
    }

    .health-block .en-text {
        font-size: 12px;
    }

    .health-condition {
        padding: 0;
    }

    .verified {
        display: block;
        text-align: center;
        margin-bottom: 10px;
    }

    .health-main .form-inputs textarea {
        height: 130px;
    }

    .health-condition .form-short-title {
        width: 25%;
    }

    .health-main .form-radio-input input {
        width: 15px;
        height: 15px;
    }

    .user-info .form-label {
        width: 150px;
        text-align: unset;
    }

    .user-info .form-inputs {
        width: 100%;
    }

    .user-info .user-info-data {
        width: 100%;
    }

    .health-block .step-block .line {
        right: -23px;
        width: 72px;
    }

    .health-block .step-block {
        display: block;
    }

    .health-block .step-group p {
        min-width: unset;
        font-size: 12px;
    }

    .user-info-item {
        width: 50%;
        float: left;
    }

    .user-info.short-label {
        width: 100%;
    }

    .user-info .form-sort-input {
        width: 100%;
    }

    .user-info .user-info-data .explanation-text {
        display: block;
    }

    .user-info-item .form-label {
        width: 35%;
        margin-right: 15px;
    }

    .user-info-item .user-info-data {
        width: 55%;
    }

    .user-info.no-birthday .form-label {
        width: 100%;
    }

    .user-info.no-birthday .user-info-data {
        width: 100%;
    }

    .user-info.no-birthday .user-info-data .explanation-text {
        display: inline-block;
    }

    .health-main .form-radio-input .form-other-inputs {
        width: 130px;
        height: 30px;
        line-height: 30px;
        border-radius: 0px;
    }

    .health-main .sub-question-block {
        margin: unset;
    }

    .explanation-text {
        line-height: 20px;
    }

    .health-block .thank-content .pre-next-btn-block button {
        padding: unset;
        margin: unset;
    }

    .thank-content .user-info {
        display: inline-block;
        font-size: 14px;
    }

    .thank-content .user-info div {
        width: 100%;
    }

    .thank-content .user-info p {
        margin: 5px 0;
    }

    .thank-content .user-info span {
        font-size: 14px;
    }

    .thank-content .ecp-info h3 {
        text-align: center;
    }

    .user-info-item:last-child {
        margin-bottom: 15px;
    }

    .health-block.top-socialite-notify .step-sticky {
        top: 78px;
    }

    .health-block .step-block.step-sticky p {
        margin-top: 3px;
    }

}

@media (max-width: 450px) {
    .pre-next-btn-block .health-btn {
        float: left;
    }

    .thank-content .pre-next-btn-block .pre-btn,
    .pre-next-btn-block .save-btn {
        width: 48%;
    }

    .thank-content .pre-next-btn-block .next-btn {
        width: 98%;
    }

    .health-block .step-block .line {
        right: -10px;
        width: 50px;
    }

    .health-block .step-sticky {
        top: 50px;
    }

    .health-block .step-sticky .step-group {
        width: 18.5%;
    }

    .user-health-block {
        width: 100%;
    }

    .user-health-block .health-block.basic-info .items {
        width: 100%;
    }

    .user-health-block .health-block .condition-good {
        text-align: left;
    }

    .thank-content .next-btn {
        width: 96.5%;
    }

    .user-info-item {
        width: 100%;
    }

    .short-column .form-items {
        width: 217px;
    }

    .short-column .form-inputs {
        width: 84%;
    }

    .short-column .unit_button {
        line-height: 37px;
        margin-left: 5px;
    }

    .short-column {
        margin: 10px auto;
    }

    .user-info.short-label .form-items {
        width: 69px;
    }

    .short-label .form-items {
        width: 150px;
    }

    .short-label.short-column .form-control {
        width: 65%;
    }

    .user-info .form-label {
        width: 135px;
    }

    .short-column .form-inputs input {
        width: 100%;
    }

    .user-info .form-label {
        margin-right: 12px;
    }
}

@media (max-width: 320px) {

    .pre-next-btn-block .pre-btn,
    .pre-next-btn-block .save-btn,
    .pre-next-btn-block .next-btn {
        width: 98% !important;
    }

    .thank-content .user-info span {
        width: 110px;
        margin-right: 10px;
    }

    .user-info.short-label .form-items {
        width: 75px;
    }

    .short-label .form-items {
        width: 150px;
    }

    .short-label.short-column .form-control {
        width: 60%;
    }

    .user-info-item .user-info-data {
        width: 100%;
    }

    .health-block.top-socialite-notify .step-sticky {
        top: 98px;
    }

}

/* 健康諮詢表 END */

/* 課程管理健康諮詢表 */
.user-health-btn {
    color: #9f353a;
}

.user-health-btn:hover {
    color: #9f353a;
    opacity: 0.8;
}

.user-health-content {
    font-size: 14px;
    width: 43%;
    color: #4d4d4d;
}

.user-health-content .health-block {
    width: 48%;
    float: left;
    margin: 0px 5px;
}

.user-health-content h1 {
    font-size: 30px;
    text-align: center;
    font-weight: bold;
}

.user-health-content h2 {
    background-color: #9f353a;
    color: #fff;
    padding: 7px 10px;
    margin: 10px 0px;
    font-weight: bold;
    font-size: 18px;
}

.user-health-content h3 {
    font-weight: bold;
    color: #9f353a;
    margin-bottom: 0px;
    font-size: 16px;
    float: left;
}

.user-health-content .items ul {
    clear: both;
}

.user-health-content .items {
    margin: 5px 5px;
    display: inline-block;
    width: 100%;
}

.user-health-content .health-block.basic-info {
    width: 100%;
}

.user-health-content .health-block.basic-info .items {
    width: 31%;
    float: left;
    background-color: #f9eded;
    border-radius: 2rem;
    padding: 5px 15px;
    margin: 5px 5px;
}

.user-health-content .health-block.basic-info h3 {
    float: left;
}

.user-health-content label {
    font-weight: bold;
    color: #444;
    margin-bottom: 0px;
    font-size: 15px;
}

.user-health-content p {
    margin: 5px 0;
    font-size: 15px;
}

.user-health-content .condition-good {
    color: #359f6a;
}

.user-health-content .no-health {
    background-color: #355f9f;
}

.user-health-content .date {
    width: 100%;
    display: inline-block;
}

.user-health-content .date p {
    float: right;
    margin-right: 5px;
}

.user-health-content .date span {
    color: #1167e9;
}

.health_span {
    padding-left: 10px;
    float: left;
}


@media (max-width: 1024px) {
    .user-health-content {
        width: 80%;
    }
}

@media (max-width: 450px) {
    .user-health-content {
        width: 90%;
        font-size: 7px;
    }

    .user-health-content div {
        width: 100% !important;
        margin: unset !important;
    }

    .user-health-content .items {
        padding: 5px 5px;
    }

    .user-health-content label {
        font-size: 13px;
    }

    .user-health-content p {
        font-size: 12px;
        margin: 2px 0;
    }

    .user-health-content h1 {
        font-size: 19px;
    }

    .user-health-content h2 {
        font-size: 12px;
    }

    .user-health-content h3 {
        font-size: 14px;
    }

    .user-health-content .health-block.basic-info .items {
        background: none;
    }
}

input[name='class_how_long_other_input'] {
    width: 100px !important;
}

.unit_button {
    display: inline-block;
    margin-left: 8px;
}

.unit_button button {
    height: 26px;
    line-height: 21px;
    font-size: 13px;
    border: 1px solid #ddd;
    color: #c5c3c3;
}

.unit_button .choose_unit {
    background-color: #b1263b;
    color: #fff;
}

.other-inputs-block {
    float: right;
    display: none;
}

/* 健康諮詢表 END */


.thank-mains {
    display: inline-block;
    width: 100%;
    margin-top: 30px;
}

.thank-containers {
    margin-top: 60px;
    margin-bottom: 60px;
}

.thank-containers .step-block {
    text-align: center;
    margin-bottom: 45px;
    padding-right: 0px;
}

.thank-containers img {
    max-width: 800px;
    margin: 0px auto;
    width: 100%;
    box-sizing: border-box;
    width: 43%;
    float: left;
}

.thank-content .thank-text p a {
    color: #3490dc
}

.thank-content {
    float: right;
    margin-left: 20px;
    width: 55%;
    margin-bottom: 20px;
    font-size: 16px;
}

.thank-content h3 {
    font-size: 16px;
    font-weight: bold;
    color: #b95755;
}

.thank-text {
    margin-bottom: 20px;
    text-align: left;
    font-size: 18px;
}

.user-content {
    background-color: #eee;
    color: #444;
    padding: 20px;
    border-radius: 5px;
    line-height: 35px;
}

.thank-btn {
    margin: auto;
    text-align: center;
    margin-top: 20px;
}

.thank-btn a {
    margin: auto;
    border: 0px;
    border-radius: 3px;
    padding: 0px;
    width: 36%;
}

.thank-btn a {
    color: #fff;
    display: block;
    line-height: 49px;
}

.thank-btn a:hover {
    text-decoration: none;
}

.thank-table {
    width: 100%;
    margin-top: 15px;
    margin-bottom: 20px;
}

.thank-table th {
    background-color: #444;
    color: #fff;
}

.thank-table th,
.thank-table td {
    padding: 10px;
    text-align: center;
    font-size: 15px;
    border-bottom: 1px solid #ddd;
}

.thank-table img {
    width: 150px;
}

.total {
    background-color: #eee;
}

.line-btn {
    background-color: #5bbf43;
}

.fb-btn {
    background-color: #176ba9;
}

.phone-btn {
    background-color: #b71729;
    display: none;
}

.black-btn {
    background-color: #444444;
}

.red-btn {
    background-color: #9f353a;
    color: #fff;
}

.line-btn:hover {
    background-color: #76be5b;
}

.fb-btn:hover {
    background-color: #2280bb;
}

.phone-btn:hover {
    background-color: #c02835;
}

.black-btn:hover {
    background-color: #c02835;
}

.red-btn:hover {
    background-color: #c02835;
}

.thank-btn button i {
    font-size: 18px;
    margin-right: 10px;
}

.thank-btn .pre-btn a,
.thank-btn .next-btn a {
    line-height: unset;
}



@media (max-width: 1080px) {
    .thank-containers img {
        width: 35%;
    }

    .thank-content {
        width: 62%;
    }
}

@media (max-width: 767px) {
    .thank-containers img {
        width: 100%;
        box-sizing: border-box;
    }

    .thank-content {
        width: 100%;
        margin-top: 20px;
        margin-left: 0px;
    }

    .thank-btn button {
        margin-top: 10px
    }

    .thank-btn .black-btn {
        width: 100%;
        margin: auto;
        margin-top: 10px;
    }

    .thank-text {
        font-size: 16px;
    }

    .phone-btn {
        display: block;
    }

}

@media (max-width: 320px) {
    .thank-btn button {
        width: 100%;
    }

    .thank-text {
        padding: 0px 10px;
        font-size: 16px;
    }
}


.thanks-main {
    padding: 70px 0px;
    text-align: center;
}

.thanks-main img {
    max-width: 100%;
    vertical-align: middle;
}

.login-main {
    max-width: 380px;
    margin: 0px auto;
    padding: 20px 0px;
}

.register-main {
    max-width: 580px;
}

.login-switch a {
    display: block;
    width: 50%;
    text-align: center;
    line-height: 23px;
    font-size: 16px;
    color: #fff;
    font-weight: bold;
    background: #bababa;
    float: left;
    text-decoration: none;
    height: 60px;
    padding: 5px;
}

.login-switch .ahover {
    background: #9f353a;
}

.login-switch {
    margin-bottom: 30px;
}

.login-switch img {
    width: 17%;
    display: block;
    margin: auto;
}

.login-input input {
    width: 100%;
    height: 42px;
    line-height: 42px;
    border: 1px solid #c6c5c5;
    -webkit-appearance: none;
    box-sizing: border-box;
    padding: 0 15px;
    font-size: 16px;
}

::-webkit-input-placeholder {
    /* WebKit, Blink, Edge */
    color: #c1c1c1;
}

:-moz-placeholder {
    /* Mozilla Firefox 4 to 18 */
    color: #c1c1c1;
}

::-moz-placeholder {
    /* Mozilla Firefox 19+ */
    color: #c1c1c1;
}

:-ms-input-placeholder {
    /* Internet Explorer 10-11 */
    color: #c1c1c1;
}

.login-input {
    margin: 15px 0px;
}

.text {
    font-size: 18px;
    margin: 20px 0;
    padding-left: 30px;
    width: 100%;
    font-weight: bold;
    color: #e3342f;
}

.unique-error {
    color: #e3342f;
}

.name-input {
    width: 49%;
}

/* .form-radio-input{margin-bottom: 20px;} */
.login-submit {
    -webkit-appearance: none;
    display: block;
    height: 36px;
    border-radius: 50px;
    background: #9f353a;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    width: 100%;
    border: none;
    color: #fff;
    cursor: pointer;
    margin-top: 20px;
}

.login-link {
    margin-bottom: 20px;
    color: #868585;
    font-size: 16px;
    text-align: center;
}

.login-link a {
    color: #444;
    padding: 3px 15px;
    border-radius: 31px;
    display: inline-block;
    font-size: 14px;
    text-decoration: underline !important;
}

#login-fancy .login-link a {
    margin-top: 20px;
    width: auto;
    padding: 3px 15px;
}

#login-fancy .title {
    margin: 10px 0px;
    font-size: 20px;
    text-align: center;
    font-weight: bold;
}

#login-fancy {
    width: 570px;
}

/* 註冊/登入按鈕區塊 */
.login-button-block {
    display: inline-block;
    width: 100%;
}

.login-button {
    width: 100%;
    margin: 0px 3px;
    margin-bottom: 10px;
    display: inline-block;
    height: 40px;
    border-radius: 2rem;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    border: none;
    color: #fff;
    cursor: pointer;
    line-height: 40px;
}

.login-button a {
    color: #fff;
}

.login-button i {
    font-size: 18px;
}

.login-button:hover {
    opacity: 0.8;
}

.line-button {
    background: #00a82d;
}

.google-button {
    background: #de4936;
}

.facebook-button {
    background: #4863a1;
}

.disabled-button {
    background-color: #ddd;
    pointer-events: none;
}

.line-button img {
    width: 20px;
    margin-right: 4px;
}

/* .login-input-block{display: none;} */
/* .general-register-block{display: none;} */
.coach-login {
    display: none;
}

.socialite-notify {
    background-color: #9f353a;
    float: right;
    width: 100%;
    padding: 3px 0;
    text-align: center;
    z-index: -999;
}

.socialite-notify-a {
    font-size: 12px;
    color: #fff;
    font-weight: bold;
    display: inline-block;
}

.socialite-notify-button {
    background-color: #9f353a;
    color: #fff;
    font-weight: bold;
    text-align: center;
    cursor: pointer;
    margin-top: 0.8px;
    z-index: -998;
    display: inline-block;
    padding: 0 3px;
}

.socialite-notify a:hover {
    color: #fff !important;
    opacity: 0.8;
}

.socialite-notify-button:hover {
    color: #fff !important;
}

.socialite-notify-button {
    border: 1px solid #fff;
}

#booking-fix-block.top-socialite-notify {
    top: 127px;
}

@media (max-width: 768px) {
    .socialite-notify-button {
        display: inline-block;
    }

    .head-person-fix.top-socialite-notify {
        top: 77px;
    }
}

@media (max-width: 450px) {
    .login-button {
        font-size: 10px;
        line-height: 37px;
        height: 37px;
    }

    .login-button i {
        font-size: 18px;
    }

    .login-switch a {
        height: 55px;
        padding: 5px;
    }

    .login-switch img {
        width: 14%;
        margin-top: unset;
    }

    .login-input .fa-info-circle {
        line-height: 21px;
    }

    .booking-fix-block-phone .booking-fix-select.top-socialite-notify {
        top: 77px;
    }

    .head-person-fix.top-socialite-notify {
        top: 78px;
    }
}

@media (max-width: 350px) {
    .head-person-fix {
        top: 50px;
    }

    .top-socialite-notify .profile-right-block {
        margin-top: 62px;
    }

    .head-person-fix.top-socialite-notify {
        top: 97px;
    }
}

/* 註冊/登入按鈕區塊 END */
.forget-text {
    color: #AA3D4E;
    text-align: center;
    margin-bottom: 20px;
    font-size: 13px;
}

.send-submit {
    display: block;
    border-radius: 5px;
    background: #9f353a;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    color: #fff;
    margin: 0 auto;
    margin-top: 20px;
    border: none;
    padding: 10px 20px;
}

.register-btn {
    cursor: pointer;
    -webkit-appearance: none;
    display: block;
    height: 36px;
    border-radius: 50px;
    background: #9f353a;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    width: 100%;
    border: none;
    color: #fff;
}

.register-main .information-block {
    background-color: #fbf0f0;
    float: left;
    padding: 5px 10px;
    border-radius: 5px;
    text-align: justify;
    border: 1px solid #9f353a;
    color: #9f353a;
    line-height: 15px;
    display: none;
}

.form-names {
    font-size: 16px;
    color: #231815;
    line-height: 42px;
    text-align: right;
}

.login-input .fa-info-circle {
    font-size: 12px;
    color: #9f353a;
    float: left;
    line-height: 44px;
    margin-left: 5px;
    cursor: pointer;
}

.form-star {
    color: #A71F2A;
    font-size: 16px;
}

.form-inputs {
    margin-left: 84px;
}

.form-names-input input {
    width: 100%;
}

.form-radio-input input {
    width: 20px;
    height: 20px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 3px;
}

.form-radio-input label {
    margin-right: 10px;
}

.form-radio-input {
    line-height: 42px;
}

.radio-group {
    font-size: 16px;
    margin-right: 10px;
    text-align: left;
}

.form-birthday-text {
    display: block;
    width: 32px;
    text-align: center;
    line-height: 42px;
    font-size: 14px;
}

.form-birthday-inputs {
    margin-right: 32px;
}

.form-birthday-inputs select {
    text-align-last: center;
    height: 42px;
    width: 100%;
    background: #e4e4e3;
    width: 100%;
    font-size: 16px;
    border: none;
    box-sizing: border-box;
    padding: 0px 10px;
}

.form-birthday-group {
    width: 33.33%;
}

.form-password-input-text {
    display: block;
    line-height: 42px;
    border-radius: 50px;
    background: #9f353a;
    color: #fff;
    width: 49%;
    text-align: center;
    font-size: 16px;
    cursor: pointer;
}

.register-agree input {
    width: 20px;
    height: 20px;
    display: block;
    float: left;
}

.register-agree {
    color: #231815;
    margin-top: 25px;
    line-height: 20px;
    text-align: center;
}

.register-agree label {
    display: block;
    margin-left: 25px;
    font-size: 12px;
}

.register-agree a {
    font-weight: bold;
}

#recaptchaClient {
    display: inline-block;
}

.recaptchaClient-block {
    text-align: center;
}

.login-switch {
    position: relative;
}

.login-switch input {
    position: absolute;
    opacity: 0;
    left: 0;
    top: 0;
}

.login-switch label {
    display: block;
    width: 100%;
    cursor: pointer;
    margin: 0;
}

#user-name {
    font-weight: bold;
}

@media (max-width: 450px) {
    .login-input .fa-info-circle {
        line-height: 21px;
    }
}

/* 提醒驗證頁 */
.verify-notice-page {
    font-size: 20px;
    margin: 60px auto;
    color: #444;
    width: 85%;
}

.verify-notice-page p {
    margin: 30px 0;
}

.verify-notice-page h1 {
    font-size: 30px;
    font-weight: bold;
}

.verify-notice-page h2 {
    font-size: 25px;
    font-weight: bold;
}

.verify-notice-page .email {
    background-color: #eee;
    padding: 20px 0;
    display: inline-block;
    margin: 5px;
    border-radius: 10px;
    width: 30%;
    font-weight: bold;
}

.verify-notice-page .text {
    font-size: 16px;
}

.verify-notice-page span {
    color: red;
    font-size: 16px;
}

@media (max-width: 768px) {
    .verify-notice-page .email {
        width: 100%;
    }

    .verify-notice-page p {
        margin: 18px 0;
    }
}

/* 提醒驗證頁 END */

@media (min-width: 1080px) {
    .login-link a:hover {
        opacity: 0.8;
    }

    .login-submit:hover,
    .send-submit:hover {
        opacity: 0.8;
        color: #fff;
        text-decoration: none;
    }
}

@media (max-width: 767px) {
    .login-link {
        margin-bottom: 0px;
    }

    .thanks-main {
        padding: 10px 0px;
    }

    .login-switch a {
        font-size: 17px;
        line-height: 28px;
    }

    .login-main {
        padding: 10px 0px;
    }

    .login-switch {
        margin-bottom: 20px;
    }

    .login-input input {
        line-height: 30px;
        padding: 0 5px;
        font-size: 15px;
    }

    .login-input {
        margin-bottom: 8px;
    }

    .form-radio-input {
        margin-bottom: 8px;
    }

    .login-submit {
        margin-top: 15px;
    }

    .login-submit {
        height: 28px;
        line-height: 28px;
    }

    .login-link {
        padding: 15px 0px;
        font-size: 15px;
    }

    .send-submit {
        margin-top: 15px;
    }

    .register-main .login-input .form-inputs {
        margin-left: 0;
        float: left;
        width: 100%;
    }

    .register-main .login-input .form-names {
        line-height: normal;
        margin-bottom: 10px;
    }

    .register-main .form-names {
        text-align: left;
    }

    .register-main .form-radio-input .form-names {
        width: auto;
    }

    .register-main .form-radio-input .form-inputs {
        margin-left: 55px;
    }

    .radio-group {
        font-size: 15px;
    }

    .form-phone-input input {
        width: 100%;
    }

    .form-phone-input input {
        width: 100%;
    }

    .form-birthday-text {
        width: 20px;
    }

    .form-birthday-inputs {
        margin-right: 20px;
    }

    .form-birthday-inputs select {
        font-size: 14px;
        padding: 0px;
    }

    .form-password-input input {
        width: 100%;
    }

    .form-password-input-text {
        width: 100%;
        line-height: 28px;
        font-size: 16px;
        margin-top: 10px;
    }

    .name-input {
        width: 48%;
    }

    .password-input {
        width: 100%;
    }

    .text {
        padding: 0px;
    }
}

#video-page .content-left {
    float: left;
    width: 64%;
}

.video-list-title {
    color: #252525;
    font-size: 22px;
    text-align: center;
    font-weight: bold;
    margin-bottom: 20px;
}

.hot-video {
    background: #f2f2f2;
    padding: 20px;
    margin-top: 20px;
    margin-bottom: 30px;
}

.video-ul li {
    float: left;
    width: 50%;
    box-sizing: border-box;
    padding: 0px 10px;
}

.hot-video-list iframe {
    width: 100% !important;
    height: 185px !important;
}

.video-title {
    font-size: 23px;
    text-align: center;
    font-weight: bold;
    margin: 10px 0;
}

.video-item-title {
    font-size: 17px;
    font-weight: bold;
    margin-bottom: 5px;
    line-height: 25px;
    height: 50px;
    overflow: hidden;
}

.hot-video-phone {
    display: none;
}

.hot-video-phone .swiper-pagination {
    position: absolute;
    width: 100%;
    text-align: center;
    bottom: -45px;
}

.hot-video-phone .swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    background: #c9caca;
    margin: 0px 5px;
    opacity: 1;
}

.hot-video-phone .swiper-pagination-bullet-active {
    background: #e1ca8b;
}

.hot-video-phone .swiper-pagination-bullet:focus {
    outline: none;
}

.all-video li {
    margin-bottom: 15px;
}

.contnet-right {
    width: 32%;
}

.contnet-right-hot-ul li {
    margin-bottom: 15px;
    position: relative;
}

#video-page .hot-content-block ul .hot-image {
    width: 34%;
    float: left;
}

#video-page .hot-content-block ul .hot-image img {
    width: 100%;
    vertical-align: middle;
    border-radius: 2px;
}

.hot-content {
    width: 64%;
}

.contnet-right-hot-item-title {
    color: #444343;
    font-size: 15px;
    margin-bottom: 8px;
    line-height: 20px;
    height: 40px;
    overflow: hidden;
}

#video-page .hot-depiction {
    font-size: 13px;
    line-height: 18px;
    height: 36px;
    margin-bottom: 5px;
    color: #9e9e9e;
    overflow: hidden;
}

.contnet-right-more {
    line-height: 19px;
    margin-top: 3px;
    font-size: 12px;
    padding: 0px 5px;
    color: #4C4948;
    display: inline-block;
    border: 1px solid #d8d8d8;
    border-radius: 5px;
}

.contnet-right-hot-ul .tags {
    position: absolute;
    width: 64%;
    box-sizing: border-box;
    right: 0;
    bottom: 0;
}

.contnet-right-hot-date {
    font-size: 12px;
    color: #999;
}

#video-page .news-left .hot-content-block ul .hot-image {
    width: 26%;
}

#video-page .news-left .hot-content-block ul .hot-content {
    width: 72%;
}

.news-left .tags {
    width: 72%;
}

.contents-main img {
    max-width: 100%;
}

.contents-main {
    color: #888;
    font-size: 14px;
    line-height: 30px;
}

.contents-main h2 {
    color: #fff;
    font-weight: bold;
    margin-top: 50px;
    margin-bottom: 10px;
    font-size: 20px;
    line-height: 28px;
    border-radius: 5px;
    padding: 5px 10px;
    background: #666;
}

.contents-main h3 {
    color: #c8ac89;
    font-weight: bold;
    margin-top: 50px;
    margin-bottom: 10px;
    font-size: 18px;
    line-height: 26px;
}

.info-quote {
    background: #f5f5f5;
    max-width: 100%;
    margin: 3% auto;
    border-radius: 10px;
    padding: 3%;
}

.contents-main .info-quote h2 {
    margin-top: 0px;
    background: none;
    color: #444;
    padding: 0 0;
}

.contents-main ul {
    background-color: #f8f8f8;
    border-radius: 5px;
    padding: 1.5%;
    margin: 2% 0;
}

.contents-main ul li {
    font-size: 14px;
    margin-left: 22px;
    list-style: disc;
    line-height: 40px;
    color: #555;
    font-weight: bold;
}

.contents-main ol {
    background-color: #f8f8f8;
    border-radius: 5px;
    padding: 1.5%;
    margin: 2% 0;
}

.contents-main strong {
    font-size: 16px;
    color: #e4805a;
    font-weight: bold;
}

.contents-main a {
    color: #5a8ad2;
}

.contents-main em {
    font-size: 18px;
    font-weight: bold;
    color: #888;
    font-style: initial;
}

.contents-hot li {
    float: left;
    width: 33.33%;
    margin-bottom: 20px;
}

.contents-hot-main {
    margin: 0 10px;
}

.contents-hot-images a {
    display: block;
}

.contents-hot-images img {
    width: 100%;
    vertical-align: middle;
    border-radius: 5px;
}

.contents-hot-item-title a {
    margin-top: 10px;
    text-align: center;
    color: #434343;
    font-size: 15px;
    font-weight: bold;
    vertical-align: top;
    display: block;
    line-height: 20px;
    height: 40px;
    overflow: hidden;
}

.contents-hot-text {
    color: #808080;
    font-size: 13px;
    line-height: 20px;
    display: block;
    height: 20px;
    overflow: hidden;
    text-align: center;
}

.contents-hot-price {
    margin-bottom: 5px;
    color: #eb6153;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
}

.contents-hot-price span {
    text-decoration: line-through;
    color: #969696;
    font-size: 12px;
    margin-left: 10px;
}

.contents-other li {
    float: left;
    width: 50%;
    box-sizing: border-box;
    padding: 0 10px;
    margin-bottom: 20px;
}

.contents-other-left {
    width: 49%;
    position: relative;
    border-radius: 5px;
    overflow: hidden;
}

.contents-other-left a {
    display: block;
}

.contents-other-left img {
    width: 100%;
    vertical-align: middle;
}

.contents-other-right {
    width: 49%;
}

.contents-other-title a {
    display: block;
    color: #444343;
    font-size: 17px;
    margin: 0px;
    line-height: 20px;
    height: 40px;
    overflow: hidden;
    margin-bottom: 5%;
    font-weight: bold;
}

.contents-other-text a {
    color: #999;
    font-size: 12px;
    line-height: 20px;
    display: block;
    height: 60px;
    overflow: hidden;
}

.go-back {
    padding: 30px 0px;
    text-align: center;
}

.go-back a {
    transition: all .5s ease 0s;
    display: inline-block;
    line-height: 50px;
    border-radius: 10px;
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    width: 30%;
    background: #666666;
}

.contents-display-button {
    cursor: pointer;
    background: #666666;
    display: inline-block;
    color: #fff;
    padding: 0px 10px;
    border-radius: 5px;
    border: 1px solid #666666;
    font-size: 13px;
    margin-left: 10px;
}

.contents-display-button em {
    display: inline-block;
    background: url(/assets/images/xindenr_266.png) no-repeat;
    width: 14px;
    height: 6px;
    margin-left: 5px;
    vertical-align: 2px;
    background-size: 10px;
}

.contents-write-submit {
    -webkit-appearance: none;
    cursor: pointer;
    height: 30px;
    width: 90px;
    color: #888;
    font-size: 13px;
    text-align: center;
    background: #f7f7f7;
    margin-top: 12px;
    border-radius: 10px;
    border: 1px solid #d8d8d8;
}

.content-time {
    margin-top: 10px;
    font-size: 12px;
    color: #c7c7c7;
}

.sorting {
    line-height: 32px;
    margin-top: 10px;
}

.sorting a {
    line-height: 30px;
    display: inline-block;
    border: 1px solid #d8d8d8;
    margin-bottom: 5px;
    margin-right: 5px;
    padding: 0px 7px;
    border-radius: 10px;
    font-weight: bold;
    font-size: 13px;
    background: #DDDDDD;
    color: #FFFFFF;
}

.sorting .active {
    color: #eee;
    background: #5c95b5;
}

@media (min-width: 1080px) {

    .contents-hot li a:hover,
    .contents-other li a:hover {
        opacity: 0.8;
    }

    .go-back a:hover {
        background: #cfbb84;
    }

    .blog-list li a:hover {
        opacity: 0.8;
    }
}

@media (max-width: 767px) {
    .hot-video-pc {
        display: none;
    }

    .hot-video-phone {
        display: block;
        position: relative;
    }

    .hot-video-list iframe {
        height: 160px !important;
    }

    .contnet-right {
        width: 100%;
        margin-top: 20px;
    }

    .contnet-right-hot-ul .tags {
        position: static;
        width: 100% !important;
    }

    #video-page .news-left .hot-content-block ul .hot-image {
        width: 37%;
    }

    .news-left .hot-content {
        width: 61%;
    }

    .contents-hot li {
        width: 50%;
    }

    .contents-other li {
        width: 100%;
    }

    .go-back a {
        line-height: 35px;
    }

    .blog-list li {
        width: 50%;
    }

    .video-ul li {
        width: 100%;
    }

    #video-page .content-left {
        width: 100%;
    }
}

.youtube {
    background-color: #000;
    margin-bottom: 30px;
    position: relative;
    padding-top: 56.25%;
    overflow: hidden;
    cursor: pointer;
}

.youtube img {
    width: 100%;
    top: -16.82%;
    left: 0;
    opacity: 0.7;
}

.youtube .play-button {
    width: 90px;
    height: 60px;
    background-color: #333;
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.6);
    z-index: 1;
    opacity: 0.8;
    border-radius: 6px;
}

.youtube .play-button:before {
    content: "";
    border-style: solid;
    border-width: 15px 0 15px 26.0px;
    border-color: transparent transparent transparent #fff;
}

.youtube img,
.youtube .play-button {
    cursor: pointer;
}

.youtube img,
.youtube iframe,
.youtube .play-button,
.youtube .play-button:before {
    position: absolute;
}

.youtube .play-button,
.youtube .play-button:before {
    top: 50%;
    left: 50%;
    transform: translate3d(-50%, -50%, 0);
}

.youtube iframe {
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
}

.privacy {
    padding: 7px 0px;
}

.privacy p,
ul {
    font-size: 13.5px;
    text-align: -webkit-auto;
}

.privacy h2 {
    background-color: #444;
    color: #fff;
    font-weight: bold;
    font-size: 15px;
    padding: 4px 10px;
    margin: 2px 0px;
    border-radius: 5px;
}

#validation-message-form .error {
    color: red;
}














/* 預設樣式 */
.article_consharea {
    display: inline-block;
    position: relative;
    margin-left: 10px;
}

.article_consharea img {
    vertical-align: middle;
}

.article_conshare {
    text-align: right;
    margin-bottom: 1%;
}

.article_conshare .img-h {
    display: none;
}

.article_consharea p {
    position: absolute;
    width: 100%;
    text-align: center;
    font-size: 14px;
    left: 0;
    bottom: 5px;
    color: #4D4D4D;
    font-weight: bold;
    line-height: 20px;
    height: 20px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.article_consharebtn,
.article_icob {
    display: none;
}

.article_consharebtn .fa-angle-double-left {
    display: none;
}

.article_consharebtn-actie .fa-angle-double-left {
    display: inline-block;
}

.article_consharebtn-actie .fa-angle-double-right {
    display: none;
}

.article_conshare-fix {
    position: fixed;
    top: 260px;
    z-index: 10;
}

.article_conshare-fix .article_consharea {
    display: block;
    margin-bottom: 10px;
}

.seenumbers {
    padding-left: 15px;
}

.see-num {
    line-height: 20px;
}

/* 大於等於 768px */
@media (min-width: 768px) {
    .article_conshare-fix {
        left: 0 !important;
    }
}

/* 大於等於 1080px */
@media (min-width: 1080px) {
    .q_dra_question_nr_lf_t:hover {
        opacity: 1 !important;
        color: #007167;
    }

    .q_dra_question_nr_lf_t:hover .question-title {
        color: #007167 !important;
        opacity: 1 !important;
    }

    .left .q_dra_question_nr_lf_th:hover .question-title {
        color: #007167 !important;
    }

    .q_dra_question_nr_lf_t:hover .question_btn .fa-plus-circle {
        opacity: 1 !important;
        color: #007167 !important;
    }

    .article_consharea:hover .img-h {
        display: inline-block;
    }

    .article_consharea:hover .img-q {
        display: none;
    }

    .youblog-1-rt4-ba:hover {
        color: #ebd272 !important;
        background: #007167;
        transition: all .5s ease 0s;
    }
}

/* 小於等於 1100px */
@media (max-width: 1100px) {
    .seenumbers {
        padding-left: 5px !important;
    }
}

/* 小於等於 900px */
@media (max-width: 900px) {

    .blog-1-lf14,
    .see-num,
    .seenumbers {
        margin: 0 !important;
    }

    .seenumbers,
    .see-num {
        margin-left: 5px !important;
    }
}

/* 小於等於 767px */
@media (max-width: 767px) {

    .article_consharebtn,
    .article_icob {
        display: block;
    }

    .article_conshare-fix {
        background: rgba(230, 230, 230, 0.5);
        padding: 5px;
        top: 80px;
        left: -50px;
    }

    .article_conshare-fix .article_consharea {
        margin-left: 0;
        margin-bottom: 5px;
    }

    .article_consharebtn {
        cursor: pointer;
        width: 22px;
        background: rgba(230, 230, 230, 0.5);
        position: absolute;
        top: 67px;
        right: -22px;
        text-align: center;
        line-height: 14px;
        font-size: 12px;
        font-weight: bold;
        padding: 5px 0;
    }

    .article_consharebtn img {
        margin-top: 5px;
    }

    .article_icob {
        text-align: center;
        line-height: 10px;
        padding-bottom: 5px;
    }

    .see-num {
        margin: 0;
    }

    #course-content .service-announcement {
        background: #ededed;
        color: #888;
        font-size: 12px;
        line-height: 18px;
        padding: 3% 17px !important;
    }
}


.footer-phone-fix li {
    /* width: 20% !important */
}

.about-classify {
    font-size: 0;
    max-width: 840px;
    margin: 0 auto;
    margin-bottom: 20px;
}

.about-classify a {
    display: inline-block;
    line-height: 33px;
    background: #1a1a1a;
    /* 預設背景 */
    color: #fff;
    /* 預設文字 */
    font-size: 15px;
    text-align: center;
    width: 19%;
    margin: 0.0.5%;
    text-decoration: none !important;
    max-width: 256px;
}

.about-classify .active {
    background: #9f353a;
    /* Active 背景 */
    color: #fff;
    /* Active 文字 */
}

.about-classify-fix {
    position: fixed;
    background: rgba(255, 255, 255, 0.7);
    width: 100%;
    left: 0;
    top: 105px;
    z-index: 10;
    max-width: initial;
    text-align: center;
}

@media (min-width: 1080px) {
    .about-classify a:hover {
        background: #9f353a;
        /* Hover 背景 */
        color: #fff;
        /* Hover 文字 */
        text-decoration: none !important;
    }
}

@media (max-width: 1279px) {
    .about-classify-fix {
        top: 48px;
    }
}


/* 提醒驗證頁 */
.text-center {
    text-align: center !important;
}

.verify-notice-page {
    font-size: 20px;
    margin: 60px auto;
    color: #444;
    width: 85%;
}

.verify-notice-page p {
    margin: 30px 0;
}

.verify-notice-page h1 {
    font-size: 30px;
    font-weight: bold;
}

.verify-notice-page h2 {
    font-size: 25px;
    font-weight: bold;
}

.verify-notice-page .email {
    background-color: #eee;
    padding: 20px 0;
    display: inline-block;
    margin: 5px;
    border-radius: 10px;
    width: 30%;
    font-weight: bold;
}

.verify-notice-page .text {
    font-size: 16px;
}

.verify-notice-page span {
    color: red;
    font-size: 16px;
}

@media (max-width: 768px) {
    .verify-notice-page .email {
        width: 100%;
    }

    .verify-notice-page p {
        margin: 18px 0;
    }
}

/* 提醒驗證頁 END */


.row {
    display: flex;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px
}



/* 可放到全站 CSS 檔，這裡示範快速內嵌 */
.rating-stars {
    display: inline-block;
    font-size: 18px;
    line-height: 1;
}

.rating-stars .filled {
    color: #f5b301;
}

/* 黃色實星 */
.rating-stars .empty {
    color: #ddd;
}

/* 灰色空星 */
.course-table-list {
    display: block !important;
}

.course-table-list .car-table-general {
    overflow: hidden;
    overflow-x: auto;
}

.cars-button-section {
    display: block !important;
}



@media screen and (max-width: 768px) {

    #Botsonic-wrapper {
        bottom: 100px !important;
        height: 80% !important;
    }
}




/* Order summary - namespaced to avoid collisions */
.order-os-7f3a9c2b {
    box-sizing: border-box;
    display: flex;
    gap: 20px;
    align-items: center;
    margin-bottom: 18px;
    padding: 12px;
    border: 1px solid #e6e6e6;
    border-radius: 6px;
    background: #fafafa;
    font-family: inherit;
    line-height: 1.2;
    color: #222;
    -webkit-font-smoothing: antialiased;
}

/* 內部區塊 */
.order-os-7f3a9c2b>.order-os-item {
    display: flex;
    flex-direction: column;
    min-width: 120px;
}

/* 小標（灰色）與主要文字 */
.order-os-7f3a9c2b .order-os-label {
    font-size: 12px;
    color: #666;
    margin-bottom: 4px;
}

.order-os-7f3a9c2b .order-os-value {
    font-size: 16px;
    font-weight: 600;
    color: #111;
    word-break: break-all;
    /* 防止超長字串撐版 */
}

/* 金額） */
.order-os-7f3a9c2b .order-os-amount {
    text-align: left;
    min-width: 120px;
}

/* 響應式：螢幕改為換行 */
@media (max-width: 640px) {
    .order-os-7f3a9c2b {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .order-os-7f3a9c2b .order-os-amount {
        text-align: left;
    }
}



/* ---每個通知項目按鈕定位 --- */
/* =================================================== */
/* CSS 變數定義
/* =================================================== */

:root {
    /* 按鈕總寬度 (每個按鈕 60px) */
    --swipe-action-width: 120px;
    /* 確保通知列表內容的背景色是純白色 */
    --notice-bg-color: #FFFFFF;
    /* 列表項之間的間隔 */
    --notice-item-spacing: 5px;
    /* 內容到外框的內距 */
    --notice-content-padding: 8px 15px;
}

/* =================================================== */
/* 核心容器設置  */
/* =================================================== */

.swipe-container {
    position: relative !important;
    /* 確保定位正確 */
    overflow: hidden !important;
    /* 關鍵：隱藏未滑動時的按鈕 */
    display: block !important;
    margin-bottom: var(--notice-item-spacing) !important;
    border: none !important;
    box-shadow: none !important;
}

/* 內容區塊 (被滑動的主體) */
.swipe-content {
    /* 滑動和層次的核心屬性 */
    position: relative !important;
    z-index: 2 !important;
    transition: transform 0.3s ease-out !important;
    /* 平滑滑動動畫 */
    transform: translateX(0) !important;
    width: 100% !important;
    background-color: var(--notice-bg-color) !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    box-shadow: none !important;
    pointer-events: auto !important;
    /* 確保點擊和滑動事件不會被阻擋 */
}

/* 內容 Wrapper (包裹實際內容和日期，修正內容內距和內容溢出) */
.swipe-content-wrapper {
    width: 100% !important;
    height: 100% !important;
    padding: var(--notice-content-padding) !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    position: relative !important;
}

/* 狀態切換：當容器被點擊打開時 */
.swipe-container.is-swiped-open .swipe-content {
    transform: translateX(calc(-1 * var(--swipe-action-width))) !important;
}

/* =================================================== */
/* 額外修正：懸停/點擊時的樣式 (防止透明) */
/* =================================================== */
.notice-item-btn:hover,
.swipe-container.is-swiped-open .notice-item-btn:hover {
    background-color: #F8F8F8 !important;
    opacity: 1 !important;
}

/* =================================================== */
/* 操作按鈕容器與設計*/
/* =================================================== */

.swipe-actions {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    width: var(--swipe-action-width) !important;
    height: 100% !important;
    display: flex !important;
    z-index: 1 !important;
    border: none !important;
}

.action-btn {
    width: 50% !important;
    height: 100% !important;

    /* 佈局：將圖標垂直和水平居中 */
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;

    /* 視覺效果基礎 */
    border: none !important;
    cursor: pointer !important;
    color: white !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    transition: background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease !important;
}


.action-mark {
    background-color: #5cb85c !important;
    box-shadow: -1px 0 3px rgba(0, 0, 0, 0.1) !important;
}

/* 2. 刪除按鈕 (紅色) */
.action-delete {
    background-color: #AD1729 !important;
}

/* 圖標樣式：放大圖標並強制設置顏色為白色 */
.action-btn i {
    font-size: 1.8em !important;
    line-height: 1.2 !important;
    color: white !important;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) !important;
}

/* **選配：懸停/點擊時的視覺回饋 ** */
.action-mark:active {
    background-color: #4cae4c !important;
    transform: scale(0.98) !important;
}

.action-delete:active {
    background-color: #921323 !important;
    transform: scale(0.98) !important;
}

.notify-default-text {
    font-size: 12px;
    color: #444 !important;
}

/* ---每個通知項目 X 定位END --- */


/* ---教練列表-教練授課地點 --- */
.teach-areas-box .groups-texts {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 6px;
    /* 行距、列距更小 */
}

.teach-areas-box .course-species-label {
    display: inline-block;
    background: #ffecec;
    padding: 2px 8px;
    /* ← 超小 padding */
    border-radius: 5px;
    /* ← 更小圓角 */
    border: 1px solid #ffbdbd;
    font-size: 12px;
    /* ← 更小字體 */
    line-height: 14px;
    /* ← 超緊行高 */
    color: #d9534f;
    text-decoration: none;
    white-space: nowrap;
    /* ← 不讓標籤自己斷字 */
    cursor: default;
}

.teach-areas-box .course-species-label:hover {
    background: #e4e4e4;
}



/* --- 外層背景 --- */
.filter-bar-air {
    background: #ffffff;
    padding: 40px 0;
    border-bottom: 1px solid #eaeaea;
}

/* --- 整個卡片 --- */
.air-form {
    max-width: 1400px;
    /* ← 寬版 */
    margin: auto;
    padding: 35px 45px;
    /* 更大器 */
    background: #ffffff;
    border-radius: 20px;
    box-shadow: 0px 6px 20px rgba(0, 0, 0, 0.07);

    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 25px 32px;
    align-items: end;
}

/* --- 每一欄 --- */
.air-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.air-field label {
    font-size: 15px;
    font-weight: 600;
    color: #444;
    margin-left: 4px;
}

.air-field select {
    width: 100%;
    padding: 14px 16px;
    font-size: 15px;
    border-radius: 12px;
    border: 1px solid #cccccc;
    background: #fafafa;
    appearance: none;

    background-image: url("data:image/svg+xml;utf8,<svg fill='gray' height='14' width='14' xmlns='http://www.w3.org/2000/svg'><polygon points='0,0 14,0 7,7'/></svg>");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 11px;

    transition: 0.15s;
}

.air-field select:focus {
    outline: none;
    border-color: #999;
    background-color: #fff;
}

/* --- 按鈕 --- */
.air-buttons {
    display: flex;
    gap: 12px;
    align-items: center;
}

.air-search-btn {
    padding: 14px 30px;
    background: #c03a3a;
    color: white;
    border: none;
    border-radius: 12px;
    font-size: 16px;
    cursor: pointer;
    font-weight: 600;
    transition: 0.2s;
}

.air-search-btn:hover {
    background: #a42f2f;
}

.air-reset-btn {
    padding: 14px 22px;
    background: #eeeeee;
    color: #333;
    border: none;
    border-radius: 12px;
    font-size: 15px;
    cursor: pointer;
    font-weight: 500;
}

.air-reset-btn:hover {
    background: #dddddd;
}

/* RWD */
@media (max-width: 900px) {
    .air-form {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .air-form {
        grid-template-columns: 1fr;
    }

    .air-buttons {
        justify-content: center;
    }
}

/* 授課地區 → 縣市 + 區域 排成一排 */
.air-location .loc-flex {
    display: flex;
    gap: 12px;
}

.air-location .loc-flex select {
    flex: 1;
}


/* ---教練列表-教練授課地點END --- */