@media screen and (min-width:1201px){
/* topBanner */

#topBanner{position: relative; overflow: hidden;}
#topBanner .top_img{position: relative; width: 1920px; height: 970px;}
#topBanner .top_img li{position: absolute; left: 0; top: 0; display: none;}
#topBanner .top_img li:first-child{display: block;}
#topBanner .top_img li img{width: 100%;}
#topBanner .top_contents{position: absolute; left: 10%; top: 30%;}
#topBanner .top_text h2{color: #FFF; font-size: 3vw; font-weight: bold;}
#topBanner .top_text p{color: #FFF; font-size: 2vw; padding: 60px 0; text-shadow: rgba(255, 255, 255, 0.3); width: 60%;}
#topBanner .move_controls{position: absolute; display: flex; align-items: center; width: 35%; justify-content: space-between; padding-top: 10px;}
#topBanner .controls{ display: flex; cursor: pointer;}
#topBanner .controls li{width: 20px; height: 20px; border-radius: 12px; margin: 0 10px; border: 1px solid #FFF;transition-duration: 0.5s;}
#topBanner .controls .top_select{background-color: #FFF; width: 50px;}
#topBanner .top_btn{display: flex; align-items: center; max-width: 90px; justify-content: center;}
#topBanner .top_btn button{border: none; background: none; cursor: pointer; margin: 0 8px; margin-top: 8px;}
#topBanner .top_btn .stop img{width: 20px; height: 24px;}

#topBanner .mob_banner{display: none;}

#topBanner .btn_left{display: none;}
#topBanner .btn_right{display: none;}

/* about */
#about{position: relative; width: 100%; margin: 160px auto;}
#about .about_top{width: 80%; margin: 0 auto; display: flex; justify-content: space-evenly; align-items: center; margin-bottom: 100px;}
#about .about_top .about_left{position: relative; width: 40%; top: -30px; opacity: 0;}
#about .about_top .about_left span{position: absolute; width: 12px; height: 12px; background-color: #5DC591; display: block; border-radius: 6px; left: -10px; transition-duration: 0.5s;}
#about .about_top .about_left h3{font-size: 35px; font-weight: bold; padding-bottom: 36px; color: #241F20;}
#about .about_top .about_left p{font-size: 20px; color: #AAA; width: 80%;}

#about .about_top .about_box{width: 52%; display: flex; justify-content: space-between; top: -500px; opacity: 0;}
#about .about_top .about_middle{position: relative; background-color: #5DC591; border-radius: 20px; justify-content: space-between; width: 49%; margin-right: 30px; padding: 6%;}
#about .about_top .about_middle .about_name{font-size: 24px; font-weight: 500; color: #FFF; padding-bottom: 30px;}
#about .about_top .about_middle .about_text{font-size: 22px; color: #FFF;}
#about .about_top .about_middle span{position: absolute; right: 35px; top: 32px; background-image: url(../img/more_white.png); width: 36px; height: 37px; display: block; transition: transform 0.3s ease;}

#about .about_top .about_right{position: relative; background-color: #FFF; border: 1px solid #5DC591; width: 49%; border-radius: 20px; padding: 6%;}
#about .about_top .about_right .about_name{font-size: 24px; padding-bottom: 30px; font-weight: 500; color: #241F20;}
#about .about_top .about_right .about_text{font-size: 22px; color: #6D6D6D;}
#about .about_top .about_right span{position: absolute; right: 35px; top: 32px; background-image: url(../img/more_black.png); width: 36px; height: 37px; display: block; transition: transform 0.3s ease;}

#about .about_bottom{position: relative; width: 80%; margin: 0 auto;}
#about .about_bottom .img_box{position: relative; margin: 0 auto; display: block; background-image: url(../img/about_banner.png); width: 0%; height: 361px; background-position: center; background-repeat: no-repeat; background-size: cover; border-radius: 20px;}
#about .about_bottom p{position: absolute; width: 65%; top: 0; left: 50%; top: 50%; transform: translate(-50%, -50%); font-size: 22px; color: #FFF; text-align: center;}
#about .about_bottom .about_button{position: absolute; top: 8%; right: 15%; border: 1px solid #FFF; font-size: 18px; color: #FFF; padding: 15px 40px; display: flex; align-items: center;}
#about .about_bottom .about_button span{background-image: url(../img/arrow_white.png); width: 36px; height: 8px; display: block; margin-left: 15px;}



/* value */
#value{position: relative; width: 100%; height: 846px; overflow: hidden; background-image: url(../img/value_banner.png); background-position: center; background-size: cover; background-repeat: no-repeat; box-sizing: border-box;}
#value .value_top{position: absolute; left: 50%; top: 15%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; text-align: center;}
#value .value_top h3{color: #FFF; font-size: 35px; top: -200px; opacity: 0; padding-bottom: 35px;}
#value .value_top .line_1{width: 1px; height: 30px; top: -200px; opacity: 0; background-color: #fff; display: block; margin: 0 auto;}
#value .value_top .value_text{color: #FFF; top: -200px; opacity: 0; font-size: 18px; width: 70%; padding-top: 35px;}

#value .value_bottom{position: absolute; left: 50%; top: 50%; transform: translateX(-50%); display: flex;}
#value .value_bottom li{position: relative; display: flex; flex-direction: column; align-items: center; margin: 30px 40px; width: 210px; height: 210px; border: 1px solid #FFF; border-radius: 110px; justify-content: center; top: -50px; opacity: 0;}
#value .value_bottom li p{text-align: center; color: #FFF; font-size: 16px;}


/* brand */
#brand{position: relative; margin-top: 180px;}
#brand .title{position: relative; width: 70%; margin: 0 auto; margin-bottom: 80px;}
#brand .title span{position: absolute; width: 12px; height: 12px; background-color: #5DC591; display: block; border-radius: 6px; left: -10px;}
#brand .title h3{font-size: 35px; font-weight: bold; padding-bottom: 22px; color: #241F20;}
#brand .title p{font-size: 20px; color: #AAA;}

#brand .brand_wrap{width: 70%; margin: 0 auto; display: flex; justify-content: space-around;}
#brand .brand_wrap_2{display: none;}
#brand .brand_wrap .brand_left{position: relative; display: flex; flex-direction: column; justify-content: space-between; width: 400px;}
#brand .brand_wrap .brand_left .big_wrap{width: 100%; margin-top: 15px;}
#brand .brand_wrap .brand_left .big_wrap img{width: 100%;}
#brand .brand_wrap .brand_left button{border: 1px solid #241F20; background: none; color: #241F20; padding: 18px 45px; width: 220px; display: flex; align-items: center;}
#brand .brand_wrap .brand_left button span{background-image: url(../img/arrow.png); width: 26px; height: 8px; display: block; background-repeat: no-repeat; margin-left: 20px;}

#brand .brand_wrap .brand_right{position: relative; width: calc(100% - 400px) ; display: flex; flex-direction: column; justify-content: space-between; margin-top: 20px; padding: 0 50px; box-sizing: border-box;}
#brand .brand_wrap .brand_right .text_box{padding: 0 20% 0 10%; margin-bottom: 20px;}
#brand .brand_wrap .brand_right .text_box .famous{font-size: 28px; color: #0040A0; padding-bottom: 20px; font-weight: bold;}
#brand .brand_wrap .brand_right .text_box .pro_title{font-size: 22px; padding-bottom: 35px; font-weight: bold; color: #241F20;}
#brand .brand_wrap .brand_right .text_box .detail{font-size: 20px; padding-bottom: 50px; color: #241F20;} 

#brand .brand_wrap .brand_bottom .small_list{display: flex;}
#brand .brand_wrap .brand_bottom .small_list li{width: 90%;}
#brand .brand_wrap .brand_bottom .small_list img{width: 100%;}

#brand button{border: none; background: none; cursor: pointer;}
#brand .next{position: absolute;  right: 12%; top: 40%;}
#brand .next img{width: 100%;}
#brand .prev{position: absolute; left: 8%; top: 40%;}
#brand .prev img{width: 100%;}


#brand .flow{position: relative; margin-top: 100px; padding: 24px; border-top: 1px solid #E8E8E8; border-bottom: 1px solid #E8E8E8; overflow: hidden;}
#brand .flow .flow_wrap{position: relative; width: 244%; display: flex; justify-content: center; left: 20px;}
#brand .flow .flow_wrap li{width: 4.5454%;}
#brand .flow .flow_wrap img{width: 75%;}


/* rd */
#rd{position: relative; margin-top: 160px; background-color: #F7F8FB; padding-top: 80px;}
#rd .title{position: relative; width: 70%; margin-bottom: 60px;}
#rd .title span{position: absolute; width: 12px; height: 12px; background-color: #5DC591; display: block; border-radius: 6px; left: -10px;}
#rd .title h3{font-size: 32px; font-weight: bold; padding-bottom: 22px; color: #241F20;}
#rd .title p{font-size: 18px; color: #AAA;}

#rd .wave{position: absolute; left: 0; top: -20%;}
#rd .wave img{width: 100%;}
#rd .sircle{position: absolute; right: 0; top: 10%;}
#rd .sircle img{width: 100%;}

#rd .rd_contents{position: relative;}
#rd .rd_contents .rd_inner{position: relative; width: 80%; margin: 0 auto;}
#rd .rd_contents .accordion{position: relative; display: flex; width: 100%;}
#rd .rd_contents .accordion li{position: relative; width: 7.5%; height: 818px; overflow: hidden; transition-duration: 0.5s;}
#rd .rd_contents .accordion li.select{width: 70%;  background-position: center; background-size: cover;}
#rd .rd_contents .accordion .rd_1{background-image: url(../img/rd_0.png); background-position: center; background-size: cover;}
#rd .rd_contents .accordion .rd_2{background-image: url(../img/rd_1.png); background-position: center; background-size: cover;}
#rd .rd_contents .accordion .rd_3{background-image: url(../img/rd_2.png); background-position: center; background-size: cover;}
#rd .rd_contents .accordion .rd_4{background-image: url(../img/rd_3.png);background-position: center; background-size: cover;}
#rd .rd_contents .accordion .rd_5{background-image: url(../img/rd_4.png);background-position: center; background-size: cover;}
#rd .rd_contents .accordion li .rd_text{font-size: 20px;}
#rd .rd_contents .accordion li .rd_view{font-size: 20px; transform: translate(-50%, -50%) rotate(0deg); width: 70%; text-align: center; line-height: 1.6em; white-space: wrap; opacity: 0;}
#rd .rd_contents .accordion li.select .rd_text{position: absolute; font-size: 32px; transform: translate(-50%, -50%) rotate(0deg); top: 35%; left: 50%; font-weight: bold;}
#rd .rd_contents .accordion li.select .rd_view{position: absolute; font-size: 20px; transform: translate(-50%, -50%) rotate(0deg); top: 50%; left: 50%; opacity: 1; transition: opacity 3s;}

#rd .rd_contents .accordion li p{position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(90deg); font-size: 24px; color: #FFF; white-space: nowrap;}
#rd .rd_contents .accordion li .rd_hide{display: none;}


/* newtice */
#newtice{position: relative; margin-top: 200px; margin-bottom: 130px;}
#newtice .newtice_wrap{position: relative; width: 80%; margin: 0 auto;}
#newtice .newtice_wrap .title{position: relative; top: -50px; opacity: 0;}
#newtice .newtice_wrap .title span{position: absolute; width: 12px; height: 12px; background-color: #5DC591; display: block; border-radius: 6px; left: -10px;}
#newtice .newtice_wrap .title h3{font-size: 35px; font-weight: bold; padding-bottom: 22px; color: #241F20;}
#newtice .newtice_wrap .title p{font-size: 20px; color: #AAA;}

#newtice .newtice_wrap .newtice_inner{position: relative; width: 100%; display: flex;  margin-top: 70px; justify-content: space-between;}

#newtice .newtice_wrap .notice{width: 37%; line-height: 40px;}
#newtice .newtice_wrap .notice h4{font-size: 22px;
    top: -200px; opacity: 0; color: #241F20;}
#newtice .newtice_wrap .notice ul{margin: 20px 0;}
#newtice .newtice_wrap .notice ul li{border-top: 1px solid #BDBDBD; padding: 18px 0 18px 35px;  top: -100px; opacity: 0;}
#newtice .newtice_wrap .notice ul li:hover{background-color: #F7F8FB;}
#newtice .newtice_wrap .notice ul li:last-child{border-bottom: 1px solid #BDBDBD;}
#newtice .newtice_wrap .notice ul .date{color: #5DC591; font-size: 18px;}
#newtice .newtice_wrap .notice ul .notice_text{font-size: 20px; color: #241F20; font-weight: 500; padding-left: 15px;}

#newtice .newtice_wrap .news{width: 58%;}
#newtice .newtice_wrap .news h4{font-size: 22px; color: #241F20; padding-bottom: 20px; top: -200px; opacity: 0;}
#newtice .newtice_wrap .news ul{display: flex; justify-content: space-between;}
#newtice .newtice_wrap .news li{border: 1px solid #5DC591;  width: 32%; border-radius: 10px;
 padding: 30px 0 60px 0px; position: relative; top: -80px; opacity: 0;}
#newtice .newtice_wrap .news li:first-child{background-color: #5DC591;}
#newtice .newtice_wrap .news li:first-child{background-color: #5DC591;}
#newtice .newtice_wrap .news .date_white{color: #FFF; font-size: 16px; padding: 20px;}
#newtice .newtice_wrap .news .news_white{font-size: 18px; color: #FFF; padding: 20px;}
#newtice .newtice_wrap .news .date{color: #AAA; font-size: 16px;  padding: 20px;}
#newtice .newtice_wrap .news .news_text{font-size: 18px; color: #241F20;  padding: 20px;}


#newtice .newtice_wrap .newtice_btn{background-image: url(../img/more_green.png); width: 54px; height: 54px; display: block; margin: 0 auto; margin-top: 60px;}
}



















@media screen and (max-width:1200px) and (min-width:901px){
/* topBanner */
#topBanner{position: relative; overflow: hidden;}
#topBanner .top_img{position: relative; width: 1200px; height: 600px;}
#topBanner .top_img li{position: absolute; left: 0; top: 0;}
#topBanner .top_img li img{width: 100%;}
#topBanner .top_contents{position: absolute; left: 10%; top: 35%; transition-duration: 0.5s;}
#topBanner .top_text h2{color: #FFF; font-size: 3vw; font-weight: bold;}
#topBanner .top_text p{color: #FFF; font-size: 2vw; padding: 30px 0; text-shadow: rgba(255, 255, 255, 0.3);;}
#topBanner .move_controls{position: absolute; display: flex; align-items: center; width: 30%;  justify-content: space-between; padding-top: 5%;}
#topBanner .controls{ display: flex; cursor: pointer;}
#topBanner .controls li{width: 20px; height: 20px; border-radius: 12px; margin: 0 10px; border: 1px solid #FFF;}
#topBanner .controls .top_select{background-color: #FFF; width: 40px;}
#topBanner .top_btn{display: flex; align-items: center;}
#topBanner .top_btn button{border: none; background: none; cursor: pointer; padding: 0 8px;}
#topBanner .top_btn .stop img{width: 20px; height: 24px;}

#topBanner .mob_banner{display: none;}

#topBanner .btn_left{display: none;}
#topBanner .btn_right{display: none;}

/* about */
#about{position: relative; width: 100%; margin-top: 120px; margin-bottom: 120px;}
#about .about_top{width: 88%; margin: 0 auto; display: flex; justify-content: space-evenly; align-items: center; margin-bottom: 100px;}
#about .about_top .about_left{position: relative; width: 35%;  top: -30px; opacity: 0;}
#about .about_top .about_left span{position: absolute; width: 12px; height: 12px; background-color: #5DC591; display: block; border-radius: 6px; left: -10px;}
#about .about_top .about_left h3{font-size: 30px; font-weight: bold; padding-bottom: 36px; color: #241F20;}
#about .about_top .about_left p{font-size: 16px; color: #AAA;}


#about .about_top .about_box{width: 55%; display: flex; justify-content: space-between;  top: -500px; opacity: 0;}
#about .about_top .about_middle{position: relative; background-color: #5DC591; border-radius: 20px; justify-content: space-between; width: 50%; margin-right: 20px; padding: 6%;}
#about .about_top .about_middle .about_name{font-size: 20px; font-weight: 500; color: #FFF; padding-bottom: 30px;}
#about .about_top .about_middle .about_text{font-size: 18px; color: #FFF;}
#about .about_top .about_middle span{position: absolute; right: 20px; top: 28px; background-image: url(../img/more_white.png); width: 36px; height: 37px; display: block; transition: transform 0.3s ease;}

#about .about_top .about_right{position: relative; background-color: #FFF; border: 1px solid #5DC591; width: 50%; border-radius: 20px; padding: 6%;}
#about .about_top .about_right .about_name{font-size: 20px; padding-bottom: 30px; font-weight: 500; color: #241F20;}
#about .about_top .about_right .about_text{font-size: 18px; color: #6D6D6D;}
#about .about_top .about_right span{position: absolute; right: 20px; top: 28px; background-image: url(../img/more_black.png); width: 36px; height: 37px; display: block; transition: transform 0.3s ease;}

#about .about_bottom{position: relative; margin: 0 auto; width: 88%;}
#about .about_bottom .img_box{position: relative; width: 0%; margin: 0 auto; display: block; background-image: url(../img/about_banner.png); height: 300px; background-position: center; background-repeat: no-repeat; background-size: cover; border-radius: 20px;}
#about .about_bottom img{width: 100%;}
#about .about_bottom p{position: absolute; width: 80%; top: 0; left: 50%; top: 50%; transform: translate(-50%, -50%); font-size: 18px; color: #FFF; text-align: center;}
#about .about_bottom .about_button{position: absolute; top: 8%; right: 15%; border: 1px solid #FFF; font-size: 16px; color: #FFF; padding: 12px 35px; display: flex; align-items: center;}
#about .about_bottom .about_button span{background-image: url(../img/arrow_white.png); width: 36px; height: 8px; display: block; margin-left: 15px;}


/* value */
#value{position: relative; width: 100%; height: 846px; overflow: hidden; background-image: url(../img/value_banner.png); background-position: center; background-size: cover; background-repeat: no-repeat; box-sizing: border-box;}
#value .value_top{position: absolute; left: 50%; top: 13%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; text-align: center;}
#value .value_top h3{color: #FFF; font-size: 35px; padding-bottom: 40px;  top: -200px; opacity: 0;}
#value .value_top .line_1{width: 1px; height: 30px; background-color: #fff; display: block; margin: 0 auto; top: -200px; opacity: 0; }
#value .value_top .value_text{color: #FFF; font-size: 18px; padding-top: 40px;  top: -200px; opacity: 0;}
#value .value_bottom{position: absolute; left: 50%; top: 50%; transform: translateX(-50%); display: flex;}
#value .value_bottom li{display: flex; flex-direction: column; align-items: center; margin: 30px 40px; width: 210px; height: 210px; border: 1px solid #FFF; border-radius: 110px; justify-content: center; position: relative;  top: -50px; opacity: 0;}
#value .value_bottom li p{text-align: center; color: #FFF; font-size: 16px;}


/* brand */
#brand{position: relative; margin-top: 120px;}
#brand .title{position: relative; width: 80%; margin: 0 auto; margin-bottom: 60px;  transition-duration: 0.5s;}
#brand .title span{position: absolute; width: 12px; height: 12px; background-color: #5DC591; display: block; border-radius: 6px; left: -10px;}
#brand .title h3{font-size: 30px; font-weight: bold; padding-bottom: 22px; color: #241F20;}
#brand .title p{font-size: 20px; color: #AAA;}

#brand .brand_wrap{width: 80%; margin: 0 auto; display: flex; justify-content: space-around;  transition-duration: 0.5s;}
#brand .brand_wrap_2{display: none;}
#brand .brand_wrap .brand_left{position: relative; display: flex; flex-direction: column; justify-content: space-between; width: 350px;}
#brand .brand_wrap .brand_left .big_wrap{width: 100%;  margin-top: 15px;}
#brand .brand_wrap .brand_left .big_wrap img{width: 100%;}
#brand .brand_wrap .brand_left button{border: 1px solid #241F20; background: none; color: #241F20; padding: 18px 45px; width: 220px; display: flex; align-items: center;}
#brand .brand_wrap .brand_left button span{background-image: url(../img/arrow.png); width: 26px; height: 8px; display: block; background-repeat: no-repeat; margin-left: 20px;}

#brand .brand_wrap .brand_right{position: relative; width: calc(100% - 350px) ; display: flex; flex-direction: column; justify-content: center; margin-top: 20px; padding: 0 20px; box-sizing: border-box;}
#brand .brand_wrap .brand_right .text_box{padding: 0 10% 0 5%; margin-bottom: 20px;}
#brand .brand_wrap .brand_right .text_box .famous{font-size: 25px; color: #0040A0; padding-bottom: 15px; font-weight: bold;}
#brand .brand_wrap .brand_right .text_box .pro_title{font-size: 20px; padding-bottom: 25px; font-weight: bold; color: #241F20;}
#brand .brand_wrap .brand_right .text_box .detail{font-size: 18px; padding-bottom: 40px; color: #241F20;}

#brand .brand_wrap .brand_bottom .small_list{display: flex;}
#brand .brand_wrap .brand_bottom .small_list li{width: 90%;}
#brand .brand_wrap .brand_bottom .small_list img{width: 100%;}

#brand button{border: none; background: none; cursor: pointer; transition-duration: 0.5s;}
#brand .next{position: absolute;  right: 5%; top: 40%;}
#brand .next img{width: 80%;}
#brand .prev{position: absolute; left: 5%; top: 40%;}
#brand .prev img{width: 80%;}


#brand .flow{position: relative; margin-top: 100px; padding: 24px; border-top: 1px solid #E8E8E8; border-bottom: 1px solid #E8E8E8; overflow: hidden;}
#brand .flow .flow_wrap{position: relative; width: 230%; display: flex; justify-content: center; left: 20px;}
#brand .flow .flow_wrap li{width: 15%;}
#brand .flow .flow_wrap img{width: 100%;}


/* rd */
#rd{position: relative; margin-top: 160px; background-color: #F7F8FB; padding-top: 80px;}
#rd .title{position: relative; width: 70%; margin-bottom: 60px;}
#rd .title span{position: absolute; width: 12px; height: 12px; background-color: #5DC591; display: block; border-radius: 6px; left: -10px;}
#rd .title h3{font-size: 32px; font-weight: bold; padding-bottom: 22px; color: #241F20;}
#rd .title p{font-size: 18px; width: 80%; color: #AAA;}

#rd .wave{position: absolute; left: 0; top: -15%;}
#rd .wave img{width: 80%;}
#rd .sircle{position: absolute; right: -30px; top: 12%;}
#rd .sircle img{width: 80%;}

#rd .rd_contents{position: relative;}
#rd .rd_contents .rd_inner{position: relative; width: 85%; margin: 0 auto;}
#rd .rd_contents .accordion{position: relative; display: flex; width: 100%;}
#rd .rd_contents .accordion li{position: relative; width: 10%;  transition-duration: 0.5s;height: 750px; overflow: hidden;}
#rd .rd_contents .accordion li.select{width: 60%; background-position: center; background-size: cover;}
#rd .rd_contents .accordion .rd_1{background-image: url(../img/rd_0.png); background-position: center; background-size: cover;}
#rd .rd_contents .accordion .rd_2{background-image: url(../img/rd_1.png); height: 750px; background-position: center; background-size: cover;}
#rd .rd_contents .accordion .rd_3{background-image: url(../img/rd_2.png); height: 750px; background-position: center; background-size: cover;}
#rd .rd_contents .accordion .rd_4{background-image: url(../img/rd_3.png); height: 750px; background-position: center; background-size: cover;}
#rd .rd_contents .accordion .rd_5{background-image: url(../img/rd_4.png); height: 750px; background-position: center; background-size: cover;}

#rd .rd_contents .accordion li .rd_text{font-size: 20px;}
#rd .rd_contents .accordion li .rd_view{font-size: 20px; transform: translateX(-50%) rotate(0deg); width: 70%; text-align: center; line-height: 1.6em; white-space: wrap; opacity: 0;}
#rd .rd_contents .accordion li.select .rd_text{position: absolute; font-size: 32px; transform: translate(-50%, -50%) rotate(0deg); top: 35%; left: 50%; font-weight: bold;}
#rd .rd_contents .accordion li.select .rd_view{position: absolute; font-size: 20px; transform: translate(-50%, -50%) rotate(0deg); top: 50%; left: 50%; opacity: 1;  transition: opacity 3s;}

#rd .rd_contents .accordion li p{position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(90deg); font-size: 24px; color: #FFF; white-space: nowrap;}
#rd .rd_contents .accordion li .rd_hide{display: none;}





/* newtice */
#newtice{position: relative; margin-top: 200px; margin-bottom: 130px;}
#newtice .newtice_wrap{position: relative; width: 85%; margin: 0 auto;}
#newtice .newtice_wrap .title{position: relative; top: -50px; opacity: 0;}
#newtice .newtice_wrap .title span{position: absolute; width: 12px; height: 12px; background-color: #5DC591; display: block; border-radius: 6px; left: -10px;}
#newtice .newtice_wrap .title h3{font-size: 30px; font-weight: bold; padding-bottom: 22px; color: #241F20;}
#newtice .newtice_wrap .title p{font-size: 20px; color: #AAA;}

#newtice .newtice_wrap .newtice_inner{position: relative; width: 100%; display: flex; flex-direction: column;  margin-top: 70px; justify-content: space-between;}
#newtice .newtice_wrap .notice{line-height: 40px; margin-bottom: 80px;}
#newtice .newtice_wrap .notice h4{font-size: 24px; color: #241F20; top: -200px; opacity: 0;}
#newtice .newtice_wrap .notice ul{margin: 20px 0;}
#newtice .newtice_wrap .notice ul li{border-top: 1px solid #BDBDBD; padding: 22px 0 25px 35px;  top: -100px; opacity: 0;}
#newtice .newtice_wrap .notice ul li:hover{background-color: #F7F8FB;}
#newtice .newtice_wrap .notice ul li:last-child{border-bottom: 1px solid #BDBDBD;}
#newtice .newtice_wrap .notice ul .date{color: #5DC591; font-size: 18px;}
#newtice .newtice_wrap .notice ul .notice_text{font-size: 20px; color: #241F20; font-weight: 500; padding-left: 15px;}


#newtice .newtice_wrap .news h4{font-size: 24px; color: #241F20; padding-bottom: 20px; top: -200px; opacity: 0;}
#newtice .newtice_wrap .news ul{display: flex; justify-content: space-between;}
#newtice .newtice_wrap .news li{border: 1px solid #5DC591;  width: 32%; border-radius: 10px;
 padding: 30px 0 60px 0px; position: relative; top: -80px; opacity: 0;}
#newtice .newtice_wrap .news li:first-child{background-color: #5DC591;}
#newtice .newtice_wrap .news li:first-child{background-color: #5DC591;}
#newtice .newtice_wrap .news .date_white{color: #FFF; font-size: 16px; padding: 20px;}
#newtice .newtice_wrap .news .news_white{font-size: 18px; color: #FFF; padding: 20px;}
#newtice .newtice_wrap .news .date{color: #AAA; font-size: 17px;  padding: 20px;}
#newtice .newtice_wrap .news .news_text{font-size: 18px; color: #241F20;  padding: 20px;}


#newtice .newtice_wrap .newtice_btn{background-image: url(../img/more_green.png); width: 54px; height: 54px; display: block; margin: 0 auto; margin-top: 60px;}
}












@media screen and (min-width:601px) and (max-width:900px) {
/* topBanner */
#topBanner{position: relative; overflow: hidden;}
#topBanner .top_img{position: relative; width: 900px; height: 454px;}
#topBanner .top_img li{position: absolute; left: 0; top: 0;}
#topBanner .top_img li img{width: 100%;}
#topBanner .top_contents{position: absolute; left: 10%; top: 30%; transition-duration: 0.5s;}
#topBanner .top_text h2{color: #FFF; font-size: 4vw; font-weight: bold;}
#topBanner .top_text p{color: #FFF; font-size: 2.5vw; padding: 25px 0; text-shadow: rgba(255, 255, 255, 0.3); width: 60%;}
#topBanner .move_controls{position: absolute; display: flex; align-items: center; width: 30%; justify-content: space-between; padding-top: 4%;}
#topBanner .controls{ display: flex; cursor: pointer; align-items: center;}
#topBanner .controls li{width: 15px; height: 15px; border-radius: 12px; margin: 0 10px; border: 1px solid #FFF;}
#topBanner .controls .top_select{background-color: #FFF; width: 40px;}
#topBanner .top_btn{display: flex; align-items: center;}
#topBanner .top_btn button{border: none; background: none; cursor: pointer; padding: 0 8px;}
#topBanner .top_btn .stop img{width: 20px; height: 24px;}

#topBanner .mob_banner{display: none;}

#topBanner .btn_left{display: none;}
#topBanner .btn_right{display: none;}

/* about */
#about{position: relative; width: 100%; margin: 80px auto; transition-duration: 0.5s;}
#about .about_top{width: 88%; display: flex; flex-direction: column;  margin: 0 auto; margin-bottom: 40px; transition-duration: 0.5s;}
#about .about_top .about_left{position: relative; margin-left: 2%; margin-bottom: 60px;}
#about .about_top .about_left span{position: absolute; width: 12px; height: 12px; background-color: #5DC591; display: block; border-radius: 6px; left: -10px;}
#about .about_top .about_left h3{font-size: 26px; font-weight: bold; padding-bottom: 36px; color: #241F20;}
#about .about_top .about_left p{font-size: 16px; width: 60%; color: #AAA;}


#about .about_top .about_box{display: flex; justify-content: space-between;}
#about .about_top .about_middle{position: relative; background-color: #5DC591; border-radius: 20px; justify-content: space-between; width: 50%; margin-right: 20px; padding: 6%;}
#about .about_top .about_middle .about_name{font-size: 20px; font-weight: 500; color: #FFF; padding-bottom: 30px;}
#about .about_top .about_middle .about_text{font-size: 18px; color: #FFF;}
#about .about_top .about_middle span{position: absolute; right: 20px; top: 28px; background-image: url(../img/more_white.png); width: 36px; height: 37px; display: block; transition: transform 0.3s ease;}

#about .about_top .about_right{position: relative; background-color: #FFF; border: 1px solid #5DC591; width: 50%; border-radius: 20px; padding: 6%;}
#about .about_top .about_right .about_name{font-size: 20px; padding-bottom: 30px; font-weight: 500; color: #241F20;}
#about .about_top .about_right .about_text{font-size: 16px; color: #6D6D6D;}
#about .about_top .about_right span{position: absolute; right: 20px; top: 28px; background-image: url(../img/more_black.png); width: 36px; height: 37px; display: block; transition: transform 0.3s ease;}

#about .about_bottom{position: relative; width: 88%; margin: 0 auto;}
#about .about_bottom .img_box{position: relative; width: 100%; margin: 0 auto; display: block; background-image: url(../img/about_banner.png); height: 280px; background-position: center; background-repeat: no-repeat; background-size: cover; border-radius: 20px;}
#about .about_bottom img{width: 100%;}
#about .about_bottom p{position: absolute; width: 70%; top: 0; left: 50%; top: 50%; transform: translate(-50%, -50%); font-size: 16px; color: #FFF; text-align: center;}
#about .about_bottom .about_button{position: absolute; top: 8%; right: 12%; border: 1px solid #FFF; font-size: 14px; color: #FFF; padding: 10px 28px; display: flex; align-items: center;}
#about .about_bottom .about_button span{background-image: url(../img/arrow_white.png); width: 36px; height: 8px; display: block; margin-left: 20px;}


/* value */
#value{position: relative; width: 100%; height: 700px; overflow: hidden; background-image: url(../img/value_banner.png); background-position: center; background-size: cover; background-repeat: no-repeat; box-sizing: border-box; transition-duration: 0.5s;}
#value .value_top{position: absolute; left: 50%; top: 10%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; text-align: center;}
#value .value_top h3{color: #FFF; font-size: 32px; padding-bottom: 40px;}
#value .value_top .line_1{width: 1px; height: 30px; background-color: #fff; display: block; margin: 0 auto;}
#value .value_top .value_text{color: #FFF; font-size: 18px; padding-top: 40px;}
#value .value_bottom{position: absolute; width: 90%; left: 50%; top: 55%; transform: translateX(-50%); transition-duration: 0.5s; display: flex; justify-content: space-between;}
#value .value_bottom li{display: flex; flex-direction: column; align-items: center; margin: 30px 0; width: 190px; height: 190px; border: 1px solid #FFF; border-radius: 110px; justify-content: center; transition-duration: 0.5s;}
#value .value_bottom li p{text-align: center; color: #FFF; font-size: 16px;}


/* brand */
#brand{position: relative; margin-top: 120px;}
#brand .title{position: relative; width: 80%; margin: 0 auto; margin-bottom: 60px;  transition-duration: 0.5s;}
#brand .title span{position: absolute; width: 12px; height: 12px; background-color: #5DC591; display: block; border-radius: 6px; left: -10px;}
#brand .title h3{font-size: 30px; font-weight: bold; padding-bottom: 22px; color: #241F20;}
#brand .title p{font-size: 20px; color: #AAA;}
#brand .brand_wrap{display: none;}

#brand .brand_wrap_2{display: flex; flex-direction: column; width: 80%; margin: 0 auto;}
#brand .brand_wrap_2 .big_wrap{width: 80%; margin: 0 auto; margin-bottom: 15px;}
#brand .brand_wrap_2 .big_wrap img{width: 100%;}

#brand .brand_wrap_2 {position: relative; display: flex; flex-direction: column; justify-content: center; margin-top: 20px; padding: 0 20px; box-sizing: border-box;}
#brand .brand_wrap_2 .text_box{padding: 0 10% 0 5%; margin-top: 50px;}
#brand .brand_wrap_2 .text_box>div{display: flex; justify-content: space-between; align-items: center;}
#brand .brand_wrap_2 button{border: 1px solid #241F20; background: none; color: #241F20; padding: 15px 30px; width: 220px; display: flex; align-items: center;}
#brand .brand_wrap_2 button span{background-image: url(../img/arrow.png); width: 26px; height: 8px; display: block; background-repeat: no-repeat; margin-left: 20px;}
#brand .brand_wrap_2 .text_box .famous{font-size: 25px; color: #0040A0; font-weight: bold;}
#brand .brand_wrap_2 .text_box .pro_title{font-size: 20px; font-weight: bold; color: #241F20; padding-top: 15px;}
#brand .brand_wrap_2 .text_box .detail{font-size: 18px; color: #241F20;  padding-top: 30px;}

#brand .brand_wrap_2 .brand_img .small_list{display: flex;}
#brand .brand_wrap_2 .brand_img .small_list li{width: 90%;}
#brand .brand_wrap_2 .brand_img .small_list img{width: 100%;}

#brand button{border: none; background: none; cursor: pointer; transition-duration: 0.5s;}
#brand .next{position: absolute;  right: 5%; top: 27%;}
#brand .next img{width: 80%;}
#brand .prev{position: absolute; left: 5%; top: 27%;}
#brand .prev img{width: 80%;}


#brand .flow{position: relative; margin-top: 100px; padding: 24px; border-top: 1px solid #E8E8E8; border-bottom: 1px solid #E8E8E8; overflow: hidden;}
#brand .flow .flow_wrap{position: relative; width: 230%; display: flex; justify-content: center; left: 20px;}
#brand .flow .flow_wrap li{width: 15%;}
#brand .flow .flow_wrap img{width: 100%;}


#brand .flow{position: relative; margin-top: 100px; padding: 24px; border-top: 1px solid #E8E8E8; border-bottom: 1px solid #E8E8E8; overflow: hidden;}
#brand .flow .flow_wrap{position: relative; width: 300%; display: flex; justify-content: center; left: 20px;}
#brand .flow .flow_wrap li{width: 15%;}
#brand .flow .flow_wrap img{width: 100%;}


/* rd */
#rd{position: relative; margin-top: 160px; background-color: #F7F8FB; padding-top: 80px;}
#rd .title{position: relative; width: 85%; margin: 0 auto; margin-bottom: 60px;}
#rd .title span{position: absolute; width: 12px; height: 12px; background-color: #5DC591; display: block; border-radius: 6px; left: -10px;}
#rd .title h3{font-size: 32px; font-weight: bold; padding-bottom: 22px; color: #241F20;}
#rd .title p{font-size: 18px; width: 80%; color: #AAA;}

#rd .wave{position: absolute; left: 0; top: -15%;}
#rd .wave img{width: 80%;}
#rd .sircle{position: absolute; right: -30px; top: 12%;}
#rd .sircle img{width: 80%;}

#rd .rd_contents{position: relative;}
#rd .rd_contents .rd_inner{position: relative; margin: 0 auto;}
#rd .rd_contents .accordion{position: relative; display: flex; flex-direction: column; width: 85%; margin: 0 auto;}
#rd .rd_contents .accordion li{position: relative; width: 100%; transition-duration: 0.5s;}
#rd .rd_contents .accordion li.select{width: 100%; height: 450px;}
#rd .rd_contents .accordion .rd_1{background-image: url(../img/rd_0.png); height: 110px; background-position: center; background-size: cover;}
#rd .rd_contents .accordion .rd_2{background-image: url(../img/rd_1.png); height: 110px; background-position: center; background-size: cover;}
#rd .rd_contents .accordion .rd_3{background-image: url(../img/rd_2.png); height: 110px; background-position: center; background-size: cover;}
#rd .rd_contents .accordion .rd_4{background-image: url(../img/rd_3.png); height: 110px; background-position: center; background-size: cover;}
#rd .rd_contents .accordion .rd_5{background-image: url(../img/rd_4.png); height: 110px; background-position: center; background-size: cover;}

#rd .rd_contents .accordion li .text_wrap{width: 80%; margin: 0 auto;}
#rd .rd_contents .accordion li .rd_text{font-size: 22px;}
#rd .rd_contents .accordion li img{width: 100%;}
#rd .rd_contents .accordion li .rd_view{font-size: 20px; transform: translate(-50%, -50%); width: 70%; text-align: center; line-height: 1.6em; white-space: wrap; opacity: 0;}
#rd .rd_contents .accordion li.select .rd_text{position: absolute; font-size: 28px; transform: translateX(-50%); top: 30%; left: 50%; font-weight: bold;}
#rd .rd_contents .accordion li.select .rd_view{ position: absolute; font-size: 18px; transform: translateX(-50%); top: 50%; left: 50%; opacity: 1;  transition: opacity 1s;}

#rd .rd_contents .accordion li p{position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); font-size: 24px; color: #FFF; white-space: nowrap;}
#rd .rd_contents .accordion li .rd_hide{display: none;}


/* newtice */
#newtice{position: relative; margin-top: 200px; margin-bottom: 130px;}
#newtice .newtice_wrap{position: relative; margin: 0 auto;}
#newtice .newtice_wrap .title{position: relative; width: 85%; margin: 0 auto;}
#newtice .newtice_wrap .title span{position: absolute; width: 12px; height: 12px; background-color: #5DC591; display: block; border-radius: 6px; left: -10px;}
#newtice .newtice_wrap .title h3{font-size: 28px; font-weight: bold; padding-bottom: 22px; color: #241F20;}
#newtice .newtice_wrap .title p{font-size: 20px; color: #AAA;}

#newtice .newtice_wrap .newtice_inner{position: relative; width: 100%; display: flex; flex-direction: column;  margin-top: 70px; justify-content: space-between;}
#newtice .newtice_wrap .notice{line-height: 40px; margin: 0 auto; width: 85%;}
#newtice .newtice_wrap .notice h4{font-size: 24px; color: #241F20;}
#newtice .newtice_wrap .notice ul{margin: 20px 0;}
#newtice .newtice_wrap .notice ul li{border-top: 1px solid #BDBDBD; padding: 22px 0 25px 35px; }
#newtice .newtice_wrap .notice ul li:hover{background-color: #F7F8FB;}
#newtice .newtice_wrap .notice ul li:last-child{border-bottom: 1px solid #BDBDBD;}
#newtice .newtice_wrap .notice ul .date{color: #5DC591; font-size: 18px;}
#newtice .newtice_wrap .notice ul .notice_text{font-size: 20px; color: #241F20; font-weight: 500; padding-left: 15px;}

#newtice .newtice_wrap .news{width: 85%; margin: 0 auto; margin-top: 60px;}
#newtice .newtice_wrap .news h4{font-size: 24px; color: #241F20; padding-bottom: 20px;}
#newtice .newtice_wrap .news ul{display: flex; justify-content: space-between;}
#newtice .newtice_wrap .news li{border: 1px solid #5DC591;  width: 49%; border-radius: 10px; padding: 30px 0 60px 0px;}
#newtice .newtice_wrap .news ul li:last-child{display: none;}
#newtice .newtice_wrap .news li:first-child{background-color: #5DC591;}
#newtice .newtice_wrap .news li:first-child{background-color: #5DC591;}
#newtice .newtice_wrap .news .date_white{color: #FFF; font-size: 16px; padding: 20px;}
#newtice .newtice_wrap .news .news_white{font-size: 18px; color: #FFF; padding: 20px;}
#newtice .newtice_wrap .news .date{color: #AAA; font-size: 17px;  padding: 20px;}
#newtice .newtice_wrap .news .news_text{font-size: 18px; color: #241F20;  padding: 20px;}


#newtice .newtice_wrap .newtice_btn{background-image: url(../img/more_green.png); width: 54px; height: 54px; display: block; margin: 0 auto; margin-top: 60px;}
}
















@media screen and (max-width:600px){
    /* topBanner */
#topBanner{position: relative; overflow: hidden; margin-top: 55px;}
#topBanner .top_img_mob{display: flex; width: 300%;}
#topBanner .top_img_mob li{width: 100%;}
#topBanner .top_img_mob li img{width: 100%;}
#topBanner .move_controls_mob{position: absolute; display: flex; align-items: center; width: 30%; justify-content: space-between; left: 8%; bottom: -60%; padding-top: 4%;}
#topBanner .top_contents_mob{position: absolute; width: 50%; left: 55%; top: 50%; transform: translate(-50%,-50%); transition-duration: 0.5s;}
#topBanner .top_text_mob h2{color: #FFF; font-size: 30px; font-weight: bold;}
#topBanner .top_btn_mob{display: flex; align-items: center;}
#topBanner .top_btn_mob button{border: none; background: none; cursor: pointer; padding: 0 8px;}


#topBanner .top_img{display: none;}
#topBanner .top_img li{width: 100%;}
#topBanner .top_img li img{width: 100%;}
#topBanner .top_contents{display: none;}
#topBanner .top_text_mob h2{color: #FFF; font-size: 30px; font-weight: bold;}
#topBanner .top_text_mob p{display: none;}
#topBanner .move_controls{display: none;}
#topBanner .controls{ display: flex; cursor: pointer; align-items: center;}
#topBanner .controls li{width: 15px; height: 15px; border-radius: 12px; margin: 0 10px; border: 1px solid #FFF;}
#topBanner .controls .top_select{background-color: #FFF; width: 40px;}
#topBanner .top_btn{display: flex; align-items: center;}
#topBanner .top_btn button{border: none; background: none; cursor: pointer; padding: 0 8px;}

#topBanner .btn_left{position: absolute; background: none; border: none; top: 45%;
    left: 3%; cursor: pointer;}
#topBanner .btn_left img{width: 70%;}
#topBanner .btn_right{position: absolute; background: none; border: none; top: 45%;
    right: 3%; cursor: pointer;}
#topBanner .btn_right img{width: 70%;}

/* about */
#about{position: relative; width: 92%; margin: 60px auto; transition-duration: 0.5s; overflow: hidden;}
#about .about_top{ display: flex; flex-direction: column;  margin: 0 auto; margin-bottom: 30px; transition-duration: 0.5s;}
#about .about_top .about_left{position: relative; margin-left: 5%; margin-bottom: 50px;}
#about .about_top .about_left span{position: absolute; width: 12px; height: 12px; background-color: #5DC591; display: block; border-radius: 6px; left: -10px;}
#about .about_top .about_left h3{font-size: 23px; font-weight: bold; padding-bottom: 24px; color: #241F20;}
#about .about_top .about_left p{font-size: 14px; width: 70%; color: #AAA;}


#about .about_top .about_box{position: relative; width: 100%; display: flex; flex-direction: column; justify-content: space-between;}
#about .about_top .about_middle{position: relative; background-color: #5DC591; border-radius: 20px; justify-content: space-between;  padding: 8% 10%;}
#about .about_top .about_middle .about_name{font-size: 20px; font-weight: 500; color: #FFF; padding-bottom: 30px;}
#about .about_top .about_middle .about_text{font-size: 16px; color: #FFF;}
#about .about_top .about_middle span{position: absolute; right: 40px; top: 32px; background-image: url(../img/more_white.png); width: 36px; height: 37px; display: block;}

#about .about_top .about_right{position: relative; background-color: #FFF; border: 1px solid #5DC591; border-radius: 20px; padding: 8% 10%; margin-top: 20px;}
#about .about_top .about_right .about_name{font-size: 20px; padding-bottom: 30px; font-weight: 500; color: #241F20;}
#about .about_top .about_right .about_text{font-size: 16px; color: #6D6D6D;}
#about .about_top .about_right span{position: absolute; right: 40px; top: 32px; background-image: url(../img/more_black.png); width: 36px; height: 37px; display: block;}

#about .about_bottom{position: relative; width: 100%; margin: 0 auto;}
#about .about_bottom .img_box{position: relative; width: 100%; margin: 0 auto; display: block; background-image: url(../img/about_banner.png); width: 100%; height: 240px; background-position: center; background-repeat: no-repeat; background-size: cover; border-radius: 20px;}
#about .about_bottom img{width: 100%;}
#about .about_bottom p{position: absolute; width: 85%; left: 50%; top: 52%; transform: translate(-50%, -50%); font-size: 14px; color: #FFF; text-align: center;}
#about .about_bottom .about_button{position: absolute; top: 8%; right: 10%; border: 1px solid #FFF; font-size: 14px; color: #FFF; padding: 10px 18px; display: flex; align-items: center;}
#about .about_bottom .about_button span{background-image: url(../img/arrow_white.png); width: 36px; height: 8px; display: block; margin-left: 20px;}


/* value */
#value{position: relative; width: 100%; height: 500px; overflow: hidden; background-image: url(../img/value_banner.png); background-position: center; background-size: cover; background-repeat: no-repeat; box-sizing: border-box; transition-duration: 0.5s; overflow: hidden;}
#value .value_top{position: absolute; left: 50%; top: 8%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; text-align: center; width: 70%;}
#value a{position: absolute; color: #FFF; left: 50%; top: 43%; border: 1px solid #FFF; padding: 12px 30px; transform: translateX(-50%);}
#value .value_top h3{color: #FFF; font-size: 32px; padding-bottom: 40px;}
#value .value_top .value_text{color: #FFF; font-size: 15px;}
#value .value_bottom{position: absolute; width: 92%; left: 50%; top: 45%; transform: translateX(-50%); transition-duration: 0.5s; display: flex; justify-content: space-between;}
#value .value_bottom li{display: flex; flex-direction: column; align-items: center; margin: 30px 0; width: 31%; justify-content: center; transition-duration: 0.5s;}
#value .value_bottom li .img_box{width: 100%; border: 1px solid #FFF; border-radius: 80px;  padding: 20% 0; display: flex; justify-content: center;}
#value .value_bottom li img{width: 60%;}
#value .value_bottom li p{text-align: center; color: #FFF; font-size: 18px; margin-top: 15px;}
#value .value_bottom li p:last-child{display: none;}


/* brand */
#brand{position: relative; margin: 0 auto; margin-top: 100px; overflow: hidden;}
#brand .title{position: relative; width: 85%; margin: 0 auto; margin-bottom: 30px;  transition-duration: 0.5s;}
#brand .title span{position: absolute; width: 8px; height: 8px; background-color: #5DC591; display: block; border-radius: 6px; left: -12px;}
#brand .title h3{font-size: 25px; font-weight: bold; padding-bottom: 18px; color: #241F20;}
#brand .title p{font-size: 16px; color: #AAA;}
#brand .brand_wrap{display: none;}

#brand .brand_wrap_2{display: flex; flex-direction: column;  width: 92%; margin: 0 auto;}
#brand .brand_wrap_2 .big_wrap{width: 90%; margin: 0 auto; margin-bottom: 15px;}
#brand .brand_wrap_2 .big_wrap img{width: 90%; margin: 0 auto;}

#brand .brand_wrap_2 {position: relative; display: flex; flex-direction: column; justify-content: center; width: 85%; margin-top: 20px;}
#brand .brand_wrap_2 .text_box{ margin-top: 40px;}
#brand .brand_wrap_2 .text_box>div{display: flex; justify-content: space-between; align-items: center;}
#brand .brand_wrap_2 button{border: 1px solid #241F20; background: none; color: #241F20; padding: 10px 10px; width: 160px; display: flex; justify-content: space-around; align-items: center;}
#brand .brand_wrap_2 button span{background-image: url(../img/arrow.png); width: 26px; height: 8px; display: block; background-repeat: no-repeat;}
#brand .brand_wrap_2 .text_box .famous{font-size: 20px; color: #0040A0; font-weight: bold;}
#brand .brand_wrap_2 .text_box .pro_title{font-size: 18px; font-weight: bold; color: #241F20; padding-top: 15px;}
#brand .brand_wrap_2 .text_box .detail{font-size: 16px; padding-right: 15%; color: #241F20;  padding-top: 30px;}

#brand .brand_wrap_2 .brand_img .small_list{display: flex;}
#brand .brand_wrap_2 .brand_img .small_list li{width: 90%;}
#brand .brand_wrap_2 .brand_img .small_list img{width: 100%;}

#brand button{border: none; background: none; cursor: pointer; transition-duration: 0.5s;}
#brand .next{position: absolute; width: 25px; height: 42px;  right: 3%; top: 22%;}
#brand .next img{width: 100%;}
#brand .prev{position: absolute; width: 25px; height: 42px; left: 3%; top: 22%;}
#brand .prev img{width: 100%;}

#brand .flow{position: relative; margin-top: 70px; padding: 26px 0; border-top: 1px solid #E8E8E8; border-bottom: 1px solid #E8E8E8; overflow: hidden;}
#brand .flow .flow_wrap{position: relative; width: 500%; display: flex; justify-content: center; left: 20px;}
#brand .flow .flow_wrap li{width: 50%;}
#brand .flow .flow_wrap img{width: 100%;}


/* rd */
#rd{position: relative; margin-top: 70px; background-color: #F7F8FB; padding-top: 40px; overflow: hidden;}
#rd .title{position: relative; width: 85%; margin: 0 auto; margin-bottom: 30px;}
#rd .title span{position: absolute; width: 8px; height: 8px; background-color: #5DC591; display: block; border-radius: 6px; left: -10px;}
#rd .title h3{font-size: 25px; font-weight: bold; padding-bottom: 18px; color: #241F20;}
#rd .title p{font-size: 16px; width: 80%; color: #AAA;}

#rd .wave{position: absolute; left: -10px; top: -5%;}
#rd .wave img{width: 80%;}
#rd .sircle{position: absolute; right: -200px; top: 15%;}
#rd .sircle img{width: 55%;}

#rd .rd_contents{position: relative;}
#rd .rd_contents .rd_inner{position: relative; margin: 0 auto;}
#rd .rd_contents .accordion{position: relative; display: flex; flex-direction: column; width: 92%; margin: 0 auto;}
#rd .rd_contents .accordion li{position: relative; width: 100%; transition-duration: 0.5s;}
#rd .rd_contents .accordion li.select{width: 100%; height: 300px;}
#rd .rd_contents .accordion .rd_1{background-image: url(../img/rd_0.png); height: 80px; background-position: center; background-size: cover; }
#rd .rd_contents .accordion .rd_2{background-image: url(../img/rd_1.png); height: 80px; background-position: center; background-size: cover;}
#rd .rd_contents .accordion .rd_3{background-image: url(../img/rd_2.png); height: 80px; background-position: center; background-size: cover;}
#rd .rd_contents .accordion .rd_4{background-image: url(../img/rd_3.png); height: 80px; background-position: center; background-size: cover;}
#rd .rd_contents .accordion .rd_5{background-image: url(../img/rd_4.png); height: 80px; background-position: center; background-size: cover;}


#rd .rd_contents .accordion li.img{width: 100%;}
#rd .rd_contents .accordion li .rd_text{font-size: 18px;}
#rd .rd_contents .accordion li .rd_view{font-size: 16px; transform: translate(-50%, -50%); width: 70%; text-align: center; line-height: 1.6em; white-space: wrap; opacity: 0;}
#rd .rd_contents .accordion li.select .rd_text{position: absolute; font-size: 18px; transform: translate(-50%, -50%); top: 25%; left: 50%; font-weight: bold;}
#rd .rd_contents .accordion li.select .rd_view{ position: absolute; font-size: 14px; transform: translate(-50%, -50%); top: 55%; left: 50%; text-align: center; display: block; opacity: 1;  transition: opacity 1s;}
#rd .rd_contents .accordion li p{position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); font-size: 16px; color: #FFF; white-space: nowrap;}
#rd .rd_contents .accordion li .rd_hide{display: none;}




/* newtice */
#newtice{position: relative; margin-top: 100px; margin-bottom: 130px; overflow: hidden;}
#newtice .newtice_wrap{position: relative; margin: 0 auto;}
#newtice .newtice_wrap .title{position: relative; width: 85%; margin: 0 auto;}
#newtice .newtice_wrap .title span{position: absolute; width: 8px; height: 8px; background-color: #5DC591; display: block; border-radius: 6px; left: -10px;}
#newtice .newtice_wrap .title h3{font-size: 25px; font-weight: bold; padding-bottom: 18px; color: #241F20;}
#newtice .newtice_wrap .title p{font-size: 16px; color: #AAA;}

#newtice .newtice_wrap .newtice_inner{position: relative; width: 100%; display: flex; flex-direction: column;  margin-top: 40px; justify-content: space-between;}
#newtice .newtice_wrap .notice{line-height: 40px; margin: 0 auto; width: 92%;}
#newtice .newtice_wrap .notice h4{font-size: 20px; color: #241F20;}
#newtice .newtice_wrap .notice ul{margin: 20px 0;}
#newtice .newtice_wrap .notice ul li{border-top: 1px solid #BDBDBD; padding: 15px 0 15px 15px; }
#newtice .newtice_wrap .notice ul li:hover{background-color: #F7F8FB;}
#newtice .newtice_wrap .notice ul li:last-child{border-bottom: 1px solid #BDBDBD;}
#newtice .newtice_wrap .notice ul .date{color: #5DC591; font-size: 16px;}
#newtice .newtice_wrap .notice ul .notice_text{font-size: 18px; color: #241F20; font-weight: 500; padding-left: 10px;  overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}

#newtice .newtice_wrap .news{width: 92%; margin: 0 auto; margin-top: 25px;}
#newtice .newtice_wrap .news h4{font-size: 20px; color: #241F20; padding-bottom: 20px;}
#newtice .newtice_wrap .news ul{display: flex; flex-direction: column; justify-content: space-between;}
#newtice .newtice_wrap .news li{border: 1px solid #5DC591; border-radius: 10px; padding: 30px 0 60px 0px; }
#newtice .newtice_wrap .news ul li:last-child{display: none;}
#newtice .newtice_wrap .news li:first-child{background-color: #5DC591; margin-bottom: 20px;}
#newtice .newtice_wrap .news .date_white{color: #FFF; font-size: 16px; padding: 20px;}
#newtice .newtice_wrap .news .news_white{font-size: 18px; color: #FFF; padding: 20px;}
#newtice .newtice_wrap .news .date{color: #AAA; font-size: 16px;  padding: 20px;}
#newtice .newtice_wrap .news .news_text{font-size: 18px; color: #241F20;  padding: 20px;}


#newtice .newtice_wrap .newtice_btn{background-image: url(../img/more_green.png); width: 54px; height: 54px; display: block; margin: 0 auto; margin-top: 35px;}
}