@charset "utf-8";


.wrapper {background: url(../image/bg.jpg) center top no-repeat;background-size: 100%;font-size: 12px;font-family: 'Noto Sans KR', sans-serif;}

div#headerWrap {z-index: 100;position: absolute;left: 0;top: 0;width: 100%;}
div#headerWrap.fixed {position: fixed;background-color: rgba(0,0,0,.7);border-bottom: 1px solid rgba(255,255,255,.3);}

div#headerWrap a {display: block;text-decoration: none;color: #fff;}
div#headerWrap h1 a {display: block;}
div#headerWrap h1 img {width: 100%;}



div#footerWrap {background-color: #313131;color: rgba(255,255,255,.5);text-align: center;}




.btn a,
.btn input,
.btn button {display:inline-block;text-decoration:none;cursor:pointer;height:33px;padding:0 10px 2px;font-size:14px;line-height: 20px;border-width:1px;border-style: solid;vertical-align:top;}

.btn a {height:19px;line-height:19px;padding:6px 10px 6px;}
.btn a:before {display: inline-block;padding-right: 10px;}
.btn i {padding:2px 10px 0 0;}
.btn .btnIcon i {padding-right: 0;}

/* 빨간색 */							.btnDef {background-color:#d42319 !important;border-color:#d42319 !important;color:#fff !important;}
/* 검정색 */							.btnPoint {background-color:#444 !important;border-color:#444 !important;color:#fff !important;}
/* 회색 */								.btnGrey {background-color:#696c6c;border-color:#696c6c;color:#fff;}



/* border+ 빨간색 */				.btnBdDef {background-color:#fff !important;border-color:#d42319 !important;color:#d42319 !important;}
/* border+ 검정색 */				.btnBdPoint {background-color:#fff !important;border-color:#444 !important;color:#444 !important;}
/* border+ 회색 */				.btnBdGrey {background-color:#fff;border-color:#696c6c;color:#696c6c;}
/* border+ 빨간색 */              .btnBdDef2 {background-color:#76777d; !important;border-color:#fff !important;color:#fff !important;border-radius:4px;}



/*  Mobile : ~ width:960px  */
@media screen and (max-width: 960px) {
.wrapper {background-size: 100%;}
.wrapper.main {background-size: auto 100%;}
div#headerWrap {z-index: 100;position: relative;height: 60px;}
div#headerWrap h1 {position: absolute;left: 20px;top: 15px;width: 193px;}

p.viewGnb {position: absolute;right: 15px;top: 2px;width: 40px;height: 40px;}
p.viewGnb a {display: block;height: 100%;text-indent: -10000px;background: url('../image/gnb_on.png') center center no-repeat;background-size: 24px;}

ul#gnb {display: none;position: absolute;left: 0;top: 50px;width: 100%;}
ul#gnb li {padding-top: 30px;}
ul#gnb a {text-align: center;font-size: 20px;}
ul#gnb .on a {color:#d42319;font-weight: bold;}

div#headerWrap div.view {position: fixed;left: 0;top: 0;width: 100%;height: 100%;background-color: #0e0e0e;}

.view p.viewGnb a {background-image: url('../image/gnb_off.png');background-size: 20px;}
.view ul#gnb {display: block;}
.view .header_logo {display: none;}

div#footerWrap {padding: 10px 0;font-size: 1em;}
}



/*  PC : width:961px ~  */
@media screen and (min-width: 961px) {
.wrapper {min-width:1200px;padding-top: 108px;background-size: 100%;}
div#headerWrap {height: 108px;border-bottom: 1px solid rgba(255,255,255,.3);}
div#headerWrap > div {position: relative;width: 1200px;height: 108px;margin: 0 auto;}

div#headerWrap h1 {position: absolute;left: 0;top: 50%;width: 335px;margin-top: -17px;}

p.viewGnb {display: none;}

ul#gnb {position: absolute;right: 0;top: 0;height: 108px;}
ul#gnb > li {float: left;margin-left: 65px;}
ul#gnb > li:first-child {margin-left: 0;}
ul#gnb a {padding: 43px 0;font-size: 17px;line-height: 20px;}
ul#gnb .on a {border-bottom: 5px solid #d42319;}


div#footerWrap {padding: 30px 0;font-size: 1.2em;}
}




div#main01 {color: #fff;text-align: center;}
div#main01 p {padding-top: 0px;line-height: 1.4;}
div#main01 p.btn {padding: 3em 0;}
div#main01 p.btn a {border: 1px solid #fff;padding: 1em 2em 1.2em;color: #fff;text-decoration: none;}

div#main01 ul.relSite {overflow: hidden;margin: 0;padding: 0;text-align: center;}
div#main01 ul.relSite > li {display: inline-block;vertical-align: top;margin: 0;padding: 0;list-style:none;}
div#main01 ul.relSite a {display: block;}
div#main01 ul.relSite img {display: block;height: 100%;margin: 0 auto;}

/*  Mobile : ~ width:960px  */
@media screen and (max-width: 960px) {
div#main01 {padding: 0 20px;}
div#main01 p {font-size: 1.2em;}
div#main01 p:first-child {font-size: 2em;}

div#main01 ul.relSite {padding: 10px 0;margin: 50px auto 20px;background-color:rgba(0,0,0,.5);}
div#main01 ul.relSite li {width: 25%;}
div#main01 ul.relSite a {height: 23px;}

}



/*  PC : width:961px ~  */
@media screen and (min-width: 961px) {
div#main01 p {font-size: 1.6em;}
div#main01 p:first-child {font-size: 5em;}

div#main01 ul.relSite {width: 1200px;margin: 50px auto 50px;text-align: center;}
div#main01 ul.relSite li {display: inline-block;vertical-align: top;margin-left: 30px;}
div#main01 ul.relSite li:first-child {margin-left: 0;}
div#main01 ul.relSite a {height: 46px;}
}



div#main02 {}
div#main02 > div {position: relative;background-color: #fff;}
div#main02 h2 {font-weight: 700;color: #464646;}
div#main02 ul, div#main02 li, div#main02 a {display: block;margin: 0;padding: 0;list-style:none;color:inherit;text-decoration: none;}
div#main02 li span {display: block;color: #999;font-size: 16px;}
div#main02 li span.tit {color: #111;font-size: 18px;}
div#main02 li img {display: block;margin: 0 auto;}


/*  Mobile : ~ width:960px  */
@media screen and (max-width: 960px) {

div#main02 > div {margin: 10px;}
div#main02 h2 {margin: 0;padding: 30px 0 40px 20px;font-size: 30px;line-height: 30px;}

div#main02 ul {padding: 0 20px;}
div#main02 li {padding: 20px 0;border-top: 1px solid #ddd;}
div#main02 li:first-child {border-top: 0 none;}
div#main02 li a {padding: 0 20px;}
div#main02 li span {font-size: 14px;}
div#main02 li img {margin-top: 20px;}

div#main02 p.more {position: absolute;left: 20px;top: 65px;}
div#main02 p.more a {color: #999;font-size: 14px;}
}



/*  PC : width:961px ~  */
@media screen and (min-width: 961px) {
div#main02 {padding: 100px 0;}
div#main02 > div {overflow: hidden;margin-left: 300px;}

div#main02 h2 {float: left;width: 204px;margin: 0;padding: 58px 0 0 62px;font-size: 60px;line-height: 60px;}
div#main02 ul {height: 405px;padding: 60px 0;}
div#main02 li {float: left;width: 331px;height: 405px;border-left: 1px solid #ddd;}
div#main02 li a {padding: 0 40px;}
div#main02 li span.tit {overflow: hidden;height: 78px;line-height: 26px;color: #111;}
div#main02 li img {margin-top: 40px;}

div#main02 p.more {position: absolute;left: 67px;top: 110px;}
div#main02 p.more a {color: #999;font-size: 14px;}
}



div#container {position: relative;background-color: #fff;color: #767676;font-size: 18px;line-height: 30px;}
div#container h2 {position: absolute;font-weight: bold;color: #fff;}
div#container p {margin: 0;}

.subTit {padding: 0;margin: 0;text-align: center;color: #0e0e0e;font-weight: 400;background-position: center top;background-repeat: no-repeat;}


div.searchArea, div.searchArea form, div.searchArea fieldset, div.searchArea legend, div.searchArea dl, div.searchArea dt, div.searchArea dd, div.searchArea ul, div.searchArea li div.searchArea a {margin: 0;padding: 0;list-style:none;border: 0 none;}
div.searchArea legend {visibility: hidden;height: 0;line-height: 0;font-size: 0;}

div.resultArea, div.resultArea dl, div.resultArea dt, div.resultArea dd, div.resultArea a {margin: 0;padding: 0;list-style:none;}

div.mapArea {border: 1px solid #ddd;}
dl.contact, dl.contact dt, dl.contact dd, dl.contact ul, dl.contact li {margin: 0;padding: 0;list-style:none;}
dl.contact dt, dl.contact span {color: #000;}
dl.contact dt {padding-bottom: 1em;font-size: 1.4em;}
dl.contact span {display: inline-block;}
dl.contact a {text-decoration: none;color: inherit;}


/*  Mobile : ~ width:960px  */
@media screen and (max-width: 960px) {
div#container {margin-top: 80px;padding-top: 1px;}
div#container h2 {left: 0;top: -80px;width: 100%;font-size: 30px;text-align: center;}

.pcOnly {display: none !important;}
.mobileOnly {display: block !important;}
.mobileOnly2 {display: block !important;}
.mobileOnly3 {display: block !important;}

.subTit {margin: 50px 0 20px;padding-top: 10px;font-size: 32px;line-height: 50px;background-image: url('../image/subTit_m.jpg');background-size: 30px;}
img {max-width:100%;}

div#container p {padding: 0 20px;}
div#container p.process {margin: 30px 0 60px;}

div.aboutBg {padding: 224px 0 20px;background: #f7f9fb url('../image/about_bg_m.jpg') center 20px no-repeat;background-size: auto 184px;}

ul.service {overflow: hidden;margin: 0 10px 10px;padding: 0;}
ul.service li {float: left;width: 50%;padding: 10px 0 0 5px;list-style:none;box-sizing:border-box;}
ul.service li:nth-child(odd) {clear: both;padding:10px 5px 0 0;}
ul.service div {height: 240px;padding: 0 10px;background-color: #f6f6f6;text-align: center;color: #a4a4a4;font-size: 14px;line-height: 22px;}
ul.service span {display: block;padding:15px 0 10px;margin-bottom: 15px;background: url('../image/service_bg_m.png') center bottom no-repeat;background-size: 30px;color: #000;font-size: 20px;line-height: 24px;}


div.searchArea {padding: 15px;}
div.searchArea div {position: relative;padding-right: 50px;border-bottom: 3px solid #333;}
div.searchArea div input[type=text] {width: 100%;height: 52px;padding:10px 20px 11px;border:0 none;font-size: 20px;font-weight: 300;box-sizing:border-box;}
div.searchArea div .btn {position: absolute;right: 0;top: 0;width: 50px;height: 55px;background: url('../image/btn_search.png') center center no-repeat;}
div.searchArea div .btn * {width: 100%;height: 100%;padding: 0;border: 0 none;opacity: 0;}
/*
div.searchArea dl.sort {z-index: 50;position: relative;height: 52px;border-bottom: 1px solid #ddd;}
div.searchArea dl.sort a {display: block;text-decoration: none;color: #cacbca;}
div.searchArea dl.sort dt {}
div.searchArea dl.sort dt a {padding:10px 40px 11px 15px;background: url('../image/toggle_bl_m.png') right center no-repeat;background-size: 21px;}
div.searchArea dl.sort dt a.on {background-image: url('../image/toggle_bl_on_m.png');}
div.searchArea dl.sort dd {display: none;position: absolute;left: 0;top: 52px;width: 100%;background-color: #fff;}
div.searchArea dl.sort ul {padding: 10px 15px 20px;border-top: 1px solid #ddd;background-color: #f8f8f8;}
div.searchArea dl.sort ul a {padding: 0 10px;}
*/
div.searchArea dl.sort {z-index: 50;position: relative;height: 52px;border-bottom: 1px solid #ddd;}
div.searchArea dl.sort a {display: block;text-decoration: none;color: #cacbca;}
div.searchArea dl.sort dt {}
div.searchArea dl.sort dt a {padding:10px 40px 11px 15px;background: url('../image/toggle_bl_m.png') right center no-repeat;background-size: 21px;}
div.searchArea dl.sort dt a.on {background-image: url('../image/toggle_bl_on_m.png');}
div.searchArea dl.sort dd {display: none;position: absolute;left: 0;top: 52px;width: 100%;background-color: #fff;}
div.searchArea dl.sort ul {padding: 10px 15px 20px;border-top: 1px solid #ddd;background-color: #f8f8f8;}
div.searchArea dl.sort ul a {padding: 0 10px;}

div.searchArea dl.sort2 {z-index: 50;position: relative;height: 52px;border-bottom: 1px solid #ddd;}
div.searchArea dl.sort2 a {display: block;text-decoration: none;color: #cacbca;}
div.searchArea dl.sort2 dt {}
div.searchArea dl.sort2 dt a {padding:10px 40px 11px 15px;background: url('../image/toggle_bl_m.png') right center no-repeat;background-size: 21px;}
div.searchArea dl.sort2 dt a.on {background-image: url('../image/toggle_bl_on_m.png');}
div.searchArea dl.sort2 dd {display: none;position: absolute;left: 0;top: 52px;width: 100%;background-color: #fff;}
div.searchArea dl.sort2 ul {padding: 10px 15px 20px;border-top: 1px solid #ddd;background-color: #f8f8f8;}
div.searchArea dl.sort2 ul a {padding: 0 10px;}


div.searchArea dl.sort3 {z-index: 50;position: relative;height: 52px;border-bottom: 1px solid #ddd;}
div.searchArea dl.sort3 a {display: block;text-decoration: none;color: #cacbca;}
div.searchArea dl.sort3 dt {}
div.searchArea dl.sort3 dt a {padding:10px 40px 11px 15px;background: url('../image/toggle_bl_m.png') right center no-repeat;background-size: 21px;}
div.searchArea dl.sort3 dt a.on {background-image: url('../image/toggle_bl_on_m.png');}
div.searchArea dl.sort3 dd {display: none;position: absolute;left: 0;top: 52px;width: 100%;background-color: #fff;}
div.searchArea dl.sort3 ul {padding: 10px 15px 20px;border-top: 1px solid #ddd;background-color: #f8f8f8;}
div.searchArea dl.sort3 ul a {padding: 0 10px;}



div.resultArea {margin: 0 auto;padding:0 15px 15px;}
div.resultArea dl {position: relative;min-height:80px;padding: 20px 0 20px 100px;border-bottom: 1px solid #e6e6e6;}
div.resultArea dl:first-child {border-top: 2px solid #222;}
div.resultArea dt {padding-bottom: 10px;color: #444;font-size: 18px;font-weight: 300;line-height: 24px;}
div.resultArea dd.btn a {padding: 4px 10px 6px;border-radius:4px;}
div.resultArea dd.thumb {position: absolute;left: 10px;top: 20px;width: 70px;height:91px;}
div.resultArea dd.thumb img {display: block;width: 100%;height: 100%;}

div.mapArea {height: 300px;margin:10px;}
dl.contact {padding: 10px 10px 30px;}
dl.contact li {position: relative;margin-top: 10px;padding-left: 80px;line-height: 1.2em;}
dl.contact li:first-child {margin-top: 0;}
dl.contact span {position: absolute;left: 0;top: 0;}
}



/*  PC : width:961px ~  */
@media screen and (min-width: 961px) {
div#container {margin-top: 250px;padding-top: 1px;}
div#container h2 {left: 50%;top: -86px;width: 1200px;margin: 0 0 0 -600px;font-size: 40px;line-height: 50px;}
.pcOnly {display: block !important;}
.mobileOnly {display: none !important;}
.mobileOnly2 {display: none !important;}
.mobileOnly3 {display: none !important;}

.subTit {margin: 100px 0 20px;padding-top: 10px;font-size: 42px;line-height: 50px;background-image: url('../image/subTit.jpg');}

div#container .process {margin: 70px 0 120px;height: 503px;background: url('../image/process.png') center top no-repeat;}
div#container .process img {display: none;}

div.aboutBg {padding: 135px 0;background: #f7f9fb url('../image/about_bg.png') 50% top no-repeat;}
div.aboutBg > div {width: 540px;margin: 0 auto;padding-right: 660px;text-align: justify;}

div.aboutBg h3 {margin-top: 0;text-align: left;background-position: 0 0;}

ul.service {overflow: hidden;width: 1200px;margin: 0 auto 50px;padding: 0;}
ul.service li {float: left;width: 378px;margin: 30px 0 0 33px;list-style:none;}
ul.service li:nth-child(3n+1) {clear: both;margin-left: 0;}
ul.service div {height: 270px;padding: 0 30px;background-color: #f6f6f6;text-align: center;color: #a4a4a4;font-size: 16px;line-height: 22px;}
ul.service span {display: block;padding:30px 0 30px;margin-bottom: 25px;background: url('../image/service_bg.png') center bottom no-repeat;color: #000;font-size: 30px;line-height: 34px;}

dl.journalCount, dl.journalCount dt, dl.journalCount dd {margin: 0;}
dl.journalCount {position: absolute;left:50%;top: -196px;width: 140px;height: 84px;padding: 27px 0;margin-left: 448px;color: #fff;border: 2px solid #fff;border-radius:50%;text-align: center;letter-spacing:-1px;}
dl.journalCount dt {font-size: 17px;line-height: 20px;font-weight: 300;}
dl.journalCount dd {font-size: 60px;line-height: 64px;font-weight: 700;}

dl.journalCount:after {display:block;position:absolute;left:-1px;top:-1px;width:100%;height:100%;content:"";border:1px solid #ffffff;border-radius:50%;animation:scrollani 1.4s linear infinite;}
dl.journalCount:before {display:block;position:absolute;top:-1px;left:-1px;content:"";width:100%;height:100%;border:1px solid #ffffff;border-radius:50%;animation:scrollani2 1.4s 0.7s linear infinite;}

@keyframes scrollani {
	0% {transform:scale(1); opacity:1;}
	100% {transform:scale(1.5); opacity:0;}
}
@keyframes scrollani2 {
	0% {transform:scale(1); opacity:1;}
	100% {transform:scale(1.5); opacity:0;}
}


div.searchArea {width: 1200px;margin: 0 auto;}
div.searchArea div {position: relative;width: 550px;margin: 120px auto 30px;padding-right: 50px;border-bottom: 3px solid #333;}
div.searchArea div input[type=text] {width: 508px;padding:10px 20px 11px;border-color: #fff;font-size: 20px;font-weight: 300;}
div.searchArea div .btn {position: absolute;right: 0;top: 0;width: 50px;height: 50px;background: url('../image/btn_search.png') center center no-repeat;}
div.searchArea div .btn * {width: 100%;height: 100%;padding: 0;border: 0 none;opacity: 0;}
/*
div.searchArea dl.sort ul {padding: 30px 0;border: 5px solid #f1f1f1;text-align: center;}
div.searchArea dl.sort ul li {display: inline-block;vertical-align: top;margin-left: 10px;}
div.searchArea dl.sort ul li:first-child {margin-left: 0;}
div.searchArea dl.sort ul a {display: block;min-width:68px;padding: 11px 20px;border: 1px solid #ddd;border-radius:6px;color: #666;font-size: 14px;line-height: 16px;font-weight: 400;text-decoration: none;}
div.searchArea dl.sort ul .on a {background-color: #d42319;color: #fff;border-color: #d42319;}
*/
/*수정*/

 dl.sort ul {padding: 15px 0;border-top: 1px solid #f1f1f1;border-right: 5px solid #f1f1f1;border-left: 5px solid #f1f1f1;border-bottom: 1px solid #f1f1f1;text-align: center;}
 dl.sort ul li {display: inline-block;vertical-align: top;margin-left: 10px;}
 dl.sort ul li:first-child {margin-left: 0;}
 dl.sort ul a {display: block;min-width:68px;padding: 11px 20px;border: 1px solid #ddd;border-radius:6px;color: #666;font-size: 14px;line-height: 16px;font-weight: 400;text-decoration: none;}
 dl.sort ul .on a {background-color: #d42319;color: #fff;border-color: #d42319;}
 dl.sort ul .pdf a {background-color: #76777D;color: #fff;border-color: #76777D;}

 dl.sort2 ul {padding: 15px 0;border-top: 1px solid #f1f1f1;border-right: 5px solid #f1f1f1;border-left: 5px solid #f1f1f1;border-bottom: 1px solid #f1f1f1;text-align: center;}
 dl.sort2 ul li {display: inline-block;vertical-align: top;margin-left: 10px;}
 dl.sort2 ul li:first-child {margin-left: 0;}
 dl.sort2 ul a {display: block;min-width:68px;padding: 11px 20px;border: 1px solid #ddd;border-radius:6px;color: #666;font-size: 14px;line-height: 16px;font-weight: 400;text-decoration: none;}
 dl.sort2 ul .on a {background-color: #d42319;color: #fff;border-color: #d42319;}



 dl.sort3 ul {padding: 15px 0;border-top: 1px solid #f1f1f1;border-right: 5px solid #f1f1f1;border-left: 5px solid #f1f1f1;border-bottom: 1px solid #f1f1f1;text-align: center;}
 dl.sort3 ul li {display: inline-block;vertical-align: top;margin-left: 10px;}
 dl.sort3 ul li:first-child {margin-left: 0;}
 dl.sort3 ul a {display: block;min-width:68px;padding: 11px 20px;border: 1px solid #ddd;border-radius:6px;color: #666;font-size: 14px;line-height: 16px;font-weight: 400;text-decoration: none;}
 dl.sort3 ul .on a {background-color: #d42319;color: #fff;border-color: #d42319;}





div.resultArea {width: 1200px;margin: 0 auto;padding: 50px 0;}
div.resultArea dl {position: relative;min-height:130px;padding: 40px 0 40px 185px;border-bottom: 1px solid #e6e6e6;}
div.resultArea dl:first-child {border-top: 2px solid #222;}
div.resultArea dt {padding: 30px 0 10px;color: #444;font-size: 18px;font-weight: 300;line-height: 24px;}
div.resultArea dd.btn a {padding: 4px 10px 6px;border-radius:4px;}
div.resultArea dd.thumb {position: absolute;left: 40px;top: 40px;width: 100px;height: 130px;}
div.resultArea dd.thumb img {display: block;width: 100%;height: 100%;}

div.mapArea {width: 1200px;height: 560px;margin: 30px auto;}
dl.contact {width: 800px;padding: 50px 0;margin: 0 auto;}
dl.contact span {width: 90px;}
}



