/* BASIC css start */
:root {
    /*color*/
    --point-color:#5F4541;
    /*font*/
    --base-font:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,system-ui,Roboto,"Helvetica Neue","Segoe UI","Apple SD Gothic Neo","Noto Sans KR","Malgun Gothic","Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol",sans-serif;
    /*size*/
    --base-size:14px;
}

.scroll-lock{overflow: hidden;}

.dn{display:none !important}




main{padding-bottom:20px}

#wrap {
    overflow:auto;
}
#mask {
    display:none;
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.6);
    z-index: 200
}

#contents{  min-height: 420px;}

/* header */
#head_box {
    z-index:11;
    position:fixed;
    background:#fff;
    width:100%;
}
#header {
    z-index: 100;
    height: 60px;
    width: 100%;
    position: relative;
}
#topBnr {
    text-align:center;
    height:30px;
    align-content:center;
    background:#5f4541;
}
#topBnr .topBnrBox {
}
#topBnr .topBnrBox p {
    color:#fff;
    font-size:12px;
    line-height:22px;
    font-weight:500;
}
#topBnr .topBnrBox p span {
    font-weight:800
}
#header .headerTnb {
    position:absolute;
    right:0;
    top:0;
}
#header .headerTnb:after {
    display:block;
    clear:both;
    content:''
}
#header .headerTnb .tnb {
    margin-top: 17px;
    margin-right: 20px;
}
#header .headerTnb .tnb ul {
}

#header .headerTnb .tnb li {
    padding-left:12px;
    display:inline-block;
    vertical-align:middle;
}
#header .headerTnb .tnb li.src {
}

#header .headerTnb .tnb li.cart {
    position:relative;
}
#header .headerTnb .tnb li.cart a {
}
#header .headerTnb .tnb li.cart a p {
    width:16px;
    height:16px;
    background:var(--point-color);
    border-radius:100%;
    display:block;
    color:#fff;
    text-align:center;
    font-size:11px;
    font-weight:700;
    line-height:15px;
    position:absolute;
    right:0;
    bottom:0;
}
#header .headerTnb .tnb li a {
    display:block;
    font-size:var(--base-size);
    color:var(--point-color);
}
#header .headerTop {
    *zoom:1
}
#header .headerTop:after {
    display:block;
    clear:both;
    content:''
}
#header .headerTop .tlogo {
    text-align:center;
    height:60px;
    line-height: 60px;
}
#header .headerTop .tlogo a {
    height:60px;
    display:block;
    line-height: 60px;
}
#header .headerTop .tlogo a img{
    vertical-align:middle;
    width:120px;
}



#header .headerGnb {
}
#header .headerGnb .gnbInner {
}
#header .headerGnb .gnbInner>ul {
    *zoom:1
}
#header .headerGnb .gnbInner>ul:after {
}
#header .headerGnb .gnbInner>ul li {
}
#header .headerGnb .gnbInner>ul li:first-child {
    margin-left:0
}
#header .headerGnb .gnbInner>ul li:last-child {
    margin-right:0
}
#header .headerGnb .gnbInner>ul>li a {
}
#header .headerGnb .gnbInner>ul>li a:before {
}
#header .headerGnb .gnbInner>ul>li a:active:before,#header .headerGnb .gnbInner>ul>li a:focus:before,#header .headerGnb .gnbInner>ul>li a:hover:before {
}
#header .headerGnb .gnbInner>ul>a:hover {
}
#header .headerGnb .gnbInner>ul li.first {
}
#header .headerGnb .gnbInner>ul li.last {
}
#header .headerGnb .gnbInner .submenu {
}
#header .headerGnb .gnbInner .submenu.on {
}
#header .headerGnb .gnbInner .submenu ul {
}
#header .headerGnb .gnbInner .submenu ul li {
}
#header .headerGnb .gnbInner .submenu ul li a {
}


/* 다찾다 자동완성*/
.search-auto-complete-list {
    display:none;
    z-index:1;
    position:absolute;
    top:40px;
    left:0;
    border:1px solid #ddd;
    border-top:1px solid #000;
    line-height:14px;
    background:#fff;
}
.search-auto-complete-list ul {
    width:202px;
    padding:4px 0 6px;
    border-bottom:1px solid #ddd;
}
.search-auto-complete-list ul li {
    text-align:left;
}
.search-auto-complete-list ul li.on {
    background:#f3f3f3;
}
.search-auto-complete-list ul li a {
    display:block;
    padding:8px 14px 7px;
    color:#000;
    background:none;
    _font-family:'dotum';
    font-size:12px;
    letter-spacing:-1px;
}
.search-auto-complete-list ul li a strong {
    color:#ab3e41;
}
.search-auto-complete-list ul li a:hover {
    background:#f2f2f2;
}
.search-auto-complete-list ul li a:hover span {
    border-bottom:1px solid #000;
}
.search-auto-complete-list .search-list-close {
    display:block;
    padding:10px 11px;
    text-align:right;
    color:#999;
    font-size: 11px;
}
/* 다찾다 검색 파인더 */
#allfinder-layer {
    z-index:9999;
    position:fixed;
    top:50px;
    right:110px;
    width:1000px;
    zoom:1;
    overflow:hidden;
}
#allfinder-layer .finder-body {
    display:none;
    z-index:1;
    position:relative;
    width:998px;
    *width:918px;
    padding:35px 40px 5px;
    max-height:800px;
    overflow-x:hidden;
    overflow-y:auto;
    box-sizing:border-box;
    border:1px solid #666;
    background:#fff;
}
#allfinder-layer .finder-body .finder-close {
    position:absolute;
    top:15px;
    right:10px;
    font-size:24px;
    color:#000;
    *width:19px;
    *height:24px;
    *background:url('/images/common/btn_h11_close.gif') no-repeat center center;
    *background-size:19px 24px;
}
#allfinder-ctr {
    z-index:10000;
    position:fixed;
    top:50px;
    right:0;
    width:103px;
    height:86px;
}
#allfinder-ctr a {
    display:block;
    width:100%;
    height:100%;
    background:url('/images/common/allfinder_ctrl_pc.png') no-repeat right top;
    border:none;
    outline:none;
    font-size:0;
}
.all-finder-layer .finder-body .finder-tbl table {
    border:1px solid #ccc;
    border-top:1px solid #000;
}
.all-finder-layer .finder-body .finder-tbl th,.all-finder-layer .finder-body .finder-tbl td {
    height:40px;
    border-top:1px solid #e5e5e5;
    font-size:13px;
    _font-family:'Malgun Gothic';
    color:#000;
}
.all-finder-layer .finder-body .finder-tbl tr:first-child th,.all-finder-layer .finder-body .finder-tbl tr:first-child td {
    border-top:none;
}
.all-finder-layer .finder-body .finder-tbl th {
    padding:5px 0;
    background:#f4f4f4;
    text-align:left;
    vertical-align:top;
}
.all-finder-layer .finder-body .finder-tbl th .txt-l {
    position:relative;
    height:34px;
    line-height:34px;
    padding:0 20px;
    margin:3px 0;
}
.all-finder-layer .finder-body .finder-tbl th .txt-l .fa {
    position:absolute;
    top:50%;
    right:15px;
    margin-top:-6px;
}
.all-finder-layer .finder-body .finder-tbl th .txt-l .finder-tooltip-btn {
    display:inline-block;
    width:20px;
    height:20px;
    line-height:22px;
    border:1px solid #cecece;
    border-radius:20px;
    color:#666;
    font-size:11px;
    background:#fff;
    text-align:center;
    outline:none;
}
.all-finder-layer .finder-body .finder-tbl th .txt-l .finder-comm-layer {
    display:none;
    position:absolute;
    top:33px;
    left:52px;
    width:270px;
    padding:0 20px 18px;
    border:1px solid #000;
    background:#fff;
    text-align:left;
    font-weight:normal;
    color:#000;
    z-index:1
}
.all-finder-layer .finder-body .finder-tbl th .txt-l .finder-comm-layer .finder-btn-close {
    display:inline-block;
    position:absolute;
    top:14px;
    right:20px;
    margin:0;
    font-size:21px;
    color:#000;
    outline:none;
    *width:19px;
    *height:22px;
    *background:url('/images/common/btn_h11_close.gif') no-repeat center center;
}
.all-finder-layer .finder-body .finder-tbl th .txt-l .finder-comm-layer .finder-layer-tit {
    padding:18px 0;
    border-bottom:1px solid #e5e5e5;
    font-size:15px;
    font-weight:bold;
    line-height:15px;
}
.all-finder-layer .finder-body .finder-tbl th .txt-l .finder-comm-layer .finder-layer-cnt {
    padding-top:16px;
    line-height:1.5;
    font-size:13px;
}
.all-finder-layer .finder-body .finder-tbl td {
    padding:5px 10px;
}
.all-finder-layer .finder-body .txt-input {
    height:21px;
    line-height:21px;
    padding:0 5px;
    font-size:13px;
    _font-family:'Malgun Gothic';
}
.all-finder-layer .finder-body .finder-category {
    height:40px;
    overflow:hidden;
}
.all-finder-layer .finder-body .finder-category.open {
    height:100%;
    overflow:visible;
}
.all-finder-layer .finder-body tr.finder-child-category {
    display:none;
}
.all-finder-layer .finder-body tr.finder-child-category th,.all-finder-layer .finder-body tr.finder-child-category td {
    border-top:none;
}
.all-finder-layer .finder-body tr.finder-child-category td {
    background:#fbfbfb;
}
.all-finder-layer .finder-body tr.finder-child-category td .finder-category2 .finder-cate2 {
    display:inline-block;
    margin:3px 5px 3px 0;
    padding:5px 10px;
    cursor:pointer;
    line-height:22px;
    vertical-align:top;
    word-break:break-all;
    color:#9a9a9a;
}
.all-finder-layer .finder-body tr.finder-child-category td .finder-category2 .finder-cate2 .fa-check {
    display:none;
}
.all-finder-layer .finder-body tr.finder-child-category td .finder-category2 .finder-cate2.on {
    font-weight:bold;
    color:#000;
    border:0;
    border-radius:0;
    box-shadow:unset;
}
.all-finder-layer .finder-body tr.finder-child-category td .finder-category2 .finder-cate2.on .fa-check {
    display:inline-block;
    margin-right:3px;
}
.all-finder-layer .finder-body .finder-color {
    padding-left:10px;
}
.all-finder-layer .finder-body .finder-price .finder-price-input {
    display:inline-block;
    padding-top:5px
}
.all-finder-layer .finder-body .finder-price .finder-price-input label {
    display:inline-block;
    width:110px;
    padding:0 10px;
    border:1px solid #ccc;
    border-radius:3px;
    color:#666;
}
.all-finder-layer .finder-body .finder-price .finder-price-input label .txt-input {
    display:inline-block;
    width:90px;
    height:29px;
    line-height:29px;
    padding:0;
    border:none;
    background:none;
    color:#333;
    text-align:right;
}
.all-finder-layer .finder-body .finder-search {
    position:relative;
    padding-left:5px;
}
.all-finder-layer .finder-body .finder-search label {
    display:inline-block;
    width:320px;
    padding:0 10px;
    border:1px solid #ccc;
    border-radius:3px;
}
.all-finder-layer .finder-body .finder-search label .txt-input {
    display:block;
    width:100%;
    height:29px;
    line-height:29px;
    padding:0;
    border:none;
    background:none;
    color:#333;
    text-align:left;
}
.all-finder-layer .finder-body .finder-btn-c {
    padding:30px 0;
    text-align:center;
}
.all-finder-layer .finder-body .finder-btn-c a.reset {
    display:inline-block;
    width:140px;
    height:60px;
    line-height:57px;
    border:none;
    border-radius:3px;
    background:#999;
    color:#fff;
    font-size:18px;
    font-weight:bold;
    letter-spacing:1px;
    _font-family:'Malgun Gothic';
    margin-right:15px;
}
.all-finder-layer .finder-body .finder-btn-c button {
    display:inline-block;
    height:60px;
    line-height:57px;
    padding:0 30px;
    *padding:0;
    border:none;
    border-radius:3px;
    background:#000;
    color:#fff;
    font-size:18px;
    font-weight:bold;
    letter-spacing:-0.5px;
    font-family:'Malgun Gothic';
    cursor:pointer;
}
.all-finder-layer .finder-body .finder-btn-c button span.ico-search {
    visibility:visible;
    display:inline-block;
    width:16px;
    height:15px;
    margin-right:10px;
    margin-top:-4px;
    *margin-top:0;
    vertical-align:middle;
    background:url('/images/common/btn_h15_search.png') no-repeat 0 0;
}
.all-finder-layer .finder-body .finder-btn-c button span.finder-count {
    visibility:visible;
    display:inline-block;
    height:60px;
    color:#ffd800;
    font-size:23px;
    *vertical-align:middle;
}
.all-finder-layer .finder-body .finder-btn-c button span.finder-count-toggle {
    visibility:visible;
    display:none;
}
.all-finder-layer .finder-body .finder-options {
    display:inline-block;
    margin:3px 5px 3px 0;
    padding:5px 10px;
    cursor:pointer;
    line-height:22px;
    border:1px solid #fff;
    vertical-align:top;
    word-break:break-all;
}
.all-finder-layer .finder-body .finder-options.on {
    font-weight:bold;
    border:1px solid #000;
    border-radius:20px;
    box-shadow:2px 2px 3px #d2d2d2;
}
.all-finder-layer .finder-body .finder-option-color em {
    display:inline-block;
    width:22px;
    height:22px;
    border-radius:20px;
    font-size:0;
    vertical-align:top;
}
.all-finder-layer .finder-body .finder-option-color.color-picker {
    width:22px;
    height:22px;
    padding:0;
    border:none;
}
.all-finder-layer .finder-body .finder-option-color.color-picker.on {
    border:none;
}
.all-finder-layer .finder-body .finder-option-color.color-picker .fa-check {
    display:none;
    width:22px;
    height:22px;
    margin-top:-17px;
    color:#fff;
    text-align:center;
}
.all-finder-layer .finder-body .finder-option-color.color-picker.on .fa-check {
    display:block;
}
.all-finder-layer .finder-body .finder-option-color.color-picker.on.finder-option-color-white .fa-check {
    color:#000;
}
.all-finder-layer .finder-body .finder-option-color.finder-option-color-black em {
    background-color:#000;
}
.all-finder-layer .finder-body .finder-option-color.finder-option-color-white em {
    background-color:#FFF;
    width:20px;
    height:20px;
    border:1px solid #e5e5e5;
}
.all-finder-layer .finder-body .finder-option-color.finder-option-color-gray em {
    background-color:#808080;
}
.all-finder-layer .finder-body .finder-option-color.finder-option-color-beige em {
    background-color:#e5d0b2;
}
.all-finder-layer .finder-body .finder-option-color.finder-option-color-brown em {
    background-color:#aa6810;
}
.all-finder-layer .finder-body .finder-option-color.finder-option-color-navy em {
    background-color:#425583;
}
.all-finder-layer .finder-body .finder-option-color.finder-option-color-blue em {
    background-color:#0000ff;
}
.all-finder-layer .finder-body .finder-option-color.finder-option-color-light-blue em {
    background-color:#62acff;
}
.all-finder-layer .finder-body .finder-option-color.finder-option-color-red em {
    background-color:#ff0000;
}
.all-finder-layer .finder-body .finder-option-color.finder-option-color-orange em {
    background-color:#ffa500;
}
.all-finder-layer .finder-body .finder-option-color.finder-option-color-yellow em {
    background-color:#ffff00;
}
.all-finder-layer .finder-body .finder-option-color.finder-option-color-pink em {
    background-color:#ffc0cb;
}
.all-finder-layer .finder-body .finder-option-color.finder-option-color-purple em {
    background-color:#800080;
}
.all-finder-layer .finder-body .finder-option-color.finder-option-color-jaju em {
    background-color:#a63f7f;
}
.all-finder-layer .finder-body .finder-option-color.finder-option-color-khaki em {
    background-color:#2f5e2f;
}
.all-finder-layer .finder-body .finder-option-color.finder-option-color-green em {
    background-color:#008000;
}
.all-finder-layer .finder-body .finder-option-color.finder-option-color-light-green em {
    background-color:#72dd95;
}
.all-finder-layer .finder-body .finder-option-color.finder-option-color-silver em {
    background-color:#dfdfdf;
}
.all-finder-layer .finder-body .finder-option-color.finder-option-color-gold em {
    background-color:#cfbc4e;
}
.all-finder-layer .finder-body .finder-option-color.finder-option-color-apricot em {
    background-color:#fbceb1;
}
.all-finder-layer .finder-body .search-auto-complete-list {
    display:none;
    z-index:1;
    position:absolute;
    top:30px;
    left:5px;
    border:1px solid #ddd;
    line-height:14px;
    background:#fff;
}
.all-finder-layer .finder-body .search-auto-complete-list ul {
    width:340px;
    padding:4px 0 6px;
    border-bottom:1px solid #ddd;
}
.all-finder-layer .finder-body .search-auto-complete-list ul li {
    text-align:left;
}
.all-finder-layer .finder-body .search-auto-complete-list ul li.on {
    background:#f3f3f3;
}
.all-finder-layer .finder-body .search-auto-complete-list ul li a {
    display:block;
    padding:8px 14px 7px;
    color:#000;
    background:none;
    _font-family:'dotum';
    font-size:12px;
    letter-spacing:-1px;
}
.all-finder-layer .finder-body .search-auto-complete-list ul li a strong {
    color:#ab3e41;
}
.all-finder-layer .finder-body .search-auto-complete-list ul li a:hover {
    background:#f2f2f2;
}
.all-finder-layer .finder-body .search-auto-complete-list ul li a:hover span {
    border-bottom:1px solid #000;
}
.all-finder-layer .finder-body .search-auto-complete-list .search-list-close {
    display:block;
    padding:10px 11px;
    text-align:right;
    color:#999;
    font-size:11px;
}
.all-finder-layer .finder-body .finder-search-data .finder-options {
    border:1px solid #e5e5e5;
    box-shadow:none;
}
.all-finder-layer .finder-body .finder-search-data .finder-options .fa-close {
    margin-left:10px;
    color: #999;
}


/*검색 팝업*/
.popup-wrap {
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    display:none;
    /* 초기 숨김 */
    z-index:9999;
}
.popup-bg {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background: rgba(0,0,0,0.5);
    /* 검정 빈 공간 */
}
.popup-layer {
    position:absolute;
    top:0;
    right:0;
    width:100%;
    height:100%;
    background:#fff;
    /* 팝업 본체 흰색 */
    box-shadow:-2px 0 10px rgba(0,0,0,0.3);
}
.popup-close-btn {
    position:absolute;
    top:24px;
    right:24px;
    background:none;
    border:none;
    font-size:20px;
    cursor:pointer;
}
.searchArea {
    padding:80px 24px;
}
.searchArea .search {
    position:relative;
    height:48px;
    line-height:48px;
    border-bottom:1px solid #5F4541;
}
.searchArea .search input {
    width:342px;
    height:44px;
    line-height:44px;
    border:0;
    font-size:16px;
    color:#999;
    font-weight:400;
}
.searchArea .search a {
    position:absolute;
    bottom:13px;
    right:0;
    width:21px;
    height:21px;
}
.keyword {
    margin-top:60px;
}
.keyword h3 {
    font-size:18px;
    font-weight:600;
    color:#5F4541;
}
.keyword ul {
    margin-top:24px;
    display:grid;
    grid-template-columns:1fr 1fr;
}
.keyword ul li {
    margin-bottom:16px;
}
.keyword ul li:nth-child(1) {
    grid-column:1;
    grid-row:1;
}
.keyword ul li:nth-child(2) {
    grid-column:1;
    grid-row:2;
}
.keyword ul li:nth-child(3) {
    grid-column:1;
    grid-row:3;
}
.keyword ul li:nth-child(4) {
    grid-column:1;
    grid-row:4;
}
.keyword ul li:nth-child(5) {
    grid-column:1;
    grid-row:5;
}
.keyword ul li:nth-child(6) {
    grid-column:2;
    grid-row:1;
}
.keyword ul li:nth-child(7) {
    grid-column:2;
    grid-row:2;
}
.keyword ul li:nth-child(8) {
    grid-column:2;
    grid-row:3;
}
.keyword ul li:nth-child(9) {
    grid-column:2;
    grid-row:4;
}
.keyword ul li:nth-child(10) {
    grid-column:2;
    grid-row:5;
}
.keyword ul li a {
    font-size:14px;
    font-weight:400;
    color:#656565
}
.keyword ul li:nth-child(1) a,.keyword ul li:nth-child(2) a,.keyword ul li:nth-child(3) a {
    font-weight:600;
    color:#5F4541
}
.keyword ul li a em {
    font-weight:400;
    color:#5F4541;
    margin-right:10px;
    width:15px;
    display: inline-block;
}



/*햄버거메뉴*/
.ham-wrap {
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    display:none;
    /* 초기 숨김 */
    z-index:9999;
}
.ham-open-btn{
    position: absolute;
    left: 16px;
    top: 16px;
}

.ham-bg {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background: rgba(0,0,0,0.5);
    /* 검정 빈 공간 */
}
.ham-layer {
    overflow: auto;
    position:absolute;
    top:0;
    right:0;
    width:100%;
    height:100%;
    background:#F6F4F3;
}
.ham-layer .ham-content{
}

.ham-layer .ham-content .logonoff{
    margin: 24px;
}

.ham-layer .ham-content .logonoff a{
    font-size: 14px;
    font-weight: 400;
    color: #5F4541;
}

.ham-layer .ham-content .logonoff > a{}
.ham-layer .ham-content .logonoff > a:nth-child(1){padding-right:20px;position:relative;}
.ham-layer .ham-content .logonoff > a:nth-child(1)::after{content:"";height:12px; width:1px; position:absolute; right:0; top: 3px; background: #E1D9D7;}
.ham-layer .ham-content .logonoff > a:nth-child(2){padding-left:20px;}

.ham-layer .ham-content .logonoff a img{
    vertical-align: middle;
    margin-right: 4px;
    margin-top: -2px;
}

.ham-close-btn {
    position:absolute;
    top:24px;
    right:24px;
    background:none;
    border:none;
    font-size:20px;
    cursor:pointer;
}

.popup-close-btn img,
.ham-close-btn img{display:block !important}

.ham-wrap .headerGnb {
    padding: 0 24px;
}

.ham-wrap .headerGnb .gnbInner {
}

.ham-wrap .headerGnb .gnbInner >ul {
}

.ham-wrap .headerGnb .gnbInner >ul >li {
}

.ham-wrap .headerGnb .gnbInner >ul >li > a {
    font-size: 16px;
    color: #5F4541;
    font-weight: 500;
    font-family: var(--base-font);
    display: inline-block;
    width: 100%;
    padding: 14px 0;
    position: relative;
}


.ham-wrap .headerGnb .gnbInner >ul >li > a.sub::after{content: "";
    background: url(//skin.makeshop.co.kr/skin/fortnight/pc/img/toggle_arrow.png) no-repeat right center;
    transition: transform 0.3s;
    font-size: inherit;
    width: 14px;
    height: 8px;
    display: inline-block;
    float: right;
    position: absolute;
    right: 0;
    top: 15px;
}

.ham-wrap .headerGnb .gnbInner >ul >li > a.sub.active::after{
    transform: rotate(180deg);
}


.ham-wrap .headerGnb .gnbInner >ul >li .submenu {
    display: none;
}

.ham-wrap .headerGnb .gnbInner >ul >li .submenu > ul{

}


.ham-wrap .headerGnb .gnbInner >ul >li .submenu > ul > li{
    font-size: 15px;
    color: #656565;
    font-weight: 400;
    padding: 1px;

}

.ham-wrap .headerGnb .gnbInner >ul >li .submenu > ul > li > a{
    font-size: 15px;
    color: #656565;
    font-weight: 400;
    padding: 10px 0;
    display: block;
}
/* BASIC css end */