@charset "utf-8";
/* CSS Document */

/*main*/
section.main {width:100%; background:#eaebf0;}
.sg-main {width:100%; height:494px; padding:0 10px; background:url(../images/main/sg-main.jpg) center no-repeat;}
.sg-main-text {width:100%; max-width:1200px; margin:0 auto; }
.main-text {padding-top:50px; font-size:45px; font-weight: 600; color:#25344c;}
.main-text span{display:inline-block; font-size:45px; color:#174d73; vertical-align: top;}
.sg-main-text>span {display:inline-block; padding-top:15px; font-size:24px; font-weight:300;}
.main-text > img.main-eGovFrame{padding: 0 0 0 10px;}
.sg-main-text .text-ul {padding-top:40px; font-size:15px; line-height:23px;}
.sg-main-text .icon-ul {padding-top:40px;}
.sg-main-text .icon-ul li {position:relative; display:inline-block; margin-left:10px; padding-right:20px; height:35px; vertical-align: top;}
.sg-main-text .icon-ul li:after {position:absolute; top:0; right:0; display:block; width: 1px; height:36px; content:""; background:url(../images/main/mic-bar.jpg) no-repeat;}
.sg-main-text .icon-ul li:last-child:after {background:none;}
.sg-main-text .icon-ul li span {font-size:15px;}

.sg-main-text .icon-ul li.mic01 {background: url(../images/main/sg-mic01.png) left center no-repeat;}
.sg-main-text .icon-ul li.mic01 span {display:block; padding-left:44px;}
.sg-main-text .icon-ul li.mic02 {background: url(../images/main/sg-mic02.png) left center no-repeat;}
.sg-main-text .icon-ul li.mic02 span {display:block; padding-left:40px;}
.sg-main-text .icon-ul li.mic03 {background: url(../images/main/sg-mic03.png) left center no-repeat;}
.sg-main-text .icon-ul li.mic03 span {display:block; padding-left:35px;}
.sg-main-text img {opacity: 0.8;}
/* .sg-main-text img {padding-top:30px;} */
.sb-btn-guide {display: inline-block;margin-top: 30px;background: #174d73;padding: 15px 30px;color: #fff;text-shadow: 1px 0; border-radius: 5px;}
.sb-btn-guide:hover {color:#fff; background:#113d5c; text-decoration: none;cursor: pointer;}


/*Ư¡1*/
.sg-fwrap {display:table; width:100%; height:500px;}
.sg-fwrap:after{display:block;clear:both;content:'';}
.sg-fwrap>li {float:left;vertical-align:top; height:270px; }
.sg-fwrap li>div {display:block; width:100%;}
.sg-fwrap li>div>img {display:inline-block; float:left; padding:70px 40px; vertical-align: top;}
.sg-fwrap li>div>div {display:inline-block; width:auto; vertical-align: top;}
.sg-fwrap li>div>div h3 {position:relative; padding-bottom:40px; font-size: 22px; font-weight:300;}
.sg-fwrap li>div>div h3:after {position:absolute; bottom:20px; display:block; width:21px; height:1px; background:#fff; content:"";}
.sg-fwrap li>div>div>ul>li {position:relative; padding-left:20px;  font-size:15px; line-height:25px; font-weight:300;}
.sg-fwrap li>div>div>ul>li:before {position: absolute; left:6px; top:10px; display:block; width:2px; height:2px; background:#fff; content:"";}
.sg-fwrap .white>div>div>ul>li:before {position: absolute; left:6px; top:10px; display:block; width:2px; height:2px; background:#a3a3a3; content:"";}
.sg-fwrap .white {position: relative; display: inline-block;width:50%; background:#fff;}
.sg-fwrap .white>div {position:absolute; right:0; width:100%; max-width:600px; height:100%; }
.sg-fwrap .white>div>div {padding-top:40px; }
.sg-fwrap .white>div>div h3 {color:#333;}
.sg-fwrap .white>div>div h3:after {background:#a7a7a7;}
.sg-fwrap .white>div>div li {color:#666;}
.sg-fwrap .blue {position: relative;display:inline-block;width:50%;background:#174d73;}
.sg-fwrap .blue>div {position:absolute; left:0; width:100%; max-width:600px;  height:100%; color:#fff; }
.sg-fwrap .blue>div>div {padding-top:40px; }
.sg-fwrap .gray01 {position: relative;display:inline-block;width:50%;  background:#464a4d;}
.sg-fwrap .gray01>div {position:absolute; right:0; width:100%; max-width:600px; height:100%; background: #35393c; color:#fff;}
.sg-fwrap .gray01>div>div {padding-top:40px; }
.sg-fwrap .gray02 {position: relative;display:inline-block;width:50%; background:#464a4d;}
.sg-fwrap .gray02>div {position:absolute; left:0; width:100%; max-width:600px; height:100%; color:#fff; }
.sg-fwrap .gray02>div>div {padding-top:40px; }

/*Ư¡2*/
section.con2 { width:100%; background: #fff;}
.sg-fwrap02 {width:100%; max-width:1200px; padding: 0 10px; margin:0 auto;  }
.sg-fwrap02 h3 {position:relative; padding-top:70px; padding-bottom:40px; text-align:center; font-size:38px; font-weight:600; color:#000;letter-spacing: -2px; }
.sg-fwrap02 h3:after {position:absolute; bottom:20px; right:0; left:0; display:block; width:32px; height:1px; background:#174d73; margin:0 auto; content:"";}
.sg-fwrap02 span {display:block; font-size:17px; color:#000; text-align:center;}
.sg-fwrap02>ul {display:table;width:100%; padding:70px 0; }
.sg-fwrap02>ul>li{float:left;display:inline-table; width:50%; padding-bottom:40px;}
.sg-fwrap02>ul>li>img {display:table-cell; vertical-align:top;}
.sg-fwrap02>ul>li>div{display:table-cell; width:80%; vertical-align:middle;}
.sg-fwrap02>ul>li>div>h4 {padding-bottom:10px; font-size:19px; color:#333; font-weight:400;}
.sg-fwrap02>ul>li>div>h4 {padding-bottom:10px; font-size:17px; color:#333; font-weight:400; text-shadow:0.5px 0;}
.sg-fwrap02>ul>li>div>ul>li { font-size:14px; color:#333; font-weight:100;line-height:21px;word-break:break-all;}


/*�����ϱ�*/
section.con3 {padding: 0 10px; padding-bottom:50px; background: url(../images/main/main-bg02.png) no-repeat; background-size: cover;}
section.con3 h3 {position: relative; padding-top: 70px; padding-bottom: 40px; text-align: center; font-size:33px; color:#fff; font-weight:500;}
section.con3 h3:after {position:absolute; bottom:20px; right:0; left:0; display:block; width:32px; height:1px; background:#174d73; margin:0 auto; content:"";}
section.con3 img {display:block; margin:0 auto; text-align:center; }
section.con3 img:last-child {padding-top:50px; }
section.con3>span {display:block; padding-bottom:50px; font-size:17px; color:#fff; text-align:center; line-height:23px; opacity: 0.5;}
section.con3 .sbcode-box {display:block; border-radius: 30px; padding-bottom:30px; /*text-align:center;*/}
section.con3 .sbcode-box > div {display:inline-block;background:#fff; border-radius: 20px; width:100%;}
section.con3 .sbcode-box p {padding:1em 0; padding:1.5em 3em 1em 3em; text-shadow: 1px 0; font-size: 20px; color:#394380;}
section.con3 .sbcode-box ul {display:inline-block; padding:0em 3em 1em 3em;  font-size:18px; width:100%; text-shadow: 0.7px 0;}
section.con3 .sbcode-box ul li {padding:0.5em 2em; /*margin-bottom:0.5em;*/ background:#f5f5f5; line-height:30px; letter-spacing: 2px; border-radius: 10px;}
section.con3 .sbcode-box ul span {display:inline-block;}
section.con3 .sbcode-box ul span.blue {color:#000080;}
section.con3 .sbcode-box ul span.red {color:#e1265b;}
section.con3 .sbcode-box ul span.green {color:#5f7d6d;}
/*section.con3 .sbcode-box:after {display:block; width:30px; height:25px; margin:0 auto; background: url(../images/main/con-ul-after.png) no-repeat; content:"";}*/
section.con3 .sbcode-box:after {display:block; width:30px; height:25px; margin:0 auto;}

/*REFERENCE*/
section.con4 { width:100%; max-width:1200px; padding:0 10px; margin:0 auto; background: #fff;}
section.con4 h3 {position:relative; padding-top:70px; padding-bottom:40px; text-align:center; font-size:38px; font-weight:600; color:#000; letter-spacing: -2px;}
section.con4 h3:after {position:absolute; bottom:20px; right:0; left:0; display:block; width:32px; height:1px; background:#174d73; margin:0 auto; content:"";}
section.con4 span {display:block; font-size:17px; color:#000; text-align:center;}
section.con4 {padding-bottom:70px;}
section.con4>div {width:100%; max-width:1200px; margin:0 auto;}
section.con4>div>h4 { margin:0 auto; text-align:center;}
section.con4>div>h4>span{display:inline-block; margin-top:70px; padding:0.5em 0.7em;color:#fff; font-size:15px; background:#ffaa7b; border-radius: 20px; font-weight:400;  text-align:center;}
.logo-p-wrap {position:relative;}
.logo-p-wrap ul {display:table; width:100%; padding-top:20px; }
.logo-p-wrap ul li {display:inline-block;float:left; width:20%; margin-top:15px; }
.logo-p-wrap ul li img{border:1px solid #e5e5e5; box-sizing: border-box; }
.logo-p-wrap .more {position:absolute; right:0; top:80px;  display:block; width:15px; height:15px;
 	background: url(../images/main/logo-more.png) no-repeat; font-size:0; }
section.con4>div>h4>span {background:#174d73;}
.logo-c-wrap {position:relative;}
.logo-c-wrap ul {display:table; width:100%; padding-top:20px; }
.logo-c-wrap ul li {display:inline-block; float:left;width:20%; margin-top:15px; }
.logo-c-wrap ul li img{border:1px solid #e5e5e5; box-sizing: border-box; }
.logo-c-wrap .more {position:absolute; right:0; top:80px;  display:block; width:15px; height:15px; 
	background: url(../images/main/logo-more.png) no-repeat; font-size:0; }
section.con4>div>.c-tit span {background:#174d73;}
.logo-b-wrap {position:relative;}
.logo-b-wrap ul {display:table; width:100%; padding-top:20px; }
.logo-b-wrap ul li {display:inline-block; float:left;width:20%; margin-top:15px; }
.logo-b-wrap ul li img{border:1px solid #e5e5e5; box-sizing: border-box; }
.logo-b-wrap .more {position:absolute; right:0; top:80px;  display:block; width:15px; height:15px; background: url(../images/main/logo-more.png) no-repeat; font-size:0; }
section.con4>div>.b-tit span {background:#174d73;}


@media (max-width: 1200px) {
	.sg-gnb-wrap .sg-gnb-box {vertical-align:middle;}
	.sg-gnb-wrap .sg-gnb-box .sg-top-search {padding-top:0; padding-right:20px; }
	section.con3 img:last-child {width:100%;}
	.logo-p-wrap ul li img {width:100%;}
	.logo-c-wrap ul li img {width:100%;}
	.logo-b-wrap ul li img {width:100%;}
	.sg-sub-wrap .sg-subcon {padding:0;}

}

@media (max-width: 992px) {
	.sg-fwrap li>div>img {display:none;}
	.sg-footer-wrap>div:first-child img {display:inline-block;}
	.sg-footer-wrap>div:first-child p {float:right; display:inline-block; padding-top:0; vertical-align:top; }
	.sg-fwrap02>ul>li>img {width:65px;}	
	.sg-fwrap02>ul>li>div>ul {display:none;}
	.sg-fwrap .white>div>div {padding-left:40px;}
	.sg-fwrap .blue>div>div {padding-left:40px;}
	.sg-fwrap .gray01>div>div {padding-left:40px;}
	.sg-fwrap .gray02>div>div {padding-left:40px;}
	
	/*header.sh .sg-gnb-wrap h1 a {margin-left:10px;}*/

	.sg-subcon>div.con-div {max-width:100%;}
}

@media (max-width: 768px) {
	.sg-fwrap .white>div>div {padding-left:0px;}
	.sg-fwrap .blue>div>div {padding-left:0px;}
	.sg-fwrap .gray01>div>div {padding-left:0px;}
	.sg-fwrap .gray02>div>div {padding-left:0px;}
	/*.sg-gnb-wrap h1 a {width:100%;}*/
	.sg-main { height:auto; padding:0 0 30px 0;background:#fff;}
	.sg-main>img {width:100%;}
	.sg-main-text {text-align:center; padding-bottom:40px;}
	.sg-main-text .text-ul { padding-top:80px; font-size:15px; line-height: 20px}
	.main-text {padding-top:50px; margin-top:-170px; font-size:30px; }
	.main-text span {font-size:30px;}
	.sg-main-text>span {font-size:20px;margin-top:10px; background: #2159b2a8;color: #fff;padding: 0 10px;}
	.sg-main-text .icon-ul li.mic01 {background-position:center; padding-right:0;}
	.sg-main-text .icon-ul li.mic02 {background-position:center;padding-right:0;}
	.sg-main-text .icon-ul li.mic03 {background-position:center;padding-right:0;}
	.sg-main-text .icon-ul li.mic01 span {padding-top:50px; padding-left:0;}
	.sg-main-text .icon-ul li.mic02 span {padding-top:50px; padding-left:0;}
	.sg-main-text .icon-ul li.mic03 span {padding-top:50px; padding-left:0;}
	.sg-main-text .icon-ul li {margin:0 10px;}
	.sg-main-text .icon-ul {display: table;margin: 0 auto; padding-bottom:40px;}
	.sg-main-text .icon-ul li:after {right:-10px;}
	.sg-fwrap li>div>div h3:after {display:none;}
	.sg-fwrap li>div>div h3 {position:static; padding-bottom:0; font-size: 16px; font-weight:300; line-height:50px;}
	.sg-fwrap>li {height:50px; margin:0; text-align:center; }
	section .sg-fwrap>li.white{display:block; width:100%; background:#f4f6f9;}
	section .sg-fwrap>li.white>div {position:static; max-width:100%;}
	.sg-fwrap li.white>div>div {padding-top:0;line-height:50px;}
	section .sg-fwrap>li.blue{position:static;display:block; width:100%;}
	section .sg-fwrap>li.blue>div {position:static; max-width:100%;}
	.sg-fwrap li.blue>div>div {padding-top:0;line-height:50px;}
	section .sg-fwrap>li.gray01{display:block; width:100%;}
	section .sg-fwrap>li.gray01>div {position:static; max-width:100%;}
	.sg-fwrap li.gray01>div>div {padding-top:0;line-height:50px;}
	section .sg-fwrap>li.gray02{display:block; width:100%;}
	section .sg-fwrap>li.gray02>div {position:static; max-width:100%;}
	.sg-fwrap li.gray02>div>div {padding-top:0;line-height:50px;}
	
	.sg-fwrap {height:auto;}
	.sg-fwrap02>h3 {display:none;}
	.sg-fwrap02>span {display:none;}
	.sg-fwrap02>ul>li {display:table; margin-bottom:10px; width:100%;}
	.sg-fwrap02>ul>li img {width:70%;}
	
	section.con3 img {width:100%;}
	.sg-fwrap02>ul>li>img {width:50px; margin-left:20px;}
	.sg-fwrap02>ul>li {padding-bottom:0;}
	.sg-fwrap02>ul {padding:20px 0;}
	
	section.con3 {display:none;}
	section.con4 {border-top:1px solid #e5e5e5;}
	section.con4 h3 {padding-top:30px;}
	section.con4 span {display:none;}
	section.con4>div>h4 {display:block; }
	
	section.con4>div>h4>span { width:100%; padding:0; margin-top:0; border-radius:0; }
	section.con4>div>.p-tit span {height:50px; margin-bottom:10px; background:#e8eef6; color:#051f3c; line-height:50px;}
	section.con4>div>.c-tit span {height:50px; margin-bottom:10px; background:#e8eef6; color:#051f3c; line-height:50px;}
	section.con4>div>.b-tit span {height:50px; margin-bottom:10px; background:#e8eef6; color:#051f3c; line-height:50px;}
	.logo-p-wrap ul {display:none;}
	.logo-c-wrap ul {display:none;}
	.logo-b-wrap ul {display:none;}
	
	footer .sg-footer-wrap {padding:0;}
	.sg-footer-wrap>div:first-child p {float:none; padding:20px 20px 0 20px;}
	section.con4 {padding-bottom:40px;}
	
	.logo-p-wrap .more {top:20px; right:10px;}
	.logo-c-wrap .more {top:20px; right:10px;}
	.logo-b-wrap .more {top:20px; right:10px;}
	
	.sg-footer-copyright {letter-spacing:-1px;}
	.sg-footer-copyright span {display:none;}
	
	section.con4 h3 {font-size:25px;}
	/*header .sg-gnb-wrap h1 {padding:20px 0;}*/
	.sg-fwrap02>ul>li>div>h4 {font-size:16px;}
	.sg-sub-wrap .sg-subcon {
		/*padding:0 10px;*/
	}
	
}

@media (max-width: 1080px) {
	.sbcode-box2 {overflow: scroll;}
}

@media (max-width: 922px) {
	.sg-main {padding:0 10px;}
}


@media (max-width: 768px) {
	.sg-gnb-wrap {padding-left:10px;}
	.sg-main {padding:0;}
	/*header .sg-gnb-wrap h1 a{width: 100%; background-size: 100% auto;}*/
	.main-text > img.main-goodsoft{display:none;}
}



@media (max-width: 400px) {
	.sg-main {padding:0;}
	
}