/* BASIC css start */
/* header */
*{font-family: 'Noto Sans KR' !important; margin:0; padding:0}
#header{ width: 100%; height: 300px;  }
.top_menu{width: 100%; height: 50px; border-bottom: 1px solid #eee;}
.header_main{width: 100%; height: 200px;}
nav{width: 100%;border-bottom: 1px solid #eee; border-top: 1px solid #eee; height: 50px;position: relative;}

.top_menu_inner{width: 1280px; margin:0 auto;height: 100%;}
.header_main_inner{width: 1280px; margin: 0 auto; height: 100%; position: relative;}
.nav_inner{width: 1280px; margin: 0 auto; height: 100%;}


.top_menu_inner .community{float: left; height: 100%;}
.top_menu_inner .community ul{ height: 100%;}
.top_menu_inner .community ul li{float: left; margin-right: 25px; line-height: 50px;}
.top_menu_inner .community ul li a{position: relative; padding-left: 20px; font-weight:500 !important; letter-spacing:1.3px; font-size:9px;color:#242424}
.top_menu_inner .community ul li:nth-child(3)>a{padding-left:5px !important}
.top_menu_inner .community ul li a span{width: 13px; height: 13px; display: inline-block; position: absolute; left: 0; top: 50%;transform: translateY(-50%); background: url(/design/beadboom/spring_market/img/favorite.png)no-repeat center center;background-size: contain;}
.top_menu_inner .community ul li:nth-child(2)>a>span{background-image: url(/design/beadboom/spring_market/img/cs_center.png);}


.top_menu_inner .gnb{float: right; height: 100%;}
.top_menu_inner .gnb ul{height: 100%; width: 350px; display: flex; justify-content: space-between; align-items: center; }
.top_menu_inner .gnb ul li{float: left;}
.top_menu_inner .gnb ul li a{font-size: 12px; color:#666}
.top_menu_inner .gnb ul li.li_join{position:relative}
.top_menu_inner .gnb ul li.li_join a{}
.top_menu_inner .gnb ul li.li_join a span{font-weight:300; position: absolute; left: 50%; transform: translateX(-50%); bottom: -28px; text-align: center; background: url(/design/beadboom/spring_market/img/Rectangle6.png) no-repeat center center;font-size: 10px; background-size: contain;width: 40px; height: 20px;  padding: 5px; line-height: 23px;color: white;}


.header_main_inner h1.logo{position: absolute; top: 50%; transform: translate(-50%,-50%); left: 50%;}
.header_main_inner h1.logo a{}
.header_main_inner h1.logo a img{}

.header_main_inner .searchArea{position:absolute; top:50%; right:60px; transform:translateY(-50%)}
.header_main_inner .searchArea .search{}
.header_main_inner .searchArea .search fieldset{display:inline-block; position:relative; }
.header_main_inner .searchArea .search fieldset legend{}
.header_main_inner .searchArea .search fieldset a{position:absolute; right:10px; top:50%; transform:translateY(-50%);display:inline-block; text-indent:-9999px;  width: 15px; height: 15px; background: url(/design/beadboom/spring_market/img/search.png) no-repeat center center; background-size: contain; }
.header_main_inner .searchArea .search input{padding:0 14px; border:none; background-color:#eee; height:35px; border-radius:15px}



.header_main_inner .cart{position:absolute;transform:translateY(-50%); top:50%; right:0; width:32px; height:27px;background: url(/design/beadboom/spring_market/img/Ellipse2copy.png) no-repeat top center;background-size: contain;}
.header_main_inner .cart .cart_wrap{position: relative; display:block; width:100%; height:100%}
.header_main_inner .cart .cart_wrap span{text-align:center; line-height:18px;width:22px; height:18px;position: absolute; top: -3px; right: -10px; background-color:black; color:white; border-radius:50%;font-size:10px}



.nav_inner>ul.main_m{width: 100%; height: 100%; display: flex; justify-content: space-between;}
.nav_inner>ul.main_m>li.cate_li{float: left; line-height: 50px; position: relative;width:auto; padding:0 20px}
.nav_inner>ul.main_m>li.cate_li:hover>a{color:#747474}
.nav_inner>ul.main_m>li.cate_li>a{display:block; height:100%; line-height:50px; width:100%; font-size:15px; }
.nav_inner ul.sub_m{border-top:none !important; position: absolute; z-index: 1001; left: 50%; transform: translateX(-50%); top: 51px;display: none; padding:10px 0; background-color:rgba(255,255,255,.9);border:1px solid #eee; width:max-content}
.nav_inner ul.sub_m>li{line-height:35px;width:auto;  }
.nav_inner ul.sub_m>li:hover>a{text-decoration:underline; color:#222}
.nav_inner ul.sub_m>li>a{padding:5px 25px;color:#747474}
.nav_bg{width: 100%; background-color: #fff; height: auto;position: absolute;top: 51px;left: 0; z-index: 500;display: none;border-bottom: 1px solid #eee;}
.nav_bg .nav_bg_inner{  width:1280px; margin:0 auto; padding: 40px 0}
.nav_bg .b_main_m{display:flex; justify-content:space-between; flex-wrap:wrap}
.nav_bg .b_main_m>li{margin:0 40px; display:inline-block; text-align:center; margin-bottom:15px}
.nav_bg .b_main_m>li>a{font-size:15px; font-weight:500; }

.nav_bg .b_sub_m{}
.nav_bg .b_sub_m>li{margin:8px 0}
.nav_bg .b_sub_m>li>a{font-size:13px ; font-weight:400; color:#747474}
.nav_bg .b_sub_m>li:hover>a{ color:#222}

.btn_gnb{width: 50px; height: 50px; border: 1px solid #eee; display: flex;justify-content: center; align-items: center;border-top:none; border-bottom:none}
.btn_gnb a{display: block; position: relative; width: 20px; height: 18px; transition: all .4s;}
.btn_gnb span{display: block;width: 20px;height: 3px;background-color: #222; position: absolute; left:0; top: 50%; transform: translateY(-50%);}
.btn_gnb a::after{content: ""; display: block; width: 20px; height: 3px; background-color: #222; position: absolute; left: 0; top: 0; }
.btn_gnb a::before{content: ""; display: block; width: 20px; height: 3px; background-color: #222;position: absolute; left: 0; bottom: 0;}
.btn_gnb:hover>a{transform: rotate(90deg);}



aside{position: fixed; right: 0; top: 50%; transform: translateY(-50%); z-index: 4000;}
aside ul{width: 54px;}
aside ul li{width: 54px; height: 54px; background: url() no-repeat center center; background-size: contain; text-indent: -9999px;}
aside ul li a{display: block;width: 100%;height: 100%;}
/* BASIC css end */

