@charset "utf-8";

/* style */
.cursor-pointer{cursor:pointer;}
.text-bold		{font-weight:bold;}
.text-nowrap	{white-space:nowrap;}
.text-break-all {white-space:normal; word-break:break-all;}
.text-prewrap   {white-space:pre-wrap;}

.text-blue		{color:var(--blue); }
.text-indigo	{color:var(--indigo); }
.text-purple	{color:var(--purple); }
.text-pink		{color:var(--pink); }
.text-red		{color:var(--red); }
.text-orange	{color:var(--orange); }
.text-yellow	{color:var(--yellow); }
.text-green		{color:var(--green); }
.text-teal		{color:var(--teal); }
.text-cyan		{color:var(--cyan); }
.text-gray		{color:var(--gray); }
.text-gray-dark {color:var(--gray-dark); }

.bg-blue		{background-color:var(--blue); }
.bg-indigo		{background-color:var(--indigo); }
.bg-purple		{background-color:var(--purple); }
.bg-pink		{background-color:var(--pink); }
.bg-red			{background-color:var(--red); }
.bg-orange		{background-color:var(--orange); }
.bg-yellow		{background-color:var(--yellow); }
.bg-green		{background-color:var(--green); }
.bg-teal		{background-color:var(--teal); }
.bg-cyan		{background-color:var(--cyan); }
.bg-gray		{background-color:var(--gray); }
.bg-gray-dark	{background-color:var(--gray-dark); }
.bg-gray-light  {background-color:#fafbfc;}
.bg-gray-dim  {background-color: #f3f3f3 !important}

.w-10px { width: 10px; }
.w-20px { width: 20px; }
.w-30px { width: 30px; }
.w-40px { width: 40px; }
.w-50px { width: 50px; }
.w-60px { width: 60px; }
.w-70px { width: 70px; }
.w-80px { width: 80px; }
.w-90px { width: 90px; }
.w-100px { width: 100px; }
.w-110px { width: 110px; }
.w-120px { width: 120px; }
.w-125px { width: 125px; }
.w-130px { width: 130px; }
.w-140px { width: 140px; }
.w-150px { width: 150px; }
.w-175px { width: 175px; }
.w-200px { width: 200px; }

.is-invalid { border:1px solid #ff8888 !important; }
.is-valid { border:1px solid #2f77b5 !important; }

.pop-layer-show{ cursor:pointer;}

.inipay_modal.fade:not(.show) { opacity: 1 !important; }

/* layout
#wrap {position: relative; width:100%;}

#header {position: relative; width:100%; border:1px solid red;}
#contents {position: relative; width:100%; border:1px solid black;}
#copyright {position: relative; width:100%;  border:1px solid blue;}
*/

/* css */
/*
#DaumPostSearchWrap{ display:none; position:absolute;width:440px; height:480px; top:50%; left:50%; z-index:1100; border:1px solid black;
	transform:translate(-50%, -50%);
		-webkit-transform: translate(-50%, -50%);
		-moz-transform: translate(-50%, -50%);
		-o-transform: translate(-50%, -50%); 
		-ms-transform: translate(-50%, -50%);
	overflow:hidden;
	-webkit-overflow-scrolling:touch;
}
#closeDaumPostcode{position:absolute;right:1px;top:1px;z-index:1100;cursor:pointer;}
*/


/* alert / confirm창 */
.notice_msg {position:fixed; top:0; left:0; width:100%; height:100%;  visibility: hidden; opacity: 0; line-height:100%; background:var(--find_result_bg); border-radius:3px;  z-index:11111111;}
.notice_msg.show {opacity: 1; visibility: visible; }
.notice_msg .am_pos			{position:absolute;top:calc(50% - 15px);left:50%; transform:translate(-50%, -50%); max-width:300px; width:calc(100% - 20px); text-align: center; z-index:999999; border-radius:10px; overflow:hidden; opacity:0;transition: all .3s; }
.notice_msg.show .am_pos			{top:calc(50% - 35px); opacity:1;}
.notice_msg .am_pos p		{font-weight:500; font-size: 13px;  color:var(--default_color1); position:relative; padding:50px 0 35px 0; line-height:150%; }
.notice_msg .am_pos ul.ap_btn {position:relative;  left:0; right: 0; display:flex; justify-content: center; overflow: hidden;}
.notice_msg .am_pos ul.ap_btn li {flex:1; position:relative; font-size:12px; color: #fff; cursor: pointer; border-radius: 30px; text-align: center;padding: 18px 0; margin-right: 10px; max-width:180px;}
.notice_msg .am_pos ul.ap_btn li:last-child {margin: 0;}
.notice_msg .am_pos ul.ap_btn li.ok {background: var(--sym_color);}
.notice_msg .am_pos ul.ap_btn li.cancel {background: #333;}
.notice_msg .am_pos ul.ap_btn li.logout_button {background: var(--sym_color);}
.notice_msg ver {display: none;}
.notice_msg > i {position: absolute; top:calc(env(safe-area-inset-top) + 55px); right: 55px; line-height: 100%; font-size: 55px; transform: rotate(0); color: var(--default_color1); cursor: pointer;}
.notice_msg > i:before {content: "close"}
.notice_msg > i:hover {transform: rotate(180deg);}

@media screen and (max-width: 650px){
	.notice_msg > i {top: calc(env(safe-area-inset-top) + 35px); right: 35px; font-size: 25px;}
}


/* 카카오 우편번호 */
#DaumPostWrap{ position:fixed; top:0; left:0; width:100%;  height:100%; background:rgba(0,0,0,0.6); visibility: hidden; transition:all .4s; z-index:-1; opacity:0;}
#DaumPostWrap.show{ visibility: visible; opacity:1;z-index:1000000000;}
#DaumPostWrap .dp_pos{position:absolute; top:calc(50% + 15px); left:50%; max-width:700px; transform:translate(-50%, -50%); width:calc(100% - 20px); max-height:900px; height:calc(100% - 30px); border-radius:10px;  text-align:left;  overflow:hidden;transition:all .2s;opacity:0; }
#DaumPostWrap.show .dp_pos{top:50%; opacity:1;}
#DaumPostWrap .dp_pos h3{position:relative; height:50px; font-size:16px; line-height:50px; font-weight:600; color:var(--default_color1); background:var(--place_head); padding:0 25px; letter-spacing:-0.05em;}
#DaumPostWrap .dp_pos i {position: absolute; top: 0; right: 0; width: 50px; height: 50px; line-height: 50px; text-align: center; font-size: 25px; color: var(--default_color1); transition: all .3s; z-index: 3; cursor: pointer;}
#DaumPostWrap .dp_pos i:before			{content:"close";}
#DaumPostWrap #DaumPostSearchWrap{position:relative; height:calc(100% - 50px); background:#ececec;transition:all .3s; opacity:0;}
#DaumPostWrap.show #DaumPostSearchWrap{visibility: visible; opacity:1;animation-name: popup_view; animation-duration:1s;animation-iteration-count: 1; animation-direction:normal;animation-fill-mode: forwards;}

@media screen and (max-width: 650px){
	#DaumPostWrap {background: var(--place_head) !important;transform: translateX(100%);visibility: visible; opacity:1;z-index:1000000000;}
	#DaumPostWrap.show {transform: translateX(0%);}
	#DaumPostWrap .dp_pos,
	#DaumPostWrap.show .dp_pos{top:calc(0px + env(safe-area-inset-top)) !important; left: 0; transform:none !important; max-width:100%; width: 100%; max-height:calc(100% - env(safe-area-inset-top)); height:calc(100% - env(safe-area-inset-top)); border-radius: 0;}
	#DaumPostWrap .dp_pos i:before			{content:"east";}
	#DaumPostWrap .dp_pos h3{font-size:14px; padding: 0 20px;}
}

/* 위치설정 맵 레이어 */
.mbx_wrap,
.gps_wrap{position:fixed; top:0; left:0; width:100%;  height:100%; visibility: hidden; opacity: 0; transition: all .4s; z-index:1000000000;}
.mbx_wrap.show,
.gps_wrap.show{opacity: 1; visibility: visible; }
.mbx_wrap .mask_back,
.gps_wrap .mask_back {position:absolute; top:0; left:0; right:0; bottom:0; width:100%; height:100%; background:#000; opacity: .6;}
.mbx_wrap .content,
.gps_wrap .content			{position:absolute;top:calc(50% + 15px);left:50%; transform:translate(-50%, -50%); max-width:700px; width:calc(100% - 20px) !important; max-height:900px; height:calc(100% - 20px) !important; z-index:999999;background:var(--place_bg); border-radius:10px; overflow:hidden; opacity:0;transition: all .3s; }
.mbx_wrap.show .content,
.gps_wrap.show .content			{top:50%; opacity:1;}


.src_txbx				{position:relative; width:100%; height:50px; text-align:center; color:var(--default_color1); background:var(--place_head); border-bottom:0px solid #eeeeee;}
.src_txbx *{transition: all 0s !important;}
.src_txbx i			{position: absolute;top: 0;right: 0;width: 50px;height: 50px;line-height: 50px;text-align: center;font-size: 25px;color: var(--default_color1);transition: all .3s;z-index: 1;cursor: pointer;}
.src_txbx i:before			{content:"close";}
.src_txbx h2			{position:absolute; top:50%; left:20px; transform:translateY(-50%); font-size:16px; color:#000; font-weight:700; line-height:120%; letter-spacing:-0.05em; color:var(--default_color1); z-index:1;}
.src_txbx h2 span		{color:#00365b;}
.now_here		{position:absolute;top:50%; left:0; width:100%; transform:translateY(-50%); padding:0 95px; text-align:left; font-size:11px; color:var(--default_color2); text-overflow: ellipsis; white-space: nowrap; overflow:hidden; letter-spacing:-0.05em; transition: all 0s !important;}
ul.cross_data		{position:absolute; top: calc(50% - 28px); left:calc(50% + 95px); transform: translate(-50%, -50%); width:130px; height:30px; font-size:0; z-index: 100; line-height:100%;}
ul.cross_data li	{display:inline-block; width:100%;font-size:0; padding:0;line-height: 110%; padding:1px 0;}
ul.cross_data li span,
ul.cross_data li input	{display:inline-block; vertical-align:middle; line-height:100%; }
ul.cross_data li span	{font-weight:700; font-size:9px; letter-spacing:0em; width:22px; color:var(--default_color1); opacity:0.5; text-align:left;}
ul.cross_data li input	{width:calc(100% - 22px); height:10px; padding:0; border:0; background:transparent; color:var(--default_color1); font-size:9px; font-weight:300; text-align:left; }
	
@media screen and (max-width: 650px){
	.mbx_wrap,
	.gps_wrap{transform: translateX(100%);visibility: visible; opacity:1;z-index:1000000000;}
	.mbx_wrap.show,
	.gps_wrap.show{transform: translateX(0%);}
	.mbx_wrap .mask_back,
	.gps_wrap .mask_back {opacity:1; background:var(--place_head);}
	.mbx_wrap .content,
	.mbx_wrap.show .content,
	.gps_wrap .content,
	.gps_wrap.show .content			{top:calc(0px + env(safe-area-inset-top));left:0; transform:none; max-width:100% !important; width:100% !important; max-height:calc(100% - env(safe-area-inset-top)); height:calc(100% - env(safe-area-inset-top)) !important;  border-radius:0; di splay: none;}
	.now_here		{padding:0 50px 0 95px; }
	.src_txbx i:before			{content:"east";}
	.src_txbx h2			{font-size:14px;}
}

/* 카카오맵 출력 */

/* 주소검색 및 선택 */
:root[user-theme="light"] {
	--map_search:#fafafa;
	--map_search_color:#000;
	--map_search_focus:#fff;
	--map_search_place:#ddd;
	--map_result_bg:#f2faff;
	--map_result_list_title:#3396ff;
	--map_result_list_title_hover:#000;
	--ctrl_icon_bg:#e6f7ff;
	--nav_no:#ddd;
	--nav_no_on:red;
	--nav_no_line:#ddd;
	--target_line:red;

}

:root[user-theme="dark"] {
	--map_search:#001b39;
	--map_search_color:#fff;
	--map_search_focus:#003671;
	--map_search_place:#999;
	--map_result_bg:#002a4f;
	--map_result_list_title:#8bc3ff;
	--map_result_list_title_hover:#fff;
	--ctrl_icon_bg:#0061c1;
	--nav_no:rgba(255,255,255,0.6);
	--nav_no_on:#ff8f00;
	--nav_no_line:rgba(255,255,255,0.2);
	--target_line:#fff;
}

.my_loc_setting		{position:relative; width:100%; height:calc(100% - 50px); transition:none; }
.my_loc_setting *		{transition:all 0s !important;}
.my_loc_setting.act		{height:calc(100% - 300px);}
.my_loc_setting #kakao_daum_map		{position:absolute;top:0;left:0; width:100% !important; height:100% !important;}
.my_loc_setting #kakao_daum_map:after {content: "Dokdo Belongs to Korea"; position:absolute; bottom:10px; right:10px; line-height: 100%; z-index:1; font-weight: 300; font-size: 8px; color: #000 !important; opacity: 0.9; letter-spacing: 0em;}
.my_loc_setting .line		{position:absolute;top:0;left:0; right:0; bottom:0; margin:auto; background:var(--target_line); opacity:0.3; z-index:20;}
.my_loc_setting .line.x		{width:100%; height:1px; }
.my_loc_setting .line.y		{width:1px; height:100%; }
/*
.my_loc_setting .here_pick	{position:absolute; top:-11px; left:0; right:0; bottom:0; margin:auto;  transform: translateY(-50%); background:red; width:45px; height:30px; border-radius:3px; text-align:center; cursor:pointer; z-index: 21;}
.my_loc_setting .here_pick:after{content:""; position:absolute; bottom:-5px; left:50%; transform: translateX(-50%); border-left:10px solid transparent; border-right:10px solid transparent; border-top:10px solid red;}
.my_loc_setting .here_pick span{position:absolute; top:50%; left:0; width:100%; transform:translateY(-50%); font-size:11px; color:#fff; text-align:center; line-height:100%;}
*/
.my_loc_setting .here_pick	{position:absolute; top:0; left:0; right:0; bottom:0; margin:auto;  transform: translateY(-50%); background:url('/views/asset/images/map_pin0_pick.png') center/cover no-repeat;width:40px; height:50px; border-radius:3px; text-align:center; cursor:pointer; z-index: 21;}
.my_loc_setting .here_pick span{position:absolute; top:15px; left:0; width:100%; font-size:11px; color:#fff; text-align:center; line-height:100%; font-weight:600;}

.my_loc_setting .ctrl_post		{position:absolute;bottom:calc(90px + env(safe-area-inset-bottom)); right:15px; width:40px; text-align:center;  z-index:20; padding:0px 0 ;}
.my_loc_setting .ctrl_post i					{display:inline-block; vertical-align:middle; width:100%; line-height: 40px; font-size:17px; transition:all .3s; color:var(--default_color1); background:var(--ctrl_icon_bg); border-radius:100%; margin-top:5px; cursor:pointer;}
.my_loc_setting .ctrl_post i.xi-gps		{}
.scr_wrt_bx		{position:absolute;bottom:calc(25px + env(safe-area-inset-bottom));left:0; right:0px; margin:auto; width:calc(100% - 20px); height:50px; border-top:0px solid #eeeeee;  z-index:21; padding:0; text-align:left; }
.scr_wrt_bx input	{position:relative !important; width:100% !important; height:50px !important; border:0 !important; padding:0 90px 0 15px !important; background:var(--map_search) !important; font-size:13px !important; text-align:left !important; transition:all .2s; color:var(--map_search_color) !important;border-radius:7px !important;}
.scr_wrt_bx input:focus {outline:none; background: var(--map_search_focus) !important; transition:all .2s;}
.scr_wrt_bx input::placeholder {color: var(--map_search_place) !important; font-size:11px;}
.scr_wrt_bx button{position:absolute; top:0; right:0; width:50px; height:100%; border:0; background: transparent; cursor: pointer; outline:none;}
.scr_wrt_bx button i{position:absolute; top:50%; left: 50%; transform: translate(-50%, -50%); font-size: 20px; color:var(--default_color1);}
.empty_keyword {position: absolute; bottom:calc(60px + env(safe-area-inset-bottom)); left:10px; width:auto; height:auto; background:red; border-radius:30px; color:#fff; visibility: hidden; opacity: 0;z-index: 25;transition: all .3s; text-align:center; line-height:110%; padding:7px 10px; font-size:11px; font-weight:500; letter-spacing:-0.05em;}
.empty_keyword:after {content:""; position:absolute; bottom:-5px; left:10px;border-top:10px solid red; border-right:10px solid transparent;}
.empty_keyword.show {bottom:calc(65px + env(safe-area-inset-bottom)); opacity: 1; visibility: visible;  transition: all .3s;}
#addressListWrap {position: absolute; bottom:calc(80px + env(safe-area-inset-bottom)); left:0; right:0; margin:auto; width:calc(100% - 20px); height:auto;  background:var(--map_result_bg); border-radius:0;  transform:translateY(100%); visibility: hidden; opacity: 0;z-index: -1;transition: all .3s; border-radius:3px;}
#addressListWrap.show {opacity: 1; visibility: visible;  z-index:20; transform:translateY(0);}
#addressListWrap > i {position:absolute; top:0; right:0; font-size:18px; z-index:1; transform:translate(-30%, -140%); color:var(--default_color1); transition:all .3s; cursor:pointer;}
#addressList {position:relative; top:0; left:0; width:100%; padding:15px ; font-size:0; overflow-y:overlay; line-height:100%; text-align:left;}
#addressList:: {-ms-overflow-style: none;}
#addressList::-webkit-scrollbar {background: transparent; width:3px; height:3px; border-radius:15px;}
#addressList::-webkit-scrollbar-thumb {background:rgba(0,0,0,0); border-radius:15px;  transition:all .3s;}
#addressList:hover::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.3); transition:all .3s;}
#addressList > div {display:inline-block; vertical-align:middle; width:33.3333%; line-height:100%; padding:5px; }
#addressList .s_box {display:inline-block; width:100%; font-size:0; cursor:pointer; overflow: hidden; text-align:left; line-height:110%; font-family:var(--neo);}
#addressList .s_box strong,
#addressList .s_box span,
#addressList .s_box i {display:inline-block; vertical-align:middle; line-height:110%; font-size:11px; transition:all .2s;}
#addressList .s_box strong {width:100%; color:var(--map_result_list_title); font-weight:600; text-overflow: ellipsis;white-space: nowrap;}
#addressList .s_box span {width:100%; color:var(--default_color1); font-weight:300; text-overflow: ellipsis;white-space: nowrap; padding-top:3px; font-size:10px; opacity:0.6;}
#addressList .s_box i {width:100%; color:#3396ff; display:none;font-size:10px;}
#addressList .s_box:hover,
#addressList .s_box:hover strong{color:var(--map_result_list_title_hover); }
#addressList .s_box:hover span {color:var(--default_color1); }
#addressList .s_box:hover i { color:var(--map_result_list_title_hover); }
#addressList_paging {position:relative; height:40px; text-align:center; display:flex; justify-content: center; border-top:1px dashed var(--nav_no_line);}
#addressList_paging button {flex:1; margin:0 1px; font-size:10px; background:none; border:none; color:var(--nav_no); padding:5px; line-height:100%; max-width:20px; cursor:pointer; font-family:var(--neo); font-weight:300;}
#addressList_paging button.on {color:var(--nav_no_on); font-weight:600;}

@media screen and (max-width: 650px){
	.my_loc_setting #kakao_daum_map:after {font-size: 7px;letter-spacing: 0.05em;}
	#addressList {height: 200px;}
	#addressList > div {width:50%;}
}

@media screen and (max-width: 350px){
	#addressList > div {width:100%;}
}


/**/
.popup{
	position: absolute;
	display: flex; flex-direction: column;
	background-color:#ffffff;
	border:1px solid #ddd;
	border-radius:0.25rem;
	padding:0.25rem;
}
.popup .popup-header { font-weight:bold; }
.popup .popup-body { }
.popup .popup-footer {
	margin-top:0.5rem;
	text-align:right;
}

/*
.form-control {font-size:0.85rem;}
.form-label {display:inline-block ; margin-bottom:0.25rem;}
*/

/*

// Small devices (landscape phones, 576px and up)
@media (min-width: 576px) and (max-width: 767.98px) { ... }

// Medium devices (tablets, 768px and up)
@media (min-width: 768px) and (max-width: 991.98px) { ... }

// Large devices (desktops, 992px and up)
@media (min-width: 992px) and (max-width: 1199.98px) { ... }

// Extra large devices (large desktops, 1200px and up)
@media (min-width: 1200px) { ... }



// Extra small devices (portrait phones, less than 576px)
@media (max-width: 575.98px) { ... }

// Small devices (landscape phones, less than 768px)
@media (max-width: 767.98px) { ... }

// Medium devices (tablets, less than 992px)
@media (max-width: 991.98px) { ... }

// Large devices (desktops, less than 1200px)
@media (max-width: 1199.98px) { ... }

// Extra large devices (large desktops)
// No media query since the extra-large breakpoint has no upper bound on its width

// Extra small devices (portrait phones, less than 576px)
@media (max-width: 575.98px) { ... }



@include media-breakpoint-up(sm) { ... }
@include media-breakpoint-up(md) { ... }
@include media-breakpoint-up(lg) { ... }
@include media-breakpoint-up(xl) { ... }

$zindex-dropdown:          1000 !default;
$zindex-sticky:            1020 !default;
$zindex-fixed:             1030 !default;
$zindex-modal-backdrop:    1040 !default;
$zindex-modal:             1050 !default;
$zindex-popover:           1060 !default;
$zindex-tooltip:           1070 !default;

*/


.ul-Mini-Calendar {list-style:none;text-align:center; }
.ul-Mini-Calendar > li {display:inline-block;width:32.3333%;padding:1.5% 0.5%;}

.Mini-Calendar { /*border:1px solid #DDD; border-radius:3px; */ padding:4px; font-size:12px;}
.Mini-Calendar > table { width:100%; table-layout:fixed;}
.Mini-Calendar > table > thead { text-align:center;line-height:2rem;}
.Mini-Calendar > table > thead tr { border-top:1px solid #EFEFEF; border-bottom:1px solid #EFEFEF;}
.Mini-Calendar > table > thead th.day_sun { color:#FF4040;}
.Mini-Calendar > table > thead th.day_sat { color:#2080D0;}

.Mini-Calendar > table > tbody {text-align:center;}
.Mini-Calendar > table > tbody tr { border-bottom:1px solid #EFEFEF;}
.Mini-Calendar > table > tbody dl{min-height:36px;cursor:pointer; margin:0;}

.Mini-Calendar > table > tbody dt.day_sun{color:#FF4040;}
.Mini-Calendar > table > tbody dt.day_sat{color:#2080D0;}
.Mini-Calendar > table > tbody dt.day_holiday{color:#FF4040 !important;}
.Mini-Calendar > table > tbody dt.day_off{background-color:#e1e1e1;}
.Mini-Calendar > table > tbody dt.day_active{background-color:#179b4f;color:#FFF;}


.Mini-Calendar > table > tbody dd{overflow:hidden; text-overflow:ellipsis; white-space: nowrap; color:#6c757d;}
.Mini-Calendar > table > tbody dl:hover{background-color:#E0FFE0;}

.table th, .table td{vertical-align:middle;}
.table.table-fixed {table-layout:fixed;}

xmp {font-size:1rem;position:fixed;border:1px solid #efefef;z-index:11000002;background-color:#FFF;width:80%;height:480px;overflow-y:auto;padding:2rem;box-shadow:0 5px 5px #ddd;left:100px;top:100px;}