@charset "utf-8";

@import url(fontface.css);
/* @import "/scss/bootstrap.scss"; */
/* root Values */

@font-face {
    font-family: "ONE Mobile Title";
    src: url("/assets/fonts/ONE Mobile Title/ONE Mobile Title.ttf") format("truetype"), 
    url("/assets/fonts/ONE Mobile Title/ONE Mobile Title OTF.otf") format("opentype");
}
@font-face {
    font-family: "ONE Mobile Regular";
    src: url("/assets/fonts/ONE Mobile Regular/ONE Mobile Regular.ttf") format("truetype"), 
    url("/assets/fonts/ONE Mobile Regular/ONE Mobile OTF Regular.otf") format("opentype");
}
  
:root {
    /* Font family */
    --font-family-oneTitle: "ONE Mobile Title", sans-serif;
    --font-family-oneReqular: "ONE Mobile Regular", sans-serif;
    --font-family-noto: "Noto Sans KR", sans-serif;
    --font-family-nanum: "Nanum Gothic", sans-serif;
  
    /* Color */
    --white-color: #fff;
    --black-color: #000;
    --nav-item-color: #bebebe;
  
    /* padding Size */
    --side-padding: 12px;
  
    /* Font Size */
    --fs-22: 1.375rem;
    --fs-21: 1.313rem;
    --fs-20: 1.25rem;
    --fs-19: 1.1875rem;
    --fs-18: 1.125rem;
    --fs-17: 1.0625rem;
    --fs-16: 1rem;
    --fs-15: 0.9375rem;
    --fs-14: 0.875rem;
    --fs-13: 0.8125rem;
    --fs-12: 0.75rem;
    --fs-11: 0.6875rem;
    --fs-10: 0.625rem;
    --fs-9: 0.5625rem;
    --fs-8: 0.5rem;
  
    --fs-em-22: 1.375em;
    --fs-em-21: 1.313em;
    --fs-em-20: 1.25em;
    --fs-em-19: 1.1875em;
    --fs-em-18: 1.125em;
    --fs-em-17: 1.0625em;
    --fs-em-16: 1em;
    --fs-em-15: 0.9375em;
    --fs-em-14: 0.875em;
    --fs-em-13: 0.8125em;
    --fs-em-12: 0.75em;
    --fs-em-11: 0.6875em;
    --fs-em-10: 0.625em;
    --fs-em-9: 0.5625em;
    --fs-em-8: 0.5em;
}

body,input,select,textarea,td,th,p,div,h1,h2,h3,h4,h5,h6,ul,li,dt,dd,a,form, label,strong,table
{
    /* font-family: 'Noto Sans KR', sans-serif; */
    /* font-family: var(--font-family-noto); */
    font-family: var(--font-family-nanum);    
    font-size: 1rem;
    line-height:1.25; 
    color: #333;
    /* font-weight: 300; */
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
}
body,h1,h2,h3,h4,h5,h6,p,ul,li,dt,dl,a,img, input, table, td, tr, th,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot,
article, aside, canvas, details, embed,figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video
{
    margin:0; 
    padding:0;
    border:0;
    font-size: 100%;
    vertical-align: baseline;
}
div, p {color:inherit;}
a {text-decoration:none; color:#333 !important; display:inline-block;  cursor:pointer;}
a:link, a:visited, a:active {text-decoration:none;}
a img, fieldset, img { border: none; }
ul, ol, dl {list-style:none; margin-bottom: 0 !important; padding-left: 0 !important;}
.ol * { outline: 0 !important; }
img, input, select {border:none; vertical-align:middle;}
em { font-style: normal; }
u {text-decoration:none; border-bottom:1px solid #999; padding-bottom:1px;}
small { font-size: 13px !important; }

.clear { clear: both; }
.clear:after { content: ''; display: table; clear: both; }
.clearfix {zoom:1}
.clearfix:after {clear:both; display:block; content:""; height:0px; visibility:hidden;}
.ellipsis {width:100%; overflow:hidden; text-overflow:ellipsis;white-space:nowrap;}

*, ::after, ::before { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }

html {
    -ms-content-zooming: none;
    -ms-touch-action: pan-x pan-y;

}

/* table 관련 */
table {border-collapse:collapse; border-spacing: 0;}
th, td { border-collapse:collapse; vertical-align:middle;border-spacing: 0; }
caption, legend, .hidden {position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px 1px 1px 1px); clip: rect(1px, 1px, 1px, 1px)}
.table>:not(:first-child) { 
    border-top: 1px solid currentColor !important; 
}

.table.table-borderless>:not(:first-child) { 
    border-top: 1px solid #fff !important;
}

.table .listDescAttaCustomer td,
.table .listDescAttaMall td {
    padding: 0.3rem 0.5rem;
    font-size: var(--fs-13);     
}

/* has(.card__image) */

/* 버튼 관련 */
.btn-list {padding: .375rem 1.25rem !important;}
.btn-list-2 {padding: 0.5rem 1.7rem !important;}
.est-write { /* height: 48px; */ background-color: #231815; border: 0px; }

/* form 관련 */
form, fieldset {display:inline;}
textarea {vertical-align:top; text-align:left; border:none;}
fieldset, blockquote, iframe, button{ border:none; border-radius: 0 !important; }

.form-control { 
    padding: .386rem .75rem !important; 
}

textarea.form-control { 
    padding: .386rem 1.1rem !important; 
}

*:focus { 
    outline: none; 
}


/* bootstrap 기능제어 */
input:not([type='radio'],[type='checkbox']), select, textarea {border-radius: 0px !important;}
/* input.form-check-input {border-radius: 50% !important;} */
input:focus, select:focus, button:focus, textarea:focus, .btn-check:focus+.btn, .btn:focus, .btn:active {
    /* border-color: inherit !important; */
    box-shadow: none !important;
}
.btn { 
    /* line-height: inherit !important; padding: 0.53rem 1.75rem !important; border-radius: 0px !important;  */
}
.btn-box {padding: .375rem .75rem !important;}
.btn-box-2 {padding: .1rem .75rem !important;}

.modal-content {border-radius: .5rem !important;}
.modal-header { 
    padding: 12px !important;
    /* background-color :#0e71b8; */
    background: rgb(89,81,218);
    background: linear-gradient(90deg, rgb(89, 81, 218) 0%, rgb(17, 154, 252) 30%, rgb(66, 182, 205) 100%);    
}

.modal-title { 
    font-size: 1.125rem !important;
    color: #fff;
    /* font-weight: 600;  */
}
.modal-body { padding: 1.5rem 1rem !important; }

#onebutton { display: flex; }
#twobutton { display: none; }
.btnSearch { margin: 1px 0 0 10px !important; padding: 0.45rem 0rem !important; border-radius: 5% !important; }

/* .modal-body { margin: 0 auto; } */
#cartmodal .modal-content {max-width: 400px;text-align: center;}
#cartmodal .modal-body p.cart {font-size: 1.1rem;}
#cartmodal .modal-header {border-bottom: none;}
#cartmodal .modal-footer {justify-content: center;margin: 0 auto;}

/* pagination */
.page-item:first-child .page-link,
.page-item:last-child .page-link { border-radius: 0 !important; }
.page-link { color: #333 !important; }
.page-item .page-link i { font-size: 20px; } 
.page-item.active .page-link { color: #fff !important; }
.active > .page-link, .page-link.active { background-color: #485970 !important; border-color: #525252 !important; }

/* confirm-modal 기능제어 */
.jconfirm-title { font-size: 18px !important; font-weight: 600 !important; }
.jconfirm-content { overflow: hidden !important; min-height: 40px !important; }

/* flex */
.d-fex-s1 {display: flex;flex-direction: row;align-items: center;}
.d-fex-s2 {display: flex;flex-direction: column;}

/* message info */
.message-info p { font-size: 13px !important; }

.cursor { cursor:pointer; }

/* line 관련 */
.lh-1j5 { line-height: 1.5; }
.lh-2 { line-height: 2.0; }
.lh-2E { line-height: 2.397; }
.lh-2j5 { line-height: 2.5; }
.lh-3 { line-height: 3.0; }
.lh-4 { line-height: 4.0; }
.lh-5 { line-height: 5.0; }
.lh-6 { line-height: 6.0; }

.line-top-1 {border-top: 1px solid #cecece;}
.line-top-2 {border-top: 2px solid #cecece;}
.line-top-3 {border-top: 1px solid #262626 !important;}
.line-top-4 {border-top: 1px solid #ddd !important;}
.line-top-5 {border-top: 2px solid #666 !important;}

.line-t1 { border-top: 1px solid !important; }
.line-b1 { border-bottom: 1px solid !important; }
.line-r1 { border-right: 1px solid !important; }

.line-bottom-0 {border-bottom: 1px solid #efefef !important;}
.line-bottom-1 {border-bottom: 1px solid #cecece;}
.line-bottom-2 {border-bottom: 2px solid #cecece;}
.line-bottom-3 {border-bottom: 1px solid #999;}
.line-bottom-4 {border-bottom: 1px solid #ccc !important;}
.line-bottom-5 {border-bottom: 1px solid #333;}

.brd-0 { border: 0px !important;}
.brd-1 { border: 1px solid #ddd !important;}
.brd-4 { border: 4px solid #ddd !important;}
.brd-t0 { border-top: 0px !important;}
.brd-l1 { border-left: 1px solid #ddd !important;}
.brd-r1 { border-right: 1px solid #ddd !important;}

.brd-top-color { border-top-color: #aaa !important; }

/* textarea 관련 */
textarea {resize: none !important;}

/* 기타 관련 */
input::placeholder {color: rgb(195, 195, 195) !important;font-style: normal; font-weight: 300;}
input::-webkit-input-placeholder {font-size: 16px;color: rgb(195, 195, 195) !important;}
input:-ms-input-placeholder {font-size: 16px;color: rgb(195, 195, 195) !important;}

textarea::placeholder {color: rgb(195, 195, 195) !important;font-weight: bold;}
textarea::-webkit-input-placeholder {font-size: 15px;color: rgb(195, 195, 195) !important;}
textarea:-ms-input-placeholder {font-size: 15px;color: rgb(195, 195, 195) !important;}

.b0-radius { border-radius: 0px !important; }
.b5x-radius { border-radius: 5px !important; }
.b50-radius { border-radius: 50% !important; }

/* .title-wrap { margin-top: 80px !important; } */

/* dot list */
.dot-list>li {margin-top: 0.5em;padding-left: 11px;font-size: 14px;line-height: 1.3;}
.dot-list>li:before {content: "\f309";color: #000;display: inline-block;font-family: bootstrap-icons !important;text-transform: none;line-height: 1;vertical-align: -.125rem;/* margin-left: 3px;  */margin-right: 5px;}

.dot-list-2>li {margin: 0 12px; padding-left: 20px;font-size: 14px;line-height: 2;}
.dot-list-2>li:before {content: "\f309";color: #000;display: inline-block;font-family: bootstrap-icons !important;text-transform: none;line-height: 1;vertical-align: -.125rem; margin-right: 10px; margin-left: -20px; }

/* 필수 '*' 표시 */
.essential:after {display: inline-block;content: '*';vertical-align: middle;margin-left: 0.3rem;color: #ff2c2c;}

/* message 관련 */
.message-info p {color: #999;margin-bottom: 5px; margin-left: 20px;}
.message-info p::before {content: "\f33b";color: #999;display: inline-block;font-family: bootstrap-icons !important;text-transform: none;vertical-align: -.125rem;margin-left: -20px; padding-right: 5px;}

/* */
br.break-m { display: none; }

.flex-basis-100 { flex-basis: 100% !important; }

.pd10 { padding: 10px !important }
.pd15 { padding: 15px !important }
.pd20 { padding: 20px !important }

.wd-type-1 { width: 4.5rem !important }
.wd-type-2 { width: 6.9rem !important }
.wd-type-3 { width: 6.1rem !important }
.wd-type-4 { width: 5.6rem !important }

/* 비율 */
.transf15 { transform: scale(1.5); }


/* height */
.ht-38 { height: 38px !important }
.ht-60 { height: 60px !important }
.ht-100 { height: 100px !important }

/* text shadow */
.txt-sdw-1 { text-shadow: 2px 2px 2px gray; }
.txt-sdw-2 { text-shadow: 2px 2px 4px gray; }
.txt-sdw-3 { text-shadow: 2px 2px 6px gray; }

/* color */
.homecolor { color: #ae1948 !important; }
.white { color: #fff !important; }
.red { color: #cd001a !important; }
.blue { color: #0e71b8 !important; }
.cyan { color: #48adaa !important; }
.gray-white { color: #aaaaaa !important; }
.crimson { color: #ed143d !important; }
.deeppink { color: #bf1563 !important; }
.dark333 { color: #333333 !important; }

/* bg color */
.bg-gray { background-color: #f0f0f0 !important; }

/* font size */
.f11 { font-size: var(--fs-11) !important; }
.f12 { font-size: 12px !important; }
.f13 { font-size: 13px !important; }
.f14 { font-size: 14px !important; }
.f15 { font-size: 15px !important; }
.f16 { font-size: var(--fs-16) !important;}
.f17 { font-size: var(--fs-17) !important;}
.f18 { font-size: var(--fs-18) !important;}

.fbold { font-weight: bold !important; }

.vertical-baseline {
    vertical-align: baseline !important;
}

/* ----- simplebar customizing ----- */

/* 스크롤바 색상 */
.simplebar-scrollbar::before {background-color: #bbbbbb;}

/* ----- tooltip ----- */
.tooltip-1 {position: relative;display: inline-block;}
.tooltip-1 .tooltiptext {visibility: hidden;width: 80px;background-color: #555;color: #fff;text-align: center;border-radius: 6px;padding: 5px;position: absolute;z-index: 1;bottom: 150%;left: 50%;margin-left: -42px;opacity: 0;transition: opacity 0.3s;}
.tooltip-1 .tooltiptext::after {content: "";position: absolute;top: 100%;left: 50%;margin-left: -5px;border-width: 5px;border-style: solid;border-color: #555 transparent transparent transparent;}
.tooltip-1:hover .tooltiptext {visibility: visible;opacity: 1;}


/*****************************************************************
  Quick Menu
*****************************************************************/
.quick_floating{position:fixed;top:280px;right:0;opacity:1;transition:0.6s ease-out;}
.quick_floating.hide{right:-143px}
.quick_floating .quick_menu{width:165px;background-color:#ffffff;overflow:hidden;border-width:1px 0px 1px 1px;border-style:solid;border-color:#ededed;border-radius:10px 0 0 10px;box-shadow:0px 7px 14px 0px rgba(0,0,0,0.05)}
.quick_floating .quick_menu>ul{padding: 15px 22px 9px !important;}
.quick_floating .quick_menu>ul>li>a{display:block;position:relative;line-height:1;padding:11px 0 11px 30px;font-size:1rem;color:#4d5256}
.quick_floating .quick_menu>ul>li>a::before{content:'';position:absolute;top:50%;left:0;width:22px;height:22px;margin-top:-10px;background:url("../images/common/icon_quick.png") no-repeat}
.quick_floating .quick_menu>ul>li:nth-child(1)>a::before{background-position:0 0}
.quick_floating .quick_menu>ul>li:nth-child(2)>a::before{background-position:0 -23px}
.quick_floating .quick_menu>ul>li:nth-child(3)>a::before{background-position:0 -45px}
.quick_floating .quick_menu>ul>li:nth-child(4)>a::before{background-position:0 -69px}
.quick_floating .quick_menu>ul>li:nth-child(5)>a::before{background-position:0 -92px}
.quick_floating .quick_menu>ul>li:nth-child(6)>a::before{background-position:0 -117px}
.quick_floating .quick_menu>ul>li:nth-child(7)>a::before{background-position:0 -96px}
.quick_floating .quick_menu .tel{display:block;margin:5px 18px 0;padding:18px 0 20px;border-top:1px solid #ccc;font-size:0.9rem;color:#222;text-align:center}
.quick_floating .quick_menu .tel strong{display:block;margin-top:4px;font-size:0.9rem;font-weight:700;color:#122a88}
.quick_floating button {background-color: #fff;}
.quick_floating .btn_top{display:block;position:relative;width:100%;border:none;text-align:center;opacity:0;transition:0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000);z-index:-1}
.quick_floating .btn_top>span{display:inline-block;position:relative;padding-right:11px;font-size:14px;color:#666}
.quick_floating .btn_top.show{margin-top:5px;opacity:1; background-color: rgba(255,255,255,0);}
.quick_floating .btn_close{position:absolute;top: 135px;left: -39px;width: 40px;height: 48px;padding-bottom: 5px;border-width: 1px 0px 1px 1px; border-style: solid; border-color: #ededed; background-color:rgba(255,255,255,1); border-radius:5px 0 0 5px !important;}
.quick_floating.hidden .btn_close::after{transform:rotate(180deg)}

/* ----------- Etc */
@media (min-width: 1200px) { 
}
@media (min-width: 992px) and (max-width: 1199px) { 
}
@media (min-width: 768px) and (max-width: 991px) { 
    .col-xs-bdt-1 { border-top: 1px solid #ececec !important }
}
@media (min-width: 577px) and (max-width: 767px) { 
    .col-xs-bdt-1 { border-top: 1px solid #ececec !important }
}
@media (max-width: 576px) { 
    .col-xs-bdt-1 { border-top: 1px solid #ececec !important }
    .col-xs-fl-dt-column { flex-direction: column !important }
}