.desk-api {
	background: #fff;
	color: #252a34;
	font-family: "Pretendard", "NanumGothic", sans-serif;
	font-size: 14px;
	line-height: 1.65;
	margin: -1px 0 0;
	padding: 0 0 92px;
}

.desk-api-hero {
	background: linear-gradient(120deg, #5591ff 0%, #3166e9 64%, #77d5ed 100%);
	color: #fff;
	height: 516px;
	text-align: center;
}

.desk-api-hero-inner {
	box-sizing: border-box;
	height: 100%;
	margin: 0 auto;
	padding: 34px 0 40px 0;
	width: 1000px;
}

.desk-api-hero p {
	color: #8ee5ff;
	font-size: 22px;
	font-weight: 600;
	margin: 0;
}

.desk-api-hero h1 {
	color: #fff;
	font-size: 50px;
	font-weight: 700;
	letter-spacing: -2px;
	line-height: 1.2;
	margin: 3px 0 12px;
}

.desk-api-image {
	align-items: center;
/* 	background: #eef4ff; */
	border: 1px dashed #a3bce9;
	box-sizing: border-box;
	color: #7195d0;
	display: flex;
	justify-content: center;
}

.desk-api-image-hero {
	background: none;
	border: none;
	color: #fff;
	height: auto;
	margin: 15px auto 20px auto;
	width: 386px;
}

.desk-api-image-hero img {
	display: block;
	height: auto;
	width: 100%;
}

.desk-api-hero-link,
.desk-api-bottom-link a {
	color: inherit;
	font-size: 25px;
	font-weight: 700;
	text-decoration: underline;
	text-underline-offset: 7px;
}

.desk-api-hero-link{
	color:#fff !important;
	font-size:25px;
}

.desk-api-hero-link span,
.desk-api-bottom-link span {
	font-size: 29px;
	font-weight: 400;
	vertical-align: -2px;
}

.desk-api-body {
	margin: 0 auto;
	width: 1000px;
}

.desk-api-tabs {
	background: #fff;
	border-radius: 30px;
	box-shadow: 0 6px 12px rgba(92, 119, 162, .16);
	display: flex;
	margin: 62px auto 66px;
	padding: 7px;
	width: fit-content;
}

.desk-api-tabs a {
	border-radius: 23px;
	color: #252a34;
	font-size: 15px;
	font-weight: 700;
	min-width: 115px;
	padding: 9px 14px;
	text-align: center;
	text-decoration: none;
}

.desk-api-tabs a.on {
	background: #e8f1ff;
	color: #3d83f7;
}

.desk-api-card {
	background: #f5f8ff;
	border-radius: 15px;
	box-sizing: border-box;
	margin-bottom: 46px;
	padding: 30px 37px;
}

.desk-api-card h2 {
	font-size: 20px;
	font-weight:600;
	margin: 0 0 13px;
}

.desk-api-card h2:before {
	color: #5796fa;
	content: "•";
	font-size: 25px;
	margin-right: 6px;
}

.desk-api-card p {
	margin: 0;
}

.desk-api-image-process {
	border: none;
	display: block;
	height: auto;
	margin: 30px auto 10px auto;
	max-width: 100%;
	width: 707px;
}

.desk-api-image-process img {
	display: block;
	height: auto;
	width: 100%;
}

.desk-api-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.desk-api-list li {
	margin: 3px 0;
}

.desk-api-list li:before {
	content: "- ";
}

.desk-api-use {
	padding-bottom: 0;
}

.desk-api-use-tabs {
	display: flex;
	justify-content: space-around;
	margin: 22px 28px 25px;
}

.desk-api-use-tabs span {
	color: #aaa;
	cursor: pointer;
	font-size: 16px;
	font-weight: 700;
	padding: 3px 0;
}

.desk-api-use-tabs span.on {
	border-bottom: 3px solid #4388ff;
	color: #4388ff;
}

.desk-api-image-use {
	background: #fff;
	border: none;
	height: 473px;
	margin: 40px auto 0 auto;
	width: 690px;
	padding-top:20px;
	border-top-left-radius: 20px 20px;
    border-top-right-radius: 20px 20px;
}

.desk-api-image-use img {
	display: block;
	height: auto;
	max-height: 100%;
	max-width: 100%;
}

.desk-api-bottom-link {
	color: #4388ff;
	margin: 56px 0 0;
	text-align: center;
}

.desk-api-manage {
	min-height: 1050px;
	padding-top: 1px;
}

.desk-api-manage .desk-api-tabs {
	margin-top: 78px;
}

.desk-api-terms-card {
	margin-left: auto;
	margin-right: auto;
	padding: 30px 37px 34px;
	width: 760px;
}

.desk-api-terms {
	margin-bottom: 30px;
	font-size: 12px;
	line-height: 1.72;
}

.desk-api-terms h3 {
	font-size: 13px;
	margin: 17px 0 2px;
}

.desk-api-terms p {
	margin: 0;
}

.desk-api-terms ul {
	list-style: none;
	margin: 19px 0 0;
	padding: 0;
}

.desk-api-terms ul:first-child {
	margin-top: 0;
}

.desk-api-agree {
	display: block;
	font-weight: 700;
	margin: 40px 0 0;
	text-align: center;
}

.check-select-box input[type="checkbox"] {
	display: none;
}

.check-select-box input[type="checkbox"] + label {
	cursor: pointer;
}

.check-select-box input[type="checkbox"] + label > b {
	background: #ff767d;
	border-radius: 50%;
	box-sizing: border-box;
	color: #fff;
	display: inline-block;
	height: 28px;
	line-height: 28px;
	margin-right: 5px;
	position: relative;
	text-align: center;
	text-indent: 0;
	vertical-align: middle;
	width: 28px;
}

.check-select-box input[type="checkbox"] + label > b:before {
	content: "";
	border: solid #fff;
	border-width: 0 2px 2px 0;
	display: block;
	height: 9px;
	left: 10px;
	position: absolute;
	top: 6px;
	transform: rotate(45deg);
	width: 5px;
}

.check-select-box input[type="checkbox"]:not(:checked) + label > b {
	background: #d8dce5;
}

.desk-api-form-table,
.desk-api-list-table,
.desk-api-detail-table {
	border-collapse: collapse;
	width: 100%;
}

.desk-api-form-table th,
.desk-api-form-table td,
.desk-api-list-table th,
.desk-api-list-table td,
.desk-api-detail-table th,
.desk-api-detail-table td {
	border-bottom: 1px solid #e5eaf1;
	padding: 10px 13px;
}

.desk-api-form-table th,
.desk-api-form-table td {
	border: 1px solid #e5eaf1;
}

.desk-api-form-table th {
	background: #edf4ff;
	text-align: center;
	width: 180px;
}

.desk-api input,
.desk-api select,
.desk-api button {
	border: 1px solid #d6deeb;
	border-radius: 5px;
	box-sizing: border-box;
	height: 34px;
	padding: 0 11px;
}

.desk-api button {
	background: #fff;
	color: #4e7fcf;
	cursor: pointer;
}

.desk-api button.primary {
	background: #5891f2;
	color: #fff;
}

.desk-api button.danger {
	background: #ff6970;
	color: #fff;
}

.desk-api-form-table input {
	width: 270px;
}

.desk-api-form-table input.short {
	width: 145px;
}

.desk-api-form-table select {
	margin-left: 8px;
	width: 160px;
}

.desk-api-request-card {
	margin-left: auto;
	margin-right: auto;
	padding: 30px 37px 40px;
	width: 760px;
}

.desk-api-request-card .desk-api-form-table {
	margin: 30px 0 0;
	width: 100%;
}

.desk-api-request-card .desk-api-form-table th,
.desk-api-request-card .desk-api-form-table td {
	padding: 8px 13px;
}

.desk-api-request-card .desk-api-form-table th {
	width: 170px;
}

.desk-api-request-card .desk-api-form-table input {
	width: 190px;
}

.desk-api-request-card .desk-api-form-table input.short {
	width: 115px;
}

.desk-api-request-card .desk-api-form-table select {
	width: 140px;
}

.desk-api-dot-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.desk-api-dot-list li {
	margin: 4px 0;
}

.desk-api-dot-list li:before {
	color: #5599ff;
	content: "•";
	margin-right: 8px;
}

.desk-api-code-tabs {
	display: flex;
	gap: 7px;
	margin: 0 0 15px;
}

.desk-api-code-tabs span,
.desk-api-code-tabs a {
	background: #fff;
	border-radius: 5px;
	color: #555;
	min-width: 48px;
	padding: 7px 18px;
	text-align: center;
	text-decoration: none;
}

.desk-api-code-tabs span.on {
	background: #5791f7;
	color: #fff;
}

.desk-api-code-tabs a {
	color: #5791f7;
	margin-left: auto;
}

.desk-api-code-sub-tabs {
	margin-bottom: 20px;
}

.desk-api pre {
	background: #293e52;
	border-radius: 5px;
	color: #fff;
	line-height: 1.55;
	margin: 15px 0 0;
	overflow: auto;
	padding: 20px;
}

.desk-api-note {
	background: #f1f6ff;
	border-radius: 8px;
	margin-bottom: 28px;
	padding: 14px 18px;
}

.desk-api-search-row {
	display: flex;
	gap: 8px;
	margin-bottom: 28px;
}

.desk-api-search-row select {
	width: 120px;
}

.desk-api-search-row input {
	width: 118px;
}

.desk-api-search-row button {
	padding: 0;
	width: 34px;
}

.desk-api-search-row button.primary {
	width: 82px;
}

.desk-api-search-row .desk-api-search-btn {
	background: #6faaf0 url(../img/content/b_search.png) no-repeat 9px 6px;
	border: none;
	font-size: 0;
	text-indent: -9999px;
}

.desk-api-search-row em {
	font-style: normal;
	line-height: 34px;
}

.desk-api-search-row .page-size {
	margin-left: auto;
	width: 120px;
}

.desk-api-list-table th {
	background: #eaf2ff;
}

.desk-api-list-table th,
.desk-api-list-table td {
	border: 1px solid #e1e6ee;
	padding: 10px;
	text-align: center;
}

.desk-api-list-table tbody tr {
	cursor: pointer;
}

.desk-api-list-table tbody tr:hover {
	background: #f8fbff;
}

.desk-api-success {
	color: #307eff;
}

.desk-api-fail {
	color: #ff525d;
}

.desk-api-paging {
	align-items: center;
	display: flex;
	gap: 18px;
	justify-content: center;
	margin-top: 42px;
}

.desk-api-paging span,
.desk-api-paging strong {
	align-items: center;
	display: inline-flex;
	height: 30px;
	justify-content: center;
	line-height: 1;
	min-width: 30px;
	box-sizing: border-box;
}

.desk-api-paging span {
	cursor: pointer;
}

.desk-api-paging strong {
	border: 1px solid #5893ff;
	border-radius: 4px;
	color: #4284ff;
}

.desk-api-modal {
	align-items: center;
	background: rgba(0, 0, 0, .38);
	display: none;
	inset: 0;
	justify-content: center;
	position: fixed;
	z-index: 9999;
}

.desk-api-modal.open {
	display: flex;
}

.desk-api-modal-box {
	background: #fff;
	border-radius: 14px;
	box-sizing: border-box;
	padding: 28px 32px 32px;
	position: relative;
	width: 850px;
}

.desk-api-modal-box h2 {
	font-size: 18px;
	margin: 0 0 28px;
}

.desk-api-modal-close {
	background: none;
	border: 0;
	color: #999;
	cursor: pointer;
	font-size: 30px;
	position: absolute;
	right: 20px;
	top: 12px;
}

.desk-api-detail-table th,
.desk-api-detail-table td {
	border: 1px solid #dde3eb;
	padding: 9px 14px;
}

.desk-api-detail-table th {
	background: #edf4ff;
	text-align: left;
	width: 120px;
}

.desk-api-image-small {
	font-size: 11px;
	height: 66px;
	width: 80px;
}

.desk-api-status-card {
	padding-bottom: 26px;
}

.desk-api-switch {
	background: #ddd;
	border-radius: 15px;
	cursor: pointer;
	display: inline-block;
	height: 20px;
	margin-right: 7px;
	vertical-align: middle;
	width: 38px;
}

.desk-api-switch:before {
	background: #fff;
	border-radius: 50%;
	box-shadow: 0 1px 2px #aaa;
	content: "";
	display: block;
	height: 16px;
	margin: 2px;
	width: 16px;
}

.desk-api-switch.on {
	background: #4a91ff;
}

.desk-api-switch.on:before {
	margin-left: 20px;
}

.desk-api-center {
	margin-top: 20px;
	text-align: center;
}

.desk-api-key-text {
	color: #3888fa;
	font-weight: 700;
	margin: 24px 0 !important;
}

.desk-api-inline-row {
	font-size: 13px;
	margin: 7px 0 !important;
}

.desk-api-card .desk-api-note,
.desk-api-card .desk-api-inline-row {
	max-height: 140px;
	opacity: 1;
	overflow: hidden;
	transition: max-height .25s ease, opacity .2s ease, margin .25s ease, padding .25s ease;
}

.desk-api-switch-off .desk-api-note,
.desk-api-switch-off .desk-api-inline-row {
	max-height: 0;
	opacity: 0;
	margin-bottom: 0 !important;
	margin-top: 0 !important;
	padding-bottom: 0;
	padding-top: 0;
}

.desk-api-inline-row input {
	height: 27px;
	margin-left: 8px;
	width: 120px;
}

.desk-api-inline-row button {
	height: 27px;
	margin-left: 5px;
	padding: 0 8px;
}
