@charset "utf-8"; 
@import url('//fonts.cdnfonts.com/css/gotham');
@import url('//fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('//fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
@import url('//fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url('//fonts.googleapis.com/earlyaccess/nanumgothic.css');
@import url('../fonts/fontawesome-free-6.4.2-web/css/all.min.css');
@import url('../fonts/XEIcon-2.3.3/xeicon.min.css');
@import url("../fonts/pretendard/pretendard.css");
@import url('../fonts/spoqa-han-sans/css/SpoqaHanSansNeo.css');
@import url("../fonts/SUIT-woff2/SUIT.css");

/*-----------------------------------------------------------------*/
/* reset
/*-----------------------------------------------------------------*/
html, body {width:100%; height:100%;}
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, main, nav, section {display:block;}
html, body, div, span, strong, a, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, acronym, address, big, cite, code, del, dfn, em, ins, kbd, q, samp, strike, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, /*img, 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;}
body, input, textarea, select, button, table {font-family:var(--font-text); font-size:13px; color:var(--color-tone-800); /*color:#555;*/}
h1,h2,h3,h4,h5,h6 { font-family:var(--font-title); }
input, select, textarea, button, ul, ol, li, dl, dt, dd {vertical-align:middle;}
input[type='text'], input[type='file'], input[type='password'] {border:1px solid #ccc; background:#fff; height:36px; line-height:36px; text-indent:5px; padding:0;}
textarea {padding:5px; border:1px solid #ccc; background:#fff;}
select {border:1px solid #ccc; border-radius:0; height:22px; line-height:22px; padding:0 20px 0 3px; padding-right:0\0/IE8+9; -webkit-appearance:none; -moz-appearance:none; appearance:none; -webkit-box-sizing:border-box; box-sizing:border-box; background:#fff url('../img/qintop/select_arrow.png') no-repeat; background-size: 8px 5px; background-position: 95% center;}
select::-ms-expand { /* IE 8 */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE 5-7 */ filter: alpha(opacity=0); /* Good browsers :) */ opacity:0;}
/* 크롬핵 */ @media screen and (-webkit-min-device-pixel-ratio:0) {}
input[type='checkbox'], input[type='radio'] {width:15px; height:15px; vertical-align:middle !important; margin-left:0; margin-right:0;}
label {display:inline-block; cursor:pointer; vertical-align:middle; margin-right:10px;}
legend, hr {visibility:hidden; overflow:hidden; position:absolute; top:0; left:0; width:0; height:0; padding:0; font-size:0; line-height:0}
button {cursor:pointer;}	
table {border-spacing:0; border-collapse:collapse;}}
th, td {word-wrap:break-word; word-break:break-all; /*vertical-align:middle;*/ line-height:1.4;}
caption {visibility:hidden; width:0px; height:0px; overflow:hidden; font-size:0; line-height:0;}
col {display:table-column;}
iframe {border:0; margin:0; overflow:hidden;}
img, fieldset {border:0; vertical-align:middle;}
/*img {max-width: 100%; width: 100%;}*/
ul, ol {list-style:none;}
em, address {font-style:normal}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after, q:before, q:after {content:''; content:none;}
a:link, a:active, a:focus {color:#666; text-decoration:none;}
a:hover {color:#5396fe; text-decoration:none; }
.hidden {display:block; font-size:0; width:1px; height:1px; line-height:0; overflow:hidden; position:absolute; left:-9999px; text-indent:-9999px;}
.hand, .pointer {cursor:pointer !important;}
.underline {text-decoration:underline;}
.relative {position:relative !important;}
.absolute {position:absolute !important;}
.small {font-size:11px;}
.desc {font-size:11px; color:#848484;}
.hide {display:none;}
.unvisibility {visibility:hidden;}
.normal {font-weight:normal !important;}
strong, b, .bold {font-weight:600;}
.input-box-default-text {color:#515151 !important; letter-spacing:-1px;}
/* FONT SMOOTHING */

    body {
        font-smoothing: antialiased;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
/*.fb-like, .fb-like>span, .fb-like>span>iframe {min-width:90px !important; min-height:20px !important;}*/
.font_sel {-webkit-transform:skew(-0.001deg);transform:skew(-0.001deg);}



/*-----------------------------------------------------------------*/
/* 공통요소
/*-----------------------------------------------------------------*/
/* placholder */
::-webkit-input-placeholder {color:#aaa;} 
::-moz-placeholder {color:#aaa;}
:-ms-input-placeholder {color:#aaa;}
:-moz-placeholder {color:#aaa;}
::-webkit-input-title {color:#aaa;}
::-moz-title {color:#aaa;}
:-ms-input-title {color:#aaa;}
:-moz-title {color:#aaa;}

/* 하이퍼링크 */
a:link, a:visited, a:active	 {color:#222;}
a:hover {color:#000; text-decoration:none;}


:root {
	--color-point:	#3CDBC0;
	--color-point-a: rgba(60,219,192,0.5);
	--color-point-b: rgba(60,219,192,0.1);

	--color-tone-100 : #f8f8f8; 
	--color-tone-200 : #e9e9e9;
	--color-tone-300 : #dedede;
	--color-tone-400 : #cecece; 
	--color-tone-500 : #adadad; 
	--color-tone-600 : #6c6c6c;
	--color-tone-700 : #494949;
	--color-tone-800 : #343434;
	--color-tone-900 : #212121;

	--color-trans-wh : rgba(255,255,255,0.9);
	--color-trans-bk : rgba(0,0,0,0.5);

	--font-title: 'Spoqa Han Sans Neo', 'Noto Sans KR', sans-serif;
    --font-text: 'Roboto', 'Pretendard', 'Noto Sans KR', 'AppleGothic', '맑은 고딕', 'Malgun Gothic', 돋움, Dotum, sans-serif;
	--font-icon : 'Font Awesome 6 free', 'xeicon', 'Pretendard', sans-serif;

	--transition-slow : all .3s ease-in-out;
	--transition-fast : all .1s ease-in-out;

	--gutter-pc:	50px;
	--gutter-mo:	20px;
	--mg-sec-pc:	140px;
	--mg-sec-md:	70px;
	--mg-sec-mo:	30px;
}


/*-----------------------------------------------------------------*/
/* layout
/*-----------------------------------------------------------------*/
.wrap {
    position: relative; width: 100%;
    background: #ebebeb;
	display: flex;
	gap:50px;
    flex-direction: column;
    align-items: center;
	/*
    background:#ebebeb url(../img/top_bg.jpg) center top no-repeat;
    background-size: contain;
	overflow: hidden;
	*/
}
.container{
	position: relative;
    width: 1100px;
    margin: 0px auto 140px;
    border: 1px solid var(--color-tone-300);
	background: #fff ;
}
.container:before, .container:after{
    content: " ";
    display: table;
}
/*
.container::after {
    content: attr(class);
    box-sizing: border-box;
    border-top: 1px solid #ddd;
    background-color: #f2f2f2;
    width: 100%;
    height: 165px;
    font-size: 0;
    background-size: 165px 100%;
    background-position: left -100px;
}
*/
.cnt_wrap {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0px 50px;
    background: #fff;    
}
.flipped > * {
    float: left;
}
.clearfix:after {
  content: " ";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}
.blk_none {font-size: 0;}
.hide {display: none;}
.no_pad {padding-left: 0px!important; padding-right: 0px!important;}
.h {text-indent: -9999px; position: absolute; top:-9999px;}
.btm_bg {position: absolute; bottom: 0px; left: 0px; z-index: -1; width: 100%; height: 165px; background-color: #f2f2f2; -webkit-box-sizing: border-box; box-sizing: border-box; border: 1px solid var(--color-tone-300); }

.btn_wrap {width: 1100px;display: flex;justify-content: center;gap:15px;align-items: center;}
.btn_wrap a {display: block; width: 140px; line-height: 38px; color: var(--color-tone-700); background:#fff;text-align: center; border-radius: 20px; font-size: 14px; box-sizing: border-box;}
/* .btn_wrap a:not(:first-child) { margin-left: 10px; } */
.btn_wrap a.btn_print {border:1px solid var(--color-tone-400);line-height:42px;}
.btn_wrap a.btn_pdf {background:#d00000;color:#fff;}
.btn_wrap a.btn_img {background:#22abe1;color:#fff;}






/*-----------------------------------------------------------------*/
/* helper
/*-----------------------------------------------------------------*/
.main_clr {color: #29e5f3;}
/*.main_clr_snd {color: #ff892a;}*/
.sub_clr {color: #ffceff;}
.dark_base_clr {color: #252525;}
.base_clr {color: #ececec;}
.base_light_clr {color: #f1f1f1;}
.base_light_clr_02 {color: #f8f8f8;}
.bder_none {border: 0px!important;}
.al_center {margin: 1rem auto;}








/*-----------------------------------------------------------------*/
/* heading
/*-----------------------------------------------------------------*/
h1 {font-size: 30px; position: relative; padding-bottom: 5px; color: #fff; padding-left: 80px; font-weight: 300; letter-spacing:-0.01em; }
h2 {text-transform: uppercase; font-size: 20px; }
h1 em {font-weight: 700;}
h1::before {
    content: attr(class);
    position: absolute;
    top: -25px;
    left: -10px;
    width: 200px;
    height: 80px;
    /*background: url(../img/logo@2x.png) 0px top no-repeat;*/
	background: url(../img/logo_gojin_full_color.svg) 0px top no-repeat;
    background-size: contain;
    z-index: 1;
    font-size: 0;
}


/*
h1::after {
    content: attr(class);
    position: absolute;
    bottom: -3px;
    left: 0px;
    width: 105px;
    height: 4px;
    background: #1572b4;
    z-index: 999;
    font-size: 0;
}
*/








/*-----------------------------------------------------------------*/
/* header
/*-----------------------------------------------------------------*/
header {position: relative; /*background: url(../img/header_bg@2x.jpg) no-repeat / 100% 237px;*/
	/* background: url(../img/bg_head_rect.png) no-repeat 50% top / 100% 237px; */
	-webkit-box-sizing: border-box;  box-sizing: border-box; padding: 50px 50px 20px 50px;}
header .inner_900:first-child {border: none!important; padding-left: 0px; padding-bottom: 20px;}
header .inner_900:last-child {background-color: #fff;}

header .inner_900:first-child p {position: absolute; top: 80px; right: 100px; z-index: 1; color: #fff; }
header .inner_900:first-child p em { font-size: 24px; font-weight: 700; }
header .inner_900:first-child p span {font-size: 16px;}
/*header .inner_900:first-child p em::before {position: absolute; top: 0px; left: 0px; width: 50px; height: 10px; background-color: red; z-index: 2;}*/
th .th_justify {display:block;width:65px;text-align:justify !important;height:20px;margin:0 auto;}
th .th_justify:after {display:inline-block;width:100%;content:"";}


/* 문서번호 */
.doc_info {width: 30%;}
.doc_info li {line-height: 3; font-size: 16px;}
.doc_info li a { color: var(--color-tone-900); font-weight:500; transition:var(--transition-fast); }
.doc_info li a:hover { color: var(--color-point); }
/*
.doc_info {position: absolute; top: 65px; right: 50px; z-index: 1;}
.doc_info li {margin-right: 14px;}
.doc_info li span {font-weight: bold;}
.doc_info li:last-child {margin-right: 0px;}
.doc_info li em {color: #0577be;}
*/

.price_info {-webkit-box-sizing: border-box;box-sizing: border-box; border: 1px solid var(--color-tone-300); margin-bottom: 25px;}
.price_info li { position:relative; width: 35%; text-align: right; padding-right: 20px; font-size: 16px; width: 55%; background-color: var(--color-point-b); font-weight: 700; height: 50px; line-height: 48px;}
.price_info li:first-child {width: 30%; text-align: center; font-size: 15px; color:#fff; background-color:var(--color-tone-700); border-left: 0px; font-family:var(--font-title); }
.price_info li:last-child {width: 15%;}
.price_info li .vat {font-weight: 400; font-size: 13px; padding-right: 5px;}




/* 정보 */ 
.info {width:100%;}
.table1 td:has(.stamp_img) {position:relative;}
.stamp_img {position:absolute;z-index:2;max-width:70px;right:50px;}
.table1{width:100%; border-bottom:2px solid #6fa4ff;margin:5px 0 20px;}
.table1 th{ padding:10px 5px; font-family:var(--font-title);font-size:14px; font-weight:500; text-align:center; border-bottom:1px solid #9ec9ff;background:#f2f7ff;color:var(--color-tone-700);}
.table1 td {border-bottom:1px solid #9ec9ff;border-right:1px solid #9ec9ff;padding:5px 10px;font-size:14px;letter-spacing:.02rem;}
.table1 tr td:last-child {border-right:0;}
.table1 tr:first-child th,
.table1 tr:first-child td {border-top:2px solid #6fa4ff;}


/* 본문내용 */
.table2 {width:100%; border-bottom:2px solid #6fa4ff;table-layout:fixed;}
.table2 th{ padding:10px 5px; font-family:var(--font-title);font-size:14px; font-weight:500; text-align:center; border-bottom:1px solid #9ec9ff;background:#f2f7ff;color:var(--color-tone-700);}
.table2 td {border-top:1px solid #9ec9ff;border-right:1px solid var(--color-tone-400);padding:5px 10px;font-size:14px;letter-spacing:.02rem;}
.table2.t_detail td {border-top:1px solid var(--color-tone-400);}
.table2 tr td:last-child {border-right:0;}
.table2.total .vat_mt {display:block;font-size:0.7rem;color:var(--color-tone-600);}
.table2.total tr:first-child th,
.table2.total tr:first-child td {border-top:2px solid #6fa4ff;}
.table2 .pcs_num {text-align:center;}
.table2.t_detail th {background:#6fa4ff;color: #fff;}

.table2 tr.sec_total {background-color:var(--color-point-b); font-weight: 700;}
.table2 tr.sec_total td {font-weight: 700; padding-top: 8px; padding-bottom: 8px; font-size: 14px;}

.table2 .price { text-align: right !important; padding-right: 20px;}
.table2 .list { text-align: left !important;word-break:break-all;}
.table2 .unit_nm {text-align:center !important;word-break:break-all;}
.table2 .desc_txt {color: var(--color-tone-700);}
.table2 .num_txt {color: var(--color-tone-500);}
.table2 .total .total_tit {text-align:right;background:#f2f7ff;color: var(--color-tone-800); padding-right: 20px;}
.table2 .total tr:last-child .total_tit {background:#6fa4ff;color:#fff;}
.table2 .total tr:last-child td {font-weight:600;}
.table2 tfoot th {border:1px solid var(--color-tone-300); border-width:1px 0; }
.table2 tfoot td {border:1px solid var(--color-tone-300); border-width:1px 0;font-size:15px;}
.table2 tfoot .origin {font-weight:600;}
.table2 tfoot .discount {color:var(--bs-red);font-weight:600;}

.table2 tr.add_line td {border-top: 1px solid var(--color-tone-600) !important;}


/* 테이블 div */

.cont:first-child{ border-top:none; }
.cont{border-top:2px solid #eff0f0; padding:0 0;}
.cont:after{display:block; content:""; clear:both; }
.cont div{ float:left; text-align:center; line-height:22px;  }
.detail{width:66.5%; text-align:left !important; padding:10px 10px; border-right:1px solid #ddd;}
.price{width:32%; padding:10px 10px;}

/* 합계 */
.total{ border-top:1px solid #ddd;}
.total div{ float:left; width:80%; line-height: 80px;-webkit-box-sizing: border-box;box-sizing: border-box;}
.total div:first-of-type{width: 20%; font-size: 16px; text-align: left; font-weight: 700; text-align: center; padding-right: 0px; border-right: 1px solid #ddd; height: 83px;}
.totalprice {}
.totalprice span{font-size: 16px;font-weight:700;color:var(--bs-red);text-decoration: underline;}
.totalprice em {font-size: 16px; font-weight: 600; color:var(--bs-red);text-decoration: underline;}
span.vat{font-size: 16px; text-decoration: none;}
span.vat_tag {font-size: 11px; text-decoration: none; color: #fff; border-radius: 3px; display: inline-block; width:32px; height: 32px; text-align: center;
	background-color:var(--color-tone-700); line-height: 1; -webkit-box-sizing: border-box; box-sizing: border-box; padding-top: 4px; vertical-align:-3px; font-weight:400; }

/* footer */
footer{-webkit-box-sizing: border-box;box-sizing: border-box;margin: 40px auto 0;background:#f9f9f9;padding:40px 50px 50px;}
footer .note_wr {-webkit-box-sizing: border-box;box-sizing: border-box;display:flex;}
footer h2 {width:160px;padding:30px 20px;background:#ddd;text-align:center;}

footer .desc_data {width:calc(100% - 160px);-webkit-box-sizing: border-box; box-sizing: border-box; padding: 30px 30px 30px 20px; background-color: #fff; font-size:13px; }
footer .desc_data p,
footer .desc_data span { font-family: var(--font-text) !important; line-height:1.75; }
footer table{width: 100%!important; padding:5px 10px; font-size: 14px; line-height: 1.8; min-height: 40px; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 50px; font-family:var(--font-text);}


.btn{ border: solid 1px black; margin:10px 5px 5px 0px;}
.doc_subject{width:90%; }
.remote{width: 150;height: 200px;display: block;position: fixed;top: 600px;left: 240px;z-index: 150;cursor: move; border: solid 1px black; background:#fff}

/* sample_view */
.ESTI-estimate .nav_wr {max-width: 1100px;background:#fff;border-radius:5px;overflow:hidden;padding:30px 20px;width: 330px;order: 2;}
.ESTI-estimate .nav_wr h2 {text-align:center;margin-bottom:30px;font-size:28px;color:var(--color-tone-700);border-bottom: 1px dashed var(--color-tone-200);padding-bottom: 25px;}
.ESTI-estimate .nav_wr {}
.ESTI-estimate .nav_wr {}
.ESTI-estimate .in_sample_nav {gap:10px;margin-bottom:0 !important;}
.ESTI-estimate .in_sample_nav .nav-item {width: calc((100% - 80px) / 9);display: flex;flex-direction: column;gap: 5px;}
.ESTI-estimate .in_sample_nav img {border:1px solid var(--color-tone-200);border-radius:5px;overflow:hidden;}
.ESTI-estimate .in_sample_nav .nav-link {background: var(--color-tone-100);color: var(--color-tone-600);}
.ESTI-estimate .in_sample_nav .nav-link:hover {color:var(--color-primary);}
.ESTI-estimate .in_sample_nav .nav-link.active {background:var(--color-primary);color:#fff;}

/* sample_view_2 */
.ESTI-estimate .nav_wr.ver_02 {width: 330px;position: fixed;top: 0;right: 8px;border-radius:0;height: 100vh;}
.ESTI-estimate .nav_wr.ver_02 .in_sample_nav {gap:30px 10px;}
.ESTI-estimate .nav_wr.ver_02 .in_sample_nav .nav-item {width:calc((100% - 20px) / 3);}
.ESTI-estimate .nav_wr.ver_02 .in_sample_nav {}
.ESTI-estimate .nav_wr.ver_02 .in_sample_nav {}
.ESTI-estimate .nav_wr.ver_02 .in_sample_nav .nav-link {color: var(--color-tone-600);font-weight:500;background:none;padding:0;position:relative;}
.ESTI-estimate .nav_wr.ver_02 .in_sample_nav .nav-link img {margin-bottom:5px;}
.ESTI-estimate .nav_wr.ver_02 .in_sample_nav .nav-link:hover {color:var(--color-primary);}
.ESTI-estimate .nav_wr.ver_02 .in_sample_nav .nav-link.active {color:var(--color-primary);}
.ESTI-estimate .nav_wr.ver_02 .in_sample_nav .nav-link.active:after {display:block;content:"\f058";font-family:var(--font-icon);font-weight: 900;position:absolute;top:50%;left:50%;font-size:40px;
color:var(--color-primary);transform:translate(-50%,-65%);}
.ESTI-estimate .section-body > .wrap > #pills-tabContent .container {max-width: 1100px !important;padding: 0 !important;}