@charset "UTF-8";
/*
	1. Author : Lim_HA(2021.09)
	2. Comment : reset
	3. Modify :
*/
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap");
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

body { line-height: 1; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after { content: ''; content: none; }

q:before, q:after { content: ''; content: none; }

table { border-collapse: collapse; border-spacing: 0; border: 0; }

th, td { padding: 0; }

/* LHA - reset css 추가 ====================== */
*, div, span, article, section, header, footer, aside, p, ul, li, fieldset, legend, label, a, nav, form, :after, :before { box-sizing: border-box; }

html, body { height: 100%; -webkit-text-size-adjust: none; background-color: #f6f6f6; }

html { overflow-y: scroll; -webkit-text-size-adjust: none; font-size: 62.5%; }
@media (min-width: 541px) { html { font-size: 73%; } }

body { margin: 0; padding: 0; font-weight: 400; }

/* font-family 설정 */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, p, table, th, td, form, fieldset, legend, textarea, input, select, textarea, button, figure, figcaption { font-family: "Noto Sans KR", "Sans-Serif"; }

/* a 링크 초기화 */
a { color: #222; text-decoration: none; cursor: pointer; }

/* 테두리 초기화 */
img, fieldset { border: 0 none; }

/* 버튼 초기화 */
button { border: none; cursor: pointer; }

.u-clearfix::after { content: " "; visibility: hidden; display: block; height: 0; clear: both; }

/* ========================================================== */
/*                                                            */
/* file     : fonts                                           */
/*                                                            */
/* ========================================================== */
/* ---------------------------------------------------------- */
/* Noto Sans KR s =========================================== */
@font-face { font-family: 'Noto Sans KR'; src: url("../fonts/NotoSansCJKkr-Light.otf") format("otf"), url("../fonts/NotoSansCJKkr-Light.ttf") format("ttf"), url("../fonts/NotoSansCJKkr-Light.woff") format("woff"); font-weight: 300; font-style: normal; }
@font-face { font-family: 'Noto Sans KR'; src: url("../fonts/NotoSansCJKkr-Regular.otf") format("otf"), url("../fonts/NotoSansCJKkr-Regular.ttf") format("ttf"), url("../fonts/NotoSansCJKkr-Regular.woff") format("woff"); font-weight: 400; font-style: normal; }
@font-face { font-family: 'Noto Sans KR'; src: url("../fonts/NotoSansCJKkr-Medium.otf") format("otf"), url("../fonts/NotoSansCJKkr-Medium.ttf") format("ttf"), url("../fonts/NotoSansCJKkr-Medium.woff") format("woff"); font-weight: 500; font-style: normal; }
@font-face { font-family: 'Noto Sans KR'; src: url("../fonts/NotoSansCJKkr-Bold.otf") format("otf"), url("../fonts/NotoSansCJKkr-Bold.ttf") format("ttf"), url("../fonts/NotoSansCJKkr-Bold.woff") format("woff"); font-weight: 700; font-style: normal; }
/* font : Noto Sans KR e ==================================== */
/* ---------------------------------------------------------- */
/* ---------------------------------------------------------- */
/* font : pay booc s ======================================== */
@font-face { font-family: 'paybooc'; src: url("../fonts/paybooc-Light.otf") format("oft"), url("../fonts/paybooc-Light.ttf") format("ttf"), url("../fonts/paybooc-Light.woff") format("woff"); font-weight: 300; font-style: normal; }
@font-face { font-family: 'paybooc'; src: url("../fonts/paybooc-Medium.otf") format("oft"), url("../fonts/paybooc-Medium.ttf") format("ttf"), url("../fonts/paybooc-Medium.woff") format("woff"); font-weight: 500; font-style: normal; }
@font-face { font-family: 'paybooc'; src: url("../fonts/paybooc-Bold.otf") format("oft"), url("../fonts/paybooc-Bold.ttf") format("ttf"), url("../fonts/paybooc-Bold.woff") format("woff"); font-weight: 700; font-style: normal; }
/* font : pay booc e  ======================================= */
/* ---------------------------------------------------------- */
/* ---------------------------------------------------------- */
/* ========================================================== */
/*                                                            */
/* file		: style                        	                  */
/*                                                            */
/* ========================================================== */
/* ---------------------------------------------------------- */
/* style   s ================================================ */
.ui-wrap { position: relative; height: 100%; background-color: #f6f6f6; display: flex; flex-direction: column; justify-content: center; align-items: center; min-height: 66rem; min-width: 360px; max-width: 720px; margin: 0 auto; line-height: 1.2rem; /* 검사 결과지 페이지 s */ /* 검사 결과지 페이지 e */ }
.ui-wrap .ui-container { padding: 5rem 2rem 2.5rem; text-align: center; }
.ui-wrap .ui-container .title { position: relative; display: flex; align-items: flex-end; flex-wrap: wrap; justify-content: center; max-height: 23rem; z-index: 100; }
.ui-wrap .ui-container .title:before { content: ""; position: absolute; top: -1rem; left: calc(50% - 8.5rem); width: 15.45rem; height: 3.4rem; z-index: 50; background-image: url(../../images/resultImg/logo_img.png); background-repeat: no-repeat; background-size: 100%; }
.ui-wrap .ui-container .title:after { content: ""; position: absolute; top: 0%; left: 0; width: 100%; height: 100%; max-height: 23rem; z-index: 0; background-image: url(../../images/resultImg/bg_img_01.png); background-repeat: no-repeat; background-size: 100% 100%; }
.ui-wrap .ui-container .title h1 { width: 100%; font-size: 3rem; font-weight: 700; color: #000; line-height: 4.5rem; padding-top: 5rem; padding-bottom: 1.2rem; font-family: "paybooc", "Sans-Serif"; z-index: 100; }
.ui-wrap .ui-container .title h1 span { font-size: 3.5rem; }
.ui-wrap .ui-container .title .txt { font-size: 1.5rem; color: #393939; padding-bottom: 2.25rem; line-height: 2.1rem; font-weight: 300; z-index: 100; }
.ui-wrap .ui-container .title.error .txt { font-size: 2rem; font-weight: 400; padding-top: 3rem; }
.ui-wrap .ui-container .form { width: 100%; }
.ui-wrap .ui-container .section-form { position: relative; width: 100%; background-color: #fff; border-radius: 10px; border-color: #999; border-style: double; border-width: 1px 3px 3px 1px; box-shadow: 0 1.5px 3px #aaa; }
.ui-wrap .ui-container .section-form .m-input, .ui-wrap .ui-container .section-form .radio-button-list { display: flex; align-items: center; padding: 2.4rem 2.15rem; border-bottom: 1px solid #999; }
.ui-wrap .ui-container .section-form .m-input.border-n, .ui-wrap .ui-container .section-form .radio-button-list.border-n { border-bottom: none; }
.ui-wrap .ui-container .section-form .m-input .a-label, .ui-wrap .ui-container .section-form .radio-button-list .a-label { min-width: 4.8rem; margin-right: 2.8rem; text-align: left; font-size: 1.2rem; color: #222; font-weight: 500; }
.ui-wrap .ui-container .section-form .m-input .a-input, .ui-wrap .ui-container .section-form .radio-button-list .a-input { border: none; outline: none; font-size: 1.4rem; font-weight: 400; color: #222; width: 100%; }
.ui-wrap .ui-container .section-form .m-input .a-input::placeholder, .ui-wrap .ui-container .section-form .radio-button-list .a-input::placeholder { color: #b5b5b5; }
.ui-wrap .ui-container .section-form .radio-button-list .m-radio-button { display: flex; align-items: center; padding-right: 4.65rem; }
.ui-wrap .ui-container .section-form .radio-button-list .m-radio-button:last-child { padding-right: 0; }
.ui-wrap .ui-container .section-form .radio-button-list .m-radio-button .a-radio-button { display: none; cursor: pointer; }
.ui-wrap .ui-container .section-form .radio-button-list .m-radio-button .a-radio-button + .custom-radio { float: left; border: 1px solid #bababa; cursor: pointer; position: relative; display: inline-block; width: 20px; height: 20px; border-radius: 100%; overflow: hidden; }
.ui-wrap .ui-container .section-form .radio-button-list .m-radio-button .a-radio-button + .custom-radio:after { background-color: #8b0f1d; transition: top .2s ease-in-out; content: ""; width: 10px; height: 10px; border-radius: 100%; display: block; position: absolute; left: 4px; top: -15px; }
.ui-wrap .ui-container .section-form .radio-button-list .m-radio-button .a-radio-button:checked + .custom-radio { border: 1px solid #8b0f1d; }
.ui-wrap .ui-container .section-form .radio-button-list .m-radio-button .a-radio-button:checked + .custom-radio:after { top: 4px; }
.ui-wrap .ui-container .section-form .radio-button-list .m-radio-button .label-text { padding-left: 0.8rem; font-size: 1.4rem; font-weight: 400; color: #222; }
.ui-wrap .ui-container .btn { width: 100%; background-color: #bc1225; border-radius: 10px; padding: 2rem; color: #fff; font-size: 1.8rem; margin-top: 2.8rem; }
.ui-wrap.check-wrap { display: block; flex-direction: initial; justify-content: initial; align-items: initial; }
.ui-wrap.check-wrap .ui-container { padding-top: 2rem; padding-bottom: 3rem; }
.ui-wrap.check-wrap .ui-container .title-box .logo img { width: 15.45rem; height: 3.4rem; }
.ui-wrap.check-wrap .ui-container .title-box .txt { padding: 1rem 0 4.2rem; line-height: 2.2rem; font-weight: 300; font-size: 1.6rem; color: #000; }
.ui-wrap.check-wrap .ui-container .title-box .txt span { font-weight: bold; border-bottom: 1px solid #000; }
.ui-wrap.check-wrap .ui-container .content { text-align: left; }
.ui-wrap.check-wrap .ui-container .content .section { margin-bottom: 3.1rem; }
.ui-wrap.check-wrap .ui-container .content .section:last-child { margin-bottom: 0; }
.ui-wrap.check-wrap .ui-container .content .section .cation { position: relative; display: flex; align-items: center; flex-wrap: nowrap; width: 100%; height: 15px; font-weight: 500; font-size: 15px; color: #222; padding-left: 12px; margin-bottom: 10px; }
.ui-wrap.check-wrap .ui-container .content .section .cation .icon { width: 15px; height: 13.5px; display: flex; align-items: flex-end; }
.ui-wrap.check-wrap .ui-container .content .section .cation .icon img { width: 100%; height: 100%; }
.ui-wrap.check-wrap .ui-container .content .section .cation .icon.bottle { width: 13.5px; height: 16px; }
.ui-wrap.check-wrap .ui-container .content .section .cation .icon.report { width: 10.5px; height: 14.5px; }
.ui-wrap.check-wrap .ui-container .content .section .cation .txt { padding-left: 9px; display: inline-block; vertical-align: bottom; width: 100%; height: 100%; min-width: 130px; line-height: 15px; }
.ui-wrap.check-wrap .ui-container .content .section .table-wrap { font-weight: 400; font-size: 1.5rem; color: #222; line-height: 1.8rem; background-color: #fff; border: 1px solid #999; border-radius: 20px; overflow: hidden; }
.ui-wrap.check-wrap .ui-container .content .section .table-wrap table { width: 100%; border-collapse: initial; }
.ui-wrap.check-wrap .ui-container .content .section .table-wrap table tr th, .ui-wrap.check-wrap .ui-container .content .section .table-wrap table tr td { vertical-align: middle; border-left: 1px solid #999; }
.ui-wrap.check-wrap .ui-container .content .section .table-wrap table tr th:first-child, .ui-wrap.check-wrap .ui-container .content .section .table-wrap table tr td:first-child { border-left: none; }
.ui-wrap.check-wrap .ui-container .content .section .table-wrap table tr.border-tn td { border-top: none; }
.ui-wrap.check-wrap .ui-container .content .section .table-wrap table tr td { padding: 1rem 1.5rem 1rem 1.75rem; border-top: 1px solid #999; }
.ui-wrap.check-wrap .ui-container .content .section .table-wrap table tr td:first-child { padding-left: 1.8rem; }
.ui-wrap.check-wrap .ui-container .content .section .table-wrap table tr td .sub-title { display: block; font-size: 1.2rem; color: #777; }
.ui-wrap.check-wrap .ui-container .content .section .table-wrap table tr td .data { letter-spacing: -0.085rem; }
.ui-wrap.check-wrap .ui-container .content .section .table-wrap table tr td .lab-info { padding-top: 1.1rem; font-size: 1.2rem; color: #666; }
.ui-wrap.check-wrap .ui-container .content .section .table-wrap.result-box { border-radius: 20px 20px 0 0; }
.ui-wrap.check-wrap .ui-container .content .section .table-wrap.result-box table th { padding: 1.5rem 0; font-size: 1.2rem; text-align: center; background-color: #e2e2e2; }
.ui-wrap.check-wrap .ui-container .content .section .table-wrap.result-box table td { padding: 1.25rem 1.6rem 1.25rem 2.05rem; font-size: 1.4rem; }
.ui-wrap.check-wrap .ui-container .content .section .table-wrap.result-box table td:first-child { padding-left: 2rem; }
.ui-wrap.check-wrap .ui-container .content .section .table-wrap.result-box table td:last-child { padding-left: 0; padding-right: 0; text-align: center; }
.ui-wrap.check-wrap.en .ui-container .title-box .txt { font-size: 1.4rem; line-height: 1.9rem; }

.down-btn-box { display: flex; justify-content: space-between; min-width: 360px; max-width: 802px; margin: 0 auto; margin-top: 60px; }
.down-btn-box .btn { border-radius: 10px; width: 100%; height: 5.5rem; display: flex; justify-content: center; align-items: center; padding: 0; color: #bc1225; background-color: #fff; font-size: 1.5rem; font-weight: bold; border: 1px solid #bc1225; margin-right: 1rem; }
.down-btn-box .btn:last-child { margin-right: 0; }
.down-btn-box .btn .icon { margin-right: 0.6rem; background-repeat: no-repeat; background-size: 100%; margin-right: 0.6rem; }
.down-btn-box .btn .icon.img { width: 2.05rem; height: 1.55rem; background-image: url(../../images/resultImg/img_down.png); }
.down-btn-box .btn .icon.pdf { width: 1.75rem; height: 2rem; background-image: url(../../images/resultImg/pdf_down.png); }

.result-paper { margin: 0 auto; margin-top: 3rem; max-width: 820px; }
.result-paper img { width: 100%; }

/* style  e =============================================== */

/*# sourceMappingURL=sg_ui.css.map */
