@charset "utf-8";

.infoContents{display:block; width:100%;}
.infoContents p{margin:0;}
.infoColumn{max-width:1200px; margin:0 auto; padding:0 20px;}

@media all and (min-width:1200px){
	.infoColumn{padding:0 16px;}
	.infoColumn:after{content:''; display:block; clear:both;}
	.infoColumn .keyHalfArea{float:left; width:50%}
}

/* tabs */
.tabs .tabColumn{display:none;}
.tabs .tabColumn.active{display:block;}

/* reserved Word */
.srOnly{position:absolute; overflow:hidden; width:1px; height:1px; margin:-1px; padding:0; white-space:nowrap; clip:rect(0, 0, 0, 0); border:0;}
.clearFix::after{display:block; content:''; clear:both;}



/* keyWrapper */
.keyWrapper{padding:35px 0 28px; background:#14447a url('../images/bg_search_area.png') 50% bottom repeat-x;}

/* keySearchArea */
.keySearchArea{position:relative; height:50px; margin:0 auto; z-index:5;}
.keySearchArea .keySearch{overflow:hidden; position:absolute; width:100%; max-height:50px; padding-top:50px; border-radius:50px; box-shadow:7px 7px 30px 0 rgba(0, 0, 0, 0.2); box-sizing:border-box; background-color:#fff;}
.keySearchArea .keySearch.active{max-height:290px; transition:max-height 0.35s ease; border-radius:35px;}
.keySearchArea .keySearchForm{position:absolute; top:0; width:100%;}
.keySearchArea .keySearchInput{width:100%; height:50px; margin:0; padding:15px 60px 15px 20px; font-family:'Gmarket Sans', sans-serif; font-size:16px; letter-spacing:0.8px; line-height:100%; color:#666; box-sizing:border-box; border:0; outline:none;}
.keySearchArea .keySearchInput::placeholder{color:#666; opacity:1;}
.keySearchArea .keySearchInput:-ms-input-placeholder{color:#666;}
.keySearchArea .keySearchButton{position:absolute; right:0; top:0; width:60px; height:50px; background:url('/template/pban/images/user/ico-key-search.png') 50% 50% no-repeat; background-size:20px 20px;}
.keySearchArea .keySearchResult{overflow-x:hidden; overflow-y:auto; max-height:220px; padding:22px 20px; font-size:16px; color:#666; border-top:1px solid #e4e9f2; box-sizing:border-box;}
.keySearchArea .keySearchWord{display:none;}
.keySearchArea .keySearchWordItems:nth-child(n+2){margin-top:8px;}
.keySearchArea .keySearchWordBtn{display:inline-block; font-size:inherit; color:inherit; text-align:left;}
.keySearchArea .keySearchPoint{font-style:normal; color:#2c76fc;}
.keySearchArea .keySearchResult.active .keySearchUnWord{display:none;}
.keySearchArea .keySearchResult.active .keySearchWord{display:block;}


/* keyWordArea */
.keyWordArea{overflow-x:auto; overflow-y:hidden; position:relative; height:70px;}
.keyWordArea .keyWordList{overflow:hidden; display:table; margin:15px auto;}
.keyWordArea .keyWordItems{display:table-cell; padding:0 3px;}
.keyWordArea .keyWords{display:inline-block; height:40px; padding:3px 15px 0; font-family:'Gmarket Sans', sans-serif; font-size:14px; font-weight:500; letter-spacing:-0.8px; line-height:100%; text-align:center; color:#fff; border-radius:50px; border:1px solid #fff;}


/* keyNoticeArea */
.keyNoticeArea{position:relative; border:1px solid #d9d9d9; margin:20px 0; border-radius:10px; padding:40px; box-sizing:border-box; box-shadow:5px 5px 5px rgba(238, 238, 238, 0.75);}
.keyNoticeArea > h3{position:relative; margin:0 0 20px; font-size:26px; font-family:'Gmarket Sans', sans-serif; font-weight:500; color:#212121;}
.keyNoticeArea > h3 > strong{color:#386ba3; font-weight:700;}
.keyNoticeArea > h3 > a.more{display:block; position:absolute; right:0; top:0; width:23px; height:23px; background:url('../images/btn_more.png') no-repeat; text-indent:-9999em;}
.keyNoticeArea > ul > li{position:relative; line-height:180%;}
.keyNoticeArea > ul > li:before{content:''; position:absolute; left:0; top:50%; transform:translateY(-50%); display:inline-block; width:4px; height:4px; background:#212121;}
.keyNoticeArea > ul > li > a{display:block; width:calc(100% - 100px); margin-top:8px; padding-left:12px; text-overflow:ellipsis; letter-spacing:-0.7px; white-space:nowrap; overflow:hidden;}
.keyNoticeArea > ul > li > .keyNoticeDate{position:absolute; right:0; top:0; font-size:14px;}


/* keyBannerArea */
.keyBannerArea{margin-bottom:20px; border-radius:10px; box-sizing:border-box; box-shadow:5px 5px 5px rgba(238, 238, 238, 0.75); overflow:hidden;}
.keyBannerArea .keyBannerLink{display:block; position:relative;}
.keyBannerArea .keyBannerLink:focus::after{display:block; position:absolute; left:0; top: 3px;width: 100%;height: 97%; border:3px solid rgba(0, 0, 0, 0.8); box-sizing:border-box; content:'';}
.keyBannerArea .keyBannerImg{width:100%;}
.keyBannerArea .keyBannerPagination{position:absolute; left:10px; bottom:10px; width:auto; z-index:5;}
/* bsh 웹접근성 가이드 조치 6mm 이상  */
.keyBannerArea .swiper-pagination-bullet {
    width: 23px;
    height: 23px;
    border-radius: 10px;
    margin-right: 0 !important;
    padding: 0;
    transition: width 0.35s ease;
}
.keyBannerArea .swiper-pagination-bullet:nth-child(n+2){margin-left:5px;}
.keyBannerArea .swiper-pagination-bullet-active{width:50px; background-color:#000;}


/* keyQuickArea */
.keyQuickArea{width:100%; background:#f7f7f7; border-bottom:1px solid #e7e7e7;}
.keyQuickArea .keyQuickList{max-width:1200px; margin:0 auto;}
.keyQuickArea .keyQuickItems{float:left; width:33.333%; box-sizing:border-box; border-right:1px solid #e7e7e7;}
.keyQuickArea .keyQuickLink{display:block; width:100%; max-width:200px; margin:0 auto; padding:60px 0 4px; font-size:14px; font-family:'Gmarket Sans', sans-serif; font-weight:500; line-height:2; letter-spacing:-0.6px; text-align:center; color:#142e4e; box-sizing:border-box; background-repeat:no-repeat; background-position:50% 10px; background-size:42px auto;}
.keyQuickArea .keyQuickLink:hover,
.keyQuickArea .keyQuickLink:focus{background-color:#fff;}
.keyQuickArea .keyQuickLinkBanSummary{background-image:url('/template/pban/images/user/ico-ban-summary.png');}
.keyQuickArea .keyQuickLinkBanItem{background-image:url('/template/pban/images/user/ico-ban-item.png');}
.keyQuickArea .keyQuickLinkBanRule{background-image:url('/template/pban/images/user/ico-ban-rule.png'); background-size:48px auto;}
.keyQuickArea .keyQuickLinkBanAgency{background-image:url('/template/pban/images/user/ico-ban-agency.png'); background-size:46px auto;}
.keyQuickArea .keyQuickLinkBanGuide{background-image:url('/template/pban/images/user/ico-ban-guide.png');}
.keyQuickArea .keyQuickLinkBanArea{background-image:url('/template/pban/images/user/ico-ban-area.png');}


/* statisticWrapper */
.statisticWrapper {position: relative; margin-bottom:20px; border:1px solid #d9d9d9; border-radius:10px; box-shadow:5px 5px 5px rgba(238, 238, 238, 0.75); overflow:hidden;}
.statisticWrapper > h3{position:relative; margin:0; padding:40px 40px 25px; font-size:26px; font-family:'Gmarket Sans', sans-serif; font-weight: 500; color:#212121; border-bottom:1px solid #ccc;}
.statisticWrapper > h3 > strong{color:#386ba3; font-weight:700;}
.statisticWrapper .statsArea {position: relative;}
.infoColumn > .statsArea {position: relative; width:100%; margin-bottom:20px; padding:40px; border:1px solid #d9d9d9; border-radius:10px; box-sizing:border-box; box-shadow:5px 5px 5px rgba(238, 238, 238, 0.75);}
.infoColumn > .statsArea:after{content:''; display:block; clear:both;}
.infoColumn > .statsArea > div > h3{position:relative; margin:0 0 20px; font-size:26px; font-family:'Gmarket Sans', sans-serif; font-weight: 500; color:#212121;}
.infoColumn > .statsArea > div > p{margin-bottom:20px; font-family:'Gmarket Sans', sans-serif; font-weight: 500;}
.infoColumn > .statsArea > div > h3 > strong{color:#386ba3; font-weight:700;}
.infoColumn > .statsArea > div > h3 > span.more{position:absolute; right:0; top:10px; text-indent:-9999em;}

.statisticWrapper .statsTabList {padding: 0 5px; border-bottom: 1px solid #e4e9f2;}
.statisticWrapper .statsTabList > li {float: left; width: 33.333%;}
.statisticWrapper .statsTabList > li > a {display: block; margin-bottom: -1px; padding: 14px 0; font-size: 14px; font-weight: 500; letter-spacing: -0.7px; text-align: center; color: #666;}
.statisticWrapper .statsTabList > li.on > a,
.statisticWrapper .statsTabList > li > a:hover {color: #2c76fc;}
.statisticWrapper .statsTabList > li.on > a {border-bottom: 2px solid #2c76fc;}
.statisticWrapper .statsTabContents {padding: 20px 0 11px;}
.statisticWrapper .radioWrap {margin: 0 0 10px;}
.statisticWrapper .chtUnit {float: none; width: 100%; max-width:1200px; margin: 0 auto; padding: 0 55px; font-size: 12px; letter-spacing: -0.6px; text-align: right; color: #333; box-sizing: border-box;}
.statisticWrapper .radioWrapRow {width: 120px; height: 30px; margin: 0 auto;}
.statisticWrapper .radioWrapCol {display: block; position: relative; float: left; width: 60px; height: 30px;}
.statisticWrapper .radioWrapCol label {display: block; width: 100%; height: 30px; margin: 0; font-size: 13px; letter-spacing: -0.65px; text-align: center; line-height: 28px; color: #666; border: 1px solid #ced3dc; box-sizing: border-box; background-color: #f5f5f5;}
.statisticWrapper .radioWrapCol:nth-child(1) label {border-top-left-radius: 5px; border-bottom-left-radius: 5px; border-right: 0;}
.statisticWrapper .radioWrapCol:nth-child(2) label {border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-left: 0;}
.statisticWrapper .radioWrapCol input[type="radio"] {position: absolute; width: 100%; height: 100%; margin: 0; opacity: 0;}
.statisticWrapper .radioWrapCol input[type="radio"]:hover + label {color: #2c76fc; border-color: #2c76fc; background-color: #fff;}
.statisticWrapper .radioWrapCol input[type="radio"]:checked + label {border-color: #2c76fc; background-color: #2c76fc; color: #fff;}
.statisticWrapper .radioWrapCol input[type="radio"]:focus+label,
.statisticWrapper .radioWrapCol input[type="radio"]+label:focus{background-color: #fff; border: 1px solid #2C76fc; color: #2C76fc;	}
.statisticWrapper .graphWrap {overflow-x: auto; overflow-y: hidden; width: 100%; box-sizing: border-box;}
.statisticWrapper .graphIn {width: 100%; height: 250px; margin: 0 auto; padding:0 20px; box-sizing:border-box;}
.statisticWrapper .graphIn .chart01 {height: 100%;}
.statisticWrapper .statsOptionWrap {display: none;}
.statisticWrapper .statsOptionWrap.active {display: block;}
.statisticWrapper .statsOptionList {overflow: hidden; width: calc(100% - 7px); max-width: 800px; margin: 0 auto; padding-left: 7px; text-align: center;}
.statisticWrapper .statsOptionItems {position: relative; float: left; margin: 4px 2px 0;}
.statisticWrapper .statsOptionlabel {display: block; width: 40px; height: 24px; margin: 0; line-height: 22px; font-size: 13px; letter-spacing: -0.65px; text-align: center; color: #999; border-radius: 12px; border: 1px solid #ced3dc; box-sizing: border-box; background-color: #f5f5f5;}
.statisticWrapper .statsOptionRadio {position: absolute; width: 100%; height: 100%; margin: 0; opacity: 0;}
.statisticWrapper .statsOptionRadio:hover + label {color: #2c76fc; border-color: #2c76fc; background-color: #fff;}
.statisticWrapper .statsOptionRadio:checked + .statsOptionlabel {color: #fff; border-color: #2c76fc; background-color: #2c76fc;}
.statisticWrapper .statsOptionRadio:focus + .statsOptionlabel {color: #2c76fc; border-color: #2c76fc; background-color: #fff;}
.statisticWrapper .statsQuickList {overflow: hidden; margin-top: 22px;}
.statsContent .statsQuickItems {float: left; width: 33.333%; padding: 5px; box-sizing: border-box;}
.statsContent .statsQuickItems > a > span{display:inline-block; margin-top:10px; padding:6px 8px 3px; border-radius:50px; background:#386ba3; color:#fff; text-align:center; font-family:'Gmarket Sans', sans-serif; font-weight: 500; font-size:13px; line-height:1;}
.statsContent .statsQuickLink {overflow: hidden; display: block; padding-top: 52px; letter-spacing: -0.6px; text-align: center; background-repeat: no-repeat; background-position: 50% 0; background-size: 42px 42px;}
.statsContent .statsQuickIntegration {background-image: url('/template/pban/images/user/ico-official-integration.png');}
.statsContent .statsQuickOrganization {background-image: url('/template/pban/images/user/ico-official-organization.png');}
.statsContent .statsQuickSubject {background-image: url('/template/pban/images/user/ico-official-subject.png');}
.statsContent .statsQuickIndicator {background-image: url('/template/pban/images/user/ico-official-indicator.png');}
.statsContent .statsQuickOrganization2 {background-image: url('/template/pban/images/user/ico-official-organization2.png');}
.statsContent .statsQuickTheme {background-image: url('/template/pban/images/user/ico-official-theme.png');}

/*23.01.16*/
.infoContents .infoColumn h3 {background: none; height: auto; width: 100%; padding: 40px 0;text-align: left; padding: 0;}
.infoContents .keyNoticeArea > h3 {padding: 0; }
.infoContents .statisticWrapper > h3 {padding: 30px 40px; }

/* institutionWrapper */
.institutionWrapper .m_organi > div {margin: 0 0 0 11px;}
.institutionWrapper .m_organi > div li {width: 215px; box-sizing: border-box;}
.institutionWrapper .btnPrev,
.institutionWrapper .btnNext {top: 0; height: 100%; border: 0; border-radius: 0; background-repeat: no-repeat; background-size: 10px 16px; background-color: #fff;}
.institutionWrapper .btnPrev {left: 0; background-position: 0 50%; background-image: url('/template/pban/images/user/ico-institution-prev.png');}
.institutionWrapper .btnNext {right: 0; background-position: 100% 50%; background-image: url('/template/pban/images/user/ico-institution-next.png');}




/* media query */
@media all and (max-width:767px){
	.keyQuickArea .keyQuickItems{border-bottom:1px solid #e7e7e7;}
}

@media all and (min-width:768px){
	/* keySearchArea */
	.keySearchArea{width:100%; max-width:510px;}

	/* keyWordArea */
	.keyWordArea{overflow:visible;	height:auto;}
	.keyWordArea .keyWordList{position:static;	 margin-top:30px;}
	.keyWordArea .keyWordItems{display:block; float:left; padding:0 3px;}

	/* keyQuickArea */
	.keyQuickArea .keyQuickItems{width:16.666%;}

	/* keyQuickArea */
	.keyQuickArea .keyQuickList{text-align:center;}
	
	/* statisticWrapper */
	.statsContent .statsQuickItems > a > span{display:inline-block; min-width:120px; margin-top:10px; padding:3px 8px 0; border-radius:50px; background:#386ba3; color:#fff; text-align:center; font-family:'Gmarket Sans', sans-serif; font-weight: 500; font-size:15px; line-height:26px;}

	/* institutionWrapper */
	.institutionWrapper {display: block; border-top:1px solid #ddd;}
}

@media all and (min-width:1200px){
	/* keyWrapper */
	.keyWrapper{padding:80px 0 60px;}

	/* keySearchArea */
	.keySearchArea{height:70px;}
	.keySearchArea .keySearch{max-height:70px; padding-top:70px; border-radius:50px;}
	.keySearchArea .keySearchInput{height:70px; padding:21px 80px 21px 31px; font-size:20px; letter-spacing:-1px;}
	.keySearchArea .keySearchButton{width:80px; height:70px; background-size:28px 28px;}

	/* keyWordArea */
	.keyWordArea .keyWordList{min-height:120px;}
	.keyWordArea .keyWords{height:34px;}
	.keyQuickArea .keyQuickItems:first-child{border-left:1px solid #e7e7e7;}

	/* keyBannerArea */
	.keyBannerArea{margin:40px 0 40px 20px; border-radius:50px;max-height:335px; overflow:hidden;}
	.keyBannerArea .keyBannerPagination{left:30px; bottom:30px;}

	/* keyQuickArea */
	.keyQuickArea .keyQuickLink{max-width:none; width:100%; height:100%; padding:110px 0 25px; font-size:17px; font-weight:500; line-height:1.41;	letter-spacing:-0.85px; background-position:50% 36px;	background-size:54px auto;}
	.keyQuickArea .keyQuickLinkBanRule{background-size:62px auto;}
	.keyQuickArea .keyQuickLinkBanAgency{background-size:60px auto;}

	/* keyNoticeArea */
	.keyNoticeArea{width:100%; max-width:580px; min-height:335px; margin:40px 0;padding:40px 40px; border-radius:50px;}

	/* statisticWrapper */
	.statisticWrapper{margin-bottom:40px; border-radius:50px;}
	.statisticWrapper .statsTabList {padding: 0 40px;}
	.statisticWrapper .statsTabList > li > a {padding: 31px 0 15px;	font-size: 20px; letter-spacing: -1px;}
	.statisticWrapper .statsTabList > li.on > a {border-bottom: 5px solid #2c76fc;}
	.statisticWrapper .statsTabContents {padding-bottom: 30px;}
	.statisticWrapper .radioWrapRow {width: 160px; height: 40px;}
	.statisticWrapper .radioWrapCol {width: 80px; height: 40px;}
	.statisticWrapper .radioWrapCol label {height: 40px; font-size: 16px; letter-spacing: -0.8px; line-height: 38px;}
	.statisticWrapper .chtUnit {font-size: 14px; letter-spacing: -0.7px;}
	.statisticWrapper .chtYear {float: none; width: 100%; margin: 0 auto; padding: 0 55px; font-size: 12px; letter-spacing: -0.6px; text-align: right; color: #333; box-sizing: border-box;}
	.statisticWrapper > h3{padding:40px 55px 25px;}
	.infoColumn > .statsArea {margin-bottom:40px; padding:40px 40px; border-radius:50px; box-sizing:border-box;}
	.infoColumn > .statsArea > div{float:left;}
	.infoColumn > .statsArea > div:first-child{width:268px;}
    .infoColumn > .statsArea > div:last-child{float:right;}
	.statsContent{width:60%;}
}
/* bsh 웹접근성 항목7 */
.swiper-pagination-bullet{
    opacity: .8;
    background: white;
    backdrop-filter: blur(10px);
    box-shadow: 1px 1px 3px #0000009e;
}