/*@import url('normalize.css');*/

/* Layout style  */
.btn button {position:absolute;z-index:2000;top:52%;width:40px;height:40px;border:3px solid #fff;border:3px solid #fff;text-indent:-90000px;margin-top:-40px;cursor:pointer;
    -webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-o-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg);
    -webkit-transition:opacity 0.4s ease-in-out 0.2s;-moz-transition:opacity 0.4s ease-in-out 0.2s;-o-transition:opacity 0.4s ease-in-out 0.2s;-ms-transition:opacity 0.4s ease-in-out 0.2s;transition:opacity 0.4s ease-in-out 0.2s;}

.btn button:hover {opacity:0.9}
.btn button.btn_prev {left:5%;border-right:none;border-top:none;}
.btn button.btn_next {right:5%;border-left:none;border-bottom:none;}

.roll_area {overflow:hidden;}
.roll_area .wrap{display:table;table-layout:fixed;}
.roll_area .area .bg{position:absolute;top:0;left:0;width:100%;}
.roll_area .area h2, .roll_area .area .wrap{position:relative;}
.roll_area .area{display:table-cell;position:relative;vertical-align:middle;word-break:break-all;}
.roll_area .area .cont1{margin:10px 0 0;font-size:18px;}
.roll_area .area h2, .roll_area .area .cont1, .roll_area .area .cont2 {width:80%;margin:0 auto;text-align:center;color:#fff;font-weight:100;}
.abt {padding:0 0 35%;}
.zdq {text-align:left;}
.wh {padding:5% 0 0;}
.bgq {padding:2% 0 10%;}
.fac {padding:1% 0 10%;}
.roll_area .area h2, .roll_area .area .cont1, .roll_area .area .cont2, .roll_area .area .da_img {position:relative;}
.roll_area .area h2 {margin-bottom:20px;font-size:3em;z-index:10;letter-spacing:-1px;word-wrap:break-word;word-break:keep-all}
.roll_area .area img{max-width:100%;}

/* brandstory + brandstrategy */
.brandstory .intro, .brandstrategy .intro, .roll_area{position:relative; margin:0 auto;}
.brandstory .intro, .brandstrategy .intro, .roll_area, .roll_area .area{width:1440px;height:780px;}
.brandstory .intro img, .brandstrategy .intro img {width:100%;height:auto;}

@media screen and (max-width:1366px) {
    .brandstory .intro, .brandstrategy .intro, .roll_area, .roll_area .area{width:1000px;height:609px;}
}

@media screen and (max-width:969px) {
    .header{position:relative;max-width:700px;width:100%;margin:0 auto;}
    .brandstory .intro, .brandstrategy .intro, .roll_area, .roll_area .area{width:700px;height:427px;}
    .roll_area .area h2{font-size:2.5em}
    .roll_area .area [class^='cont']{font-size:1.1em}
	.bgq {padding:2% 0 20%;}
	
}

.kvcon {min-width:1580px; overflow:hidden; background:#000; color:#fff;}
.kvcon h2, .kvcon a {color:inherit;}
.kvcon .container {position:relative; width:1440px; margin:0 auto; box-sizing:border-box;}
.topkv .kvcon {position:relative; z-index:1; min-height:800px; height:74vh; background:#000 url('../images/brand/banner_a.jpg') no-repeat 50% 50%; background-size:cover;}
.topkv .kvcon .container {height:100%;}
.topkv .kvcon .title {position:absolute; text-align:left; top:50%; left:0; padding:140px 0 0; font-size:34px; line-height:1.3; -webkit-transform:translateY(-50%); -ms-transform:translateY(-50%); transform:translateY(-50%);}
.topkv .kvcon .title .txt_h {margin:28px 0; font-size:74px; line-height:1.125; font-weight:700;}