/* BASIC css start */
/* layout */

#section_01 { position:relative;margin-bottom:30px; *zoom:1;z-index:1 }

#section_02:after {content:""; display:block; clear:both;}
#section_02 { width:1200px;margin:0 auto; margin-bottom:30px; *zoom1;} /* IE5.5~7 브라우저 대응 Hack */
#section_02 .sec02_left { width:283px;height:502px;overflow:hidden;float:left;} 
#section_02 .sec02_right { width:917px;float:left;} 
#section_02 .sec02_right ul:after {content:""; display:block; clear:both;}
#section_02 .sec02_right ul { *zoom1;} /* IE5.5~7 브라우저 대응 Hack */
#section_02 .sec02_right li { float:left }

#section_02 .sec02_right li.fu_01 { width:316px;height:251px;overflow:hidden }
#section_02 .sec02_right li.fu_01 img { 
     -webkit-transform:scale(1);
    -moz-transform:scale(1);
    -ms-transform:scale(1); 
    -o-transform:scale(1);  
    transform:scale(1);
    -webkit-transition:.3s;
    -moz-transition:.3s;
    -ms-transition:.3s;
    -o-transition:.3s;
    transition:.3s;
 }
#section_02 .sec02_right li.fu_01 img:hover { 
     -webkit-transform:scale(1.1);
    -moz-transform:scale(1.1);
    -ms-transform:scale(1.1);   
    -o-transform:scale(1.1);
    transform:scale(1.1);
 }

#section_02 .sec02_right li.fu_02 { width:601px;height:251px;overflow:hidden }
#section_02 .sec02_right li.fu_02 img { 
     -webkit-transform:scale(1);
    -moz-transform:scale(1);
    -ms-transform:scale(1); 
    -o-transform:scale(1);  
    transform:scale(1);
    -webkit-transition:.3s;
    -moz-transition:.3s;
    -ms-transition:.3s;
    -o-transition:.3s;
    transition:.3s;
 }
#section_02 .sec02_right li.fu_02 img:hover { 
     -webkit-transform:scale(1.1);
    -moz-transform:scale(1.1);
    -ms-transform:scale(1.1);   
    -o-transform:scale(1.1);
    transform:scale(1.1);
 }

#section_02 .sec02_right li.lu_01 { width:601px;height:251px;overflow:hidden }
#section_02 .sec02_right li.lu_01 img { 
     -webkit-transform:scale(1);
    -moz-transform:scale(1);
    -ms-transform:scale(1); 
    -o-transform:scale(1);  
    transform:scale(1);
    -webkit-transition:.3s;
    -moz-transition:.3s;
    -ms-transition:.3s;
    -o-transition:.3s;
    transition:.3s;
 }
#section_02 .sec02_right li.lu_01 img:hover { 
     -webkit-transform:scale(1.1);
    -moz-transform:scale(1.1);
    -ms-transform:scale(1.1);   
    -o-transform:scale(1.1);
    transform:scale(1.1);
 }

#section_02 .sec02_right li.lu_02 { width:316px;height:251px;overflow:hidden }
#section_02 .sec02_right li.lu_02 img { 
     -webkit-transform:scale(1);
    -moz-transform:scale(1);
    -ms-transform:scale(1); 
    -o-transform:scale(1);  
    transform:scale(1);
    -webkit-transition:.3s;
    -moz-transition:.3s;
    -ms-transition:.3s;
    -o-transition:.3s;
    transition:.3s;
 }
#section_02 .sec02_right li.lu_02 img:hover { 
     -webkit-transform:scale(1.1);
    -moz-transform:scale(1.1);
    -ms-transform:scale(1.1);   
    -o-transform:scale(1.1);
    transform:scale(1.1);
 }

/*메인타이틀 공통*/

.sec_title { padding:30px 0;letter-spacing:-1px; }
.sec_title .sec_title_one { font-size:15px;color:#5a5a5a;text-align:center;font-weight:bold;border-bottom:1px solid #ccc;padding-bottom:10px;width:150px;margin:0 auto;} 
.sec_title .sec_title_two { font-size:30px;color:#262626;text-align:center;padding-top:10px;} 
.sec_title .sec_title_two .sub_color { font-weight:bold; } 


#section_03 { background:#f5f5f5;width:100%;margin-bottom:30px;} 
#section_03 .sec03_box:after {content:""; display:block; clear:both;}
#section_03 .sec03_box { width:1200px;margin:0 auto;overflow:hidden;padding-bottom:30px; *zoom1;} /* IE5.5~7 브라우저 대응 Hack */

#section_04:after {content:""; display:block; clear:both;}
#section_04 { width:1200px;margin:0 auto;margin-bottom:30px;*zoom1;} /* IE5.5~7 브라우저 대응 Hack */
#section_04  .cap_box { float:left; }

#section_04  .cap_box .cb_area{
    position: relative;
    overflow: hidden;
}
#section_04  .cap_box .cb_area:before{
    content: "";
    position: absolute;
    bottom: 5%;
    left: 5%;
    height: 0;
    border-left: 2px solid #fff;
    z-index: 1;
    transition: all 0.2s ease 0.9s;
}
#section_04  .cap_box .cb_area:hover:before{
    height: 90%;
    transition: all 0.2s ease 0s;
}
#section_04  .cap_box .cb_area:after{
    content: "";
    position: absolute;
    top: 5%;
    right: 5%;
    height: 0;
    border-right: 2px solid #fff;
    z-index: 1;
    transition: all 0.2s ease 0.2s;
}
#section_04  .cap_box .cb_area:hover:after{
    height: 90%;
    transition:all 0.2s ease 0.6s;
}
#section_04  .cap_box .cb_area .cb_pic:before{
    content: "";
    position: absolute;
    top: 5%;
    left: 5%;
    width: 0;
    border-bottom: 2px solid #fff;
    z-index: 1;
    transition: all 0.2s ease 0.6s;
}
#section_04  .cap_box .cb_area:hover .cb_pic:before{
    width: 90%;
    transition: all 0.2s ease 0.3s;
}
#section_04  .cap_box .cb_area .cb_pic:after{
    content: "";
    position: absolute;
    bottom: 5%;
    right: 5%;
    width: 0;
    border-bottom: 2px solid #fff;
    z-index: 1;
    transition: all 0.2s ease 0s;
}
#section_04  .cap_box .cb_area:hover .cb_pic:after{
    width: 90%;
    transition: all 0.2s ease 0.9s;
}
#section_04  .cap_box .cb_area .cb_pic img{
    width: 100%;
    height: auto;
    transform: scale(1);
    transition: all 0.5s ease 0s; /*확대속도조절*/
}
#section_04  .cap_box .cb_area:hover .cb_pic img{
    transform: scale(1.1); /*확대크기조절*/
}


#section_05:after {content:""; display:block; clear:both;}
#section_05 { width:1200px;margin:0 auto;margin-bottom:30px;overflow:hidden;*zoom1;} /* IE5.5~7 브라우저 대응 Hack */

#section_06 { position:relative;width:1920px;height:206px;left:50%;margin-left:-960px;margin-bottom:30px; *zoom:1;z-index:1 }

#section_07:after {content:""; display:block; clear:both;}
#section_07 { width:1200px;margin:0 auto;margin-bottom:30px;overflow:hidden;*zoom1;} /* IE5.5~7 브라우저 대응 Hack */

#section_08:after {content:""; display:block; clear:both;}
#section_08 { width:1200px;margin:0 auto; margin-bottom:30px; *zoom1;} /* IE5.5~7 브라우저 대응 Hack */
#section_08 li { float:left;padding-right:19px; } 
#section_08 li.last { float:right;padding-right:0px; } 

#section_08 li img {
    display: block;
    filter: alpha(opacity=60);
    opacity: .6;
    -webkit-opacity: .6;
    transition: opacity .3s ease;
    -webkit-transition: opacity .3s ease;
}


#section_08 li:hover img {
    filter: alpha(opacity=100);
    opacity: 1.0;
    -webkit-opacity: 1.0;
}


/* 상품진열 스타일2 */

.ec-base-product_main_02 { width:101.7%;margin:22px 0 0; }
.ec-base-product_main_02 img { vertical-align:middle; }

.ec-base-product_main_02 .prdList { display:table; width:100%; min-width:756px; margin:-20px 0 0; font-size:0; line-height:0; }
.ec-base-product_main_02 .prdList > li { display:inline-block; margin:10px 0; color:#757575; vertical-align:top; }



/* 마우스오버시 액션 */
.ec-base-product_main_02 .prdList > li.view {
   overflow: hidden;
   position: relative;
   text-align: center;
   cursor: default;
}
.ec-base-product_main_02 .prdList > li.view .mask {
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
}
.ec-base-product_main_02 .prdList > li.view img {
   display: block;

}

.ec-base-product_main_02 .prdList > li.third-effect .mask {
   width:95%;
   height:100%;
   opacity: 0;
   overflow:visible;
   background:rgba(0,0,0,0.5);
   -moz-box-sizing:border-box;
   -webkit-box-sizing:border-box;
   box-sizing:border-box;
   -webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;
}

.ec-base-product_main_02 .prdList > li.third-effect:hover .mask {
   width:95%;
   height:100%;
   opacity: 1;
   background:rgba(0,0,0,0.5);
   cursor:pointer;
}




.ec-base-product_main_02 .prdList .chk { display:block; margin:0 0 10px; text-align:center; }
.ec-base-product_main_02 .prdList .thumbnail { position:relative; text-align:center; }
.ec-base-product_main_02 .prdList .thumbnail a img { width:95%; box-sizing:border-box; }
.ec-base-product_main_02 .prdList .thumbnail .wish { text-align:center; cursor:pointer; }
.ec-base-product_main_02 .prdList .thumbnail .prdIcon { position:absolute; top:0; left:0; width:100%; height:100%; background-repeat:no-repeat; }

.ec-base-product_main_02 .prdList .description {position:relative;  margin:0 auto;padding:50px; font-size:12px; line-height:18px; text-align:center;z-index:14 }
.ec-base-product_main_02 .prdList .description .percent { margin:0 auto;width:80px;height:80px;background:#ff0000;border-radius:40px;line-height:80px;font-size:18px;font-weight:bold;color:#FFF;margin-bottom:20px; }
.ec-base-product_main_02 .prdList .description .name { display:block; text-align:center;padding-bottom:5px;font-size: 14px;color: #FFF;font-weight: bold; }
.ec-base-product_main_02 .prdList .description .name a { font-size: 14px;color: #FFF;font-weight: bold; }
.ec-base-product_main_02 .prdList .description .sub_names { font-size: 11px;color: #e1e1e1; }
.ec-base-product_main_02 .prdList .description .prd-price strike { font-size: 11px;color: #e1e1e1; }
.ec-base-product_main_02 .prdList .description .prd-price .prd-price2 { font-size: 12px;color: #FFF;font-weight: bold; }
.ec-base-product_main_02 .prdList .description .icon { margin:0 0 15px; /*border-bottom:1px solid #e8e8e8;*/ vertical-align:middle;text-align:center; }
.ec-base-product_main_02 .prdList .description .icon:after { content:""; display:block; clear:both; }
.ec-base-product_main_02 .prdList .description .promotion { /*float:left; margin:0 0 4px;*/ text-align:center; }
.ec-base-product_main_02 .prdList .description .promotion img { display:inline }

.ec-base-product_main_02 .prdList .description .etc_icon2 {position:relative; text-align:center;z-index:15 }
.ec-base-product_main_02 .prdList .description .etc_icon2 img { display:inline;}


/* 진열방식 */
.ec-base-product_main_02 ul.grid3 > li { width:33.33%; }
.ec-base-product_main_02 ul.grid4 > li { width:25%; }
.ec-base-product_main_02 ul.grid5 > li { width:20%; }






/* 상품진열 스타일3 */

.ec-base-product_main_03 { width:101.65%;margin:22px 0 0; }
.ec-base-product_main_03 img { vertical-align:middle; }

.ec-base-product_main_03 .prdList { display:table; width:100%; min-width:756px; margin:-10px 0 0; font-size:0; line-height:0; }
.ec-base-product_main_03 .prdList .prd_frame:after {content:""; display:block; clear:both;}
.ec-base-product_main_03 .prdList .prd_frame { border:1px solid #e8e8e8;margin-right:20px;*zoom1;} /* IE5.5~7 브라우저 대응 Hack */
.ec-base-product_main_03 .prdList .prd_frame:hover { border:1px solid #777;}
.ec-base-product_main_03 .prdList > li { display:inline-block; margin:10px 0; color:#757575; vertical-align:top; }

.ec-base-product_main_03 .prdList .description { float:left; width:240px;padding:25px; font-size:12px; line-height:18px; text-align:left;word-break: break-all; }
.ec-base-product_main_03 .prdList .description .percent { width:66px;height:66px;text-align:center;background:#000;border-radius:33px;line-height:66px;font-size:18px;font-weight:bold;color:#FFF;margin-bottom:20px; }
.ec-base-product_main_03 .prdList .description .name { display:block; padding-bottom:10px;font-size: 14px;color: #222222;font-weight: bold;}
.ec-base-product_main_03 .prdList .description .name a { font-size: 14px;color: #222222;font-weight: bold; }
.ec-base-product_main_03 .prdList .description .sub_names { font-size: 11px;color: #555555; }
.ec-base-product_main_03 .prdList .description .prd-price .prd-price2 { font-size: 14px;color: #000000;font-weight: bold; }
.ec-base-product_main_03 .prdList .description .icon {/* margin:0 0 15px; border-bottom:1px solid #e8e8e8;*/ vertical-align:middle; }
.ec-base-product_main_03 .prdList .description .icon:after { content:""; display:block; clear:both; }
.ec-base-product_main_03 .prdList .description .promotion { float:left; margin:0 0 4px; text-align:left; }


.ec-base-product_main_03 .prdList .thumbnail { float:right;position:relative; text-align:center; }
.ec-base-product_main_03 .prdList .thumbnail a img { width:280px; box-sizing:border-box; }
.ec-base-product_main_03 .prdList .thumbnail .etc_icon3 { position:absolute; right:3px; bottom:4px; z-index:1; cursor:pointer; }
.ec-base-product_main_03 .prdList .thumbnail .etc_icon3 img { width:100%; }



/* 진열방식 */
.ec-base-product_main_03 ul.grid2 > li { width:50%; }
.ec-base-product_main_03 ul.grid3 > li { width:33.33%; }
.ec-base-product_main_03 ul.grid4 > li { width:25%; }
.ec-base-product_main_03 ul.grid5 > li { width:20%; }

/* BASIC css end */