/* BASIC css start */
/* add */
.preload #hdHeader a, 
.preload #hdFooter a, 
.preload #main a {
	transition: all 0.2s ease 0s;
}
.fonts_loaded body { /* 웹폰트가 완전히 로드되었을 때 적용되는 클래스 */
	opacity: 1;
}
html {
	overflow-y: scroll;
}
body {
	-webkit-text-size-adjust: none; /* 모바일에서 text 사이즈 변동 없게 */
	-webkit-font-smoothing: antialiased; /* or subpixel-antialiased 웹킷 브라우저 웹폰트 선명하게 처리 */
	font-variant-ligatures: none; /* fi수정 */
	min-width: 1040px;
	transition: none;
}
img {
	/*image-rendering: optimizeSpeed;*/ /* low quality */
	/*image-rendering: optimizeQuality;*/ /* high quality */
	-ms-interpolation-mode: bicubic; /* blur */
	/* -ms-interpolation-mode: nearest-neighbor; /* sharpen */
	-webkit-backface-visibility: hidden; /* chrome anti aliasing */
	
}
a {
	color:#777;
	text-decoration:none;
	background: transparent;
}
a:hover {
	color: #000;
	text-decoration: underline;
}
.float_l { float:left; } /* float left */
.float_r { float:right; } /* float right */
.none_blank { font-size: 0; line-height: 0; letter-spacing: -4px; } /* 이미지여백삭제 (안드로이드) */
@-moz-document url-prefix() { .none_blank {letter-spacing: 0;} } /* 파폭 */
.displaynone { display: none !important; }

#wrap {
	position: relative; 
}

/* subpage css */
#wrap .bbs-hd .link {
	display: none;
}
#wrap .bbs-tit, 
#wrap #content .tit-page {
	font-size: 30px; line-height: 30px; color: #000; font-weight: 700; letter-spacing: 0;
	padding: 30px 0 60px; margin: 0;
}

/* 상품관련 */
.prd_list {
	font-size: 0; letter-spacing: 0; line-height: 0;
	margin: 0 -20px;
}
.prd_list .box .box_prd {
	display: inline-block;
	vertical-align: top;
	font-size: 12px; letter-spacing: normal; line-height: 1.5;
	padding: 0 20px; margin: 0 0 80px;
	box-sizing: border-box;
	position: relative;
}
.prd_list .box .box_prd .discount_rate {
	position: absolute; top: -5px; right: 15px; z-index: 4;
	width: 35px; height: 35px;
	text-align: center;
	font-size: 13px; line-height: 35px; font-weight: 400; color: #fff;
	background: #000;
}
.prd_list .box .box_prd .over {
	position: absolute; top: -15px; left: 5px; right: 5px; bottom: -20px; z-index: 2;
	border: 4px solid #000;
	opacity: 0;
}
.prd_list .box .box_prd .addbtn {
	position: absolute; bottom: 0; right: 21px; z-index: 4;
	font-size: 0; letter-spacing: 0; line-height: 0;
}
.prd_list .box .box_prd .addbtn span {
	display: inline-block;
	height: 30px;
	font-size: 20px; color: #000; line-height: 28px;
	text-align: center;
	background: #fff;
	position: relative;
	padding: 0 5px; margin: 0 -1px;
	cursor: pointer;
	border: 1px solid #d4d4d4;
	box-sizing: border-box;
}
.prd_list .box .box_prd .addbtn img {
	opacity: 0;
	width: 30px; height: 30px;
	position: absolute; top: 0; left: 0;
}
.prd_list .box .box_prd .info {
	position: relative; z-index: 3;
}
.prd_list .box .box_prd .info .thumb {
	position: relative;
	margin: 0 0 20px;
}
.prd_list .box .box_prd .info .thumb img {
	width: 100%;
	vertical-align: top;
}
.mk_option_preview {
	margin: 30px 0 0 -147px;
}
#detailpage a {
	transition: none !important;
}
.prd_list .box .box_prd .info .name {
	font-size: 13px; font-weight: 700; color: #000; line-height: 1;
}
.prd_list .box .box_prd .info .subname {
	font-size: 11px; font-weight: 400; color: #aeaeae; line-height: 1.5;
	margin: 5px 0 0;
}
.prd_list .box .box_prd .info .price {
	font-size: 14px; font-weight: 700; color: #000;
	padding: 15px 0 0 0;
}
.prd_list .box .box_prd .info .price span {
	display: block;
	font-size: 12px; font-weight: 400; color: #aeaeae;
}
.prd_list .box.column2 .box_prd {
	width: 50%;
}
.prd_list .box.column3 .box_prd {
	width: 33.333%;
}
.prd_list .box.column4 .box_prd {
	width: 25%;
}
.prd_list .box.column5 .box_prd {
	width: 20%;
}


.fixed_line {
    display: inline-block;
    background-color: #fff;
    position: fixed;
    top:0;
    width:100%;
    height: auto;
    z-index:9995;
    margin-bottom: 202px;
}


.header_section {
     display: inline-block;
}
.logo_area {
     position: relative;
     width: 1403px;
     height: 0px;
     margin: 0 auto;
     bottom: 35px;
}
.logo_area img {
     max-width: 120px;
     height: 48px;
     cursor: pointer;
}

.logo_area div {
     position: absolute;
     width: 188px;
     height: 28px;
     top: 6px;
     right: 3px;
     z-index: 999;
}

.top_right_menu {
     position: absolute;
     right: 10px;
     height: 30px;
     top: -30px;
     line-height: 30px;
}
.top_right_menu li {
     display: inline-block;
     padding: 0 6px;
     float: left;
     margin-top : 20px;
}
.top_right_menu li a {
     color: #000;
     width: 24px;
     height: 24px;
     font-size: 20px;
     font-weight: 400;
}


.top_left_menu {
     position: absolute;
     left: -7px;
     top: 35px;
     bottom: 5px;
     text-align: left;
}
.top_left_menu li {
     text-align: center;
     display: inline-block;
     color: #000;
     margin: 0 5px;
}
.top_left_menu li i {
     font-size: 25px;
     margin-top: 40px;
}
.top_left_menu li p {
     margin-top : -5px;
}
.top_left_menu li:hover i {
     color:#eb5728;
}
.top_left_menu li:hover p {
     color:#eb5728;
}


.upper_area {
     position: relative;
     width: 100%;
     height: 40px;
     margin: 0 auto;
     bottom: 35px;
     background-color: #000;
}

.upper_right_menu {
     position: fixed;
     left: 40px;
     top: 50px;
     text-align: right;
     background-color: transparent;
     z-index: 99999;
     overflow:hidden;
}
.upper_right_menu li {
     text-align: center;
     display: inline-block;
     color: #000;
     margin: 0 5px;
     background-color: transparent;
     cursor: pointer;
     position: relative;

}
.upper_right_menu li sup {position: absolute; top:-10px; right: -10px; width: 15px; height: 15px; line-height:15px; background-color: #ed592a; color:#fff; border-radius: 30px; display: inline-block; z-index: 9999;}

.upper_right_menu li i {
     font-size: 22px;
     margin-top: 40px;
}
.upper_right_menu li p {
     margin-top : -5px;
}
.upper_right_menu li:hover i {
     color:#ce4b21;
}
.upper_right_menu li:hover p {
     color:#ce4b21;
}


.upper_left_menu {
     position: absolute;
     left: 280px;
     top: 2px;
     text-align: left;
     background-color: #000;
     margin-top:1px;
}
.upper_left_menu li {
     text-align: center;
     display: inline-block;
     color: #fff;
     margin: 0 0 0 5px;
     background-color: #000;
     cursor: pointer;
}
.upper_left_menu li i {
     font-size: 25px;
     margin-top: 40px;
}
.upper_left_menu li p {
     margin-top : -5px;
}
.upper_left_menu li:hover i {
     color:#eb5728;
}
.upper_left_menu li:hover p {
     color:#eb5728;
}


.upper_center_banner {
     position: absolute;
     line-height: 0;
     top: 2px;
     left: 455px;
     background-color: #000;
}


.nav_box {
     left: 0;
     top:0;
     max-width: 350px;
     min-width: 350px;
     height: 10000px;
     text-align: center;
     position:fixed;
     background-color:#f5f5f5;
     z-index:9998;
     overflow: hidden;
}


.rusko_cate_box {
     position: fixed;
     top: 170px;
     left: 30px;
     width: 100px;
     text-align: left;
     height: auto;
     display: inline-block;
     border-top: 0px solid #ccc;
     border-bottom: 0px solid #ccc;
     border-left: 0px solid #ccc;
     border-right: 0px solid #ccc;
     float: left;     
}
.rusko_cate_box>li {
     position: relative;
     display: block;
     float: left; 
     width: 80px;
     height: 21px;
     line-height: 21px;
     font-weight: 400;
     font-family: 'Roboto', 'Nanum Gothic', sans-serif;
     border: 0px solid #000;
     padding-left: 0;
}
.rusko_cate_box>li>a {
     display: block;
     font-size: 13px;
     font-family: 'Roboto', 'Nanum Gothic', sans-serif;
     color: #000;
}

.rusko_cate_box>li>a>span {
     border-bottom: 1px solid #f5f5f5;
         transition: all linear 0.2s;
}


.subbox_cover {
     position: absolute;
     margin: 0 auto;
     top: 0px;
     left: 70px;
     max-width: 120px;
     height: auto;
     padding-top: 0px;
     padding-bottom: 10px;
     background-color: #f5f5f5;
     border-bottom: 0px solid #fff;
     border-left: 0px solid #fff;
     border-right: 0px solid #fff;
     border-top: 0px solid #ccc;
     display: none;
     z-index:9999;
     text-align: center;
}
.subbox {
     width: 120px;
     height: auto;
     text-align: center;
     margin-bottom:10px;
}
.rusko_cate_box>li:hover a{
    text-decoration: none;
}
.rusko_cate_box>li:hover .subbox_cover {
     display: inline-block;
}

.rusko_cate_box>li:hover .subbox_cover_2 {
     display: inline-block;
}

.rusko_cate_box>li:hover span {
    border-bottom: 1px solid #555;
}


.submenulist {
     margin-top: -16px;
     display: inline-block;
     width: 90px;
     height: auto;
     text-align: left;
     float: left;
     line-height: 20px;
     font-family: 'Roboto', 'Nanum Gothic', sans-serif;
     z-index: 99999;
}
          .smallnav_list>h2 {
               clear: both;
               color: #d5384c;
               font-size: 18px;
               font-weight: 300;
               margin-left: 20px;
               margin-top: 2px;
               margin-bottom: 4px;
               padding-left: 10px;
               cursor: pointer;
          }
          .smallnav_list>li {
               width: 90px;
               padding: 0px 5px;
               margin-left: 10px;
               color: #000;
               letter-spacing: -0.3px;
               font-size: 12px;
               margin-bottom: 0px;
               cursor: pointer;
               border-bottom: 0px solid #f5f5f5;
               transition: all linear 0.2s;
          }
          .smallnav_list>li a {
          display: inline-block;
          width: 90px;
               color: #999;
               font-size: 12px;
               font-family: 'Roboto', 'Nanum Gothic', sans-serif;
               cursor: pointer;
          }
          .smallnav_list>li:hover {
            background-color: #f5f5f5;
            
          }
          .smallnav_list>li:hover a {
          color: #000;
          font-weight: 500;
          }


.subbanner_cover {
     display: none;
     width: 840px;
     height: 220px;
     float: right;
}
          .smallnav_banner li {
               display: none;
               width: 780px;
               height: 220px;
               background-color: #fff;
               margin: 0 7px;
               overflow: hidden;
               padding-top: 10px;
          }
          .smallnav_banner li img {
               width: 780px;
          }
/* sale 깜빡임 */
@keyframes sale_red {
     0% {
          color: #fff;
     }
     50% {
          color: red;
     }
}
.sale_text {
     animation-name: sale_red;
     animation-duration: 0.2s;
     animation-iteration-count: infinite;
}


#search_form input {
  border: 0;
  font-size: 12px;
  padding-left: 6px;
  color: #000;
  border-bottom: 0px solid #555;
  background-color:#fff;
  width: 180px;
  border-radius: 2px;
  border: 1px solid #eee;
  }
  
.xi-search {
 margin-left: -18px;
 text-decoration: none;
 font-size: 12px;
 height: 20px;
 line-height: 22px;
}
  
  .smallnav_list {
  margin-top: 17px;
  }
  
  
  .top_slide_area {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 80px;
      background-size: cover;
      background-position: 50% 50%;
      z-index: 99;
      overflow: hidden;
  }
  .pagetop_banner_area {
      width: 100%;
      height: 80px;
  }
  #pagetop_banner1 {
      background-image: url("http://mjdo2015.speedgabia.com/rusko_renew/pagetop_banner.jpg");
  }
  #pagetop_banner2 {
      background-image: url("http://mjdo2015.speedgabia.com/rusko_renew/pagetop_banner2.jpg");
  }
  #pagetop_banner3 {
      background-image: url("http://mjdo2015.speedgabia.com/rusko_renew/pagetop_banner3.jpg");
  }
  
  .top_slide {
  font-size: 0;
  line-height: 0;
  transition: all linear 0.2s;
  }
  .top_slide li {
      margin-top: 0;
  }


.upperbannerlist_01 {
    background-image: url("http://mjdo2015.speedgabia.com/rusko_renew/layout_main/main_upper_01.jpg");
    margin: 0px 0px 0px 0px;
}
.upperbannerlist_01:hover {
    background-image: url("http://mjdo2015.speedgabia.com/rusko_renew/layout_main/main_upper_02.jpg");
    margin: 0px 0px 0px 0px;
}


.upper_bannerbox {
    width: 100%;
    text-align: center;
    background-color: #fff;
    padding-top: 0px;
    padding-bottom: 0px;
}
.upper_bannerbox li {
    display: inline-block;
    width: 1900px;
    height: 80px;
    border: 0px solid #fff;
    
}
.upper_bannerbox li:hover {
    border: 0px solid #fff;
    transition: all linear 0.2s;
}


.top_menu {
     position: absolute;
     left: 245px;
     top: 2px;
     text-align: left;
     background-color: #000;
     margin-top:1px;
}
.top_menu>ul {
     line-height:33px;
     text-align: center;
     display: inline-block;
     color: #fff;
     margin: 0 0 0 5px;
     background-color: #000;
}
.top_menu ul i {
     font-size: 25px;
     margin-top: 40px;
}
.top_menu ul p {
     margin-top : -5px;
}
.top_menu ul:hover i {
     color:#eb5728;
}
.top_menu ul:hover p {
     color:#eb5728;
}


.menu_btn>li {
    position: relative;
    display: inline-block;
    color: #fff;
}

.menu_btn>li:hover .menu_tab_cover {
    display: inline-block;
}


.menu_tab_cover {
    position: absolute;
    margin: 0 auto;
    left: 0%;
    top: 71px;
    width: 1381px;
    display: none;
    height: 300px;
    padding: 8px 10px 10px 10px;
    border: 1px solid #000;
    border-top: 6px solid #000;
    z-index: 1000;
    text-align: left;
    float: left;
    background-color: #fff;
}


.menu_tab {
    display: inline-block;
    max-width: 300px;
    max-height: 280px;
    text-align: left;
    vertical-align:top;
}


.menu_tab_list{
    display: inline-block;
    width: 200px;
    margin: 0px 10px 5px 0px;
    height: auto;
    text-align: left;
    float: left;
    line-height: 20px;
    font-family: 'Roboto', 'Nanum Gothic', sans-serif;

}

          .smallmenu_list>h2 {
               clear: both;
               margin-left: 20px;
               margin-top: 10px;
               margin-bottom: 10px;
               padding: 0px 0px;
          }

          .smallmenu_list>h2>a {
               color: #333;
               font-size: 15px;
               font-weight: 500;
               font-family: 'Roboto', 'Nanum Gothic', sans-serif;
	       text-decoration: none;
               cursor: pointer;

          }
          .smallmenu_list>h2>a:hover {
               color: #333;
               font-size: 15px;
               font-weight: 700;
               font-family: 'Roboto', 'Nanum Gothic', sans-serif;
	       text-decoration: none;

          }

          .smallmenu_list>li {
               width: 90px;
               padding: 0px 0px;
               margin-left: 20px;
               color: #777;
               letter-spacing: -0.3px;
               font-size: 13px;
               margin-bottom: 8px;
               margin-bottom: 8px;
               border-bottom: 0px solid #fff;
          }
          .smallmenu_list>li a {
               display: inline-block;
               width: 90px;
               color: #555;
               font-size: 13px;
               font-family: 'Roboto', 'Nanum Gothic', sans-serif;
               cursor: pointer;
	       text-decoration: none;
          }
          .smallmenu_list>li:hover {
            background-color: #fff;
            border-bottom: 0px solid #ccc;
          }
          .smallmenu_list>li:hover a {
          color: #000;
          font-weight: 600;       
	      text-decoration: none;  
          }


          .smallmenu_list2>h2 {
               clear: both;
               margin-left: 20px;
               margin-top: 10px;
               margin-bottom: 10px;
               padding: 0px 0px;
          }

          .smallmenu_list2>h2>a {
               color: #000;
               font-size: 15px;
               font-weight: 500;
               font-family: 'Roboto', 'Nanum Gothic', sans-serif;
	       text-decoration: none;
               cursor: pointer;

          }
          .smallmenu_list2>h2>a:hover {
               color: #aaa;
               font-size: 15px;
               font-weight: 500;
               font-family: 'Roboto', 'Nanum Gothic', sans-serif;
	       text-decoration: none;
          }


.menu_tab_side {
    margin-left: 35px;
    margin-top: 155px;
    display: inline-block;
    width:50px;
    height:200px;
    text-align: right;
}
.menu_tab_side img {
    width: 30px;
}


.cart_btn {position: relative;}
.cart_cnt {position: absolute; top: -10px; right: -10px; width: 10px; height: 10px; background-color: #ed592a; color: #fff; font-size: 9px; line-height: 10px; border-radius: 20px;}


.login_menu {
    position: fixed;
    top: 90px;
    left: 30px;
    width: 250px;
    float: left;
    border: 0px solid #333;
    text-align: left;
}

.login_menu li {
    display: inline-block;
    font-size: 12px;
    padding-right: 10px;
}

.login_menu li span {color: #555; cursor: pointer; transition: all linear 0.2s;}
.login_menu li span:hover {color: #ccc;}


.srch_menu {
    position: fixed;
    top: 115px;
    left: 30px;
    width: 250px;
    text-align: left;
    float: left;
}


.rusko_cate_box_2 {
     position: fixed;
     top: 170px;
     left: 180px;
     width: 100px;
     text-align: left;
     height: auto;
     display: inline-block;
     float: left;     
     z-index:9998;
}


.rusko_cate_box_2>li {
     position: relative;
     display: block;
     float: left; 
     width: 80px;
     height: 21px;
     line-height: 21px;
     font-weight: 400;
     font-family: 'Roboto', 'Nanum Gothic', sans-serif;
     border: 0px solid #000;
     padding-left: 0;
}
.rusko_cate_box_2>li>a {
     display: block;
     font-size: 13px;
     font-family: 'Roboto', 'Nanum Gothic', sans-serif;
     color: #000;
}

.rusko_cate_box_2>li>a>span {
     border-bottom: 1px solid #f5f5f5;
         transition: all linear 0.2s;
}

.rusko_cate_box_2>li:hover a{
    text-decoration: none;
}
.rusko_cate_box_2>li:hover .subbox_cover {
     display: inline-block;
}

.rusko_cate_box_2>li:hover .subbox_cover_2 {
     display: inline-block;
}

.rusko_cate_box_2>li:hover span {
    border-bottom: 1px solid #555;
}


.rusko_info {
     position: fixed;
     top: 500px;
     left: 30px;
     width: 250px;
     text-align: left;
     height: auto;
     display: inline-block;
     float: left;
     z-index:9998;
     font-size: 11px;
}


.nav_box li>div>a {transition: all linear 0.2s;}
.nav_box li>div>a:hover {opacity: 0.3;}

.rusko_info p>span {transition: all linear 0.2s;}
.rusko_info p>span:hover {color: #000;}

.rusko_cate_box li>a {transition: all linear 0.2s;}
.rusko_cate_box li>a:hover span {opacity: 0.4;}
/* BASIC css end */