.title{color: #fff; font-size:90px; font-weight: 400;}
.title0{font-size: 54px; color: #474141; font-weight: 400;}
.all_btn2{ width: 220px; height:50px; border: 1px solid #474141; text-align: center; line-height: 50px; color: #474141; transition-duration: 0.5s;    box-sizing: border-box; font-size: 14px; display: block;}
.all_btn2 a{color: #474141; font-size: 14px; font-weight: 300;}
.all_btn2:hover{background-color: rgba(255,255,255,1); color: #000; border: 1px solid #999}

.all_btn1{ width: 220px; height:50px; border: 1px solid #474141; text-align: center; line-height: 50px; color: #474141; transition-duration: 0.5s;    box-sizing: border-box; font-size: 14px; display: block;}
.all_btn1 a{color: #474141; font-size: 14px; font-weight: 300;}
.all_btn1:hover{background-color: rgba(255,255,255,0.4); color: #000; border: 1px solid #999}

body{background-color: #FCFBF6;}

section{position: relative; min-width: 1200px}

/* topbanner */
#top_banner{position: relative; background-image: url(../img/brand_top.jpg); background-position: center; background-size: cover; background-attachment: fixed; height: 100vh;}
#top_banner .wrap{position: absolute;  color: #fff; text-align: center; left: 50%; top: 50%; transform: translate(-50%,-50%);}
/*#top_banner .description1{font-size: 40px; padding-top: 10%; font-weight: 400;}*/
#top_banner .description2{font-size: 38px; padding-top: 10%; font-weight: 200; }

#top_banner .title{margin-top: 100px; opacity: 0;}
#top_banner .description1{margin-top: 100px; opacity: 0;}
#top_banner .description2{margin-top: 100px; opacity: 0;}

/* mission */
#mission{position: relative; background-color:#FCFBF6 ;}
#mission .mission_wrap{display: flex; justify-content:flex-end;}
#mission .mission_img{width: 50%;}
#mission .mission_img img{width: 100%;}
#mission .mission_story{text-align: center; width: 50%; color: #474141; display: flex; flex-direction: column; align-items: center; justify-content: center; }
#mission .title0{font-size: 54px;font-weight: 500;}
#mission .line{width: 224px; height: 1px; border: 1px solid #474141; margin: 15px auto;} 
#mission .description1{padding-top: 40px; font-weight: 600;font-size: 17px; line-height: 30px}
#mission .description2{padding-top: 40px; font-weight: 600;font-size: 17px; line-height: 30px}

.mission_img{ left: -100px; opacity: 0;}
.mission_story{left: 100px; opacity: 0;}


/* vision */
#vision{position: relative; background-color:#FCFBF6 ;}
#vision .vision_wrap{display: flex; justify-content: flex-end;}
#vision .vision_story{text-align: center; width: 50%; color: #474141; display: flex; flex-direction: column; align-items: center; justify-content: center;  }
#vision .title0{font-size: 54px;font-weight: 500; }
#vision .line{width: 180px; height: 1px; border: 1px solid #474141; margin: 15px auto;} 
#vision .description1{padding-top: 40px; font-weight: 600; font-size: 17px; line-height: 30x}
#vision .description2{padding-top: 40px; font-weight: 600;font-size: 17px; line-height: 30px}
#vision .vision_img{width: 50%;}
#vision .vision_img img{width: 100%;}

.vision_img{ left: -100px; opacity: 0;}
.vision_story{left: 100px; opacity: 0;}


/* rose */
#rose{position: relative; width: 92%; max-width: 1440px; min-width: 1200px; margin: 0 auto; margin-top: 10%;}
#rose .rose_wrap{ display: flex; align-items: center; justify-content: space-between;  }
#rose .rose_img{width: 42%;  }
#rose .rose_img video{width: 100%;}
#rose .rose_story{text-align: right; width: 50%;}
#rose .line{border-right: 1px solid #474141; height:150px ;top: 3%; position: absolute; left: 50%;}
#rose .description1{font-weight: 500; margin-top: 32px; color: #474141; font-size: 17px;}
#rose .description2{font-weight: 500; margin-top: 10px; margin-bottom: 57px;color: #474141;font-size: 17px;} 
#rose .btn{position: relative; display: flex; justify-content: flex-end;}


/* heartleaf */
#heartleaf{position: relative; width: 92%; max-width: 1440px; min-width: 1200px; margin: 0 auto;margin-top: 2%;}
#heartleaf .heartleaf_wrap{display: flex; align-items: center; justify-content: space-between;  }
#heartleaf .heartleaf_img{width: 42%; }
#heartleaf .heartleaf_img video{width: 100%;}
#heartleaf .heartleaf_story{text-align: left; width: 50%; position: relative;}
#heartleaf .line{border-left: 1px solid #474141; height:150px ;left: 50%; top: 3%; position: absolute; }
#heartleaf .description1{font-weight: 500; margin-top: 32px; color: #474141; font-size: 17px;}
#heartleaf .description2{font-weight: 500; margin-top: 10px; margin-bottom: 57px; color: #474141;font-size: 17px;}
#heartleaf .btn{position: relative; display: flex;}

/* hyaluron */
#hyaluron{position: relative; width: 92%; max-width: 1440px; min-width: 1200px; margin: 0 auto;;margin-top: 2%; }
#hyaluron .hyaluron_wrap{ display: flex; align-items: center; justify-content: space-between;  }
#hyaluron .hyaluron_img{width: 42%;  }
#hyaluron .hyaluron_img video{width: 100%;}
#hyaluron .hyaluron_story{text-align: right; width: 50%;}
#hyaluron .line{border-right: 1px solid #474141; height:150px ;top: 3%; position: absolute; left: 50%;}
#hyaluron .description1{font-weight: 500; margin-top: 32px; color: #474141; font-size: 17px;}
#hyaluron .description2{font-weight: 500; margin-top: 10px; margin-bottom: 57px;color: #474141;font-size: 17px;} 
#hyaluron .btn{position: relative; display: flex; justify-content: flex-end;}

/* event */
#event{position: relative; background-image: url(../img/brand_banner2.jpg); background-position: center; background-size: cover; height: 850px; margin-top: 125px;}
#event .event_text{position: absolute; text-align: center; width: 500px; margin-top: 10%; margin-left: 20%;}
#event .title{color: #111; padding-bottom: 5%; font-size: 54px;}
#event .event_text>p{padding-bottom: 20%; font-size: 19px; color: #111;}
#event .btn{width: 220px; margin: 0 auto;}

