@charset "utf-8";

/* 메인과 서브에서 공통으로 쓰는 css */

.section_title{font-size:30px; font-size:3.0rem; line-height:36px; line-height:3.6rem; letter-spacing: -0.04em; font-weight: 500; color:#000; text-align: center;}
.section_title.font_roboto{font-size:24px; font-size:2.4rem; line-height:30px; line-height:3.0rem; letter-spacing: 0.05em; font-weight: 900;}

.sub .section_title.font_roboto{font-size:19px; font-size:1.9rem; line-height:25px; line-height:2.5rem;}

/* tab_style_0 */
.tab_style_0_wrap{text-align: center;}
.tab_style_0_wrap .tab_style_0_con{max-width: 100%; display: inline-flex; flex-wrap: nowrap; align-items: flex-start; overflow-x: auto;}
.tab_style_0_con .tab_style_0{flex: 0 0 auto;}
.tab_style_0_con .tab_style_0:first-child{margin-left: 0;}
.tab_style_0_con .tab_style_0:last-child{margin-right: 0;}
.tab_style_0_con .tab_style_0 > a{display: inline-block; font-size:15px; font-size:1.5rem; line-height:21px; line-height:2.1rem; font-weight: 400; letter-spacing: -0.03em; color: #9dadb4;
    border-bottom: 1px solid transparent; padding-bottom: 5px; margin-left: 17px; margin-right: 17px; transition: all 0.2s; }
.tab_style_0_con .tab_style_0 > a.font_roboto{font-size:14px; font-size:1.4rem; line-height:20px; line-height:2.0rem; letter-spacing: 0.02em; font-weight: 500;}
.tab_style_0_con.font_roboto .tab_style_0 > a{font-family: 'Roboto'; font-size:14px; font-size:1.4rem; line-height:20px; line-height:2.0rem; letter-spacing: 0.02em; font-weight: 500;}
.tab_style_0_con .tab_style_0:first-child > a{margin-left: 0;}
.tab_style_0_con .tab_style_0:last-child > a{margin-right: 0;}
.tab_style_0_con .tab_style_0.active > a{border-bottom-color: #000; color: #000;}

.list_style_0_wrap{}
.list_style_0_wrap .list_style_0_con{ margin-bottom: -54px;}
.list_style_0_wrap .list_style_0{/*width: 100% !important;*/ height: auto; text-align: center; margin-bottom: 54px;}
.list_style_0_wrap .list_style_0_inner{/*display: inline-block; max-width: 382px;*/ cursor: pointer;}
.list_style_0_wrap .list_style_0 .img_con{position: relative; margin-bottom: 30px;}
.list_style_0_wrap .list_style_0.new .img_con:before{content:'신상품'; position: absolute; z-index: 1; top:0; left:0; font-size:13px; font-size:1.3rem; line-height:19px; line-height:1.9rem; font-weight: 300; letter-spacing: -0.025em; color:#9f885d; padding-bottom: 10px; padding-right: 15px; background-color: #fff;}
.list_style_0_wrap .list_style_0 .img_box{position: relative;}
.list_style_0_wrap .list_style_0 .img_box:after{content:''; position: absolute; z-index: 2; width: 100%; height: 100%; top:0; left: 0; background-color: transparent; transition: background-color 0.2s;}
.list_style_0_wrap .list_style_0 .img_box img{width: 100%;}
.list_style_0_wrap .list_style_0 .btn_box{display: none; position: absolute; z-index: 3; width: 100%; height: 100%; top:0; left: 0; align-items: center; justify-content: center;}
.list_style_0_wrap .list_style_0 .btn_box .list_btn_style_0{display: inline-flex; width: 44px; height: 44px; justify-content: center; align-items: center; border-radius: 50%; margin-right: 25px; transition: background-color 0.2s;}
.list_style_0_wrap .list_style_0 .btn_box .list_btn_style_0:last-child{margin-right: 0 !important;}
.list_style_0_wrap .list_style_0 .btn_box .list_btn_style_0 img{width: 17px;}
.list_style_0_wrap .list_style_0 .text_con{text-align: left;}
.list_style_0_wrap .list_style_0 .text_top_con{font-size:0px; font-size:0rem; line-height:0px; line-height:0.0rem; margin-bottom: 7px;}
.list_style_0_wrap .list_style_0 .product_name{display: inline-block; vertical-align: middle; font-size:15px; font-size:1.5rem; line-height:21px; line-height:2.1rem; font-weight: 300; color:#000;}
.list_style_0_wrap .list_style_0.best .product_name{position: relative; padding-right: 50px;}
.list_style_0_wrap .list_style_0.best .product_name:after{content: 'BEST'; position: absolute; top:1px; right: 0; font-family: 'Roboto'; font-size:10px; font-size:1.0rem; line-height:16px; line-height:1.6rem; letter-spacing: 0.02em; font-weight: 500; color:#c6201e;
    border:1px solid #ededed; background-color: #fff; padding-left: 5px; padding-right: 5px; padding-top: 1px;}
.list_style_0_wrap .list_style_0 .sale_percent{display: inline-block; vertical-align: middle; font-size:15px; font-size:1.5rem; line-height:21px; line-height:2.1rem; font-weight: 700; color:#000; margin-left: 10px;}
.list_style_0_wrap .list_style_0 .text_bottom_con{font-size:0px; font-size:0rem; line-height:0px; line-height:0.0rem;}
.list_style_0_wrap .list_style_0 .sale_price{display: inline-block; vertical-align: middle;}
.list_style_0_wrap .list_style_0 .sale_price > span{font-size:15px; font-size:1.5rem; line-height:21px; line-height:2.1rem; font-weight: 300; letter-spacing: 0; color:#000;}
.list_style_0_wrap .list_style_0 .sale_price > span.font_roboto{font-weight: 400; letter-spacing: 0.02em;}
.list_style_0_wrap .list_style_0 .origin_price{display: inline-block; vertical-align: middle; margin-left: 10px; margin-top: 1px;}
.list_style_0_wrap .list_style_0 .origin_price > span{font-size:15px; font-size:1.5rem; line-height:21px; line-height:2.1rem; font-weight: 300; letter-spacing: 0; color:#b1c0c7; text-decoration: line-through;}
.list_style_0_wrap .list_style_0 .origin_price > span.font_roboto{font-weight: 400; letter-spacing: 0.02em;}

.list_style_0_wrap .list_style_0:hover .img_box:after {background-color: rgba(0, 0, 0, 0.3);}
.list_style_0_wrap .list_style_0:hover .btn_box {display: flex;}

.list_style_0_wrap.type_2{}

.pagination_style_0_wrapper .btn_style_3 .text{font-size:15px; font-size:1.5rem;}
.pagination_style_0_wrapper .btn_style_3 .arrow_con{width: 6px; height: 11px; margin-top: -1px;}

.shopping_mall .view_contents_con .view_contents_box.menu_qna{border-bottom:none;}
.shopping_mall .view_contents_con .view_contents_box.product_guide{display: none;}

@media all and (max-width: 480px){
    .scroll_hidden::-webkit-scrollbar{display: none; background-color: transparent;}
}

@media all and (min-width:768px){

    .tab_style_0_con .tab_style_0 > a{margin-left: 22px; margin-right: 22px;}

    .list_style_0_wrapper .list_style_0_wrap .list_style_0_con{width: calc(100% + 12px) !important; margin-left: -12px;}
    .list_style_0_wrap .list_style_0{width: 50% !important;}
    .list_style_0_wrap .list_style_0_inner{display: block; padding-left: 12px; max-width: none;}
}

@media all and (min-width: 992px) {
    .list_style_0_wrap .list_style_0 {width: 33.33% !important;}
    .list_style_0_wrap .list_style_0 .btn_box .list_btn_style_0{margin-right: 15px;}
    .list_style_0_wrap .list_style_0 .btn_box .list_btn_style_0:hover {background-color: #b81d1b;}

    .list_style_0_wrap.type_2 .list_style_0{width: 50% !important;}
}