@charset "utf-8";
/* .container{width: 1026px;margin:0 auto;position: relative;} */


@font-face {
    font-family: 'GmarketSansMedium';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* header */
#bodywrap{padding: 0;position: relative;}
#header{text-align: center;height: 120px;line-height: 120px;position: relative;background: #fff;}
.home_btn{position: absolute;left: 45px;top: 35px;}
.logo{display: inline-block;}
.menu_btn{position: absolute;right: 45px;top: 45px;}



/* main */
#content{background: #FFF; margin-bottom: 30px; padding-bottom: 20px;}
.main_img .slideul{width: 640px;height: 282px;}
.main_img .slideul img{height: 100%;width: 100%;}
.slidebar{background-color: #e60012;height: 95px;margin-top: -7px;}
.tabul{font-size: 0;text-align: left;margin-top: 0;border-bottom: 0;}
.tabul>li{display: inline-block;vertical-align: top;width: 25%;height: 120px;text-align: center;background-color: #e60012;box-sizing: border-box;}
.tabul>li>a{display: block;font-size: 19px;color: #FFF;font-weight: bold;line-height: 100px;border-right: 1px #ee4d5a solid;line-height: 100px;margin-top: 10px;}
.tabul>li:last-child>a{border-right: 0;}
.tabul>.on{background-color: #ffc035;border-right: 1px #ea908c solid;}
.tabul>.on>a{border-right: 0;}

.producul{text-align: center;font-size: 0;padding: 70px 20px 90px;}
.producul>li{display: inline-block;vertical-align: top;margin-right: 10px;margin-bottom: 15px;width: 190px;height: 190px;position: relative;text-align: left;}
.producul>li:last-child{margin-right: 0;}
.producT{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;box-sizing: border-box;display: inline-block;height: 50px;line-height: 50px;position: absolute;bottom: 0;color: #FFF;text-align: center;width: 100%;font-size: 17px;background: rgba(0,0,0,0.5);padding: 0 10px 0 10px;}
.tab_on{display: block;}
.menuul{max-width: 640px;left: 0;border-top:1px #dddddd solid;background-color: #FFF;position: absolute;width: 100%;z-index: 10;top:120px;right: 0;height: 100%;display: none;}
.menuul>li{border-bottom: 1px #dddddd solid;text-align: center;}
.menuul>li a{font-size: 22px;height: 65px;line-height: 65px;display: block;}
.shimano_bar{background-color: #0096e0;}
.sunline_bar{background-color: #000;margin-top: -15px;}
#shimano>li{background-color: #0096e0;}
#shimano>li>a{border-right: 1px #4db6e9 solid;}
#shimano>li:last-child>a,#sunline>li:last-child>a{border-right: 0;}
#shimano>.on,#sunline>.on{background-color: #ffc035;}
#shimano>.on>a,#sunline>.on>a{border-right: 0;}
#sunline>li{background-color: #000;}
#sunline>li>a{border-right: 1px #4d4d4d solid;}
.produc_img img{width: 100%;height: 100%;}

/* sub */
.product_search{padding: 18px 0;background-color: #cccccc;text-align: center;position: relative;}
.search_btn{position: absolute;top: 31px;left: 110px;}
.product_search input{width: 75%;height: 60px;border-radius: 35px;padding-left: 90px;box-sizing: border-box;font-size: 18px;}
.titleh2{font-size: 46px;color: #323232;font-weight: bold;font-family: 'Noto Sans Korean' , sans-serif;text-align: center;margin: 25px 0;}
.pdnul{padding-left: 25px;}
.pdnul>li{display: inline-block;vertical-align: top;border-right: 2px #323232 solid;margin-right: 5px;padding-right: 5px;width: 17%;text-align: center;margin-bottom: 10px;}
.pdnul>li:nth-child(5n){border-right: 0;margin-right: 0;padding-right:0;}
.pdnul>li>a{font-size: 18px;color: #323232;font-weight: bold;word-break: keep-all;}
.pdnul>.taL{text-align: left;}
.pdnul>.on{background-color: #f8f8f8;}

.product_list{font-size: 0;margin-top: 55px; margin-left: 20px;}
.product_list>li{display: inline-block;vertical-align: top;margin-right: 25px;margin-bottom: 45px;}
.product_list>li:nth-child(3n){margin-right: 0;}
.pl_img{border:3px #f5f5f5 solid;width: 185px;height: 185px;box-sizing: border-box;}
.pl_text{color: #5c5c5c;font-size: 17px;font-weight: bold;text-align: left;}
.smallT{display: block;color: #9a9a9a;font-size: 17px;font-weight: bold;}

.cont_top {
    padding: 40px 0 70px;
    text-align: center;

    font-family: 'Noto Sans Korean' , sans-serif;
    font-size: 36px;
    font-weight: 600;
    color: #000;
}

.cont_box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;

    padding: 0 10px;
}

.cont_a {
    position: relative;

    padding: 10px;
    margin-bottom: 12px;
    width: 46%;
    height: 135px;
    overflow: hidden;

    text-align: center;
    vertical-align: middle;
}

.cont_a span {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);

    width: 93%;

    font-family: 'Noto Sans Korean' , sans-serif;
    font-size: 25px;
    font-weight: 500;
    color: #fff;
    text-align: center;

    letter-spacing: -1px;
}


.cont_list_top {
    position: relative;
}

.cont_list_top p {
    position: absolute;
    top: 52%;
    left: 50%;
    transform: translate(-50%,-50%);

    /* font-family: 'Noto Sans Korean' , sans-serif; */
    font-family: 'GmarketSansMedium';
    font-size: 38px;
    font-weight: 500;
    color: #fff;
    text-align: center;
}

.cont_list_top img {
    max-width: 100%;
}

.cl_po {
    display: flex;
    align-items: center;
}

.cl_po p {
    padding: 20px 20px;
    font-family: 'Noto Sans Korean' , sans-serif;
    font-size: 18px;
    font-weight: 400;
    color: #000;

    position: relative;
}

.cl_po p:not(:last-child)::before {
    content: '>';
    position: absolute;
    top: 48%;
    right: -5px;
    transform: translate(-0,-50%);

    /* font-family: 'Noto Sans Korean' , sans-serif; */
    font-size: 18px;
    font-weight: 400;
    color: #000;
}


/* footer */
#footer{width: 100%;background-color: #000000;box-sizing: border-box;padding: 40px 20px 50px;text-align: center;}
.f_text{font-size: 15px;color: #FFF;font-weight: 300;line-height: 1.8;word-break: keep-all;margin-top: 20px;}

/* 자주쓰는 스타일 */
.inC{padding-left: 10px;border: 1px #cccccc solid;box-sizing: border-box;height: 25px;color: #666;font-size: 14px;}
.inlineB{display: inline-block;vertical-align: top;box-sizing: border-box;}
.relative{position: relative;}
.vaT{vertical-align: top;}
.sub_t{font-size: 16px;color: #666666;font-weight: 300;line-height: 1.7;word-break: keep-all;}
.dot{background-color: #92887d;display: inline-block;width: 5px;height: 5px;vertical-align: middle;margin-right: 3px;border-radius: 50%;vertical-align: top;margin-top: 11px;}
.bB0{border-bottom: 0;}
.bR0{border-right: 0;}
.btn54{background-color: #544b41;text-align: center;height: 50px;line-height: 50px;font-size: 16px;color: #FFF;}
.col637{color: #63728b;}


.mL5{margin-left: 5px;}
.mT10{margin-top: 10px;}
.mT20{margin-top: 20px;}


.tac{text-align: center;}
.taL{text-align: left;}
.taR{text-align: right;}

.fw500{font-weight: 500;}
.fw400{font-weight: 400;}
.fw300{font-weight: 300;}
