@charset "utf-8";

/* layout */
.popupWrap {position: relative;}

/* common */
.popbtn {display:inline-flex; justify-content:center; align-items:center; padding:0 15px; height:40px; border-radius:3px;}
.popbtn span {margin-left:10px;}
.popbtn img {position:relative; top:1px;}
.popupWrap .btn {height:40px; min-width:100px;}
.popupWrap .ctitle {margin-bottom:10px;}
.popupWrap .text {margin-bottom:20px;}
.popupWrap .innerBox {padding:0 0 30px 0;}
.popupWrap .innerBox + .innerBox {border-top:1px solid #ddd; padding-top:40px; padding-bottom:0;}
.popupWrap .dot-list li {margin-bottom:4px;}
.popupWrap .applyBox {padding:40px; background-color:#f2f4fb;}
.popupWrap .inputBox {margin:30px 0 25px 0;}
.popupWrap .siteSearch {margin-bottom:25px;}
.popupWrap .siteSearch .inputBox {margin:0;}
.popupWrap .siteSearchView {padding:15px 10px; margin-bottom:25px;}
.popupWrap .siteSearchView ul.list li {padding:5px 12px;}
.popupWrap .siteSearchView ul.list li:hover {background-color:#f2f4fb;}
.popupWrap .siteSearchView ul.list li a {display:block;}
.popupWrap a + a {margin-left:10px;}
.popupWrap .tabmenu {margin-bottom:25px;}
.popupWrap .tabmenu.col2 ul li {width:50%;}
.popupWrap .summaryDesc .innerBox {display:block; padding-bottom:0;}
.popupWrap .summaryDesc .innerBox .logo {width:120px;}
.popupWrap .summaryDesc .innerBox .textBox {margin-left:0; margin-top:20px;}
.popupWrap .summaryDesc .innerBox .textBox p {font-size:1.059em;}
.popupWrap .summaryDesc .innerBox .textBox p:first-child {font-size:1.176em;}
.popupWrap .rightBox .summaryDesc {padding:15px;}
.popupWrap .statWrap #yearchart {min-height:620px;}

/* »ó´Ü Å¸ÀÌÆ² */
.popupHeader {position: relative; display: flex; align-items: center; height: 60px; padding: 0 40px; background-color: #255193; float:left; width:100%;}
.popupHeader h1 {position:relative; font-size: 22px; color: #fff; padding-bottom: 3px; padding-left:15px;}
.popupHeader h1:before {display:block; content:''; width:3px; height:20px; border-radius:2px; background-color:#fff; position:absolute; left:0; top:53%; transform:translateY(-50%);}

/* °Ë»ö */
.popupSearch {padding: 30px; background-color: #f1f5fd;}
.popupSearch .boardSearch {padding: 0; margin-bottom: 0;}
.popupSearch .applyStepList {margin-bottom: 0;}

/* ÄÁÅÙÃ÷ */
.helpArea {position:relative; float:left; width:100%; height:60px; padding:10px;}
.popupContainer {position:relative;float:left;}
.topTxt {margin-bottom: 15px;}
.popupContainer .popupHead {text-align:center; margin-bottom:25px; margin-top:10px;}
.popupContainer .popupHead h4.title {font-size:24px;}
.popupContainer .caption {margin-top:5px;}
.popupContainer .caption span {font-weight:bold; float:right;}

/* Å×ÀÌºí */
.popupWrap .tbl th {padding: 12px 2px; position: relative;}
.popupWrap .tbl td {padding: 12px 2px; position: relative;}
.popupWrap .tbl td > a {font-weight: 500; color: #0000dd; text-decoration: underline;}
.popupWrap .tbl td > a.btn {text-decoration: none;}

.pagingWrap {margin-bottom: 30px;}

.scrollerBar {overflow: auto;}
.scrollerBar table {min-width: 1000px;}
.scrollerBar1 {overflow: auto;}
.scrollerBar1 table {min-width: 1100px;}
.scrollerBar2 {overflow: auto; height: 500px;}
.scrollerBar2 table {min-width: 1300px;}
.scrollerBarS {overflow: auto;}
.scrollerBarS table {min-width: 700px;}

/* ¹ÙÄÚµå »çÀÌÁî design */
.barcodeS {display: inline-flex; margin-right: 5px;}
.barcodeS input[type="radio"] {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0;}
.barcodeS input[type="radio"] + label {cursor: pointer; display: flex; align-items: center; justify-content: center; width: 65px; height: 36px; border: 1px solid #ccc; border-radius: 2px;}
.barcodeS input[type="radio"]:focus + label {outline: 1px dotted #000;}
.barcodeS input[type="radio"]:checked + label {color: #fff; background-color: #1d5493;}

.issnBarcode {margin-bottom: 25px;}
.issnBarcode .codeWrap {border: 1px solid #ddd !important;}
.codeWrap {display: flex; align-items: center; justify-content: center; padding: 20px !important; border: none !important; box-sizing: border-box;}
.codeWrap .barcodeArea {display: flex; flex-direction: column;}
.codeWrap .barcodeArea div + div {margin-top: 5px;}
.codeWrap .barcodeArea .price, .barcodeWrap .barcodeArea .num {font-size: 12px; padding-left: 12px;}
.board-write > ul > li.col-2 {width: 50%;}
.board-write > ul > li > div .txt .aiInfo {display: none; width: 100%; margin-top: 10px;}
.board-write > ul > li > div .txt .aiInfo p + p {margin-left: 30px;}
.board-write > ul > li > div .txt .aiInfo p input {margin: 0 5px;}

.qrSize {display: flex; flex-wrap: wrap;}
.qrSize p:nth-child(2) {margin-right: 10px;}
.qrSize p input {margin: 0 5px;}

.tblWrap.code {font-size: 0.941em;}


/* ÆË¾÷´Ý±â */
.popupClose {position: absolute; top: 0; right: 0; width: 60px; height: 60px; background-color: #255193; z-index: 99;}
.popupClose a {position: relative; display: block; width: 100%; height: 100%;}
.popupClose a::before, .popupClose a::after {content: ""; position: absolute; left: 50%; top: 50%; width: 40%; height: 3px; margin: -1px 0 0 -20%; background-color: #fff;}
.popupClose a::before {transform: rotate(45deg);}
.popupClose a::after {transform: rotate(-45deg);}

/* ÆË¾÷´Ý±â¹öÆ° */
.popupContainer .TabCont .btnGroup {margin-top:25px;}
.btnGroup .optbtn {min-width:100px; height:40px; line-height:40px; border-radius:3px; padding:0 25px; box-sizing:border-box;}
.btnGroup .optbtn.reset {background-color:#f6f6f6; border:1px solid #cfcfcf; color:#222;}
.btnGroup .optbtn.search {min-width:140px;}

/* µµ¿ò¸» */
.popupContainer .guide {word-break:keep-all;}
.popupContainer .guide > li + li {margin-top:15px;}
.popupContainer .guide > li > strong {font-size:1.067em; color:#222;}
.popupContainer .guide > li > ul > li > strong {display:inline-block; margin-bottom:3px; text-decoration:underline;}
.popupContainer .guide > li > ul > li {font-size:14px; margin-left:13px; margin-top:2px;}
.popupContainer .guide > li > ul > li + li {margin-top:5px;}
.popupContainer .guide > li > ul > li > ul > li {font-size:14px; margin-left:15px;}

/* ÆË¾÷Â÷Æ® */
.popupContainer .statWrap .summaryDesc {height:auto;}



@media screen and (max-width: 768px){
	/* »ó´Ü Å¸ÀÌÆ² */
	.popupHeader {height: 60px; padding: 0 30px;}
	.popupWrap .tabmenu {margin-bottom:20px;}
	.popupContainer .TabCont .btnGroup {margin:20px 0 10px 0;}

	/* °Ë»ö */
	.popupSearch {padding: 20px;}

	/* ÄÁÅÙÃ÷ */
	.popupContainer {padding: 15px;}

	/* ÆË¾÷´Ý±â */
	.popupClose {width: 60px; height: 60px;}

	.btnGroup {margin: 25px auto;}
}
@media screen and (max-width: 640px){
	.popupWrap .alignWrap {flex-wrap:wrap;}
	.popupWrap .rightBox, .popupWrap .leftBox {width:100%;}
	.popupWrap .leftBox {margin-right:0; margin-bottom:20px;}
	
}
@media screen and (max-width: 480px){
	.board-write > ul > li.col-2 {width: 100%;}
	.board-write > ul > li > div .txt .aiInfo {flex-direction: column;}
	.board-write > ul > li > div .txt .aiInfo p + p {margin-left: 0; margin-top: 5px;}

	.qrSize p:nth-child(2) {margin-right: 5px;}
	.qrSize p input {margin: 0 3px;}

	.btnGroup {margin: 20px auto;}
}
@media screen and (max-width: 414px){
	.qrSize {justify-content: center;}
	.qrSize a {margin-top: 5px;}
}