@charset "utf-8";

html,
body {
	margin: 0;
	padding: 0;
}

body {
	-webkit-text-size-adjust: none;
	font-size: 16px;
	font-weight: normal;
	color: #222;
}

#ko,
#ko h1,
#ko h2,
#ko h3,
#ko h4,
#ko h5,
#ko h6,
#ko .ui-widget,
#ko .ui-widget input,
#ko .ui-widget select,
#ko .ui-widget textarea,
#ko .ui-widget button {
	font-family: Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif;
}

#ui-datepicker-div {
	z-index: 10 !important;
	font-size: 14px;
}
.ui-widget button.btn-md {
	font-size: 14px;
}
.ui-widget button.btn-xs {
	font-size: 12px !important;
}
img.img {
	vertical-align: middle;
}
b, strong {
	font-weight: 600;
}
ul.ul,
dl.dl,
ol.ol {
	overflow: hidden;
	margin: 0;
	padding: 0;
}
ul.ul li.li,
ol.ol li.li {
	margin: 0;
	padding: 0;
	list-style: none;
}
dl.dl dt.dt,
dl.dl dd.dd {
	margin: 0;
	padding: 0;
}
ul.ul li.li:after,
ol.ol li.li:after,
dl.dl dd.dd:after {
	display: block;
	clear: both;
	content: "";
}

.color-red {
	color: #ff6565 !important;
}
.color-blue {
	color: #007aff !important;
}
.color-black {
	color: #222 !important;
}
.color-orange {
	color: #f83500 !important;
}
.color-green {
	color: #00ff00 !important;
}
.color-aqua {
	color: #00ffff !important;
}
.color-pink {
	color: #ff0099 !important;
}

.font-xs {
	font-size: 12px;
}
.font-sm {
	font-size: 13px;
}
.font-md {
	font-size: 17px;
}
.font-lg {
	font-size: 24px;
}
.font-bold {
	font-weight: 500;
}

.text-left {
	text-align: left !important;
}
.text-center {
	text-align: center !important;
}
.text-right {
	text-align: right !important;
}
.text-inline {
	display: inline-block;
	font-weight: normal;
	margin: 0;
}
.text-inline input[type=text] {
	vertical-align: middle;
	margin-left: 3px;
}

.text-overflow {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.text-overflow-full-wrap {
	display: table;
	table-layout: fixed;
	width: 100%;
}
.text-overflow-full {
	display: table-cell;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}
.text-overflow-2 {
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp: 2;
    overflow:hidden;
    text-overflow:ellipsis;
}
.text-through {
	text-decoration: line-through;
}
.word-break {
	word-break: break-all !important;
}
.word-keep {
	word-break: keep-all !important;
}
.box-overflow-auto {
	overflow-y: auto;
}
.block {
	display: block;
}
.inline-block {
	display: inline-block;
}

.vertical-top {
	vertical-align: top !important;
}
.vertical-middle {
	vertical-align: middle !important;
}
.vertical-bottom {
	vertical-align: bottom !important;
}

.required-addon {
	font-family: Verdana, sans-serif;
	font-weight: 500;
	color: var(--second-color);
	vertical-align: middle;
	margin-left: 2px;
}

p.description {
	margin: 5px 0;
	padding: 0;
}
span.description {
	padding-left: 10px;
}

.no-count {
	width: 100%;
	text-align: center;
}
li.no-count {
	 overflow: hidden;
	 clear: both;
	 width: 100%;
	 padding: 40px 0;
	 color: #666;
	 text-align: center;
	 list-style: none;
}
table td.no-count {
	padding: 20px 0 !important;
	text-align: center;
}

.no-thumb {
	background: url('/imgs/system/no-thumb@2x.png') no-repeat 50% 55% #fafafa;
	background-size: 18px;
}

.list-top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 40px;
	margin-bottom: 14px;
}
.page-info {
	color: var(--font-color);
	font-size: 13px;
}
.page-info strong {
	color: #222;
	font-weight: 600;
}
.page-list .type-select {
	height: 40px;
}

.help-block {
	color: #333;
}
.help-block + .help-block {
	margin-top: -8px;
}

/* FORM DESIGN */
.input-group {
	display: flex;
	align-items: center;
	gap: 4px;
	width: 100%;
	color: var(--font-color);
}
.input-group .type-text,
.input-group .type-select {
	width: 100%;
}
.input-group .addon {
	flex: 1 0 120px;
}

.type-text {
	margin: 0;
	color: #222;
	font-size: 14px;
	font-weight: 500;
	border: solid 1px var(--line-color);
	border-radius: var(--sub-radius);
	outline: none;
	transition: border-color 0.5s;
}
input.type-text {
	height: 50px;
	padding: 5px 10px;
}
textarea.type-text {
	padding: 10px;
	max-width: 100%;
}
input.wide,
textarea.wide {
	width: 100%;
}
input.half,
textarea.half {
	width: 48%;
}
input.type-text,
select {
	vertical-align: middle;
}
.type-select {
	width: auto;
	height: 50px;
	border-color: var(--line-color);
	border-radius: var(--sub-radius);
	background: #fff;
	outline: none;
	color: var(--font-color);
	font-size: 14px;
	font-weight: 500;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	-ms-expand {
		display: none;
	}
	background: url('/imgs/system/icon/select.png') no-repeat right 10px center;
	background-size: 8px;
	padding-right: 30px;
	padding-left: 10px;
	transition: border-color 0.5s;
}
.type-text:focus,
.type-select:focus {
	outline: none;
	border-color: var(--main-color);
}
select option {
	font-weight: normal;
}
input.datepicker {
	width: 90px;
	background: url("/imgs/system/icon/calendar.png?v=1") no-repeat right 10px center;
	background-color: #fff;
	padding-right: 40px;
}
input.type-text[readonly],
select[disabled] {
	background-color: #f7f7f7;
	border-color: var(--line-color) !important;
}
input.number {
	text-align: right;
}
input.type-checkbox {
	width: 18px;
	height: 18px;
}
input.type-radio {
	width: 18px;
	height: 18px;
}
input[type=file] {
	display: inline;
	vertical-align: middle;
	font-size: 13px;
}
label.placeholder {
	color: #b0b0b0 !important;
	font-weight: 400;
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
	color: #b0b0b0 !important;
	font-weight: 400;
}
input:-moz-placeholder,
textarea:-moz-placeholder {
	color: #b0b0b0 !important;
	font-weight: 400;
}

/* DESIGN CHK + RADIO */
.custom-input {
	display: inline-flex;
	align-items: center;
	cursor: pointer;
	font-size: 14px;
	font-weight: 600;
	color: var(--font-color);
	user-select: none;
	margin: 0;
}
.custom-input + .custom-input {
	margin-left: 20px;
}
.custom-input input {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	width: 18px;
	height: 18px;
	border: 1px solid #ddd;
	background: #fff;
	cursor: pointer;
	margin: 0;
	position: relative;
	outline: none;
	flex-shrink: 0;
	transition: border-color 0.2s, background 0.2s;
	outline: none !important;
}
.custom-input input[type="checkbox"] {
	border-radius: 4px;
}
.custom-input input[type="radio"] {
	border-radius: 50%;
}
.custom-input input:checked[type="checkbox"] {
	background: url('../imgs/checkbox-on@2x.png') no-repeat center/contain;
	background-size: 18px;
	border-color: transparent;
	border: none;
}
.custom-input input:checked[type="radio"] {
	background: url('../imgs/radio-on@2x.png') no-repeat center/contain;
	background-size: 18px;
	border-color: transparent;
	border: none;
}
.custom-input input:disabled {
	background: #eee;
	cursor: not-allowed;
	opacity: 0.5;
}
.custom-input span {
	white-space: nowrap;
	margin-left: 6px;
	line-height: 18px;
}

/* BUTTON */
.btn {
	font-size: 12px;
	border-radius: 0;
	position: relative;
	text-align: center;
	line-height: normal;
	text-decoration: none;
	outline: none !important;
	transition: opacity 0.3s;
	box-shadow: none !important;
}
.btn:hover {
	opacity: 0.7;
}
.btn.wide {
	width: 100%;
}
.btn-xs {
	font-size: 13px;
	font-weight: 500;
	padding: 0 10px;
	height: 30px;
	line-height: 30px;
	border-radius: var(--sub-radius);
}
.btn-sm {
	font-size: 13px;
	font-weight: 600;
	border-radius: var(--sub-radius);
	min-width: 100px;
	height: 40px;
	line-height: 40px;
	padding: 0 10px;
}
.btn-md {
	font-size: 15px;
	font-weight: 600;
	border-radius: var(--sub-radius);
	min-width: 120px;
	height: 50px;
	line-height: 50px;
	padding: 0 25px;
}
.btn-md.btn-default {
	font-weight: 500;
}
.btn-lg {
	min-width: 280px;
	height: 55px;
	line-height: 55px;
	padding: 0 30px;
	font-size: 15px;
	font-weight: 600;
	border-radius: var(--radius);
}
.btn-submit,
.btn-submit:focus {
	background-color: var(--main-color);
	border-color: var(--main-color);
	color: #fff !important;
}
.btn-secondary,
.btn-secondary:focus {
	background-color: #fff;
	border-color: var(--second-color);
	color: var(--second-color) !important;
}
.btn-dark,
.btn-dark:focus {
	background-color: var(--font-color);
	border-color: var(--font-color);
	color: #fff !important;
}
.btn-default,
.btn-default:focus,
.btn-default:hover {
	background-color: #f7f7f7 !important;
	border-color: var(--line-color) !important;
	color: #636363 !important;
}
.btn-white,
.btn-white:focus {
	background-color: #fff;
	border-color: var(--line-color);
	color: #636363 !important;
}
.btn-blue,
.btn-blue:focus {
	background-color: #007aff;
	border-color: #007aff;
	color: #fff !important;
}
.btn-danger,
.btn-danger:focus,
.btn-danger:hover {
	background-color: #fff !important;
	border-color: #fa2222;
	color: #fa2222 !important;
}
.btn-warning,
.btn-warning:focus,
.btn-warning:hover {
	background-color: #ff9634 !important;
	border-color: #ff9634 !important;
	color: #fff !important;
}
.btn.active,
.btn:active {
	box-shadow: none;
	outline: none;
}

/* PAGINATION */
.pagination {
	clear: both;
	width: 100%;
	margin: 0;
	padding: 10px 0;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
	margin-top: 30px;
}
.pagination * {
	margin: 0;
	padding: 0;
}
.pagination a,
.pagination strong {
	display: block;
	position: relative;
	color: #bec3cc;
	text-decoration: none;
	vertical-align: middle;
	line-height: normal;
}
.pagination a:hover,
.pagination a:active,
.pagination a:focus {
	background-color: none !important;
}
.pagination strong {
	color: var(--main-color);
	font-weight: bold;
}
.pagination span a {
	font-weight: normal !important;
	white-space: nowrap;
}
.pagination span a:hover,
.pagination span a:active,
.pagination span a:focus {
	text-decoration: none;
}
.pagination .prev a {
	border-left: none !important;
	text-indent: -9999px;
	width: 13px;
	height: 10px;
	background: url('../imgs/pagination-prev.png') no-repeat 0 0;
}
.pagination .next a {
	border-right: none !important;
	text-indent: -9999px;
	width: 13px;
	height: 10px;
	background: url('../imgs/pagination-next.png') no-repeat 0 0;
}
.pagination .direction.prev {
}
.pagination .direction.next {
}
.pagination.a1 span {
	color: #bec3cc;
}
.pagination.a1 a,
.pagination.a1 strong {
	margin: 0;
	font-size: 14px;
	background-color: transparent;
}
.pagination.a1 span a {
	margin: 0;
}

/* TABLE */
/* table-form */
.table-form-wrap {
	border: 1px solid var(--line-color);
	border-radius: var(--radius);
	margin-bottom: 60px;
	padding: 30px;
}
table.table-form {
	width: 100%;
	margin: 0 0 10px 0;
	padding: 0;
	border-spacing: 0;
	border-collapse: collapse;
	table-layout: fixed;
}
table.table-form th,
table.table-form td {
	vertical-align: middle;
	border: none;
	word-break: break-all;
}
table.table-form th {
	font-size: 15px;
	font-weight: 500;
	color: #222;
	text-align: left;
	vertical-align: top;
	padding-top: 25px;
}
table.table-form td {
	background-color: #fff;
	height: 70px;
}
table.table-form tr.row-tall td {
	padding-top: 10px;
}
table.table-form tr.part-space td {
	height: 10px;
	margin: 0;
	padding: 0;
	border-left: none;
	border-right: none;
	border-bottom: none;
}
table.table-form .checkbox, .radio {
	margin-top: 5px;
	margin-bottom: 5px;
}
table.table-form .help {
	color: var(--font-color);
	font-size: 14px;
	margin: 8px 0 0;
	position: relative;
	padding-left: 22px;
}
table.table-form .help:before {
	content: '';
	display: block;
	width: 10px;
	height: 7px;
	position: absolute;
	left: 4px;
	top: 7px;
	background: url('../imgs/form-help.png') no-repeat 0 0;
}
table.table-form .help.customs {
	display: flex;
	gap: 10px;
	color: #bec3cc;
}
table.table-form .help.customs .title {
	color: #007aff;
	text-decoration: underline;
}

/* table-view */
table.table-view {
	width: 100%;
	margin: 0 0 10px 0;
	padding: 0;
	border-spacing: 0;
	border-collapse: collapse;
	table-layout: fixed;
}
table.table-view th,
table.table-view td {
	padding: 5px 15px;
	vertical-align: middle;
	border: solid 1px var(--line-color);
	border-width: 1px 0;
	word-break: break-all;
	height: 50px;
}
table.table-view th {
	text-align: center;
	font-size: 14px;
	font-weight: 600;
	position: relative;
	color: var(--font-color);
}
table.table-view th:before {
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	background: #f7f7f7;
	border: 4px solid #fff;
	border-width: 4px 0;
	position: absolute;
	left: 0;
	top: 0;
	z-index: -1;
}
table.table-view td {
	background-color: #fff;
	font-size: 14px;
}
table.table-view tr.part-space td {
	height: 10px;
	margin: 0;
	padding: 0;
	border-left: none;
	border-right: none;
	border-bottom: none;
}

/* table-list */
table.table-list {
	width: 100%;
	margin: 0 0 10px 0;
	padding: 0;
	border-spacing: 0;
	border-collapse: collapse;
	table-layout: fixed;
}
table.table-list th,
table.table-list td {
	margin: 0;
	vertical-align: middle;
	border: solid 1px var(--line-color);
	border-width: 1px 0;
	text-align: center;
	word-break: break-all;
}
table.table-list th {
	background-color: #f7f7f7;
	font-weight: 500;
	color: var(--font-color);
	font-size: 15px;
	height: 50px;
	padding: 7px 5px 5px;
}
table.table-list td {
	color: var(--font-color);
	height: 70px;
	padding: 12px 10px;
}
table.table-list th a {
	color: #007aff;
	font-weight: 500;
}
table.table-list td a,
table.table-list td.color-black,
table.table-list td .color-black {
	color: #222;
	font-weight: 500;
}
table.table-list th .btn-link {
	padding: 3px 5px;
	font-size: 12px;
	font-weight: 500;
	display: inline;
	-webkit-user-select: all;
	-moz-user-select: all;
	-ms-user-select: all;
}
table.table-list td {
	background-color: #fff;
}
table.table-list .btn-link {
	padding: 3px 6px;
}

/* color */
table.table-list tbody tr.highlight-primary td {
	background-color: #dee8f8;
}
table.table-list tbody tr.highlight-success td {
	background-color: #eefce3;
}
table.table-list tbody tr.highlight-info td {
	/*background-color: #def8f8;*/
	background-color: #f2f4f6;
}
table.table-list tbody tr.highlight-warning td {
	background-color: #fcf8e3;
}
table.table-list tbody tr.highlight-danger td {
	background-color: #fce3e3;
}
table.table-list-border {
	border: solid 1px #d6d6d6;
}
table.table-list-border th,
table.table-list-border td {
	border: solid 1px #d6d6d6;
}
table.table-hover tbody tr td {
	transition: background-color 0.3s;
}
table.table-hover tbody tr:hover td {
	background-color: #fafafa;
}

/* POPUP DIALOG */
.common-layer {
	border-radius: var(--radius);
	background: #fff;
	font-family: sans-serif;
	font-size: 14px;
	letter-spacing: 0;
	margin: 0;
	padding: 0;
	box-shadow: 0 0 20px #aaa;
}
.common-layer .ui-dialog-titlebar {
	font-size: 22px;
	font-weight: 600;
	color: #222;
	height: 80px;
	background: none;
	border: none;
	padding: 25px 30px 0 30px;
	border-radius: 0;
	border-bottom: 1px solid var(--line-color);
}
.common-layer .ui-dialog-titlebar-close {
	position: absolute;
	display: block;
	width: 80px;
	height: 80px;
	right: 0;
	top: 0;
	margin: 0;
	border-radius: 0;
	vertical-align: middle;
	text-indent: -9999px;
	background: transparent;
	border: none;
}
.common-layer .ui-dialog-titlebar-close:before {
	position: absolute;
	left: 50%;
	top: 50%;
	content: '';
	display: block;
	width: 28px;
	height: 28px;
	background: url('../imgs/popup-close.png') no-repeat 0 0;
	transform: translate(-50%, -50%);
}
.common-layer .ui-dialog-titlebar-close span {
	display: none;
}
.common-layer-no-title .ui-dialog-titlebar,
.common-layer-no-title .ui-resizable-handle {
	display: none;
}
.common-layer .ui-dialog-content {
	padding: 0;
}
.layer {
	position: relative;
	padding: 30px;
}
.layer a.btn-primary,
.layer a.btn-success,
.layer a.btn-info,
.layer a.btn-warning,
.layer a.btn-danger {
	color: #fff;
}
.layer a.btn-secondary {
	color: #f83500;
}

/* jquery ui extend */
.tooltip-text {
	border: none !important;
	box-shadow: none !important;
	background-color: #000;
	color: #fff;
	padding: 7px 7px 5px;
	font-size: 13px;
}
.tooltip-image {
	max-width: inherit;
	border: solid 1px #999 !important;
	border-radius: 0;
	box-shadow: none;
	padding: 0;
}
.tooltip-image img {
	max-width: 500px;
	max-height: 500px;
}

/* bootstrap extend */
.label {
	font-size: 13px;
	font-weight: 500;
	padding-top: 4px;
	vertical-align: middle;
}
.label-type {
	padding: 0;
	vertical-align: baseline;
}
.label-warning {
	color: #ff6101;
}
.label-danger {
	color: #c33;
}
.label-primary {
	color: #2677e5;
}
.label-shipping {
	color: var(--second-color);
}
.label-shopping {
	color: #0176d9;
}
.label-warehouse {
	color: #5cb85c;
}
.label-packing {
	color: #ff6101;
}
.label-mall {
	color: #5bc0de;
}

/* TAB MENU */
.tab-menu {
	display: flex;
	justify-content: center;
	align-items: center;
	list-style: none;
	padding: 0;
	margin-bottom: 30px;
}
.tab-menu li {
	position: relative;
	margin: 0 30px;
}
.tab-menu li a {
	font-size: 22px;
	font-weight: bold;
	color: #bec3cc;
	text-decoration: none;
	transition: all 0.3s;
	white-space: nowrap;
}
.tab-menu li:not(:last-child):before {
	content: '';
	display: block;
	width: 1px;
	height: 20px;
	background: var(--line-color);
	position: absolute;
	right: -30px;
	top: 6px;
}
.tab-menu li.active a {
	color: var(--main-color);
}
.tab-wrap .tab-content {
	display: none;
}
.tab-wrap .tab-content.active {
	display: block;
}

/* CAPSULE FORM */
.form-capsule-wrap {
	border: 1px solid var(--line-color);
	border-radius: var(--radius);
	background: #f7f7f7;
	padding: 30px;
	margin-bottom: 60px;
}
.form-capsule-wrap .form-capsule li + li {
	margin-top: 10px;
}
.form-capsule {
	list-style: none;
	padding: 0;
	margin: 0;
}
.form-capsule li {
	border: 1px solid var(--line-color);
	border-radius: var(--sub-radius);
	background: #fff;
	display: flex;
	height: 50px;
	overflow: hidden;
}
.form-capsule .title {
	font-size: 14px;
	font-weight: 500;
	color: var(--font-color);
	flex: 0 1 110px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-right: 1px solid var(--line-color);
}
.form-capsule .content {
	flex: 1;
	height: 100%;
	display: flex;
	align-items: center;
	overflow: hidden;
	padding: 0 20px;
}
.form-capsule .content .type-select,
.form-capsule .content .type-text,
.form-capsule .content .type-date {
	border: none;
	width: 100%;
}

/* full loading */
/* Absolute Center Spinner */
.loading {
	position: fixed;
	z-index: 999;
	height: 2em;
	width: 2em;
	overflow: visible;
	margin: auto;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}

/* Transparent Overlay */
.loading:before {
	content: '';
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: radial-gradient(rgba(20, 20, 20, .8), rgba(0, 0, 0, .8));

	background: -webkit-radial-gradient(rgba(20, 20, 20, .8), rgba(0, 0, 0, .8));
}

/* :not(:required) hides these rules from IE9 and below */
.loading:not(:required) {
	/* hide "loading..." text */
	font: 0/0 a;
	color: transparent;
	text-shadow: none;
	background-color: transparent;
	border: 0;
}

.loading:not(:required):after {
	content: '';
	display: block;
	font-size: 11px;
	width: 1em;
	height: 1em;
	margin-top: -0.5em;
	-webkit-animation: spinner 1500ms infinite linear;
	-moz-animation: spinner 1500ms infinite linear;
	-ms-animation: spinner 1500ms infinite linear;
	-o-animation: spinner 1500ms infinite linear;
	animation: spinner 1500ms infinite linear;
	border-radius: 0.5em;
	-webkit-box-shadow: rgba(255, 255, 255, 0.75) 1.5em 0 0 0, rgba(255, 255, 255, 0.75) 1.1em 1.1em 0 0, rgba(255, 255, 255, 0.75) 0 1.5em 0 0, rgba(255, 255, 255, 0.75) -1.1em 1.1em 0 0, rgba(255, 255, 255, 0.75) -1.5em 0 0 0, rgba(255, 255, 255, 0.75) -1.1em -1.1em 0 0, rgba(255, 255, 255, 0.75) 0 -1.5em 0 0, rgba(255, 255, 255, 0.75) 1.1em -1.1em 0 0;
	box-shadow: rgba(255, 255, 255, 0.75) 1.5em 0 0 0, rgba(255, 255, 255, 0.75) 1.1em 1.1em 0 0, rgba(255, 255, 255, 0.75) 0 1.5em 0 0, rgba(255, 255, 255, 0.75) -1.1em 1.1em 0 0, rgba(255, 255, 255, 0.75) -1.5em 0 0 0, rgba(255, 255, 255, 0.75) -1.1em -1.1em 0 0, rgba(255, 255, 255, 0.75) 0 -1.5em 0 0, rgba(255, 255, 255, 0.75) 1.1em -1.1em 0 0;
}

/* Animation */

@-webkit-keyframes spinner {
	0% {
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(360deg);
		-moz-transform: rotate(360deg);
		-ms-transform: rotate(360deg);
		-o-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

@-moz-keyframes spinner {
	0% {
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(360deg);
		-moz-transform: rotate(360deg);
		-ms-transform: rotate(360deg);
		-o-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

@-o-keyframes spinner {
	0% {
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(360deg);
		-moz-transform: rotate(360deg);
		-ms-transform: rotate(360deg);
		-o-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

@keyframes spinner {
	0% {
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(360deg);
		-moz-transform: rotate(360deg);
		-ms-transform: rotate(360deg);
		-o-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

/* toggle-switch */
.toggle-switch .toggle-checkbox input {
	display: none;
}
.toggle-switch .toggle-checkbox {
	position: relative;
	display: inline-block;
	width: 48px;
	height: 24px;
}
.toggle-switch .slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #fff;
	border: 1px solid #adb5bd;
	border-radius: 30px;
	transition: all 0.4s;
}
.toggle-switch .slider:before {
	position: absolute;
	content: "";
	width: 18px;
	height: 18px;
	left: 2px;
	top: 2px;
	background-color: #adb5bd;
	border-radius: 24px;
	transition: all 0.4s;
}
.toggle-switch input:checked + .slider {
	background-color: var(--main-color);
	border-color: var(--main-color);
}
.toggle-switch input:checked + .slider:before {
	background-color: #fff;
}
.toggle-switch input:checked + .slider:before {
	transform: translateX(24px);
}

/* quantity-area */
.quantity-area div {
	border: 1px solid #b2b2b2;
	width: 100%;
	background: #fff;
	text-align: center;
	display: table;
}
.quantity-area div input[type=text] {
	border: 1px solid #b2b2b2;
	border-top: none;
	border-bottom: none;
	width: 100%;
	text-align: center;
	height: 25px;
	border-radius: 0;
}
.quantity-area div a {
	display: table-cell;
	width: 25px;
	color: #000;
	text-decoration: none;
	vertical-align: middle;
	font-weight: 500;
	position: relative;
}
.quantity-area div a:before,
.quantity-area div a:after {
	content: "";
	display: block;
	background: #000;
	position: absolute;
}
.quantity-area div a.minus:before {
	width: 9px;
	height: 1px;
	left: 8px;
	top: 12px;
}
.quantity-area div a.plus:before {
	width: 9px;
	height: 1px;
	left: 7px;
	top: 12px;
}
.quantity-area div a.plus:after {
	width: 1px;
	height: 9px;
	left: 11px;
	top: 8px;
}
.quantity-area div a:hover {
	background: #efefef;
}

/* ADDRESS */
.global-address .address-user .type-text,
.global-address-biz .address-user .type-text {
	width: 100%;
}
.global-address .address-user .input-group .type-text,
.global-address-biz .address-user .input-group .type-text {
	width: 150px;
}
.global-address .address-user .address1,
.global-address-biz .address-user .address1 {
	margin: 5px 0;
}
.global-address .address-user-global .type-text {
	margin: 5px 0;
}
.address-book-area {
	margin-bottom: 20px;
}
.address-book-list {
	border: 1px solid var(--line-color);
	border-radius: var(--sub-radius);
	overflow: hidden;
	margin-top: 12px;
}
.address-book-list table {
	width: 100%;
}
.address-book-list table th,
.address-book-list table td {
	text-align: center;
	font-weight: 500;
	border-bottom: 1px solid var(--line-color);
}
.address-book-list table th {
	font-size: 12px;
	font-weight: 500;
	color: var(--font-color);
	padding: 11px 5px;
	position: relative;
}
.address-book-list table th:not(:last-child)::before {
	content: '';
	display: block;
	width: 1px;
	height: 18px;
	background: var(--line-color);
	position: absolute;
	right: 0;
	top: 11px;
}
.address-book-list table td {
	font-size: 13px;
	color: #222;
	padding: 12px 5px;
	height: auto;
}
.address-book-list table tr:last-child td {
	border-bottom: none;
}

#actionFrame {
	display:block;
}
.swiper-container {
	overflow:hidden;
}