@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;500;700&family=Roboto:wght@300;500;700&display=swap');
/* font-family: 'Noto Sans KR', sans-serif;
font-family: 'Roboto', sans-serif; */
*{margin:0; padding:0;}
a{text-decoration:none;}
li{list-style:none;}
img{border:none;}

body,section,div,ul,li,h1,h2,h3,h4,h5,h6,p,span,a{font-family: 'Noto Sans KR', sans-serif; font-weight:300; color:#222; font-size:14px;}


/* header */
#header{position:fixed; width:100%; height:100px; left:0; top:0; z-index:999; background-color:rgba(255,255,255,0.8);}
#header h1{position:absolute; left:40px; padding-top:35px;}
#header .gnb{position:absolute; top:45px; left:240px;}
#header .gnb>ul:after{content:''; display:block; clear:both;}
#header .gnb>ul>li{float:left;}
#header .gnb>ul>li:hover>a{border-bottom:3px solid #cc0000; color:#cc0000;}
#header .gnb>ul>li>a{font-size:20px; font-family: 'Roboto', sans-serif; font-weight:500; text-align:center; padding:20px 30px; color:#222;}
#header .gnb>ul>li>.sub_menu{margin-top:30px; background-color:#fff; display:none; margin-top:30px;}
#header .gnb>ul>li>.sub_menu>li{text-align:center;}
#header .gnb>ul>li>.sub_menu>li:hover>a{background-color:#cc0000; color:#fff; transition-duration:0.5s;}
#header .gnb>ul>li>.sub_menu>li>a{display:block; padding:20px 0; font-family: 'Roboto', sans-serif; color:#222; font-size:16px;}
#header .util{position:absolute; top:35px; right:40px;}
#header .util>ul:after{content:''; display:block; clear:both;}
#header .util>ul>li{float:left; position:relative; height:35px;}
#header .util>ul>li.search{margin-right:15px;}
#header .util>ul>li.search>input{position:absolute; width:125px; height:35px; right:35px; top:0; padding:5px 20px; font-size:12px; border-radius:20px; box-sizing:border-box; border:none; text-align:center; background-color:#bbb; opacity:0.7; margin-right:10px;}
#header .util>ul>li.search>.search_btn{background:url(../img/search_icon.png) 0 0 no-repeat; display:inline-block; width:30px; height:30px;}
#header .util>ul>li>.gnb_btn{cursor:pointer;}

.mob_gnb{position:fixed; z-index:9999; background-color:#fff; width:100%; left:0; top:0; border-bottom:2px solid #ccc; display:none; height:100%; overflow-y:scroll;}
.mob_gnb .mob_gnb_top{height:80px; border-bottom:1px solid #ccc;}
.mob_gnb .mob_gnb_logo{position:absolute; left:40px;}
.mob_gnb .mob_gnb_logo h2 a>img{width:60%; display:block; padding-top:35px;}
.mob_gnb .mob_gnb_close{position:absolute; right:40px; top:32px; cursor: pointer;}
.mob_gnb .search{position:relative; padding:20px 30px 0 30px; text-align:center;}
.mob_gnb .search>input{width:70%; height:40px;}
.mob_gnb .search>.search_btn{position:absolute; background:url(../img/search_icon.png) 0 0 no-repeat; display:inline-block; width:30px; height:30px; top:25px; margin-left:15px; }
.mob_gnb>ul{padding:40px;}
.mob_gnb>ul>li{position:relative; padding:30px 0; cursor:pointer;}
.mob_gnb>ul>li>span.slide_btn{position:absolute; right:20px; top:45px; transition-duration:0.5s;}
.mob_gnb>ul>li.select>span.slide_btn{transform:rotate(180deg);}
.mob_gnb>ul>li>a{font-size:30px; font-weight:700; color:#222;}
.mob_gnb>ul>li .sub_menu{display:none; background-color:#fff;}
.mob_gnb>ul>li .sub_menu>li{padding:20px;}
.mob_gnb>ul>li .sub_menu>li:hover{background-color:#cc0000;}
.mob_gnb>ul>li .sub_menu>li>a{font-size:18px; color:#222; display:block;}
.mob_gnb>ul>li .sub_menu>li:hover>a{color:#fff;}

/* top_banner */
#top_banner{position:relative;}
#top_banner h2{font-size:0; display:none;}
#top_banner .banner_inner{position:relative; width:100%; overflow:hidden;}
#top_banner .banner_inner .mov_bg_img{width:100%; height:100%; display:block; opacity:0;}
#top_banner .banner_inner .banner_mov>li{position:absolute; left:0; top:0; display:none; width:100%;}
#top_banner .banner_inner .banner_mov>li:first-child{display:block;}
#top_banner .banner_inner .banner_mov>li video{display:block; width:100%;}
#top_banner .banner_inner ul.controls{position:absolute; bottom:35px; left:50%; transform:translateX(-50%); z-index:998;}
#top_banner .banner_inner ul.controls:after{content:''; display:block; clear:both;}
#top_banner .banner_inner ul.controls>li{float:left; background-color:#fff; border-radius:15px; width:60px; height:10px; cursor:pointer; margin-left:20px; border:1px solid #222;}
#top_banner .banner_inner ul.controls>li:hover{border:1px solid #cc0000;}
#top_banner .banner_inner ul.controls>li:first-child{margin-left:0;}
#top_banner .banner_inner ul.controls>li.select{background-color:#cc0000;}
#top_banner .banner_inner .play_btn_wrap{position:absolute; bottom:33px; left:50%; transform:translateX(-50%); z-index:998; margin-left:180px; cursor:pointer;}
#top_banner .banner_inner .play_btn_wrap>.play_btn>img{display:block;}
#top_banner .banner_inner .pause_btn_wrap{position:absolute; bottom:28px; left:50%; transform:translateX(-50%); z-index:998; margin-left:150px; cursor:pointer;}
#top_banner .banner_inner .play_btn_wrap>.pause_btn>img{display:block;}

/* main_product */
#main_product{position:relative; width:100%; z-index:1;}
#main_product .main_pro_title{position:absolute; right:60px; top:30px; z-index:997;}
#main_product .main_pro_title>h2{position:relative; color:#fff; font-family: 'Roboto', sans-serif; font-size:40px; line-height:40px;}
#main_product .main_pro_title>h2>span.before_border{border-bottom:2px solid #fff; width:1800px; position:absolute; left:-1800px; top:50%; transform:translateY(-50%);}
#main_product .main_pro_title>h2>span.after_border{border-bottom:2px solid #fff; width:60px; position:absolute; right:-60px; transform:translateY(-50%);}
#main_product .main_pro_title>h2>span.red_text{color:#cc0000; font-family: 'Roboto', sans-serif; font-size:40px;}
#main_product .controls_wrap{position:absolute; width:120px; box-sizing:border-box; height:100%; top:0; border-right:2px solid #fff;}
#main_product .controls_wrap>ul.controls{position:absolute; left:47.5px; top:50%; transform:translateY(-50%);}
#main_product .controls_wrap>ul.controls>li.select{background-color:#fff;}
#main_product .controls_wrap>ul.controls>li{border:1px solid #fff; width:25px; height:25px; border-radius:50%; margin:30px auto; cursor: pointer;}
#main_product .controls_wrap>ul.controls>li:hover{border:1px solid #cc0000;}
#main_product .pro_bg{position:relative; width:100%;}
#main_product .pro_bg_img{width:100%; display:block; opacity:0;}
#main_product .pro_bg>ul{width:100%;}
#main_product .pro_bg>ul>li{position:absolute; width:100%; left:0; top:0; display:none;}
#main_product .pro_bg>ul>li:first-child{display:block;}
#main_product .pro_bg>ul>li>img{display:block; width:100%;}
#main_product .pro_bg>ul>li>.pro_text{position:absolute; left:170px; top:100px;}
#main_product .pro_bg>ul>li>.pro_text h3{font-family: 'Roboto', sans-serif; font-size:45px; color:#fff; font-weight:500;}
#main_product .pro_bg>ul>li>.pro_text h3>span{font-family: 'Roboto', sans-serif; font-size:65px; font-weight:700; color:#fff;}
#main_product .pro_bg>ul>li>.pro_text p{font-size:18px; color:#fff;}

/* all_product */
#all_product{position:relative; background-color:#f4f2f2;}
#all_product>.tabs{position:absolute; width:800px;background-color:#fff; border-radius:25px; overflow:hidden; top:-50px; left:50%; transform:translateX(-50%); z-index:997;}
#all_product>.tabs>ul:after{content:''; display:block; clear:both;}
#all_product>.tabs>ul>li{position:relative; float:left; width:25%; text-align:center; line-height:100px; font-family: 'Roboto', sans-serif; font-weight:500; font-size:20px; color:#ccc; cursor:pointer; }
#all_product>.tabs>ul>li:hover{color:#222; transition-duration:0.5s;}
#all_product>.tabs>ul>li:after{position:absolute; content:''; display:block; border-left:1px solid #ccc; height:45px; right:0; top:50%; transform:translateY(-50%);}
#all_product>.tabs>ul>li.select:after{content:none;}
#all_product>.tabs>ul>li:last-child:after{content:none;}
#all_product>.tabs>ul>li.select{background-color:#222; color:#fff;}
#all_product>.slider_btn{position:absolute; width:500px; left:50%; bottom:25%; transform:translateX(-50%);}
#all_product>.slider_btn .prev_btn{position:absolute; background:url(../img/slider_btn.png) 0 0 no-repeat; width:29px; height:50px; cursor:pointer; left:-28px;}
#all_product>.slider_btn .prev_btn:hover{background:url(../img/slider_btn.png) -29px 0 no-repeat;}
#all_product>.slider_btn .next_btn{position:absolute; background:url(../img/slider_btn.png) -58px 0 no-repeat; width:29px; height:50px; cursor:pointer; right:-28px;}
#all_product>.slider_btn .next_btn:hover{background:url(../img/slider_btn.png) -87px 0 no-repeat;}
#all_product .all_pro_list{position:relative; overflow:hidden; height:750px;}
#all_product .all_pro_list>.pro_bg_img{width:100%; display:block; opacity:0;}
#all_product .all_pro_list>ul{width:2400px; position:absolute; left:50%; top:60px; transform:translateX(-50%); display:none;}
#all_product .all_pro_list>ul.dap{display:block;}
#all_product .all_pro_list>ul:after{content:''; display:block; clear:both;}
#all_product .all_pro_list>ul>li{float:left; width:19%; margin-top:50px; opacity:0.5; }
#all_product .all_pro_list>ul>li img{width:100%; display:block;}
#all_product .all_pro_list>ul>li>.text{position:relative; top:-15px; text-align:center; display:none;}
#all_product .all_pro_list>ul>li>.text>h3{font-family: 'Roboto', sans-serif; font-size:30px; font-weight:400;}
#all_product .all_pro_list>ul>li>.text>p{font-family: 'Noto Sans KR', sans-serif; font-size:14px;}
#all_product .all_pro_list>ul>li>.text>.find_shop{padding-top:20px;}
#all_product .all_pro_list>ul>li>.text>.find_shop a{position:relative; color:#222; font-size:16px; font-weight:500;}
#all_product .all_pro_list>ul>li>.text>.find_shop a>span:first-child{position:absolute; right:-65px; bottom:-10px; background:url(../img/long_arrow_black.png); width:160px; height:14px;}
#all_product .all_pro_list>ul>li>.text>.find_shop a:before{position:absolute; content:''; display:block; right:-65px; bottom:-10px; width:160px; height:14px; background:url(../img/long_arrow_black_before.png)}

/* story */
#story{position:relative; margin:70px 0; }
#story .more_btn{border:1px solid #222; color:#222; margin:0 auto;}
#story .more_btn:hover{border:1px solid #cc0000; background-color:#cc0000; color:#fff;}
#story .more_btn>span.arrow{background:url(../img/btn_arrow.png) no-repeat;}
#story .more_btn:hover>span.arrow{background:url(../img/btn_arrow.png) -10px 0 no-repeat;}
#story>.story_title{text-align:center;}
#story>.story_title h2{font-family: 'Roboto', sans-serif; font-size:50px; font-weight:700;}
#story>.story_title p{font-family: 'Roboto', sans-serif; font-size:35px; font-weight:300;}
#story>.story_title p>span{font-size:35px; font-weight:400;}
#story>.story_title p>span>.red_text{font-size:35px; font-weight:400; color:#cc0000;}
#story .story_list{width:96%; margin: 80px auto;}
#story .story_list:after{content:''; display:block; clear:both;}
#story .story_list>li{position:relative; float:left; width:23.5%; margin-left:2%; border:1px solid #ccc; border-radius:10px; box-sizing:border-box; overflow:hidden; transition-duration:0.2s; transition-timing-function:linear;}
#story .story_list>li:first-child{margin-left:0;}
#story .story_list>li a{display:block; width:100%;}
#story .story_list>li .img_box{width:100%; position:absolute; top:0;}
#story .story_list>li .img_box img{display:block; width:100%;}
#story .story_list>li .img_box>img{position:absolute; left:0; top:0; z-index:996; transition-duration:0.6s; }
#story .story_list>li .img_box .img_box_circle{position:relative; left:0; top:0;}
#story .story_list>li .img_box .img_box_circle>img{z-index:1; transition-duration:0.9s; transition-timing-function:ease-in-out;}
#story .story_list>li .img_box .img_box_circle>.img_circle{position:absolute; left:0; top:0;}
#story .story_list>li .img_box .img_box_circle .img_box_hidden{position:absolute; left:0; top:0; z-index:-1;}
#story .story_list>li .text_box{position:relative; width:100%; height:185px; padding:20px; margin-top:100%;  box-sizing:border-box; z-index:996;}
#story .story_list>li .text_box h3{font-family: 'Roboto', sans-serif; font-size:20px;}
#story .story_list>li .text_box h3 span{font-family: 'Roboto', sans-serif; font-weight:500; font-size:25px;}
#story .story_list>li .text_box p{padding-top:10px; font-size:18px; box-sizing:border-box;}

/* where to buy */
#find_store{position:relative; background-color:#151515;}
#find_store .find_wrap>.title>h2{font-family: 'Roboto', sans-serif; font-size:50px; font-weight:700; color:#fff; text-align:center; padding:30px 0;}
#find_store .find_wrap .find_con{width:1170px; margin:0 auto;}
#find_store .find_wrap .find_con:after{content:''; display:block; clear:both;}
#find_store .find_wrap .find_con>div{float:left; width:48%; margin-left:2%;}
#find_store .find_wrap .find_con>div:first-child{margin-left:0;}
#find_store .find_wrap .find_con .left_map{position:relative;}
#find_store .find_wrap .find_con .left_map>img{display:block; width:100%;}
#find_store .find_wrap .find_con .left_map .region_locate>li{position:absolute; width:15px; height:15px; border-radius: 50%; background-color:#fff; transition-duration:0.5s;}
#find_store .find_wrap .find_con .left_map .region_locate>li.seoul{top:160px; left:185px; box-shadow:0 0 10px 10px rgba(255,255,255,0.8);}
#find_store .find_wrap .find_con .left_map .region_locate>li.busan{top:515px; right:150px;}
#find_store .find_wrap .find_con .left_map .region_locate>li.daegu{top:420px; right:200px;}
#find_store .find_wrap .find_con .left_map .region_locate>li.gwangju{top:498px; left:135px;}
#find_store .find_wrap .find_con .right_btn{position:relative;}
#find_store .find_wrap .find_con .right_btn .find_map .real_map>ul{position:relative; display:none;}
#find_store .find_wrap .find_con .right_btn .find_map .real_map>ul:first-child{display:block;}
#find_store .find_wrap .find_con .right_btn .find_map .real_map>ul>li{position:absolute; left:0; top:0; display:none; width:100%;}
#find_store .find_wrap .find_con .right_btn .find_map .real_map>ul>li:first-child{display:block;}
#find_store .find_wrap .find_con .right_btn .find_map .real_map>ul>li>iframe{width:100%; display:block;}
#find_store .find_wrap .find_con .right_btn .find_map .region_list_wrap{padding-top:480px;}
#find_store .find_wrap .find_con .right_btn .find_map .region_list_wrap .region_list:after{content:''; display:block; clear:both;}
#find_store .find_wrap .find_con .right_btn .find_map .region_list_wrap .region_list>li{float:left; color:#fff; border-top:10px solid #fff; font-family: 'Roboto', sans-serif; font-weight:500; font-size:20px; cursor:pointer; margin-left:20px; width:96px; text-align:center;}
#find_store .find_wrap .find_con .right_btn .find_map .region_list_wrap .region_list>li:first-child{margin-left:0;}
#find_store .find_wrap .find_con .right_btn .find_map .region_list_wrap .region_list>li.select{border-top:10px solid #cc0000;}
#find_store .find_wrap .find_con .right_btn .find_map .store_list_wrap{position:relative; margin:40px 0; height:285px;}
#find_store .find_wrap .find_con .right_btn .find_map .store_list_wrap>ul{position:absolute; left:0; top:0; display:none; height:285px;}
#find_store .find_wrap .find_con .right_btn .find_map .store_list_wrap>ul.select{display:block;}
#find_store .find_wrap .find_con .right_btn .find_map .store_list_wrap>ul>li{cursor:pointer; padding-bottom:20px;}
#find_store .find_wrap .find_con .right_btn .find_map .store_list_wrap>ul>li p:first-child{font-size:20px; font-weight:500;}
#find_store .find_wrap .find_con .right_btn .find_map .store_list_wrap>ul>li p span{position:absolute; left:-15px; top:50%; width:10px; height:10px; border-radius:50%; background-color:#fff;}
#find_store .find_wrap .find_con .right_btn .find_map .store_list_wrap>ul>li p{position:relative; color:#fff;}
#find_store .find_wrap .find_con .right_btn .find_map .store_list_wrap>ul>li p a{margin-left:10px;}

/* support */
#support{position:relative; width:100%;}
#support .support_wrap{position:relative; width:75%; margin:195px auto;}
#support .arrow_btn .next_btn{position:absolute; top:50%; right:-50px; background:url(../img/slider_btn.png) -58px 0 no-repeat; width:29px; height:50px; cursor:pointer;}
#support .arrow_btn .next_btn:hover{background:url(../img/slider_btn.png) -87px 0 no-repeat;}
#support .arrow_btn .prev_btn{position:absolute; top:50%; left:-50px; background:url(../img/slider_btn.png) 0 0 no-repeat; width:29px; height:50px; cursor:pointer;}
#support .arrow_btn .prev_btn:hover{background:url(../img/slider_btn.png) -29px 0 no-repeat;}
#support .title>h2{font-family: 'Roboto', sans-serif; font-weight:700; font-size:50px; text-align:center;}
#support .more_arrow{position:absolute; right:80px; top:50px;}
#support .more_arrow a{position:relative; color:#cc0000; font-size:16px; font-weight:500;}
#support .more_arrow a>span{position:absolute; right:-80px; bottom:-10px; background:url(../img/long_arrow_red.png); width:160px; height:14px;}
#support .more_arrow a:before{position:absolute; content:''; display:block; width:160px; height:14px; background:url(../img/long_arrow_red_before.png); right:-80px; bottom:-10px;}
#support .support_list_wrap{position:relative; margin-top:50px; width:100%; overflow: hidden;}
#support .support_list_wrap>.support_list{width:125%;}
#support .support_list_wrap>.support_list:after{content:''; display:block; clear:both;}
#support .support_list_wrap>.support_list>li{float:left; width:18.4%; margin-right:2%;}
#support .support_list_wrap>.support_list>li:last-child{margin-right:0;}
#support .support_list_wrap>.support_list>li .over_box{position:relative;}
#support .support_list_wrap>.support_list>li a .img_wrap{position:relative; overflow:hidden;}
#support .support_list_wrap>.support_list>li a .img_wrap>img{display:block; width:100%;}
#support .support_list_wrap>.support_list>li a .img_wrap .over_box{position:absolute; right:0; bottom:0; opacity:0;}
#support .support_list_wrap>.support_list>li a .img_wrap .over_box>.text{position:relative; padding:0 10px 20px 0; font-family: 'Roboto', sans-serif; font-weight:500; z-index:1;}
#support .support_list_wrap>.support_list>li a .img_wrap .over_box>.circle{position:absolute; bottom:-40px; right:-40px; display:block; width:100px; height:100px; border-radius:50%; background-color:rgba(255,255,255,0.8); transition-duration:0.6s; transform:scale(0);}
#support .support_list_wrap>.support_list>li a .text_wrap{padding-top:20px;}
#support .support_list_wrap>.support_list>li a .text_wrap h3{font-family: 'Roboto', sans-serif; font-size:16px; color:#cc0000;}
#support .support_list_wrap>.support_list>li a .text_wrap h4{font-weight:500; font-size:18px;}
#support .support_list_wrap>.support_list>li a .text_wrap p{line-height:50px; color:#ccc; font-size:16px;}

/* contact us */
#contact_us{position:relative; background:url(../img/bottom_banner.jpg) center center no-repeat; height:500px; background-size:cover;}
#contact_us .contact_inner{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:1170px; height:260px; background-color:rgba(204,0,0,0.5);}
#contact_us .contact_inner .contact_wrap{position:relative; height:260px;}
#contact_us .contact_inner .contact_wrap>div{position:absolute; top:50%; transform:translateY(-50%); width:48%; margin-left:2%;}
#contact_us .contact_inner .contact_wrap>div.contact_title{margin-left: 0; padding:40px 15px;}
#contact_us .contact_inner .contact_wrap .contact_title>h2{font-family: 'Roboto', sans-serif; font-weight:500; font-size:45px; color:#fff; text-align:center; border:1px solid #fff; padding:65px 0;}
#contact_us .contact_inner .contact_wrap>div.contact_detail{right:0;}
#contact_us .contact_inner .contact_wrap>div.contact_detail p{font-size:16px; color:#fff; padding-bottom:35px; padding-right:5px;}
#contact_us .contact_inner .contact_wrap>div.contact_detail p:last-child{padding-bottom:0;}
#contact_us .contact_inner .contact_wrap>div.contact_detail p span{font-weight:500; font-size:16px; color:#fff;}
#contact_us .contact_inner .more_arrow{position:absolute; right:80px; bottom:30px;}
#contact_us .contact_inner .more_arrow a{position:relative; color:#fff; font-size:16px; font-weight:500;}
#contact_us .contact_inner .more_arrow a>span{position:absolute; right:-50px; bottom:-10px; background:url(../img/long_arrow.png); width:160px; height:14px;}
#contact_us .contact_inner .more_arrow a:before{position:absolute; content:''; display:block; width:160px; height:14px; background:url(../img/long_arrow_before.png); right:-50px; bottom:-10px;}

/* footer */
#footer{position:relative; background-color:#222; height:200px;}
#footer .footer_logo{position:absolute; left:60px; top:50%; transform:translateY(-50%);}
#footer>div.footer_mid>ul:after{content:''; display:block; clear:both;}
#footer>div.footer_mid>ul>li{float:left;}
#footer .footer_container{position:relative; width:1200px; height:200px; margin:0 auto;}
#footer .footer_container .footer_left{position:absolute; left:20px; top:50%; transform:translateY(-50%);}
#footer .footer_container .footer_left .footer_link:after{content:''; display:block; clear:both;}
#footer .footer_container .footer_left .footer_link>li{float:left; margin-left:10%;}
#footer .footer_container .footer_left .footer_link>li:first-child{margin-left:0;}
#footer .footer_container .footer_left .footer_link>li a{color:#fff; font-size:16px;}
#footer .footer_container .footer_left .footer_text p{color:#fff; font-size:14px; color:#ccc; margin-top:20px;}
#footer .footer_container .footer_mid{position:absolute; top:50%; left:50%; transform:translateY(-50%);}
#footer .footer_container .footer_mid>.footer_sns:after{content:''; display:block; clear:both;}
#footer .footer_container .footer_mid>.footer_sns>li{float:left; width:50px; height:50px; margin-left:25px;}
#footer .footer_container .footer_mid>.footer_sns>li a>img{width:100%; display:block;}
#footer .footer_container .footer_mid>.footer_sns>li p{color:#fff; font-size:12px; text-align:center;}
#footer .footer_container .site_select{position:absolute; right:20px; top:50%; transform:translateY(-50%); width:200px; height:50px; border:1px solid #fff; border-radius:50px; box-sizing: border-box;}
#footer .footer_container .site_select .site_btn{position:relative; display:block; line-height:50px; padding-left:20px; border:none; background-color:initial; color:#fff;  cursor:pointer; font-family: 'Roboto', sans-serif; font-weight:500; font-size:18px; width:200px; text-align:left; box-sizing:border-box; z-index:998;}
#footer .footer_container .site_select .site_btn .arrow{position:absolute; top:18px; right:25px;}
#footer .footer_container .site_select .site_btn .arrow img{display:block; transition-duration:0.5s;}
#footer .footer_container .site_select .site_btn .arrow img.select{transform:rotate(180deg);}
#footer .footer_container .site_select>.site_list{position:absolute; right:-1px; bottom:49px; border:1px solid #fff; width:200px; background-color:#222; box-sizing:border-box; border-radius:25px; border-radius:25px; border-bottom-left-radius:0; border-bottom-right-radius:0; border-bottom:none; display:none; height:150px; z-index:997;}
#footer .footer_container .site_select>.site_list>li{text-align:center; height:50px;}
#footer .footer_container .site_select>.site_list>li a{color:#fff; display:block; line-height:50px;}
#footer .footer_container .site_select>.site_list>li:hover a{color:#cc0000;}



/* common */
.more_btn{position:relative; font-family: 'Roboto', sans-serif; font-size:18px; font-weight:500; margin-top:55px; width:200px; height:45px; border-radius:50px; border:1px solid #fff; padding-left:25px; line-height:45px; color:#fff; cursor:pointer; box-sizing:border-box;}
.more_btn:hover{border:none; border:1px solid #cc0000; background-color:#cc0000; transition-duration:0.5s;}
.more_btn>span.arrow{position:absolute; background:url(../img/btn_arrow.png) -10px 0 no-repeat; width:10px; height:16px; display:inline-block; right:30px; top:50%; transform:translateY(-50%);}

@media screen and (max-width:1500px){
    .footer_logo{opacity:0.5;}
    #footer .footer_container{width:96%;}
}

@media screen and (min-width:801px) and (max-width:1200px){
    /* header 반응형 */
    #header{height:80px;}
    #header .gnb{display:none;}
    #header h1{padding-top:25px;}
    #header .util{top:25px;}
    #header .util .search{display:none;}


    /* main_pro 반응형 */
    #main_product .main_pro_title{top:15px; right:30px;}
    #main_product .main_pro_title>h2{position:relative; color:#fff; font-family: 'Roboto', sans-serif; font-size:30px; line-height:35px;}
    #main_product .main_pro_title>h2>span.red_text{color:#cc0000; font-family: 'Roboto', sans-serif; font-size:30px;}
    #main_product .main_pro_title>h2>span.after_border{border-bottom:2px solid #fff; width:30px; position:absolute; right:-30px; transform:translateY(-50%);}
    #main_product .controls_wrap>ul.controls>li{margin:45px auto;}
    #main_product .pro_bg>ul>li>.pro_text h3{font-size:25px;}
    #main_product .pro_bg>ul>li>.pro_text h3>span{font-size:40px;}
    #main_product .pro_bg>ul>li>.pro_text p{font-size:14px;}
    #main_product .more_btn{margin-top:30px;}

    /* all_pro 반응형 */
    #all_product>.tabs{width:600px;}
    #all_product>.tabs>ul>li{font-size:18px;}

    /* story 반응형 */
    #story .story_list>li .text_box{padding-top:30px;}
    #story .story_list>li .text_box h3{font-size:16px;}
    #story .story_list>li .text_box h3 span{font-family: 'Roboto', sans-serif; font-weight:500; font-size:20px;}
    #story .story_list>li .text_box p{padding-top:10px; font-size:14px; box-sizing:border-box;}

    /* where_to_buy 반응형 */
    #find_store .find_wrap .find_con{width:96%;}
    #find_store .find_wrap .find_con .left_map{display:none;}
    #find_store .find_wrap .find_con .right_btn{width:100%; margin:0 auto;}

    /* support 반응형 */
    #support .support_list_wrap>.support_list{width:170%;}
    #support .support_list_wrap>.support_list>li a .text_wrap{padding-top:15px;}
    #support .support_list_wrap>.support_list>li a .text_wrap h3{font-size:14px; color:#cc0000;}
    #support .support_list_wrap>.support_list>li a .text_wrap h4{font-weight:500; font-size:14px;}
    #support .support_list_wrap>.support_list>li a .text_wrap p{line-height:50px; color:#ccc; font-size:12px;}

    /* contact_us 반응형 */
    #contact_us .contact_inner{width:96%;}
    #contact_us .contact_inner .contact_wrap .contact_title>h2{font-size:40px;}
    #contact_us .contact_inner .contact_wrap>div.contact_detail p{font-size:14px; padding-bottom:25px;}
    #contact_us .contact_inner .contact_wrap>div.contact_detail p span{font-size:14px;}
    #contact_us .contact_inner .more_arrow a{font-size:14px;}

    /* footer 반응형 */
    #footer .footer_container .site_select{top:25%;}
    #footer .footer_container .footer_mid{position:absolute; top:65%; left:initial; right:20px;}
}

@media screen and (min-width:601px) and (max-width:800px){
    /* header 반응형 */
    #header{height:80px;}
    #header .gnb{display:none;}
    #header h1{padding-top:25px;}
    #header .util{top:25px;}
    #header .util .search{display:none;}

    /* top_banner 반응형 */
    #top_banner{margin-top:80px; width:100%;}
    #top_banner .banner_inner{position:relative; width:100%; height:100%;}
    #top_banner .banner_inner .mov_bg_img{display:none; opacity:0;}
    #top_banner .banner_inner .banner_mov>li{position:relative; left:50%; transform:translateX(-50%); top:initial;}
    #top_banner .banner_inner .banner_mov>li:first-child{display:block;}
    #top_banner .banner_inner .banner_mov>li>video{display:block; width:100%;}
    #top_banner .banner_inner ul.controls{position:absolute; bottom:25px; left:50%; transform:translateX(-50%); z-index:998;}
    #top_banner .banner_inner ul.controls:after{content:''; display:block; clear:both;}
    #top_banner .banner_inner ul.controls>li{float:left; background-color:#fff; border-radius:15px; width:60px; height:10px; cursor:pointer; margin-left:20px; border:1px solid #222;}
    #top_banner .banner_inner ul.controls>li:hover{border:1px solid #cc0000;}
    #top_banner .banner_inner ul.controls>li:first-child{margin-left:0;}
    #top_banner .banner_inner ul.controls>li.select{background-color:#cc0000;}
    #top_banner .banner_inner .play_btn_wrap{position:absolute; bottom:27px; left:50%; transform:translateX(-50%); z-index:998; margin-left:180px; cursor:pointer;}
    #top_banner .banner_inner .play_btn_wrap>.play_btn>img{display:block;}
    #top_banner .banner_inner .pause_btn_wrap{position:absolute; bottom:22px; left:50%; transform:translateX(-50%); z-index:998; margin-left:150px; cursor:pointer;}
    #top_banner .banner_inner .play_btn_wrap>.pause_btn>img{display:block;}

    /* main_pro 반응형 */
    #main_product{height:400px;}
    #main_product .main_pro_title{top:15px; right:30px;}
    #main_product .main_pro_title>h2{position:relative; color:#fff; font-family: 'Roboto', sans-serif; font-size:25px; line-height:35px;}
    #main_product .main_pro_title>h2>span.red_text{color:#cc0000; font-family: 'Roboto', sans-serif; font-size:30px;}
    #main_product .main_pro_title>h2>span.after_border{border-bottom:2px solid #fff; width:30px; position:absolute; right:-30px; transform:translateY(-50%);}
    #main_product .controls_wrap{width:initial; height:initial; right:20px; bottom:50px; border:none; top:initial;}
    #main_product .controls_wrap>ul.controls{position:relative; left:initial;}
    #main_product .controls_wrap>ul.controls:after{content:''; display:block; clear:both;}
    #main_product .controls_wrap>ul.controls>li{margin:0 15px; float:left; }
    #main_product .pro_bg{height:400px; overflow:hidden;}
    #main_product .pro_bg_img{display:none; opacity:0;}
    #main_product .pro_bg>ul>li>img{display:block; width:801px;}
    #main_product .pro_bg>ul>li>.pro_text{left:60px;}
    #main_product .pro_bg>ul>li>.pro_text h3{font-size:25px;}
    #main_product .pro_bg>ul>li>.pro_text h3>span{font-size:40px;}
    #main_product .pro_bg>ul>li>.pro_text p{font-size:14px; display:none;}
    #main_product .more_btn{margin-top:25px;}

    /* all_pro 반응형 */
    #all_product>.tabs{width:100%; top:-35px; border-radius:0;}
    #all_product>.tabs>ul>li{font-size:18px; line-height:70px;}
    #all_product .all_pro_list>ul>li>.text>h3{font-size:30px;}
    #all_product .all_pro_list>ul>li>.text>p{font-size:14px;}

    /* story 반응형 */
    #story>.story_title h2{font-size:40px;}
    #story .story_list{margin-top:60px;}
    #story .story_list>li .text_box{padding-top:50px;}
    #story .story_list>li .text_box h3{font-size:16px;}
    #story .story_list>li .text_box h3 span{font-family: 'Roboto', sans-serif; font-weight:500; font-size:20px;}
    #story .story_list>li .text_box p{display:none;}
    #story>.story_title p{font-family: 'Roboto', sans-serif; font-size:16px;}
    #story>.story_title p>span{font-size:16px;}
    #story>.story_title p>span>.red_text{font-size:16px;color:#cc0000;}
    

    /* where_to_buy 반응형 */
    #find_store .find_wrap>.title>h2{font-size:40px;}
    #find_store .find_wrap .find_con{width:96%;}
    #find_store .find_wrap .find_con .left_map{display:none;}
    #find_store .find_wrap .find_con .right_btn{width:100%; margin:0 auto;}
    #find_store .find_wrap .find_con .right_btn .find_map .store_list_wrap{margin-left:40px;}

    /* support 반응형 */
    #support .support_wrap .title>h2{font-size:40px;}
    #support .support_list_wrap>.support_list{width:260%;}
    #support .support_list_wrap>.support_list>li a .text_wrap{padding-top:15px;}
    #support .support_list_wrap>.support_list>li a .text_wrap h3{font-size:14px; color:#cc0000;}
    #support .support_list_wrap>.support_list>li a .text_wrap h4{font-weight:500; font-size:14px;}
    #support .support_list_wrap>.support_list>li a .text_wrap p{line-height:50px; color:#ccc; font-size:12px;}

    /* contact_us 반응형 */
    #contact_us .contact_inner{width:96%;}
    #contact_us .contact_inner .contact_wrap .contact_title>h2{font-size:40px;}
    #contact_us .contact_inner .contact_wrap>div.contact_detail p{font-size:14px; padding-bottom:25px;}
    #contact_us .contact_inner .contact_wrap>div.contact_detail p span{font-size:14px;}
    #contact_us .contact_inner .more_arrow a{font-size:14px;}

    /* footer 반응형 */
    #footer .footer_container .footer_left .footer_link>li a{font-size:14px;}
    #footer .footer_container .footer_left .footer_text p{font-size:12px; color:#ccc; margin-top:20px;}
    #footer .footer_container .site_select{top:25%;}
    #footer .footer_container .footer_mid{position:absolute; top:65%; left:initial; right:20px;}
}

@media  screen and (max-width:600px) {
    /* header 반응형 */
    #header{height:80px;}
    #header .gnb{display:none;}
    #header h1{padding-top:35px;}
    #header h1 a img{display:block; width:60%;}
    #header .util{top:25px;}
    #header .util .search{display:none;}

    /* top_banner 반응형 */
    #top_banner{margin-top:80px;}
    #top_banner .banner_inner .mov_bg_img{display:none; opacity:0;}
    #top_banner .banner_inner{min-width:100%; min-height:330px; overflow:hidden;}
    #top_banner .banner_inner .banner_mov{position:absolute; left:50%; top:0; margin-left:-300px;}
    #top_banner .banner_inner .banner_mov>li>video{display:block; min-width:600px; min-height:340px;}
    #top_banner .banner_inner ul.controls>li{border-radius:15px; width:30px; height:10px; cursor:pointer; margin-left:10px;}
    #top_banner .banner_inner .play_btn_wrap{position:absolute; bottom:31px; left:50%; transform:translateX(-50%); z-index:998; margin-left:110px; cursor:pointer;}
    #top_banner .banner_inner .play_btn_wrap>.play_btn>img{display:block;}
    #top_banner .banner_inner .pause_btn_wrap{position:absolute; bottom:26px; left:50%; transform:translateX(-50%); z-index:998; margin-left:85px; cursor:pointer;}
    #top_banner .banner_inner .play_btn_wrap>.pause_btn>img{display:block;}

    /* main_pro 반응형 */
    #main_product{height:400px; overflow:hidden;}
    #main_product .main_pro_title{top:15px; left:25px; right:initial;}
    #main_product .main_pro_title>h2{position:relative; color:#fff; font-family: 'Roboto', sans-serif; font-size:18px; line-height:25px;}
    #main_product .main_pro_title>h2>span.red_text{color:#cc0000; font-family: 'Roboto', sans-serif; font-size:18px;}
    #main_product .main_pro_title>h2>span.before_border{border-bottom:2px solid #fff; width:1525px; position:absolute; left:-1525px; top:50%; transform:translateY(-50%);}
    #main_product .main_pro_title>h2>span.after_border{border-bottom:2px solid #fff; width:500px; position:absolute; right:-500px; top:50%; transform:translateY(-50%);}
    #main_product .controls_wrap{width:initial; height:initial; right:20px; bottom:50px; border:none; top:initial;}
    #main_product .controls_wrap>ul.controls{position:relative; left:initial;}
    #main_product .controls_wrap>ul.controls:after{content:''; display:block; clear:both;}
    #main_product .controls_wrap>ul.controls>li{margin:0 15px; float:left; }
    #main_product .pro_bg{height:400px; overflow:hidden;}
    #main_product .pro_bg_img{display:none; opacity:0;}
    #main_product .pro_bg>ul>li{left:-200px}
    #main_product .pro_bg>ul>li>img{display:block; width:801px;}
    #main_product .pro_bg>ul>li>.pro_text{left:230px;}
    #main_product .pro_bg>ul>li>.pro_text h3{font-size:20px;}
    #main_product .pro_bg>ul>li>.pro_text h3>span{font-size:35px;}
    #main_product .pro_bg>ul>li>.pro_text p{font-size:14px; display:none;}
    #main_product .more_btn{margin-top:25px;}

    /* all_pro 반응형 */
    #all_product>.tabs{width:100%; top:-35px; border-radius:0;}
    #all_product>.tabs>ul>li{font-size:12px; line-height:70px;}
    #all_product .all_pro_list>ul>li>.text>h3{font-size:40px;}
    #all_product .all_pro_list>ul>li>.text>p{display:none;}
    #all_product>.slider_btn{position:absolute; width:250px; left:50%; bottom:35%; transform:translateX(-50%);}

    /* story 반응형 */
    #story>.story_title h2{font-size:40px;}
    #story .story_list{margin-top:60px;}
    #story .story_list>li{width:48%; margin-left:0;}
    #story .story_list>li:nth-child(2n){margin-left:4%;}
    #story .story_list>li:nth-child(3),#story .story_list>li:nth-child(4){margin-top:20px;}
    #story .story_list>li .text_box{padding-top:35px;}
    #story .story_list>li .text_box h3{font-size:16px;}
    #story .story_list>li .text_box h3 span{font-family: 'Roboto', sans-serif; font-weight:500; font-size:20px;}
    #story .story_list>li .text_box p{font-size:12px;}
    #story>.story_title p{font-family: 'Roboto', sans-serif; font-size:16px;}
    #story>.story_title p>span{font-size:16px;}
    #story>.story_title p>span>.red_text{font-size:16px;color:#cc0000;}


    /* where_to_buy 반응형 */
    #find_store .find_wrap>.title>h2{font-size:40px;}
    #find_store .find_wrap .find_con{width:96%;}
    #find_store .find_wrap .find_con .left_map{display:none;}
    #find_store .find_wrap .find_con .right_btn{width:100%; margin:0 auto;}
    #find_store .find_wrap .find_con .right_btn .find_map .region_list_wrap .region_list>li{font-size:16px; cursor:pointer; margin-left:0; width:76px; text-align:center; margin-left:1px;}
    #find_store .find_wrap .find_con .right_btn .find_map .store_list_wrap{margin-left:20px;}
    #find_store .find_wrap .find_con .right_btn .find_map .store_list_wrap>ul>li p:first-child{font-size:16px; font-weight:500;}
    #find_store .find_wrap .find_con .right_btn .find_map .store_list_wrap>ul>li p{font-size:12px;}
    #find_store .find_wrap .find_con .right_btn .find_map .store_list_wrap>ul>li p span{position:absolute; left:-15px; top:50%; width:10px; height:10px; border-radius:50%; background-color:#fff;}
    

    /* support 반응형 */
    #support .support_wrap .title>h2{font-size:40px;}
    #support .support_list_wrap>.support_list{width:540%;}
    #support .support_list_wrap>.support_list>li a .text_wrap{padding-top:15px;}
    #support .support_list_wrap>.support_list>li a .text_wrap h3{font-size:16px; color:#cc0000;}
    #support .support_list_wrap>.support_list>li a .text_wrap h4{font-weight:500; font-size:16px;}
    #support .support_list_wrap>.support_list>li a .text_wrap p{line-height:50px; color:#ccc; font-size:14px;}
    #support .arrow_btn .next_btn{position:absolute; top:50%; right:-35px;}
    #support .arrow_btn .prev_btn{position:absolute; top:50%; left:-35px;}

    /* contact_us 반응형 */
    #contact_us .contact_inner{width:96%; height:450px;}
    #contact_us .contact_inner .contact_wrap{width:96%; margin:0 auto; height:450px;}
    #contact_us .contact_inner .contact_wrap>div{position:absolute; top:50%; transform:translateY(-50%); width:100%; }
    #contact_us .contact_inner .contact_wrap>div.contact_title{padding:0; left:50%; transform:translateX(-50%); top:20px; padding: 0 10px;}
    #contact_us .contact_inner .contact_wrap .contact_title>h2{font-size:40px;}
    #contact_us .contact_inner .contact_wrap>div.contact_detail{top:65%;}
    #contact_us .contact_inner .contact_wrap>div.contact_detail p{font-size:14px; padding-bottom:25px; padding-left:5px;}
    #contact_us .contact_inner .contact_wrap>div.contact_detail p span{font-size:14px;}
    #contact_us .contact_inner .more_arrow a{font-size:14px;}

    /* footer 반응형 */
    #footer{height:400px;}
    #footer .footer_container{top:50%; transform:translateY(-50%); border-bottom:1px solid #ccc;}
    #footer .footer_container .site_select{top:-20%; left:20px; right:initial;}
    #footer .footer_container .footer_mid{position:absolute; top:initial; left:0px; bottom:-95px;}
    #footer .footer_container .footer_left{left:5px;}
    #footer .footer_container .footer_left .footer_link>li a{font-size:14px;}
    #footer .footer_container .footer_left .footer_text p{font-size:12px; color:#ccc; margin-top:20px;}

}