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

:root {
    --skyblue:#3870c5;
    --lightblue: #d9f0ff;
    --blue:#003b95;
    --darkblue:#080d16;
    --orange:#ff5b00;
    --box-shadow:0 2px 8px 0 rgba(26,26,26,0.16);
}


header, footer, section, nav {display: block}
.width100 {float: left; width: 100%}

#main-toc {float: left; margin: 20px 0;font-size: 20px; width: 100%; position: relative; cursor: pointer; border: 1px solid #ccc; padding: 5px 10px; border-radius: 5px;
}
#main-toc:hover {color: var(--green)}

div[name="tableOfContents"] {float: left; max-width: 100%; display: none; clear: both;}
div[name="tableOfContents"]>a {color: black;  }
 
body>.container {margin-top: 50px; min-height: 500px}


.header-top {float:left; width: 100%; background: white; padding:5px; height: 50px}
.header-bottom {float: left; width: 100%; background: var(--blue); padding:0; height: 50px}
 
header {float:left; width: 100%; background:var(--blue); color:white; }
header .container {position: relative;}
header .logo {float:left; width:100%; height:40px }
header .logo img {height:30px; margin-top:7px }

header .main-menu {float: left; width: 100%}
header .main-menu>ul {padding:0}
header .main-menu>ul>li {list-style: none; float:left; padding: 4px 0; position: relative;}
header .main-menu>ul>li>a {color:white; padding:10px 20px; display: inline-block; font-size: 14px; margin-right: 5px; letter-spacing: 1px; border:1px solid transparent; border-radius: 30px;}
 
header .main-menu>ul>li .active, header .main-menu>ul>li>a:hover {background:rgba(255,255,255,.3); color:white; border:1px solid var(--skyblue)}

header .main-menu .icon {display:none;color:#333; font-style: normal;cursor:pointer; font-size:20px; position:absolute; right:10px; top:10px}
header .main-menu .icon:hover {color:#3A8CD8}
header .main-menu .main-menu-sub {display: none; z-index: 10; position: absolute; left:0; top:50px; background: white; padding: 0; box-shadow: var(--box-shadow); border-radius: 20px; overflow: hidden}
header .main-menu .main-menu-sub li:last-child a {border:none}
header .main-menu .main-menu-sub li {display: inline-block; width: 100%; white-space: nowrap;}
header .main-menu .main-menu-sub li a {color: #333; padding:10px 20px; display: inline-block; border-bottom: 1px solid #eee; border-radius: 0; width: 100%}
header .main-menu .main-menu-sub li a:hover {background: #eee}
header .main-menu>ul>li:hover .main-menu-sub {display: block}

.mobile-menu-toggle {
    display: none;
    cursor: pointer;
    position: absolute;
    top: 65px;
    right: 20px;
    transform: scale(1.3, 1.3);
    width: 30px;
    height: 20px;
}

.mobile-menu-toggle .line {
    display: block;
    width: 100%;
    height: 2px;
    background: white;
    position: absolute;
    transition: all 200ms;
}

.mobile-menu-toggle .line:nth-child(1) {
    top: 0;
}

.mobile-menu-toggle .line:nth-child(2) {
    top: 50%;
    transform: translateY(-50%);
}

.mobile-menu-toggle .line:nth-child(3) {
    bottom: 0;
}

.mobile-menu-toggle.close {
    opacity: 1;
}

.mobile-menu-toggle.close .line:nth-child(1),
.mobile-menu-toggle.close .line:nth-child(2) {
    top: 0;
    transform: translateY(9px) rotate(45deg);
}

.mobile-menu-toggle.close .line:nth-child(3) {
    transform: translateY(-9px) rotate(-45deg);
}



header .language {position: absolute; top:0; right: 10px; margin:0}
header .language>li{float: left; padding: 0 3px; list-style: none; display: inline-block;}
header .language>li img{transition: 0.5s; height: 35px; }
header .language>li:hover img{
    filter: grayscale(100%);
    transition: 0.7s;
}


footer {float:left; width: 100%; background: var(--blue); color:white}
footer .copyright {float:left; width: 100%; background: white; color:black; padding:20px 10px; text-align: center}
footer .footer-main {float: left; width: 100%; padding:40px 10px}
footer .footer-white {background: #eee; color:black}
footer .footer-white ul {padding:0; margin:0}
footer .footer-white ul li {list-style: none}

#breadcrumbs {margin:20px 0; float:left; width: 100%}
#breadcrumbs .breadcrumb {background: transparent; font-size: 12px; padding:0}

footer h2{text-transform: uppercase}
figure.image {
    text-align: center;
    background: rgba(0, 0, 0, 0.05);
    margin: 10px 0;
}

figure figcaption {padding:5px;
}
 
.news {float:left; width: 100%; margin-bottom: 20px; position: relative;}
.news .img {float:left; width: 100%; position: relative; height: 0; padding-bottom: 60%}
.news .img img {position: absolute; left:0; top:0; width: 100%; object-fit: cover; height: 100%; border-radius: 10px}
.news .info {float:left; width: 100%; }
.news .info .title {float:left; width: 100%; font-weight: bold; font-size:15px;line-height: 20px; height: 40px; overflow: hidden; margin:10px 0; color:black}
.news .info .des {float:left; width: 100%; color:#666; line-height: 20px; height: 60px; overflow: hidden;}

.news-big {height: 350px; border-radius: 10px; overflow: hidden}
.news-big .img {padding-bottom: 70%}
.news-big .info {color:white; position: absolute; bottom:0; left:0; width: 100%; padding:30% 10px 10px 10px; background:linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,1))}
.news-big .info>* {color:white !important}

.news2 .img {padding-bottom: 60%; }
.news2 .img img {border-radius: 0}
.news2 .info {background: white; width: 90%; margin:-20px 5% 0 5%; position: relative; height: 150px; padding:10px 10px; border-radius:10px;box-shadow: 0 0 10px 10px rgba(0,0,0,.1)}
.news2 .info .title {margin:0 0 20px 0}

.heading {float:left; width: 100%; font-size: 25px; font-weight: bold; margin:10px 0 20px 0;}
h3.heading {font-size: 20px}
.heading-spa {float:left; width: 100%; font-size: 20px; font-weight: bold; margin:20px 0; border-left:3px solid var(--blue) ;padding-left:10px}
.heading-home {float:left; width: 100%; font-size: 20px; font-weight: bold; margin:10px 0}
.des-home {float:left; width: 100%; margin-bottom: 20px}
.des-search {float:left; width: 100%; margin:20px 0; font-size: 15px}

.news-banner {float:left; width: 100%; height: 0; padding-bottom: 25%; position: relative; overflow: hidden; background: #eee}
.news-banner img {position:absolute; left:0; top:0; height:100%;width:100%; object-fit: cover}


.search-box {float:left; width: 100%; margin-top:-10%; position: relative; z-index: 2; }


.search-box .inner {float:left; width: 100%; position:relative;}
.search-box input {height: 60px; width: 100%; border-radius: 30px; box-shadow: var(--box-shadow); padding:20px; font-size: 15px}
.search-box button {height: 60px; background:transparent; color:black; position: absolute; top:0; right: 0; border:none; width: 80px; font-size: 25px}

.service {float:left; width: 100%; position: relative; margin-bottom: 30px; border-radius: 10px; overflow: hidden; box-shadow:var(--box-shadow)}
.service .img {float:left; width: 100%; position: relative; overflow: hidden; height: 0; padding-bottom: 80%}
.service .img img {position: absolute; left:0; top:0; width: 100%; height: 100%; object-fit: cover}
.service .info {float:left; width: 100%; padding:15px; height: 100px}
.service .info .title {float:left; width: 100%; font-weight: bold; font-size:15px;line-height: 20px; max-height: 50px; overflow: hidden;  color:black}
.service .info .des {float:left; width: 100%; color:#666; line-height: 20px; height: 60px; overflow: hidden;}
.service .info .price {font-weight: bold; color:var(--blue); margin:5px 0}
.service .info .city {width: 50%; float:left; }
.service .info .rating {width: 50%; float:left; text-align: right}
.service .info .rating span {background: var(--blue); color:white; padding:5px}
.service .info .rating span i {color:yellow}



.doitac-album {float: left; width: 100%; margin:20px 0}
.doitac-album .img {float:left; width:16.66%; height: 0; padding-bottom: 11%; position: relative;overflow: hidden; }
.doitac-album .img img {object-fit: cover; position: absolute; height: calc(100% - 15px); width: calc(100% - 15px); border-radius:15px;}
.doitac-album .smaller-img {width: 12.5%; padding-bottom: 11%}

.doitac-album .img:first-child {width:50% !important;padding-bottom: 33% !important}

.score-container .score {
    color: #333333;
    font-size: 14px;
    font-weight: 100;
    line-height: 50px;
    text-align: center;
}
.small-star.star-rating-non-editable-container{
    background: url(../images/star1.png) repeat-x;
    height: 24px; margin:auto; clear:both;
    width: 120px;
}
.score-container-star-rating{
    text-align: center;
    float:left; width: 100%;
}
.small-star .current-rating{
    background: url(../images/star0.png) repeat-x;
    height: 24px;
}

.show_rating{
    display: none;
    height: 24px;
    width: 120px; margin:auto;
    overflow: hidden;
}
.show_rating a{
    background: url(../images/star1.png) repeat-x;
    height: 24px;
    width: 24px;
    float: left;
    cursor: pointer;
}
.show_rating a.on{
    background: url(../images/star0.png) repeat-x;
}
 
@-webkit-viewport { width: device-width; }
@-moz-viewport { width: device-width; }
@-ms-viewport { width: device-width; }
@-o-viewport { width: device-width; }
@viewport { width: device-width; }


.side-bar {
    -webkit-transform: translate(0px, 0);
    -moz-transform: translate(0px, 0);
    -ms-transform: translate(0px, 0);
    -o-transform: translate(0px, 0);
    transform: translate(0px, 0);
    transition: 0.3s all linear;
}

 
a:hover {
    text-decoration: none;
}

a:focus{
    text-decoration: none;
}

.n_padding_l{padding-left: 0 !important}
.n_padding_r{padding-right: 0 !important}
.n_padding_l_r{padding:0 !important}

.white_bg{background: #fff}

.displaynone{display: none !important}

.news-category {
    float: left; width: 100%; padding:0;
    margin-top: 0;
    margin-bottom: 10px;
    height: 50px;
    overflow-y: hidden;
    overflow-x: auto;
    max-width: 100%;
    display: flex;
    scrollbar-width: auto;
}

.news-category li {
    display: inline-block;
    color: black;
    margin: 2px;
    height: 35px;
    white-space: nowrap;
}

.news-category a {
    display: inline-block;
    background: #eee;
    padding: 7px 10px;
    color: black;
    border-radius: 20px;
    height: 35px;
    white-space: nowrap;
}

.news-category .active {
    background: var(--orange);
    color: white;
}

.news-category {
    scrollbar-width: none;
}
.news-category::-webkit-scrollbar {
    display: none;
}


.cat_post {height: 500px; overflow: hidden; position: relative;}
.cat_post .expand_button {position: absolute; left:0; bottom: 0; width: 100%; padding:20px; text-align: center; background: linear-gradient(to top, white, white, white, transparent); cursor: pointer; color:var(--orange); font-weight: bold}

.cat_post_expand {height: auto}

 
.news_detail, .noidung{
    font-size: 16px;
    padding:10px 0;
    overflow: hidden; 
    width: 100%;
    word-wrap: break-word;
}
 
 
.news_detail img {max-width: 100% !important; }

.news_detail h1 {font-size: 20px; font-weight:bold }
.news_detail h2 {font-size:18px; font-weight:bold; }
.news_detail h3, .news_detail h4, .news_detail h5 {font-size: 16px; font-weight: bold}
 
.img_n a{display: block; overflow: hidden}
   

.no_padding_r{padding-right: 0 !important}
.no_padding_l{padding-left: 0 !important}
 
.other_news>h2{font-size: 16px; font-weight: bold; padding-bottom: 10px;}
.other_news ul>li{list-style: circle; padding: 3px 0}
.other_news ul>li>a{color: #5f2d00;font-size: 16px;  }
.other_news ul>li>a:hover{color: #578a56; }
.other_news ul{margin-left: 20px;}
/*----------------news-------------------------*/
  
.btnSubmit {
    background: #F86F54;
    font-size: 18px;
    border: solid 1px #F86F54;
    outline: none;
    display: block;
    color: #FFFFFF;
    margin: 10px auto;
    transition: all 0.3s linear;
    padding: 5px 20px;
}
 
.show_error {
    background: none repeat scroll 0 0 #FDD0D0;
    border: 1px solid #FA789A;
    border-radius: 3px 3px 3px 3px;
    box-shadow: 0 0 5px #CCCCCC;
    margin: 10px 0;
    padding: 5px;
    color: red;
    text-align: center;
}
.show_success, .show_notice {
    background: none repeat scroll 0 0 #E7FDD0;
    border: 1px solid #B9FA78;
    border-radius: 3px 3px 3px 3px;
    box-shadow: 0 0 5px #CCCCCC;
    margin: 10px 0;
    padding: 5px;
    text-align: center;
}

/*---------------- box mod----------------- */
.boxItem{
    width: 100%;
    background: #fff;
    //border: #ccc solid 1px;
    margin-bottom: 20px;
}
.boxItem .box-title{
    color: #260a57;
    font-weight: bold;
    font-size: 18px;
    text-transform: uppercase;
    margin-bottom: 10px;
}

 
.error{color:#c42025 }
.form-control{border-radius: 15px; border:none; background: #f5f5f5; height: 40px}
 
#map-canvas{height: 400px}
 
.feedback{margin-bottom: 30px;}
.feedback ul>li{text-align: center}
.feedback ul>li>img{width: 100%; border-radius: 50%; padding-bottom: 15px;}
.feedback ul>li>h2{color: #578a56; font-size: 18px; padding-bottom: 5px}
 

.botom_foot{
    background: #431e85;
    text-align: center;
    margin-top: 20px;
    padding: 10px;
}

.pages {
    float: left;
    padding-top: 20px;
    padding-bottom: 20px;
    text-align: center;
    width: 100%;
    font-size: 16px;
}

.pages .pagebar-selections {display:inline-block; padding:5px 10px; text-align:center; height:30px; background:#eee; border-radius:10px; margin: 5px}
.pages a {display:inline-block; padding:5px 10px;  text-align:center; height:30px; background:#eee; border-radius:10px; margin: 5px}

.modi h3.title{
    color: #578a56;
    font-weight: bold;
    font-size: 18px;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.modi{
    margin-bottom: 30px;
}

 
.order-now {
    display: inline-block;
    height: 40px;
    line-height: 40px;
    padding: 0 35px;
    text-align: center;
    color: #ffffff;
    text-transform: uppercase;
    background-color: #5f2d00;
    border: none;
    outline: none;
 
    cursor: pointer;
    margin:20px 0;
}

.main {margin: auto; max-width: 800px; clear: both;}


.xemthem {display: inline-block; clear: both; padding:10px; background:white; font-style: italic; color:#5f2d00; float:right; margin-bottom:20px}

.spa {float:left; width: 100%; position: relative; border-radius: 15px; overflow: hidden; border:1px solid #ddd; margin-bottom:20px}
.spa .img {float:left; width: 100%; position: relative; height: 0; padding-bottom: 60%; overflow: hidden}
.spa .img img {position: absolute; left:0; top:0; width: 100%; height: 100%; object-fit: cover}
.spa .info {float:left; width: 100%; padding:15px; color:black; line-height: 25px;}
.spa .info .title {float: left; width: 100%; line-height: 20px;height: 40px;  font-size: 16px; font-weight: bold; overflow: hidden}
.spa .info .rating {float:left; width: 100%; color:#666;  }
.spa .info .rating span {color:var(--orange); font-weight: bold}
.spa .info .price {float:left; width: 100%; font-size:16px; font-weight: bold; margin-top:5px }
.spa .info .city {float:left; font-size: 12px; border-radius: 5px; line-height: 15px; break-all; text-overflow: ellipsis; padding: 3px 5px; margin-right: 10px;  color:#f44622; font-weight: bold; box-shadow: rgba(244, 70, 34, 0.4) 0px 0px 0px 1px inset}

.spa-container {float: left; width: 100%}
.spa-container .rating {float:left; display: inline-block;}
.spa-container .rating span {color:var(--orange); font-weight: bold}
.spa-container .overview {float:left; width: 100%; font-size: 15px}
.spa-container .address {float:left; display: inline-block; margin-left:20px}

.spa-container .description {float:left; width: 100%; font-size: 15px; background: #d9f0ff; padding:15px; border-radius: 15px; margin-bottom: 20px}
.spa-container .noidung {float:left; width: 100%; overflow: hidden;}
.spa-container .noidung img {max-width: 100% !important;}
.spa-container .noidung h2 {font-size:20px;}
.spa-container .noidung h3 {font-size:15px;}


.spa-container .price {float:left; width: 100%; border-radius: 15px; border:1px solid #ccc; padding:15px; text-align: center}
.spa-container .price span {font-size:20px; display: inline-block; font-weight: bold; color:var(--blue)}
.spa-container .price a {display: inline-block; width: 100%; margin-top:20px; text-align:center; padding:10px; color:white; background: var(--blue); font-size:15px; border-radius: 15px}

.spa-container .choose-service {float:left; width: 100%; background: var(--lightblue); padding:15px; border-radius: 15px}
.spa-container .btn-book {position: fixed; bottom:10px; right: 10px;z-index: 9999999; float: right; font-size:20px; font-weight: bold; border:3px solid var(--orange); background: var(--orange); color:white; display: block; padding:10px 20px; border-radius: 10px; text-align: center}
.spa-container .btn-book:hover {color:var(--orange); background: white}
.spa-container .block {float:left; width: 100%; padding:15px; border-radius: 15px; background: var(--lightblue)}
.spa-container .block-service {float:left; width:100%; padding:15px;background: white; border:1px solid #ccc}
.spa-container .block-service select {font-size: 17px;  color:var(--orange);height: 50px; border-radius: 10px; margin-bottom: 20px; font-weight: bold; background: #fff2ea; border:1px solid var(--orange)}
.spa-container .block-gray {background: #eee}
#service-content {overflow: hidden; float: left; font-size:15px}

#service-tab {}
#service-tab a {color:black; font-size: 17px; border-radius: 15px}
#service-tab .active,
#service-tab a:focus, 
#service-tab a:hover {background: white; color:var(--blue); font-weight: bold}

#total {font-size: 20px; font-weight: bold; color:crimson;}

.doitac-rating {float:left; width: 100%}

.doitac-rating .doitac-comment:nth-child(odd) .img {color: var(--blue)}

.doitac-comment {float:left; width: 100%; position: relative; margin-bottom: 20px}
.doitac-comment .img { float:left; width: 60px; height: 60px; font-size: 30px; padding:10px; background: #eee; border-radius: 50%; text-align: center; color:crimson}
.doitac-comment .info {float: left; width: 100%; margin-top:10px}
.doitac-comment .info .title {float:left; width: 100%; font-size: 15px; font-weight: bold; margin-bottom: 10px}
.doitac-comment .fullname {float:right; width: calc(100% - 70px); position: relative; line-height: 22px}
.doitac-comment .fullname .date {float:left; width: 100%}
.doitac-comment .fullname .star {float: left; width: 100%; color:gold;}

.doitac-rating::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);background-color: #F5F5F5;}
.doitac-rating::-webkit-scrollbar{width: 10px;background-color: #F5F5F5;}

#binhluan .btn {height: 40px; padding:8px}

.btn {border-radius: 10px; }
.btn-orange {background-color: var(--orange); border-color: var(--orange); color:white;  font-weight: bold; padding:8px 20px}
.btn-orange2 {background-color: var(--orange); border-color: var(--orange); color:white; font-size: 18px; padding:12px 25px}

.btn-orange:hover, .btn-orange:focus, .btn-orange.focus, .btn-orange:active, .btn-orange.active, .open>.dropdown-toggle.btn-orange {background-color: white; color:var(--orange); border-color: var(--orange)}

figure {max-width: 100%}
figure.image {
    display: inline-block;
    width: auto; /* Để figure tự động co giãn theo nội dung */
}

figure.image img {
    display: block; /* Đảm bảo hình ảnh là phần tử khối để chiếm toàn bộ chiều rộng của figure */
    max-width: 100%; /* Đảm bảo hình ảnh không vượt quá chiều rộng của phần tử cha */
    height: auto; /* Giữ tỷ lệ khung hình của hình ảnh */
}

figure.image figcaption {
    width: 100%; /* Đảm bảo figcaption chiếm toàn bộ chiều rộng của figure */
    word-wrap: break-word; /* Đảm bảo văn bản trong figcaption không bị tràn ra ngoài */
    box-sizing: border-box; /* Bao gồm padding và border trong chiều rộng tổng */
}

/*------------------------  slide khach hang ----------------------------------------------*/


@media screen and (min-width: 1199px) {
    .col-lg-20{width: 20%; float: left}



}


@media screen and (max-width: 1199px) {
     .search-box input, .search-box button {height: 40px}
     .slide-text button {display: none}
 
}

@media screen and (max-width: 1024px) {
 
}

@media screen and (max-width: 992px) {


    
    #menu_btn{
        float: right;
        display: inline-block !important;
        padding: 5px 0 3px 0;
    }

    i.btn_show:hover{transition: all 0.5s ease}

    #menu_btn>i{
        cursor: pointer;
        color: #fff;
    }

    #menu_btn>i.btn_hide{
        display: none;
    }

    .new_txt{
        margin-bottom: 20px;
        padding-bottom: 10px;
    }

 

}

.for-mobile {display:none}
.for-desktop {}
@media screen and (max-width: 767px) {
    .mobile-menu-toggle  {display:block}
    header .main-menu {left:0; top:100px; border-top:1px solid #eee; width:100%; display: none;  background:white; position:fixed; z-index:9999 ; margin: 0; right: auto; bottom: auto;}
    header .main-menu li {padding:0 !important}
    header .main-menu li .active, header .main-menu li a:hover {background: #eee !important; color:black !important; border:none !important;}
    header .main-menu>ul {width:100%; float:left; margin: 0; padding: 0}
    header .main-menu>ul>li {list-style: none; width: 100%; margin:0; position: relative;}
    header .main-menu>ul>li>a {color:#333;  display: inline-block; height: 50px; padding:12px; width: 100%; border-bottom: 1px solid #eee; text-align: center; background: white;  border-radius: 0}
    header .main-menu>ul>li:hover .main-menu-sub {display: none; }
    header .main-menu .icon-open {display: block;}
    header .main-menu .main-menu-sub {position: relative; float: left; width: 100%; top:0; box-shadow: none; text-align: center; border-radius: 0}
    header .main-menu .main-menu-sub>li>a {color:black; border-radius: 0}


    .search-box {margin-top:20px}
     .slide-text button {display: none}
     .slide-text h2 {font-size: 16px !important}
   
	.for-mobile {display:block; margin:auto}
	.for-desktop {display:none}
    .news_detail img {height: auto !important}

  
    .row_search{text-align: center}
    .hot_line_box{display: inline-block}
 
    .main_menu_btn{
        display: block;
        position: absolute;
        right: 15px;
        top: 10px;
    }
    .box_seach{margin:0;}
 
    .hot_line_box {text-align: center; margin-bottom: 15px;}
    .right_flower{display: none}
    .wrap_hotline_box{display: inline-block}
    
    .bg_paper{margin-top: 20px;}


}




@media screen and (max-width: 459px) {
    .row {margin-left:-5px; margin-right: -5px}
    .row> .col-lg-3 {padding-left:5px; padding-right: 5px}
    .spa, .news {margin-bottom: 10px}
    .spa .info {height: auto; padding:10px;}
    .spa .info .title {height: 60px; line-height:20px; font-size: 14px}
    .spa .info .city {margin-right: 0;}
    .noidung table, .news_detail table {max-width: 100% !important}
 
	.language>li img{ height: 25px; margin-left:-10px}
    /*.col-xs-6{
        width: 100% !important;
    }*/

    

    .col-xs1-12{width: 100% !important}
    
    .box_seach{margin: 0;}

    .td_hide{display: none}
 
    .social {top:auto; bottom:10%}

    header .logo {width: 100%; text-align: center; height: 70px}
    .language {top:52px !important; left:0; width: 100%; text-align: center;}
    .language li {float: none !important; padding:0 5px}
 
}

@media screen and (max-width: 390px) {
    
    .hot_line_menu{font-size: 12px;}

    .hot_line_box .mobile, .hot_line_box .email {margin-left: 0px; float: none}
    .hot_line_box .add {
        margin: 5px 0 0 10px;
    }
}



.sort-pro {float:right; margin-top:10px; border:1px solid #ddd; background:white; padding:5px}