
:root{
    --bg-color : #f3f0eb;
    --logo-red:#F09191;
    --logo-yellow:#F8EAAB;
    --logo-blue:#ABD4F2;
    --gray-color:#a69688;
    --lightgray-color:#f3f0eb;
    --main-color:#d4cabe;
    --lightbrown-color:#a69688;
}
.gnb-menu-box{margin-bottom:0px;}

a{ text-decoration: none; color: #333;}
ul{padding-left: 0;margin-bottom: 0}
dd{margin-bottom:0 }
hr{margin-block-start: 0.25em;margin-block-end: 0.25em;}
/* zs custom css */
.zs-cp
,.zs_cp {cursor: pointer}

.form-control[readonly]{ background-color: #eee; }

/**/
.offcanvas{width: 300px!important; }
.offcanvas-body{padding-top: 0;}

/*버튼*/
.btn.btn-xs{font-size: 0.875rem !important;padding-bottom: 0.125rem!important;padding-top: 0.25rem!important;padding-left: 0.5rem!important;padding-right: 0.5rem!important;}

/* 사이즈 설정 */
.canvas-header {max-width:var(--main-width);margin: 0 auto;}
main.main-ctgr {max-width:var(--main-width);margin: 0 auto;}
.location-title {max-width:var(--main-width);margin: 0 auto;}

/* main color checkbox set */
.main-checkbox {display: flex;align-items: center;gap: .5rem;}
.main-checkbox .round { position: relative; }
.main-checkbox .round label { background-color: #fff; border: 1px solid #ccc; border-radius: 50%; cursor: pointer; height: 28px; width: 28px; display: block; }
.main-checkbox.sm .round label { height: 24px; width: 24px; }
.main-checkbox.lg .round label { height: 32px; width: 32px; }
.main-checkbox .round label:after {  border: 2px solid #fff; border-top: none; border-right: none; content: ""; height: 6px; left: 8px; opacity: 0; position: absolute; top: 9px; transform: rotate(-45deg); width: 12px; }
.main-checkbox.sm .round label:after {  height: 5px; left: 7px; opacity: 0; top: 8px; width: 10px; }
.main-checkbox.lg .round label:after {  height: 8px; left: 9px; opacity: 0; top: 10px; width: 14px; }
.main-checkbox .round input[type="checkbox"] { visibility: hidden; display: none; opacity: 0; }
.main-checkbox .round input[type="checkbox"]:checked + label { background-color: #a69688; border-color: #a69688; }
.main-checkbox .round input[type="checkbox"]:checked + label:after { opacity: 1; }

/* main color checkbox set */
.main-checkbox-ol {display: flex;align-items: center;gap: .5rem;}
.main-checkbox-ol .square { position: relative; }
.main-checkbox-ol .square label { background-color: #fff; border: 1px solid #ccc; border-radius: 3px; cursor: pointer; height: 28px; width: 28px; display: block; }
.main-checkbox-ol.sm .square label { height: 24px; width: 24px; }
.main-checkbox-ol.lg .square label { height: 32px; width: 32px; }
.main-checkbox-ol .square label:after {  border: 2px solid #a69688; border-top: none; border-right: none; content: ""; height: 6px; left: 8px; opacity: 0; position: absolute; top: 9px; transform: rotate(-45deg); width: 12px; }
.main-checkbox-ol.sm .square label:after {  height: 5px; left: 7px; opacity: 0; top: 8px; width: 10px; }
.main-checkbox-ol.lg .square label:after {  height: 8px; left: 9px; opacity: 0; top: 10px; width: 14px; }
.main-checkbox-ol .square input[type="radio"] { visibility: hidden; display: none; opacity: 0; }
.main-checkbox-ol .square input[type="radio"]:checked + label { background-color: #fff; border-color: #a69688; }
.main-checkbox-ol .square input[type="radio"]:checked + label:after { opacity: 1; }
/* add font size */
.fs-7 {font-size: .85rem}
/* add btn style by bootstrap */

.btn-black {
    border-radius: 0!important;
    --bs-btn-color: #fff;
    --bs-btn-bg: #211714;
    --bs-btn-border-color: #211714;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #231815;
    --bs-btn-hover-border-color: #231815;
    --bs-btn-focus-shadow-rgb: 0, 0, 0;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #211714;
    --bs-btn-active-border-color: #211714;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #231815;
    --bs-btn-disabled-border-color: #231815;
}

.btn-new {
    background: #7c7066;
    color:#fff;
}

.btn-new:hover {
    background:#7c7066;
    color:#eee;
}

.btn-normal {
    background: #eee;
    color:#333;
    margin-right:10px;
}

.btn-normal:hover {
    background:#eee;
    color:#222;
}

.btn-lightgray-outline {
    --bs-btn-color: #333;
    --bs-btn-bg: #fff;
    --bs-btn-border-color: #f3f0eb;
    --bs-btn-hover-color: #333;
    --bs-btn-hover-bg: #fff;
    --bs-btn-hover-border-color: #f3f0eb;
    --bs-btn-focus-shadow-rgb: 0, 0, 0;
    --bs-btn-active-color: #333;
    --bs-btn-active-bg: #fff;
    --bs-btn-active-border-color: #f3f0eb;
    --bs-btn-active-shadow: none;/*inset 0 3px 5px rgba(243,240,235, 0.125);*/
    --bs-btn-disabled-color: #333;
    --bs-btn-disabled-bg: #fff;
    --bs-btn-disabled-border-color: #f3f0eb;
}
.btn-gray {
    --bs-btn-color: #333;
    --bs-btn-bg: #d4cabe;
    --bs-btn-border-color: #d4cabe;
    --bs-btn-hover-color: #333;
    --bs-btn-hover-bg: #a69688;
    --bs-btn-hover-border-color: #a69688;
    --bs-btn-focus-shadow-rgb: 0, 0, 0;
    --bs-btn-active-color: #333;
    --bs-btn-active-bg: #d4cabe;
    --bs-btn-active-border-color: #d4cabe;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(212,202,190, 0.125);
    --bs-btn-disabled-color: #333;
    --bs-btn-disabled-bg: #d4cabe;
    --bs-btn-disabled-border-color: #d4cabe;
    border-radius: 0;
}

.btn-lightgray {
    --bs-btn-color: #333;
    --bs-btn-bg: #f3f0eb;
    --bs-btn-border-color: #f3f0eb;
    --bs-btn-hover-color: #333;
    --bs-btn-hover-bg: #d4cabe;
    --bs-btn-hover-border-color: #d4cabe;
    --bs-btn-focus-shadow-rgb: 0, 0, 0;
    --bs-btn-active-color: #333;
    --bs-btn-active-bg: #f3f0eb;
    --bs-btn-active-border-color: #f3f0eb;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(212,202,190, 0.125);
    --bs-btn-disabled-color: #333;
    --bs-btn-disabled-bg: #f3f0eb;
    --bs-btn-disabled-border-color: #f3f0eb;
    border-radius: 0;
}

/*이미지 사이즈비율*/
.ratio-P{aspect-ratio: 61/86} /*세로*/
.ratio-L{aspect-ratio: 61/43} /*가로*/
.ratio-S{aspect-ratio: 1} /*정*/

@media (min-width: 992px) {
    .ratio-P{aspect-ratio: 53/75} /*세로*/
    .ratio-L{aspect-ratio: 106/75} /*가로*/
    .ratio-S{aspect-ratio: 1} /*정*/
}
/* form-control override by bootstrap */
.form-control:focus {border-color: #f3f0eb;box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(243,240,235, 0.6);}
.offcanvas{color:#333;}
.bg-main{background-color: var(--main-color) !important;}
/* pagination override */
.page-item:first-child .page-link
,.page-item:last-child .page-link{border-radius: 0;}
.page-link{color:#333;}
.active>.page-link, .page-link.active{background-color: var(--lightbrown-color);border-color: var(--lightbrown-color);}


/* section 1 character set */
section.sec1:before {content: "";background: url(/img/char3.png) no-repeat;width: 70px;height: 70px;background-size: contain; position: absolute;top: 200px;left: 20px;}
/* 메인 로고 */
section.sec1 .main-p-logo-wrap {margin: 2rem 0 3rem 0;text-align: center}
section.sec1 .main-p-logo-wrap > img {width: 80%}
/* description */
section.sec1 .main-p-desc-wrap > h1{font-size: 1.5rem}
section.sec1 .main-p-desc-wrap > p{font-size: 1rem;text-align: center}
/*버튼 영역*/
section.sec1 .main-p-btn-wrap a[role=button]{width: 60%}

section.sec2 h1 img,
section.sec3 h1 img{ display: inline-block; }
section.sec3 .category-warp {gap: 3rem}
section.sec3 .category-warp .category-list{gap: 3rem}
section.sec3 .go-template-wrap{display: none}
/* def LG */
@media (min-width: 992px) {
    section.sec2 h1 img,
    section.sec3 h1 img{ display: none; }
    /* section 1 character set */
    section.sec1:before {content: "";background: url(/img/char1.png) no-repeat;width: 121px;height: 110px;background-size: contain; position: absolute;top: 70px;left: 150px;}
    section.sec1:after {content: "";background: url(/img/char2.png) no-repeat;width: 93px;height: 115px;background-size: contain;position: absolute;top: 240px;right: 150px;}
    /* 메인 로고 */
    section.sec1 .main-p-logo-wrap {margin: 8rem 0 6rem 0;}
    section.sec1 .main-p-logo-wrap > img {width: 820px}
    /* description */
    section.sec1 .main-p-desc-wrap > h1{font-size: 3.5rem}
    section.sec1 .main-p-desc-wrap > p{font-size: 2rem}

    /*버튼 영역*/
    section.sec1 .main-p-btn-wrap {height: 350px;}
    section.sec1 .main-p-btn-wrap a[role=button]{width: auto;}

    section.sec3 .category-warp {gap: 3.25rem;height: 900px}
    section.sec3 .category-warp .category-list{width: 45%;gap: 5rem}
    section.sec3 .go-template-wrap{display: block;margin-bottom: 8rem}
}

section.sec1 .main-p-btn-wrap a.main-p-char3{top: 50%;width: 151px;z-index: 9}
section.sec1 .main-p-btn-wrap a.main-p-char3 > img{width: 150px;}

section.sec2 { background-color: var(--bg-color);}
section.sec2 .recommand-tempalte-wrap{min-height:  1700px;}
section.sec2 .recommand-tempalte-wrap .template-list{width:25%;}
section.sec2 .recommand-tempalte-wrap .main-p-char1 a{top: 50%;width: 151px;}
section.sec2 .recommand-tempalte-wrap .main-p-char1 a img {width: 160px;}

section.sec3 .category-warp .category-list div a.category-img-warp {width: 250px;height: 250px;background-color: var(--bg-color);border-radius: 10px;}
section.sec3 .category-warp .main-p-char2 a{top: 50%;width: 151px;}
section.sec3 .category-warp .main-p-char2 a img{width: 100px;}
section.sec3 .go-template-wrap img{width: 100px;}
section.sec3 .go-template-wrap img:last-of-type{transform: scale(-1, 1);}
section.sec3 .go-template-wrap img a{border-radius: 0;padding: 1.25rem 2rem;}

/* common - swiper style */
.swiper { width: 100%; height: auto;}
.swiper-slide {text-align: center;font-size: 18px;background: #fff;display: flex;justify-content: center;align-items: center;height: auto !important;}
.swiper-slide img {display: block;object-fit: cover;width: 100%;height: 100%;}
.swiper-wrapper{transition-timing-function : linear!important;min-height: 100%;}

.swiper-slide.L{ width: 244px!important;height: 172px!important; }
.swiper-slide.P{ width: 122px!important;height: 172px!important; }
.swiper-slide.S{ width: 172px!important;height: 172px!important; }

.header-search > div > div {width: 90%;}

.header-category-wrap{margin-top: 4rem;margin-top:20px;}
.header-category {border-bottom:2px solid #ddd;}
.header-category li {width:12%;text-align: center;position: relative;}
.header-category li + li {margin-left:6%;}


.header-category li a{ font-size: .925rem;height:30px;display:inline-flex;align-items: center;justify-content: center;color:#333;margin-bottom:-1.5px;}
.header-category li:hover a {color: var(--color-point);font-weight:bold;}



.header-category li.active a {
    color:var(--color-point);
    font-weight:bold;
    border-bottom:solid 2px var(--color-point);
}
@media (min-width: 992px) {
    .header-search > div > div {width: 100%;}
    .header-search  .search-text-input{font-size: .9rem;}


}
@media (max-width:800px){
    .header-category li {width:20%;}
}


.header-search ::placeholder {text-align: center;}
/* or, for legacy browsers */
.header-search ::-webkit-input-placeholder {text-align: center;}
.header-search :-moz-placeholder { /* Firefox 18- */text-align: center;}
.header-search ::-moz-placeholder {  /* Firefox 19+ */text-align: center;}
.header-search :-ms-input-placeholder {text-align: center;}
.header-search .dropdown-item:active{background-color: inherit;color: #676767;border-left: none;}
.header-search .search-text-input::placeholder{  color: #676767; }
.header-search .search-text-input::-webkit-input-placeholder { color: #676767;font-size: .9rem;text-align: left }
@media (min-width: 992px) {
    .header-search .search-text-input::-webkit-input-placeholder { color: #676767;font-size: inherit;text-align: center }
}
.header-search .search-text-input:-moz-placeholder { color: #676767; } /* Firefox 18- */
.header-search .search-text-input::-moz-placeholder {  color: #676767; } /* Firefox 19+ */
.header-search .search-text-input:-ms-input-placeholder { color: #676767; }
.header-search .dropdown-toggle:before{content: "";height: 50%;width: 1px; position: absolute;right: 0;top: 25%; border-right: 1px solid #f3f0eb;}

/* main */
main .contents-category-wrap {background-color:#fff;margin:0px auto 0 auto;}
main .contents-category-wrap .contents-category{overflow-x: scroll;}
main .contents-category-wrap .contents-category li {width: auto;transition: background-color .25s;line-height:28px;border:solid 1px #ccc;border-top:none;}
main .contents-category-wrap .contents-category li + li {border-left:none;}
main .contents-category-wrap .contents-category li a {min-width: 90px;font-size:14px;}

main .contents-category-wrap .contents-category li.active{background-color:var(--color-primary);transition: background-color .25s;}
main .contents-category-wrap .contents-category li.active a {color:#333;}

main .contents-category-wrap .contents-category{width:1560px;overflow-x: auto;}
main .contents-category-wrap .contents-category li{width: 8.3333%}


main{margin: 6rem 0 8rem 0;}
main.main-ctgr{margin-top: 0;}

.contents-lists .grid > .grid-items { margin-bottom: 10px; background-color: #f5f5f5;border-radius: 10px;overflow: hidden; width: calc(19.6% - 20px);}
@media (max-width:1400px) {
    .contents-lists .grid > .grid-items{width: calc(18.8% - 20px);}
}

@media (max-width:1400px) {
    .contents-lists .grid > .grid-items{width: calc(25% - 10px);}
}
@media (max-width:800px) {.contents-lists .grid > .grid-items{width: calc(50% - 10px);} }

.contents-lists .grid > .grid-items:hover { transition:all .1s; }
.contents-lists .grid > .grid-items > a { display: inline-block; width: 100%; text-align: center;padding: .5rem; box-sizing: border-box;}
@media (min-width: 992px) {padding: 1rem;}
.contents-lists .grid > .grid-items > a > img { width: 100%; border-radius: 10px; }
.contents-lists .grid > .grid-items:hover > a > img {transform: scale(1.03); transition: all .5s}

.grid-items a > span{
    text-align: left;color:#fff; padding: .25rem .5rem ; bottom: -32px;left:0;width: 100%;
    background-color: rgba(0,0,0,0.5);display: inline-block; border-bottom-right-radius: 15px;
    border-bottom-left-radius:10px;transition: all .25s;box-sizing: border-box; font-size: 14px;
}
.grid-items:hover a > span{
    bottom: 0;
    transition: all .25s;
}


.category-header-menu{
    margin-top: 4rem;
}
@media (min-width: 576px) {
    .category-header-menu{
        margin-top: 0;
    }
}

/* 이용약관/개인저보처리 */
.common-text {display: flex;flex-direction: column;gap:1.25rem;font-size: 1.1rem}
.common-text p {font-size: 1.25rem;}
.common-text .col-12 {margin-bottom: 1rem; }
.common-text .col-12 p {margin-bottom: .25rem;padding-left: 1rem; }
.common-text .col-12 ol
, .common-text .col-12 ol ul {display: flex;flex-direction: column;gap: .25rem;_margin-left: 1rem;}
.common-text .col-12 ol ul {margin-top: .25rem;padding-left: 40px;}
.common-text ol > li {list-style-type: decimal;color:#444;}
.common-text ul > li {list-style-type: disc;color:#444;}

/* 결제 페이지 */
.payment-noti { border-radius: 10px; }
.payment-noti dl{ display: flex; flex-direction: column;}
.payment-noti dl dt{width: 100%; margin-right: 2rem;display: flex;justify-content: start; }
.payment-noti dl dt span {background-color: #ffe1e3;display: flex;justify-content: start;width: 200px;padding: .25rem 1rem;border-radius: 5px;}
.payment-noti dl dd{width: 100%;display: flex;align-items: center;height: 100%;padding: .25rem 0;margin: 0}
@media (min-width: 576px) {
    .payment-noti dl{ flex-direction: row; margin-bottom: 1rem}
    .payment-noti dl dt {justify-content: end;margin-bottom: .25rem;}
    .payment-noti dl dt
    ,   .payment-noti dl dd{ width: 50%; }
}

.payment-border-wrap {border-radius: 10px;padding: 1rem ;border-width: 2px!important;}
@media (min-width: 576px) {
    .payment-border-wrap {padding: 3rem 6rem;}
}
ul.payment-agree li{list-style-type: disc;margin-left: 20px;}

.payment-method-wrap {width: 100%;}
.payment-method-wrap img {max-width: 200px;width: 100%;}
.payment-method-wrap li {border: 1px solid #d4cabe;color: #d4cabe;padding: 1rem;gap:2rem;justify-content: center}
.payment-method-wrap li.active{border-color:#a69688;color:#a69688;}
.payment-method-wrap li div{display: flex;flex-direction: column;justify-content: center;cursor: pointer}
.payment-method-wrap li div i {font-size: 4rem;text-align: center;}
.payment-method-wrap li div span {font-weight: bold;text-align: center;}
.payment-method-wrap  .payment-method-desc {font-size: 1.2rem}

@media (min-width: 992px) {
    .payment-method-wrap li.payment-method {
        width: 20%;
    }
    .payment-method-wrap li.payment-method .icon-wrap i{
        font-size: 100px;
    }
    .payment-method-wrap li.payment-method {height: 220px;padding: 0;gap:0;justify-content: start}
    .payment-method-wrap li div{
        min-height: 150px;
    }
}
.won-sign-icon-wrap {border: 4px solid #bbb;border-radius: 100%; height: 70px; width: 70px; display: flex;align-items: center;justify-content: center;}
.won-sign-icon-wrap i {color: #ddd;}
.event-noti {font-size: .85rem;letter-spacing: -.2px}
@media (min-width: 992px) {
    .event-noti {font-size: 1rem;letter-spacing: 0}
}
.org-amount:after{content: "";height: 2px;background-color: var(--logo-red);width:100%;top: 10px;left: 0;position: absolute;} /*취소선*/

.tr_code_input-wrap {width: 100%;}
@media (min-width: 992px) {
    .tr_code_input-wrap {width: 50%;}
}




/* 결제완료 페이지*/
.payment-complete-info dl{width: 100%;}
.payment-complete-info dl dt {width: 80px;color: #999;}
.payment-complete-info dl dd {font-weight: bold}

/* 마이페이지 */
.my-info-tap li.active { background-color: #f3f0eb; }

table.payment-history thead tr{ border-top-width: 2px!important; }
table.payment-history thead th
, table.payment-history tbody td{padding: .5rem;text-align: center }

/* 회원 수정 */
.userForm {display: flex;flex-direction: column;gap: 2rem;}
.userForm label {font-weight: bold}
.userForm label.require:after { content: "*" ; color: var(--logo-red); margin-left: .25rem; }

/* my보관함 */
.grid-items .moreAct {z-index:100; right: 0; width: 30px;height: 30px;border-radius: 100%;margin: 0 .5rem .5rem 0}
.grid-items .moreList {bottom: -100px;right:0; z-index: 101}
.grid-items .moreList li{background-color: #fff;border: 1px solid #ccc;border-top: none;padding: .25rem 1rem; }
.grid-items .moreList li:first-child{border-top: 1px solid #ccc;}
.grid-items .moreList li:hover{background-color: #f8f8f8;}
.grid-items .figure-caption span{position: relative;padding: .25rem;white-space: pre;margin-right: 1.5rem; overflow-x: hidden;width: 100%;}
.grid-items .figure-caption span:focus{outline: none; border-bottom: 1px dashed #333!important;}
.grid-items .figure-caption span:hover{border-bottom: 1px dashed #333!important;}
.grid-items .figure-caption i {top: .5rem;right: .25rem}

/* 내 정보 > 결제내역 */
.history-list-wrap { width: calc(100dvw - 1rem);overflow-x: scroll;box-sizing: content-box; }
.history-list-wrap table{ min-width: 1200px; }
@media (min-width: 576px) {
    .history-list-wrap { width: auto;overflow-x: inherit; }
    .history-list-wrap table{ min-width: auto; }
}

.callout {padding: 20px;margin: 20px 0;border: 1px solid #eee;border-left-width: 5px;border-radius: 3px;
    h4 { margin-top: 0; margin-bottom: 5px; }
    p:last-child { margin-bottom: 0;}
    code { border-radius: 3px;}
    & + .bs-callout { margin-top: -5px;}
}
.callout-default {border-left-color: #777;
    h4 { color: #777;}
}
.callout-primary {border-left-color: #428bca;
    h4 { color: #428bca;}
}
.callout-success {border-left-color: #5cb85c;
    h4 { color: #5cb85c;}
}
.callout-danger {border-left-color: #d9534f;
    h4 { color: #d9534f;}
}
.callout-warning {border-left-color: #f0ad4e;
    h4 { color: #f0ad4e;}
}
.callout-info {border-left-color: #5bc0de;
    h4 { color: #5bc0de;}
}


/* 바깥 컨테이너 중앙 고정 및 최대폭 */
.header-bar {
    margin: 0 auto;
    gap: 24px;              /* 좌/중앙/우 간격 */
    padding:10px;
}

/* 3열 배치: 좌/가운데/우 */
.header-left,
.header-right { flex: 0 0 auto; }

.header-search {
    flex: 1 1 auto;         /* 남는 공간 모두 차지 */
    display: flex;
    justify-content: center;
}

/* 검색박스 최소폭(원하면 조정) */
.search-box-canvas { max-width: 560px;border:solid 1px #7c7066; }

/* 카테고리 버튼/인풋 테두리 통일 */
.btn-cat {
    min-width: 111px;
    border-radius: 0;
}
.cat-text { display: inline-block; min-width: 80%; text-align: center; }
.cat-menu { border-color: #f3f0eb; }

/* 인풋 스타일 */
.search-text-input {
    border-radius: 0;
}

/* 돋보기 아이콘 중앙 정렬 */
.icon-magnifying {
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
    color: #7c7066;
}

/* 상단 바 테두리 */
.header-top { border-color: #f3f0eb !important; }

.main-title {margin-top:40px;position:relative;}
.main-title .btn-my {position:absolute;right:0px;}

.location-title {display:flex;align-items: center;margin:0 auto;height:46px;margin-top:20px;border-bottom:2px solid #555;}
.location-title .left strong {font-size:25px;font-weight:bold;}
.location-title .right {font-size:13px;margin-left:auto;display:flex;align-items: center;justify-content: center;}

.search-cont {width:100%;display:flex;padding-bottom:10px;border-bottom:solid 1px #ccc;margin-top:50px;}
.search-cont .left {display:inline-flex;align-items:end;}
.search-cont .right {margin-left:auto;display:inline-flex;align-items:end;}

.search-wrap-canvas {width:300px;height:42px;box-sizing:border-box;position:relative;}
.search-wrap-canvas input[type=text] {border:none;width:100%;height:100%;box-sizing:border-box;border:solid 1px #ccc;padding-left:14px;border-radius:40px;font-size:14px;}
.search-wrap-canvas input[type=text] {
    outline: none; /* 브라우저 기본 포커스 표시 제거 */
}
.search-wrap-canvas .btn-search-canvas {position:absolute;color:#3E5FAC;top:20px;right:10px;}
.search-wrap-canvas .btn-search-canvas i {color:#ccc;}

.category-sub-title {font-size:18px;font-weight:bold;}
.justified-gallery a {border:solid 1px #ddd;border-radius:10px;}
.paid-mark {width:35px !important;height:auto !important; top:5px;right:5px;position:absolute;}
.btn-more {background:#f9f9f9;color:#333;padding:5px 10px;border-radius:10px;font-size:13px;}
.btn-more:hover {font-weight:bold;}

.btn-back {position:absolute;top:-30px;left:0px;background:#f9f9f9;color:#333;padding:8px 13px;border-radius:10px;font-size:15px;margin-bottom:20px;}

.main-btns {width:100%;display:flex;align-items: center;justify-content: center;gap:10px;margin-top:50px;}
.main-btns a {display:inline-flex;align-items: center;justify-content: center;padding:13px 25px;border-radius:10px;font-size:18px;box-sizing:border-box;width:180px;}
.main-btns a.btn-main-edit {background:#c0dff8;}
.main-btns a:hover {font-weight:bold;}
.main-btns a.btn-main-template {background:#f5f5f5;}

.btn-top {position:fixed;bottom:10px;left:50%;margin-left:540px;z-index:99;display:none;cursor:pointer;}
.btn-top.show {display:block;}