@charset "UTF-8";

/* ==================== header ==================== */

/* ==================== Breadcrumb ==================== */
.breadcrumb {
	display: flex;
	align-items: center;
}
.breadcrumb li {
	display: flex;
	align-items: center;
	color: var(--gray80);
	font-size: 14px;
	line-height: 135%;
	font-weight: 400;
}
.breadcrumb li:not(:last-child)::after {
	content:"";
	width: 12px;
	height: 12px;
	display: block;
	margin:0 8px;
	background: url(../images/icon-12-right-gray.svg) no-repeat center;
}
.breadcrumb a {
	display: block;
}
.breadcrumb a:hover {
	text-decoration: underline;
}
.breadcrumb li:last-child {
	color: var(--gray130);
	font-weight: 600;
}
.breadcrumb.white li {
	color:#fff;
}
@media (max-width: 1640px) {
	.breadcrumb.white {
		padding-right: 40px;
	}
}

/* ==================== Tab ==================== */
.tab-group {
	display: flex;
	width:100%;
	align-items: center;
}
.tab-group a {
	display: flex;
	align-items: center;
	font-size: 20px;
	line-height: 135%;
	font-weight: 600;
	height: 60px;
	color:var(--gray70);
	border-bottom:1px solid var(--gray30);
    width: 100%;
    justify-content: center;
}
.tab-group a.active {
	border-bottom:2px solid var(--gray130);
	color:var(--gray130);
}
.tab-group a:not(.active):hover {
	color:var(--gray130);
}
@media (max-width: 1360px) {
	.tab-group a {
		height: 48px;
		font-size: 18px;
	}

}
/* ==================== Button ==================== */
.btn-group {
    display: flex;
    justify-content: center;
	align-items: center;
	position: relative;
}
.btn-group button {
	height: 50px;
	width:100%;
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size:16px;
	font-weight: 600;
	padding:0 16px;
	-webkit-transition-duration:0.2s;
	-webkit-transition-timing-function:ease;
	transition-duration:0.2s;
	transition-timing-function:ease;
	cursor: pointer;
}
.btn-group .line {
	width:1px;
	height: 20px;
	background: var(--gray30);
	margin:0 12px;
}
.btn-group button.fill-main {
	background: var(--main);
	color:#fff;
}
.btn-group button:hover {
	opacity: 0.9;
	cursor: pointer;
}
.btn-group button.fill-main.disable {
	background: var(--main40);
	color:#fff;
}
.btn-group button.fill-sub {
	background: var(--sub);
	color:#fff;
}
.btn-group button.fill-sub:hover {
	opacity: 0.9;
	cursor: pointer;
}
.btn-group button.fill-sub-light {
	background: var(--sub10);
	color:var(--gray130);
}
.btn-group button.fill-sub-light:hover {
	background: var(--sub20);
	cursor: pointer;
}
.btn-group button.fill-black {
	background: var(--gray130);
	color:#fff;
}
.btn-group button.fill-red {
	background: var(--system-red);
	color:#fff;
}
.btn-group button.fill-opacity-blue {
	background: var(--main20);
	color:var(--main);
}
.btn-group button.fill-opacity-blue:hover {
	background: var(--main30);
}
.btn-group button.fill-gray {
	background: var(--gray30);
	color:var(--gray120);
}
.btn-group button.fill-gray:hover {
	background: var(--gray40);
	color:var(--gray120);
}
.btn-group button.fill-gray-disable {
	background: var(--gray30);
	color:var(--gray50);
}
.btn-group button.fill-white {
	background: #fff;
	color:var(--main);
}
.btn-group button.fill-white:hover {
	background: var(--main10);
}
.btn-group button.line-blacktxt {
	color:var(--gray120);
	border:1px solid var(--gray30);
}
.btn-group.xsmallround button.line-blacktxt {
	color:var(--gray130);
	border:1px solid var(--gray30);
}
.btn-group button.line-blacktxt:hover {
	border-color:var(--gray50);
	color:var(--gray130);
	opacity: 1;
}
.btn-group button.line-main {
	color:var(--main);
	border:1px solid var(--main);


	width: auto;
	white-space: nowrap;
	padding: 0 24px;
}
.btn-group button.line-main:hover {
	background: var(--main10);
}
.btn-group button .icon {
	width:20px;
	height: 20px;
	margin-right:6px;
}
.btn-group button .icon-right {
	width:20px;
	height: 20px;
	margin-left:6px;
}
.btn-group.smallround button {
	font-size: 15px;
	font-weight: 600;
	height: 40px;
	padding:0 16px;
	border-radius: 99px;
	width:fit-content;
	min-width: unset !important;
}
.btn-group.small button {
	font-size: 15px;
	font-weight: 500;
	height: 40px;
	padding:0 12px;
	border-radius: 4px;
	width:fit-content;
	min-width: unset !important;
}
.btn-group button i.left {
	display: block;
	width:20px;
	height: 20px;
	margin-right:6px;
}
.btn-group button i.right {
	display: block;
	width:20px;
	height: 20px;
	margin-left:6px;
}
.btn-group.smallround button i.left,
.btn-group.small button i.left {
	display: block;
	width:16px;
	height: 16px;
	margin-right:6px;
}
.btn-group.smallround button i.right,
.btn-group.small button i.right {
	display: block;
	width:16px;
	height: 16px;
	margin-left:6px;
}
.btn-group.xsmall button {
	height: 22px;
	font-size:12px;
	border-radius: 4px;
	background: var(--gray30);
	color: var(--gray130);
	font-weight: 500;
	width: auto;
	padding:0 10px;
}
.btn-group.xsmall button:hover {
	background: var(--gray40);
}

@media (max-width: 900px) {
	.btn-group.small button {
		height: 36px;
		font-size:13px;
		padding:0;
	}
}





input::placeholder {
	color: var(--gray70);
	letter-spacing: 0;
	font-weight: 300;
}
/* ==================== Text box ==================== */
.input_group {
	width:100%;
}
.input_group label {
	font-size: 14px;
	font-weight: 500;
	margin-bottom:5px;
	line-height: 150%;
	color:var(--gray130);
	display: block;
}
.input_group .text_group {
	position: relative;
	width:100%;
}
.input_group.small .text_group input {
    height: 40px;
    border-radius: 6px;
    padding: 0 16px;
    font-size: 15px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.input_group .text_group input {
	width:100%;
	border-radius: 8px;
	border: 1px solid var(--gray30);
	background: #fff;
	height:50px;
	padding:0 16px;
	font-size: 16px;
	font-weight: 300;
	color: var(--gray130);
}
.input_group .text_group input:read-only {
	background: var(--gray30);
	color: var(--gray90);
}
.input_group .text_group input:read-only:focus {
	border: 1px solid var(--gray30);
}
.input_group .text_group input:read-only.readonly-white{
	color: var(--gray90);
	background: var(--white);
}
.input_group .text_group input:focus {
	border-color:var(--gray130);
}
.input_group .text_group.right-icon input {
	padding-right:50px;
}
.input_group .text_group.right-icon i {
	display: block;
	width:20px;
	height: 20px;
	position: absolute;
	bottom:16px;
	right:16px;
}
.input_group.small .text_group.right-icon i {
	display: block;
	width:16px;
	height: 16px;
	position: absolute;
	bottom:12px;
	right:16px;
}
.input_group .text_group.left-icon input {
	padding-left:40px;
}
.input_group .text_group.left-icon i {
	display: block;
	width:20px;
	height: 20px;
	position: absolute;
	bottom:16px;
	left:16px;
}
.input_group.small .text_group.left-icon i {
	display: block;
	width:16px;
	height: 16px;
	position: absolute;
	bottom:12px;
	left:16px;
}
.input_group .text_group.right-icon i > img,
.input_group .text_group.left-icon i > img {
	display: block;
}
.input_group .text_group.right-txt input {
	padding-right:80px;
}
.input_group .text_group.right-txt span {
	display: block;
	position: absolute;
	bottom:14px;
	right:16px;
	text-align: right;
	font-size:16px;
}
.input_group .error-txt {
	display: none;
}
.input_group.error input, .input_group.error .text_group input:focus{
	border-color:var(--system-red) !important;
}
.input_group.error .error-txt {
	color:var(--system-red);
	display: block;
	margin-top:4px;
	font-size:13px;
	margin-left:8px;
	text-align: left;
}

.input_group .input-btn {
	position: absolute;
	top:0;
	right:0;
	width:40px;
	height: 40px;
	background: url(../images/icon-16-calendar.svg) no-repeat center;
	font-size:0;
}
@media (max-width: 900px) {
	.input_group.small .text_group input {
		height: 36px;
		font-size:14px;
		border-radius:4px;
	}
	.input_group.small .text_group.left-icon i {
		bottom:10px;
	}
}
/*textarea*/
.input_group textarea {
	border:1px solid var(--gray30);
	padding:16px;
	width: 100%;
	border-radius: 8px;
	overflow: auto;
	min-height:120px;
	resize: none;
	display: block;
	font-size:16px;
	line-height: 150%;
	position: relative;
}
.input_group .count-on textarea {
	padding:16px;
}
.input_group textarea:focus {
	border-color: var(--gray130) !important;
}
.input_group.error textarea, .input_group.error .text_group textarea:focus {
	border-color: var(--system-red) !important;
}



/* ==================== Selectbox Custom ==================== */
.selectbox_group {
	display: flex;
	flex-direction: column;
	position: relative;
}
.selectbox_group label {
	font-size: 14px;
	font-weight: 500;
	margin-bottom:5px;
	line-height: 150%;
	color:var(--gray130);
	display: block;
}
.selectbox_group select {
	position: relative;
	width: 100%;
    border-radius: 8px;
    border: 1px solid var(--gray30);
    height: 50px;
    padding: 0 36px 0 16px;
    font-size: 16px;
    font-weight: 300;
	color: var(--gray70);
	background: url(../images/icon-16-arrow-down.svg) rgba(255,255,255,1) no-repeat calc(100% - 16px) center;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}
.selectbox_group select:valid{
    color: var(--gray130);
}
.selectbox_group.readonly select {
	background: var(--gray30);
	color: var(--gray130);
	border-radius: 8px;
}
.selectbox_group.small select {
	height: 40px;
	border-radius: 6px;
	padding:0 32px 0 16px;
	font-size:15px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	background: url(../images/icon-12-arrow-down.svg) rgba(255,255,255,1) no-repeat calc(100% - 10px) center;
}
@media (max-width: 900px) {
	.selectbox_group.small select {
		height: 36px;
		font-size:14px;
		border-radius: 4px;
	}
}


/* ==================== Checkbox ==================== */
.checkbox_group input[type="checkbox"]{
  display:none;
}
.checkbox_group input[type="checkbox"] ~ label{
    cursor:pointer;
    display: flex;
    align-items: center;
	-webkit-transition-duration:0.2s;
	-webkit-transition-timing-function:ease;
	transition-duration:0.2s;
	transition-timing-function:ease;
 }
.checkbox_group input[type="checkbox"] ~ label > span{
	vertical-align: middle;
	padding-left: 6px;
	font-size: 15px;
	font-weight: 400;
	color:var(--gray130);
 }
.checkbox_group input[type="checkbox"] ~ label:before{
  content:"";
  display:inline-block;
  width:24px;
  height:24px;
  background: url(../images/icon-24-check-disable.svg);
  }
.checkbox_group.readonly input[type="checkbox"] ~ label:before {
	opacity: .3;
}
.checkbox_group input[type="checkbox"]:checked ~ label > span {
	color:var(--gray130);
	font-weight: 400;
}
.checkbox_group input[type="checkbox"]:checked ~ label:before {
  content:"";
  background: url("../images/icon-24-check-fill.svg");
  background-position: 50%;
}
.checkbox_group.line input[type="checkbox"]:checked ~ label:before {
  content:"";
  background: url("../images/icon-24-check-line.svg");
  background-position: 50%;
}
.checkbox_group.small input[type="checkbox"] ~ label > span {
  font-size:14px;
  padding-left:4px;
}
.checkbox-btn-group > div {
	gap:8px;
}
.checkbox-btn-group .checkbox_group {
	width:100%;
}
.checkbox-btn-group .checkbox_group input[type="checkbox"] ~ label:before {
	display: none;
}
.checkbox-btn-group .checkbox_group label {
	justify-content: center;
    font-size: 16px;
    height: 50px;
    border-radius: 8px;
    background: var(--gray20);
    color: var(--gray90);
	font-weight: 500;
	-webkit-transition-duration:0.2s;
	-webkit-transition-timing-function:ease;
	transition-duration:0.2s;
	transition-timing-function:ease;
}
.checkbox-btn-group .checkbox_group input[type="checkbox"]:checked ~ label {
	background: #fff;
    color: var(--main);
    box-shadow: inset 0 0 0 1px var(--main);
}
.checkbox-btn-group > .label {
	font-size: 14px;
    font-weight: 500;
    margin-bottom: 5px;
    line-height: 150%;
    color: var(--gray130);
    display: block;
}
@media (max-width: 900px) { 
	.checkbox_group input[type="checkbox"] ~ label > span {
		font-size:14px;
	}
}


/* ==================== Radio Group ==================== */
.radio_group .label {
	font-size: 14px;
    font-weight: 500;
    margin-bottom: 5px;
    line-height: 150%;
    color: var(--gray130);
    display: block;
}
.radio_group .container {
    display: flex;
    align-items: center;
    position: relative;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.radio_group .container input {
    opacity: 0;
	display: none;
    cursor: pointer;
}
.radio_group .checkmark {
    position: absolute;
	left: 0;
    height: 24px;
    width: 24px;
    background:url(../images/icon-24-radio-unsel.svg);
    border-radius: 50%;
	-webkit-transition-duration:0.1s;
	-webkit-transition-timing-function:ease;
	transition-duration:0.1s;
	transition-timing-function:ease;
}
.radio_group .container input:checked ~ .checkmark {
     background:url(../images/icon-24-radio-sel.svg);
}
.radio_group .container input[disabled]:checked ~ .checkmark {
     background:url(../images/icon-24-radio-sel-disabled.svg);
}
.radio_group .container input[disabled] ~ .checkmark {
     background:url(../images/icon-24-radio-unsel-disabled.svg);
}
.radio_group .container .txt {
	font-size:16px;
	font-weight: 400;
	color:var(--gray70);
	display: block;
	margin-left:30px;
}
.radio_group .container input:checked ~ .txt {
	color: var(--gray130);
	font-weight: 400;
}
.radio_group.btn-type .btn {
	font-size:16px;
	height: 50px;
	border-radius: 8px;
	background: var(--gray20);
	color: var(--gray90);
	display: flex;
	align-items: center;
	justify-content: center;
	padding:0 10px;
	font-weight: 500;
    width: 100%;
}
.radio_group.btn-type input:checked ~ .btn {
	background: #fff;
	color: var(--main);
	border:1px solid var(--main);
}
.radio_group .flex-center .container {
	width:100%;
	margin-right:8px;
}
.radio_group .flex-center .container:last-child {
	margin-right:0;
}


/* ==================== Info Text ==================== */
.info-group {
	text-align:left;
}
.info-group > li {
	font-size: 14px;
    color: var(--gray70);
	margin-bottom:8px;
	line-height: 150%;
	position: relative;
    margin-left: 10px;
}
.info-group > li:last-child {
	margin-bottom:0;
}
.info-group > li::before {
    content: "";
    display: inline-block;
    width: 3px;
    height: 3px;
    border-radius: 99px;
    background-color: var(--gray70);
    vertical-align: middle;
    position: absolute;
    left: -10px;
	margin-top: 8px;
}
.info-group.large > li {
	color: var(--gray90);
	font-size: 16px;
}
.info-group.red > li {
	color: var(--system-red);
}
.info-group > li.red::before {
	background-color: var(--system-red);
}
.info-group.red > li::before {
	background-color: var(--system-red);
}


/* ==================== Search Fillter form ==================== */

.search-fillter-group {
	padding:24px 24px 20px;
	border:1px solid var(--gray30);
	background: var(--gray10);
	margin:20px 0 40px;
	border-radius: 16px;
}
.search-fillter-group .btn-search {
    display: flex;
    justify-content: center;
	margin-top:20px;
}
.search-fillter-group .btn-search  button {
	width:160px;
}
.search-fillter-group .inner .hide {
	display: none;
}
.search-fillter-group .inner.active .hide {
	display: flex;
	flex-direction: column;
}
.search-fillter-group .inner .accordion-btn {
	width:100%;
	border-radius: 8px;
	height: 44px;
	background: rgba(226,233,252,.6);
	display: flex;
    justify-content: center;
    align-items: center;
	font-size:0;
	margin-top:12px;
}
.search-fillter-group .inner .accordion-btn i {
	width:16px;
	height: 16px;
	display: block;
	margin-right:10px;
	background: url(../images/icon-16-right-main.svg) no-repeat center;
	transform: rotate(90deg);
	-webkit-transition-duration:0.2s;
	-webkit-transition-timing-function:ease;
	transition-duration:0.2s;
	transition-timing-function:ease;
}
.search-fillter-group .inner .accordion-btn::after {
	content:"상세 검색 펼치기";
	display: block;
	color: var(--main);
	font-size: 16px;
	font-weight: 700;
}
.search-fillter-group.bl-acdun-group .inner .accordion-btn::after {
	content:"B/L정보 상세 펼치기";
}
.search-fillter-group .inner.active .accordion-btn i {
	transform: rotate(-90deg);
}
.search-fillter-group .inner.active .accordion-btn::after {
	content:"상세 검색 닫기";	
}
.search-fillter-group.bl-acdun-group .inner.active .accordion-btn::after {
	content:"B/L정보 상세 숨기기";	
}

.search-fillter-group .inner article .half {
	display: flex;
	align-items: center;
	width: 100%;
}
.search-fillter-group .inner article .half > div:first-child {
	width:calc(100% - 467px);
}
.search-fillter-group .inner article .half > div:nth-child(2) {
	width:437px;
	margin-left:30px;
}
.search-fillter-group .inner article .item > .label {
	width:100px;
	font-size: 15px;
	line-height: 40px;
	font-weight: 600;
}
.search-fillter-group .inner article .item > .small-label {
	width:68px;
	color:var(--gray100);
	font-weight: 400;
	font-size: 15px;
	line-height: 40px;
}
.search-fillter-group .inner article > div {
	margin-bottom:10px;
}
.search-fillter-group .inner .item {
	display: flex;
	align-items: flex-start;
}
.search-fillter-group .inner .selectbox_group {
	width:171px;
}
.search-fillter-group .inner .selectbox_group + div {
	width:calc(100% - 177px);
}.search-fillter-group .inner .selectbox_group.w-120 + div {
	width:calc(100% - 126px);
}
.search-fillter-group .inner .item > .label + div {
	width: calc(100% - 100px);
}
.search-fillter-group .inner article .item > .small-label + div {
	width: calc(100% - 68px);
}
.search-fillter-group .inner .item .flex-center {
	gap:6px;
}

.search-fillter-group .inner .item .btn-group {
	width:437px;
	margin-left:24px;
	display: flex;
	align-items: center;
}
.search-fillter-group .inner .half-50 .item > .btn-group {
	width:100%;
	margin-left:0;
	gap:6px;
}
.search-fillter-group .inner .half-50 .item > .btn-group button {
	width:100%;
}
.search-fillter-group .inner .item .btn-set-item {
	display: flex;
	align-items: center;
}
.search-fillter-group .inner .item .btn-set-item > .flex-center {
	display: flex;
	gap:6px;
	width:calc(100% - 467px);
}
.search-fillter-group .inner .item .btn-set-item .btn-group {
	gap:6px;
}
.search-fillter-group .inner .item .btn-set-item .btn-group button {
	width:100%;
}
.search-fillter-group .inner .item .check-area {
	background: #fff;
	border-radius: 6px;
	box-shadow: inset 0 0 0 1px var(--gray30);
	padding:8px 16px;
	display: flex;
	flex-wrap: wrap;
    justify-content: flex-start;
	min-height: 40px;
	gap:16px;
	row-gap: 10px;
}
.search-fillter-group .inner .item .check-area .checkbox_group {
	width:143px;
}
.search-fillter-group .inner .item .check-area.w-auto {
	gap:24px;
}
.search-fillter-group .inner .item .check-area.w-auto.gap-44 {
	gap:44px;
}
.search-fillter-group .inner .item .check-area.w-auto .checkbox_group {
	width:auto;
}
.search-fillter-group .inner .item .check-area.w-20per,
.search-fillter-group .inner .item .check-area.w-33per {
	gap:0;
}
.search-fillter-group .inner .item .check-area.w-20per .checkbox_group {
	width:20%;
}
.search-fillter-group .inner .item .check-area.w-33per .checkbox_group {
	width:33.33%;
}
.search-fillter-group .inner .item .checkbox_group.mr-16 {
	margin-right:16px;
}
.search-fillter-group .inner .half-50 {
	display: flex;
    align-items: center;
    width: 100%;
	gap:30px;
}
.search-fillter-group .inner .half-50 > div {
	width:50% !important;
}
.search-fillter-group .inner .radio_group {
	background: #fff;
    border-radius: 6px;
    box-shadow: inset 0 0 0 1px var(--gray30);
    padding: 8px 16px;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    min-height: 40px;
    gap: 14px !important;
    row-gap: 10px !important;
	position: relative;
}
.search-fillter-group .inner .radio_group .container .txt {
	font-size:15px;
}
.search-fillter-group .inner .radio_group .container {
	width: 106px;
}
.search-fillter-group .inner .radio_group .inner-btn {
	position: absolute;
	right:16px;
	top:9px;
	font-size:12px;
	display: flex;
	align-items: center;
	gap:4px;
	height: 22px;
	padding:0 8px;
	border-radius: 4px;
	font-weight: 500;
	justify-content: center;
}
.search-fillter-group .inner .radio_group .inner-btn > i {
	width:14px;
	height: 14px;
	display: block;
}
.search-fillter-group .inner .radio_group .inner-btn.fill-sub {
	color:#fff;
	background: var(--sub);
}
.search-fillter-group .inner .radio_group .inner-btn.fill-sub:hover {
	background: var(--sub90);
}
.search-fillter-group .inner .radio_group.w-auto .container {
	width:auto;
}



@media (max-width: 1350px) {
	.search-fillter-group .inner article .half {
		align-items: flex-start;
		flex-direction: column;
	}
	.search-fillter-group .inner article .half > div:nth-child(2) {
		margin-left:0;
		margin-top: 10px;
	}
	.search-fillter-group .inner article .item {
		width: 100% !important;
	}
	.search-fillter-group .inner article .item > .small-label {
		margin-left:100px;
	}
	.search-fillter-group .inner .item .check-area.w-auto,
	.search-fillter-group .inner .item .check-area.w-20per,
	.search-fillter-group .inner .item .check-area.w-33per {
		gap: 16px;
	}
	.search-fillter-group .inner .item .check-area.w-auto .checkbox_group,
	.search-fillter-group .inner .item .check-area.w-20per .checkbox_group,
	.search-fillter-group .inner .item .check-area.w-33per .checkbox_group {
		width:143px;
	}
	.search-fillter-group .inner .item .checkbox_group.mr-16 {
		margin-left: 100px;
	}
	.search-fillter-group .inner .item .btn-group {
		margin-left:6px;
		width:410px;
	}
	.search-fillter-group .inner .item .btn-set-item > .flex-center {
		width:calc(100% - 422px);
	}
}
@media (max-width: 1160px) {
	.search-fillter-group .inner .item .btn-set-item {
		align-items: flex-start;
		flex-direction: column;
	}
	.search-fillter-group .inner .item .btn-set-item > .flex-center {
		width:100%;
	}
	.search-fillter-group .inner .item .btn-group {
		margin:0;
		width:100%;
	}
}
@media (max-width: 900px) {
	.search-fillter-group {
		margin:0 0 20px;
		border-radius: 0;
		border:unset;
		border-bottom:1px solid var(--gray30);
		padding:16px;
	}
	.search-fillter-group .inner article .item > .label {
		line-height: 36px;
		width:80px;
		font-size:14px;
	}
	.search-fillter-group .btn-search {
		margin-top:12px;
	}
	.search-fillter-group .btn-search button {
		width:100%;
	}
	.search-fillter-group .inner .accordion-btn {
		height: 36px;
	}
	.search-fillter-group .inner .accordion-btn::after {
		font-size:14px;
	}
	.search-fillter-group .inner .accordion-btn i {
		width:12px;
		height: 12px;
		margin-right: 8px;
		background-size: 100%;
	}
	.search-fillter-group .inner .item > .label + div {
		width: calc(100% - 80px);
        align-items: flex-start;
        flex-direction: column;
	}
	.search-fillter-group .inner .item .checkbox_group.mr-16 {
        margin-left: 80px;
    }
	.search-fillter-group .inner .item .check-area {
		border-radius: 0;
		padding:0;
		min-height: unset;
		gap:0 !important;
		row-gap:10px !important;
		box-shadow: none;
		background: unset;
		display: flex!important;
		flex-wrap: wrap !important;
		justify-content: flex-start !important;
		flex-direction: row !important;
	}
	.search-fillter-group .inner .item .check-area .checkbox_group {
		width:50% !important;
	}
	.search-fillter-group .inner .item .btn-set-item > .flex-center {
		flex-direction: column;
		align-items: flex-start;
	}
	.search-fillter-group .inner .selectbox_group {
		width:100%;
	}
	.search-fillter-group .inner .selectbox_group + div {
		width:100%;
	}
	.search-fillter-group .inner .item .btn-set-item .btn-group {
		flex-wrap: wrap;
	}
	.search-fillter-group .inner .item .btn-set-item .btn-group button:nth-child(-n+4) {
		width:calc(25% - 4.5px);
	}
	.search-fillter-group .inner .item .btn-set-item .btn-group button:nth-child(n+5) {
		width:calc(50% - 3px);
	}
	.search-fillter-group .inner .item  .date-selector {
		display: flex;
		flex-wrap: wrap;
		gap:14px;
		row-gap:6px;
	}
	.search-fillter-group .inner .item  .date-selector .input_group:first-child {
		width:calc(100% - 30px);
	}
	.search-fillter-group .inner .item.small-label-group {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		padding-left: 80px !important;
		margin-top:6px !important;
		width: 100% !important;
	}
	.search-fillter-group .inner article .item.small-label-group .small-label {
		margin-left: 0px;
        font-size: 13px;
        margin-bottom: 6px;
        line-height: 20px;
        display: block;
	}
	.search-fillter-group .inner article .item > .small-label + div {
		width:100%;
	}
	.search-fillter-group .inner article > div {
		margin-bottom:0;
	}
	.search-fillter-group .inner .item:not(.m-none-border) {
		padding-bottom:24px;
		position: relative;
	}
	.search-fillter-group .inner .item:not(.m-none-border)::after {
		content:"";
		position: absolute;
		bottom:12px;
		left: 0;
		width:100%;
		height: 1px;
		background: var(--gray30);
	}
	.search-fillter-group .inner .item.check-item > .label {
		line-height: 24px;
	}
	.search-fillter-group .inner .item.m-none-border {
		border:none;
		margin-bottom:0;
		padding-bottom:0;
	}
	.search-fillter-group .inner article .half > div:nth-child(2) {
		margin-top:0;
	}
	.search-fillter-group .inner article .half > div.m-top8 {
		margin-top:8px !important;
	}

	.search-fillter-group .inner.active .hide {
		margin-top:12px;
		padding-top:12px;
		border-top:1px solid var(--gray30);
	}
}




/* ==================== Pagination ==================== */
.pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top:40px;
}
.pagination a {
	color: black;
	width:36px;
	height:36px;
	border-radius:99px;
	font-size: 16px;
	font-weight: 400;
	color: var(--gray60);
	display: flex;
	align-items: center;
    justify-content: center;
	margin-left:8px;
}
.pagination a.active {
	background-color: var(--main10);
	color: var(--main);
}
.pagination a:hover:not(.active) {
	background-color: var(--gray20);
	color: var(--gray100);
}
.pagination .next {
	font-size: 0;
	background: url("../images/icon-16-right-gray.svg") no-repeat center;
}
.pagination .prev {
	font-size: 0;
	background: url("../images/icon-16-right-gray.svg") no-repeat center;
	transform: rotate(180deg);
}
.pagination a:last-child {
	margin-left:0;
}
.pagination .first {
	font-size: 0;
	background: url("../images/icon-16-right-double-gray.svg") no-repeat center;
	transform: rotate(180deg);
}
.pagination .last {
	font-size: 0;
	background: url("../images/icon-16-right-double-gray.svg") no-repeat center;
}

@media (max-width: 1360px) {
	.pagination a {
		font-size:14px;
		margin-left:6px;
	}

}

@media (max-width: 900px) {
	.pagination {
		margin-top:30px;
	}
	.pagination a {
		font-size:14px;
		margin-left:2px;
	}
	.pagination .next, .pagination .prev, .pagination .first, .pagination .last {
		width:26px;
	}
}

/* ==================== file-uploader-group ==================== */
.file-uploader-group {
	width:100%;
}
.file-uploader-group .file-wrapper {
	width:100%;
	height: 130px;
	border-radius: 8px;
	border: 1.5px dashed var(--gray40);
	position: relative;
	-webkit-transition-duration:0.2s;
	-webkit-transition-timing-function:ease;
	transition-duration:0.2s;
	transition-timing-function:ease;
}
.file-uploader-group .file-wrapper input[type="file"] {
	position: absolute;
	top:0;
	left:0;
	width:100%;
	height: 100%;
	opacity: 0;
}
.file-uploader-group .file-wrapper .drag-txt-group {
	width: 100%;
    display: flex;
    align-items: center;
    flex-direction: column;
    height: 100%;
    justify-content: center;
}
.file-uploader-group .file-wrapper .drag-txt-group img {
	width:55px;
	display: block;
}
.file-uploader-group .file-wrapper .drag-txt-group .txt {
	color: var(--gray70);
	font-size: 15px;
	display: block;
	margin-top:16px;
}
.file-uploader-group .file-wrapper:hover {
	background: var(--gray10);
}
.file-uploader-group .file-list {
	margin-top:16px;
	gap:8px;
	display: flex;
	flex-direction: column;
}
.file-uploader-group .file-list li {
	width:100%;
	border-radius: 8px;
	border:1px solid var(--gray30);
	background: var(--gray20);
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0 0 0 46px;
	height: 46px;
	position: relative;
}
.file-uploader-group .file-list li::before {
	content:"";
	width:20px;
	height: 20px;
	background: url(../images/icon-20-file.svg) no-repeat center;
	margin-right:6px;
	position: absolute;
	left:20px;
}
.file-uploader-group .file-list li .file-name {
	font-size:15px;
	font-weight: 400;
	display: flex;
	align-items: center;
	overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    width: calc(100% - 100px);
}
.file-uploader-group .file-list li .file-name {

}
.file-uploader-group .file-list li .btn-del {
	font-size: 14px;
	font-weight: 400;
	color: var(--gray70);
	-webkit-transition-duration:0.2s;
	-webkit-transition-timing-function:ease;
	transition-duration:0.2s;
	transition-timing-function:ease;
	padding:12px 20px;
}
.file-uploader-group .file-list li .btn-del:hover {
	color: var(--gray100);
}
@media (max-width: 900px) {
	.file-uploader-group .file-list li {
		padding: 0 0 0 42px;
	}
	.file-uploader-group .file-list li::before {
		left:16px;
	}
	.file-uploader-group .file-list li .file-name {
		font-size:14px;
	}
	.file-uploader-group .file-list li .btn-del {
		font-size:13px;
		padding:12px 16px;
	}
}

/* ==================== Modal ==================== */
/*모달 팝업 modal popup*/
.modal {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: -1;
  opacity: 0;
  transition-duration: 0.1s;
}
.modal.show {
  opacity: 1;
  z-index: 999;
  transition-duration: 0.15s;
}
.modal .modal_container {
  display: flex !important;
  align-items: center;
  height: 100%;
  width: 100%;
  justify-content: center;
}
.modal .modal_container .modal_box {
  background: #fff;
  width:560px;
  overflow: auto;
  position: relative;
  border-radius: 8px;
}
.modal .modal_container .modal_box.w-1380 {
	width:1380px;
}
.modal .modal_container .modal_box.w-1000 {
	width:1000px;
}
.modal .modal_container .modal_box.w-900 {
	width:900px;
}
.modal .modal_container .modal_box.w-760 {
	width:760px;
}
.modal .modal_container .modal_box.w-500 {
	width:500px;
}
.modal.full  .modal_box {
    height: 100vh;
	border-radius: 0;
}
.modal.full .modal_header + .modal_content {
	margin-top:60px;
	max-height: none;
}
.modal .modal_container .modal_header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px 0 24px;
    width: 100%;
    height: 64px;
    box-shadow: inset 0 -1px 0 0 var(--gray30);
}
.modal.full .modal_container .modal_header {
	padding: 0 12px 0 16px;
    height: 60px;
	background: #fff;
	z-index: 999;
}
.modal .modal_container .modal_header .tit {
	display: flex;
	align-items: center;
    font-size: 20px;
    font-weight: 700;
    line-height: 130%;
}
.modal .modal_container .modal_header .btn_close {
	width: 32px;
	height: 32px;
	background: url("../images/icon-24-close.svg") no-repeat center;
	background-size:24px;
	font-size:0;
	border-radius: 99px;
	-webkit-transition-duration:0.2s;
	-webkit-transition-timing-function:ease;
	transition-duration:0.2s;
	transition-timing-function:ease;
}
.modal .modal_container .modal_header .btn_close:hover {
	background-color: var(--gray20);
	background-size:18px;
}
.modal .modal_content {
    max-height: 80vh;
    overflow: auto;
}
.modal .modal_header + .modal_content {
	padding:24px;
}
.modal .modal_content2 {
    max-height: 80vh;
    overflow: auto;
}
.modal .modal_header + .modal_content2 {
	padding:0px;
}
.modal .modal_content .body-txt {
	color: var(--gray130);
	font-size:16px;
	padding:0 16px;
	line-height: 150%;
	font-weight: 300;
}

/* 알림 모달 팝업 스타일 */
#alertModalMessage {
	color: var(--gray130);
	font-size: 16px;
	line-height: 150%;
	text-align: center;
	padding: 10px 0;
	word-break: keep-all;
	word-wrap: break-word;
}

#md-alertModal .modal_content {
	padding: 20px 24px;
}

#md-alertModal .item {
	display: flex;
	justify-content: center;
}

#md-alertModal .inner {
	width: 100%;
}

.modal .modal_container .modal_header.large-center {
	height: 74px;
	position: relative;
	justify-content: flex-end;
}
.modal .modal_container .modal_header.large-center .tit {
	position: absolute;
	left: 50%;
	top:50%;
	transform: translate(-50%, -50%);
	font-size:28px;
}
#md-resetpw .modal_header + .modal_content {
    padding: 0px 24px 24px; /* 특정 모달 스타일 */
}
.mypage-wrap .mypage-group .inner .item > .label + div {
		width: calc(100% - 80px);
        align-items: flex-start;
        flex-direction: column;
	}
.mypage-wrap .mypage-group .inner .radio_group .inner-btn > i {
	width:13px;
	height: 13px;
	display: block;
}
.mypage-wrap .mypage-group .inner .radio_group .inner-btn.fill-sub {
	color:#fff;
	background: var(--sub);
}
.mypage-wrap .mypage-group .inner .radio_group .inner-btn.fill-sub:hover {
	background: var(--sub90);
}
.mypage-wrap .mypage-group .inner .radio_group.w-auto .container {
	width:auto;
}
.mypage-wrap .mypage-group .inner .radio_group .inner-btn {
	right:16px;
	top:9px;
	font-size:12px;
	display: flex;
	align-items: center;
	gap:4px;
	height: 22px;
	padding:0 8px;
	border-radius: 4px;
	font-weight: 500;
	justify-content: center;
}