@charset "utf-8";
/* CSS Document */
img{ max-width:100%;}
a{ text-decoration: none;}
*{ box-sizing: border-box;}
ul,li{ padding:0; margin:0; list-style: none; }
body{ background:url(../images/body_bg.jpg)  no-repeat fixed ; background-color: #000; margin:0; font-family: Arial,'microsoft yahei',Helvetica, sans-serif; opacity: 0.9;}
#index_body{ opacity: 0.9;}
.e_left{
	width: 260px;
    padding: 50px 0px 56px 8px;
    position: fixed;
    left: 0;
    top: 0;
    height: 100%;
    z-index: 10000;
    background-color: #838181;
}
.bx_top_nav{ display: none; }
.e_right{     
	width: calc(100vw - 260px);
    margin-left: 260px;
}
#index_body .e_left{background-color: #838181;}

.bx_logo{
	padding-left: 20px;
	margin-bottom: 30px;
    display: inline-block;
    max-width: 200px;
}

    
.meun{ padding-left: 24px; }
.meun li{ list-style: none; }
.meun li.nav-list-item:hover{ background: rgba(255, 255, 255, 0.35); }
.meun li.nav-list-item {padding: 8px; margin-bottom: 8px;}
.meun li.nav-list-item a{
	font-size: 16px; 
	line-height: 23px;
	color: #fff; 
	/*opacity: 0.65;*/
	display: flex;
    justify-content: space-between;
    align-items: center;
}
.meun li.nav-list-item a.active{ opacity: 1;}
.meun li.nav-list-item a:hover{ opacity: 1; }
.meun li.nav-list-item i {
    margin-right: 24px;
    font-size: 8px;
}
.meun li.nav-list-item:hover .secondNav-list {
    display: flex;
    width: auto;
    min-width: 180px;
    /* padding: 0 40px; */
    opacity: 1;
    /* overflow-y: scroll; */
}
.meun li.nav-list-item .secondNav-list {
       background-color: rgb(157 147 147 / 90%);
}
.meun .nav-list-item .secondNav-list {
    display: none;
    backdrop-filter: saturate(180%) blur(20px);
    -webkit-backdrop-filter: saturate(180%) blur(20px);
    position: absolute;
    left: 260px;
    width: 0px;
    min-width: 0px;
    white-space: nowrap;
    height: 100vh;
    top: 0;
    /* padding: 0 40px; */
    /* background: #111111; */
    flex-direction: column;
    /* background-color: rgba(17, 17, 17, 0.5); */
    transition: 0.5s width, 0.5s 0.2s color, 0.5s 0.2s opacity, 0.5s min-width;
    opacity: 0;
}

.meun li.nav-list-item:hover .secondNav-list .sl-warp{
	display: flex;
	flex-direction: column;
    height: 100%;
}
.meun li.nav-list-item:hover .secondNav-list .sl-warp .sw{
	padding: 20px 40px;
    /*overflow-y: scroll;*/
}
.meun li.nav-list-item .secondNav-list .sl-warp{
	display: none;
    flex-direction: column;
    /*justify-content: center;*/
    height: 100%;
}
.meun li.nav-list-item .secondNav-list .sl-warp .secondNav-list-item{
    padding: 8px 0;
    color: #FFFFFF;
    
    margin-bottom: 24px;
    cursor: pointer;
    display: flex;
    /*justify-content: center;*/
}
.meun li.nav-list-item .secondNav-list .sl-warp .secondNav-list-item a{opacity: 0.65; padding-right: 40px;}
.meun li.nav-list-item .secondNav-list .sl-warp .secondNav-list-item a:hover{ opacity: 1; }
.meun li.nav-list-item .secondNav-list .sl-warp .secondNav-list-item a img {
    width: 40px;
    margin-right: 10px;
}
.meun li.nav-list-item .secondNav-list .sl-warp .secondNav-list-item a span{align-items: center; display: flex;}

.index_text{ height: 100%; position: fixed; background: #f5f5f5; color: #000; overflow-y:scroll;}
.bx_index{ width: 60%; margin:auto; padding: 100px 0; line-height: 30px;text-align: justify;}
.bx_index .text_b{ font-style:italic; }
.bx_index h4{     font-size: 16px; font-weight: 700; margin-top: 50px;}
.bx_index .bt_center{ text-align: center; margin-top: 30px;}
.bx_index .bt_center a{ color: #000; text-decoration: underline;}

.copyright{ 
	text-align: center; 
    margin: 30px 0;
    display: inline-block;
    width: 100%;
}
.copyright_phone{ display: none; }
.contact_body .copyright{ margin-top: 200px; }

#aboutbody{ opacity: 0.9;}
.us_bg{
	height: 100%;
    position: fixed;
    background: #f5f5f5;
    color: #000;
    overflow-y: scroll;
}
/*.about_us{ 
	height: 100%;
    overflow-y: scroll;
    color: #000;
    background: #f5f5f5;
}*/
.bx_about{  margin: 100px 100px 50px 100px; line-height: 45px; font-size:17px; text-align: justify;}

.Boutiques_text {
    padding: 80px 100px 10px 100px;
    line-height: 32px;
    font-size: 17px;
    text-align: justify;
}
.text_img{ text-align: center; }
.Boutiques_text h3{ text-align: center; }
.Boutiques_text h5{ text-align: center; font-size:20px; color: #999; margin:10px 0 50px 0;}
.Boutiques_text a{ text-decoration:underline; }
.text_black{ font-weight: bold;font-size: 15px; }
.bx_swiperbox{ max-width: 1024px; margin:auto; margin-bottom: 40px;text-align: center;}

.Boutiques_text h5.china_title{ font-family: 'Great Vibes', cursive; font-size: 25px; color: #000; font-weight: normal;}
.Boutiques_text h5.Malaysia_title{ font-family: 'Merriweather', serif; font-size: 20px; color: #000; font-weight: normal; text-transform: uppercase;}

@media (min-width: 1200px){
    .bx_swiperbox{ max-width: 650px;}
}
@media (min-width: 1400px){
    .bx_swiperbox{ max-width: 880px;}
}
@media (min-width: 1600px){
    .bx_swiperbox{ max-width: 1024px;}
}
.swiper-button-next, .swiper-button-prev {
    line-height: 0;
    position: absolute;
    top: 53%;
    display: block;
    transform: translate(0,-50%);
    cursor: pointer;
    color: transparent;
    background-color: #fff;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 21px 18px;
    /*border: 1px solid #132048;*/
    border-radius: 0;
    font-size: 0;
    height: 40px;
    width: 40px;
    z-index: 99;
    display: block;
    border-radius: 50%;
    opacity: 0.65;
}
.swiper-button-next:hover, .swiper-button-prev:hover{opacity: 0.9;}
.swiper-button-prev {
    left: 10px;
    background-image: url(../images/icon-arrow-left-blue.svg);
}
.swiper-button-next {
    right: 10px;
    background-image: url(../images/icon-arrow-right-blue.svg);
}
.swiper-container-horizontal>.swiper-pagination-bullets{ 
	position: relative;  
	bottom: 0;
    left: 0;
    width: 100%;
    margin-top: 10px;
}
.swiper-pagination-bullet {
    width: 14px;
    height: 14px;
    margin: 10px;
    opacity: 0.5;
    background: #797575;
    cursor: pointer;
    vertical-align: middle;
    background-color: #fff;
    border: 1.5px solid #444648;
    border-radius: 50%;
}
.swiper-pagination-bullet-active {
    background: #132048;
    opacity: 1;
}


.brand_bg{
    height: 100%;
    position: fixed;
    background: #f5f5f5;
    color: #000;
    overflow-y: scroll;
}
/*.brand{
	height: 100%;
    overflow-y: scroll;
    color: #000;
    background: #fff;
}*/
.brand h3{ text-align: center; margin: 15px; border-bottom: 1px solid #000; padding: 40px 0;font-size: 25px;}
.brand_logo{ width:11%; float:left; text-align:center; padding:15px; box-sizing: border-box;}
.brand_logo img{ max-height:250px;border: 1px solid #000; padding: 3px;}

/*.contact_body{background: none; background-color: #f5f5f5;}*/
.contact_us{
    height: 100%;
    position: fixed;
    background: #f5f5f5;
    color: #000;
    overflow-y: scroll;
    width: calc(100vw - 260px);
}
.bx_contact{  
	padding: 100px 200px 10px 200px; 
	line-height: 30px; 
	height: 100%;
    color: #000;
    background: #f5f5f5;
}
.contact_left{ width:40%; float:left; }
.contact_right{ width:60%; float: left;  padding-left: 50px;}
.bx_contact p{ margin:20px 0; }
.bx_contact p a{text-decoration: underline;}
.bx_contact h4{ padding-top: 30px; border-top: 1px solid #000; width: 400px; margin:0;}
.bx_us_form{ margin-top: 20px; }
.redcolor{ color: #f00; }
.bx_us_form .input_width{ width: 400px; height: 25px; }
.bx_us_form .textarea_height{ height: 80px; }
.bx_us_form .bx_inp_box{margin-bottom: 10px; display: inline-block; }
.bx_us_form .send_btn{	background-color: #000; padding: 8px 40px; font-size: 16px; color: #fff; cursor: pointer;}
.show_info{ text-align: center; }
.us_link a{ display: inline-block; margin-right: 15px; }
.us_link a img{ border-radius: 10px; width: 80px; }

@media (max-width: 991px){
	.e_left{ width: 100%; position: fixed; padding:0 15px; height: auto;}
	.e_left img{ text-align: center; display: block; margin:auto;max-height: 60px;}
    .bx_top_nav{ display: block; position: absolute; right: 0px; top:15px; }
    .nav_toggle .fa{ font-size:28px; color: #fff; }
    .bx_top{ position: relative; height: 60px; }
    .bx_logo{ display: initial; padding:0; margin:0;}
	.meun{ padding: 10px 0; display: none; }
	.meun li{ width: 100%; text-align: left;list-style:none; border-bottom: 1px solid #fff;}
    .meun li.nav-list-item{ margin-bottom: 0; padding: 10px 0; }
    .meun li.nav-list-item:hover{ background: none; }
    .meun li.nav-list-item .secondNav-list .sl-warp{ display: block; height: auto; }
    .meun li.nav-list-item:hover .secondNav-list .sl-warp{ display: block; height: auto; }
    .meun li.nav-list-item:hover .secondNav-list .sl-warp .sw{ padding:0; }
    .meun li.nav-list-item:hover .secondNav-list{ display: block; height: auto; width: 100%;}
    .meun li.nav-list-item .secondNav-list{ width: 100%; background: none; opacity: 1; left: 0;position: relative;display: inline-block;
    height: auto; border:0; margin-top: 5px;}
    .meun li.nav-list-item .secondNav-list .sl-warp .secondNav-list-item{ padding: 5px 15px; border: 0; margin-bottom: 0;}
    .meun li.nav-list-item .secondNav-list .sl-warp .secondNav-list-item a{opacity: 1; width: 100%; line-height: 35px;}
    .meun li.nav-list-item .secondNav-list .sl-warp .secondNav-list-item a span{align-items: center; display: flex;}
	.meun li a{ font-size:16px; }
    .meun li.nav-list-item i{margin-right: 2px}
    .meun li.nav-list-item i.fa-angle-right:before{content: "\f078"; ;}
    .meun li.nav-list-item .open i.fa-angle-right:before{content: "\f077"; ;}

    .meun li.nav-list-item .secondNav-list .sl-warp .secondNav-list-item a img{ display: initial; }
	.e_right{ width: 100%; float: left; margin-left: 0;margin-top: 60px;}
	.index_text{ position: relative; }
	.bx_index{ width: 100%; padding: 40px 15px; box-sizing: border-box; }
	.us_bg{ position: unset;}
	.about_us{ position: relative; }
	.bx_about{ padding:0 15px 20px 15px; margin:0; font-size: 16px;}
	.brand_logo{width:50%;}
	.contact_us{ position: relative; }
	.bx_contact{ margin:auto; padding:40px 15px; }
	.bx_contact h3{ margin:0; }
	.bx_contact h4{ width:100%; }
	.bx_us_form table{ width:98%; }
	.bx_us_form .input_width{ width:100%; margin-bottom: 10px;}
	.bx_us_form .bx_inp_box{ display: table-row; }
    .Boutiques_text{ padding: 0 15px; }
    .Boutiques_text h5{ margin: 10px 0 20px 0;}
    .brand_bg{ position:relative;}
    .brand h3{padding:20px 0;}
    .contact_us{ width:100%; }
    .contact_left{ width: 100%; }
    .contact_right{ width: 100%; padding: 0; border: 0; }
    .copyright{ display: none; }
    .copyright_phone{ 
        text-align: center; 
        margin: 15px 0;
        display: inline-block;
        width: 100%;
        line-height: 25px;
    }
    .contact_body .copyright_phone{ margin-top: 80px;}
}