/* BASIC css start */
.cf:after {
	content:'';
	display:block;
	clear:both;
}

#brand_wrap { min-width:1400px; width:100%; overflow:hidden; }
#brand_wrap .brand-section { width:100%; position:relative; }
#brand_wrap .brand-section .brand_inner { max-width:1400px; padding:230px 0; margin:0 auto; position:relative; }


/* .brand-header */
#brand_wrap .brand-header { height:75vh; display:flex; align-items:center; justify-content:center; }
#brand_wrap .brand-section .brand-section-text { text-align:center; font-size:34px; font-weight:bold; animation:fdleft 1s linear; }
@keyframes fdleft {
	0% { padding-left:200px; opacity:0; }
	100% { padding-left:0; opacity:1; }
}


/* #img-wrap */
#brand_wrap #img-wrap .brand-section-inner { height:100vh; } 
#brand_wrap #img-wrap .brand_img { width:100%; height:100vh; position:absolute; }
#brand_wrap #img-wrap .brand-img-bg { margin:0 auto; background:url(/design/rtx22/re_2022/brand/brandStoryImg.jpg) no-repeat center/cover; transform:scale(0.80); }
#brand_wrap #img-wrap .brand-img-color { background:#007f53; }
#brand_wrap #img-wrap .brand-img-color .brand-img-text { height:100%; text-align:center; display:flex; flex-direction:column; align-items:center; justify-content:center; color:#fff; }
#brand_wrap #img-wrap .brand-img-color .brand-img-text h2 { font-size:34px; font-weight:bold; color:#fff; }
#brand_wrap #img-wrap .brand-img-color .brand-img-text p { font-size:20px; line-height:1.5; margin-top:20px; }



/* .brand-section02 */
#brand_wrap .brand-section02 .brand_inner .vision_title { text-align:center; }
#brand_wrap .brand-section02 .brand_inner .vision_title h2 { font-size:34px; font-weight:bold; }
#brand_wrap .brand-section02 .brand_inner .vision_title p { font-size:20px; margin-top:20px; line-height:1.5; color:#888; }


#brand_wrap .brand-section02 .brand_inner .vision_allWrap { margin-top:120px; }
#brand_wrap .brand-section02 .brand_inner .vision_allWrap .vision_wrap { display:flex; align-items:center; justify-content:space-between; margin-top:150px; }
#brand_wrap .brand-section02 .brand_inner .vision_allWrap .vision_wrap:first-child { margin-top:0; }
#brand_wrap .brand-section02 .brand_inner .vision_allWrap .vision_wrap .vision_section { width:550px; word-break:keep-all; transition:all 1s; }
#brand_wrap .brand-section02 .brand_inner .vision_allWrap .vision_wrap .vision_section h3 { font-size:30px; font-weight:bold; color:#007f53; margin-bottom:20px; padding-bottom:20px; border-bottom:2px solid; }
#brand_wrap .brand-section02 .brand_inner .vision_allWrap .vision_wrap .vision_section h3 span { font-size:24px }
#brand_wrap .brand-section02 .brand_inner .vision_allWrap .vision_wrap .vision_section p { font-size:20px; color:#888; }
#brand_wrap .brand-section02 .brand_inner .vision_allWrap .vision_wrap .vision_section p strong { font-weight:bold; }


#brand_wrap .brand-section02 .brand_inner .vision_allWrap .vision_wrap .vision_pic { max-width:530px; margin-right:50px; margin-left:50px; }
#brand_wrap .brand-section02 .brand_inner .vision_allWrap .vision_wrap .vision_pic .vision_bg { background:no-repeat center/cover; width:100%; height:350px; position:relative; transition:all 0.95s; }
#brand_wrap .brand-section02 .brand_inner .vision_allWrap .vision_wrap .vision_pic .vision_bg span { display:block; width:100%; height:100%; }

#brand_wrap .brand-section02 .brand_inner .vision_allWrap .vision_wrap .vision_pic .vision_bg span:before { display:block; content:''; position:absolute; width:100%; height:100%; top:45px; left:45px; border:2px solid rgba(0 127 83 / 20%); z-index:-1; transition:width 0.5s; }
#brand_wrap .brand-section02 .brand_inner .vision_allWrap #vision_02 .vision_pic .vision_bg span:before { top:auto; left:auto; bottom:45px; right:45px; }




/* .brand-section03 */
#brand_wrap .brand-section03 .img_bg { width:100%; overflow:hidden; position:relative; text-align:center; }
#brand_wrap .brand-section03 .img_bg img { width:100%; }
#brand_wrap .brand-section03 .img_bg h2 { z-index:2; color:#fff; line-height:1.5; font-size:34px; font-weight:bold; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); }
#brand_wrap .brand-section03 .img_bg h2 .g_color { color:#80fbc8; }
#brand_wrap .brand-section03 .img_bg h2 .o_color { color:#fc6c0f; }




/* .brand-section04 */
#brand_wrap .brand-section04 .brand_fixed { position: fixed; top:230px; }

#brand_wrap .brand-section04 .brand_inner { display:flex; }
#brand_wrap .brand-section04 .brand_inner .core_value { width:50%; }
#brand_wrap .brand-section04 .brand_inner .core_value .value_text h2 { font-size:34px; font-weight:bold; }
#brand_wrap .brand-section04 .brand_inner .core_value .value_text p { font-size:20px; font-weight:bold; margin-top:15px; line-height:1.5; color:#888; }

#brand_wrap .brand-section04 .brand_inner .core_value .left_value_text {  }

#brand_wrap .brand-section04 .brand_inner .core_value .right_value_section { margin-bottom:120px; }
#brand_wrap .brand-section04 .brand_inner .core_value .right_value_section:last-child { margin-bottom:0; }
#brand_wrap .brand-section04 .brand_inner .core_value .right_value_section .value_img { width:100%; height:400px; margin-bottom:25px; overflow:hidden; }
#brand_wrap .brand-section04 .brand_inner .core_value .right_value_section img { width:100%; object-fit:cover; transform-origin: left; }
#brand_wrap .brand-section04 .brand_inner .core_value .right_value_section .right_value_text h2 { font-size:30px; color:#007f53; }
#brand_wrap .brand-section04 .brand_inner .core_value .right_value_section .right_value_text p { font-size:18px; font-weight:normal; color:#282828; word-break:keep-all; }



/* .brand-section05 */
#brand_wrap .brand-section05 .img_bg { width:100%; overflow:hidden; text-align:center; position:relative; }
#brand_wrap .brand-section05 .img_bg img { width:100%; }



/* .brand-section06 */
#brand_wrap .brand-section06 { overflow:hidden; height:100vh; }
#brand_wrap .brand-section06 .brand_inner { padding:0; }

#brand_wrap .brand-section06 .slide_pin { height: 100vh; width: 100vw; display:flex; align-items:center; }
#brand_wrap .brand-section06 .slide_pin .text_center { display:inline-block; width:925px; margin-right:50px; font-size:34px; font-weight:bold; }
#brand_wrap .brand-section06 .slide_pin .text_center p { color:#888; margin-top:15px; font-size:20px; font-weight:normal; line-height:1.5; word-break:keep-all; }


#brand_wrap .brand-section06 .slide_pin .slide_wrap { width:100%; overflow:hidden; }
#brand_wrap .brand-section06 .slide_pin .slide_wrap img { padding:0 5px; }




/* .brand-section07 */
#brand_wrap .brand-section07 .img_bg { background:url(/design/rtx22/re_2022/brand/brandimg04.jpg) no-repeat center/cover fixed; width:100%; height:100vh; display:flex; align-items:center; justify-content:center; text-align:center; }
#brand_wrap .brand-section07 .img_bg a { display:block; position: relative; width:30%; height:65px; line-height:65px; min-width:450px; margin:0 10px; background:linear-gradient(315deg, #89d8d3 0%, #03c8a8 74%); color:#fff; border-radius:3px; transition:all 1.5s ease; font-size:16px; font-weight:bold; 
box-shadow:inset 2px 2px 2px 0px rgba(255,255,255,.5),
			7px 7px 20px 0px rgba(0,0,0,.1),
			4px 4px 5px 0px rgba(0,0,0,.1); }
#brand_wrap .brand-section07 .img_bg a span { position:relative; display:block; width:100%; height:100%; }
#brand_wrap .brand-section07 .img_bg a:before,
#brand_wrap .brand-section07 .img_bg a:after { position:absolute; content:""; right:0; top:0; background:rgba(0,127,83,1); transition:all 0.5s ease; }
#brand_wrap .brand-section07 .img_bg a:before { width:2px; height:0%; }
#brand_wrap .brand-section07 .img_bg a:after { width:0%; height:2px; }

#brand_wrap .brand-section07 .img_bg a span:before,
#brand_wrap .brand-section07 .img_bg a span:after { position:absolute; content:''; left:0; bottom:0; background:rgba(0,127,83,1); transition:all 0.5s ease; }
#brand_wrap .brand-section07 .img_bg a span:before { width:2px; height:0%; }
#brand_wrap .brand-section07 .img_bg a span:after { width:0%; height:2px; }

#brand_wrap .brand-section07 .img_bg a:hover { background:transparent; box-shadow:none; }
#brand_wrap .brand-section07 .img_bg a:hover:before { height:100%; }
#brand_wrap .brand-section07 .img_bg a:hover:after { width:100%; }

#brand_wrap .brand-section07 .img_bg a span:hover { color:rgba(0,127,83,1); }
#brand_wrap .brand-section07 .img_bg a span:hover:before { height:100%; }
#brand_wrap .brand-section07 .img_bg a span:hover:after { width:100%; }

#brand_wrap .brand-section07 .img_bg a:active { transform:translateY(1px); }


/* BASIC css end */

