
/* 페이지로딩(공통) */
.PageLoading {position:fixed; left:50%; top:50%; width:200px; height:200px; transform:translate(-50%, -50%); z-index:1002; border-radius:100px; box-shadow:0 0 20px rgba(0,0,0,0.1); display:flex; justify-content:center; align-items:center; flex-direction:column; background-color:#fff; opacity:0.97;}
.PageLoading .load {text-align:center; font-size:12px; font-weight:500; color:#333; display:flex; justify-content:center; align-items:center; flex-direction:column; gap:10px}
.PageLoading .load:before {content:""; width:70px; height:70px; background:#fff url('../images/page_loading.gif') center center no-repeat; background-size:auto 60px; border-radius:100px; display:block;}




/* 사용처 안내 레이어 ======================================== */
.LayerPop {box-sizing:border-box; position:fixed; right:0; top:0; width:100%; height:100%; z-index:1001; box-sizing:border-box; visibility:hidden; display:flex; justify-content:flex-end; align-items:flex-end; flex-direction:column;}
.LayerPop .wrapping {position:relative; z-index:2; background:#fff; width:100%; height:100%; box-sizing:border-box; max-width:450px; transition:all 600ms cubic-bezier(0.19, 1, 0.22, 1); display:flex; justify-content:flex-start; align-items:stretch; flex-direction:column; transform:translateX(100%); overflow: hidden;}
.LayerPop .bg_close {position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:1; opacity:0; pointer-events:none; transition:all 0.3s ease-out;}

.LayerPop.if_open {visibility:visible;}
.LayerPop.if_open .wrapping {transform:translateX(0);}
.LayerPop.if_open .bg_close {opacity:1; pointer-events:auto;}

.LayerPop .GiftCard {flex:1; overflow-y:auto;}






/* 데이터 입력폼 */
.DataForm {flex:1; display:flex; justify-content:stretch; align-items:stretch; flex-direction:column; box-sizing:border-box;}
.DataForm .data_wrap {flex:1; display:flex; justify-content:flex-start; align-items:stretch; flex-direction:row; padding-bottom:15px; overflow:hidden;}
.DataForm .data_wrap .layout_fix {flex:1; display:flex; justify-content:flex-start; align-items:stretch; flex-direction:column; overflow:hidden; background:#fff;}
.DataForm .data_wrap .c_btnbox {flex:none;}

.DataForm .data_list {box-sizing:border-box; border:1px solid #ddd; border-radius:16px; position:relative; flex:1; background:#f5f5f5; display:flex; justify-content:center; align-items:center; flex-direction:column; overflow:hidden;}
.DataForm .data_list .before {padding:15px; color:#999; font-size:14px; font-weight:500; height:100%; display:flex; justify-content:flex-start; align-items:flex-start; flex-direction:column; box-sizing:border-box; position:absolute; left:0; top:0; width:100%; height:100%; pointer-events:none; z-index:2; transition:all 0.2s ease-out; line-height:1.4;}
.DataForm .data_list .before i {font-size:30px; color:#333; margin-bottom:5px; }

.DataForm .with_number_area {display:flex; justify-content:flex-start; align-items:stretch; flex-direction:row-reverse; flex:1; width:100%; align-self:stretch; overflow-y:auto; position:relative;}
.DataForm .line_input_area {display:flex; justify-content:flex-start; align-items:stretch; flex-direction:row-reverse; flex:1; width:100%; align-self:stretch; position:absolute; left:0; top:0; min-height:100%;}
.DataForm .line_number {flex:none; box-sizing:border-box; line-height:30px; font-size:15px; font-weight:500; color:#999; text-align:right; overflow:hidden; white-space:pre; font-variant-numeric:tabular-nums; user-select:none; width:0px; overflow:hidden; transition:all 0.2s ease-out; height:auto; padding:10px 0;}

.DataForm .data_list textarea.text_design {border:0 !important; line-height:30px; padding:10px; transition:all 0.3s ease-out; color:#666; font-size:15px; font-weight:500; font-variant-numeric:tabular-nums; scrollbar-width:auto; letter-spacing:0px; height:auto; overflow: hidden !important; background:#f5f5f5 !important;}
/* .DataForm .data_list textarea.text_design:focus {background-image:repeating-linear-gradient(to bottom, #fff, #fff 25px, #e5e5e5 25px, #e5e5e5 26px) !important; background-origin:content-box !important; background-attachment:local !important;}
.DataForm .data_list textarea.text_design:not(:placeholder-shown) {background-image:repeating-linear-gradient(to bottom, #fff, #fff 25px, #e5e5e5 25px, #e5e5e5 26px) !important; background-origin:content-box !important; background-attachment:local !important;}*/
.DataForm .data_list textarea.text_design:focus + .line_number {width:36px; overflow:visible; padding-right:5px}
.DataForm .data_list textarea.text_design:not(:placeholder-shown) + .line_number {width:40px; overflow:visible; padding-right:5px}
.DataForm .data_list:has(textarea.text_design:focus) .before {opacity:0;}
.DataForm .data_list:has(textarea.text_design:not(:placeholder-shown)) .before {opacity:0;}


.DataForm .data_list .like_table {display:table; width:100%; box-sizing:border-box; border-collapse:separate; border-spacing:0px;}
.DataForm .data_list ul {display:table-row;}
.DataForm .data_list ul.thead {background:#4285F426; border-bottom:0; font-weight:500;}
.DataForm .data_list ul.thead li {padding:10px 0px; color:#666;}
.DataForm .data_list li {padding:8px; color:var(--color-dark); display:table-cell; font-size:13px; font-weight:500; text-align:center; border-bottom:1px solid #4285F433;}
.DataForm .data_list ul+ ul {border-top:1px solid #eee;}
.DataForm .data_list ul:nth-child(odd) {background:#f5f5f5;}
.DataForm .data_list ul:hover {background:color-mix(in srgb, var(--color-blue) 20%, transparent);}
.DataForm .data_list ul.t_cancel {background-color: #fddede;}





/* 인증로그인 ======================================== */
.AuthLogin {width:100%; height:100%; display:flex; justify-content:center; align-items:center; flex-direction:column; flex:1; position:fixed; left:0; top:0; z-index:1000; background:#fff;}
.AuthLogin .layout_fix {width:100%; max-width:350px; }
.AuthLogin .title {display:flex; justify-content:center; align-items:center; flex-direction:column; margin-bottom:20px; font-size:21px; color:#000; font-weight:700;}
.AuthLogin .title img {height:60px}
.AuthLogin .cont_box {}
.AuthLogin .cont_box li {position:relative; display:flex; justify-content:center; align-items:flex-start; flex-direction:column;}
.AuthLogin .cont_box li+ li {margin-top:10px;}
.AuthLogin .cont_box .input {width:100%; border-radius:8px; height:60px; box-sizing:border-box; border:1px solid #e5e5e5; padding:0 20px; font-size:16px; font-weight:500; color:#343B4F; transition:all 0.3s ease-out;}
.AuthLogin .cont_box .input::-webkit-input-placeholder {color:#CACACA;}
.AuthLogin .cont_box .input::input-placeholder {color:#CACACA;}
.AuthLogin .cont_box .input:focus {border-color:var(--color-blue);}
.AuthLogin .cont_box .input:disabled {background:#eee;}
.AuthLogin .cont_box .btn_ctrl {position:absolute; right:12px; display:flex !important; justify-content:center; align-items:center; flex-direction:column; height:32px; padding:0 10px; color:var(--color-blue); font-size:13px; font-weight:500; border:1px solid #4285F426; border-radius:100px; background:#4285F426;}
.AuthLogin .cont_box .timer {position:absolute; right:15px; color:var(--color-coral); pointer-events:none; font-size:14px; font-weight:600;}
.AuthLogin .agree_more {margin-top:5px; color:#666; word-wrap:break-word; word-break:keep-all; white-space:normal; line-height:1.35;}
.AuthLogin .copyright {font-size:12px; color:#aaa;  margin-top:10px; text-align:center;}



/* 슬라이드 메뉴 ======================================== */
.p_Slide {}
.p_Slide .wrapping {position:fixed; left:0; top:0; width:100%; max-width:375px; height:100%; background:#F6F8FB; overflow-y:auto; transform:translateX(-100%); box-sizing:border-box; transition:all 0.2s ease-out;  z-index:400; -ms-overflow-style:none; scrollbar-width:none; display:flex; justify-content:center; align-items:stretch; flex-direction:column;}
.p_Slide .slide_bg {position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:399; opacity:0; filter:alpha(opacity=0); -ms-filter:alpha(opacity=0); visibility:hidden; transition:opacity 0.2s ease-out;}
.p_Slide .top_area {padding:0 20px; display:flex; justify-content:space-between; align-items:stretch; flex-direction:row; height:70px; box-sizing:border-box; padding-top:10px;}
.p_Slide .top_area .btn_close {font-size:22px; color:#000; padding:5px; box-sizing:border-box; display:flex; justify-content:center; align-items:center; flex-direction:column; gap:3px; height:30px;}

.p_Slide .menu_list {padding:0 20px 30px; flex:1; display:flex; justify-content:flex-start; align-items:stretch; flex-direction:column; gap:20px;}
.p_Slide .menu_list .myinfo {background:#fff; border-radius:22px; padding:20px 16px; box-sizing:border-box; display:flex; justify-content:flex-start; align-items:stretch; flex-direction:column; gap:20px; box-shadow:0 14px 34px rgba(31,44,61,0.08);}
.p_Slide .menu_list .myinfo .tit {color:#172230; font-weight:700; font-size:18px; line-height:22px;}
.p_Slide .menu_list .myinfo .account_row {display:flex; justify-content:flex-start; align-items:center; flex-direction:row; gap:13px;}
.p_Slide .menu_list .myinfo .name {flex:1; display:flex; justify-content:flex-start; align-items:flex-start; flex-direction:column; gap:5px;}
.p_Slide .menu_list .myinfo .name strong {font-size:18px; font-weight:700; color:#172230; line-height:22px;}
.p_Slide .menu_list .myinfo .name .phone {font-size:13px; font-weight:500; color:#6B7380; line-height:17px;}
.p_Slide .menu_list .myinfo .btn_logout {flex:none; font-size:16px; color:#4E5968; font-weight:500; display:flex; justify-content:center; align-items:center; flex-direction:column; background:#EEF2F7; border-radius:13px; padding:0 16px; height:42px; box-sizing:border-box;}
.p_Slide .menu_list .menu_nav {background:#fff; border-radius:22px; box-shadow:0 14px 34px rgba(31,44,61,0.08); box-sizing:border-box; padding:10px 16px;}
.p_Slide .menu_list .menu_nav ul {display:flex; justify-content:flex-start; align-items:stretch; flex-direction:column;}
.p_Slide .menu_list .menu_nav li+ li {border-top:1px solid #E7EAF0;}
.p_Slide .menu_list .menu_nav .menu_link {font-size:18px; font-weight:500; color:#4A505A; display:flex; justify-content:flex-start; align-items:center; flex-direction:row; height:66px; gap:15px; transition:all 0.3s ease-out; box-sizing:border-box;}
.p_Slide .menu_list .menu_nav .menu_link strong {flex:1; font-weight:500;}
.p_Slide .menu_list .menu_nav .menu_link .picto {flex:none; width:28px; height:28px; display:flex; justify-content:center; align-items:center; flex-direction:column;}
.p_Slide .menu_list .menu_nav .menu_link .picto img {width:24px; display:block;}
.p_Slide .menu_list .menu_nav .menu_link .arrow {flex:none; display:flex; justify-content:center; align-items:center; flex-direction:column; color:#73807C;}
.p_Slide .menu_list .menu_nav .menu_link .arrow i {font-size:16px;}
.p_Slide .menu_list .biz_info {background:#fff; border-radius:22px; padding:20px 16px; box-sizing:border-box; display:flex; justify-content:flex-start; align-items:stretch; flex-direction:column; gap:12px; box-shadow:0 14px 34px rgba(31,44,61,0.08);}
.p_Slide .menu_list .biz_info .tit {color:#172230; font-weight:700; font-size:18px; line-height:22px;}
.p_Slide .menu_list .biz_info .company_info {font-size:12px; color:#A7ADB3; line-height:1.5; word-break:keep-all;}
.p_Slide .cs_center {margin-top:auto; padding-top:40px; display:flex; justify-content:flex-start; align-items:flex-start; flex-direction:column; gap:8px; padding:30px; }
.p_Slide .cs_center .btn_email {color:var(--color-dark); font-weight:500; font-size:14px; text-decoration:underline; text-underline-offset:4px;}
.p_Slide .cs_center .open_time {font-size:13px; color:#888; line-height:1.4;}
.p_Slide .cs_center .copyright {font-size:13px; color:#aaa;  margin-top:10px;}

.p_Slide.if_open .wrapping {transform:translateX(0);}
.p_Slide.if_open .slide_bg {opacity:1; filter:alpha(opacity=100); -ms-filter:alpha(opacity=100); visibility:visible;}


@media (hover:hover) and (pointer:fine) {
    .p_Slide .menu_list .menu_nav .menu_link:hover {color:var(--color-blue);}
    .p_Slide .menu_list .menu_nav .menu_link:hover .arrow {color:var(--color-blue);}
}
@media screen and (max-width:400px) {
    .p_Slide .wrapping {max-width:100%;}
}



/* 헤더 ======================================== */
.Header {position:sticky; top:0; left:0; backdrop-filter:blur(5px); z-index:20; flex:none; background:#fff; height:80px; padding:20px 0; box-sizing:border-box; box-shadow:0px 2px 2px rgba(0,0,0,0.07); }
.Header .layout_fix {flex:1; display:flex; justify-content:flex-start; align-items:center; flex-direction:row; gap:5px 10px; height:40px;}
.Header .side {display:flex; justify-content:flex-start; align-items:center; flex-direction:row; gap:50px; flex:none; margin-left:auto;}
.Header .site_logo img {display:block; width:92px;}
.Header .point {flex:none; display:flex; justify-content:center; align-items:center; flex-direction:row; gap:8px; background:#F6F5FA; border-radius:100px; height:32px; box-sizing:border-box; padding:0 8px;}
.Header .point strong {font-weight:700; font-size:16px; color:#000;}
.Header .point .picto {width:24px; aspect-ratio:1/1; background:transparent url('../images/point.svg') center center / 100% no-repeat;}
.Header .point:after {content:""; width:16px; height:100%; background:transparent url('../images/icon_right.svg') center center / 7px no-repeat;}
.Header .point.before strong {color:#697482; font-weight:600;}
.Header .logo {width:20px; aspect-ratio:1/1; border-radius:100px; overflow:hidden;}
.Header .logo svg {width:100%; height:100%;}
.Header .btn_slide {width:40px; aspect-ratio:1/1; background:transparent url('../images/top_menu.svg') center center / 32px no-repeat;}

@media screen and (max-width:600px) {
    .Header {box-shadow:none; padding:0px; height:auto;}
    .Header .layout_fix {height:44px;}
    .Header .site_logo {display:none;}
    .Header .side {flex:1; justify-content:space-between;}
    .Header .point {padding:0 5px; gap:5px; height:24px;}
    .Header .point:after {background-size:5px; width:10px;}
    .Header .point .picto {width:16px;}
    .Header .point strong {font-size:12px;}
    .Header .btn_slide {width:24px; background-size:24px;}
}



.Flyfix {position:fixed; right:16px; bottom:16px; display:flex; justify-content:center; align-items:center; flex-direction:column; gap:8px; z-index:1001; transition:all 0.3s ease-out;}
.Flyfix .btn_go {display:flex; justify-content:center; align-items:center; flex-direction:column; width:48px; aspect-ratio:1/1;}
.Flyfix .btn_go img {width:100%;}






/* 목록검색  ======================================== */
.ListSearch {margin:15px 0;  flex:none}
.ListSearch .inner {width:100%; display:flex; flex-direction:row; justify-content:flex-start; align-items:center; flex-wrap:wrap; gap:10px 20px; padding:20px; background:#f5f5f5; border-radius:8px; box-sizing:border-box;}
.ListSearch .find_form {display:flex; justify-content:flex-start; align-items:center; gap:10px; flex-wrap:wrap; flex:1}
.ListSearch .find_form .input_design {height:40px; flex:1}
.ListSearch .find_form .input_design.type_date {width:100px; background-image:none; text-align:center; padding:0;}
.ListSearch .find_form .input_design.search_word {}
.ListSearch .find_form .dash {color:#333; font-weight:600;}
.ListSearch .find_form i {font-size:22px;}
.ListSearch .tieup {display:flex; justify-content:center; align-items:center; flex-direction:row; gap:5px;}
.ListSearch .tieup.word {flex:1; max-width:300px}
.ListSearch .side {flex:none; display:flex; justify-content:flex-end; align-items:center; flex-direction:row; gap:5px;}





/* 목록 컨트롤 ========================================= */
.ListCtrl {flex:none; display:flex; justify-content:space-between; align-items:center; flex-direction:row; gap:10px 20px; font-size:15px; font-weight:500; flex-wrap:wrap; height:60px;}
.ListCtrl .tit {color:#222; font-size:17px; font-weight:700;}
.ListCtrl .btn_reset {display:flex; justify-content:center; align-items:center; flex-direction:row; gap:4px; font-size:13px;}
.ListCtrl .btn_reset .icon_reset {font-size:14px;}
.ListCtrl .btn_reset .icon_reset.if_spin {animation:mv_btn_reset_spin 0.6s ease-out;}
@keyframes mv_btn_reset_spin {
	0% {transform:rotate(0deg);}
	100% {transform:rotate(-360deg);}
}

.ListCtrl .major_area {display:flex; justify-content:flex-start; align-items:center; flex-direction:row; gap:10px;}
.ListCtrl .major_area .title {font-size:18px; font-weight:700; color:var(--color-dark); flex:none}

.ListCtrl .list_menu {position:relative; min-width:250px; flex:none}
.ListCtrl .list_menu .menu {display:flex; justify-content:center; align-items:center; flex-direction:row; height:40px; box-sizing:border-box; font-weight:700; border:1px solid #ccc; padding:0 10px; border-radius:4px; gap:8px; font-size:14px; font-weight:600; color:var(--color-dark);}
.ListCtrl .list_menu .menu strong {flex:1}
.ListCtrl .list_menu .menu i {font-size:20px;}
.ListCtrl .list_menu .menu i.this_arrow {font-size:16px;}
.ListCtrl .list_menu .open_menu {position:absolute; left:0; top:39px; width:100%; z-index:100; background:#f5f5f5; display:none; overflow:hidden;}
.ListCtrl .list_menu .open_menu ul {box-sizing:border-box; border:1px solid #ccc; padding:10px 0;  overflow-y:auto; max-height:350px;}
.ListCtrl .list_menu .open_menu .opt {display:block; color:#333; font-weight:500; padding:6px 15px; font-size:14px;}
.ListCtrl .list_menu .open_menu .opt.hit {color:var(--color-blue) ;}
.ListCtrl .list_menu.if_open .menu {border-bottom-left-radius:0; border-bottom-right-radius:0;}
.ListCtrl .list_menu.if_open .menu i.fi {transform:rotate(-180deg);}
.ListCtrl .list_menu.if_open .open_menu {display:block;}
.ListCtrl .side_area {flex:none; display:flex; justify-content:flex-end; align-items:center; flex-direction:row; flex-wrap:wrap; gap:10px}

.ListCtrl .side_form {flex:1; display:flex; justify-content:flex-end; align-items:flex-end; flex-direction:row; gap:10px; position:relative;}
.ListCtrl .side_form textarea.text_design {height:40px; font-size:14px; line-height:24px; padding:8px 15px; box-sizing:border-box; background-color:#fff; -ms-overflow-style:none; scrollbar-width:none;}
.ListCtrl .side_form textarea.text_design:focus {border-color:#008aff !important; background-color:#fff !important; background-image:repeating-linear-gradient(to bottom, #fff, #fff 23px, #e5e5e5 23px, #e5e5e5 24px) !important; background-origin:content-box !important; background-attachment:local !important; height:150px;}
.ListCtrl .side_form textarea.text_design:not(:placeholder-shown) {border-color:#008aff !important; background-color:#fff !important; background-image:repeating-linear-gradient(to bottom, #fff, #fff 23px, #e5e5e5 23px, #e5e5e5 24px) !important; background-origin:content-box !important; background-attachment:local !important; height:150px; scrollbar-width:auto;}

@media screen and (max-width:600px) {
    .ListCtrl .side_form {flex-direction:column; align-items:stretch; }
}


/* 쿠폰목록 ========================================= */
.ListData {max-width:100%; box-sizing:border-box; padding:0 0 50px 0; flex:1}
.ListData .data_list_wrap {width:100%; max-width:100%; min-width:0;}
.ListData .data_list_wrap:not(.if_dual_scroll) .data_list_top_scroll {height:0; min-height:0; max-height:0; margin:0; padding:0; overflow:hidden; opacity:0; pointer-events:none;}
.ListData .data_list_wrap.if_dual_scroll .data_list_top_scroll {overflow-x:auto; overflow-y:hidden; line-height:0; min-height:22px; max-height:28px; box-sizing:border-box;}
.ListData .data_list_top_scroll_spacer {display:block; height:1px; width:0;}
.ListData .data_list {border-top:2px solid var(--color-blue); overflow-x:auto; width:100%; max-width:100%; min-width:0; box-sizing:border-box;}
.ListData .data_list .inner_scroll {display:table; min-width:100%; width:max-content;}
.ListData .data_list ul {display:table-row; position:relative;}
.ListData .data_list li {display:table-cell; height:40px; font-size:13px; vertical-align:middle; text-align:center; min-width:40px; padding:5px; box-sizing:border-box;}
.ListData .data_list ul.thead {background:#4285F426; border-bottom:0; font-weight:500; border-bottom:1px solid #4285F433;}
.ListData .data_list ul.tbody {border-bottom:1px solid #ddd;}
.ListData .data_list ul.tbody li+ li {border-left:1px solid #e5e5e5;}
.ListData .data_list li.t_right {text-align:right}
.ListData .data_list li.t_bold {font-weight:600;}
.ListData .data_list li.check {width:50px;}
.ListData .lineup_column {display:flex; justify-content:center; align-items:center; flex-direction:column; gap:4px}
.ListData .lineup_row {display:flex; justify-content:center; align-items:center; flex-direction:row; gap:4px}
.ListData .t_coral {color:var(--color-coral);}
.ListData .t_blue {color:var(--color-blue);}
.ListData .t_black {color:var(--color-dark);}
.ListData .t_light {color:#999;}



/* 선택출금 안내팝업 -- CTM:604271:JJC:B2B통합관리자 ========================================= */
.p_Layer_pop {position:fixed; left:0; top:0; width:100%; height:100%; z-index:10000; display:flex; justify-content:center; align-items:center; flex-direction:column; background:rgba(0,0,0,0.5); visibility:hidden; box-sizing:border-box; padding:15px; opacity:0; filter:alpha(opacity=0); -ms-filter:alpha(opacity=0); transition:all 0.3s ease-out; -webkit-transition:all 0.3s ease-out;}
.p_Layer_pop * {font-weight:500;}
.p_Layer_pop .inner {position:relative; z-index:2; background:#fff; max-width:500px; display:flex; justify-content:stretch; align-items:stretch; flex-direction:column; padding-top:25px; width:100%; box-sizing:border-box; transform:translateY(50px);  border-radius:20px; padding:30px; transition:all 900ms cubic-bezier(0.19, 1, 0.22, 1);}
.p_Layer_pop li {list-style:none;}
.p_Layer_pop .title {text-align:center; font-size:20px; font-weight:700; margin-bottom:20px; color:#000; padding:0 20px;}
.p_Layer_pop .content {flex:1; padding:0 30px; text-align:center; display:flex; justify-content:stretch; align-items:stretch; flex-direction:column; font-size:16px; line-height:1.4;}
.p_Layer_pop .content > dl {padding:15px 10px; flex:1; display:flex; justify-content:center; align-items:center; flex-direction:column; border:2px solid #000;}
.p_Layer_pop .content > dl dt {font-size:16px; font-weight:600;}
.p_Layer_pop .content > dl dd {margin-top:5px; color:#005aff; font-size:16px; font-weight:600;}
.p_Layer_pop .content > dl dd strong {text-decoration:underline; color:inherit;}
.p_Layer_pop .content .guid {color:#333; font-size:14px; margin-top:15px; text-align:left; padding:15px 20px; background:#f5f5f5;}
.p_Layer_pop .content .guid strong {font-weight:600; text-decoration:underline; color:#ff0000;}
.p_Layer_pop .content .guid dt {font-size:15px; font-weight:600; padding-bottom:10px;}
.p_Layer_pop .content .guid dd {border-top:1px dashed #ccc; padding:6px 0; position:relative; line-height:1.4; color:#666; padding-left:10px; font-weight:400;}
.p_Layer_pop .content .guid dd:before {content:""; width:3px; height:3px; background:#666; position:absolute; left:0; top:14px;}
.p_Layer_pop .content .guid dd.confirm {color:#000; font-weight:600; padding-bottom:0px; padding-left:0px;}
.p_Layer_pop .content .guid dd.confirm:before {display:none;}
.p_Layer_pop .content .reject {background:#f2f2f2; flex:1; font-size:17px; display:flex; justify-content:center; align-items:center; flex-direction:column;}
.p_Layer_pop .content .otp_form {margin-top:15px;}
.p_Layer_pop .content .input_otp {width:100%; height:60px; border-radius:0px; border:1px solid #ccc; box-sizing:border-box; padding:0 15px; font-size:18px; background:#fff; outline:none; color:#000;}
.p_Layer_pop .content .input_otp {text-align:center; font-weight:600;}
.p_Layer_pop .content .input_otp::placeholder {color: #999 !important;}
.p_Layer_pop .content .input_otp::-webkit-input-placeholder {color: #999 !important;}
.p_Layer_pop .content .input_otp::-ms-input-placeholder {color: #999 !important;}
.p_Layer_pop .content .input_otp::-moz-placeholder {color: #999 !important;}
.p_Layer_pop .content .input_otp:focus {border-color:#333;}
.p_Layer_pop .button {margin-top:30px;}
.p_Layer_pop .button ul {display:flex; justify-content:center; align-items:center; flex-direction:row;}
.p_Layer_pop .button li {flex:1;}
.p_Layer_pop .button .btn_ctrl {display:flex; justify-content:center; align-items:center; flex-direction:column; height:50px; font-size:14px;}
.p_Layer_pop .button .btn_ctrl.type_ok {background:#005aff; color:#fff;}
.p_Layer_pop .button .btn_ctrl.type_no {background:#000; color:#fff;}
.p_Layer_pop .bank_info {display:inline-flex; justify-content:center; align-items:center; flex-direction:row; font-size:15px; gap:8px; color:var(--color-coral); margin-top:5px;}
.p_Layer_pop .bank_info strong {display:flex; justify-content:center; align-items:center; flex-direction:row; gap:8px}
.p_Layer_pop .bank_info strong+ strong:before {content:""; width:1px; height:11px; background:#ccc; display:block;}

/* 바텀탑타입 */
.p_Layer_pop.type_bottom {justify-content:flex-end; padding:0px; padding-top:60px; background:transparent;}
.p_Layer_pop.type_bottom .content {padding:0px; text-align:left; padding:20px; overflow-y:auto;}
.p_Layer_pop.type_bottom .inner {border-bottom-left-radius:0; border-bottom-right-radius:0; max-width:600px; padding:0; padding-bottom:20px; overflow:hidden; transform:translateY(100%);}
.p_Layer_pop .btn_dock {display:flex; justify-content:center; align-items:center; flex-direction:column; padding:10px; box-sizing:border-box; margin:10px 0;}
.p_Layer_pop .btn_dock:before {content:""; width:40px; height:3px; background:#ddd; border-radius:100px; display:block;}
.p_Layer_pop .bg_close {position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:1; pointer-events:none; opacity:0; transition:all 0.3s ease-out;}

.p_Layer_pop.if_open {visibility:visible; opacity:1; filter:alpha(opacity=100); -ms-filter:alpha(opacity=100); }
.p_Layer_pop.if_open .inner {transform:translateY(0); }
.p_Layer_pop.if_open .bg_close {opacity:1; pointer-events:initial}



/* CTM:606184:JJC:2차리뉴얼 - layer_sell_detail - 표 스타일 + 내용 스크롤 */
.p_Layer_pop.layer_sell_detail .content {padding:0; text-align:left;}
.p_Layer_pop.layer_sell_detail .data_wrap {flex:1; min-height:0; display:flex; justify-content:flex-start; align-items:stretch; flex-direction:column;}
.p_Layer_pop.layer_sell_detail .data_list {box-sizing:border-box; overflow:hidden; overflow-y:auto; border:1px solid #333; border-radius:5px; position:relative; flex:1; max-height:50vh; background:#fff;}
.p_Layer_pop.layer_sell_detail .like_table {display:table; width:100%; box-sizing:border-box; border-collapse:separate; border-spacing:0px;}
.p_Layer_pop.layer_sell_detail .data_list ul {display:table-row;}
.p_Layer_pop.layer_sell_detail .data_list ul.thead {background:#4285F426; border-bottom:0; font-weight:500;}
.p_Layer_pop.layer_sell_detail .data_list ul.thead li {padding:10px 0px; color:#666;}
.p_Layer_pop.layer_sell_detail .data_list li {padding:8px; color:var(--color-dark); display:table-cell; font-size:13px; font-weight:500; text-align:center; border-bottom:1px solid #4285F433;}
.p_Layer_pop.layer_sell_detail .data_list ul:nth-child(odd) {background:#f5f5f5;}
.p_Layer_pop.layer_sell_detail .data_list ul.t_cancel {background-color:#fddede;}



/* 쿠폰대량입력 ========================================= */

    @media screen and (min-width:900px) {
        .ListCtrl .list_menu .open_menu .opt:hover {text-decoration:underline;}
        .ListData .data_list ul:hover {background:#f5f5f5;}
    }
    @media screen and (max-width:600px) {
        .ListSearch .find_form {flex-direction:column; align-items:stretch; }
    }



.if_hide {display:none !important;}


/* 페이지 탑 */
.PageTop .layout_fix {display:flex; justify-content:flex-start; align-items:center; flex-direction:row; gap:10px; flex-wrap:wrap; height:60px; color:var(--color-dark); border-bottom:1px solid #f2f2f2; }
.PageTop .title {font-size:18px; font-weight:700; flex:1}
.PageTop .side {flex:none; display:flex; justify-content:flex-end; align-items:center; flex-direction:row; gap:5px;}
.PageTop .btn_more {font-size:13px; font-weight:500; display:flex; justify-content:center; align-items:center; flex-direction:row; gap:2px; padding:5px 0;}
.PageTop .btn_more i {font-size:15px;}
.PageTop .btn_close {padding:5px 0;}
.PageTop .btn_close i {font-size:18px;}



/* 상품권 목록 */
.GiftCard {flex:1; display:flex; justify-content:stretch; align-items:stretch; flex-direction:column;}
.GiftCard .layout_fix {width:100%; flex:1; background:#fff; padding:0px !important;}
.GiftCard .gift_list {padding-top:30px;}
.GiftCard .gift_list ul {display:flex; justify-content:flex-start; align-items:stretch; flex-direction:column;}
.GiftCard .gift_list li {box-sizing:border-box; display:flex; justify-content:center; align-items:center; flex-direction:row; padding:12px 80px; border-bottom:1px solid #DADADA; position:relative; overflow:hidden;}
.GiftCard .gift_list li:before {content:""; width:8px; height:100%; background:var(--color-blue); position:absolute; left:0; top:0; border-radius:8px 0 0 0; transition:all 0.2s ease-out; transform:translateX(-10px);}
.GiftCard .gift_list .upper_link {pointer-events:none;}

.GiftCard .one_gift {position:relative; display:flex; justify-content:center; align-items:center; flex-direction:row; gap:32px; flex:1}
.GiftCard .one_gift .thumb {width:180px; overflow:hidden; display:flex; justify-content:center; align-items:center; flex-direction:column;}
.GiftCard .one_gift .thumb img {width:100%; display:block;}
.GiftCard .one_gift .info {flex:1; display:flex; justify-content:flex-start; align-items:flex-start; flex-direction:column; gap:12px; color:var(--color-dark);}
.GiftCard .one_gift .from {font-size:13px; font-weight:500; color:#999; display:flex; justify-content:flex-start; align-items:center; flex-direction:row; gap:14px; flex-wrap:wrap;}
.GiftCard .one_gift .from strong {color:#7a838f; display:flex; justify-content:center; align-items:center; flex-direction:column; font-size:15px; background:#F2F3F5; border-radius:100px; padding:0 12px; height:35px; font-weight:600;}
.GiftCard .one_gift .from strong:first-child {background:color-mix(in srgb, var(--color-blue) 15%, #fff 0%); color:var(--color-blue);}
.GiftCard .one_gift .name {font-size:21px; font-weight:700; word-wrap:break-word; word-break:keep-all; white-space:normal; line-height:1.4;}
.GiftCard .one_gift .type {font-size:14px; font-weight:500; color:var(--color-blue);}
.GiftCard .one_gift .price {font-size:16px; font-weight:600; color:#000; display:flex; justify-content:center; align-items:center; flex-direction:row; height:36px; gap:10px}
.GiftCard .one_gift .price strong {font-size:21px; font-weight:800; }
.GiftCard .one_gift .btn_fold {width:40px; height:40px; display:flex; justify-content:flex-end; align-items:center; flex-direction:row; display:none; color:#B0B8C1; font-size:16px;}
.GiftCard .one_gift .btn_fold i {transition:all 0.3s ease-out;}

.GiftCard .gift_list .button_ctrl {display:flex; justify-content:flex-end; align-items:flex-start; flex-direction:column; gap:24px; flex:none; width:185px; overflow:hidden; transition:all 0.3s ease-out; box-sizing:border-box; position:relative; z-indeX:11}
.GiftCard .gift_list .btn_ctrl {width:100%; background:#fff; font-size:18px; display:flex; justify-content:center; align-items:center; flex-direction:column; height:40px; box-sizing:border-box; padding:0 16px; border-radius:8px; border:1px solid #B8BCC2; color:#4F5A69; font-weight:600;}
.GiftCard .gift_list .btn_ctrl.color {color:#fff; background:var(--color-blue); border-color:var(--color-blue);}

.DataForm .GiftCard {flex:none;}
.DataForm .GiftCard .gift_list {padding:0px;}

@media (hover:hover) and (pointer:fine) {
	.GiftCard .gift_list li:hover {background:#F8FBFF;}
    .GiftCard .gift_list li:hover:before {transform:translateX(0);}
}

@media screen and (max-width:1200px) {
	.GiftCard .gift_list li {padding:0 24px;}
    .GiftCard .gift_list .button_ctrl {width:100px; gap:10px;}
}
@media screen and (max-width:700px) {
    .GiftCard .gift_list {padding-top:8px;}
	.GiftCard .gift_list li {flex-direction:column; align-items:stretch; gap:0; padding:16px; padding-left:24px; border-color:#F2F4F6;}
    .GiftCard .gift_list .upper_link {pointer-events:initial}
    .GiftCard .gift_list .button_ctrl {flex-direction:row; width:auto; height:50px; gap:8px; height:0px;}
    .GiftCard .gift_list li.if_open_ctrl .button_ctrl {height:46px;}
    .GiftCard .gift_list li.if_open_ctrl .btn_fold i {transform:rotate(180deg); color:var(--color-blue);}
    .GiftCard .gift_list .btn_ctrl {height:32px; font-size:13px; margin-top:14px;}
    .GiftCard .one_gift {gap:12px}
    .GiftCard .one_gift .thumb {width:56px; border:1px solid #eee; aspect-ratio:1/1; border-radius:20px;}
    .GiftCard .one_gift .btn_fold {display:flex;}
    .GiftCard .one_gift .info {gap:4px}
    .GiftCard .one_gift .name {font-size:16px;  line-height:1; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:1; -webkit-box-orient:vertical; display:-webkit-box; font-weight:500;}
    .GiftCard .one_gift .from {gap:4px; order:3}
    .GiftCard .one_gift .from strong {height:21px; padding:0 7px; font-size:10px;}
    .GiftCard .one_gift .price strong {font-size:16px;}
    .GiftCard .one_gift .price {height:auto; gap:1px; order:2}

}




/* 거래내역 */
.OrderList {padding-bottom:30px; overflow-x;}
.OrderList .inner {display:flex; justify-content:flex-start; align-items:stretch; flex-direction:column; gap:10px; background:#fff; border-radius:15px; overflow:hidden;}
.OrderList .summary {display:flex; justify-content:flex-start; align-items:center; flex-direction:row; gap:10px; border-bottom:1px solid #eee; padding:15px;}
.OrderList .summary .point {font-size:18px; font-weight:700; color:var(--color-dark); flex:1}
.OrderList .summary .point strong {font-size:24px; font-weight:700; color:var(--color-dark);}
.OrderList .summary .btn_more {font-size:13px; font-weight:500; display:flex; justify-content:center; align-items:center; flex-direction:row; gap:2px; padding:5px 0;}
.OrderList .summary .btn_more i {font-size:15px;}

.OrderList .sell_list {display:flex; justify-content:flex-start; align-items:stretch; flex-direction:column; gap:10px; background:#fff; flex:1; overflow-y:auto;}
.OrderList .sell_list ul {display:flex; justify-content:flex-start; align-items:stretch; flex-direction:column; gap:10px;}
.OrderList .sell_list li {display:flex; justify-content:flex-start; align-items:stretch; flex-direction:column; gap:15px; padding:15px; border-radius:8px;}
.OrderList .sell_list li+ li {border-top:1px solid #eee;}
.OrderList .sell_list .date {font-size:16px; font-weight:500; color:#999; display:flex; justify-content:flex-start; align-items:center; flex-direction:row; gap:5px;}

.OrderList .one_data {display:flex; justify-content:flex-start; align-items:stretch; flex-direction:column; gap:5px; position:relative; margin-left:21px; font-size:14px;}
.OrderList .one_data .state {font-weight:600; color:var(--color-dark);}
.OrderList .one_data .time {font-weight:500; color:var(--color-dark); display:flex; justify-content:flex-start; align-items:center; flex-direction:row;}
.OrderList .one_data .time em {color:#999;}
.OrderList .one_data .price {font-weight:600; color:var(--color-dark); display:flex; justify-content:flex-start; align-items:center; flex-direction:row; gap:2px;}
.OrderList .one_data .price:before {content:""; width:3px; height:3px; background:#ccc; margin:0 10px; border-radius:100px;}
.OrderList .one_data .price i {font-size:12px;}
.OrderList .one_data .price i.ph-plus {color:#ff0000;}
.OrderList .one_data .price i.ph-plus+strong {color:#ff0000;}
.OrderList .one_data .price i.ph-minus {color:#005aff;}
.OrderList .one_data .price i.ph-minus+strong {color:#005aff;}
.OrderList .one_data .price i.ph-prohibit {color:#aaa;}
.OrderList .one_data .price i.ph-prohibit+strong {color:#aaa;}




/* 상품권 상세보기 */
.GiftItem {display:flex; justify-content:flex-start; align-items:stretch; flex-direction:column; gap:10px; flex:1; }
.GiftItem ul {display:flex; justify-content:flex-start; align-items:stretch; flex-direction:column; gap:20px;}
.GiftItem li {display:flex; justify-content:flex-start; align-items:stretch; flex-direction:column; gap:10px;}
.GiftItem li+ li {border-top:1px solid #f2f2f2; padding-top:20px;}
.GiftItem .one_gift {display:flex; justify-content:flex-start; align-items:center; flex-direction:row; gap:15px; position:relative;}
.GiftItem .one_gift .logo {width:40px; aspect-ratio:1/1; border-radius:100px; overflow:hidden; box-sizing:border-box; background:#eee;}
.GiftItem .one_gift .logo img {width:100%; height:100%; object-fit:cover;}
.GiftItem .one_gift .info {flex:1; display:flex; justify-content:flex-start; align-items:flex-start; flex-direction:column; gap:3px; color:#666; font-size:13px; line-height:1; gap:5px}
.GiftItem .one_gift .name {font-size:15px; font-weight:700; margin-bottom:3px; color:#222; line-height:1.3;}
.GiftItem .one_gift .type {}
.GiftItem .one_gift .price {}
.GiftItem .one_gift .arrow {color:#aaa; font-size:15px;}




/* 푸터 */
.Footer {flex:none; background:#F5F7F9; padding:12px 0; box-sizing:border-box; display:none; border-top:1px solid #EDEDED;}
.Footer.if_hidden {display:none;}
.Footer .site_logo img {display:block; height:16px; width:auto;}
.Footer .company_info {margin-top:8px; font-size:12px; color:#A7ADB3; line-height:1.5; word-break:keep-all;}

@media screen and (max-width:700px) {
    .Footer {display:block;}
}




/* 팝업 */
.PopUp {overflow:hidden; position:absolute; z-index:10001; background:#fff; max-width:600px; border:1px solid #ddd; height:auto; width:100%}
.PopUp.top_left {left:0; top:0}
.PopUp.top_mid {left:50%; transform:translateX(-50%); top:0}
.PopUp.top_right {right:0; top:0}
.PopUp.mid_left {left:0; top:50%; transform:translateY(-50%);}
.PopUp.mid_mid {left:50%; transform:translate(-50%, -50%);}
.PopUp.mid_right {right:0; top:50%; transform:translateY(-50%);}
.PopUp.bottom_left {left:0; bottom:0;}
.PopUp.bottom_mid {left:50%; transform:translateX(-50%); bottom:0;}
.PopUp.bottom_right {right:0; bottom:0;}
.PopUp .inner {display:flex; justify-content:flex-start; align-items:stretch; flex-direction:column; gap:10px; background:#fff; overflow-x:hidden; position:relative; overflow-y:auto; max-height:100%}
.PopUp .inner img {display:block; max-width:100%;}
.PopUp .close_btn {display:flex; justify-content:flex-end; align-items:center; flex-direction:row; border-top:1px solid #eee;}
.PopUp .close_btn .btn_close {font-size:13px; font-weight:500; color:#4A505A; display:flex; justify-content:center; align-items:center; flex-direction:column; height:42px; box-sizing:border-box; flex:1}
.PopUp .close_btn .btn_close+ .btn_close {border-left:1px solid #eee;}

@media screen and (max-width:600px) {
    .PopUp {position:fixed; top:auto !important; bottom:0 !important; transform:initial !important;}
}



/* 미니폼 */
.MiniForm {background:#F5F7F9; padding:30px; border-radius:15px; display:flex; justify-content:center; align-items:center; flex-direction:row; gap:20px}
.MiniForm ul {display:flex; justify-content:flex-start; align-items:stretch; flex-direction:row; gap:15px; flex:1}
.MiniForm li {display:flex; justify-content:center; align-items:flex-start; flex-direction:column; position:relative; gap:5px; flex:1}
.MiniForm .label {flex:none; font-size:15px; font-weight:500; color:#111; position:absolute; left:15px; pointer-events:none;}
.MiniForm .input_design {font-size:16px; height:50px; color:#111; font-weight:500; text-align:right; }
.MiniForm .input_design.search_price {padding-right:30px; color:var(--color-coral);}
.MiniForm .input_design:not(:placeholder-shown)+ .label {color:var(--color-blue);}
.MiniForm .unit {position:absolute; right:15px; bottom:0; font-size:15px; font-weight:500; color:#aaa; pointer-events:none; height:50px; display:flex; justify-content:center; align-items:center; flex-direction:column;}
.MiniForm .c_btnbox {flex:none; margin-top:0px;}
@media screen and (max-width:800px) {
    .MiniForm {flex-direction:column; align-items:stretch; padding:20px;}
}
@media screen and (max-width:600px) {
    .MiniForm ul {flex-direction:column; align-items:stretch;}
    .MiniForm .label {position:static; order:-1}
}