html.scroll-stop {overflow-y:hidden; margin-right:18px;}
header .header-area { position: fixed; width: 100%; z-index: 9999; }
header .scroll-stop {width : calc(100% - 18px);}
.pre-hljs .hljs { padding: 20px 35px 20px 20px; white-space: pre-wrap; font-weight: 500; font-size: 14px; line-height: 1.5; word-spacing: 1px; }
.pre-hljs .copyButton { width: 19px; height: 21px; position: absolute; z-index: 2; top: 7px; right: 7px; text-align: center; cursor: pointer; font-size: 8px; background-image: url("/images/common/document/icon_copy_button.svg"); background-color: transparent; background-size: 100%; }
.pre-hljs .copyButton.copied::before { content: "Copied!"; font-size: 11px; background-color: rgb(64, 64, 64); border-radius: 3px; color: rgb(255, 255, 255); padding: 2px 7px 3px 8px; position: absolute; top: 26px; right: -19px; }

.document-wrapper { position: relative; display: flex; justify-content: center; padding: 24px 0 0; }
article { min-width: 962px; width: 962px; border: 1px solid rgb(222, 223, 226); min-height: calc(100vh - 220px); margin: 0 0 100px 250px; position: relative; border-radius: 10px; padding: 45px 40px 40px; font-size: 16px; color: #444; font-weight: 400; float: right; z-index: 1; }
article .breadcrumb-container { margin: 0 0 50px; }
article .breadcrumb-container{font-size : 13px;color : #5f6368;position: relative;display : flex;align-items: center; z-index: 2;}
article .breadcrumb-container .breadcrumb-box {display : flex;}
article .breadcrumb-container .breadcrumb-box span{display : flex;}
article .breadcrumb-container .breadcrumb-box span:after { content: ""; display: block; width: 5px; height: 8px; margin: 4px 10px 0 11px; background: url("/images/common/document/icon_bread_arrow.png") center/contain no-repeat;}
article .breadcrumb-container .breadcrumb-box span:last-child{color : #4d64e4;}
article .breadcrumb-container .breadcrumb-box span:last-child:after{display : none;}
article .breadcrumb-container .breadcrumb-box b{color : #4d64e4; font-weight: 400;}
article .framework-container{position: absolute; top : 50px; right : 40px; z-index: 2;}
article .framework-container ul{display: flex; justify-content: flex-end;}
article .framework-container ul li{margin : 0 0 0 7px;}
article .framework-container ul li a{display: inline-block; font-size : 15px; color : #333; padding : 7px 13px 8px; border : solid 1px #c9cacd; border-radius: 25px;}
article .framework-container ul li.active a{background-color : #f85c46; border-color : #f85c46; color : #fff; position: relative;}
article .framework-container ul li.active a:after{content:''; position: absolute; top : -10px; left : 50%; transform :translateX(-50%); display: block; width : 0; height: 0; border : solid 5px transparent; border-top-color : #f85c46;}
article section { margin: 0 0 80px; position: relative; scroll-margin-top : 124px;}
article section table tbody tr { scroll-margin-top : 114px; }
article section.alone-title-section{margin : 0 0 50px;}
article section:last-child { margin-bottom: 0; }
article section h1, article section h2, article section h3, article section h4, article section h6 { color: rgb(0, 0, 0); font-weight: 600; }
article section h1 { font-size: 38px; margin: 0 0 40px; word-spacing: -1px; padding-bottom: 30px; border-bottom: solid 1px #dedfe2;}
article section h2 { font-size: 38px; margin: 0 0 40px; word-spacing: -1px; }
article section h3 { font-size: 24px; margin: 0 0 30px; }
article section h3.aside-subtitle { margin-top : 80px; }
article section h4 {font-size: 18px;margin: 70px 0 12px; font-weight: 500;}
article section h4.only-text {margin-top: 40px;}
article section h4.result-code {margin-top: 50px;}
article section h5 {font-size: 17px;margin: 30px 0 12px; font-weight: 600;}
article section table + h5 {margin-top : 60px;}
article section h6 { font-size: 19px; margin: 0 0 8px; }
article section p {font-weight: 400; margin : 20px 0; line-height: 1.5;}
article section pre+p {margin-top : 30px;}
article section > h2 + p { margin-bottom: 20px; }
article section > h3 + p { margin-bottom: 20px; }
article section > h4 + p { margin : 15px 0; }
article section h4[id] {scroll-margin-top: 124px;}
article section strong { font-weight: 500; }
article section b { font-weight: 500; }
article section p + ul { margin: 0 0 0 19px; }
article section p.api-description + ul { margin: 0 0 0 0; }
article section p + ul > li {margin: 0 0 7px;}
article section p + ul > li:last-child { margin: 0; }
article section img + ul{margin-top : 20px;}
article section img + p {margin-top: 30px;}
article section ul > li {position: relative; padding-left: 19px; margin-bottom: 7px; line-height: 1.5;}
article section ul > li:last-child {margin-bottom: 0;}
article section ul > li::after { content: ""; display: block; width: 6px; height: 6px; background-color: rgb(0, 0, 0); position: absolute; top: 9px; left: 3px; border-radius: 100%; }
article section ul > li > p { margin: 3px 0 8px; }
article section ul > li > small{font-size : 15px;}
article section ul > li > h6 + p { margin-bottom: 20px; }
article section ul > li > h6 + p + h6 {margin-top : 30px;}
article section ul > li > ol {margin : 10px 0;}
article section ol > li {position: relative; padding-left: 19px; margin-bottom: 10px; line-height: 1.5;}
article section ol > li:last-child {margin-bottom : 0;}
article section ol > li > img {margin : 15px 0 35px;}
article section ol > li > p { margin: 10px 0 0 19px; }
article section ol > li > p ~ p { margin: 3px 0 3px 19px; }
article section dl > dt { font-weight: 500; color: rgb(23, 23, 23); background: url("/images/common/document/icon_check.png") 0 4px no-repeat; padding: 0 0 0 21px; margin: 0 0 15px; }
article section dl > dd { padding: 0 0 0 22px; margin: 0 0 18px; }
article section pre { margin: 20px 0; position: relative; }
article section figure {background-color: #f7f7f8; padding: 14px;}
article section figure figcaption {margin-top: 10px;}

article section table { font-size: 15px; width: 100%; border-collapse: collapse; color: rgb(50, 51, 50); margin: 20px 0 0; }
article section table thead { background-color: rgb(241, 243, 244); }
article section table tbody { background-color: rgb(255, 255, 255); }
article section table tr th {padding: 14px 10px; border-top: 1px solid rgb(224, 224, 224);border-right: 1px solid rgb(224, 224, 224);border-bottom: 1px solid rgb(224, 224, 224);border-image: initial;border-left: none;text-align: center;background-color: rgb(241, 243, 244);font-weight: 500;}
article section table tr td { font-weight: 400; padding: 14px 17px; border: 1px solid rgb(224, 224, 224); line-height: 1.5; }
article section table tr td:first-child { border-left: none; }
article section table tr th:last-child, article section table tr td:last-child { border-right: none; }
article section table tfoot td { padding: 7px 0; font-size: 0.9em; border-bottom: none; }
article section table tr td p { margin : 5px 0;}
article section table tr td p:first-child { margin-top : 0;}
article section table tr td p:last-child { margin-bottom : 0;}

.table_service_info > thead > tr > th {height: 41px; font-size: 16px; font-weight: 500; border: none; color: #fff;}
.table_service_info > thead > tr > th:nth-child(1) {background-color: #2b7af7}
.table_service_info > thead > tr > th:nth-child(2) {background-color: #4f5c6d; color: #677a92; font-weight: 700; font-size: 22px; border-bottom: 1px solid #5b6e84;}
.table_service_info > thead > tr > th:nth-child(3) {background-color: #00c167}
.table_service_info > tbody > tr:nth-child(1) {height: 58px;}
.table_service_info > tbody > tr:nth-child(2) {height: 41px;}
.table_service_info > tbody > tr:nth-child(3) {height: 61px;}
.table_service_info > tbody > tr:nth-child(4) {height: 61px; border-bottom: 1px solid #5b6e84;}
.table_service_info > tbody > tr:nth-child(4) td:nth-child(2) {border-bottom-color: #dce6f2;}
.table_service_info > tbody > tr > td {text-align: center; font-size: 15px; font-weight: 400; height: 60px; padding: 11px 17px; border-bottom: 1px solid #dce6f2; border-right: none; border-left: none;}
.table_service_info > tbody > tr > td:nth-child(2) {background-color: #4f5c6d; color: #fff; font-weight: 400; font-size: 14px; border-bottom-color: #5b6e84;}

/* 모바일일 때 테이블 가로 스크롤, 사이드 커버 */
.mobile-scroll-container {position: relative; margin: 10px 0 30px;}
.mobile-scroll-container::before {content: ''; position: absolute; top: 0; width: 30px; height: 100%; z-index: 2; left: 0; background-image: linear-gradient(90deg, #fff, hsl(0deg 0% 100% / .5), hsl(0deg 0% 100% / 0%));}
.mobile-scroll-container::after {content: ''; position: absolute; top: 0; width: 30px; height: 100%; z-index: 2; right: 0; background-image: linear-gradient(90deg, hsl(0deg 0% 100% / 0%), hsl(0deg 0% 100% / .5), #fff);}
.mobile-scroll-container.equal::before,
.mobile-scroll-container.equal::after,
.mobile-scroll-container.first::before,
.mobile-scroll-container.last::after {content: none;}
.mobile-scroll-wrapper {padding-bottom: 8px;}
.mobile-scroll-wrapper::-webkit-scrollbar {width: 5px; height: 5px;}
.mobile-scroll-wrapper::-webkit-scrollbar-thumb {background: rgb(224, 224, 224); border-radius: 12px;}
.mobile-scroll-wrapper::-webkit-scrollbar-track {background: rgb(255, 255, 255,0);}

article section img { max-width: 100%; display: block;}

article section div.tab-box { margin: 35px 0;}
article section div.tab-box:last-child { margin-bottom: 0; }
article section div.tab-box ul > li { padding: 0; margin: 0; }
article section div.tab-box ul > li::after { display: none; }
article section div.tab-box .tabs { margin-bottom: -1px; position: relative;}
article section div.tab-box .tabs::before {content: ''; position: absolute; top: 0; width: 30px; height: 100%; z-index: 2; left: 0; background-image: linear-gradient(90deg, #fff, hsl(0deg 0% 100% / .5), hsl(0deg 0% 100% / 0%));}
article section div.tab-box .tabs::after {content: ''; position: absolute; top: 0; width: 30px; height: 100%; z-index: 2; right: 0; background-image: linear-gradient(90deg, hsl(0deg 0% 100% / 0%), hsl(0deg 0% 100% / .5), #fff);}
article section div.tab-box .tabs.first::before {content: none;}
article section div.tab-box .tabs.last::after {content: none;}
article section div.tab-box .tabs > ul { display: flex; overflow-x: auto;}
article section div.tab-box .tabs > ul::-webkit-scrollbar {display: none;}
article section div.tab-box .tabs > ul > li { border-top: 1px solid rgb(211, 220, 228); border-left: 1px solid rgb(211, 220, 228); border-right: 0 solid rgb(211, 220, 228); border-image: initial; border-bottom: none; border-radius: 5px 5px 0 0; overflow: hidden; flex-shrink: 0;}
article section div.tab-box .tabs > ul > li:last-child { border-right-width: 1px; }
article section div.tab-box .tabs > ul > li > a { font-size: 15px; color: rgb(68, 68, 68); padding: 12px 18px 12px 17px; display: inline-block; word-spacing: -1px; }
article section div.tab-box .tabs > ul > li.active { background-color: rgb(248, 249, 250); position: relative; }
article section div.tab-box .tabs > ul > li.active::after { content: ""; display: block; position: absolute; width: 100%; height: 3px; top: 0; left: 0; background-color: rgb(77, 100, 224); border-radius: 5px 5px 0 0; }
article section div.tab-box .tabs > ul > li.active > a { color: rgb(23, 23, 23); }
article section div.tab-box .contents { border: 1px solid rgb(211, 220, 228); border-radius: 0 5px 5px 5px; overflow: hidden;}
article section div.tab-box .contents > ul > li { padding: 27px; background-color: rgb(248, 249, 250); display: none; }
article section div.tab-box .contents > ul > li > img { margin: 5px auto; display: block;}
article section div.tab-box .contents > ul > li > img.process-image{width : 880px; min-width : 880px; margin : 0 -27px;}
article section div.tab-box .contents > ul > li.process-image {padding : 0; width: 880px;}
article section div.tab-box .contents > ul > li.process-image > img {margin : 0; width: 880px; min-width : 880px;}
article section div.tab-box .contents > ul > li.process-image > p {padding : 27px 0 27px 27px;}
article section div.tab-box .contents > ul > li.active { display: block; }
article section div.tab-box .contents > ul > li > table { margin-top : 0; }

article section a.anchor { transform: translateY(-100px); display: inline-block; position: absolute; }
article section div.panel-box { background-color: rgb(245, 247, 249); position: relative; padding: 19px 28px 18px 56px; margin: 25px 0; }
article section div.panel-box:last-child {margin-bottom : 0;}
article section div.panel-box > p { margin: -3px 0 0 1px; font-size: 15px; }
article section div.panel-box > strong + ul { margin-left: 0; }
article section div.panel-box > p + ul {margin-left : 0; margin-top : 4px;}
article section div.panel-box ul > li::after { width: 4px; height: 4px; top: 9px; }
article section div.panel-box li { word-spacing: -1px; margin-bottom: 4px; padding-left: 14px; font-size: 15px; }
article section div.panel-box > ol > li {padding-left : 0;}
article section div.panel-box > ol > li:last-child,
article section div.panel-box > ul > li:last-child { margin-bottom: 0; }
article section div.panel-box > ol > li > ul,
article section div.panel-box > ul > li > ol { margin: 5px 0 10px 10px; }
article section div.panel-box > ol > li:last-child > ul,
article section div.panel-box > ul > li:last-child > ol { margin-bottom: 0; }
article section div.panel-box > ol > li > ul > li,
article section div.panel-box > ul > li > ol > li { margin-bottom: 5px; }
article section div.panel-box > ol > li > ul > li:last-child,
article section div.panel-box > ul > li > ol > li:last-child { margin-bottom: 0; }
article section div.panel-box > strong { display: inline-block; margin: 0 0 13px; font-weight: 500; font-size: 16px; }
article section div.panel-box > table {margin : 10px 0 0 0;}
article section div.panel-box.important-panel {border-left: 4px solid rgb(221, 93, 81);}
article section div.panel-box.information-panel {border-left: 4px solid rgb(0, 112, 201);}
article section div.panel-box::before {content: ""; display: block; position: absolute; background-position: center; background-size: contain; background-repeat: no-repeat;}
article section div.panel-box.important-panel::before {top: 14px; left: 24px; width: 25px; height: 25px; background-image: url("/images/common/document/icon_important.png");}
article section div.panel-box.information-panel::before {top: 19px; left: 26px; width: 21px; height: 21px; background-image: url("/images/common/document/icon_information.png");}

article section div.sdk_setup_lang_box { position: relative; margin: 25px 0 0 0; padding: 18px 0 10px 23px; background: #f6f6f6; }
article section div.sdk_setup_lang_box > strong.sdk_setup_lang_box_title { display: inline-block; margin-bottom: 10px; font-weight: 600; }
article section div.sdk_setup_lang_box > ul { margin-top: 10px }
article section div.sdk_setup_lang_box > ul > li { padding-left: 15px }
article section div.sdk_setup_lang_box > ul > li::after { width: 4px; height: 4px; top: 11px; }
article section div > ul > li > strong.sdk_setup_lang_sub_title { font-size: 15px }
article section div > ul > li > ol > li.sdk_setup_lang_text { background-image: url(/images/common/document/sdk_setup_lang_folder.png); background-position: left 0px top 6px; background-repeat: no-repeat; font-size: 15px; color: #666666; margin-top: -10px}
article section table tbody tr td p.add_info {font-size: 15px; margin-top: -5px }

article section a.goto-out {display: inline;color: rgb(77, 100, 228);position: relative; padding: 0 19px 0 0; background: url("/images/common/document/icon_goto_link_arrow.png") right center/15px no-repeat;z-index: 1; margin-right : 3px;}
article section a.goto-link { display: inline-block; color: rgb(77, 100, 228); }
article section a.download { font-size: 16px; border-radius: 0; display: inline-block; position: relative; }
article section a.download:hover { color: rgb(25, 85, 233); }
article section a.download::before { content: ""; display: none; width: 100%; height: 1px; background-color: rgb(25, 85, 233); position: absolute; left: 0; bottom: -2px; }
article section a.download::after {content: "";display: inline-block;width: 18px;height: 18px;transform: translate(7px, 3px);background: url("/images/common/document/icon_download_button.png") center/contain no-repeat;}

section span.prior-consultation-badge { position : absolute; background-color: #fff1eb; border: 1px solid #FFb5b5; color:#FF0050; border-radius: 2px; margin: 1px 10px 30px 0px; font-size: 14px; font-weight:normal; font-style: normal; line-height:normal; letter-spacing: -0.28px;  padding: 0px 3px 3px 3px; width: 59px; height: 24px; }

@media  (max-width: 1480px) {
	.document-wrapper{padding-right : 50px; justify-content: flex-end;}
}

@media (max-width: 1250px) {
	.document-wrapper{padding-right : 15px;}
	article{min-width : auto; width : calc(100vw - 240px);}
	article section {scroll-margin-top: 164px;}
	article section table tbody tr { scroll-margin-top : 154px; }
	article section div.tab-box .contents > ul > li.process-image {width : auto;}
	article section div.tab-box .contents > ul > li.process-image > img {min-width : auto;}
}

@media (max-width: 980px) {
	html.scroll-stop {overflow-y:auto; margin-right : 0;}
	header .scroll-stop {width : 100%;}
	.document-wrapper{padding : 20px;}
	.pre-hljs .copyButton{display: none;}
	article{width : 100%; padding : 20px; margin-left: 0; margin-bottom: 0;}
	article section {scroll-margin-top: 117px;}
	article section table tbody tr { scroll-margin-top : 107px; }
	article section div.tab-box .contents > ul > li.process-image{width : 100%; overflow: auto;}

	/* 모바일일 때 가로 스크롤, 사이드 커버 */
	.mobile-scroll-wrapper {overflow-x: auto;}
	.mobile-scroll-wrapper table,
	.mobile-scroll-wrapper pre {width: fit-content; margin: 0;}
	.mobile-scroll-container.equal .mobile-scroll-wrapper table,
	.mobile-scroll-container.equal .mobile-scroll-wrapper pre {width: 100%;}
	.mobile-scroll-wrapper table {width: 780px; margin: 0;}
	.mobile-scroll-wrapper pre code.hljs {border: 0; border-radius: 0; white-space: pre;}
}

@media (max-width: 500px) {
	.document-wrapper{padding : 0;}
	article {font-size : 14px; margin : 0 0 40px 0; border : none; padding : 15px;}
	article section{margin : 0 0 60px 0; scroll-margin-top: 107px;}
	article .breadcrumb-container .breadcrumb-box {flex-wrap: wrap; row-gap: 5px;}
	article .framework-container{border-left : solid 3px #f85c46; position : relative; top : -25px; left : 20px; width : 300px;}
	article .framework-container ul {flex-direction : column;}
	article .framework-container ul li {margin : 0;}
	article .framework-container ul li.active {margin : 0 0 0 5px;}
	article .framework-container ul li a {border : none;}
	article .framework-container ul li.active a {background : none; color : #333; font-weight : 700;}
	article .framework-container ul li.active a:after {border:none;}
	article section {scroll-margin-top: 107px;}
	article section table tbody tr { scroll-margin-top : 97px; }
	article section h1,
	article section h2{font-size : 28px; margin-bottom : 30px; font-weight: 500;}
	article section h3{font-size: 20px;line-height: 1.4; margin-bottom : 10px; font-weight: 500;}
	article section h4{font-size : 16px; font-weight: 500; margin-top : 40px;}
	article section h5{font-size : 16px; font-weight: 500;}
	article section h6{font-size : 16px; font-weight: 500;}
	article section > h2 + p{margin-bottom : 20px;}
	article section > h3 + p{margin-top : 10px;}
	article section > h5 + p{margin-top : 10px;}
	article section p {line-height: 1.5;}
	article section p + ul{margin-left : 10px;}
	article section p + ul > li,
	article section p + ul > li:last-child {margin: 0 0 0 4px;}
	article section ul > li{padding-left : 14px;}
	article section ul > li::after{width : 4px; height: 4px; left: 2px; top : 10px;}
	article section table{min-width : 600px; overflow-x : auto; margin : 0;}
	article section table * {font-size : 13px;}
	article section table tr th {padding: 7px 10px;}
	article section table tr td {padding: 7px 10px;}
	article section pre+p{margin-top : 20px;}
	article section ol > li{padding-left : 0;}
	article section div.panel-box {padding: 19px 20px 18px 45px; margin: 20px 0;}
	article section div.panel-box.important-panel::before {left: 16px; width: 22px; height: 22px;}
	article section div.panel-box.information-panel::before {top: 17px; left: 17px; width: 20px; height: 20px;}
	article section div.panel-box > p{font-size : inherit;}
	article section div.panel-box > strong{line-height: 1.4; font-size : 15px; margin-top : -2px;}
	article section div.panel-box > ul > li{padding-left : 9px; font-size: inherit;}
	article section div.panel-box > ol > li{font-size : inherit;}
	article section div.tab-box .contents > ul > li {padding: 20px 15px;}
	article section div.tab-box .contents > ul > li.process-image > img{width : 100%; min-width : auto;}
	article section a.download{font-size : inherit; display: inline;}
	article section a.download::after{display: inline-block;}

}

@media (max-width: 340px) {
}

@media print{
	*{-webkit-print-color-adjust : exact; color-adjust : exact;}
	header,
	footer {display: none;}
	table thead{page-break-inside : auto; break-inside : auto;}

	article{font-size : 11pt;}
	article section h2{font-size : 16pt;}
	article section h3{font-size : 14pt;}
	article section h4{font-size : 13pt;}
	article section p{line-height: 1.7;}
	article section table{font-size : 10pt;}
	article section div.panel-box > strong{font-size : 11pt;}
	article section div.panel-box > ul > li{font-size : 10pt;}
	article section div.tab-box .contents > ul > li.process-image,
	article section div.tab-box .contents > ul > li.process-image > img {width : 100%;}
}
