.switchMenu {
    width: 100%;
    position: relative;
    float: left;
}

.switchMenu.redBorder {
    border-top: 1px #EC1C24 solid;
}

.switchMenu.blueBorder {
    border-top: 1px #3197FF solid;
}

.switchMenu .menu {
    width: 100%;
    height: 100px;
}

.switchMenu .menu .packageIcon {
    width: 31px;
    vertical-align: middle;
    margin-right: 10px;
}

.switchMenu .menu .cartIcon {
    height: 38px;
    vertical-align: middle;
    margin-right: 25px;
}

.switchMenu .menu .legarrowIcon {
    height: 36px;
    vertical-align: middle;
    margin-left: 25px;
}

.switchMenu .menu.active .redArrow {
    left: 75% !important;
}

.monoSwitch.switchMenu .menu .redArrow {
    left: 50% !important;
}

.monoSwitch.switchMenu .menu.active .redArrow {
    left: 50% !important;
}

.switchMenu .menu .redArrow {
    position: relative;
    left: 25%;
    width: 37px;
    margin-left: -18.5px;
    margin-top: -25px;
}

.switchMenu .menu .box {
    width: 50%;
    height: 100px;
    float: left;
    text-align: center;
    font-size: 2.4vw;
    letter-spacing: 1.87px;
    position: relative;
    cursor: pointer;
}

.monoSwitch.switchMenu .menu .box {
    width: 100%;
}

.switchMenu .menu .box .text:hover {
    opacity: 0.7;
}

.switchMenu .menu .box .text {
    width: 100%;
    line-height: 54px;
    vertical-align: middle;
    position: absolute;
    text-align: center;
    top: 50%;
    margin-top: -27px;
}

.switchMenu .menu .box .rightBorder {
    border-right: 1px #ACACAC dotted;
}

.switchMenu .switchLine {
    width: 100%;
    height: 7px;
    background-color: #CD0000;
}

.switchMenu {
    width: 100%;
}

.SliderforSwitchMenu {
    position: relative;
}

.switchMenu .imageBox {
    height: 100%;
    width: 100%;
}

.switchMenu .imageBox.boxColor1 {
    background-color: #EBEBEB !important;
}

.switchMenu .imageBox.boxColor2 {
    background-color: #F4F4F4 !important;
}

.switchMenu .imageBox .mainImage {
    position: relative;
    width: 100%;
}

.switchMenu .imageBox .mainImage img {
    width: 100%;
}

@media(max-width:768px) {
    .switchMenu .imageBox .mainImage img {
        width: 80%;
        margin-left: 10%;
        margin-top: 12%;
        border-radius: 5px;
    }
}

.switchMenu .imageBox .mainImage .arrowBoxColor1 {
    position: absolute;
    width: 37px;
    height: 37px;
    border-radius: 3px;
    background-color: #EBEBEB;
    left: 50%;
    margin-left: -18.5px;
    bottom: 0px;
    z-index: 100;
    margin-bottom: -20px;
}

.switchMenu .imageBox .mainImage .arrowBoxColor2 {
    position: absolute;
    width: 37px;
    height: 37px;
    border-radius: 3px;
    background-color: #F4F4F4;
    left: 50%;
    margin-left: -18.5px;
    bottom: 0px;
    z-index: 100;
    margin-bottom: -20px;
}

.switchMenu .imageBox .textBox {
    padding-top: 34px;
    padding-left: 48px;
    padding-right: 48px;
    position: relative;
}

.switchMenu .imageBox .textBox h2 {
    padding-left: 7px;
    padding-right: 7px;
    width: 100%;
    overflow: hidden;
    font-size: 1.7rem;
    color: #D31119;
}

.package .textBox h2 {
    color: #3197FF !important;
}

.switchMenu .imageBox .textBox .description {
    padding-left: 7px;
    padding-right: 7px;
    color: #393939;
    font-size: 1.3rem;
    line-height: 2.2rem;
    margin-top: 20px;
}

.switchMenu .imageBox .textBox .ellipsis img {
    width: 40px !important;
    opacity: 0.2;
    padding-top: 15px;
    padding-left: 7px;
    display: none;
}

.switchMenu .imageBox .textBox .wrapTextBox {
    overflow: auto;
    height: 100%;
}

.switchMenu .imageBox .buttonBox {
    width: 100%;
    left: 0px;
    margin-top: 30px;
    margin-bottom: 30px;
}

.switchMenu .imageBox .buttonBox button {
    width: 100%;
    padding-top: 10px;
    padding-bottom: 10px;
    letter-spacing: 0.15vw;
    border-radius: 9px;
    text-align: center;
    font-size: 1.3vw;
    text-transform: uppercase;
    border: 1px transparent solid;
    outline: none;
    color: #fff;
    padding-left: 20px;
    padding-right: 20px;
    cursor: pointer;
    border: 1px #EC1C24 solid;
    background: rgba(186, 0, 0, 1);
    background: -moz-linear-gradient(left, rgba(186, 0, 0, 1) 0%, rgba(233, 0, 0, 1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(186, 0, 0, 1)), color-stop(100%, rgba(233, 0, 0, 1)));
    background: -webkit-linear-gradient(left, rgba(186, 0, 0, 1) 0%, rgba(233, 0, 0, 1) 100%);
    background: -o-linear-gradient(left, rgba(186, 0, 0, 1) 0%, rgba(233, 0, 0, 1) 100%);
    background: -ms-linear-gradient(left, rgba(186, 0, 0, 1) 0%, rgba(233, 0, 0, 1) 100%);
    background: linear-gradient(to right, rgba(186, 0, 0, 1) 0%, rgba(233, 0, 0, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#ba0000', endColorstr='#e90000', GradientType=1);
}

.switchMenu.package .imageBox .buttonBox button {
    background: #3197FF !important;
    border: 1px transparent solid !important;
}

.switchMenu .imageBox .textBox .buttonBox button:hover {
    background: transparent;
    color: #EC1C24;
    border: 1px #EC1C24 solid !important;
    cursor: pointer;
}

.switchMenu.package .imageBox .buttonBox button:hover {
    border: 1px #3197FF solid !important;
    background: transparent !important;
    color: #3197FF;
    cursor: pointer;
}

@media only screen and (min-width: 769px) and (max-width: 991px) {
    .switchMenu .imageBox .mainImage {
        position: relative;
        width: 40%;
        float: left;
    }
    .monoSwitch.switchMenu.package.centerAndClinic {
        margin-top: -30px;
    }
    .switchMenu .imageBox .mainImage img {
        width: 100%;
    }
    .switchMenu .imageBox .mainImage .arrowBoxColor1 {
        position: absolute;
        width: 37px;
        height: 37px;
        border-radius: 3px;
        background-color: #EBEBEB;
        left: 100%;
        margin-left: -16.5px;
        bottom: 50%;
        z-index: 100;
        margin-bottom: -18.5px;
    }
    .switchMenu .imageBox .mainImage .arrowBoxColor2 {
        position: absolute;
        width: 37px;
        height: 37px;
        border-radius: 3px;
        background-color: #F4F4F4;
        left: 100%;
        margin-left: -16.5px;
        bottom: 50%;
        z-index: 100;
        margin-bottom: -18.5px;
    }
    .switchMenu .imageBox .textBox {
        padding: 5.4vw;
        width: 60%;
        float: left;
    }
    .switchMenu .imageBox .textBox h2 {
        padding-left: 1vw;
        padding-right: 1vw;
        max-width: 80%;
        overflow: hidden;
        font-size: 2.8vw;
    }
    .switchMenu .imageBox .textBox .description {
        padding-left: 1vw;
        padding-right: 1vw;
        max-width: 80%;
        color: #393939;
        font-size: 2vw;
        line-height: 2.8vw;
        margin-top: 1.6vw;
        height: 8.4vw;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .switchMenu .imageBox .textBox .ellipsis img {
        width: 5vw !important;
        opacity: 0.2;
        padding-top: 0vw;
        padding-left: 1vw;
    }
    .switchMenu .imageBox .textBox .wrapTextBox {
        text-overflow: ellipsis;
        word-wrap: break-word;
        overflow: hidden;
        height: 14vw;
        margin-bottom: 1vw;
    }
    .switchMenu .imageBox .textBox .buttonBox {
        max-width: 80%;
        margin-top: 2vw;
    }
    .switchMenu .imageBox .textBox .buttonBox button {
        width: 100%;
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
        letter-spacing: 0.15vw;
        border-radius: 9px;
        text-align: center;
        font-size: 1.1rem;
        text-transform: uppercase;
        border: 0.4vw transparent solid;
        outline: none;
        color: #fff;
        padding-left: 2.4vw;
        padding-right: 2.4vw;
        cursor: pointer;
        border: 1px #EC1C24 solid;
        background: rgba(186, 0, 0, 1);
        background: -moz-linear-gradient(left, rgba(186, 0, 0, 1) 0%, rgba(233, 0, 0, 1) 100%);
        background: -webkit-gradient(left top, right top, color-stop(0%, rgba(186, 0, 0, 1)), color-stop(100%, rgba(233, 0, 0, 1)));
        background: -webkit-linear-gradient(left, rgba(186, 0, 0, 1) 0%, rgba(233, 0, 0, 1) 100%);
        background: -o-linear-gradient(left, rgba(186, 0, 0, 1) 0%, rgba(233, 0, 0, 1) 100%);
        background: -ms-linear-gradient(left, rgba(186, 0, 0, 1) 0%, rgba(233, 0, 0, 1) 100%);
        background: linear-gradient(to right, rgba(186, 0, 0, 1) 0%, rgba(233, 0, 0, 1) 100%);
        filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#ba0000', endColorstr='#e90000', GradientType=1);
    }
    .switchMenu .imageBox .textBox .buttonBox button:hover {
        background: transparent;
        color: #EC1C24;
    }
    .switchMenu.package .imageBox .textBox .buttonBox button:hover {
        border: 1px #3197FF solid;
        background-color: transparent !important;
        color: #3197FF;
    }
    .slider {
        width: 100%;
    }
    .slick-slide img {
        width: 100%;
    }
    .slick-prev:before,
    .slick-next:before {
        color: black;
    }
    .slick-slide {
        transition: all ease-in-out .3s;
        opacity: 1;
    }
    .slick-active {
        opacity: 1;
    }
    .slick-current {
        opacity: 1;
    }
    .switchDot {
        position: absolute;
        z-index: 200;
        width: 260px;
        left: 40%;
        bottom: 0%;
        margin-bottom: 10vw;
    }
    .switchDot .slick-dots li {
        width: 2vw;
    }
    .switchDot .slick-dots li button:before {
        font-size: 2vw;
    }
}

@media only screen and (max-width: 768px) {
    .switchMenu {
        width: 100%;
        position: relative;
        background-color: #EBEBEB;
    }
    .switchMenu .menu {
        width: 100%;
        height: 32vw;
        position: relative;
        padding-top: 3vw;
        background-color: #F4F4F4;
    }
    .package.switchMenu .menu {
        height: 24vw;
    }
    .monoSwitch.switchMenu .menu {
        width: 100%;
        height: 23vw;
        position: relative;
        padding-top: 3vw;
        background-color: #F4F4F4;
    }
    .switchMenu .menu .hospitalShop {
        display: none;
    }
    .switchMenu .menu .packageIcon {
        display: none;
    }
    .switchMenu .menu .cartIcon {
        display: none;
    }
    .switchMenu .menu .legarrowIcon {
        display: none;
    }
    .switchMenu .menu .redArrow {
        position: relative;
        left: 5%;
        width: 9vw;
        top: -17vw;
        margin-left: 0px;
        margin-top: -11.4vw;
        -ms-transform: rotate(90deg);
        /* IE 9 */
        -webkit-transform: rotate(90deg);
        /* Chrome, Safari, Opera */
        transform: rotate(90deg);
    }
    .switchMenu .menu.active .redArrow {
        left: 5% !important;
        top: -3.6vw;
    }
    .switchMenu.package .menu .redArrow {
        position: relative;
        left: 5%;
        width: 9vw;
        top: 0vw;
        margin-left: 0px;
        margin-top: -26vw;
        -ms-transform: rotate(90deg);
        /* IE 9 */
        -webkit-transform: rotate(90deg);
        /* Chrome, Safari, Opera */
        transform: rotate(90deg);
    }
    .monoSwitch.switchMenu .menu .redArrow {
        position: relative;
        left: 5% !important;
        width: 9vw;
        top: 0vw !important;
        margin-left: 0px;
        margin-top: -18vw !important;
        -ms-transform: rotate(90deg);
        /* IE 9 */
        -webkit-transform: rotate(90deg);
        /* Chrome, Safari, Opera */
        transform: rotate(90deg);
    }
    .monoSwitch.switchMenu.package .menu .redArrow {
        position: relative;
        left: 5% !important;
        width: 9vw;
        top: 0vw !important;
        margin-left: 0px;
        margin-top: -30vw !important;
        -ms-transform: rotate(90deg);
        /* IE 9 */
        -webkit-transform: rotate(90deg);
        /* Chrome, Safari, Opera */
        transform: rotate(90deg);
    }
    .switchMenu .menu .borderBottom {
        border-bottom: 1px #979797 dashed;
    }
    .switchMenu .menu .box {
        width: 100%;
        height: 14vw;
        float: left;
        text-align: left;
        font-size: 5.6vw;
        letter-spacing: 0px;
        position: relative;
        cursor: pointer;
        margin-left: 15vw;
    }
    .switchMenu.package .menu .box {
        width: 100%;
        height: 20vw;
        float: left;
        text-align: left;
        font-size: 5.6vw;
        letter-spacing: 0px;
        position: relative;
        cursor: pointer;
        margin-left: 15vw;
    }
    .switchMenu .menu .box:hover {
        opacity: 0.7;
    }
    .switchMenu .menu .box .text {
        width: 100%;
        line-height: 0px;
        vertical-align: middle;
        position: absolute;
        text-align: left;
        padding-left: 0vw;
        top: 50%;
        margin-top: 0px;
    }
    .switchMenu.package .menu .box .text {
        width: 100%;
        line-height: 6.2vw;
        vertical-align: middle;
        position: absolute;
        text-align: left;
        padding-left: 0vw;
        top: 50%;
        margin-top: -7vw;
        justify-content: start !important;
    }
    .switchMenu .menu .box .rightBorder {
        border-right: 1px #ACACAC dotted;
    }
    .switchMenu .switchLine {
        display: none;
    }
    .switchMenu .switchLineMobile.red {
        background-color: #CD0000;
        width: 3vw;
        height: 100%;
        position: absolute;
        z-index: 100;
        -webkit-clip-path: polygon(0 0, 100% 1.7%, 100% 100%, 0% 100%);
        clip-path: polygon(0 0, 100% 1.7%, 100% 100%, 0% 100%);
    }
    .switchMenu .switchLineMobile.blue {
        background-color: #3197FF;
        width: 3vw;
        height: 100%;
        position: absolute;
        z-index: 100;
        -webkit-clip-path: polygon(0 0, 100% 0%, 100% 98.3%, 0% 100%);
        clip-path: polygon(0 0, 100% 0%, 100% 98.3%, 0% 100%);
    }
    .switchMenu .wrapTextBox {
        text-overflow: ellipsis;
        word-wrap: break-word;
        overflow: hidden;
        height: 33.3vw;
    }
    .ellipsis {}
    .ellipsis img {
        width: 40px;
        opacity: 0.2;
        padding-top: 15px;
        padding-left: 7px;
    }
    .switchMenu .imageBox .textBox {
        padding: 8.4vw;
        padding-bottom: 3vw;
        width: 100%;
        float: left;
    }
    .switchMenu .imageBox .textBox h2 {
        padding-left: 2vw;
        padding-right: 2vw;
        width: 100%;
        overflow: hidden;
        font-size: 6.2vw;
    }
    .switchMenu .imageBox .textBox .description {
        padding-left: 2vw;
        padding-right: 2vw;
        color: #393939;
        font-size: 4.2vw;
        line-height: 5.4vw;
        margin-top: 3vw;
        height: 16.2vw;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .switchMenu .imageBox .textBox .ellipsis {
        display: none;
    }
    .switchMenu .imageBox .textBox .wrapTextBox {
        text-overflow: ellipsis;
        word-wrap: break-word;
        overflow: hidden;
        height: 26vw;
        margin-bottom: 1vw;
    }
    .switchMenu .imageBox .textBox .buttonBox {
        width: 100%;
        margin-top: 4vw;
    }
    .switchMenu .imageBox .textBox .buttonBox button {
        width: 100%;
        padding-top: 3vw;
        padding-bottom: 3vw;
        letter-spacing: 0.15vw;
        border-radius: 9px;
        text-align: center;
        font-size: 3.8vw;
        text-transform: uppercase;
        border: 0.4vw transparent solid;
        outline: none;
        color: #fff;
        padding-left: 6vw;
        padding-right: 6vw;
        cursor: pointer;
    }
    .switchDot {
        position: absolute;
        z-index: 200;
        width: 100%;
        text-align: center;
        left: 0%;
        margin-top: 3vw;
    }
    .switchDot .slick-dots li {
        width: 5vw;
    }
    .switchDot .slick-dots li button:before {
        font-size: 6vw;
    }
    .switchMenu .imageBox.boxColor2 {
        background-color: #EBEBEB !important;
    }
    .switchMenu .imageBox .mainImage .arrowBoxColor2 {
        background-color: #EBEBEB;
    }
}


/*THAI FONT*/

@media(min-width: 993px) {
    .Paethai {
        font-size: 19px !important;
    }
}

@media(max-width: 768px) {
    .Paethai {
        font-size: 5vw;
    }
    .switchMenu {
        border-bottom: 3px solid #ffffff;
    }
    .switchMenu .moreButton {
        width: 65px;
    }
    .switchMenu .moreButton i {
        font-size: 2.2rem;
    }
    .switchMenu .moreButton .text {
        font-size: 1.1rem;
    }
    .slick-disabled {
        opacity: 0.5;
    }
}

@media(min-width: 769px) {
    .Paethai {
        font-size: 18px !important;
    }
}