@charset "utf-8";
/* outline/header/css/design01.css */

/* ------------- 상단 디자인 ------------- */
#header{position:relative;}
#header .h1_logo{text-align:center;width:33.3%;margin:0 auto;line-height:152px;}
#header .h1_logo img{vertical-align:middle;}
#header .header_top{height:40px; border-bottom:1px solid #eaeaea;background:#fff;}

/* 상단 디자인 고정 */
#header .header_top.fixed{position:fixed;top:0;left:0;width:100%;z-index:99;}
#header .header_top.fixed .top_member_box > li .accent span{display:none;}
#header .header_gnb.fixed{position:fixed;top:40px;left:0;width:100%;z-index:98;border-bottom:1px solid #eaeaea;}
#header .h1_logo.fixed{position:fixed;top:0;left:36.3%;width:27.3%;z-index:99;height:39px;line-height:39px;}
#header .h1_logo.fixed img{height:39px;}
/* 해외몰 */
#header .top_country_list{position:absolute; top:9px; left:5px;}
#header .top_country_list ul{font-size:0;}
#header .top_country_list ul li{display:inline-block; padding-right:2px;}
/* 해외몰 홈아이콘 타입 노출형 */
#header .top_country_list0{position:absolute; top:9px; left:5px; z-index:100;}
#header .top_country_list0 ul{font-size:0;}
#header .top_country_list0 ul li{display:inline-block; padding-right:2px;}
/* 해외몰 홈아이콘 타입 선택형(국기) */
#header .top_country_list1{position:absolute; top:9px; left:5px; border:1px solid #999999; background:#ffffff; z-index:100;}
#header .top_country_list1 .country_tit{padding:4px 32px 3px 9px; background:url("../../img/etc/select_arrow_down_11x7.png") no-repeat right center;}
#header .top_country_list1 .country_tit.actvie{background:url("../../img/etc/select_arrow_up_11x7.png") no-repeat right center;}
#header .top_country_list1 ul{display:block; padding:6px 0 6px 0; font-size:0; border-top:1px solid #999999; background:#ffffff;}
#header .top_country_list1 ul li{padding:4px 0 4px 9px;}
#header .top_country_list1 ul li a{display:block;}
/* 해외몰 홈아이콘 타입 선택형(국기,언어) */
#header .top_country_list2{position:absolute; top:9px; left:5px; border:1px solid #999999; background:#ffffff; z-index:100;}
#header .top_country_list2 .country_tit{padding:4px 32px 3px 9px; background:url("../../img/etc/select_arrow_down_11x7.png") no-repeat right center;}
#header .top_country_list2 .country_tit.actvie{background:url("../../img/etc/select_arrow_up_11x7.png") no-repeat right center;}
#header .top_country_list2 .country_tit span{display:inline-block; padding-left:5px;}
#header .top_country_list2 ul{display:block; padding:6px 0 6px 0; font-size:0; border-top:1px solid #999999; background:#ffffff;}
#header .top_country_list2 ul li{padding:4px 0 4px 9px;}
#header .top_country_list2 ul li a{display:block; font-size:12px;}
#header .top_country_list2 ul li a span{display:inline-block; margin-left:5px;}
#header .top_country_list2 ul li:hover a span{text-decoration:underline;}


/* 공지사항 롤링 */
.notice_rolling{overflow:hidden;display:inline-block; width:325px; height:38px;margin-top:2px;}
.notice_rolling ul{float:left; width:300px; height:38px; font-size:11px;}
.notice_rolling ul li{}
.notice_rolling ul li a{overflow:hidden; display:block; line-height:38px;color:#555; text-overflow:ellipsis; white-space:nowrap; word-wrap:break-word;}
.notice_rolling ul li a:hover{/*text-decoration:underline; */color:#888;}
.notice_rolling .btn_notice_rolling{float:right; padding:1px 0 0 0;top:4px;position:relative;}
.notice_rolling .btn_notice_rolling a{display:block; margin-left:0px;height:12px;}

/* 상단 로그인 */
.top_member_box{float:left; position:relative; line-height:1; z-index:99;}
.top_member_box .txt_bar{display:inline-block; width:1px; height:7px; margin:0 10px 0 0; background:#ddd; vertical-align:0px}
.top_member_box > li{float:left; position:relative;}
.top_member_box > li a{display:inline-block; padding:0px 10px 0px 0px;font-size:11.5px;line-height:40px;height:40px;color:#555;}
.top_member_box > li a:hover{color:#888;}
/*.top_member_box > li:first-child{border-left:0 none;}*/
.top_member_box > li strong.cart{display:inline-block;color:#fff;padding:2px 5px 3px 4px;margin-left:3px;background:#4ea1d3;border-radius:3px;vertical-align: middle;line-height:11px;font-size:10px;}
/* join 캡션 */
.top_member_box > li .accent span{display:inline-block; height:20px; color:#ffffff; font-size:11px;line-height:20px;padding:0 8px;background:#333;border-radius:3px;font-size:10px;font-weight:normal;}
.top_member_box > li .accent{display:block; overflow:hidden; position:absolute; left:0; top:25px; height:20px; padding:6px 0 0 0;; text-align:center; z-index:40;
	-o-animation: animate-pointBox 0.7s linear infinite;
    -ms-animation: animate-pointBox 0.7s linear infinite;
    -moz-animation: animate-pointBox 0.7s linear infinite;
    -webkit-animation: animate-pointBox 0.7s linear infinite;
    animation: animate-pointBox 0.7s linear infinite;}
@-o-keyframes animate-pointBox{50%{margin-top:3px }}
@-ms-keyframes animate-pointBox{50%{margin-top:3px }}
@-moz-keyframes animate-pointBox{50%{margin-top:3px }}
@-webkit-keyframes animate-pointBox{50%{margin-top:3px }}
@keyframes animate-pointBox{50%{margin-top:3px }}



/* 마이페이지 레이어 */
.top_mypage_cont{display:inline-block;}
.top_mypage_cont .top_mypage_tit{display:block; /*background:url("../../img/etc/select_arrow_down_11x7.png") no-repeat 50px center;*/}
.top_mypage_cont .top_mypage_tit a{display:inline-block;}
.top_mypage_cont .top_mypage_tit.active{display:block;/*margin-top:-3px; border:1px solid #999999; background:url("../../img/etc/select_arrow_up_11x7.png") no-repeat 50px center;*/}
.top_mypage_cont .top_mypage_tit.active a{}
.top_mypage_cont ul{display:block; position:absolute; top:40px; left:0; width:76px;border:1px solid #999999; background:#ffffff; z-index:40;}
.top_mypage_cont li{}
.top_mypage_cont li a{display:block; padding:5px;line-height:12px;height:auto;}
.top_mypage_cont li a:hover{color:#333; text-decoration:none; background:#f3f3f3;}

.header_slideBanner{position:absolute;left:0;top:0;display:inline-block;display:none;}
.header_slideBanner .slick-slider{box-sizing:initial;}
.header_slideBanner .slick-dots{bottom:10px;}
.header_slideBanner .slick-prev, .header_slideBanner .slick-next{width:17px;height:34px;}
.header_slideBanner .slick-prev{left:5px;}
.header_slideBanner .slick-next{right:5px;}


.header_leftSearch{position:absolute;left:0;top:0;display:inline-block;width:33.3%;padding:46px 0;z-index:97;text-align:left;}


/* 상단세로이동형 */
.header_slideProduct{width:350px;height:150px;overflow:hidden;position: absolute;right: 0;top: 0;display: inline-block;}
.header_slideProduct .goods_list_tit{display:none;}
.header_slideProduct .slick-vertical .slick-slide{height:150px!important;}
.header_slideProduct .goods_list_cont ul li{margin:32px 0 0 0;}
.header_slideProduct .item_photo_box{width:90px;float:right;}
.header_slideProduct .item_info_cont{display:inline-block;width:235px;float:left;padding:0 20px 0 0;text-align:right;box-sizing:border-box;}
.header_slideProduct .slick-dots{display:none!important;}
.header_slideProduct .item_slide_vertical .slick-next{width:15px;height:15px;top:20px;}
.header_slideProduct .item_slide_vertical .slick-prev{width:15px;height:15px;right:26px;top:20px;}


/* ------------- 상단 검색 ------------- */
#header .header_search{border-bottom:1px solid #111;background:#fff;}
#header .header_search_cont{min-height:152px;}
#header .header_search_cont:after{display:block; clear:both; content:"";}

/* 검색창 */
#header .top_search{position:relative;width:280px;display:inline-block;}
#header .top_search legend{display:none;}
#header .top_search .top_search_cont{}
#header .top_search .top_text_cont{width:100%; background:#ffffff;position:relative;}
#header .top_search .top_text_cont input{border:none 0; vertical-align:top;}
#header .top_search .top_text_cont input::-webkit-input-placeholder {}
#header .top_search .top_text_cont input::-moz-placeholder {}
#header .top_search .top_text_cont input:-ms-input-placeholder {line-height:10px;}
#header .top_search .top_text_cont .top_srarch_text{width:100%; height:34px; padding:5px 40px 5px 15px; box-sizing:border-box; background:#fff;border-radius:20px;border:1px solid #eaeaea; }
#header .top_search .top_text_cont .btn_top_srarch{position:absolute; top:0px; right:0px;height:34px;width:34px;}
#header .top_search .top_text_cont .btn_top_srarch i{font-size:18px;line-height:34px;color:#333;}
#header .top_search .search_cont{display:block; margin:0; font-size:0;border:1px solid #ebebeb;background:#fff;position: absolute;top:33px;left: 0;width:100%;}

#header .top_search .top_search_cont .top_search_keyword{display:inline-block;width:100%;text-align:center;padding-bottom:5px;}
#header .top_search .top_search_cont .top_search_keyword ul{display:inline-block;}
#header .top_search .top_search_cont .top_search_keyword ul li{display:inline-block;float:left;}
#header .top_search .top_search_cont .top_search_keyword ul li a{line-height:12px;padding-right:5px;margin-right:5px;font-size:11.5px;}
#header .top_search .top_search_cont .top_search_keyword ul li:last-child a{border-right:0;padding-right:0;margin-right:0;}


/* 최근검색어 + 추천 상품이 있을 때 */
.recom_box + .recent_box{width:180px;min-width:auto; min-height:218px; }
.recom_box + .recent_box li a{width:55%;}
/* 최근 검색어 */
.recent_box{display:inline-block; float:left;width:100%;max-width:333px; min-height:65px; font-size:12px; text-align:center; border-right:none 0; vertical-align:top;}
.recent_box dl{padding:7px 15px 10px 15px; text-align:left;}
.recent_box dt{font-size:12px; font-weight:bold;padding:0 0 5px 0;border-bottom:1px solid #f5f5f5;}
.recent_box dd{padding:6px 0 0 0;}
.recent_box ul{margin-top:-5px;}
.recent_box li{overflow:hidden;}
.recent_box li a{display:block; overflow:hidden; float:left; width:67%; padding:2px 0 1px 0; text-overflow:ellipsis; white-space:nowrap; word-wrap:break-word;}
.recent_box li span{display:inline-block; float:right; padding:3px 0 0 0; color:#999999; font-size:10px;}
.btn_top_search_del{display:inline-block;width:14px; height:14px;}/* 삭제 */
/* 추천상품 */
.recom_box{display:inline-block; float:right; width:138px; min-height:218px; margin:10px 0 0 -1px; padding:0 0 20px 15px; font-size:12px; border-left:1px solid #ebebeb;}
.recom_box dl{}
.recom_box dt{width:122px; padding:0 0 10px 0; font-size:13px; font-weight:bold; text-align:center;}
.recom_box dd{}
.recom_box .recom_photo{display:table-cell; position:relative; width:120px; height:120px; border:1px solid #ebebeb; vertical-align:middle; text-align:center;}
.recom_box .recom_photo img{max-width:120px;}
.recom_box .recom_tit{display:block; width:120px; padding:10px 0 0 0;}
/* 추천상품만 있을 때 */
.recom_box_only{min-height:218px; margin: 10px auto 0 auto; padding:0 0 20px 0; font-size:12px; text-align:center;}
.recom_box_only dl{}
.recom_box_only dt{padding:0 0 10px 0; font-size:13px; font-weight:bold; text-align:center;}
.recom_box_only dd{}
.recom_box_only .recom_photo{display:table-cell; position:relative; width:120px; height:120px; border:1px solid #ebebeb; vertical-align:middle;}
.recom_box_only .recom_photo img{max-width:120px;}
.recom_box_only .recom_tit{display:block; width:120px; padding:10px 0 0 0;}
.recom_box_only .recom_item_cont {width:160px; margin:0 auto; text-align:left;}
/* 추천상품 내용 */
.recom_info_cont{display:table-cell; vertical-align:middle;}
.recom_tit_box{padding:5px 0 0 0;}
.recom_tit_box .item_brand{display:block; color:#444444;}
.recom_tit_box .item_name{display:block; letter-spacing:-1px;}
.recom_tit_box .item_name_explain{display:block; overflow:hidden; height:14px; padding:2px 10px 0 0px; color:#a8a8a8; line-height:1.2;}
.recom_icon_box{margin:-5px 0 0 0; padding:10px 0 0 0;}
.recom_icon_box img{display:inline-block; padding:5px 0 0 0;}
.recom_money_box{padding:10px 0 0 0; line-height:1;}
.recom_money_box del{display:block; color:#ffb200;}
.recom_money_box .item_price{display:block; padding:7px 0 5px 0; font-size:14px;}
.recom_money_box .item_sale{display:block; font-size:14px; color:#282828;}
.recom_money_box .item_mileage{display:block; padding:5px 0 5px 0; line-height:1.5;}
.recom_money_box .item_mileage img{vertical-align:middle;}
.recom_number_box{padding:10px 0 0 0; font-size:11px; color:#a8a8a8;}
.recom_number_box .num_mileage{display:block;}
.recom_number_box .num_code{display:block;}
/* 추천상품 soldout */
.recom_photo .item_soldout_bg{display:none; position:absolute; top:0px; left:0px; width:100%; height:100%; text-align:center;
	background-color:#ffffff;
	filter:alpha(opacity=60);
	background-color:rgba(255, 255, 255, 0.6);
	background-repeat: no-repeat;
	background-position: center center;
	font-size:0;
}
.recom_box .item_soldout_bg img{position:relative; vertical-align:middle;}
.recom_box.item_soldout .recom_photo .item_soldout_bg{display:block;}
.recom_box.item_soldout .recom_photo .item_soldout_bg:after { content: ""; display: inline-block; width: 1px; height: 100%; margin-right: 0; vertical-align: middle;}

/* 전체삭제, 닫기 버튼 */
.seach_top_all{ overflow:hidden; width:100%; height:30px; background:#f5f5f5; clear:both;}
.seach_top_all .btn_top_search_all_del{float:left; padding:0 15px 0 15px; color:#999999; font-size:11px; line-height:30px;}
.seach_top_all .btn_top_search_close{float:right; padding:0 15px 0 15px; color:#999999; font-size:11px; line-height:30px;}
.seach_top_all strong{font-weight:normal;}



/* ------------- 상단 GNB 영역 ------------- */
#header .header_gnb{background:#fff;}
/* gnb */
#header .gnb{position:relative;/* font-size:0;*/}
#header .gnb .gnb_all{display:inline-block; vertical-align:top; text-align:left;}
#header .gnb .gnb_all a{font-size:12px;line-height:55px;width:55px;text-align:center;}
#header .gnb .gnb_all a img{vertical-align:middle;}
#header .gnb .gnb_all strong{display:none;}
/* 전체 메뉴 */
#header .gnb_allmenu_wrap{display:inline-block;}
#header .gnb_allmenu{position:absolute; top:55px; left:0; width:100%; font-size:12px; z-index:100; background:#ffffff; border:1px solid #eaeaea;}
#header .gnb_allmenu_box{overflow-y:auto; height:395px; padding:30px 30px;}
#header .gnb_allmenu_box .gnb_scroll_box{overflow-y:scroll; height:395px;}
/* 전체 메뉴 버튼 */
.btn_all_menu_open{position:absolute; top:0px; left:0px; background-color:#4ea1d3;border-left:1px solid #eaeaea;border-right:1px solid #eaeaea;}
.btn_all_menu_close{position:absolute;top:0;right:0px;width: 48px;height: 48px;background: transparent url(../../../udweb/img/btn_allmenu_close_gray.png) no-repeat 0 0;cursor: pointer;text-indent: -9999px;font-size: 0;display:none;}
.btn_all_menu_close2{position: absolute;top: -55px;left:0px;width: 55px;height: 54px;cursor: pointer;text-indent: -9999px;font-size: 0;background:#4ea1d3 url(../../../udweb/img/btn_allmenu_close_white.png) no-repeat center;}
/* 전체 메뉴 내용 */
.gnb_allmenu_box ul{font-size:0; width:100%; margin:0 0 0 0;}
.gnb_allmenu_box ul li{display:inline-block; margin:0 0 30px 0; text-align:left; line-height:1; vertical-align:top;}
.gnb_allmenu_box ul li a{display:block; padding:8px 5px; font-size:18px; font-weight:bold; text-align:left; word-break:break-all;color:#000;letter-spacing:.5px;}
.gnb_allmenu_box ul li a > img{max-width:180px;}

.gnb_allmenu_box .all_menu_cont{padding:0 10px;}
.gnb_allmenu_box .all_menu_cont > a{background:#d8e9ef; padding:10px 10px;}
.gnb_allmenu_box .all_depth1,
.gnb_allmenu_box .all_depth2,
.gnb_allmenu_box .all_depth3{margin:0;}
.gnb_allmenu_box .all_depth1 a,
.gnb_allmenu_box .all_depth2 a,
.gnb_allmenu_box .all_depth3 a{font-weight:normal;}
.gnb_allmenu_box .all_depth1 li,
.gnb_allmenu_box .all_depth2 li,
.gnb_allmenu_box .all_depth3 li{display:block; margin:0; padding:0;position:relative;}
.gnb_allmenu_box .all_depth1{border-top:0;padding-top:5px;}
.gnb_allmenu_box .all_depth1 li a{color:#666666; font-size:13px; text-align:left;display:inline-block;}
.gnb_allmenu_box .all_depth1 li a:hover{text-decoration:underline;}
.gnb_allmenu_box .all_depth2{position:absolute;z-index:10;left:100%;min-width:120px;top:0;width:auto;padding:0 10px;background:#fff;border:1px solid #ececec;display:none;}
.gnb_allmenu_box .all_depth2 li a{}
.gnb_allmenu_box .all_depth3{position:absolute;z-index:10;left:100%;min-width:120px;top:0;width:auto;padding:0 10px;background:#fff;border:1px solid #ececec;display:none;}
.gnb_allmenu_box .all_depth3 li{}
.gnb_allmenu_box .all_depth3 li a{}


.gnb_allmenu_box .all_depth1 li:hover .all_depth2{display:block;}
.gnb_allmenu_box .all_depth2 li:hover .all_depth3{display:block;}

/* gnb 양쪽 버튼 */
#header .gnb_left{position:absolute; top:0px; left:0;display:inline-block;  font-size:0; vertical-align:top;display:none;}
#header .gnb_left a{display:inline-block; width:12px; height:55px; background:url('../../../img/common/btn/btn_arrow_left_over.png') no-repeat center;}
#header .gnb_left a.active{background:url('../../../img/common/btn/btn_arrow_left.png') no-repeat center;}
#header .gnb_menu_box{display:inline-block; vertical-align:top;margin:0 5px 0 55px;padding:0 12px;}

#header .gnb_right{position:absolute; top:0px; right:0;display:none;}
#header .gnb_right a{display:inline-block; width:12px; height:55px; text-indent:-9999em; background:url('../../../img/common/btn/btn_arrow_right_over.png') no-repeat center;}
#header .gnb_right a.active{background:url('../../../img/common/btn/btn_arrow_right.png') no-repeat center;}

#header .gnb_menu_box:hover .gnb_left{display:block;}
#header .gnb_menu_box:hover .gnb_right{display:block;}

.cus_gnb_menu{display:inline-block;float:right;border-left:1px solid #eaeaea;}
.cus_gnb_menu li{position:relative; display:inline-block; vertical-align:top;}
.cus_gnb_menu li > a{display:inline-block; padding:0 19px; font-size:13px;letter-spacing:1px;color:#000;font-weight:normal; text-align:center; line-height:55px;}


/* 뎁스메뉴 보더 */
#header .gnb_menu_box{/*width:786px;margin-left:40px;*/ width:1130px;box-sizing:border-box;position:relative;}
#header .gnb_menu_box ul{border:1px solid #eaeaea;}
/* 상단메뉴 최상위 */
#header .gnb .depth0{font-size:0; vertical-align:top; border:none;  /*overflow:hidden;height:55px;*/}
#header .gnb .depth0 > li{position:relative; display:inline-block; vertical-align:top;}
#header .gnb .depth0 > li > a{display:inline-block; padding:0 19px; font-size:15px; color:#000;font-weight:normal; text-align:center; line-height:55px;letter-spacing:1px;}
#header .gnb .depth0 > li > a > img{max-height:55px; vertical-align:middle;}
#header .gnb .depth0 > li > a:hover{color:#4ea1d3;}
#header .gnb .depth0 > li > a.active{color:#4ea1d3;}
#header .gnb .gnb_menu0{overflow:hidden;height:55px;}
/* 상단메뉴 1뎁스 */

#header .gnb .depth1:before {
    content: "";
    position: absolute;
    top: -7px;
    border-width: 0 7px 7px;
    border-style: solid;
    border-color: #eaeaea transparent;
    display: block;
    width: 0;
    left: 30px;
}
#header .gnb .depth1:after {
    content: "";
    position: absolute;
    top: -6px;
    left: 31px;
    border-width: 0 6px 6px;
    border-style: solid;
    border-color: #fff transparent;
    display: block;
    width: 0;
}

#header .gnb .depth1 > li{}
#header .gnb .depth1 > li > a{display:block; /*width:100%;*/ padding:5px 10px 7px 9px; font-size:12px;}
#header .gnb .depth1 > li > a:hover{background:#f5f5f5; color:#000;}
#header .gnb .depth1 > li > a.active{background:#f5f5f5; color:#000;}
/* 상단메뉴 2,3,4 뎁스 CSS */
#header .gnb .depth1 li{position:relative;}
#header .gnb .depth1 li a{display:block; /*width:100%;*/ padding:5px 10px 7px 9px; font-size:12px;}
#header .gnb .depth1 li a:hover{background:#f5f5f5; color:#000;}
#header .gnb .depth1 li a.active{background:#f5f5f5; color:#000;}
/* 상단 메뉴 뎁스 위치 */
#header .gnb .depth1{display:none; position:absolute; top:54px; left:0; width:140px; background:#ffffff; z-index:100;padding:10px;}
#header .gnb .depth2{display:none; position:absolute; top:-1px; left:160px; width:160px; background:#ffffff;padding:10px;}
#header .gnb .depth3{display:none; position:absolute; top:-1px; left:160px; width:160px; background:#ffffff;padding:10px;}
#header .gnb .depth4{display:none; position:absolute; top:-1px; left:160px; width:160px; background:#ffffff;padding:10px;}