@import url("/assets/fonts/nanum-gothic/nanumgothic.css");
@import url("/assets/fonts/s-core/s-core.css");
$color: #e31a4c;
html,
body {
    height: 100%;
}
.bg-primary {
    background: $color !important;
}

.body-fixed {
    position: fixed !important;
}

.vam {
    vertical-align: middle !important;
}

html {
    overflow-y: scroll;
    -webkit-text-size-adjust: none;
    &.noScroll {
        overflow: hidden;
    }
    margin: 0;
    padding: 0;
}

body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
font,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
figure,
figcaption,
hgroup {
    margin: 0;
    padding: 0;
}

body,
h1,
h2,
h3,
h4,
select,
textarea,
input,
label,
button {
    word-break: break-all;
    color: #757575;
    font-size: 13px;
    font-family: "Nanum Gothic", Dotum, Arial, Helvetica, sans-serif;
    font-weight: normal;
    line-height: 1.6;
}

article,
aside,
hgroup,
header,
footer,
figure,
figcaption,
nav,
section,
time,
mark,
canvas,
video,
audio,
details,
summary {
    display: block;
    margin: 0;
    padding: 0;
}

iframe {
    border: none;
    &.pop {
        width: 100%;
    }
    &.affiliates,
    &.affiliatelist,
    &.recruitlist {
        width: 100%;
        height: 293px;
        vertical-align: top;
        background: transparent;
        visibility: hidden;
    }
    &.jobs {
        width: 100%;
        height: 417px;
        vertical-align: top;
        background: transparent;
        visibility: hidden;
    }
}

li {
    list-style: none;
}

hr {
    clear: both;
    display: block;
    visibility: hidden;
    width: 1px;
    height: 40px !important;
    font-size: 0;
    line-height: 0;
}

img {
    border: 0;
}

mark {
    display: inline-block;
    background-color: transparent;
}

small {
    font-size: 12px;
}

em,
address,
del,
small {
    font-style: normal;
}

textarea {
    scrollbar-base-color: #e4a8ae;
    scrollbar-arrow-color: #fff;
    &::-webkit-scrollbar {
        width: 2px;
    }
    &::-webkit-scrollbar-track {
        background-color: #eaeaea;
        border-left: 1px solid #ccc;
    }
    &::-webkit-scrollbar-thumb {
        background-color: #de848c;
        &:hover {
            background-color: #aaa;
        }
    }
}

button {
    cursor: pointer;
}

.bold {
    font-weight: bold;
}

.m-auto {
    margin: auto !important;
}

.noselect {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.relative {
    position: relative;
}

input {
    &[readonly] {
        background: #f9f9f9 !important;
    }
    &:focus {
        outline: none;
    }
}

::selection {
    background: #e31a4c;
    text-shadow: none;
    color: #fff;
}

.select2-container,
.select2-container--default .select2-selection--single {
    min-width: 70px;
}

.color-gray {
    color: #999;
}

.bold {
    font-weight: bold;
}

#loading {
    display: none;
    position: fixed;
    z-index: 3000;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: rgba(255, 255, 255, 0) url("/assets/images/ajax_loading.gif") 50% 50% no-repeat;
    background-size: 50px;
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

button:focus {
    outline: none;
}

.modal {
    display: none;
    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: rgba(255, 255, 255, 0.8) url("http://i.stack.imgur.com/FhHRx.gif") 50% 50% no-repeat;
}

body.loading2 {
    overflow: hidden;
    .modal {
        display: block;
    }
}

.color-red {
    color: #ee4352 !important;
}

.font-sm {
    font-size: 12px;
}

ul li {
    font-size: 13px;
    line-height: 1.2em;
}

textarea {
    resize: none;
    text-align: left;
    padding: 10px;
    background: #fff;
    font-size: 13px;
    line-height: 20px;
    outline: none;
    &:read-only {
        background: #fafafa !important;
    }
}

.color-white {
    color: #fff !important;
}

.disable-scroll {
    overflow: hidden;
    overflow-x: hidden;
    overflow-y: hidden;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
}

.grayLayer {
    position: fixed;
    left: 0;
    top: 0;
    height: 110vh;
    width: 100%;
    background: #666;
    background: rgba(0, 0, 0, 0.5);
    z-index: 10;
}

[class^="modal-"] {
    border: 1px solid #eee;
    padding: 20px;
    display: none;
    position: absolute;
    z-index: 1080;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    background: #fff;
    .relative-box {
        position: relative;
        width: 100%;
        height: 100%;
        .close {
            position: absolute;
            top: -60px;
            right: -21px;
            width: 35px;
            height: 35px;
            background: url(/assets/images/mobile/right_close.png) center center no-repeat;
            cursor: pointer;
            background-size: 100%;
            background-color: rgba(0, 0, 0, 0.2);
            &:hover {
                opacity: 0.7;
            }
        }
    }
}

.form-error.valid {
    margin: 0 !important;
}

.profile-round {
    border-radius: 50%;
}

.sub-color {
    color: #de848c !important;
}

.form-error {
    text-align: left;
    color: #ff5a5f;
    font-size: 13px;
}

.bd-red {
    border-color: #f3cbcc !important;
}

.w30 {
    width: 30% !important;
}

.w33 {
    width: 33.3% !important;
}

.w40 {
    width: 40% !important;
}

.w49 {
    width: 49% !important;
}

.w50 {
    width: 50% !important;
}

.w60 {
    width: 60% !important;
}

.w70 {
    width: 70% !important;
}

.w100 {
    width: 100% !important;
}

.fsz-12 {
    font-size: 12px !important;
}

.fsz-13 {
    font-size: 13px !important;
}

.upper-case {
    text-transform: uppercase;
}

.select2-container--default .select2-selection--single .select2-selection__placeholder {
    font-size: 14px;
}

.select2-results__option[aria-selected] {
    font-size: 14px;
    text-align: left;
}

.select2-container--default .select2-selection--single .select2-selection__rendered,
.select2-results__option {
    font-size: 14px;
}

.w20 {
    width: 20% !important;
}

.w25 {
    width: 25% !important;
}

.w50 {
    width: 50% !important;
}

.w70 {
    width: 70% !important;
}

.w30 {
    width: 30% !important;
}

.w80 {
    width: 80% !important;
}

.pt-10 {
    padding-top: 10px !important;
}

.pl-10 {
    padding-left: 10px !important;
}

.pd-10 {
    padding: 10px !important;
}

.pd-20 {
    padding: 20px !important;
}

.pd-30 {
    padding: 30px !important;
}

.mt-0 {
    margin-top: 0px !important;
}

.mt-5 {
    margin-top: 5px !important;
}

.mt-10 {
    margin-top: 10px !important;
}

.mt-15 {
    margin-top: 15px !important;
}

.mt-20 {
    margin-top: 20px !important;
}

.mt-30 {
    margin-top: 30px !important;
}

.mt-50 {
    margin-top: 50px !important;
}

.mt-100 {
    margin-top: 100px !important;
}

.pb-0 {
    padding-bottom: 0 !important;
}

.mb-0 {
    margin-bottom: 0 !important;
}

.mb-5 {
    margin-bottom: 5px !important;
}

.mb-10 {
    margin-bottom: 10px !important;
}

.mb-15 {
    margin-bottom: 15px !important;
}

.mb-20 {
    margin-bottom: 20px !important;
}

.mb-30 {
    margin-bottom: 30px !important;
}

.mb-50 {
    margin-bottom: 50px !important;
}

.mb-100 {
    margin-bottom: 100px !important;
}

.ml-5 {
    margin-left: 5px !important;
}

.ml-10 {
    margin-left: 10px !important;
}

.ml-15 {
    margin-left: 15px !important;
}

.ml-20 {
    margin-left: 20px !important;
}

.mr-5 {
    margin-right: 5px !important;
}

.mr-10 {
    margin-right: 10px !important;
}

.mr-15 {
    margin-right: 15px !important;
}

.mr-20 {
    margin-right: 20px !important;
}

.display-block {
    display: block !important;
}

.display-none {
    display: none !important;
}

.tac {
    text-align: center !important;
}

.tar {
    text-align: right !important;
}

.tal {
    text-align: left !important;
}

.fll {
    float: left;
}

.flr {
    float: right;
}

.inline-block {
    display: inline-block !important;
}

.ovh {
    overflow: hidden;
}

.base-container {
    margin: 0 auto;
}

.outer-container {
    margin: 0 auto;
    position: relative;
}

.upper-bar {
    border-top: 6px solid #e11a4d;
    height: 8px;
    width: 100%;
}

.layout-container {
    background: #ccc;
}

.color-lightgray {
    color: #eee !important;
}

ul {
    display: inline-block;
    overflow: hidden;
}

.blur {
    -webkit-filter: blur(2px);
    -moz-filter: blur(2px);
    -o-filter: blur(2px);
    -ms-filter: blur(2px);
    filter: blur(2px);
}

a {
    text-decoration: none;
    &:focus {
        opacity: 0.8 !important;
        opacity: all 0.2;
    }
}

ul {
    overflow: hidden;
}

.card-button {
    display: inline-block;
    background: #ed174a;
    color: #fff;
    border-radius: 25px;
    padding: 0px 15px;
    font-size: 12px;
    margin-bottom: 11px;
    -webkit-box-shadow: 0 2px 0 #c5376d, 0 2px 2px rgba(0, 0, 0, 0.35);
    box-shadow: 0 2px 0 #c5376d, 0 2px 2px rgba(0, 0, 0, 0.35);
}

.header {
    transform: translate3d(0px, 0px, 0px);
    z-index: 20;
    height: 43px;
    background: #fff;
    position: relative;
    .left-op {
        z-index: 3;
        height: 43px;
        position: absolute;
        left: 0;
        width: 25px;
        background: -webkit-gradient(
            linear,
            left top,
            right top,
            color-stop(16.66%, #fff),
            color-stop(100%, rgba(255, 255, 255, 0))
        );
    }
    .right-op {
        z-index: 3;
        height: 43px;
        position: absolute;
        right: 0;
        width: 25px;
        background: -webkit-gradient(
            linear,
            left top,
            right top,
            color-stop(0, rgba(255, 255, 255, 0)),
            color-stop(60%, #fff)
        );
    }
    .touch-swipe {
        overflow: hidden;
        z-index: 0;
        -webkit-tap-highlight-color: transparent;
        height: 43px;
        .owl-item {
            display: inline-block;
            text-align: center;
        }
        ul.navigation {
            padding: 0 20px;
            height: 100%;
            li {
                white-space: nowrap;
                a {
                    color: #333;
                    margin-left: 5px;
                    padding: 0 5px;
                    font-size: 15px;
                }
            }
        }
    }
}

.mobile-frame {
    .main-relative {
        height: 60vw;
    }
    .artistcrew-box {
        overflow: hidden;
        margin-bottom: 20px;
        .titlebox {
            float: left;
            width: 23%;
            img {
                display: block;
                width: 100%;
                margin-top: 10px;
            }
        }
        .list-box {
            float: right;
            width: 70%;
            a {
                width: 100%;
            }
            .infobox {
                overflow: hidden;
                .info-left {
                    float: left;
                    width: 35%;
                    height: 20px;
                }
                .info-right {
                    float: right;
                    width: 65%;
                    > div {
                        height: 20px;
                    }
                }
                .keywords {
                    border: 2px solid #666;
                    border-radius: 20px;
                    padding: 4px;
                    width: 55px;
                    margin-right: 10px;
                    font-size: 11px;
                    text-align: center;
                    color: #666;
                    margin-top: 8px;
                }
                .title {
                    font-size: 13px;
                    margin-right: 10px;
                    color: #333;
                    line-height: 31px;
                }
                .address {
                    line-height: 23px;
                    .info1 {
                        font-size: 11px;
                        color: #666;
                    }
                    .info2 {
                        font-size: 13px;
                        color: #666;
                        padding-left: 5px;
                    }
                }
            }
        }
    }
    .main-page {
        position: absolute;
        top: 0;
        &.trans-up {
            transition: all 1s;
            top: -100vh;
            position: relative;
        }

        > {
            .logo {
                position: absolute;
                left: 15px;
                top: 10px;
                z-index: 10;
                width: 38vw;
                height: 8.5vw;
            }
            .phone {
                position: absolute;
                right: 15px;
                top: 15px;
                z-index: 10;
            }
        }
        .slide-down {
            position: absolute;
            bottom: 70px;
            z-index: 10;
            width: 68px;
            left: calc((100% - 68px) / 2);
        }
        // .owl-main {
        //   height: 100%;
        //   .item {
        //     width: 100%;
        //     height: 100%;
        //     background-size: cover !important;
        //     text-align: center;
        //     background-color: rgba(255, 255, 255, 0.8);
        //     border-color: rgba(0, 0, 0, 0.2);
        //     background-position: center center !important;
        //     a {
        //       width: 100%;
        //       height: 100%;
        //       display: block;
        //     }
        //   }
        // }
        .main-container {
            position: absolute;
            bottom: 6%;
            z-index: 15;
            width: 100%;
            .base-container {
                text-align: center;
            }
        }
        .main-copy-bg {
            position: absolute;
            top: 15%;
            right: 15%;
            width: 50%;
            height: 50%;
            z-index: 10;
            #particles-js {
                position: absolute;
            }
            .main-copy-box {
                background: transparent url("/assets/images/mobile/main/main_copy_bg.png") top right no-repeat;
                background-size: 100px;
                text-align: center;
                width: 100%;
                height: 100%;
                img {
                    width: 100% !important;
                }
                .main-copy {
                    font-family: "Nanum Gothic";
                    font-size: 14px;
                    color: #fff;
                    text-align: right;
                    font-weight: normal;
                    .bold {
                        font-family: "Nanum Gothic";
                        font-weight: bold !important;
                    }
                }
            }
        }
        .bg-area {
            margin: auto;
            width: 100vw;
            height: 60vw;
            .owl-main .owl-stage-outer .owl-item {
                height: 60vw;
            }
        }
        .button-area {
            margin-top: 50px;
            ul {
                width: 100%;
                overflow: hidden;
                li {
                    width: 33.3%;
                    float: left;
                    a:hover {
                        transition: all 0.3s;
                        .title {
                            color: #e31a4c;
                            transition: all 0.3s;
                        }
                        img,
                        .text {
                            transition: all 0.3s;
                            opacity: 0.7;
                        }
                    }
                    img {
                        width: 30%;
                        float: left;
                    }
                    .right-area {
                        margin-top: 15px;
                        width: 70%;
                        float: left;
                        padding-left: 12px;
                        box-sizing: border-box;
                        &.phone-area {
                            .title {
                                margin-bottom: 12px;
                            }
                            .text {
                                font-size: 30px;
                            }
                        }
                        .title {
                            color: #9da6ab;
                            font-size: 18px;
                            line-height: 26px;
                            letter-spacing: -0.5px;
                            margin-bottom: 5px;
                        }
                        .text {
                            color: #9da6ab;
                            font-size: 13px;
                            line-height: 18px;
                            letter-spacing: -0.5px;
                            margin-bottom: 9px;
                        }
                        .link {
                            width: 140px;
                            height: 20px;
                            display: inline-block;
                            border-radius: 4px;
                            background-size: 100% 100%;
                            background: transparent url("/assets/images/front/icons/main_link.png") 50% 50% no-repeat;
                            transition: all 0.3s;
                            &:hover {
                                transition: all 0.3s;
                                background: transparent url("/assets/images/front/icons/main_link_on.png") 50% 50%
                                    no-repeat;
                            }
                        }
                    }
                }
            }
        }
    }
    .real-page-outer {
        width: 100vw;
        &.trans-up {
            top: 0;
        }
        .real-page {
            background: #f1f1f1;
            overflow: hidden;
            min-height: 100vh;
            position: relative;

            .cat-box {
                height: 100%;
                padding: 10px 10px;
                box-sizing: border-box;
                z-index: 11;
                background: #1e1e1e;
                width: 55vw;
                transition: all 0.3s;
                position: absolute;
                right: -100vw;
                top: 0;
                &.active {
                    transition: all 0.3s;
                    right: 0;
                }
                .close-box {
                    position: absolute;
                    right: 57vw;
                    top: 10px;
                }
                .text-phone {
                    width: 100%;
                    // background: #db1b4b;
                    background: url("/assets/images/common/text_phone.png") 50% 50% no-repeat;
                    background-size: contain;
                    display: inline-block;
                    text-align: center;
                    padding: 10px 0 10px 15%;
                    box-sizing: border-box;
                    font-size: 16px;
                    border-radius: 8px;
                    color: #fff;
                    font-weight: bold;
                    padding-left: 13px;
                    box-sizing: border-box;
                }
                .cat-head {
                    overflow: hidden;
                    clear: both;
                    .title {
                        text-align: center;
                    }
                    ul {
                        width: 100%;
                        overflow: hidden;
                        margin-top: 5px;
                        margin-bottom: 15px;
                        li {
                            float: left;
                            width: 50%;
                            box-sizing: border-box;
                            padding: 3px;
                            a {
                                background: #252525;
                                box-sizing: border-box;
                                padding: 2vw;
                                display: block;
                                width: 100%;
                                .img-box {
                                    display: table;
                                    height: 50px;
                                    margin-bottom: 10px;
                                    margin: auto;
                                    .image-inner-box {
                                        display: table-cell;
                                        vertical-align: middle;
                                    }
                                }
                                p {
                                    color: #fff;
                                    text-align: center;
                                    font-size: 12px;
                                    letter-spacing: -0.5px;
                                }
                            }
                        }
                    }
                }
                .cat-body {
                    overflow-y: auto;
                    height: calc(100% - 323px);
                    padding: 0 10px;
                    .cat-section {
                        padding: 18px 0;
                        border-bottom: 1px solid #636363;
                        .cat-title {
                            color: #808285;
                            font-size: 16px;
                            margin-bottom: 12px;
                        }
                        ul {
                            overflow: hidden;
                            width: 100%;
                            li {
                                width: 100%;
                                margin-bottom: 18px;
                                &:last-child {
                                    margin-bottom: 0;
                                }
                                a {
                                    display: block;
                                    .cat-imgbox {
                                        text-align: center;
                                        width: 23px;
                                        display: inline-block;
                                        img {
                                            width: 100%;
                                            vertical-align: middle;
                                        }
                                    }
                                    p {
                                        display: inline-block;
                                        margin-left: 10px;
                                        font-size: 14px;
                                        color: #b7b7b7;
                                        vertical-align: middle;
                                    }
                                }
                            }
                        }
                    }
                    .cat-footer {
                        padding: 18px 0;
                        p {
                            &:first-child {
                                margin-bottom: 10px;
                            }
                            a {
                                font-size: 15px;
                                color: #474747;
                            }
                        }
                    }
                }
            }
            .footer {
                background: #fff;
                position: relative;
                img.event-flag {
                    position: absolute;
                    left: 19%;
                    top: -2%;
                    width: 20%;
                    z-index: 10;
                    &.active {
                        position: fixed;
                        top: initial;
                        bottom: 7.5%;
                        left: 19%;
                    }
                }
                div.footer-navigation-outer {
                    border-top: 1px solid #9da6ab;
                    bottom: 0;
                    left: 0;
                    z-index: 5;
                    background: #fff;
                    width: 100%;
                    margin: auto;
                    &.active {
                        position: fixed;
                        display: block;
                    }
                    .corona-floating {
                        text-align: center;
                        background: #313131;
                        padding: 7px 0 5px 0;
                        > img {
                            width: 40%;
                            display: inline-block;
                        }
                    }
                    ul.footer-navigation {
                        padding: 10px 0;
                        overflow: hidden;
                        width: 100%;
                        li {
                            display: table;
                            width: 50%;
                            box-sizing: border-box;
                            float: left;
                            height: 45px;
                            text-align: center;
                            background: url(/assets/images/mobile/footer_line.png) no-repeat;
                            background-size: 1px;
                            background-position: right center;
                            &:last-child {
                                background: none;
                            }
                            // &.text {
                            //   line-height: 45px;
                            //   font-size: 14px;
                            //   color: #e41e4f;
                            //   font-weight: bold;
                            //   letter-spacing: -0.5px;
                            // }
                            a {
                                display: table-cell;
                                vertical-align: middle;
                                width: 100%;
                                img {
                                    margin-top: 3px;
                                    width: 55%;
                                }
                            }
                        }
                    }
                }
                .inner-footer {
                    border-top: 1px solid #ced2d5;
                    overflow: hidden;
                    background: #fff;
                    width: 100%;
                    margin: auto;
                    // margin-top: -5px;
                    padding-bottom: 10px;
                    .sns-row {
                        padding: 10px 0 4px 0;
                        border-bottom: 1px solid #ced2d5;
                        text-align: center;
                        ul {
                            display: inline-block;
                            li {
                                float: left;
                                margin-right: 10px;
                                &:last-child {
                                    margin-right: 0;
                                }
                                img {
                                    width: 40px;
                                }
                            }
                        }
                    }
                    .footer-logo {
                        width: 75px;
                        float: left;
                        text-align: center;
                        padding: 20px 10px;
                        box-sizing: border-box;
                    }
                    .upper-area {
                        box-sizing: border-box;
                        .row-1 {
                            overflow: hidden;
                            > ul {
                                text-align: center;
                                > li {
                                    display: inline-block;
                                    a {
                                        font-size: 12px;
                                        color: #9da6ab;
                                        transition: all 0.3s;
                                        letter-spacing: -1px;
                                        &:hover {
                                            transition: all 0.3s;
                                            color: #e11a4d;
                                        }
                                    }
                                    &.separator {
                                        margin: 0 5px;
                                    }
                                }
                            }
                            .icon-box {
                                padding-right: 10px;
                                text-align: center;
                                ul {
                                    &.flr li {
                                        margin-right: 8px;
                                    }
                                    li {
                                        display: inline-block;
                                        color: #c1c1c1;
                                        margin-right: 5px;
                                        &:last-child {
                                            margin-right: 0;
                                        }
                                        a {
                                            font-size: 11px;
                                            display: inline-block;
                                            color: #c1c1c1;
                                            img {
                                                width: 16px;
                                            }
                                        }
                                        .branch-link {
                                            padding: 4px 8px;
                                            border-radius: 4px;
                                            margin-right: 0;
                                            font-size: 14px;
                                            background: #e9e9e9;
                                            color: #9da6ab;
                                            transition: all 0.3s;
                                            &:hover {
                                                transition: all 0.3s;
                                                background: #e11a4d;
                                                color: #fff;
                                                .color-red {
                                                    color: #fff !important;
                                                }
                                            }
                                            .color-red {
                                                color: #e31a4c;
                                            }
                                        }
                                    }
                                }
                            }
                        }
                        .row-2 {
                            clear: both;
                            overflow: hidden;
                            .left {
                                float: left;
                                width: 25%;
                                box-sizing: border-box;
                                text-align: center;
                                img {
                                    width: 60%;
                                    display: inline-block;
                                }
                            }
                            .right {
                                width: 75%;
                                float: left;
                                box-sizing: border-box;
                                font-size: 11px;
                                line-height: 16px;
                                color: #c1c1c1 !important;
                                letter-spacing: -1px;
                                a {
                                    color: #c1c1c1;
                                }
                            }
                        }
                    }
                }
            }
            .row {
                overflow: hidden;
            }
            .upper-banner {
                // background: url("/assets/images/mobile/main/upper_banner.png") repeat;
                // background-size: 100% 100%;
                background: #fff;
                text-align: center;
                width: 100%;
                padding: 10px 0 0px 0;
                padding-top: 0;
                line-height: 0;
                position: relative;
                img {
                    // width: 50%;
                    width: 65%;
                }
                .dream-img {
                    width: 90px;
                }
                .dream-img2 {
                    width: 80px;
                }
            }
            .base-slider {
                width: 100%;
                // .item {
                //   min-height: calc(100vh - 169px - 97px);
                // }
                .item-home {
                    width: 100%;
                    min-height: calc(100vh - 169px);
                    background: #fff;
                    padding: 10px;
                    box-sizing: border-box;
                    .main-banner {
                        margin: -10px;
                        .prev-main {
                            z-index: 10;
                            position: absolute;
                            top: 36%;
                            // top: calc((100vh - 68px) / 2);
                            left: 2%;
                            cursor: pointer;
                            opacity: 0.4;
                            width: 17px;
                            height: 58px;
                        }
                        .next-main {
                            z-index: 10;
                            position: absolute;
                            top: 36%;
                            right: 2%;
                            cursor: pointer;
                            opacity: 0.4;
                            width: 17px;
                            height: 58px;
                        }
                    }
                    .class-box {
                        margin: -10px;
                        margin-top: 20px;
                        background: #fff;
                        position: relative;

                        .trans-img {
                            position: absolute;
                            bottom: 7px;
                            left: 2.5%;
                            width: 95%;
                            height: 45px;
                            margin-left: 2px;
                        }
                        > img {
                            width: 100%;
                        }
                        .overview {
                            background: #ed174b;
                            // height: 22px;
                            overflow: hidden;
                            padding: 3px 10px;
                            border-radius: 20px 20px 0 0;
                            div {
                                font-size: 15px;
                                color: #fff;
                                padding: 0 7px;
                                line-height: 20px;
                                float: left;
                                box-sizing: border-box;
                                letter-spacing: -0.5px;
                                &:last-child {
                                    text-align: right;
                                }
                                &.overview-title {
                                    text-align: center;
                                    font-size: 15px;
                                    float: left;
                                    display: inline-block;
                                    line-height: 37px;
                                    .live {
                                        background: rgba(255, 255, 255, 0.8);
                                        color: #eb4060;
                                        padding: 3px 4px;
                                        font-size: 10px;
                                        font-weight: bold;
                                        border-radius: 40px;
                                        margin-left: 5px;
                                        letter-spacing: 0.6px;
                                    }
                                }
                                &.overview-right {
                                    float: right;
                                    font-size: 12px;
                                    line-height: 16px;
                                    margin-top: 5px;
                                    p {
                                        text-align: right;
                                    }
                                    p.date {
                                        font-size: 11px;
                                        margin-bottom: -3px;
                                    }
                                }
                            }
                        }
                        .class-tab {
                            width: 100%;
                            display: block;
                            li {
                                text-align: center;
                                float: left;
                                width: 33.3%;
                                padding: 5px 0;
                                font-size: 13px;
                                cursor: pointer;
                                color: #c0c0c0;
                                background: #f5f5f5;
                                &.active {
                                    color: #eb4060;
                                    background: #fff;
                                }
                            }
                            // display: block;
                            &.branch {
                                display: none;
                            }
                        }
                        .class-list {
                            &::-webkit-scrollbar-track {
                                -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0);
                                border-radius: 0px;
                                background-color: #e0e0e0;
                            }
                            &::-webkit-scrollbar {
                                width: 12px;
                                background-color: #ccc;
                            }
                            &::-webkit-scrollbar-thumb {
                                border-radius: 0px;
                                -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
                                background-color: #ccc;
                            }
                            border-bottom: 1px solid #ededed;
                            // margin-top: -6px;
                            border-top: 0;
                            width: 100%;
                            // border: 2px solid #891635;
                            // border: 2px solid #ddd;
                            background: #f1f1f1;
                            box-sizing: border-box;
                            overflow: hidden;
                            // height: 426px;
                            height: 170px;
                            display: block;
                            li {
                                background: #fff;
                                // border-bottom: 1px solid #e2e2e2;
                                // margin: 10px;
                                padding: 5px 0;
                                &:last-child {
                                    border-bottom: 0;
                                    // margin-bottom: 0;
                                    margin-bottom: 90px;
                                }
                                &.active {
                                    background: #e11c4a;
                                }
                                // &:last-child {
                                // }
                                cursor: pointer;
                                &.active {
                                    background: #e11c4a;
                                    td,
                                    a {
                                        color: #fff !important;
                                        &.color-red {
                                            color: #fff !important;
                                        }
                                    }
                                }
                                table {
                                    td {
                                        &:last-child {
                                            // text-align: right;
                                        }
                                        span.circle-number {
                                            color: #fff;
                                            font-size: 12px;
                                            font-weight: bold;
                                            background: #eee;
                                            border-radius: 50%;
                                            width: 20px;
                                            height: 20px;
                                            display: inline-block;
                                            text-align: center;
                                            line-height: 20px;
                                            &.nailart {
                                                background: #fe9684;
                                            }
                                            &.makeup {
                                                background: #ee8fa5;
                                            }
                                            &.esthetic {
                                                background: #b18acf;
                                            }
                                            &.hair {
                                                background: #b3ceca;
                                            }
                                            &.special {
                                                background: #f3c35e;
                                            }
                                        }
                                        img {
                                            width: 40px;
                                            margin: 0 6px;
                                            margin-left: 0;
                                        }
                                        a {
                                            width: 60px;
                                            padding-top: 5px;
                                            padding-bottom: 5px;
                                            display: inline-block;
                                            // color: #fff !important;
                                            font-size: 14px;
                                            vertical-align: middle;
                                            text-align: center;
                                            margin-left: 10px;
                                            // background: #df5cac;
                                            &.status-regular {
                                                color: #e11c4a;
                                            }
                                            &.status-active {
                                                color: #ed6f31;
                                            }
                                            &.status-day {
                                                background: #b061f9;
                                            }
                                        }
                                        &.class-title {
                                            font-size: 13px;
                                            width: 69%;
                                            padding: 0 7px;
                                            color: #333;
                                        }
                                        &.color-red {
                                            padding-top: 0px;
                                            font-size: 11px;
                                            padding: 0 7px;
                                            height: 14px;
                                            // height: 28px;
                                            display: inline-block;
                                            overflow: hidden;
                                            color: #666 !important;
                                        }
                                    }
                                }
                            }
                        }
                    }
                    .arrow-area {
                        margin: -10px;
                        clear: both;
                        overflow: hidden;
                        // margin-top: -9px;
                        background: #f5f5f5;
                        padding-top: 10px;
                        border-bottom: 1px solid #ededed;
                        > div {
                            &:first-child {
                                border-right: 1px solid #ededed;
                            }
                            padding-top: 5px;
                            margin-bottom: 2px;
                            box-sizing: border-box;
                            // border-top: 1px solid #ccc;
                            text-align: center;
                            img {
                                display: inline-block !important;
                                width: 7% !important;
                                &.active {
                                    background: rgba(0, 0, 0, 0.1);
                                }
                            }
                        }
                    }
                    .third-row {
                        margin: 10px -10px;
                    }
                    .menu-box {
                        margin: -10px;
                        margin-top: 25px;
                        margin-bottom: 15px;
                        position: relative;
                        .menu-box-bg {
                            display: none;
                            position: absolute;
                            width: 100%;
                            left: 0;
                            z-index: 10;
                        }
                        ul {
                            overflow: hidden;
                            width: 100%;
                            display: block;
                            // border-top: 1px solid #999;
                            // border-bottom: 1px solid #999;
                            // background: #e8e8e8;
                            li {
                                width: 25%;
                                box-sizing: border-box;
                                float: left;
                                // border-right: 1px solid #ccc;
                                text-align: center;
                                a {
                                    width: 70%;
                                    padding: 15% 0;
                                    display: block;
                                    margin: auto;
                                    img {
                                        width: 100%;
                                    }
                                }
                                &:nth-child(1) {
                                    // border-bottom: 1px solid #ccc;
                                }
                                &:nth-child(2) {
                                    // border-bottom: 1px solid #ccc;
                                }
                            }
                        }
                    }
                    .interview-box {
                        img {
                            border-radius: 12px;
                        }
                        .prev-interview {
                            z-index: 10;
                            position: absolute;
                            top: 47%;
                            left: 2%;
                            cursor: pointer;
                        }
                        .next-interview {
                            z-index: 10;
                            position: absolute;
                            top: 47%;
                            right: 2%;
                            cursor: pointer;
                        }
                    }
                    .institute-box {
                        .title-box {
                            text-align: center;
                            margin-bottom: 10px;
                            .title {
                                font-family: "s-core";
                                font-size: 20px;
                                color: #333;
                                text-align: center;
                                display: inline-block;
                                width: 46%;
                            }
                            .line {
                                width: 25%;
                                display: inline-block;
                                border-bottom: 1px #666 solid;
                                margin-bottom: 7px;
                            }
                        }
                        .prev-institute {
                            z-index: 10;
                            position: absolute;
                            top: 47%;
                            left: 2%;
                            cursor: pointer;
                        }
                        .next-institute {
                            z-index: 10;
                            position: absolute;
                            top: 47%;
                            right: 2%;
                            cursor: pointer;
                        }
                    }
                    .teacher-box {
                        .title-box {
                            text-align: center;
                            margin-bottom: 10px;
                            margin-top: 20px;
                            .title {
                                font-family: "s-core";
                                font-size: 20px;
                                color: #333;
                                text-align: center;
                                display: inline-block;
                                width: 46%;
                            }
                            .line {
                                width: 25%;
                                display: inline-block;
                                border-bottom: 1px #666 solid;
                                margin-bottom: 7px;
                            }
                        }
                        .prev-teacher {
                            z-index: 10;
                            position: absolute;
                            top: 47%;
                            left: 2%;
                            cursor: pointer;
                        }
                        .next-teacher {
                            z-index: 10;
                            position: absolute;
                            top: 47%;
                            right: 2%;
                            cursor: pointer;
                        }
                        ul {
                            flex-wrap: wrap;
                            display: inline-flex;
                            flex-direction: row;
                            overflow: inherit;
                            li {
                                // width: 20%;
                                text-align: center;
                                position: relative;
                                img.teacher {
                                    // width: 90%;
                                    display: block;
                                    border-bottom: 2px solid #e11a4d;
                                }
                                .tag {
                                    margin-top: 10px;
                                    color: #bfbfbf;
                                    width: 100%;
                                    text-align: center;
                                    p {
                                        text-align: center;
                                    }
                                    .color-red {
                                        text-align: center;
                                        font-size: 13px;
                                    }
                                    .subject {
                                        text-align: center;
                                        color: #bfbfbf;
                                        font-size: 11px;
                                    }
                                }
                            }
                        }
                    }
                    .community-row {
                        margin-top: 20px;
                        bottom: 50px;
                        > div {
                            .inner-box {
                                width: 95%;
                                margin: auto;
                                .title-area {
                                    .title {
                                        color: #333;
                                        font-size: 16px;
                                        display: inline-block;
                                    }
                                    a {
                                        float: right;
                                        font-size: 13px;
                                        color: #333;
                                    }
                                    border-bottom: 1px solid #ccc;
                                    padding-bottom: 4px;
                                }
                                .content-area {
                                    ul {
                                        li {
                                            // border-bottom: 1px solid #ccc;
                                            padding-bottom: 6px;
                                            a {
                                                padding: 7px 0;
                                                color: #666;
                                                font-size: 13px;
                                                display: block;
                                                line-height: 26px;
                                                height: 13px;
                                                display: inline-block;
                                                overflow: hidden;
                                                width: 90%;
                                            }
                                            &:last-child {
                                                border-bottom: 0;
                                            }
                                            .new {
                                                background-color: #e6003e;
                                                color: #fff !important;
                                                text-align: center;
                                                white-space: nowrap;
                                                vertical-align: baseline;
                                                border-radius: 25px !important;
                                                font-size: 10px !important;
                                                width: 10%;
                                                float: right;
                                                margin-top: 12px;
                                            }
                                        }
                                    }
                                }
                            }
                        }
                    }
                    .main-phone-box {
                        background: #e11a4d;
                        display: table;
                        box-sizing: border-box;
                        width: 100%;
                        margin-top: 15px;
                        // line-height: 128px;
                        div {
                            display: table-cell;
                            vertical-align: middle;
                            text-align: center;
                            img {
                                vertical-align: text-bottom;
                            }
                            .font-big {
                                font-size: 24px;
                                color: #fff;
                                font-weight: bold;
                                letter-spacing: -1px;
                                display: inline-block;
                                margin-right: 7px;
                            }
                            a {
                                vertical-align: middle;
                                font-size: 25px;
                                color: #fff;
                                font-weight: bold;
                                letter-spacing: -0.5px;
                            }
                        }
                    }
                    ul.core-menu {
                        overflow: hidden;
                        width: 100vw;
                        li {
                            padding: 2px;
                            box-sizing: border-box;
                            .inner-box {
                                overflow: hidden;
                                background: #fff;
                                -webkit-box-shadow: 5px 5px 5px 0px #e0e0e0;
                                -moz-box-shadow: 5px 5px 5px 0px #e0e0e0;
                                box-shadow: 5px 5px 5px 0px #e0e0e0;
                                border-radius: 4px;
                                width: 100%;
                                height: 100%;
                                a {
                                    display: block;
                                    width: 100%;
                                    float: right;
                                    position: relative;
                                    height: 100%;
                                    img {
                                        width: 37vw;
                                        height: 38vw;
                                        position: absolute;
                                        top: 0;
                                        right: 6vw;
                                    }
                                    .nav-core {
                                        width: 50px;
                                        position: absolute;
                                        top: 0;
                                        left: 8px;
                                    }
                                    .menu-footer {
                                        position: absolute;
                                        bottom: 0;
                                        width: 100%;
                                        text-align: center;
                                        border-top: 1px solid #e8e8e8;
                                        padding: 3vw 0;
                                        font-size: 14px;
                                        color: #141414;
                                    }
                                }
                            }
                        }
                    }
                    .play-box {
                        padding: 0 5px;
                        margin-bottom: 10px;
                        .play-title {
                            overflow: hidden;
                            padding: 15px 8px;
                            .title {
                                font-weight: 600;
                                color: #141414;
                                font-size: 14px;
                                margin-right: 15px;
                                letter-spacing: -1px;
                                float: left;
                            }
                            .title-text {
                                color: #141414;
                                font-size: 12px;
                                letter-spacing: -1px;
                                vertical-align: text-top;
                            }
                            .sub-arrow {
                                width: 2vw;
                                height: 4vw;
                                float: right;
                                // margin-top: 5px;
                            }
                        }
                        ul {
                            overflow: hidden;
                            margin: auto;
                            display: block;
                            li {
                                float: left;
                                width: 24%;
                                padding: 2px;
                                box-sizing: border-box;
                                margin-right: 1%;
                                &:last-child {
                                    margin-right: 0;
                                }
                                img {
                                    width: 100%;
                                    height: 100%;
                                }
                            }
                        }
                    }
                    .link-menu {
                        background: #fff;
                        padding: 20px 0;
                        ul {
                            overflow: hidden;
                            width: 100%;
                            li {
                                width: 33.3%;
                                float: left;
                                padding: 0 10px;
                                box-sizing: border-box;
                                .img-box {
                                    display: block;
                                    text-align: center;
                                    img {
                                        width: 20vw;
                                        height: 20vw;
                                        display: inline-block;
                                    }
                                }
                                .bottom-area {
                                    margin-top: 10px;
                                    box-sizing: border-box;
                                    &.phone-area {
                                        .title {
                                            margin-bottom: 12px;
                                        }
                                        .text {
                                            font-size: 16px;
                                            line-height: 20px;
                                        }
                                    }
                                    .title {
                                        color: #141414;
                                        font-size: 15px;
                                        line-height: 18px;
                                        letter-spacing: -1px;
                                        margin-bottom: 5px;
                                        text-align: center;
                                    }
                                    .text {
                                        color: #9da6ab;
                                        font-size: 12px;
                                        line-height: 15px;
                                        letter-spacing: -1px;
                                        margin-bottom: 9px;
                                        text-align: center;
                                    }
                                    .link {
                                        width: 140px;
                                        height: 20px;
                                        display: inline-block;
                                        border-radius: 4px;
                                        background-size: 100% 100%;
                                        background: transparent url("/assets/images/front/icons/main_link.png") 50% 50%
                                            no-repeat;
                                        transition: all 0.3s;
                                        &:hover {
                                            transition: all 0.3s;
                                            background: transparent url("/assets/images/front/icons/main_link_on.png")
                                                50% 50% no-repeat;
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
                .item-center {
                    overflow: hidden;
                    background: #fff;
                    .link-box {
                        display: block;
                        background: #f1f1f1;
                        .sub-title-box {
                            overflow: hidden;
                            padding: 15px 8px;
                            .title {
                                font-weight: 600;
                                color: #141414;
                                font-size: 14px;
                                margin-right: 15px;
                                letter-spacing: -1px;
                                float: left;
                            }
                            .title-text {
                                color: #141414;
                                font-size: 12px;
                                letter-spacing: -1px;
                                vertical-align: text-top;
                            }
                            .sub-arrow {
                                width: 2vw;
                                height: 4vw;
                                float: right;
                                margin-top: 5px;
                            }
                        }
                    }
                    ul {
                        &.teacher-box {
                            background: #fff;
                            overflow: hidden;
                            li {
                                position: relative;
                                background-size: cover !important;
                                float: left;
                                width: 33.3vw;
                                height: 33.3vw;
                                padding: 2px;
                                padding-bottom: 0;
                                box-sizing: border-box;
                                &:nth-child(1),
                                &:nth-child(2),
                                &:nth-child(3) {
                                    margin-bottom: 2px;
                                }
                                a {
                                    bottom: 7px;
                                    position: absolute;
                                    width: 100%;
                                    text-align: center;
                                    color: #fff;
                                    font-size: 16px;
                                    text-shadow: 3px 3px 2px #000;
                                }
                            }
                        }
                        &.movie-box {
                            overflow: hidden;
                            li {
                                float: left;
                                width: 25%;
                                padding: 2px;
                                box-sizing: border-box;
                                img {
                                    width: 100%;
                                    height: 100%;
                                }
                            }
                        }
                    }
                    .map-box {
                        overflow: hidden;
                        margin: 5px 0 15px 0;
                        #map {
                            box-sizing: border-box;
                            width: 100vw;
                            height: 175px;
                            // border: 3px solid #e42151;
                        }
                    }
                }
                .item-curriculum {
                    .link-box {
                        display: block;
                        background: #fff;
                        .sub-title-box {
                            overflow: hidden;
                            padding: 15px 8px;
                            .title {
                                font-weight: 600;
                                color: #141414;
                                font-size: 14px;
                                margin-right: 15px;
                                letter-spacing: -1px;
                                float: left;
                            }
                            .title-text {
                                color: #141414;
                                font-size: 12px;
                                letter-spacing: -1px;
                                vertical-align: text-top;
                            }
                            .sub-arrow {
                                width: 2vw;
                                height: 4vw;
                                float: right;
                                margin-top: 5px;
                            }
                        }
                    }
                    .cur-box li a {
                        display: block;
                        overflow: hidden;
                        img {
                            width: 100%;
                        }
                    }
                }
                .item-guide {
                    .link-box {
                        display: block;
                        background: #fff;
                        .sub-title-box {
                            overflow: hidden;
                            // padding: 15px 8px;
                            // .title {
                            //   font-weight: 600;
                            //   color: #141414;
                            //   font-size: 14px;
                            //   margin-right: 15px;
                            //   letter-spacing: -1px;
                            //   float: left;
                            // }
                            // .title-text {
                            //   color: #141414;
                            //   font-size: 12px;
                            //   letter-spacing: -1px;
                            //   vertical-align: text-top;
                            // }
                            // .sub-arrow {
                            //   width: 2vw;
                            //   height: 4vw;
                            //   float: right;
                            //   margin-top: 5px;
                            // }
                        }
                    }
                    .blank-text {
                        // background: #fff;
                        color: #525252;
                        font-size: 14px;
                        width: 100%;
                        padding: 70px 0;
                        // margin-top: 50px;
                        text-align: center;
                        .color-red {
                            color: #e31a4c;
                        }
                    }
                    .tabs {
                        margin-top: 50px;
                        margin-bottom: -5px;
                        width: 100%;
                        li {
                            letter-spacing: -0.5px;
                            cursor: pointer;
                            border-radius: 8px 8px 0 0;
                            padding: 7px 20px;
                            display: inline-block;
                            background: #e4e4e4;
                            color: #808080;
                            width: 48%;
                            float: left;
                            margin: 1%;
                            box-sizing: border-box;
                            &.active {
                                background: #e11a4d;
                                color: #fff;
                            }
                        }
                    }
                }
                .item-career {
                    .link-box {
                        display: block;
                        background: #fff;
                        .sub-title-box {
                            overflow: hidden;
                            padding: 15px 8px;
                            .title {
                                font-weight: 600;
                                color: #141414;
                                font-size: 14px;
                                margin-right: 15px;
                                letter-spacing: -1px;
                                float: left;
                            }
                            .title-text {
                                color: #141414;
                                font-size: 12px;
                                letter-spacing: -1px;
                                vertical-align: text-top;
                            }
                            .sub-arrow {
                                width: 2vw;
                                height: 4vw;
                                float: right;
                                margin-top: 5px;
                            }
                        }
                    }
                    .car-box li a {
                        display: block;
                        overflow: hidden;
                        img {
                            width: 100%;
                        }
                    }
                }
                .item-wannabe {
                    overflow: hidden;
                    background: #fff;
                    .main-bg img {
                        width: 100% !important;
                    }
                    .link-box {
                        display: block;
                        background: #f1f1f1;
                        .sub-title-box {
                            overflow: hidden;
                            padding: 15px 8px;
                            .title {
                                font-weight: 600;
                                color: #141414;
                                font-size: 14px;
                                margin-right: 15px;
                                letter-spacing: -1px;
                                float: left;
                            }
                            .title-text {
                                color: #141414;
                                font-size: 12px;
                                letter-spacing: -1px;
                                vertical-align: text-top;
                            }
                            .sub-arrow {
                                width: 2vw;
                                height: 4vw;
                                float: right;
                                margin-top: 5px;
                            }
                        }
                    }
                    ul {
                        &.c-list {
                            overflow: hidden;
                            li {
                                border-bottom: 1px solid #e6e6e6;
                                a {
                                    display: block;
                                    overflow: hidden;
                                    padding: 15px;
                                    height: 90px;
                                    .img-box {
                                        float: left;
                                        width: 40%;
                                        padding-right: 0;
                                        box-sizing: border-box;
                                        max-width: 150px;
                                        img {
                                            width: 100%;
                                        }
                                    }
                                    .text-box {
                                        float: left;
                                        width: 60%;
                                        padding-left: 15px;
                                        box-sizing: border-box;
                                        font-size: 15px;
                                        height: 100%;
                                        display: table;
                                        .text-inner-box {
                                            display: table-cell;
                                            vertical-align: middle;
                                            color: #323232;
                                            font-size: 14px;
                                            letter-spacing: -1px;
                                            line-height: 18px;
                                            .red-color {
                                                margin-right: 5px;
                                                color: #e31a4c;
                                                font-size: 15px;
                                                font-weight: bold;
                                                letter-spacing: -0.5px;
                                            }
                                        }
                                    }
                                }
                            }
                        }
                        &.teacher-box {
                            background: #fff;
                            overflow: hidden;
                            li {
                                position: relative;
                                background-size: cover !important;
                                float: left;
                                width: 33.3vw;
                                height: 33.3vw;
                                padding: 2px;
                                padding-bottom: 0;
                                box-sizing: border-box;
                                &:nth-child(1),
                                &:nth-child(2),
                                &:nth-child(3) {
                                    margin-bottom: 2px;
                                }
                                a {
                                    bottom: 7px;
                                    position: absolute;
                                    width: 100%;
                                    text-align: center;
                                    color: #fff;
                                    font-size: 16px;
                                    text-shadow: 3px 3px 2px #000;
                                }
                            }
                        }
                        &.movie-box {
                            overflow: hidden;
                            li {
                                float: left;
                                width: 25%;
                                padding: 2px;
                                box-sizing: border-box;
                                img {
                                    width: 100%;
                                    height: 100%;
                                }
                            }
                        }
                    }
                    .map-box {
                        overflow: hidden;
                        margin: 5px 0 15px 0;
                        #map2 {
                            box-sizing: border-box;
                            width: 100vw;
                            height: 175px;
                            // border: 3px solid #e42151;
                        }
                    }
                }
                .item-business {
                    overflow: hidden;
                    background: #fff;
                    .main-bg img {
                        width: 100% !important;
                    }
                    .link-box {
                        display: block;
                        background: #f1f1f1;
                        .sub-title-box {
                            overflow: hidden;
                            padding: 15px 8px;
                            .title {
                                font-weight: 600;
                                color: #141414;
                                font-size: 14px;
                                margin-right: 15px;
                                letter-spacing: -1px;
                                float: left;
                            }
                            .title-text {
                                color: #141414;
                                font-size: 12px;
                                letter-spacing: -1px;
                                vertical-align: text-top;
                            }
                            .sub-arrow {
                                width: 2vw;
                                height: 4vw;
                                float: right;
                                margin-top: 5px;
                            }
                        }
                    }
                }
                .item-community {
                    overflow: hidden;
                    background: #fff;
                    .link-box {
                        display: block;
                        background: #f1f1f1;
                        .sub-title-box {
                            overflow: hidden;
                            padding: 15px 8px;
                            .title {
                                font-weight: 600;
                                color: #141414;
                                font-size: 14px;
                                margin-right: 15px;
                                letter-spacing: -1px;
                                float: left;
                            }
                            .title-text {
                                color: #141414;
                                font-size: 12px;
                                letter-spacing: -1px;
                                vertical-align: text-top;
                            }
                            .sub-arrow {
                                width: 2vw;
                                height: 4vw;
                                float: right;
                                margin-top: 5px;
                            }
                        }
                    }
                    ul.c-list {
                        overflow: hidden;
                        li {
                            border-bottom: 1px solid #e6e6e6;
                            a {
                                display: block;
                                overflow: hidden;
                                padding: 15px;
                                height: 90px;
                                .img-box {
                                    float: left;
                                    width: 40%;
                                    padding-right: 0;
                                    box-sizing: border-box;
                                    max-width: 150px;
                                    img {
                                        width: 100%;
                                    }
                                }
                                .text-box {
                                    float: left;
                                    width: 60%;
                                    padding-left: 15px;
                                    box-sizing: border-box;
                                    font-size: 15px;
                                    height: 100%;
                                    display: table;
                                    .text-inner-box {
                                        display: table-cell;
                                        vertical-align: middle;
                                        color: #323232;
                                        font-size: 14px;
                                        letter-spacing: -1px;
                                        line-height: 18px;
                                        .red-color {
                                            margin-right: 5px;
                                            color: #e31a4c;
                                            font-size: 15px;
                                            font-weight: bold;
                                            letter-spacing: -0.5px;
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
                .item-counsel {
                    background: #fff;
                    .page-text {
                        margin: 20px 0;
                        padding: 0 20px;
                        font-size: 12px;
                        letter-spacing: -0.5px;
                        text-align: center;
                    }
                    .counsel-title {
                        color: #e11b4a !important;
                        font-size: 30px;
                        font-weight: 400;
                        margin: 5px 0;
                        text-align: center;
                    }
                    .counsel-subtitle {
                        text-align: center;
                        color: #ccc !important;
                        font-size: 12px;
                        font-weight: 200;
                        padding-top: 50px;
                    }
                    .line {
                        display: inline-block;
                        width: 50px;
                        height: 2px;
                        background: #ccc;
                    }
                    .button-area {
                        padding-bottom: 50px;
                        ul {
                            border: 1px solid #eee;
                            width: 90%;
                            margin: auto 5%;
                            box-sizing: border-box;
                            li {
                                width: 50%;
                                float: left;
                                text-align: center;
                                > a {
                                    height: 140px !important;
                                }
                                .inner-box {
                                    height: 100px !important;
                                    img {
                                        width: 50px !important;
                                    }
                                    span {
                                        font-size: 14px !important;
                                        bottom: 25px;
                                    }
                                }
                                &:nth-child(1) {
                                    a {
                                        border-right: 1px dashed #eee;
                                        border-left: 1px solid #fff;
                                        border-bottom: 1px dashed #eee;
                                    }
                                }
                                &:nth-child(2) {
                                    a {
                                        border-right: 1px dashed #eee;
                                        border-left: 1px solid #fff;
                                        border-bottom: 1px dashed #eee;
                                    }
                                }
                                &:nth-child(3) {
                                    a {
                                        border-left: 1px solid #fff;
                                        border-right: 1px dashed #eee;
                                    }
                                }
                                &:nth-child(4) {
                                    a {
                                        border-left: 1px solid #fff;
                                    }
                                }
                                a {
                                    box-sizing: border-box;
                                    display: flex;
                                    flex-direction: column;
                                    align-items: center;
                                    justify-content: center;
                                    // border: 1px solid #eee;
                                    height: 200px;

                                    &:hover {
                                        border: 1px solid #e11b4a;
                                        span {
                                            color: #e11b4a !important;
                                        }
                                    }
                                    .inner-box {
                                        height: 120px;
                                        position: relative;
                                        width: 100%;
                                        img {
                                            width: 70px;
                                            display: inline-block;
                                        }
                                        span {
                                            position: absolute;
                                            bottom: 10px;
                                            display: block;
                                            text-align: center;
                                            color: #333;
                                            font-size: 17px;
                                            width: 100%;
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }
    .sub-page-outer {
        &.trans-up {
            top: 0;
        }
        .sub-page {
            background: #f1f1f1;
            overflow: hidden;
            min-height: 100vh;
            position: relative;
            .cat-box {
                height: 100%;
                padding: 10px 10px;
                box-sizing: border-box;
                z-index: 11;
                background: #1e1e1e;
                width: 55vw;
                transition: all 0.3s;
                position: absolute;
                right: -100vw;
                top: 0;
                &.active {
                    transition: all 0.3s;
                    right: 0;
                }
                .close-box {
                    position: absolute;
                    right: 57vw;
                    top: 10px;
                }
                .text-phone {
                    width: 100%;
                    background: url("/assets/images/common/text_phone.png") 50% 50% no-repeat;
                    background-size: contain;
                    display: inline-block;
                    text-align: center;
                    padding: 10px 0;
                    font-size: 16px;
                    border-radius: 8px;
                    color: #fff;
                    font-weight: bold;
                    padding-left: 13px;
                    box-sizing: border-box;
                }
                .cat-head {
                    overflow: hidden;
                    clear: both;
                    .title {
                        text-align: center;
                    }
                    ul {
                        width: 100%;
                        overflow: hidden;
                        margin-top: 5px;
                        margin-bottom: 15px;
                        li {
                            float: left;
                            width: 50%;
                            box-sizing: border-box;
                            padding: 3px;
                            a {
                                background: #252525;
                                box-sizing: border-box;
                                padding: 2vw;
                                display: block;
                                width: 100%;
                                .img-box {
                                    display: table;
                                    height: 50px;
                                    margin-bottom: 10px;
                                    margin: auto;
                                    .image-inner-box {
                                        display: table-cell;
                                        vertical-align: middle;
                                    }
                                }
                                p {
                                    color: #fff;
                                    text-align: center;
                                    font-size: 12px;
                                    letter-spacing: -0.5px;
                                }
                            }
                        }
                    }
                }
                .cat-body {
                    overflow-y: auto;
                    height: calc(100% - 323px);
                    padding: 0 10px;
                    .cat-section {
                        padding: 18px 0;
                        border-bottom: 1px solid #636363;
                        .cat-title {
                            color: #808285;
                            font-size: 16px;
                            margin-bottom: 12px;
                        }
                        ul {
                            overflow: hidden;
                            width: 100%;
                            li {
                                width: 100%;
                                margin-bottom: 18px;
                                &:last-child {
                                    margin-bottom: 0;
                                }
                                a {
                                    display: block;
                                    .cat-imgbox {
                                        text-align: center;
                                        width: 23px;
                                        display: inline-block;
                                        img {
                                            width: 100%;
                                            vertical-align: middle;
                                        }
                                    }
                                    p {
                                        display: inline-block;
                                        margin-left: 10px;
                                        font-size: 14px;
                                        color: #b7b7b7;
                                        vertical-align: middle;
                                    }
                                }
                            }
                        }
                    }
                    .cat-footer {
                        padding: 18px 0;
                        p {
                            &:first-child {
                                margin-bottom: 10px;
                            }
                            a {
                                font-size: 15px;
                                color: #474747;
                            }
                        }
                    }
                }
            }
            .footer {
                background: #fff;
                position: relative;
                img.event-flag {
                    position: absolute;
                    left: 19%;
                    top: -2%;
                    width: 20%;
                    z-index: 10;
                    &.active {
                        position: fixed;
                        top: initial;
                        bottom: 7.5%;
                        left: 19%;
                    }
                    &.on {
                        opacity: 1;
                    }
                }
                div.footer-navigation-outer {
                    border-top: 1px solid #9da6ab;
                    bottom: 0;
                    left: 0;
                    z-index: 5;
                    background: #fff;
                    width: 100%;
                    margin: auto;
                    &.active {
                        position: fixed;
                        display: block;
                    }
                    .corona-floating {
                        text-align: center;
                        background: #313131;
                        padding: 7px 0 5px 0;
                        > img {
                            width: 40%;
                            display: inline-block;
                        }
                    }
                    ul.footer-navigation {
                        padding: 10px 0;
                        overflow: hidden;
                        width: 100%;
                        li {
                            display: table;
                            width: 50%;
                            box-sizing: border-box;
                            float: left;
                            height: 45px;
                            text-align: center;
                            background: url(/assets/images/mobile/footer_line.png) no-repeat;
                            background-size: 1px;
                            background-position: right center;
                            &:first-child {
                                padding-left: 2px;
                            }
                            &:last-child {
                                background: none;
                            }
                            // &.text {
                            //   line-height: 45px;
                            //   font-size: 14px;
                            //   color: #e41e4f;
                            //   font-weight: bold;
                            //   letter-spacing: -0.5px;
                            // }
                            a {
                                display: table-cell;
                                vertical-align: middle;
                                width: 100%;
                                img {
                                    margin-top: 3px;
                                    width: 55%;
                                }
                            }
                        }
                    }
                }
                .inner-footer {
                    border-top: 1px solid #ced2d5;
                    overflow: hidden;
                    background: #fff;
                    width: 100%;
                    margin: auto;
                    margin-top: -5px;
                    padding-bottom: 10px;
                    .sns-row {
                        padding: 10px 0 4px 0;
                        border-bottom: 1px solid #ced2d5;
                        text-align: center;
                        ul {
                            display: inline-block;
                            li {
                                float: left;
                                margin-right: 10px;
                                &:last-child {
                                    margin-right: 0;
                                }
                                img {
                                    width: 40px;
                                }
                            }
                        }
                    }
                    .footer-logo {
                        width: 75px;
                        float: left;
                        text-align: center;
                        padding: 20px 10px;
                        box-sizing: border-box;
                    }
                    .upper-area {
                        box-sizing: border-box;
                        .row-1 {
                            overflow: hidden;
                            text-align: center;
                            > ul {
                                display: block;
                                > li {
                                    display: inline-block;
                                    a {
                                        font-size: 12px;
                                        color: #9da6ab;
                                        transition: all 0.3s;
                                        letter-spacing: -1px;
                                        &:hover {
                                            transition: all 0.3s;
                                            color: #e11a4d;
                                        }
                                    }
                                    &.separator {
                                        margin: 0 5px;
                                    }
                                }
                            }
                            .icon-box {
                                padding-right: 10px;
                                ul {
                                    display: block;
                                }
                                ul li {
                                    display: inline-block;
                                    margin-right: 5px;
                                    color: #c1c1c1;
                                    &:last-child {
                                        margin-right: 0;
                                    }
                                    a {
                                        font-size: 11px;
                                        display: inline-block;
                                        color: #c1c1c1;
                                        img {
                                            width: 16px;
                                        }
                                    }
                                    .branch-link {
                                        padding: 4px 8px;
                                        border-radius: 4px;
                                        margin-right: 0;
                                        font-size: 14px;
                                        background: #e9e9e9;
                                        color: #9da6ab;
                                        transition: all 0.3s;
                                        &:hover {
                                            transition: all 0.3s;
                                            background: #e11a4d;
                                            color: #fff;
                                            .color-red {
                                                color: #fff !important;
                                            }
                                        }
                                        .color-red {
                                            color: #e31a4c;
                                        }
                                    }
                                }
                            }
                        }
                        .row-2 {
                            clear: both;
                            overflow: hidden;
                            .left {
                                float: left;
                                width: 25%;
                                box-sizing: border-box;
                                text-align: center;
                                img {
                                    width: 60%;
                                    display: inline-block;
                                }
                            }
                            .right {
                                width: 75%;
                                float: left;
                                box-sizing: border-box;
                                font-size: 11px;
                                line-height: 16px;
                                color: #c1c1c1 !important;
                                letter-spacing: -1px;
                                a {
                                    color: #c1c1c1;
                                }
                            }
                        }
                    }
                }
            }
            .row {
                overflow: hidden;
            }
            .upper-banner {
                background: url("/assets/images/mobile/main/upper_banner.png") repeat;
                background-size: cover;
                width: 100%;
                padding: 10px 10px;
                font-size: 19px;
                color: #fff;
                img {
                    width: 30px;
                    height: 22px;
                    vertical-align: middle;
                    margin-right: 10px;
                }
            }
            .row.header-box {
                // border-bottom: 1px solid #e1e1e1;
                overflow: hidden;
                .owl-menu-box {
                    background: #e11c4a;
                    -webkit-tap-highlight-color: transparent;
                    height: 43px;
                    float: left;
                    width: 100%;
                    position: relative;
                    .left-op {
                        z-index: 3;
                        height: 43px;
                        position: absolute;
                        left: 0;
                        width: 20px;
                        background: -webkit-gradient(
                            linear,
                            left top,
                            right top,
                            color-stop(16.66%, #fff),
                            color-stop(100%, rgba(255, 255, 255, 0))
                        );
                    }
                    .right-op {
                        z-index: 3;
                        height: 43px;
                        position: absolute;
                        right: 0;
                        width: 30px;
                        background: -webkit-gradient(
                            linear,
                            left top,
                            right top,
                            color-stop(0, rgba(255, 255, 255, 0)),
                            color-stop(60%, #fff)
                        );
                    }
                    .owl-inner {
                        margin: auto;
                        width: 92%;
                        overflow: hidden;
                        &.pc {
                            text-align: center;
                            .owl-menu {
                                width: auto;
                                li,
                                .item {
                                    float: left;
                                }
                            }
                        }
                    }
                    .owl-menu {
                        overflow: hidden;
                        .owl-nav {
                            display: none;
                        }
                        .owl-item {
                            display: inline-block;
                            text-align: center;
                        }
                        > div {
                            white-space: nowrap;
                            box-sizing: border-box;
                            a {
                                padding: 0px 5px;
                                box-sizing: border-box;
                                width: 100%;
                                height: 41px;
                                line-height: 43px;
                                display: inline-block;
                                color: #f7afbb;
                                font-size: 14px;
                                // font-weight: bold;
                                letter-spacing: -0.5px;
                                &:active {
                                    background: #f1f1f1;
                                }
                                &.active,
                                &.active-fix {
                                    // border-bottom: 2px solid #df1d4f;
                                    color: #fff;
                                }
                            }
                        }
                    }
                }
                .menu-button {
                    background: #fff;
                    float: left;
                    width: 10%;
                    box-sizing: border-box;
                    text-align: center;
                    height: 43px;
                    border-left: 1px solid #e1e1e1;
                    line-height: 43px;
                    img {
                        width: 20px;
                        height: 10px;
                        vertical-align: middle;
                    }
                }
            }
            .base-slider,
            .base-page {
                width: 100%;
                > .owl-dots {
                    height: 0;
                }
                .item {
                    min-height: calc(100vh - 169px - 97px);
                    background-size: cover !important;
                    padding-bottom: 1px;
                }
                .item-bg-inner {
                    min-height: calc(100vh - 169px - 97px);
                    background-size: cover !important;
                    background-position: center !important;
                }
                .page-header-box {
                    // padding: 30px 10px;
                    padding: 14px 0;
                    max-width: 700px;
                    margin: auto;
                    &.leejua-header {
                        padding: 0;
                        position: relative;
                        background-position: 73% 7% !important;
                        background-size: cover !important;
                        .inner {
                            // position: absolute;
                            // width: 100%;
                            // height: 100%;
                            // left: 0;
                            // top: 0;
                            padding: 20px 20px;
                        }
                        .page-title {
                            border-top: 0 !important;
                            img {
                                width: 70%;
                            }
                        }
                        .page-bg {
                            text-align: left;
                        }
                        .page-text {
                            text-align: left;
                            line-height: 20px;
                            color: #bbb;
                            font-size: 12px;
                        }
                        .signature-box {
                            margin-top: 20px;
                            span {
                                color: #fff;
                                display: block;
                                font-size: 11px;
                                text-align: left;
                            }
                            img {
                                vertical-align: middle;
                                width: 30%;
                            }
                        }
                    }
                    .page-bg {
                        //background: url("/assets/images/front/general/page_bg.png") no-repeat;
                        //background-position: 0 100%;
                        //background-size: 100%;
                        text-align: center;
                        // margin-bottom: 10px;
                        padding-bottom: 2px;
                        .image-box {
                            //display: inline-block;
                            display: none;
                            .display-table {
                                display: table;
                                .page-image {
                                    display: table-cell;
                                    vertical-align: middle;
                                    margin-right: 5px;
                                    width: 30px;
                                }
                            }
                        }
                        .page-title {
                            display: inline-block;
                            color: #fff;
                            font-size: 19px;
                            letter-spacing: -1px;
                            font-weight: 600;
                            vertical-align: super;
                            border-top: 2px solid #fff;
                            padding-top: 10px;
                            &.white {
                                color: #fff;
                            }
                        }
                    }
                    .page-text {
                        color: #eee;
                        text-align: center;
                        font-size: 11px;
                        letter-spacing: -0.5px;
                        line-height: 16px;
                        .bold {
                            font-weight: 600 !important;
                        }
                    }
                }
                &.slider-center {
                    text-align: center;
                    .item-center {
                        .bg-area {
                            padding-bottom: 50vh;
                            background: transparent url("/assets/images/mobile/center/center_bg@2x.png") no-repeat;
                            background-size: cover;
                            .title {
                                text-align: center;
                                img {
                                    width: 80%;
                                    height: auto;
                                    margin: auto;
                                    padding-top: 4vh;
                                }
                            }
                            ul {
                                overflow: hidden;
                                li {
                                    margin-top: 20px;
                                    .sub-image {
                                        text-align: center;
                                        img {
                                            width: auto;
                                            margin: auto;
                                            transform: scale(0.8);
                                        }
                                    }
                                    .star img {
                                        width: 55px;
                                    }
                                    .sub-title {
                                        text-align: center;
                                        color: #fff;
                                        font-size: 16px;
                                        margin-bottom: 3vh;
                                        margin-top: 1.5vh;
                                    }
                                    .sub-text {
                                        text-align: left;
                                        color: #fff;
                                        font-size: 11px;
                                        line-height: 14px;
                                        opacity: 0.8;
                                        padding: 0 10vw;
                                    }
                                }
                            }
                        }
                        .nowon {
                            .center-header {
                                img {
                                    width: 100%;
                                }
                            }
                            .inner-box {
                                width: 70%;
                                margin: auto;
                            }
                            .center-content {
                                .title {
                                    color: #b94249;
                                    font-size: 17px;
                                    margin-bottom: 20px;
                                    margin-top: 2vh;
                                }
                                &.center-con1 {
                                    overflow: hidden;
                                    height: 100%;
                                    .text-box {
                                        img.main-img {
                                            width: 50vw;
                                            margin: auto;
                                            padding-left: 5vw;
                                        }
                                        padding: 0 2vh 8vh 0;
                                        background: transparent url("/assets/images/mobile/center/nowon_m_bg2.png")
                                            no-repeat;
                                        background-size: 100% 100%;
                                        .title {
                                            text-align: left;
                                        }
                                        p {
                                            text-align: left;
                                            font-size: 13px;
                                            margin-bottom: 5vh;
                                        }
                                        .text-img {
                                            width: 100%;
                                        }
                                    }
                                }
                                &.center-con2 {
                                    overflow: hidden;
                                    height: 100%;
                                    margin-bottom: 2vh;
                                    .text-box {
                                        img.main-img {
                                            width: 50vw;
                                            margin: auto;
                                            padding-left: 5vw;
                                        }
                                        padding: 2vh 2vh 8vh 0;
                                        background: transparent url("/assets/images/mobile/center/nowon_m_bg2.png")
                                            no-repeat;
                                        background-size: 100% 100%;
                                        .title {
                                            text-align: left;
                                        }
                                        p {
                                            text-align: left;
                                            font-size: 13px;
                                            margin-bottom: 5vh;
                                        }
                                        .text-img {
                                            width: 100%;
                                        }
                                    }
                                }
                            }
                        }
                        .daegu {
                            .center-header {
                                img {
                                    width: 100%;
                                }
                            }
                            .inner-box {
                                width: 70%;
                                margin: auto;
                            }
                            .center-content {
                                margin-top: 10px;
                                .title {
                                    color: #333;
                                    font-size: 14px;
                                    margin-bottom: 10px;
                                    margin-top: 2vh;
                                    font-weight: bold;
                                }
                                &.center-con1 {
                                    overflow: hidden;
                                    height: 100%;
                                    .text-box {
                                        img.main-img {
                                            width: 100vw;
                                            margin: auto;
                                        }
                                        padding: 0 2vh 8vh 0;
                                        background: transparent url("/assets/images/mobile/center/daegu/bg.jpg")
                                            no-repeat;
                                        background-size: 100% 100%;
                                        .title {
                                            text-align: left;
                                        }
                                        p {
                                            text-align: left;
                                            font-size: 13px;
                                            margin-bottom: 5vh;
                                            color: #333;
                                        }
                                        .text-img {
                                            width: 100%;
                                        }
                                    }
                                }
                                &.center-con2 {
                                    overflow: hidden;
                                    height: 100%;
                                    .text-box {
                                        img.main-img {
                                            width: 100vw;
                                            margin: auto;
                                        }
                                        padding: 2vh 2vh 8vh 0;
                                        background: transparent url("/assets/images/mobile/center/daegu/bg.jpg")
                                            no-repeat;
                                        background-size: 100% 100%;
                                        .title {
                                            text-align: left;
                                        }
                                        p {
                                            text-align: left;
                                            font-size: 13px;
                                            margin-bottom: 5vh;
                                            color: #333;
                                        }
                                        .text-img {
                                            width: 100%;
                                        }
                                    }
                                }
                            }
                        }
                    }
                    .item-teacher {
                        .teacher-menu-box {
                            text-align: center;
                            margin-top: 10px;
                            // margin-bottom: -7px;
                            padding-bottom: 250px;
                            // min-height: 300px;
                            .teacher-menu li {
                                cursor: pointer;
                                color: #666;
                                font-size: 11px;
                                float: left;
                                letter-spacing: -0.5px;
                                position: relative;
                                margin-left: 13px;
                                padding-bottom: 3px;
                                &.active {
                                    border-bottom: 2px solid #e31a4c;
                                    color: #e31a4c;
                                    font-weight: bold;
                                }
                                &:first-child {
                                    margin-left: 0;
                                    &:before {
                                        width: 0;
                                        height: 0;
                                    }
                                }
                                &:before {
                                    content: " ";
                                    border-radius: 50%;
                                    width: 3px;
                                    height: 3px;
                                    background: #666;
                                    display: inline-block;
                                    position: absolute;
                                    top: 38%;
                                    left: -7px;
                                }
                            }
                        }
                        .group-box {
                            border-top: 1px solid #ccc;
                            img {
                                width: 100%;
                            }
                        }
                    }
                    .item-institute .play-box {
                        padding: 0 5px;
                        margin-top: 1vh;
                        ul {
                            overflow: hidden;
                            margin: auto;
                            display: block;
                            li {
                                float: left;
                                width: 24%;
                                padding: 2px;
                                box-sizing: border-box;
                                margin-right: 1%;
                                &:last-child {
                                    margin-right: 0;
                                }
                                img {
                                    width: 100%;
                                    height: 100%;
                                }
                            }
                        }
                    }
                    .item-map {
                        background: #f4f4f4;
                        #map {
                            box-sizing: border-box;
                            margin: 3vh auto;
                            width: 86vw;
                            // height: 90vw;
                            height: 500px;
                            border: 1px solid #ccc;
                            // border: 2px solid #e42151;
                            // border-left: 0;
                            // border-right: 0;
                        }
                        .map-info {
                            width: 90vw;
                            margin: auto;
                            margin-bottom: 5vh;
                            .inner-box {
                                img {
                                    width: initial !important;
                                    display: inline-block;
                                }
                                .second-subway {
                                    margin-top: 10px;
                                    // margin-left: 72px;
                                    text-align: left;
                                    img {
                                        &:first-child {
                                            margin-right: 0;
                                        }
                                    }
                                }
                                .first-subway {
                                    display: inline-block;
                                    text-align: left;
                                    img {
                                        &:first-child {
                                            margin-right: 0;
                                            // vertical-align: middle !important;
                                        }
                                    }
                                }
                                .h400 {
                                    height: 400px;
                                    display: flex;
                                    align-items: center;
                                }
                                p {
                                    margin-bottom: 15px;
                                    text-align: left;
                                }

                                .text1 {
                                    color: #333;
                                    font-size: 15px;
                                    letter-spacing: -0.5px;
                                }
                                .text2 {
                                    color: #666;
                                    font-size: 13px;
                                    letter-spacing: -0.5px;
                                }
                                .text3 {
                                    color: #333;
                                    font-size: 14px;
                                    vertical-align: middle;
                                    a {
                                        color: #333;
                                        font-size: 14px;
                                        vertical-align: middle;
                                    }
                                    img {
                                        vertical-align: middle;
                                    }
                                }
                                .line {
                                    margin: 20px 0;
                                    height: 1px;
                                    border-top: 1px solid #ccc;
                                }
                                ul {
                                    width: 100%;
                                    li {
                                        text-align: left;
                                        text-align: left !important;
                                        margin-bottom: 15px;
                                        overflow: hidden;
                                        // display: flex;
                                        .fll {
                                            // flex: 1;
                                            width: 80px;
                                            img {
                                                height: 15px;
                                            }
                                        }
                                        .flr {
                                            // flex: 5;
                                            width: calc(100% - 80px);
                                            padding-left: 5px;
                                            box-sizing: border-box;
                                        }
                                        &:first-child {
                                            img {
                                                &:first-child {
                                                    vertical-align: sub;
                                                }
                                            }
                                            span {
                                                vertical-align: bottom;
                                                line-height: 20px;
                                            }
                                        }
                                        span.bold {
                                            display: inline-block;
                                            width: 50px;
                                        }
                                        span {
                                            color: #797979;
                                            font-size: 14px;
                                            // line-height: 24px;
                                            vertical-align: bottom;
                                            line-height: 19px;
                                        }
                                        img {
                                            // height: 20px;
                                            vertical-align: middle;
                                            &:first-child {
                                                // margin-right: 10px;
                                            }
                                        }
                                    }
                                }
                            }
                            // div {
                            //   text-align: center;
                            //   line-height: 18px;
                            //   dl {
                            //     width: 100%;
                            //     overflow: hidden;
                            //     clear: both;
                            //     display: inline-block;
                            //     dt {
                            //       font-weight: bold;
                            //       color: #797979;
                            //       width: 40px;
                            //       font-size: 12px;
                            //       text-align: right;
                            //       float: left;
                            //     }
                            //     dd {
                            //       width: 87%;
                            //       color: #797979;
                            //       font-size: 12px;
                            //       text-align: left;
                            //       padding-left: 10px;
                            //       float: right;
                            //       box-sizing: border-box;
                            //       a {
                            //         color: #797979;
                            //         font-size: 12px;
                            //       }
                            //     }
                            //   }
                            // }
                        }
                    }
                }
                &.slider-curriculum {
                    padding-bottom: 50px;
                    background: #fff;
                    .bg-area {
                        margin-top: 10px;
                        box-sizing: border-box;
                        // background: #FAFAFA url("/assets/images/mobile/curriculum/bg.png") no-repeat;
                        // background-size: cover;
                        text-align: center;
                        padding: 0px 0;
                        img {
                            width: 100%;
                            display: inline-block;
                        }
                    }
                    .fll {
                        width: 10px;
                    }
                    .fll-text {
                        width: calc(100% - 10px);
                        line-height: 22px;
                    }
                    .inner-box {
                        position: relative;
                        display: none;
                        .left {
                            position: absolute;
                            top: 0;
                            left: 0;
                        }
                        .right {
                            position: absolute;
                            top: 0;
                            right: 0;
                        }
                        .title-box {
                            // width: 668px;
                            width: 100%;
                            height: 271px;
                            margin: auto;
                            display: table;
                            .title-bar {
                                display: table-cell;
                                vertical-align: middle;
                                position: absolute;
                                top: 70px;
                                width: 100%;
                                .title {
                                    text-align: center;
                                    background: $color;
                                    color: #fff;
                                    font-size: 25px;
                                    font-weight: bold;
                                    padding: 2px 0;
                                    margin-bottom: 10px;
                                }
                                ul {
                                    width: 100%;
                                    li {
                                        padding-bottom: 10px;
                                        padding-left: 15px;
                                        font-size: 15px;
                                        line-height: 20px;
                                        color: #404040;
                                        // border-bottom: 1px solid #0b0209;
                                        &:last-child {
                                            border-bottom: none;
                                        }
                                    }
                                    border-bottom: 1px solid $color;
                                    padding-bottom: 10px;
                                }
                            }
                        }
                    }
                    .inner-box2 {
                        padding: 0 15px;
                        .row {
                            overflow: hidden;
                            border-bottom: 1px solid #d0d0d0;
                            padding: 20px 0;
                            &:last-child {
                                border-bottom: none;
                                margin-bottom: 50px;
                            }
                            .left {
                                text-align: left;
                                vertical-align: top;
                                .title {
                                    font-size: 2em;
                                    color: #555;
                                    margin-bottom: 10px;
                                    font-weight: bold;
                                }
                                span.diploma {
                                    margin-bottom: 20px;
                                    display: inline-block;
                                    img {
                                        width: initial !important;
                                        display: inline-block;
                                        margin-right: 5px;
                                        vertical-align: middle;
                                    }
                                    span {
                                        color: #e32c56;
                                        font-size: 13px;
                                        border-bottom: 1px solid #e32c56;
                                        padding-bottom: 3px;
                                        display: inline-block;
                                        margin-right: 5px;
                                    }
                                }
                            }
                            .right {
                                .title {
                                    display: inline-block;
                                    font-size: 22px;
                                    font-weight: bold;
                                    margin-right: 5px;
                                    margin-bottom: 5px;
                                    color: $color;
                                }
                                > img {
                                    vertical-align: top;
                                    margin-top: 2px;
                                    &:hover {
                                        transition: all 0.3s;
                                        opacity: 0.8;
                                    }
                                }
                                ul {
                                    overflow: hidden;
                                    li {
                                        padding: 2px 0;
                                        font-size: 14px;
                                        line-height: 20px;
                                        letter-spacing: -0.5px;
                                        color: #404040;
                                        overflow: hidden;
                                    }
                                }
                                .footer-buttons {
                                    margin-top: 10px;
                                    img {
                                        width: 200px;
                                        display: inline-block;
                                    }
                                }
                                .footer {
                                    margin-top: 20px;
                                    .curr-table {
                                        overflow: hidden;
                                        margin-bottom: 20px;
                                        border-spacing: 0;
                                        tr:last-child {
                                            .vertical-line {
                                                display: none;
                                            }
                                        }
                                        td {
                                            overflow: hidden;
                                            border-spacing: 0;
                                            vertical-align: top;
                                            position: relative;
                                            color: #666;
                                            letter-spacing: -0.5px;
                                            // font-size: 13px;
                                            &.specific {
                                                padding-right: 20px;
                                            }
                                            .vertical-line {
                                                width: 1px;
                                                height: 64%;
                                                border-right: 1px solid #ccc;
                                                position: absolute;
                                                left: 50%;
                                                top: 24px;
                                            }
                                            .bold {
                                                color: #333;
                                                margin-right: 20px;
                                                vertical-align: top;
                                                display: table-cell;
                                            }
                                            &:first-child {
                                                font-size: 12px;
                                                width: 72px;
                                                text-align: right;
                                            }
                                            .text-month {
                                                width: 45px;
                                                height: 25px;
                                                color: #333;
                                                font-size: 12px;
                                                display: inline-block;
                                                text-align: center;
                                            }
                                            ul {
                                                li {
                                                    color: #666;
                                                    font-size: 13px;
                                                    padding: 0;
                                                    margin-bottom: 3px;
                                                }
                                            }
                                        }
                                    }
                                    .footer-buttons {
                                        margin-top: 10px;
                                        img {
                                            width: 200px;
                                            display: inline-block;
                                        }
                                    }
                                    .footer-head {
                                        color: #666;
                                        font-size: 12px;
                                        margin-right: 4px;
                                        margin-bottom: 15px;
                                        .bold {
                                            color: #333;
                                            font-size: 12px;
                                            margin-right: 20px;
                                            vertical-align: top;
                                        }
                                    }
                                }
                            }
                        }
                    }
                    .permanent-page {
                        .footer {
                            margin-top: 20px;
                            .footer-buttons {
                                margin-top: 10px;
                                img {
                                    width: 200px;
                                    display: inline-block;
                                }
                            }
                            .footer-head {
                                color: #666;
                                font-size: 12px;
                                margin-right: 4px;
                                margin-bottom: 15px;
                                .bold {
                                    color: #333;
                                    font-size: 12px;
                                    margin-right: 20px;
                                    vertical-align: top;
                                }
                            }
                        }
                        .curr-table {
                            overflow: hidden;
                            margin-bottom: 20px !important;
                            margin: auto;
                            border-spacing: 0;
                            width: 100%;
                            tr:last-child {
                                .vertical-line {
                                    display: none;
                                }
                            }
                            td {
                                overflow: hidden;
                                border-spacing: 0;
                                vertical-align: top;
                                position: relative;
                                color: #666;
                                letter-spacing: -0.5px;
                                // font-size: 13px;
                                &.specific {
                                    padding-right: 0px;
                                }
                                .vertical-line {
                                    width: 1px;
                                    height: 64%;
                                    border-right: 1px solid #ccc;
                                    position: absolute;
                                    left: 50%;
                                    top: 24px;
                                }
                                .bold {
                                    color: #333;
                                    margin-right: 20px;
                                    vertical-align: top;
                                    display: table-cell;
                                }
                                &:first-child {
                                    font-size: 12px;
                                    width: 72px;
                                    text-align: right;
                                }
                                .text-month {
                                    width: 45px;
                                    height: 25px;
                                    color: #333;
                                    font-size: 12px;
                                    display: inline-block;
                                    text-align: center;
                                }
                                ul {
                                    li {
                                        color: #666;
                                        font-size: 13px;
                                        padding: 0;
                                        margin-bottom: 3px;
                                    }
                                }
                                .task-th {
                                    display: inline-block !important;
                                    padding-right: 10px !important;
                                    font-size: 13px !important;
                                    margin-right: 0 !important;
                                }
                            }
                        }
                        .sub-text {
                            margin-bottom: 20px;
                        }
                        .main-text {
                            font-size: 14px;
                            color: #333;
                            margin: auto;
                            width: 90%;
                            letter-spacing: -0.5px;
                        }
                        img.collabo-img {
                            vertical-align: sub;
                            margin: 0 2px;
                            width: 19px;
                            display: inline-block;
                        }
                        .footer-buttons {
                            margin-top: 10px;
                            span.span-button {
                                display: inline-block;
                                width: 300px;
                                padding: 10px;
                                border: 1px solid #333;
                                color: #333;
                                font-size: 14px;
                            }
                        }
                        .task {
                            text-align: center;
                            .task1 {
                                // font-size: 12px;
                                // font-weight: 600;
                                color: #333;
                                font-size: 14px;
                                display: inline-block;
                                margin-right: 7px;
                                font-weight: bold;
                            }
                            .task2 {
                                // font-size: 12px;
                                // font-weight: 400;
                                font-size: 14px;
                                color: #666;
                            }
                        }
                        .collabo {
                            display: block;
                            width: 100%;
                            overflow: hidden;
                            li {
                                float: left;
                                width: 33.333%;
                                box-sizing: border-box;
                                padding: 20px;
                                border-right: 1px solid #eee;
                                text-align: center;
                                &:last-child {
                                    border: none;
                                }
                                img {
                                    margin-bottom: 5px;
                                }
                                p {
                                    text-align: center;
                                    font-weight: bold;
                                }
                            }
                        }
                        .teachers {
                            li {
                                float: left;
                                width: 33.333%;
                                box-sizing: border-box;
                                padding: 0px 5px;
                                text-align: center;
                                &:nth-child(1),
                                &:nth-child(2),
                                &:nth-child(3) {
                                    padding-top: 20px;
                                    padding-bottom: 20px;
                                }
                                .teacher-box {
                                    // height: 270px;
                                }
                                img {
                                    display: inline-block;
                                    width: 90%;
                                    margin-bottom: 10px;
                                }
                                div {
                                    text-align: center;
                                }
                                .text1 {
                                    font-size: 13px;
                                    font-weight: bold;
                                    color: #333;
                                }
                                .text2 {
                                    color: #333;
                                    font-weight: bold;
                                    font-size: 12px;
                                }
                                .text3 {
                                    font-size: 11px;
                                    margin-bottom: 3px;
                                    color: #666;
                                    font-weight: 400;
                                }
                                .text4 {
                                    font-size: 11px;
                                    font-weight: 400;
                                    background: #7c4e99;
                                    padding: 3px 5px;
                                    color: #fff;
                                    display: inline-block;
                                    // display: none;
                                }
                            }
                        }
                        .line {
                            height: 1px;
                            border-top: 1px solid #ccc;
                            margin: 30px 0;
                        }
                        .sub-title0 {
                            font-size: 22px;
                            letter-spacing: -0.5px;
                            font-weight: 600;
                            color: #7c4e99;
                            text-align: center;
                            margin-bottom: 10px;
                        }
                        .sub-title {
                            font-size: 18px;
                            letter-spacing: -0.5px;
                            font-weight: 600;
                            color: #7c4e99;
                            text-align: center;
                            margin-bottom: 10px;
                        }
                        p {
                            text-align: center;
                            // font-size: 13px;
                            margin-bottom: 10px;
                            color: #333;
                            font-size: 14px;
                            letter-spacing: -0.5px;
                        }
                        .owl-box {
                            .current-image {
                                img {
                                    width: 100%;
                                    display: block;
                                    margin-bottom: 5px;
                                }
                            }
                        }
                        .inner-container {
                            width: 90%;
                            margin: auto;
                        }
                        .bg-area {
                            margin-top: 10px;
                            box-sizing: border-box;
                            background-size: cover;
                            text-align: center;
                            padding: 10px 0;
                            img {
                                width: 100%;
                            }
                        }
                        .img-box {
                            margin-bottom: 15px;
                            img {
                                width: 200px;
                                @media screen and (max-width: 1300px) {
                                    width: 150px;
                                }
                            }
                        }
                        .owl-box {
                            .institutute-img {
                                img {
                                    width: 33.3333%;
                                    box-sizing: border-box;
                                    float: left;
                                    cursor: pointer;
                                    border: 2px solid transparent;
                                    transition: all 0.3s;
                                    min-height: 0;
                                    &.active {
                                        border: 2px solid #e31a4c;
                                    }
                                    &:hover {
                                        opacity: 0.8;
                                        transition: all 0.3s;
                                    }
                                }
                            }
                        }
                        .item {
                        }
                        .nav-icon {
                            z-index: 10;
                            position: absolute;
                            top: -250px;
                            cursor: pointer;
                            //background: rgba(0,0,0,0.7);
                            transition: all 0.3s;
                            &:hover {
                                opacity: 0.7;
                                transition: all 0.3;
                            }
                            @media screen and (max-width: 1300px) {
                                height: 75px;
                            }
                        }
                        .prev-main {
                            left: -10%;
                            width: 40px;
                        }
                        .next-main {
                            right: -10%;
                            width: 40px;
                        }
                    }
                }
                &.slider-career {
                    .banner-box {
                        margin-top: 50px;
                        margin-bottom: 50px;
                    }
                    ul {
                        display: block;
                        width: 90%;
                        margin: auto;
                        li {
                            margin-bottom: 30px;
                            .title-box {
                                border-bottom: 1px solid #e31a4c;
                                margin-bottom: 5px;
                                line-height: 26px;
                                text-align: left;
                                .number-box {
                                    background: #e31a4c;
                                    border-radius: 0 4px 0 4px;
                                    padding: 2px;
                                    font-weight: bold;
                                    color: #fff;
                                    font-size: 16px;
                                }
                                .title {
                                    font-size: 16px;
                                    font-weight: bold;
                                    color: #e31a4c;
                                    padding-left: 7px;
                                }
                            }
                            .content-box {
                                text-align: left;
                                padding-left: 35px;
                                font-size: 13px;
                                line-height: 17px;
                            }
                        }
                    }
                }
                &.slider-community {
                    .hotissue-type-box {
                        text-align: right;
                        .hotissue-type {
                            display: inline-block;
                            overflow: hidden;
                            li {
                                float: left;
                                padding: 20px 10px;
                                &:nth-child(2) {
                                    padding: 20px 5px;
                                }
                                a {
                                    font-size: 14px;
                                    font-weight: 400;
                                    color: #666;
                                    &.active {
                                        font-weight: bold;
                                        color: #111;
                                    }
                                }
                            }
                        }
                    }
                }
                &.slider-community .community-list {
                    position: relative;
                    overflow: hidden;
                    // .row {
                    //   height: 120px;
                    //   box-sizing: border-box;
                    //   width: 90%;
                    //   margin: 10px auto;
                    //   &:last-child .right {
                    //     background: none;
                    //   }
                    //   .left {
                    //     float: left;
                    //     width: 19%;
                    //     position: relative;
                    //     z-index: 10;
                    //     .date {
                    //       font-size: 19px;
                    //       font-weight: lighter;
                    //       letter-spacing: -1px;
                    //       line-height: 20px;
                    //     }
                    //     .day {
                    //       font-size: 10px;
                    //     }
                    //     .dot {
                    //       position: absolute;
                    //       right: -8px;
                    //       top: 2px;
                    //       width: 15px;
                    //       height: 15px;
                    //     }
                    //   }
                    //   .right {
                    //     padding-left: 15px;
                    //     box-sizing: border-box;
                    //     float: right;
                    //     width: 81%;
                    //     background: url("/assets/images/front/community/border.png") no-repeat;
                    //     background-position: 0 100%;
                    //     height: 100%;
                    //     &:before {
                    //       content: "";
                    //       position: absolute;
                    //       top: 15px;
                    //       height: calc(100% - 32px);
                    //       width: 100%;
                    //       display: block;
                    //       box-sizing: border-box;
                    //       background: url(/assets/images/front/community/border_bg.png) repeat-y;
                    //       background-position: right !important;
                    //       left: -77.7% !important;
                    //     }
                    //     .text-area {
                    //       width: 55%;
                    //       float: left;
                    //       box-sizing: border-box;
                    //       .cat {
                    //         color: #e31a4c;
                    //         margin-bottom: 5px;
                    //         font-size: 13px;
                    //         font-weight: bold;
                    //       }
                    //       .title {
                    //         font-size: 12px;
                    //         margin-bottom: 10px;
                    //         line-height: 16px;
                    //       }
                    //       .detail-button {
                    //         cursor: pointer;
                    //         width: 50%;
                    //         max-width: 150px;
                    //       }
                    //     }
                    //     .img-area {
                    //       width: 45%;
                    //       float: right;
                    //       box-sizing: border-box;
                    //       img {
                    //         width: 100%;
                    //         max-width: 233px;
                    //         max-height: 105px;
                    //       }
                    //     }
                    //   }
                    // }
                    .row {
                        padding-top: 10px;
                        .con-box {
                            box-sizing: border-box;
                            width: 49.5%;
                            display: inline-block;
                            padding: 0 10px;
                            &:last-child {
                                .right {
                                    // background:none;
                                }
                            }
                            img {
                                display: block;
                                width: 100%;
                            }
                            .relative {
                                position: relative;
                                height: 180px;
                                width: 100%;
                                background-size: cover !important;
                                .infobox {
                                    //artistcrew only
                                    position: absolute;
                                    bottom: 0;
                                    width: 100%;
                                    background: rgba(0, 0, 0, 0.7);
                                    padding: 10px;
                                    box-sizing: border-box;
                                    .info1 {
                                        color: #fff;
                                        font-size: 14px;
                                        margin-bottom: 7px;
                                    }

                                    .info2 {
                                        color: #ccc;
                                        font-size: 11px;
                                        line-height: 18px;
                                        height: 18px;
                                        overflow: hidden;
                                    }
                                    .info3 {
                                        color: #ccc;
                                        font-size: 11px;
                                        line-height: 18px;
                                    }
                                    .area {
                                        position: absolute;
                                        bottom: 7px;
                                        right: 7px;
                                        font-size: 11px;
                                        color: #fff;
                                    }
                                }
                            }
                            .headings {
                                margin: 10px 0 10px 0;
                                overflow: hidden;
                                .date {
                                    font-size: 14px;
                                    font-weight: lighter;
                                    letter-spacing: -1px;
                                    text-align: center;
                                    float: right;
                                    color: #ccc;
                                }
                                .cat {
                                    color: $color;
                                    font-size: 15px;
                                    float: left;
                                    font-weight: lighter;
                                }
                            }
                            .title {
                                clear: both;
                                overflow: hidden;
                                font-size: 15px;
                                line-height: 22px;
                                height: 100px;
                                text-align: left;
                            }
                        }
                    }
                }
                &.slider-wannabe {
                    .item-tCenter,
                    .item-center {
                        background: #fff;
                        .center-info {
                            img {
                                // width: initial;
                            }
                            .title-img {
                                width: 200px !important;
                                display: inline-block;
                            }
                            .center-img {
                                width: 100%;
                                height: 300px;
                                background-size: cover !important;
                                display: inline-block;
                                box-sizing: border-box;
                                &:hover {
                                    border: 4px solid #e11a4d;
                                }
                            }
                            .enlarge-img {
                                display: inline-block;
                                vertical-align: top;
                                img {
                                    width: 19px;
                                    vertical-align: top;
                                    margin-left: 10px;
                                    margin-top: 4px;
                                }
                            }
                            .inner-box {
                                width: 90%;
                                margin: auto;
                                ul {
                                    margin-top: 10px;
                                    margin-bottom: 20px;
                                    li {
                                        margin-bottom: 5px;
                                    }
                                }
                            }
                        }
                    }
                    .item-branch {
                        .branch-content {
                            .ask-business {
                                border-top: 1px solid #eee;
                                margin: 0 20px;
                                margin-top: 20px;
                                padding-top: 20px;
                                text-align: left;
                                .row1 {
                                    text-align: left;
                                    img {
                                        width: 15px;
                                        vertical-align: middle;
                                        display: inline-block;
                                    }
                                    span.text1 {
                                        font-weight: bold;
                                        vertical-align: middle;
                                        color: #24547a;
                                        font-size: 13px;
                                    }
                                }
                                p.text2 {
                                    text-align: left;
                                    a {
                                        font-weight: bold;
                                        color: #505050 !important;
                                        font-size: 20px;
                                        span {
                                            font-size: 11px;
                                            color: #fff;
                                            border-radius: 30px;
                                            background: #000;
                                            padding: 2px 6px;
                                            display: inline-block;
                                            letter-spacing: -0.5px;
                                            margin-left: 7px;
                                            vertical-align: text-top;
                                        }
                                    }
                                    margin: 4px 0;
                                }
                                p.text3 {
                                    text-align: left;
                                    color: #969a9b;
                                    font-size: 12px;
                                }
                                .abs-button {
                                    margin-top: 10px;
                                    a {
                                        text-align: center;
                                        display: block;
                                        border: 1px solid #555;
                                        border-radius: 4px;
                                        padding: 7px;
                                        width: 50%;
                                    }
                                    img {
                                        display: inline-block;
                                        height: 17px;
                                        width: initial !important;
                                        vertical-align: middle;
                                    }
                                    span {
                                        margin-left: 3px;
                                        display: inline-block;
                                        font-size: 14px;
                                        font-weight: bold;
                                        color: #000;
                                        vertical-align: middle;
                                    }
                                }
                            }
                            .text {
                                font-size: 12px;
                                line-height: 20px;
                                color: #555;
                            }
                            .colored {
                                color: #174360 !important;
                            }
                            strong {
                                font-weight: normal !important;
                            }
                            .bg-bold {
                                background: #f0f0f0 !important;
                            }

                            .first-row {
                                overflow: hidden;
                                clear: both;
                                position: relative;
                                padding-bottom: 40px;
                                .left {
                                    padding: 40px 20px;
                                    box-sizing: border-box;
                                    text-align: left;
                                    .main-label {
                                        margin-bottom: 15px;
                                        color: #194866;
                                        font-size: 13px;
                                        border-top: 2px solid #194866;
                                        border-bottom: 2px solid #194866;
                                        padding: 3px 15px;
                                        display: inline-block;
                                        font-weight: bold;
                                    }
                                    .main-title {
                                        margin-bottom: 15px;
                                        color: #224e6b;
                                        font-size: 23px;
                                        letter-spacing: -1px;
                                        line-height: 30px;
                                        text-align: right;
                                        strong {
                                            font-size: 28px;
                                            font-weight: bold !important;
                                        }
                                    }
                                    .colored {
                                        font-size: 13px;
                                        // margin-top: 10px;
                                    }
                                }
                                .right {
                                    position: absolute;
                                    right: 10px;
                                    top: 0;
                                    width: 40%;
                                }
                            }

                            .second-row {
                                overflow: hidden;
                                clear: both;
                                position: relative;
                                background-image: url("/assets/images/front/business/20200220/erpm.png") !important;
                                background-position: 100% 100% !important;
                                background-size: 50% !important;
                                background-repeat: no-repeat !important;
                                background-color: #e7f0f9 !important;
                                padding-bottom: 10vw;
                                .left {
                                    position: absolute;
                                    left: 5%;
                                    bottom: 0;
                                    width: 90%;
                                }
                                .right {
                                    padding: 40px 20px;
                                    // padding-bottom: 70vw;

                                    .sub-title {
                                        font-size: 20px;
                                        font-weight: bold;
                                        text-align: center;
                                        letter-spacing: -1px;
                                    }

                                    .title-text {
                                        font-size: 12px;
                                        color: #333;
                                        margin: 20px 0 0px 0;
                                    }

                                    .text {
                                        // line-height: 32px;
                                    }
                                }
                            }

                            .third-row {
                                padding: 40px 20px;
                                .sub-title {
                                    font-size: 20px;
                                    font-weight: bold;
                                    text-align: center;
                                    letter-spacing: -1px;
                                }

                                .title-text {
                                    font-size: 12px;
                                    color: #333;
                                    margin: 20px 0 0px 0;
                                }

                                .text {
                                    // line-height: 27px;
                                }
                            }

                            .fourth-row {
                                padding: 40px 20px;
                                background-color: #e7f0f9 !important;
                                .sub-title {
                                    font-size: 20px;
                                    font-weight: bold;
                                    margin-bottom: 15px;
                                    text-align: center;
                                }
                                .title-text {
                                    font-size: 14px;
                                    color: #333;
                                    padding: 0px 0 20px 0;

                                    border-bottom: 1px solid #ccc;
                                    margin-bottom: 20px;
                                    text-align: center;
                                }
                                .text {
                                    // line-height: 27px;
                                }
                                .issue-box {
                                    .row {
                                        clear: both;
                                        overflow: hidden;
                                        text-align: center;
                                        .fll {
                                            text-align: left;
                                        }
                                        .issue {
                                            width: 50px;
                                            display: inline-block;
                                            text-align: center;
                                        }
                                        .title {
                                            // color: #3f5f77;
                                            color: #333;
                                            margin-bottom: 10px;
                                            font-size: 23px;
                                            text-align: center;
                                            font-weight: bold;
                                        }
                                        .text {
                                            text-align: left;
                                        }
                                    }
                                }
                            }

                            .bg-bold {
                                background: #f0f0f0;
                            }
                            margin-top: 0px;
                            > .row {
                                overflow: hidden;
                                margin-top: 50px;
                                &:last-child {
                                    .right {
                                        background: none;
                                    }
                                }
                                > .left {
                                    float: left;
                                    width: 20%;
                                    box-sizing: border-box;
                                }
                                > .right {
                                    padding-bottom: 50px;
                                    padding-left: 20px;
                                    text-align: left;
                                    box-sizing: border-box;
                                    float: right;
                                    width: 80%;
                                    background: url("/assets/images/front/business/border.png") no-repeat;
                                    background-position: 0 100%;
                                    .title {
                                        color: $color;
                                        font-size: 20px;
                                        font-weight: bold;
                                        margin-bottom: 10px;
                                        letter-spacing: -1px;
                                    }
                                    .sub-title {
                                        color: #b4b4b4;
                                        font-size: 15px;
                                    }
                                }
                            }
                            .button-area {
                                margin-top: 70px;
                            }
                        }
                        .button-area {
                            margin-top: 30px;
                            img {
                                margin: auto;
                                width: 150px;
                            }
                        }
                    }
                    .item-tBi,
                    .item-bi {
                        background: #fff;
                        .bi-info {
                            .section {
                                padding: 30px 20px;
                                text-align: center;
                                .title {
                                    margin-bottom: 15px;
                                    text-align: left;
                                    img {
                                        width: initial;
                                    }
                                }
                                .content {
                                    text-align: center;
                                    p {
                                        text-align: left;
                                    }
                                    img {
                                        display: inline-block;
                                        margin-top: 20px;
                                        // width: 100%;
                                    }
                                }
                            }
                        }
                    }
                    .item-wAcademy {
                        .leejua-page {
                            .intro-box {
                                // padding: 35px 25px;
                                position: relative;
                                // background: #463111ab;
                                .intro-inner {
                                    position: absolute;
                                    right: 20px;
                                    bottom: 10%;
                                    img {
                                        width: 30%;
                                        float: right;
                                        clear: right;
                                    }
                                }
                                .text-4 {
                                    text-align: right;
                                    // color: #ffe1b4;
                                    font-size: 12px;
                                    letter-spacing: -1px;
                                    font-weight: bold;
                                    margin-bottom: 15px;
                                    overflow: hidden;
                                }
                                .text-white {
                                    text-align: right;
                                    font-size: 12px;
                                    letter-spacing: -1px;
                                    // color: #fff;
                                    // margin: 15px 0 10px 0;
                                    color: #333;
                                }
                                .text-gray {
                                    margin-top: 7px;
                                    text-align: right;
                                    font-size: 12px;
                                    letter-spacing: -1px;
                                    // color: #bcb7af;
                                }
                            }
                            .content-box {
                                margin: 50px 30px;
                                margin-bottom: 20px;
                                .dash {
                                    position: relative;
                                    &::after {
                                        position: absolute;
                                        font-weight: 900;
                                        left: 0px;
                                        top: 10px;
                                        content: "ㅡ";
                                        font-size: 20px;
                                        color: rgb(196, 162, 115);
                                    }
                                }
                                .text-1 {
                                    color: #9d783f;
                                    padding: 25px 0;
                                    font-weight: 300;
                                    // font-size: 16px;
                                    font-size: 14px;
                                    letter-spacing: -1px;
                                    .larger {
                                        margin-top: 15px;
                                        font-size: 18px;
                                    }
                                }
                                .text-2 {
                                    font-weight: 300;
                                    padding: 25px 0;
                                    color: #4c4b49;
                                    font-size: 16px;
                                    letter-spacing: -1px;
                                }
                                .text-3 {
                                    color: #9d783f;
                                    font-size: 24px;
                                    font-weight: 200;
                                    strong {
                                        font-weight: 700;
                                    }
                                    img {
                                        width: 100%;
                                    }
                                }
                                ul {
                                    li {
                                        display: flex;
                                        justify-content: space-between;
                                        align-items: center;
                                        border-bottom: 1px solid #d8ccb9;
                                        padding: 15px 0;
                                        font-size: 14px;
                                        letter-spacing: -1px;
                                        // &:last-child {
                                        //     border-bottom: 0;
                                        // }
                                        img {
                                            width: 35px;
                                        }
                                        p {
                                            width: 300px;
                                            color: #4c4b49;
                                            padding-left: 20px;
                                            font-size: 15px;
                                            line-height: 22px;
                                        }
                                    }
                                }
                            }
                            // position: relative;
                            // .main-img {
                            //     position: absolute;
                            //     height: 100vh;
                            //     top: 0;
                            //     left: 0;
                            // }
                        }
                        .bg-area {
                            margin-top: 10px;
                        }
                        .row-1 {
                            background: transparent url("/assets/images/mobile/wannabe/bg1.png") no-repeat;
                            background-size: cover;
                            padding-bottom: 20px;
                            .content {
                                margin-top: 214px;
                            }
                        }
                        .row-2 {
                            background: transparent url("/assets/images/mobile/wannabe/bg2.png") no-repeat;
                            background-size: cover;
                            padding-bottom: 20px;
                            .content {
                                margin-top: 262px;
                            }
                        }
                        .row-3 {
                            background: transparent url("/assets/images/mobile/wannabe/bg3.png") no-repeat;
                            background-size: cover;
                            padding-bottom: 20px;
                            .content {
                                margin-top: 242px;
                                color: #fff;
                            }
                        }
                        .content {
                            width: 90%;
                            margin: auto;
                            line-height: 15px;
                            font-size: 11px;
                        }
                        .ci {
                            text-align: center;
                            margin: auto;
                            padding-top: 30px;
                            background: #fff;
                            img {
                                width: 80%;
                                margin: auto;
                            }
                            .ci-text {
                                font-size: 11px;
                                line-height: 15px;
                                margin-top: 20px;
                                background: #efefef;
                                padding: 15px 5%;
                                text-align: left;
                                .primary-color {
                                    color: #e31a4c;
                                }
                            }
                        }
                    }
                    .item-cafe {
                        .row {
                            width: 90%;
                            margin: auto;
                            margin-top: 30px;
                            img {
                                width: 80px;
                                margin: auto;
                            }
                            .title {
                                text-align: center;
                                color: #e31a4c;
                                margin-top: 10px;
                                margin-bottom: 5px;
                                font-size: 13px;
                                font-weight: bold;
                            }
                            .text {
                                text-align: center;
                                font-size: 12px;
                                line-height: 18px;
                            }
                        }
                        .img-box {
                            overflow: hidden;
                            margin-bottom: 30px;
                            margin-top: 30px;
                            img {
                                width: 100%;
                            }
                        }
                    }
                    .item-collabo .community-list {
                        position: relative;
                        overflow: hidden;
                        // .row {
                        //   height: 120px;
                        //   box-sizing: border-box;
                        //   width: 90%;
                        //   margin: 10px auto;
                        //   &:last-child .right {
                        //     background: none;
                        //   }
                        //   .left {
                        //     float: left;
                        //     width: 19%;
                        //     position: relative;
                        //     z-index: 10;
                        //     .date {
                        //       font-size: 19px;
                        //       font-weight: lighter;
                        //       letter-spacing: -1px;
                        //       line-height: 20px;
                        //     }
                        //     .day {
                        //       font-size: 10px;
                        //     }
                        //     .dot {
                        //       position: absolute;
                        //       right: -8px;
                        //       top: 2px;
                        //       width: 15px;
                        //       height: 15px;
                        //     }
                        //   }
                        //   .right {
                        //     padding-left: 15px;
                        //     box-sizing: border-box;
                        //     float: right;
                        //     width: 81%;
                        //     background: url("/assets/images/front/community/border.png") no-repeat;
                        //     background-position: 0 100%;
                        //     height: 100%;
                        //     &:before {
                        //       content: "";
                        //       position: absolute;
                        //       top: 15px;
                        //       height: calc(100% - 32px);
                        //       width: 100%;
                        //       display: block;
                        //       box-sizing: border-box;
                        //       background: url(/assets/images/front/community/border_bg.png) repeat-y;
                        //       background-position: right !important;
                        //       left: -77.7% !important;
                        //     }
                        //     .text-area {
                        //       width: 55%;
                        //       float: left;
                        //       box-sizing: border-box;
                        //       .cat {
                        //         color: #e31a4c;
                        //         margin-bottom: 5px;
                        //         font-size: 13px;
                        //         font-weight: bold;
                        //       }
                        //       .title {
                        //         font-size: 12px;
                        //         margin-bottom: 10px;
                        //         line-height: 16px;
                        //       }
                        //       .detail-button {
                        //         cursor: pointer;
                        //         width: 50%;
                        //         max-width: 150px;
                        //       }
                        //     }
                        //     .img-area {
                        //       width: 45%;
                        //       float: right;
                        //       box-sizing: border-box;
                        //       img {
                        //         width: 100%;
                        //         max-width: 233px;
                        //         max-height: 105px;
                        //       }
                        //     }
                        //   }
                        // }
                        .row {
                            padding-top: 10px;
                            .con-box {
                                box-sizing: border-box;
                                width: 49.5%;
                                display: inline-block;
                                padding: 0 10px;
                                &:last-child {
                                    .right {
                                        // background:none;
                                    }
                                }
                                img {
                                    display: block;
                                    width: 100%;
                                }
                                .headings {
                                    margin: 10px 0 10px 0;
                                    overflow: hidden;
                                    .date {
                                        font-size: 14px;
                                        font-weight: lighter;
                                        letter-spacing: -1px;
                                        text-align: center;
                                        float: right;
                                        color: #ccc;
                                    }
                                    .cat {
                                        color: $color;
                                        font-size: 15px;
                                        float: left;
                                        font-weight: lighter;
                                    }
                                }
                                .title {
                                    clear: both;
                                    overflow: hidden;
                                    font-size: 15px;
                                    line-height: 22px;
                                    height: 100px;
                                    text-align: left;
                                }
                            }
                        }
                    }
                    .item-history {
                        .each-month {
                            margin-bottom: 15px;
                            .month {
                                color: #e01c4c;
                                // font-weight: bold;
                                letter-spacing: -0.5px;
                                font-size: 14px;
                                display: inline-block;
                                vertical-align: text-top;
                            }
                            .icon-box {
                                display: inline-block;
                                width: 15px;
                                vertical-align: sub;
                                .icon {
                                    vertical-align: bottom;
                                    width: 15px;
                                    display: inline-block !important;
                                }
                            }
                            .text {
                                display: inline-block;
                                vertical-align: text-top;
                                line-height: 22px;
                                letter-spacing: -0.5px;
                                max-width: 250px;
                                font-size: 13px;
                            }
                        }

                        .right-half {
                            box-sizing: border-box;
                            border-left: 1px solid #ccc;
                            padding-left: 20px;
                            width: 90%;
                            margin: auto;
                            padding-top: 1px;
                            margin-top: 30px;
                            .year {
                                img {
                                    left: -30px;
                                    width: 20px;
                                }
                            }
                            .each-month {
                                .month {
                                    padding-right: 10px;
                                }
                            }
                        }

                        .year {
                            position: relative;
                            font-size: 25px;
                            font-weight: bold;
                            color: #e01c4c;
                            margin-bottom: 20px;
                            margin-top: -11px;
                            img {
                                top: 10px;
                                width: 25px;
                                position: absolute;
                            }
                        }
                    }
                }
                &.slider-business {
                    .item-branch {
                        .branch-content {
                            .ask-business {
                                border-top: 1px solid #eee;
                                margin: 0 20px;
                                margin-top: 20px;
                                padding-top: 20px;
                                text-align: left;
                                .row1 {
                                    text-align: left;
                                    img {
                                        width: 15px;
                                        vertical-align: middle;
                                        display: inline-block;
                                    }
                                    span.text1 {
                                        font-weight: bold;
                                        vertical-align: middle;
                                        color: #24547a;
                                        font-size: 13px;
                                    }
                                }
                                p.text2 {
                                    text-align: left;
                                    a {
                                        font-weight: bold;
                                        color: #505050 !important;
                                        font-size: 20px;
                                        span {
                                            font-size: 11px;
                                            color: #fff;
                                            border-radius: 30px;
                                            background: #000;
                                            padding: 2px 6px;
                                            display: inline-block;
                                            letter-spacing: -0.5px;
                                            margin-left: 7px;
                                            vertical-align: text-top;
                                        }
                                    }
                                    margin: 4px 0;
                                }
                                p.text3 {
                                    text-align: left;
                                    color: #969a9b;
                                    font-size: 12px;
                                }
                                .abs-button {
                                    margin-top: 10px;
                                    a {
                                        text-align: center;
                                        display: block;
                                        border: 1px solid #555;
                                        border-radius: 4px;
                                        padding: 7px;
                                        width: 50%;
                                    }
                                    img {
                                        display: inline-block;
                                        height: 17px;
                                        width: initial !important;
                                        vertical-align: middle;
                                    }
                                    span {
                                        margin-left: 3px;
                                        display: inline-block;
                                        font-size: 14px;
                                        font-weight: bold;
                                        color: #000;
                                        vertical-align: middle;
                                    }
                                }
                            }
                            .text {
                                font-size: 12px;
                                line-height: 20px;
                                color: #555;
                            }
                            .colored {
                                color: #174360 !important;
                            }
                            strong {
                                font-weight: normal !important;
                            }
                            .bg-bold {
                                background: #f0f0f0 !important;
                            }

                            .first-row {
                                overflow: hidden;
                                clear: both;
                                position: relative;
                                padding-bottom: 40px;
                                .left {
                                    padding: 40px 20px;
                                    box-sizing: border-box;
                                    text-align: left;
                                    .main-label {
                                        margin-bottom: 15px;
                                        color: #194866;
                                        font-size: 13px;
                                        border-top: 2px solid #194866;
                                        border-bottom: 2px solid #194866;
                                        padding: 3px 15px;
                                        display: inline-block;
                                        font-weight: bold;
                                    }
                                    .main-title {
                                        margin-bottom: 15px;
                                        color: #224e6b;
                                        font-size: 23px;
                                        letter-spacing: -1px;
                                        line-height: 30px;
                                        text-align: right;
                                        strong {
                                            font-size: 28px;
                                            font-weight: bold !important;
                                        }
                                    }
                                    .colored {
                                        font-size: 13px;
                                        // margin-top: 10px;
                                    }
                                }
                                .right {
                                    position: absolute;
                                    right: 10px;
                                    top: 0;
                                    width: 40%;
                                }
                            }

                            .second-row {
                                overflow: hidden;
                                clear: both;
                                position: relative;
                                background-image: url("/assets/images/front/business/20200220/erpm.png") !important;
                                background-position: 100% 100% !important;
                                background-size: 50% !important;
                                background-repeat: no-repeat !important;
                                background-color: #e7f0f9 !important;
                                padding-bottom: 10vw;
                                .left {
                                    position: absolute;
                                    left: 5%;
                                    bottom: 0;
                                    width: 90%;
                                }
                                .right {
                                    padding: 40px 20px;
                                    // padding-bottom: 70vw;

                                    .sub-title {
                                        font-size: 20px;
                                        font-weight: bold;
                                        text-align: center;
                                        letter-spacing: -1px;
                                    }

                                    .title-text {
                                        font-size: 12px;
                                        color: #333;
                                        margin: 20px 0 0px 0;
                                    }

                                    .text {
                                        // line-height: 32px;
                                    }
                                }
                            }

                            .third-row {
                                padding: 40px 20px;
                                .sub-title {
                                    font-size: 20px;
                                    font-weight: bold;
                                    text-align: center;
                                    letter-spacing: -1px;
                                }

                                .title-text {
                                    font-size: 12px;
                                    color: #333;
                                    margin: 20px 0 0px 0;
                                }

                                .text {
                                    // line-height: 27px;
                                }
                            }

                            .fourth-row {
                                padding: 40px 20px;
                                background-color: #e7f0f9 !important;
                                .sub-title {
                                    font-size: 20px;
                                    font-weight: bold;
                                    margin-bottom: 15px;
                                    text-align: center;
                                }
                                .title-text {
                                    font-size: 14px;
                                    color: #333;
                                    padding: 0px 0 20px 0;

                                    border-bottom: 1px solid #ccc;
                                    margin-bottom: 20px;
                                    text-align: center;
                                }
                                .text {
                                    // line-height: 27px;
                                }
                                .issue-box {
                                    .row {
                                        clear: both;
                                        overflow: hidden;
                                        text-align: center;
                                        .fll {
                                            text-align: left;
                                        }
                                        .issue {
                                            width: 50px;
                                            display: inline-block;
                                            text-align: center;
                                        }
                                        .title {
                                            // color: #3f5f77;
                                            color: #333;
                                            margin-bottom: 10px;
                                            font-size: 23px;
                                            text-align: center;
                                            font-weight: bold;
                                        }
                                        .text {
                                            text-align: left;
                                        }
                                    }
                                }
                            }

                            .bg-bold {
                                background: #f0f0f0;
                            }
                            margin-top: 0px;
                            > .row {
                                overflow: hidden;
                                margin-top: 50px;
                                &:last-child {
                                    .right {
                                        background: none;
                                    }
                                }
                                > .left {
                                    float: left;
                                    width: 20%;
                                    box-sizing: border-box;
                                }
                                > .right {
                                    padding-bottom: 50px;
                                    padding-left: 20px;
                                    text-align: left;
                                    box-sizing: border-box;
                                    float: right;
                                    width: 80%;
                                    background: url("/assets/images/front/business/border.png") no-repeat;
                                    background-position: 0 100%;
                                    .title {
                                        color: $color;
                                        font-size: 20px;
                                        font-weight: bold;
                                        margin-bottom: 10px;
                                        letter-spacing: -1px;
                                    }
                                    .sub-title {
                                        color: #b4b4b4;
                                        font-size: 15px;
                                    }
                                }
                            }
                            .button-area {
                                margin-top: 70px;
                            }
                        }
                        .button-area {
                            margin-top: 30px;
                            img {
                                margin: auto;
                                width: 150px;
                            }
                        }
                    }
                    .button-area {
                        margin-top: 30px;
                        img {
                            margin: auto;
                            width: 150px;
                        }
                    }
                    .affiliate-bg-area {
                        background: transparent url("/assets/images/mobile/business/affiliate_bg.png") no-repeat;
                        overflow: hidden;
                        background-size: cover;
                        background-position: 50% 50%;
                        height: 110vh;
                        .button-area {
                            margin-top: 15px;
                        }
                        .page-title {
                            color: #e11b4a;
                            border-top: 2px solid #e11b4a;
                        }
                        .page-text {
                            color: #696969;
                        }
                    }
                    .hr-bg-area {
                        background: #000 url(/assets/images/front/business/hr_bg.png) 50% 10% no-repeat;
                        background-size: 100%;
                    }
                    .hr-content {
                        margin-top: 100px;
                        padding: 0 5% 50px 5%;
                        > .row {
                            overflow: hidden;
                            margin-top: 50px;
                            &:last-child .right {
                                background: none;
                            }
                            > {
                                .left {
                                    float: left;
                                    width: 14%;
                                    box-sizing: border-box;
                                }
                                .right {
                                    padding-bottom: 50px;
                                    padding-left: 20px;
                                    text-align: left;
                                    box-sizing: border-box;
                                    float: right;
                                    width: 86%;
                                    background: url("/assets/images/front/business/border.png") no-repeat;
                                    background-position: 0 100%;
                                    .title {
                                        color: #e31a4c;
                                        font-size: 15px;
                                        font-weight: bold;
                                        margin-bottom: 15px;
                                    }
                                    .sub-title {
                                        color: #b4b4b4;
                                        font-size: 11px;
                                        line-height: 14px;
                                    }
                                    .each-recruit {
                                        border-top: 1px solid #b4b4b4;
                                        padding: 5px 0;
                                        overflow: hidden;
                                        .left {
                                            float: left;
                                            width: 15%;
                                            box-sizing: border-box;
                                            font-size: 11px;
                                        }
                                        .right {
                                            box-sizing: border-box;
                                            float: right;
                                            width: 85%;
                                            .row span {
                                                font-size: 11px;
                                            }
                                        }
                                    }
                                }
                            }
                        }
                        .button-area {
                            margin-top: 70px;
                        }
                    }
                }
                &.slider-wannabe-trunk {
                    .item-tAcademy {
                        .leejua-page {
                            .intro-box {
                                // padding: 35px 25px;
                                position: relative;
                                // background: #463111ab;
                                .intro-inner {
                                    position: absolute;
                                    right: 20px;
                                    bottom: 10%;
                                    img {
                                        width: 30%;
                                        float: right;
                                        clear: right;
                                    }
                                }
                                .text-4 {
                                    text-align: right;
                                    // color: #ffe1b4;
                                    font-size: 12px;
                                    letter-spacing: -1px;
                                    font-weight: bold;
                                    margin-bottom: 15px;
                                    overflow: hidden;
                                }
                                .text-white {
                                    text-align: right;
                                    font-size: 12px;
                                    letter-spacing: -1px;
                                    // color: #fff;
                                    // margin: 15px 0 10px 0;
                                    color: #333;
                                }
                                .text-gray {
                                    margin-top: 7px;
                                    text-align: right;
                                    font-size: 12px;
                                    letter-spacing: -1px;
                                    // color: #bcb7af;
                                }
                            }
                            .content-box {
                                margin: 50px 30px;
                                margin-bottom: 20px;
                                .dash {
                                    position: relative;
                                    &::after {
                                        position: absolute;
                                        font-weight: 900;
                                        left: 0px;
                                        top: 10px;
                                        content: "ㅡ";
                                        font-size: 20px;
                                        color: rgb(196, 162, 115);
                                    }
                                }
                                .text-1 {
                                    color: #9d783f;
                                    padding: 25px 0;
                                    font-weight: 300;
                                    // font-size: 16px;
                                    font-size: 14px;
                                    letter-spacing: -1px;
                                    .larger {
                                        margin-top: 15px;
                                        font-size: 18px;
                                    }
                                }
                                .text-2 {
                                    font-weight: 300;
                                    padding: 25px 0;
                                    color: #4c4b49;
                                    font-size: 16px;
                                    letter-spacing: -1px;
                                }
                                .text-3 {
                                    color: #9d783f;
                                    font-size: 24px;
                                    font-weight: 200;
                                    strong {
                                        font-weight: 700;
                                    }
                                    img {
                                        width: 100%;
                                    }
                                }
                                ul {
                                    li {
                                        display: flex;
                                        justify-content: space-between;
                                        align-items: center;
                                        border-bottom: 1px solid #d8ccb9;
                                        padding: 15px 0;
                                        font-size: 14px;
                                        letter-spacing: -1px;
                                        // &:last-child {
                                        //     border-bottom: 0;
                                        // }
                                        img {
                                            width: 35px;
                                        }
                                        p {
                                            width: 300px;
                                            color: #4c4b49;
                                            padding-left: 20px;
                                            font-size: 15px;
                                            line-height: 22px;
                                        }
                                    }
                                }
                            }
                            // position: relative;
                            // .main-img {
                            //     position: absolute;
                            //     height: 100vh;
                            //     top: 0;
                            //     left: 0;
                            // }
                        }
                        .bg-area {
                            margin-top: 10px;
                        }
                        .row-1 {
                            background: transparent url("/assets/images/mobile/wannabe/bg1.png") no-repeat;
                            background-size: cover;
                            padding-bottom: 20px;
                            .content {
                                margin-top: 214px;
                            }
                        }
                        .row-2 {
                            background: transparent url("/assets/images/mobile/wannabe/bg2.png") no-repeat;
                            background-size: cover;
                            padding-bottom: 20px;
                            .content {
                                margin-top: 262px;
                            }
                        }
                        .row-3 {
                            background: transparent url("/assets/images/mobile/wannabe/bg3.png") no-repeat;
                            background-size: cover;
                            padding-bottom: 20px;
                            .content {
                                margin-top: 242px;
                                color: #fff;
                            }
                        }
                        .content {
                            width: 90%;
                            margin: auto;
                            line-height: 15px;
                            font-size: 11px;
                        }
                        .ci {
                            text-align: center;
                            margin: auto;
                            padding-top: 30px;
                            background: #fff;
                            img {
                                width: 80%;
                                margin: auto;
                            }
                            .ci-text {
                                font-size: 11px;
                                line-height: 15px;
                                margin-top: 20px;
                                background: #efefef;
                                padding: 15px 5%;
                                text-align: left;
                                .primary-color {
                                    color: #e31a4c;
                                }
                            }
                        }
                    }
                    .item-tCafe {
                        .row {
                            width: 90%;
                            margin: auto;
                            margin-top: 30px;
                            img {
                                width: 80px;
                                margin: auto;
                            }
                            .title {
                                text-align: center;
                                color: #e31a4c;
                                margin-top: 10px;
                                margin-bottom: 5px;
                                font-size: 13px;
                                font-weight: bold;
                            }
                            .text {
                                text-align: center;
                                font-size: 12px;
                                line-height: 18px;
                            }
                        }
                        .img-box {
                            overflow: hidden;
                            margin-bottom: 30px;
                            margin-top: 30px;
                        }
                    }
                    .item-tCollabo .community-list {
                        position: relative;
                        overflow: hidden;
                        // .row {
                        //   height: 120px;
                        //   box-sizing: border-box;
                        //   width: 90%;
                        //   margin: 10px auto;
                        //   &:last-child .right {
                        //     background: none;
                        //   }
                        //   .left {
                        //     float: left;
                        //     width: 19%;
                        //     position: relative;
                        //     z-index: 10;
                        //     .date {
                        //       font-size: 19px;
                        //       font-weight: lighter;
                        //       letter-spacing: -1px;
                        //       line-height: 20px;
                        //     }
                        //     .day {
                        //       font-size: 10px;
                        //     }
                        //     .dot {
                        //       position: absolute;
                        //       right: -8px;
                        //       top: 2px;
                        //       width: 15px;
                        //       height: 15px;
                        //     }
                        //   }
                        //   .right {
                        //     padding-left: 15px;
                        //     box-sizing: border-box;
                        //     float: right;
                        //     width: 81%;
                        //     background: url("/assets/images/front/community/border.png") no-repeat;
                        //     background-position: 0 100%;
                        //     height: 100%;
                        //     &:before {
                        //       content: "";
                        //       position: absolute;
                        //       top: 15px;
                        //       height: calc(100% - 32px);
                        //       width: 100%;
                        //       display: block;
                        //       box-sizing: border-box;
                        //       background: url(/assets/images/front/community/border_bg.png) repeat-y;
                        //       background-position: right !important;
                        //       left: -77.7% !important;
                        //     }
                        //     .text-area {
                        //       width: 55%;
                        //       float: left;
                        //       box-sizing: border-box;
                        //       text-align: left;
                        //       .cat {
                        //         color: #e31a4c;
                        //         margin-bottom: 5px;
                        //         font-size: 13px;
                        //         font-weight: bold;
                        //       }
                        //       .title {
                        //         font-size: 12px;
                        //         margin-bottom: 10px;
                        //         line-height: 16px;
                        //       }
                        //       .detail-button {
                        //         cursor: pointer;
                        //         width: 50%;
                        //         max-width: 150px;
                        //       }
                        //     }
                        //     .img-area {
                        //       width: 45%;
                        //       float: right;
                        //       box-sizing: border-box;
                        //       img {
                        //         width: 100%;
                        //         max-width: 233px;
                        //         max-height: 105px;
                        //       }
                        //     }
                        //   }
                        // }
                        .row {
                            padding-top: 10px;
                            .con-box {
                                box-sizing: border-box;
                                width: 49.5%;
                                display: inline-block;
                                padding: 0 10px;
                                &:last-child {
                                    .right {
                                        // background:none;
                                    }
                                }
                                img {
                                    display: block;
                                    width: 100%;
                                }
                                .headings {
                                    margin: 10px 0 10px 0;
                                    overflow: hidden;
                                    .date {
                                        font-size: 14px;
                                        font-weight: lighter;
                                        letter-spacing: -1px;
                                        text-align: center;
                                        float: right;
                                        color: #ccc;
                                    }
                                    .cat {
                                        color: $color;
                                        font-size: 16px;
                                        float: left;
                                        font-weight: lighter;
                                    }
                                }
                                .title {
                                    clear: both;
                                    overflow: hidden;
                                    font-size: 15px;
                                    line-height: 22px;
                                    height: 100px;
                                    text-align: left;
                                }
                            }
                        }
                    }
                    .item-tTeacher {
                        .teacher-menu-box {
                            text-align: center;
                            margin-top: 10px;
                            margin-bottom: -7px;
                            .teacher-menu li {
                                cursor: pointer;
                                color: #666;
                                font-size: 12px;
                                float: left;
                                letter-spacing: -0.5px;
                                position: relative;
                                margin-left: 13px;
                                padding-bottom: 3px;
                                &.active {
                                    border-bottom: 2px solid #e31a4c;
                                    color: #e31a4c;
                                    font-weight: bold;
                                }
                                &:first-child {
                                    margin-left: 0;
                                    &:before {
                                        width: 0;
                                        height: 0;
                                    }
                                }
                                &:before {
                                    content: " ";
                                    border-radius: 50%;
                                    width: 3px;
                                    height: 3px;
                                    background: #666;
                                    display: inline-block;
                                    position: absolute;
                                    top: 38%;
                                    left: -7px;
                                }
                            }
                        }
                        .group-box {
                            border-top: 1px solid #ccc;
                            img {
                                width: 100%;
                            }
                        }
                    }
                    .item-tInstitute {
                        .item-bg-inner {
                            background-repeat: no-repeat !important;
                            width: 100%;
                            background-size: cover !important;
                            background-position: center !important;
                        }
                        .play-box {
                            padding: 0 5px;
                            margin-top: 1vh;
                            margin-bottom: 10px;
                            ul {
                                overflow: hidden;
                                margin: auto;
                                display: block;
                                li {
                                    float: left;
                                    width: 24%;
                                    padding: 2px;
                                    box-sizing: border-box;
                                    margin-right: 1%;
                                    &:last-child {
                                        margin-right: 0;
                                    }
                                    img {
                                        width: 100%;
                                        height: 100%;
                                    }
                                }
                            }
                        }
                    }
                    .item-tMap {
                        background: #f4f4f4;
                        #map {
                            box-sizing: border-box;
                            margin-top: 5vh;
                            width: 100vw;
                            height: 70vw;
                            border: 2px solid #e42151;
                            border-left: 0;
                            border-right: 0;
                        }
                        .map-info {
                            width: 90vw;
                            margin: auto;
                            margin-bottom: 5vh;
                            div {
                                text-align: center;
                                line-height: 18px;
                                dl {
                                    width: 100%;
                                    overflow: hidden;
                                    clear: both;
                                    display: inline-block;
                                    dt {
                                        font-weight: bold;
                                        color: #797979;
                                        width: 40px;
                                        font-size: 12px;
                                        text-align: right;
                                        float: left;
                                    }
                                    dd {
                                        width: 87%;
                                        color: #797979;
                                        font-size: 12px;
                                        text-align: left;
                                        padding-left: 10px;
                                        float: right;
                                        box-sizing: border-box;
                                        a {
                                            color: #797979;
                                            font-size: 12px;
                                        }
                                    }
                                }
                            }
                        }
                    }
                    .item-tCenter,
                    .item-center {
                        background: #fff;
                        .center-info {
                            img {
                                // width: initial;
                            }
                            //.title-img {
                            //  width: 200px !important;
                            //  display: inline-block;
                            //}
                            .title-box {
                                p {
                                    margin: 5px 0;
                                    font-size: 25px;
                                    color: #e11a4d;
                                }
                                span {
                                    display: block;
                                    border-bottom: 2px solid #e11a4d;
                                    width: 50px;
                                    height: 2px;
                                }
                            }
                            .center-img {
                                width: 100%;
                                height: 170px;
                                background-size: cover !important;
                                display: inline-block;
                                box-sizing: border-box;
                                &:hover {
                                    border: 4px solid #e11a4d;
                                }
                            }
                            .enlarge-img {
                                display: inline-block;
                                vertical-align: text-top;
                                img {
                                    width: 21px;
                                    vertical-align: top;
                                    margin-left: 10px;
                                    margin-top: 4px;
                                }
                            }
                            .inner-box {
                                width: 90%;
                                margin: auto;
                                ul {
                                    margin-top: 20px;
                                    margin-bottom: 20px;
                                    li {
                                        margin-bottom: 5px;
                                    }
                                }
                            }
                        }
                    }
                    .item-tBi,
                    .item-bi {
                        background: #fff;
                        .bi-info {
                            .section {
                                padding: 30px 20px;
                                text-align: center;
                                .title {
                                    margin-bottom: 15px;
                                    text-align: left;
                                    img {
                                        width: initial;
                                    }
                                }
                                .content {
                                    text-align: center;
                                    p {
                                        text-align: left;
                                    }
                                    img {
                                        display: inline-block;
                                        margin-top: 20px;
                                        // width: 100%;
                                    }
                                }
                            }
                        }
                    }
                    .item-tHistory {
                        .each-month {
                            margin-bottom: 15px;
                            .month {
                                color: #e01c4c;
                                // font-weight: bold;
                                letter-spacing: -0.5px;
                                font-size: 14px;
                                display: inline-block;
                                vertical-align: text-top;
                            }
                            .icon-box {
                                display: inline-block;
                                width: 15px;
                                vertical-align: sub;
                                .icon {
                                    vertical-align: bottom;
                                    width: 15px;
                                    display: inline-block !important;
                                }
                            }
                            .text {
                                display: inline-block;
                                vertical-align: text-top;
                                line-height: 22px;
                                letter-spacing: -0.5px;
                                max-width: 250px;
                                font-size: 13px;
                            }
                        }

                        .right-half {
                            box-sizing: border-box;
                            border-left: 1px solid #ccc;
                            padding-left: 20px;
                            width: 90%;
                            margin: auto;
                            padding-top: 1px;
                            margin-top: 30px;
                            .year {
                                img {
                                    left: -30px;
                                    width: 20px;
                                }
                            }
                            .each-month {
                                .month {
                                    padding-right: 10px;
                                }
                            }
                        }

                        .year {
                            position: relative;
                            font-size: 25px;
                            font-weight: bold;
                            color: #e01c4c;
                            margin-bottom: 20px;
                            margin-top: -11px;
                            img {
                                top: 10px;
                                width: 25px;
                                position: absolute;
                            }
                        }
                    }
                }
            }
        }
    }
    .menu-border {
        border-top: 1px solid #7d7d7d;
        border-bottom: 1px solid #7d7d7d;
    }
    .menu-common {
        .row.header-box-common {
            // border-top: 1px solid #7d7d7d;
            // border-bottom: 1px solid #7d7d7d;
            overflow: hidden;
            .owl-menu-box {
                background: #fff;
                -webkit-tap-highlight-color: transparent;
                height: 43px;
                float: left;
                width: 90%;
                position: relative;
                .left-op {
                    z-index: 3;
                    height: 43px;
                    position: absolute;
                    left: 0;
                    width: 20px;
                    background: -webkit-gradient(
                        linear,
                        left top,
                        right top,
                        color-stop(16.66%, #fff),
                        color-stop(100%, rgba(255, 255, 255, 0))
                    );
                }
                .right-op {
                    z-index: 3;
                    height: 43px;
                    position: absolute;
                    right: 0;
                    width: 30px;
                    background: -webkit-gradient(
                        linear,
                        left top,
                        right top,
                        color-stop(0, rgba(255, 255, 255, 0)),
                        color-stop(60%, #fff)
                    );
                }
                .owl-inner {
                    margin: auto;
                    width: 92%;
                    overflow: hidden;
                    &.pc {
                        text-align: center;
                        .owl-menu {
                            width: auto;
                            li,
                            .item {
                                float: left;
                            }
                        }
                    }
                }
                .owl-menu-common {
                    overflow: hidden;
                    .owl-nav {
                        display: none;
                    }
                    .owl-item {
                        display: inline-block;
                        text-align: center;
                        position: relative;
                        padding-right: 15px;
                        &:before {
                            content: " | ";
                            position: absolute;
                            right: 0;
                            font-size: 15px;
                            color: #777;
                            top: 21%;
                            font-weight: lighter;
                        }
                        &:last-child {
                            &:before {
                                content: "";
                            }
                        }
                    }
                    > div {
                        white-space: nowrap;
                        box-sizing: border-box;
                        a {
                            padding: 0px 5px;
                            box-sizing: border-box;
                            width: 100%;
                            height: 41px;
                            line-height: 43px;
                            display: inline-block;
                            color: #333;
                            font-size: 14px;
                            // font-weight: bold;
                            letter-spacing: -0.5px;
                            &:active {
                                background: #f1f1f1;
                            }
                            &.active,
                            &.active-fix {
                                // border-bottom: 2px solid #df1d4f;
                                color: #df1d4f;
                            }
                        }
                    }
                }
            }
            .menu-button {
                background: #fff;
                float: left;
                width: 10%;
                box-sizing: border-box;
                text-align: center;
                height: 43px;
                border-left: 1px solid #e1e1e1;
                line-height: 43px;
                img {
                    width: 20px;
                    height: 10px;
                    vertical-align: middle;
                }
            }
        }
        .row.header-box2-common {
            overflow: hidden;
            .owl-menu-box {
                border-bottom: 1px solid #7d7d7d3b;
                background: #e11c4a;
                -webkit-tap-highlight-color: transparent;
                height: 43px;
                width: 100%;
                float: left;
                position: relative;
                .owl-inner {
                    margin: auto;
                    overflow: hidden;
                    &.pc {
                        text-align: center;
                        .owl-menu {
                            width: auto;
                            li,
                            .item {
                                float: left;
                            }
                        }
                    }
                }
                .owl-stage {
                    background: #e31a4c !important;
                    width: 100% !important;
                }
                .owl-menu2 {
                    &.menu-red {
                        a {
                            color: #e11c4a;
                        }
                    }
                    top: 0;
                    width: 100%;
                    position: absolute;
                    overflow: hidden;
                    padding: 0 15px;
                    .owl-nav {
                        display: none;
                    }
                    .owl-item {
                        display: inline-block;
                        text-align: center;
                    }
                    > div {
                        white-space: nowrap;
                        box-sizing: border-box;
                        a {
                            padding: 0px 5px;
                            box-sizing: border-box;
                            width: 100%;
                            height: 41px;
                            line-height: 43px;
                            display: inline-block;
                            color: #f7afbb;
                            font-size: 14px;
                            // font-weight: bold;
                            letter-spacing: -0.5px;
                            &.active,
                            &.active-fix {
                                // border-bottom: 2px solid #df1d4f;
                                color: #fff;
                            }
                        }
                    }
                }
            }
        }
    }
}

@media (min-width: 500px) {
    .mobile-frame .real-page-outer .real-page .footer ul.footer-navigation {
        padding: 10px 0;
    }
}

@media (max-width: 330px) {
    .mobile-frame .real-page-outer .real-page .footer .inner-footer .right-area .row-1 .icon-box ul.flr {
        margin-top: 10px;
    }
}

@media (min-width: 500px) {
    .mobile-frame .real-page-outer .real-page .row.header-box .owl-menu-box .owl-menu > div a {
        padding: 0px 20px;
    }
}

@media (min-width: 800px) {
    .mobile-frame .real-page-outer .real-page .row.header-box .owl-menu-box .owl-menu > div a {
        padding: 0px 50px;
    }
}

@media (min-width: 500px) {
    .mobile-frame .sub-page-outer .sub-page .footer ul.footer-navigation {
        padding: 10px 0;
    }
}

@media (min-width: 500px) {
    .mobile-frame .sub-page-outer .sub-page .row.header-box .owl-menu-box .owl-menu > div a {
        padding: 0px 20px;
    }
}

@media (min-width: 800px) {
    .mobile-frame .sub-page-outer .sub-page .row.header-box .owl-menu-box .owl-menu > div a {
        padding: 0px 50px;
    }
}

@media screen and (min-width: 400px) {
    .mobile-frame .sub-page-outer .sub-page .base-slider.slider-center .item-map .map-info div dl dd {
        width: 89%;
    }
}

@media screen and (max-width: 330px) {
    .mobile-frame .sub-page-outer .sub-page .base-slider.slider-center .item-map .map-info div dl dd {
        width: 86%;
    }
}

@media screen and (min-width: 400px) {
    .mobile-frame .sub-page-outer .sub-page .base-slider.slider-wannabe .item-wAcademy .row-1 .content {
        margin-top: 250px;
    }
}

@media screen and (min-width: 400px) {
    .mobile-frame .sub-page-outer .sub-page .base-slider.slider-wannabe .item-wAcademy .row-2 .content {
        margin-top: 280px;
    }
}

@media screen and (min-width: 400px) {
    .mobile-frame .sub-page-outer .sub-page .base-slider.slider-wannabe .item-wAcademy .row-3 .content {
        margin-top: 255px;
    }
}

@media screen and (min-width: 400px) {
    .mobile-frame .sub-page-outer .sub-page .base-slider.slider-wannabe-trunk .item-tAcademy .row-1 .content {
        margin-top: 250px;
    }
}

@media screen and (min-width: 400px) {
    .mobile-frame .sub-page-outer .sub-page .base-slider.slider-wannabe-trunk .item-tAcademy .row-2 .content {
        margin-top: 280px;
    }
}

@media screen and (min-width: 400px) {
    .mobile-frame .sub-page-outer .sub-page .base-slider.slider-wannabe-trunk .item-tAcademy .row-3 .content {
        margin-top: 255px;
    }
}

@media (max-width: 320px) {
    .mobile-frame
        .sub-page-outer
        .sub-page
        .base-slider.slider-wannabe-trunk
        .item-tTeacher
        .teacher-menu-box
        .teacher-menu
        li {
        font-size: 10px;
    }
}

@media screen and (min-width: 400px) {
    .mobile-frame .sub-page-outer .sub-page .base-slider.slider-wannabe-trunk .item-tMap .map-info div dl dd {
        width: 89%;
    }
}

@media screen and (max-width: 330px) {
    .mobile-frame .sub-page-outer .sub-page .base-slider.slider-wannabe-trunk .item-tMap .map-info div dl dd {
        width: 86%;
    }
}

.modal-diploma .relative-box .w100.bg-modal .page-content-box {
    .header-bar {
        margin-top: 50px;
        background: #e31a4c;
        padding: 10px;
        border-radius: 8px;
        text-align: center;
        ul {
            width: 100%;
            padding-left: 10px;
            li {
                text-align: left;
                margin-bottom: 2px;
                &:last-child {
                    margin-bottom: 0;
                }
                span {
                    color: #fff;
                    font-size: 12px;
                    &.bold {
                        font-size: 13px;
                        margin-right: 10px;
                    }
                }
                &:first-child:before {
                    content: none;
                }
            }
        }
    }
    .page-content {
        margin-top: 50px;
        .row {
            overflow: hidden;
            margin-bottom: 10px;
            .left {
                color: #e31a4c;
                border-top: 3px solid #e31a4c;
                padding-top: 5px;
                font-size: 11px;
                font-weight: bold;
                float: left;
                width: 15%;
            }
            .right {
                float: right;
                width: 84%;
                margin-left: 1%;
                border-top: 3px solid #e0e0e0;
                color: #7e7e7e;
                font-size: 12px;
                padding-top: 5px;
                line-height: 17px;
                a.link2 {
                    &.valid {
                        &::before {
                            content: " | ";
                        }
                    }
                }
            }
        }
        .button-area {
            overflow: hidden;
            margin-bottom: 10px;
            margin-top: 50px;
            button {
                width: 99%;
            }
            .primary-button {
                border: 2px solid #df0440;
                text-align: center;
                padding: 10px 0;
                font-size: 11px;
                letter-spacing: -1px;
                transition: all 0.3s;
                color: #fff;
                background: #df0440;
                &:hover {
                    transition: all 0.3s;
                    color: #df0440;
                    background: #fff;
                }
            }
        }
    }
}

.modal-affiliate .menthor-content input,
.modal-branch .menthor-content input {
    font-size: 16px;
}

.modal-affiliate .menthor-content input::-webkit-input-placeholder,
.modal-branch .menthor-content input::-webkit-input-placeholder,
.modal-affiliate .menthor-content input::-moz-placeholder,
.modal-branch .menthor-content input::-moz-placeholder,
.modal-affiliate .menthor-content input:-ms-input-placeholder,
.modal-branch .menthor-content input:-ms-input-placeholder,
.modal-affiliate .menthor-content input:-moz-placeholder,
.modal-branch .menthor-content input:-moz-placeholder {
    color: #e76d6d;
}

.modal-affiliate .menthor-content input[type="text"],
.modal-branch .menthor-content input[type="text"] {
    background: #f2f2ec;
    box-shadow: none;
    outline: none;
    border: 0;
    vertical-align: top;
    height: 52px;
    margin-left: -4px;
    padding: 0 20px;
    width: calc(100% - 52px);
    box-sizing: border-box;
    color: #e31a4c;
    font-size: 13px;
    margin-top: 0 !important;
}

.modal-affiliate .menthor-content textarea,
.modal-branch .menthor-content textarea {
    margin-top: 0 !important;
    color: #e31a4c;
    font-size: 13px;
    background: #f2f2ec;
    border: none;
    width: calc(100% - 73px);
    height: 138px;
    margin-left: -3px;
    vertical-align: top;
}

.modal-affiliate .menthor-content textarea::-webkit-input-placeholder,
.modal-branch .menthor-content textarea::-webkit-input-placeholder,
.modal-affiliate .menthor-content textarea::-moz-placeholder,
.modal-branch .menthor-content textarea::-moz-placeholder,
.modal-affiliate .menthor-content textarea:-ms-input-placeholder,
.modal-branch .menthor-content textarea:-ms-input-placeholder,
.modal-affiliate .menthor-content textarea:-moz-placeholder,
.modal-branch .menthor-content textarea:-moz-placeholder {
    color: #e76d6d;
}

.modal-affiliate .menthor-content .menthor-title,
.modal-branch .menthor-content .menthor-title {
    color: #e31a4c;
    font-size: 27px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 50px;
}

.modal-affiliate .menthor-content .table-row .fll,
.modal-branch .menthor-content .table-row .fll {
    padding-right: 5px;
    box-sizing: border-box;
}

.modal-affiliate .menthor-content table,
.modal-branch .menthor-content table {
    margin-bottom: 2px;
    width: 100%;
}

.modal-affiliate .menthor-content table tr,
.modal-branch .menthor-content table tr {
    background: #f2f2ec;
}

.modal-affiliate .menthor-content table tr:last-child td,
.modal-branch .menthor-content table tr:last-child td {
    border-bottom: 0;
}

.modal-affiliate .menthor-content table td,
.modal-branch .menthor-content table td {
    border-bottom: 2px solid #fff;
}

.modal-affiliate .menthor-content table .img-box,
.modal-branch .menthor-content table .img-box {
    width: 52px;
    vertical-align: middle;
    display: table-cell;
    background: #e31a4c;
}

.modal-affiliate .menthor-content table .img-box p,
.modal-branch .menthor-content table .img-box p {
    color: #fff;
    font-size: 12px;
    letter-spacing: -0.5px;
    text-align: center;
}

.modal-affiliate .menthor-content table .subject-name,
.modal-branch .menthor-content table .subject-name {
    padding: 7px 15px;
    color: #e31a4c;
    font-size: 13px;
    width: 40%;
    box-sizing: border-box;
}

.modal-affiliate .menthor-content table .label-box,
.modal-branch .menthor-content table .label-box {
    box-sizing: border-box;
    margin-bottom: 3px;
    padding: 10px 0;
    width: 80%;
}

.modal-affiliate .menthor-content table .label-box span,
.modal-branch .menthor-content table .label-box span {
    margin-left: 5px;
    vertical-align: middle;
}

.modal-affiliate .menthor-content table .label-box label,
.modal-branch .menthor-content table .label-box label {
    display: inline-block;
    width: 150px;
}

.modal-affiliate .menthor-content .useless-box,
.modal-branch .menthor-content .useless-box {
    border: 6px solid #f2f2ec;
    margin: 15px 0;
}

.modal-affiliate .menthor-content .button-area,
.modal-branch .menthor-content .button-area {
    overflow: hidden;
    margin-bottom: 10px;
}

.modal-affiliate .menthor-content .button-area button,
.modal-branch .menthor-content .button-area button {
    width: 99%;
}

.modal-affiliate .menthor-content .button-area .gray-button,
.modal-branch .menthor-content .button-area .gray-button {
    border: 1px solid #898989;
    color: #898989;
    text-align: center;
    padding: 10px 0;
    font-size: 14px;
    background: #fff;
    transition: all 0.3s;
}

.modal-affiliate .menthor-content .button-area .gray-button:hover,
.modal-branch .menthor-content .button-area .gray-button:hover {
    transition: all 0.3s;
    color: #fff;
    background: #898989;
}

.modal-affiliate .menthor-content .button-area .primary-button,
.modal-branch .menthor-content .button-area .primary-button {
    border: 1px solid #df0440;
    color: #df0440;
    text-align: center;
    padding: 10px 0;
    font-size: 14px;
    background: #fff;
    transition: all 0.3s;
}

.modal-affiliate .menthor-content .button-area .primary-button:hover,
.modal-branch .menthor-content .button-area .primary-button:hover {
    transition: all 0.3s;
    color: #fff;
    background: #df0440;
}

.modal-affiliate .menthor-content .agree-box,
.modal-branch .menthor-content .agree-box {
    height: 100px;
    overflow: auto;
}

.modal-menthor .menthor-content input,
.modal-menthor2 .menthor-content input {
    font-size: 16px;
}

.modal-menthor .menthor-content input::-webkit-input-placeholder,
.modal-menthor2 .menthor-content input::-webkit-input-placeholder,
.modal-menthor .menthor-content input::-moz-placeholder,
.modal-menthor2 .menthor-content input::-moz-placeholder,
.modal-menthor .menthor-content input:-ms-input-placeholder,
.modal-menthor2 .menthor-content input:-ms-input-placeholder,
.modal-menthor .menthor-content input:-moz-placeholder,
.modal-menthor2 .menthor-content input:-moz-placeholder {
    color: #e76d6d;
}

.modal-menthor .menthor-content input[type="text"],
.modal-menthor2 .menthor-content input[type="text"] {
    background: #f2f2ec;
    box-shadow: none;
    outline: none;
    border: 0;
    vertical-align: top;
    height: 52px;
    margin-left: -4px;
    padding: 0 20px;
    width: calc(100% - 52px);
    box-sizing: border-box;
    color: #e31a4c;
    font-size: 13px;
    margin-top: 0 !important;
}

.modal-menthor .menthor-content textarea,
.modal-menthor2 .menthor-content textarea {
    margin-top: 0 !important;
    color: #e31a4c;
    font-size: 13px;
    background: #f2f2ec;
    border: none;
    width: calc(100% - 73px);
    height: 138px;
    margin-left: -3px;
    vertical-align: top;
}

.modal-menthor .menthor-content textarea::-webkit-input-placeholder,
.modal-menthor2 .menthor-content textarea::-webkit-input-placeholder,
.modal-menthor .menthor-content textarea::-moz-placeholder,
.modal-menthor2 .menthor-content textarea::-moz-placeholder,
.modal-menthor .menthor-content textarea:-ms-input-placeholder,
.modal-menthor2 .menthor-content textarea:-ms-input-placeholder,
.modal-menthor .menthor-content textarea:-moz-placeholder,
.modal-menthor2 .menthor-content textarea:-moz-placeholder {
    color: #e76d6d;
}

.modal-menthor .menthor-content .menthor-title,
.modal-menthor2 .menthor-content .menthor-title {
    color: #e31a4c;
    font-size: 27px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 50px;
}

.modal-menthor .menthor-content .table-row .fll,
.modal-menthor2 .menthor-content .table-row .fll {
    padding-right: 5px;
    box-sizing: border-box;
}

.modal-menthor .menthor-content table,
.modal-menthor2 .menthor-content table {
    margin-bottom: 2px;
    width: 100%;
}

.modal-menthor .menthor-content table tr,
.modal-menthor2 .menthor-content table tr {
    background: #f2f2ec;
}

.modal-menthor .menthor-content table tr:last-child td,
.modal-menthor2 .menthor-content table tr:last-child td {
    border-bottom: 0;
}

.modal-menthor .menthor-content table td,
.modal-menthor2 .menthor-content table td {
    border-bottom: 2px solid #fff;
}

.modal-menthor .menthor-content table .img-box,
.modal-menthor2 .menthor-content table .img-box {
    width: 52px;
    vertical-align: middle;
    display: table-cell;
    background: #e31a4c;
}

.modal-menthor .menthor-content table .img-box p,
.modal-menthor2 .menthor-content table .img-box p {
    color: #fff;
    font-size: 12px;
    letter-spacing: -0.5px;
    text-align: center;
}

.modal-menthor .menthor-content table .subject-name,
.modal-menthor2 .menthor-content table .subject-name {
    padding: 7px 15px;
    color: #e31a4c;
    font-size: 13px;
    width: 40%;
    box-sizing: border-box;
}

.modal-menthor .menthor-content table .label-box,
.modal-menthor2 .menthor-content table .label-box {
    box-sizing: border-box;
    margin-bottom: 3px;
    padding: 10px 10px;
}

.modal-menthor .menthor-content table .label-box span,
.modal-menthor2 .menthor-content table .label-box span {
    margin-left: 5px;
    vertical-align: middle;
}

.modal-menthor .menthor-content table .label-box label,
.modal-menthor2 .menthor-content table .label-box label {
    display: inline-block;
    font-size: 11px;
    padding: 0 0px;
    width: 49%;
    box-sizing: border-box;
    letter-spacing: -1px;
}

.modal-menthor .menthor-content .useless-box,
.modal-menthor2 .menthor-content .useless-box {
    border: 6px solid #f2f2ec;
    margin: 15px 0;
}

.modal-menthor .menthor-content .button-area,
.modal-menthor2 .menthor-content .button-area {
    overflow: hidden;
    margin-bottom: 10px;
}

.modal-menthor .menthor-content .button-area button,
.modal-menthor2 .menthor-content .button-area button {
    width: 99%;
}

.modal-menthor .menthor-content .button-area .gray-button,
.modal-menthor2 .menthor-content .button-area .gray-button {
    border: 1px solid #898989;
    color: #898989;
    text-align: center;
    padding: 10px 0;
    font-size: 14px;
    background: #fff;
    transition: all 0.3s;
}

.modal-menthor .menthor-content .button-area .gray-button:hover,
.modal-menthor2 .menthor-content .button-area .gray-button:hover {
    transition: all 0.3s;
    color: #fff;
    background: #898989;
}

.modal-menthor .menthor-content .button-area .primary-button,
.modal-menthor2 .menthor-content .button-area .primary-button {
    border: 1px solid #df0440;
    color: #df0440;
    text-align: center;
    padding: 10px 0;
    font-size: 14px;
    background: #fff;
    transition: all 0.3s;
}

.modal-menthor .menthor-content .button-area .primary-button:hover,
.modal-menthor2 .menthor-content .button-area .primary-button:hover {
    transition: all 0.3s;
    color: #fff;
    background: #df0440;
}

.modal-menthor .menthor-content .agree-box,
.modal-menthor2 .menthor-content .agree-box {
    height: 100px;
    overflow: auto;
}

.agree-box {
    border: 1px solid #eee;
    padding: 10px;
    margin-bottom: 7px;
    p {
        font-size: 12px;
        margin-bottom: 4px;
        letter-spacing: -1px;
        font-weight: normal;
        &.title {
            font-weight: bold;
            font-size: 14px;
            padding: 5px 0;
        }
    }
    ul {
        width: 100%;
        padding-bottom: 5px;
        padding-left: 10px;
        li {
            color: #898989;
            font-size: 12px;
            letter-spacing: -1px;
            margin-bottom: 4px;
        }
    }
    .label-box {
        text-align: right;
        margin-right: 4px;
        line-height: 52px;
        vertical-align: top;
        &:last-child {
            margin-right: 0;
        }
    }
    label {
        font-weight: bold;
        color: #898989;
        font-size: 13px;
        letter-spacing: -0.5px;
    }
}

.modal-youtube .page-title span {
    font-size: 14px;
}

.modal-service .page-modal-bg,
.modal-diploma .page-modal-bg,
.modal-menthor .page-modal-bg,
.modal-community .page-modal-bg,
.modal-affiliate .page-modal-bg,
.modal-branch .page-modal-bg,
.modal-youtube .page-modal-bg,
.modal-teacher .page-modal-bg,
.modal-return .page-modal-bg,
.modal-price .page-modal-bg {
    background: url("/assets/images/front/general/page_bg.png") no-repeat;
    background-position: 0 100%;
    background-size: 100%;
    text-align: center;
    margin-bottom: 10px;
    padding-bottom: 10px;
}

.modal-service .page-modal-bg .page-title,
.modal-diploma .page-modal-bg .page-title,
.modal-menthor .page-modal-bg .page-title,
.modal-community .page-modal-bg .page-title,
.modal-affiliate .page-modal-bg .page-title,
.modal-branch .page-modal-bg .page-title,
.modal-youtube .page-modal-bg .page-title,
.modal-teacher .page-modal-bg .page-title,
.modal-return .page-modal-bg .page-title,
.modal-price .page-modal-bg .page-title {
    display: inline-block;
    color: #e31a4c;
    font-size: 16px;
    letter-spacing: -1px;
    vertical-align: super;
}

.modal-service h3,
.modal-diploma h3,
.modal-menthor h3,
.modal-community h3,
.modal-affiliate h3,
.modal-branch h3,
.modal-youtube h3,
.modal-teacher h3,
.modal-price h3 {
    font-size: 14px;
}

.modal-community .community-content {
    .img-box {
        img {
            width: 100%;
            padding-bottom: 10px;
            box-sizing: border-box;
        }
        .row {
            margin-bottom: 5px;
            img {
                &:nth-child(1) {
                    padding-right: 5px;
                }
                &:nth-child(2) {
                    padding-left: 5px;
                }
            }
        }
    }
    .community-content-box {
        scrollbar-base-color: #e4a8ae;
        scrollbar-arrow-color: #fff;
        &::-webkit-scrollbar {
            width: 2px;
        }
        &::-webkit-scrollbar-track {
            background-color: #eaeaea;
            border-left: 1px solid #ccc;
        }
        &::-webkit-scrollbar-thumb {
            background-color: #de848c;
            &:hover {
                background-color: #aaa;
            }
        }
        iframe {
            width: 100%;
            height: 200px;
        }
    }
}

.teacher-absbox {
    position: absolute;
    width: 100%;
    height: 250px;
    top: -250px;
    overflow: hidden;
    z-index: 10;
    .edu-absbox .owl-item {
        .item {
            height: 280px;
            img {
                width: 100%;
                max-width: 140px;
                position: absolute;
                bottom: 5%;
            }
        }
        &:nth-child(1) img {
            width: 140px;
        }
        &:nth-child(2) img {
            width: 123px;
        }
        &:nth-child(3) img {
            width: 140px;
            bottom: 10%;
        }
        &:nth-child(4) img {
            width: 140px;
        }
        &:nth-child(5) img {
            width: 130px;
        }
    }
}

.base-footer {
    position: relative;
}

.right-phone {
    width: 100%;
    border-radius: 4px;
}

.phone-box {
    display: inline-block;
    background: #f2f2ec;
    box-shadow: none;
    outline: none;
    border: 0;
    vertical-align: top;
    height: 52px;
    margin-left: -4px;
    padding: 0 10px;
    width: calc(100% - 52px);
    box-sizing: border-box;
    color: #e31a4c;
    margin-top: 0 !important;
    input {
        width: 82% !important;
    }
    .phone2,
    .phone3 {
        width: 60px !important;
        padding: 0 !important;
        text-align: center;
    }
    p.dash {
        display: inline-block;
        line-height: 52px;
        font-size: 20px;
    }
}

.select2-container--default .select2-selection--single {
    // background: #f2f2ec !important;
    border: none !important;
    border-radius: 0 !important;
    outline: 0;
    .select2-selection__rendered {
        line-height: 52px !important;
        font-size: 14px !important;
        color: #e31a4c !important;
    }
    .select2-selection__arrow {
        top: 13px !important;
    }
}

.select2-container--open .select2-dropdown--below {
    top: 23px;
    background: #f2f2ec;
    border: 1px solid #ccc;
    border-top: 0;
}

.select2-container--default .select2-results > .select2-results__options {
    width: 100%;
}

.select2-container {
    vertical-align: top !important;
}

.useless-box {
    display: none;
    padding: 10px;
    background: #f2f2ec;
    span {
        display: inline-block;
        border: 1px solid #e3e3e3;
        color: #898989;
        text-align: center;
        padding: 5px 5px;
        font-size: 13px;
        background: #fff;
        margin-right: 5px;
        margin-bottom: 3px;
        &:last-child {
            margin-right: 0;
        }
    }
}

.modal-teacher {
    .content-box img {
        width: 90%;
    }
    .teacher-info {
        width: 100%;
        height: 95%;
        display: table;
        .teacher-info-inner {
            vertical-align: middle;
            display: table-cell;
        }
        .pink-box-outer {
            max-height: 195px;
            overflow: auto;
            scrollbar-base-color: #e4a8ae;
            scrollbar-arrow-color: #fff;
            &::-webkit-scrollbar {
                width: 2px;
            }
            &::-webkit-scrollbar-track {
                background-color: #eaeaea;
                border-left: 1px solid #ccc;
            }
            &::-webkit-scrollbar-thumb {
                background-color: #de848c;
                &:hover {
                    background-color: #aaa;
                }
            }
        }
    }
    .bg-modal {
        .page-modal-bg {
            background: url("/assets/images/front/general/page_bg.png") no-repeat;
            background-position: 0 100%;
            background-size: 100%;
            text-align: center;
            margin-bottom: 10px;
            padding-bottom: 10px;
            .page-title {
                display: inline-block;
                color: #e31a4c;
                font-size: 24px;
                letter-spacing: -1px;
                vertical-align: super;
            }
        }
        .content-box {
            border-bottom: 1px solid #000;
            margin-bottom: 10px;
            .pink-box {
                .title {
                    background: #f7dbe2;
                    padding: 5px 5px;
                    font-size: 13px;
                    font-weight: bold;
                    color: #5c5c5c;
                    margin-bottom: 7px;
                }
                .text {
                    letter-spacing: -0.5px;
                    color: #77797a;
                    font-size: 11px;
                    line-height: 16px;
                }
            }
        }
        .button-area {
            overflow: hidden;
            margin-bottom: 10px;
            text-align: center;
            button {
                width: 99%;
            }
            .pink-button {
                border: none;
                color: #fff;
                text-align: center;
                padding: 10px 0;
                font-size: 13px;
                background: #e31a4c;
                transition: all 0.3s;
                border: 2px solid #e31a4c;
                &:hover {
                    transition: all 0.3s;
                    color: #e31a4c;
                    border: 2px solid #e31a4c;
                    background: #fff;
                }
            }
        }
    }
}

.modal-confirm {
    .img-box {
        float: left;
        width: 30%;
        text-align: left;
        display: table;
        .cell-box {
            display: table-cell;
            vertical-align: middle;
            img {
                width: 85%;
            }
        }
    }
    .confirm-box {
        width: 70%;
        float: right;
        display: table;
        height: 100%;
    }
    .cell-box {
        display: table-cell;
        vertical-align: middle;
    }
    .title {
        color: #db2353;
        font-size: 12px;
        letter-spacing: -1px;
        font-weight: bold;
        margin-bottom: 5px;
    }
    .sub-title {
        color: #333;
        font-size: 11px;
        line-height: 14px;
    }
    .ps {
        color: #aaa;
        font-size: 11px;
        line-height: 14px;
    }
    .span-title {
        color: #db2353;
        font-size: 11px;
        font-weight: bold;
    }
    .span-text {
        color: #333;
        font-size: 11px;
        letter-spacing: -1px;
    }
}

.intro-shot {
    width: 100vw;
    height: 100vh;
    position: absolute;
    z-index: 99;
    display: table;
    background: #fff;
    .cell-box {
        display: table-cell;
        vertical-align: middle;
        text-align: center;
        img {
            // width: 58%;
            width: 100%;
            max-width: 400px;
        }
    }
}

.fixed-none {
    position: fixed;
    visibility: hidden;
}

.institute-area .item {
    img {
        border: 2px solid transparent;
        transition: all 0.3s;
    }
    &.active img {
        border: 2px solid #e31a4c;
    }
}

.ask-complete-page {
    padding: 50px 0;
    .review-box {
        margin: auto;
        padding: 30px 0 20px 0;
        img {
            vertical-align: middle;
            width: 20px;
            display: block;
            margin: auto;
            text-align: center;
        }
        .text1 {
            vertical-align: middle;
            color: #333;
            font-weight: bold;
            font-size: 16px;
            display: block;
            margin: auto;
            text-align: center;
            margin-bottom: 10px;
        }
        .review-content {
            padding-top: 10px;
            border-radius: 12px;
            // padding: 7px;
            overflow: hidden;
            text-align: center;
            width: 95%;
            margin: auto;
            box-sizing: border-box;
            .item {
                width: 48%;
                float: left;
                margin-bottom: 10px;
                &:nth-child(odd) {
                    margin-right: 3%;
                }
                img {
                    width: 100%;
                }
            }
            img.url {
                // width: 95%;
                // margin: auto;
            }
        }
    }
    .time-box {
        margin-top: 25px;
        .time-text {
            font-size: 17px !important;
            color: #333;
            margin-bottom: 10px;
            vertical-align: middle;
            display: block;
            margin: auto;
        }
        img {
            width: 20px;
            vertical-align: middle;
            display: block;
            margin: auto;
        }
    }
    .time-clock {
        font-size: 23px !important;
        letter-spacing: -1px;
        margin-left: 5px;
        font-weight: bold;
        vertical-align: middle;
    }
    .header-icon {
        width: 80px;
    }
    .page-title {
        color: #333 !important;
        font-size: 22px !important;
        text-align: center;
        span {
            color: $color;
        }
    }
    .page-text {
        color: #666 !important;
        padding: 30px 20px !important;
        text-align: center;
        border-bottom: 1px solid #ccc;
        width: 95%;
        margin: auto;
        box-sizing: border-box;
    }
    .time-box-outer {
        padding: 30px 20px !important;
        text-align: center;
        border-bottom: 1px solid #ccc;
        width: 95%;
        margin: auto;
        box-sizing: border-box;
    }
    .info-box {
        font-size: 16px;
        div {
            box-sizing: border-box;
        }
        .fll {
            padding: 10px;
        }
        .flr {
            padding: 10px;
        }
    }
}

.modal-price h2 {
    color: #e31a4c;
    font-size: 15px;
    letter-spacing: -1px;
    margin-top: 30px;
}
    
.modal-price table {
    margin-top: 10px;
    border-collapse: collapse;
    text-align: left;
    line-height: 1.5;
    border-top: 1px solid #aaa;
    width: 100%;
    thead th {
        padding: 4px;
        font-weight: bold;
        vertical-align: top;
        border-top: 1px solid #aaa;
        border-bottom: 1px solid #999;
        font-size: 12px;
        border-right: 1px solid #ccc;
        // &:first-child {
        //     border-right: 1px solid #ccc;
        // }
        &:last-child {
            // border-left: 1px solid #ccc;
            border-right: none;
        }
    }
    tbody th {
        width: 150px;
        padding: 2px;
        font-weight: bold;
        vertical-align: top;
        border-bottom: 1px solid #ccc;
        background: #f3f6f7;
        font-size: 12px;
    }
    td {
        padding: 2px;
        vertical-align: top;
        border-bottom: 1px solid #ccc;
        font-size: 12px;
        &:first-child {
            color: #e31a4c;
        }
        // &:first-child {
        //     width: 45%;
        //     color: #e31a4c;
        //     border-right: 1px solid #ccc;
        // }
        // &:last-child {
        //     border-left: 1px solid #ccc;
        //     width: 27%;
        // }

        border-right: 1px solid #ccc;

        // &:first-child {
        //     border-right: 1px solid #ccc;
        // }
        &:last-child {
            // border-left: 1px solid #ccc;
            border-right: none;
        }
        
    }
}
.modal-return p {
    font-size: 11.5px;
    letter-spacing: -1px;
}
.modal-return table {
    margin-top: 30px;
    border-collapse: collapse;
    text-align: left;
    line-height: 1.5;
    border-top: 1px solid #aaa;
    width: 100%;
    thead th {
        padding: 7px;
        font-weight: bold;
        vertical-align: middle;
        border-top: 1px solid #aaa;
        border-bottom: 1px solid #999999;
        font-size: 11px;
        letter-spacing: -1px;
        &:first-child {
            border-right: 1px solid #ccc;
        }
        &:last-child {
            border-left: 1px solid #ccc;
        }
    }
    tbody th {
        padding: 7px;
        font-weight: bold;
        vertical-align: middle;
        border-bottom: 1px solid #ccc;
        background: #f3f6f7;
        font-size: 11px;
        letter-spacing: -1px;
    }
    td {
        padding: 7px;
        vertical-align: middle;
        border-bottom: 1px solid #ccc;
        border-right: 1px solid #ccc;
        font-size: 11px;
        letter-spacing: -1px;
        &:first-child {
            border-right: 1px solid #ccc;
        }
        &:last-child {
            border-left: 1px solid #ccc;
        }
    }
}

.m-event-img-box {
    // margin-top: 100px;
    position: relative;
    .m-event-img {
        width: 100%;
    }
    .text {
        position: absolute;
        right: 4%;
        bottom: 2px;
        color: #e73158;
        font-weight: bold;
        font-size: 9px;
    }
}

.modal-menthor {
    .m-event-img-box {
        margin-top: 0px;
        padding-bottom: 20px;
    }
    .event-flag2 {
            margin-left: 10px;
            width: 120px;
    }
}

.asktime-box {
    background: #f2f2ec;
    img {
        vertical-align: middle;
    }
    .radio-label {
        vertical-align: sub;
        font-size: 15px;
        margin-left: 15px;
        &.location {
            font-size: 13px;
        }
    }
}

.center-box {
    background: #f2f2ec;
    img {
        vertical-align: middle;
    }
    .radio-label {
        vertical-align: sub;
        font-size: 14px;
        letter-spacing: -1px;
        margin-left: 15px;
        &.location {
            font-size: 13px;
        }
    }
}

.enlarge-icon {
    width: 18px !important;
    display: inline-block !important;
    margin-left: 7px;
    vertical-align: text-top;
}

.community-content-box {
    padding: 40px 10px;
    .page-modal-bg {
        background: url("/assets/images/front/general/page_bg.png") no-repeat;
        background-position: 0 100%;
        background-size: 100%;
        text-align: center;
        margin-bottom: 10px;
        padding-bottom: 10px;
        .page-title {
            display: inline-block;
            color: #e31a4c;
            font-size: 25px;
            letter-spacing: -1px;
            vertical-align: super;
        }
    }
    .list-view-button {
        border: 1px solid $color;
        color: $color;
        padding: 7px 14px;
        border-radius: 4px;
        font-size: 16px;
    }
}

.teacher-area {
    .item {
        text-align: center;
        border-bottom: 2px solid #e11a4d;
        line-height: 0;
        position: relative;
        margin-bottom: 50px;
        img.teacher {
            width: 90%;
            display: inline-block;
            -webkit-filter: grayscale(100%);
            /* Safari 6.0 - 9.0 */
            filter: grayscale(100%);
        }
        img.icon {
            position: absolute;
            left: -10%;
            bottom: -10%;
            width: 25%;
        }
        .tag {
            height: 25px;
            line-height: 23px;
            background: #e11a4d;
            border-radius: 0 0 12px 12px;
            width: 90%;
            color: #fff !important;
            position: absolute;
            width: 90%;
            transition: all 0.3s;
            font-size: 11px;
            display: none;
        }
    }
    .owl-item.center {
        .tag {
            display: block;
        }
        img.teacher {
            -webkit-filter: none;
            /* Safari 6.0 - 9.0 */
            filter: none;
        }
    }
}

.guide-container {
    > div {
        position: relative;
        margin-top: -10px;
        background-size: contain !important;
        &.purpose {
            background-color: #fff1f1 !important;
        }
    }
    .menu-box-list-container {
        // background: #f4f4f4;
        overflow: hidden;
        width: 86%;
        padding: 0 7%;
    }
    .guide-title {
        color: #e31a4c;
        font-size: 15px;
        // background: #f4f4f4;
        padding: 7px 12px;
        width: 100%;
        .step {
            color: #e31a4c;
            font-size: 17px;
            display: inline-block;
            margin-right: 15px;
        }
    }
    .tabs {
        margin-top: 50px;
        li {
            border-radius: 8px 8px 0 0;
            padding: 7px 20px;
            display: inline-block;
            background: #e4e4e4;
            color: #808080;
            font-size: 11px;
            width: 24.3%;
            box-sizing: border-box;
            margin: 0;
            text-align: center;
            &.active {
                background: #e11a4d;
                color: #fff;
            }
        }
    }
    .menu-box-list {
        background: #e11c4a;
        text-align: center;
        padding: 2px 0px;
        box-sizing: border-box;
        border: 2px solid #e11c4a;
        border-radius: 4px;
        color: #fff;
        font-size: 12px;
        width: 32%;
        margin-bottom: 7px;
        cursor: pointer;
        &:nth-child(3n) {
            margin-right: 0;
        }
        // &:nth-child(odd) {
        // margin-right: 0;
        // }
        margin-right: 1.2%;
        -webkit-box-shadow: -1px 6px 3px -2px rgba(173, 13, 50, 1);
        -moz-box-shadow: -1px 6px 3px -2px rgba(173, 13, 50, 1);
        box-shadow: -1px 6px 3px -2px rgba(173, 13, 50, 1);
    }
    .menu-box-list.active {
        background: #fff;
        color: #e31a4c;
        border: 2px solid #e31a4c;
        box-shadow: none;
        -webkit-box-shadow: -1px 6px 3px -2px rgba(173, 13, 50, 1);
        -moz-box-shadow: -1px 6px 3px -2px rgba(173, 13, 50, 1);
        box-shadow: -1px 6px 3px -2px rgba(173, 13, 50, 1);
    }
    .menu-box-list a {
        display: block;
        width: 100%;
    }

    ul.community-list {
        overflow: hidden;
        li {
            border-bottom: 1px solid #e6e6e6;
            a {
                display: block;
                overflow: hidden;
                padding: 15px;
                height: 90px;
                .img-box {
                    float: left;
                    width: 40%;
                    padding-right: 0;
                    box-sizing: border-box;
                    max-width: 150px;
                    img {
                        width: 100%;
                    }
                }
                .text-box {
                    float: left;
                    width: 60%;
                    padding-left: 15px;
                    box-sizing: border-box;
                    font-size: 15px;
                    height: 100%;
                    display: table;
                    .text-inner-box {
                        display: table-cell;
                        vertical-align: middle;
                        color: #323232;
                        font-size: 14px;
                        letter-spacing: -1px;
                        line-height: 18px;
                        .red-color {
                            margin-right: 5px;
                            color: #e31a4c;
                            font-size: 15px;
                            font-weight: bold;
                            letter-spacing: -0.5px;
                        }
                    }
                }
            }
        }
    }
}

.slider-guide {
    background: #f4f4f4;
    .class-container {
        .class-box2 {
            background: #fff;
            position: relative;
            .trans-img {
                position: absolute;
                bottom: 7px;
                left: 2.5%;
                width: 95%;
                height: 45px;
                margin-left: 2px;
            }
            > img {
                width: 100%;
            }
            .overview {
                background: #e11c4a;
                // height: 22px;
                overflow: hidden;
                padding: 2px 0;
                div {
                    font-size: 15px;
                    color: #fff;
                    padding: 0 7px;
                    line-height: 20px;
                    float: left;
                    box-sizing: border-box;
                    letter-spacing: -0.5px;
                    &:last-child {
                        text-align: right;
                    }
                    &.overview-title {
                        text-align: center;
                        font-size: 15px;
                        float: left;
                        display: inline-block;
                        line-height: 37px;
                    }
                    &.overview-right {
                        float: right;
                        p {
                            text-align: right;
                        }
                        p.date {
                            font-size: 11px;
                            margin-bottom: -3px;
                        }
                    }
                }
            }
            .class-tab {
                width: 100%;
                display: block;
                li {
                    text-align: center;
                    float: left;
                    width: 33.3%;
                    padding: 5px 0;
                    font-size: 12px;
                    cursor: pointer;
                    background: #f5f5f5;
                    color: #333;
                    &.active {
                        color: #c0c0c0;
                        background: #fff;
                    }
                }
                // display: block;
                &.branch {
                    display: none;
                }
            }
            .class-list {
                &::-webkit-scrollbar-track {
                    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0);
                    border-radius: 0px;
                    background-color: #e0e0e0;
                }
                &::-webkit-scrollbar {
                    width: 12px;
                    background-color: #ccc;
                }
                &::-webkit-scrollbar-thumb {
                    border-radius: 0px;
                    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
                    background-color: #ccc;
                }
                // border-bottom: 1px solid #ccc;
                // margin-top: -6px;
                border-top: 0;
                width: 100%;
                // border: 2px solid #891635;
                // border: 2px solid #ddd;
                background: #f1f1f1;
                box-sizing: border-box;
                overflow: hidden;
                // height: 426px;
                height: 170px;
                display: block;
                li {
                    border-bottom: 1px solid #e2e2e2;
                    // margin: 10px;
                    padding: 5px 0;
                    &:last-child {
                        border-bottom: 0;
                        // margin-bottom: 0;
                        margin-bottom: 90px;
                    }
                    &.active {
                        background: #bf1d43;
                    }
                    // &:last-child {
                    // }
                    cursor: pointer;
                    &:hover,
                    &.active {
                        background: #bf1d43;
                        td,
                        a {
                            color: #fff !important;
                            &.color-red {
                                color: #fff !important;
                            }
                        }
                    }
                    table {
                        td {
                            &:last-child {
                                // text-align: right;
                            }
                            span.circle-number {
                                color: #fff;
                                font-size: 12px;
                                font-weight: bold;
                                background: #eee;
                                border-radius: 50%;
                                width: 20px;
                                height: 20px;
                                display: inline-block;
                                text-align: center;
                                line-height: 20px;
                                &.nailart {
                                    background: #fe9684;
                                }
                                &.makeup {
                                    background: #ee8fa5;
                                }
                                &.esthetic {
                                    background: #b18acf;
                                }
                                &.hair {
                                    background: #b3ceca;
                                }
                                &.special {
                                    background: #f3c35e;
                                }
                            }
                            img {
                                width: 40px;
                                margin: 0 6px;
                                margin-left: 0;
                            }
                            a {
                                width: 60px;
                                padding-top: 5px;
                                padding-bottom: 5px;
                                display: inline-block;
                                // color: #fff !important;
                                font-size: 14px;
                                vertical-align: middle;
                                text-align: center;
                                margin-left: 10px;
                                // background: #df5cac;
                                &.status-regular {
                                    color: #e11c4a;
                                }
                                &.status-active {
                                    color: #ed6f31;
                                }
                                &.status-day {
                                    background: #b061f9;
                                }
                            }
                            &.class-title {
                                font-size: 13px;
                                width: 69%;
                                padding: 0 7px;
                                color: #333;
                            }
                            &.color-red {
                                padding-top: 0px;
                                font-size: 11px;
                                padding: 0 7px;
                                height: 14px;
                                // height: 28px;
                                display: inline-block;
                                overflow: hidden;
                                color: #666 !important;
                            }
                        }
                    }
                }
            }
        }
        .class-box {
            margin: -10px;
            margin-top: 20px;
            background: #fff;
            position: relative;

            .trans-img {
                position: absolute;
                bottom: 7px;
                left: 2.5%;
                width: 95%;
                height: 45px;
                margin-left: 2px;
            }
            > img {
                width: 100%;
            }
            .overview {
                background: #ed174b;
                // height: 22px;
                overflow: hidden;
                padding: 3px 10px;
                border-radius: 20px 20px 0 0;
                div {
                    font-size: 15px;
                    color: #fff;
                    padding: 0 7px;
                    line-height: 20px;
                    float: left;
                    box-sizing: border-box;
                    letter-spacing: -0.5px;
                    &:last-child {
                        text-align: right;
                    }
                    &.overview-title {
                        text-align: center;
                        font-size: 15px;
                        float: left;
                        display: inline-block;
                        line-height: 37px;
                        .live {
                            background: rgba(255, 255, 255, 0.8);
                            color: #eb4060;
                            padding: 3px 4px;
                            font-size: 10px;
                            font-weight: bold;
                            border-radius: 40px;
                            margin-left: 5px;
                            letter-spacing: 0.6px;
                        }
                    }
                    &.overview-right {
                        float: right;
                        font-size: 12px;
                        line-height: 16px;
                        margin-top: 5px;
                        p {
                            text-align: right;
                        }
                        p.date {
                            font-size: 11px;
                            margin-bottom: -3px;
                        }
                    }
                }
            }
            .class-tab {
                width: 100%;
                display: block;
                li {
                    text-align: center;
                    float: left;
                    width: 33.3%;
                    padding: 5px 0;
                    font-size: 13px;
                    cursor: pointer;
                    color: #c0c0c0;
                    background: #f5f5f5;
                    &.active {
                        color: #eb4060;
                        background: #fff;
                    }
                }
                // display: block;
                &.branch {
                    display: none;
                }
            }
            .class-list {
                &::-webkit-scrollbar-track {
                    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0);
                    border-radius: 0px;
                    background-color: #e0e0e0;
                }
                &::-webkit-scrollbar {
                    width: 12px;
                    background-color: #ccc;
                }
                &::-webkit-scrollbar-thumb {
                    border-radius: 0px;
                    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
                    background-color: #ccc;
                }
                border-bottom: 1px solid #ededed;
                // margin-top: -6px;
                border-top: 0;
                width: 100%;
                // border: 2px solid #891635;
                // border: 2px solid #ddd;
                background: #f1f1f1;
                box-sizing: border-box;
                overflow: hidden;
                // height: 426px;
                height: 170px;
                display: block;
                li {
                    background: #fff;
                    // border-bottom: 1px solid #e2e2e2;
                    // margin: 10px;
                    padding: 5px 0;
                    &:last-child {
                        border-bottom: 0;
                        // margin-bottom: 0;
                        margin-bottom: 90px;
                    }
                    &.active {
                        background: #d9d9d9 !important;
                        td,
                        a {
                            color: #333 !important;
                        }
                    }
                    // &:last-child {
                    // }
                    cursor: pointer;
                    &.active {
                        background: #e11c4a;
                        td,
                        a {
                            color: #fff;
                            &.color-red {
                                color: #fff;
                            }
                        }
                    }
                    table {
                        td {
                            &:last-child {
                                // text-align: right;
                            }
                            span.circle-number {
                                color: #fff;
                                font-size: 12px;
                                font-weight: bold;
                                background: #eee;
                                border-radius: 50%;
                                width: 20px;
                                height: 20px;
                                display: inline-block;
                                text-align: center;
                                line-height: 20px;
                                &.nailart {
                                    background: #fe9684;
                                }
                                &.makeup {
                                    background: #ee8fa5;
                                }
                                &.esthetic {
                                    background: #b18acf;
                                }
                                &.hair {
                                    background: #b3ceca;
                                }
                                &.special {
                                    background: #f3c35e;
                                }
                            }
                            img {
                                width: 40px;
                                margin: 0 6px;
                                margin-left: 0;
                            }
                            a {
                                width: 60px;
                                padding-top: 5px;
                                padding-bottom: 5px;
                                display: inline-block;
                                // color: #fff !important;
                                font-size: 14px;
                                vertical-align: middle;
                                text-align: center;
                                margin-left: 10px;
                                // background: #df5cac;
                                &.status-regular {
                                    color: #e11c4a !important;
                                }
                                &.status-active {
                                    color: #ed6f31 !important;
                                }
                                &.status-day {
                                    background: #b061f9 !important;
                                }
                            }
                            &.class-title {
                                font-size: 13px;
                                width: 69%;
                                padding: 0 7px;
                                color: #333;
                            }
                            &.color-red {
                                padding-top: 0px;
                                font-size: 11px;
                                padding: 0 7px;
                                height: 14px;
                                // height: 28px;
                                display: inline-block;
                                overflow: hidden;
                                color: #666 !important;
                            }
                        }
                    }
                }
            }
        }
        .arrow-area {
            // margin: -10px;
            clear: both;
            overflow: hidden;
            // margin-top: -9px;
            background: #f5f5f5;
            padding-top: 10px;
            border-bottom: 1px solid #ededed;
            > div {
                &:first-child {
                    border-right: 1px solid #ededed;
                }
                padding-top: 5px;
                margin-bottom: 2px;
                box-sizing: border-box;
                // border-top: 1px solid #ccc;
                text-align: center;
                img {
                    display: inline-block !important;
                    width: 7% !important;
                    &.active {
                        background: rgba(0, 0, 0, 0.1);
                    }
                }
            }
        }
    }
}

.class-box.fixed {
    background: #fff;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 10;
    .trans-img {
        position: absolute;
        bottom: 7px;
        left: 2.5%;
        width: 95%;
        height: 45px;
        margin-left: 2px;
    }
    > img {
        width: 100%;
    }
    .arrow-area {
        clear: both;
        overflow: hidden;
        // margin-top: -9px;
        background: #f1f1f1;
        padding-top: 10px;
        border-top: 1px solid #ccc;
        border-bottom: 1px solid #ccc;
        > div {
            &:first-child {
                border-right: 1px solid #ccc;
            }
            padding-top: 5px;
            margin-bottom: 2px;
            box-sizing: border-box;
            // border-top: 1px solid #ccc;
            text-align: center;
            img {
                display: inline-block !important;
                width: 10% !important;
                &.active {
                    background: rgba(0, 0, 0, 0.1);
                }
            }
        }
    }
    .overview {
        background: #e11c4a;
        // height: 22px;
        overflow: hidden;
        padding: 2px 0;
        div {
            font-size: 15px;
            color: #fff;
            padding: 0 7px;
            line-height: 20px;
            float: left;
            box-sizing: border-box;
            letter-spacing: -0.5px;
            &:last-child {
                text-align: right;
            }
            &.overview-title {
                text-align: center;
                font-size: 18px;
                float: left;
                display: inline-block;
                line-height: 37px;
            }
            &.overview-right {
                float: right;
                font-size: 12px;
                p {
                    text-align: right;
                }
                p.date {
                    font-size: 11px;
                    margin-bottom: -3px;
                }
            }
        }
    }
    .class-tab {
        width: 100%;
        display: block;
        li {
            text-align: center;
            float: left;
            width: 33.3%;
            padding: 5px 0;
            font-size: 13px;
            color: #c0c0c0;
            cursor: pointer;
            background: #fff;
            &.active {
                color: #333;
                background: #ebebeb;
            }
        }
        // display: block;
        &.branch {
            display: none;
        }
    }
    .class-list {
        &::-webkit-scrollbar-track {
            -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0);
            border-radius: 0px;
            background-color: #e0e0e0;
        }
        &::-webkit-scrollbar {
            width: 12px;
            background-color: #ccc;
        }
        &::-webkit-scrollbar-thumb {
            border-radius: 0px;
            -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
            background-color: #ccc;
        }
        display: block;
        border-bottom: 1px solid #ccc;
        // margin-top: -6px;
        border-top: 0;
        width: 100%;
        // border: 2px solid #891635;
        // border: 2px solid #ddd;
        background: #f1f1f1;
        box-sizing: border-box;
        overflow: auto;
        // height: 426px;
        height: 120px;
        li {
            border-bottom: 1px solid #e2e2e2;
            // margin: 10px;
            padding: 5px 0;
            &:last-child {
                border-bottom: 0;
                // margin-bottom: 0;
                margin-bottom: 90px;
            }
            &.active {
                background: #bf1d43;
            }
            // &:last-child {
            // }
            cursor: pointer;
            &:hover,
            &.active {
                background: #bf1d43;
                td,
                a {
                    color: #fff !important;
                }
            }
            table {
                td {
                    &:last-child {
                        // text-align: right;
                    }
                    span.circle-number {
                        color: #fff;
                        font-size: 12px;
                        font-weight: bold;
                        background: #eee;
                        border-radius: 50%;
                        width: 20px;
                        height: 20px;
                        display: inline-block;
                        text-align: center;
                        line-height: 20px;
                        &.nailart {
                            background: #fe9684;
                        }
                        &.makeup {
                            background: #ee8fa5;
                        }
                        &.esthetic {
                            background: #b18acf;
                        }
                        &.hair {
                            background: #b3ceca;
                        }
                        &.special {
                            background: #f3c35e;
                        }
                    }
                    img {
                        width: 40px;
                        margin: 0 6px;
                        margin-left: 0;
                    }
                    a {
                        width: 60px;
                        padding-top: 5px;
                        padding-bottom: 5px;
                        display: inline-block;
                        // color: #fff !important;
                        font-size: 14px;
                        vertical-align: middle;
                        text-align: center;
                        margin-left: 10px;
                        // background: #df5cac;
                        &.status-regular {
                            color: #e11c4a;
                        }
                        &.status-active {
                            color: #ed6f31;
                        }
                        &.status-day {
                            background: #b061f9;
                        }
                    }
                    &.class-title {
                        font-size: 13px;
                        width: 69%;
                        padding: 0 7px;
                        color: #333;
                    }
                    &.color-red {
                        padding-top: 0px;
                        font-size: 11px;
                        padding: 0 7px;
                        height: 14px;
                        // height: 28px;
                        display: inline-block;
                        overflow: hidden;
                    }
                }
            }
        }
    }
}

.public-funds-page {
    div {
        box-sizing: border-box;
    }
    .label {
        background: #424f6f;
        color: #eee;
    }
    .lg-text {
        font-size: 16px;
        line-height: 16px;
    }
    .colored {
        color: #4a529f;
    }
    .bg-colored {
        background: #424f6f;
        color: #fff;
    }
    .step-box {
    }
    .apply-box {
        letter-spacing: -0.5px;
        font-size: 16px;
        line-height: 16px;
        .round-button {
            border-radius: 25px;
            border: 1px solid #424f6f;
            padding: 8px 18px;
            margin-bottom: 10px;
            color: #4a529f;
            display: inline-block;
        }
        p {
            font-size: 14px;
            line-height: 1.3rem;
            &.apply-text-xs {
                font-size: 12px;
                line-height: 1.2rem;
            }
            &.apply-text-xxs {
                font-size: 11px;
                line-height: 1.2rem;
            }
        }
        .border-right {
            border-right: 1px solid #666;
        }
        a {
            border-bottom: 1px solid #666;
        }
    }
    .course-table {
        th {
            padding: 15px;
            text-align: center;
            font-size: 14px;
            font-weight: 500;
            color: #4a529f;
            background: #eceff1;
            border: 1px solid #d3d6d7;
        }
        td {
            padding: 15px;
            color: #333;
            font-size: 12px;
            text-align: left;
            padding-left: 20px;
            padding-right: 20px;
            letter-spacing: -0.5px;
            border-bottom: 1px solid #d3d6d7;
            border-right: 1px solid #d3d6d7;
            background: #fff;
            &.center {
                border-left: 1px solid #d3d6d7;
                letter-spacing: 0px;
                // padding: 0;
                text-align: center;
                font-size: 14px;
                background: #fafafa;
            }
            a {
                color: #4a529f;
                font-size: 11px;
            }
        }
    }
}

.modal-menthor-new {
    border-radius: 20px 20px 0 0;
    position: fixed;
    padding: 13px !important;
    bottom: 52px !important;
    .page-modal-bg {
        background: none;
        border-bottom: 2px solid #fa3d5b;
        text-align: left;
        .page-title {
            font-weight: 300;
            font-size: 19px;
        }
    }
    .menthor-content {
        height: 70vh;
        overflow-y: scroll;
        .img-box {
            background: none !important;
            text-align: center;
            img {
                height: 35px;
            }
            p {
                color: #333 !important;
            }
        }
        table {
            tr {
                background: none !important;
                td {
                    &.label-box {
                        padding-right: 0 !important;
                        label {
                            margin-bottom: 5px;
                        }
                    }
                    small {
                        font-size: 10px !important;
                    }
                }
            }
        }
    }
    .ask-complete-button {
        background: #363c3a;
        width: calc(100% + 40px);
        padding: 14px 0;
        color: #fff;
        font-size: 15px;
        position: absolute;
        bottom: -66px;
        left: -20px;
        border: 0;
        -webkit-box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.75);
        -moz-box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.75);
        box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.75);
    }
    ul.footer-navigation {
        padding: 10px 0;
        border-top: 1px solid #9da6ab;
        bottom: 0;
        left: 0;
        background: #fff;
        z-index: 5;
        overflow: hidden;
        width: 100%;
        margin: auto;
        &.active {
            position: fixed;
            display: block;
        }
        li {
            display: table;
            width: 50%;
            box-sizing: border-box;
            float: left;
            height: 45px;
            text-align: center;
            background: url(/assets/images/mobile/footer_line.png) no-repeat;
            background-size: 1px;
            background-position: right center;
            &:last-child {
                background: none;
            }
            // &.text {
            //   line-height: 45px;
            //   font-size: 14px;
            //   color: #e41e4f;
            //   font-weight: bold;
            //   letter-spacing: -0.5px;
            // }
            a {
                display: table-cell;
                vertical-align: middle;
                width: 100%;
                img {
                    margin-top: 3px;
                    width: 55%;
                }
            }
        }
    }
}

.modal-menthor-new {
    select:focus,
    textarea:focus,
    input:focus {
        outline: none !important;
        outline-width: 0 !important;
        box-shadow: none;
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
    }
    .select-box {
        position: relative;
        margin-right: 15px;
        margin-left: 10px;
        &::after {
            content: "";
            width: 9px;
            height: 7px;
            background: url(/assets/images/front/ask/bottomm2.png) no-repeat;
            top: 8px;
            right: 0px;
            position: absolute;
            display: inline-block;
            background-size: 100%;
        }
    }
    select {
        background: #fff;
        -webkit-appearance: none;
        -moz-appearance: none;
        padding: 0;
        border: 0;
        font-size: 13px;
    }
    .check-agree {
        font-weight: bold;
        border-bottom: 1px solid #666;
        font-size: 12px;
    }
    input[type="text"],
    .modal-menthor2 .menthor-content input[type="text"] {
        background: #fff !important;
        padding-left: 15px !important;
        height: initial !important;
        color: #333 !important;
        margin-left: -5px !important;
        font-size: 12px;
    }
    input[name="name"] {
        vertical-align: super !important;
    }
    [name="askPurpose"] {
        display: inline-block !important;
    }
    [name="branchGroupNo"] {
        margin-left: 6px;
        width: calc(100% - 45px) !important;
        vertical-align: super !important;
    }
    textarea {
        background: #f2f2f2 !important;
        width: 100% !important;
        color: #333 !important;
    }
    .phone-box {
        vertical-align: super !important;
        padding-left: 14px !important;
        background: #fff !important;
        padding: 0 17px;
        height: initial !important;
        margin-top: 17px !important;
        [name="phone1"] {
            width: 35px;
            border: 0;
            vertical-align: middle;
        }
        [name="phone3"] {
            padding-left: 0 !important;
        }
        .dash {
            color: #333 !important;
            line-height: initial !important;
        }
        .select-box {
            margin-left: 0;
            margin-right: 10px;
            &::after {
                top: 9px;
                right: -12px;
            }
        }
    }
    .border {
        height: 2px;
        background: #f73f5b;
        margin: 10px 0;
    }
    .input-outerbox {
        .row {
            border-bottom: 1px solid #ccc;
            padding-bottom: 10px;
        }
        img {
            display: inline-block;
            width: 20px;
            padding-top: 10px;
            padding-right: 2px;
        }
        .purpose {
            .inner-box {
                vertical-align: super;
                font-size: 12px;
                span {
                    display: inline-block;
                    letter-spacing: -1px;
                }
            }
            select {
                width: 70px;
                font-size: 12px;
                letter-spacing: -0.5px;
                border: 0;
                text-align: center !important;
                color: #000;
                option {
                    text-align: center !important;
                }
            }
        }
    }
}

.section-ask {
    // display: none;
    .m-newask {
        .table-row {
            display: none !important;
        }
        .border {
            display: none !important;
        }
    }
    input {
        border: 0;
        outline: 0;
        background: none;
        vertical-align: super !important;
        box-shadow: none;
        font-size: 13px;
        padding: 0 10px;
    }
    textarea {
        background: #f2f2f2 !important;
        width: 100% !important;
        color: #333 !important;
        height: 138px;
        font-size: 13px;
        border: none;
    }
    img {
        display: inline-block;
        width: 20px;
        padding-top: 10px;
        padding-right: 2px;
    }
    .branch-group {
        margin-bottom: 0 !important;
    }
    .purpose {
        span {
            display: inline-block;
            letter-spacing: -1px;
        }
        .select-box {
            position: relative;
            margin-right: 10px;
            margin-left: 10px;
        }
        select {
            outline: 0;
            width: 76px;
            background: none;
            font-size: 12px;
            letter-spacing: -1px;
            border: 0;
            text-align: center !important;
            color: #000;
        }
        [name="branchGroupNo"] {
            margin-left: 6px;
            width: calc(100% - 45px) !important;
            vertical-align: super !important;
        }
    }
    .phone-box {
        vertical-align: super !important;
        padding-left: 11px !important;
        background: none !important;
        padding: 0 17px;
        height: initial !important;
        input {
            vertical-align: middle !important;
            margin-top: 0 !important;
        }
        .select-box {
            position: relative;
            select {
                outline: 0;
                width: 50px;
                border: 0;
                vertical-align: middle;
                background: none;
                font-size: 12px;
                letter-spacing: -0.5px;
                text-align: center !important;
            }
        }
    }
    .ask-complete-button {
        margin-top: 20px;
        background: #363c3a;
        width: calc(100%);
        padding: 10px 0;
        color: #fff;
        font-size: 15px;
        border: 0;
        -webkit-box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.75);
        box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.75);
    }
}

.members-list {
    padding: 5% !important;
    .row {
        .con-box {
            // padding-bottom: 10px;
            width: 48% !important;
            padding: 0 5px 10px 5px !important;
            &:nth-child(2n) {
                float: right;
            }
        }
    }
}

.swiper-container {
    width: 100%;
    height: 35px;

    .swiper-pagination-h {
        left: 50%;
        width: 500px;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
    }
}

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

.swiper-slide {
    height: 100%;
    width: 100%;

    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

.swiper-button-next,
.swiper-button-prev {
    /* In safari, the buttons disappear on some slide,
  to fix this issue set translate3D z axis to 1px */
    -webkit-transform: translate3d(0, 0, 1px);
    -ms-transform: translate3d(0, 0, 1px);
    -o-transform: translate3d(0, 0, 1px);
    transform: translate3d(0, 0, 1px);
}

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

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

.swiper-button-up,
.swiper-button-down {
    right: 20px;
    position: absolute;
    z-index: 20;

    &:before {
        content: "";
        cursor: pointer;
        height: 20px;
        width: 20px;
        position: absolute;
        background-repeat: no-repeat;
    }
}

.swiper-button-down {
    bottom: 25%;
    &:before {
        background-image: url("/assets/images/front/main/artistcrew/black_arrow_down.png");
    }
}

.swiper-button-up {
    top: 25%;
    &:before {
        background-image: url("/assets/images/front/main/artistcrew/black_arrow_up.png");
    }
}

.swiper-pagination-bullet {
    opacity: 0.5;
    border-radius: 100%;
    background: rgb(255, 255, 255);
}

.swiper-pagination-bullet-active {
    opacity: 1;
    background-color: rgb(255, 255, 255);
}

.modal-center {
    .page-title {
        img {
            max-width: 100%;
        }
    }
}