@charset "utf-8";
/* Small, Tablet */
#wrap {position:relative; z-index:1; min-height:100%;}
#header {position:relative;}
.location {display:none;}
#lnb {display:none;}
#footer {position:absolute; bottom:0; left:0; width:100%; border-top:1px solid #e6e6e6; z-index:5;}

.head h1 {display:inline-block; vertical-align:top;}
.head h1 img {width: 100%;}
.gnb ul {padding:0; margin:0; list-style:none;}

.lang {overflow:hidden; padding:0; margin:0; list-style:none;}
.linkDirect {overflow:hidden; padding:0; margin:0; list-style:none;}
/* 추후 삭제 예정 */
#header .pc {width:1000px; height:139px; margin:0 auto;}
#header .mobile {width:100%; height:129px;}
/* //추후 삭제 예정 */

footer ul {list-style:none; padding:0; margin:0;}
footer .contW {overflow:hidden; position:relative; padding-bottom:34px; margin:24px auto 0 auto;}
footer .contW .service li {display:inline-block; position:relative; padding-right:10px; margin-right:10px;}
footer .contW .service li:after {content:''; position:absolute; top:50%; right:0; width:1px; height:9px; margin-top:-4.5px; background:#de4a63;}
footer .contW .service li:last-child {padding:0; margin:0;}
footer .contW .service li:last-child:after {display:none;}
footer .contW .service li a {color:#de4a63;}
footer .contW h2 {float:left; padding-right:60px; margin:0;}
footer .contW .addressW {float:left;}
footer .contW .addressW .about li {display:inline-block; position:relative; padding-right:10px; margin-right:10px;}
footer .contW .addressW .about li:after {content:''; position:absolute; top:50%; right:0; width:1px; height:9px; margin-top:-4.5px; background:#808080;}
footer .contW .addressW .about li:last-child {padding:0; margin:0;}
footer .contW .addressW .about li:last-child:after {display:none;}
footer .contW .addressW .about li a {color:#333333;}
footer address {font-size:11px; font-size:1.1rem; color:#888888;}
footer address p {margin:0;}
footer address p:first-child {margin:14px 0 0;}
footer address p em {padding-left:6px; font-weight:400; color:#333333;}
footer .contW .footBanner {position:absolute; right:0; bottom:17px; width:100px;}
footer .copyW {overflow:hidden; background:#292929;}
footer .copyW .copy {float:left; margin:14px 0; line-height:130%; color:#888888;}
footer .copyW .copy span {color:#008675;}
footer .copyW .policy {float:right; margin:0;}
footer .copyW .policy li {display:inline-block; border-right:1px solid #4d4d4d;}
footer .copyW .policy li a {display:inline-block; padding:0 11px; line-height:58px; color:#888888;}
footer .copyW .policy li:first-child {border-left:1px solid #4d4d4d;}

/* Small, Tablet portrait */
@media (max-width:1023px){
	#wrap {padding-bottom:380px;}
	.container, #container {padding-left:3.5%; padding-right:3.5%;}
	#container {box-sizing:border-box;}
	#contents {margin-top:56px;}

	.head {position:fixed; top:0; background:#ffffff; width: 100%; border-bottom:1px solid #cccccc; text-align:center; z-index:11;}
	.head h1 {margin:0; line-height:55px;}
	.head h1 a img {width:152px; vertical-align:middle;}
	.btnMenuMobile {position:absolute; top:0; width:55px; height:55px; right:0; background:url('../img/mobile/common/layout/btnMenu.jpg') no-repeat center; background-size:22px; text-indent: -99999px;}

	.mobileWrap {position:fixed; overflow:auto; top:0; right:-300px; width:82%; height:100%; max-width:294px; background:#ffffff; z-index:100;}
	.mobileBg {height:46px; background:url('../img/mobile/common/layout/bgGnbTop.jpg') no-repeat right top; background-size:auto 46px;}
	.gnb > ul > li > a {position:absolute; top:0; width:29%; line-height:44px; background:url('../img/mobile/common/layout/bgGnbOff.jpg') no-repeat; text-align:center; background-size:auto 44px; color:#ffffff;}
	.gnb > ul > li > a.btnGnb02 {left:29%; background-position:29% top;}
	.gnb > ul > li > a.btnGnb03 {width:42%; right:0%; background-position:right top;}
	.gnb > ul > li > ul {display:none;}
	.gnb > ul > li.on > ul, .gnb > ul > li:hover > ul {display:block;}
	.gnb > ul > li.on > a, .gnb > ul > li:hover > a {background:none; font-weight:700;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Tit {display:none;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul > li.long {display:none;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul > li .smallBanner {display:none;}

	.headUtil .lang li {position:relative; float:left; width:50%;}
	.headUtil .lang li a {display:block; line-height:100%; padding:14px 0; font-size:13px; text-align:center; }
	.headUtil .lang li:first-child:after {content:''; position:absolute; top:50%; right:0; width:1px; height:18px; margin-top:-9px; background:#dedede;}
	.headUtil .lang li.on a {color:#008675;}
	.headUtil .lang li a img {display:none;}
	.headUtil .linkDirect li {position:relative; float:left; width:50%;}
	.headUtil .linkDirect li a {display:block; line-height:100%; padding:14px 0; font-size:1.3rem; text-align:center; }
	.headUtil .linkDirect li:first-child:after {content:''; position:absolute; top:50%; right:0; width:1px; height:18px; margin-top:-9px; }
	.headUtil .linkDirect li.on a {color:#008675;}
	.headUtil .linkDirect li a img {display:none;}
	.gnb > ul > li > ul > li .depth3W {display:none;}
	.gnb > ul > li > ul > li > span {display:block; border-bottom:1px solid #008675;}
	.gnb > ul > li > ul > li > span a {padding:10px 0; line-height:46px; font-size:14px; font-size:1.4rem; font-weight:500; color:#008675;}
	.gnb > ul > li > ul > li > span a:first-child {padding-left:13px;}
	.gnb > ul > li > ul > li > span a.btnArr01 {position:absolute; right:0; width:44px; height:46px; padding:0;  background:url('../img/mobile/common/layout/icoArrowDown.png') no-repeat center; background-size:14px;}
	.gnb > ul > li > ul > li > span.on a.btnArr01 {background-image:url('../img/mobile/common/layout/icoArrowUp.png');}
	.gnb > ul > li > ul > li .depth3Ul > li span {display:block; border-bottom:1px solid #cccccc; background:#f5f5f5;}
	.gnb > ul > li > ul > li .depth3Ul > li span a {padding:10px 0; line-height:46px; font-size:13px; font-size:1.3rem; color:#777777;}
	.gnb > ul > li > ul > li .depth3Ul > li span a:first-child {padding-left:13px;}
	.gnb > ul > li > ul > li .depth3Ul > li span a.btnArr02 {position:absolute; right:0; width:44px; height:46px; padding:0;  background:url('../img/mobile/common/layout/icoArrowDown02.png') no-repeat center; background-size:12.3px;}
	.gnb > ul > li > ul > li .depth3Ul > li span.on {border:0;}
	.gnb > ul > li > ul > li .depth3Ul > li span.on a {color:#333333;}
	.gnb > ul > li > ul > li .depth3Ul > li span.on a.btnArr02 {background-image:url('../img/mobile/common/layout/icoArrowUp02.png');}
	.gnb > ul > li > ul > li .depth3Ul > li .depth4Ul {display:none; padding:15px 0; border-bottom:1px solid #cccccc;}
	.gnb > ul > li > ul > li .depth3Ul > li .depth4Ul li a {padding-left:13px; line-height:166.6%; color:#777777;}
	.gnb > ul > li > ul > li .depth3Ul > li .depth4Ul li a:before {content:'- ';}

	footer .contW {margin:18px auto; padding-bottom:0;}
	footer .contW .service {width:100%; margin-bottom:7px;}
	footer address {width:74%;}
	footer address p span {display:block;}
	footer .contW .footBanner {width:24.1%; max-width:74px; right:3.5%; bottom:0;}
	footer .copyW .container {padding:0;}
	footer .copyW .copy {padding:0 3.5%;}
	footer .copyW .policy {width:100%; border-top:1px solid #4d4d4d;}
	footer .copyW .policy li:first-child {border:0;}
	footer .copyW .policy li {width:49%; border:0; border-left:1px solid #4d4d4d; text-align:center; box-sizing: border-box;}
	footer .copyW .policy li a {width:100%; padding:0; line-height:45px;}
	
	.btnDirectLink {min-width: 90px; width:200%; height: 20px; color: #ffffff; vertical-align: middle; background: #de4a63;}
}

/* PC */
@media (min-width:1024px){
	#wrap{padding-bottom:250px;}
	#header {z-index:1;}
	#headerCon {width:1000px; margin:0 auto;}

	.head {position:absolute; left:50%; height:0; margin-left:-500px; margin-top: 1.1%;}
	.head h1 { width:192px; margin:17px 0 0 0;}
	.headUtil {position:absolute; top:0; left:50%; width:1000px; height:0; margin-left:-500px;}
	.lang {float:right; margin:22px 0 0 0; border:1px solid #d5d5d5;}
	.lang li {position:relative; float:left;}
	.lang li:first-child:before {content:''; position:absolute; top:50%; right:0; width:1px; height:9px; margin-top:-4.5px; background:#bbbbbb;}
	.lang li a {padding:0 9px; line-height:26px; color:#777777;}
	.lang li.on a {font-weight:500; color:#008675;}
	.lang li a img {margin:6px 4px 0 0; border:1px solid #bbbbbb; vertical-align:top;}
	.linkDirect {float:right; margin:15px 0 0 0;}
	.linkDirect li {position:relative; float:left;}
	.linkDirect li:first-child:before {content:''; position:absolute; top:50%; right:0; width:1px; height:9px; margin-top:-4.5px;}
	.linkDirect li a {padding:0 9px; color:#777777;}
	.linkDirect li.on a {font-weight:500; color:#008675;}
	.linkDirect li a img {margin:6px 4px 0 0; border:1px solid #bbbbbb; vertical-align:top;}
	.btnHomeMobile, .btnMenuMobile, .head h1 span {display: none;}
	.gnb {background:url('../img/pc/common/layout/bgGnb.png') repeat-x;}
	.gnb > ul {width:1000px; margin:0 auto;}
	.gnb > ul > li {display:inline-block;}
	.gnb > ul > li.on > a, .gnb > ul > li:hover > a { color:#008675;}
	.gnb > ul > li:first-child {margin-left:226px;}
	.gnb > ul > li > a {display:block; padding:0 16px; line-height:66px; font-size:15px; font-size:1.5rem; color:#333333;}
	.gnb > ul > li > ul {display:none; position:absolute;}
	.gnb > ul > li.on > ul {display:block;}
	.gnb > ul > li > ul > li {display:inline-block;}
	.gnb > ul > li > ul > li > span a {display:block; padding:0 15px; line-height:39px; color:#beeee8;}
	.gnb > ul > li > ul > li > span a.btnArr01 {display:none;}
	.gnb > ul > li > ul > li.on > span a, .gnb > ul > li > ul > li:hover > span a {color:#f9f2a4;}
	.gnb > ul > li > ul > li:hover .depth3W {display:block;}
	.gnb > ul > li > ul > li .depth3W {display:none; position:fixed; left:0; width:100%; height:151px; background:url('../img/pc/common/layout/bgGnb3dep.png') repeat-x; z-index:5;}
	.gnb > ul > li > ul > li .depth3W .pcW {overflow:hidden; width:1500px; margin:0 auto;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Tit {position:relative; float:left; width:224px; min-height:103px; margin:18px 0 18px 25px; border-right:1px solid #e6e5e4;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Tit:after {content:''; position:absolute; top:13px; right:-4px; width:5px; height:5px; background:#ffffff; transform: rotate(45deg); border-top:1px solid #e6e5e4; border-right:1px solid #e6e5e4;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Tit img {position:absolute; right:18px; bottom:0;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Tit strong {font-size:22px; font-size:2.2rem;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Tit p {margin-bottom:0; line-height:133.3%;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul {overflow:hidden; float:left; margin:18px 0;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul > li {position:relative; float:left; width:250px; min-height:103px; border-left:1px solid #e6e5e4; box-sizing:border-box;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul > li:first-child {border:0;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul > li.long {width:500px; padding-left:20px;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul > li.long .bigBanner a {display:block; position:relative; height:62px; padding:20px; background:#f4f4f4; color:#555555;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul > li.long .bigBanner a p {margin:0; font-size:13px; font-size:1.3rem;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul > li.long .bigBanner a strong {display:block; margin-bottom:12px; font-size:18px; font-size:1.8rem;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul > li.long .bigBanner a span {display:inline-block; font-size:11px; font-size:1.1rem; color:#777777;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul > li.long .bigBanner a span img {padding-top:6px; vertical-align:top;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul > li.long .bigBanner a > img {position:absolute; top:0; right:20px;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul > li .smallBanner {position:relative; height:60px; padding:20px; margin-left:25px; background:#f7fffe; border:1px solid #ebebeb;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul > li .smallBanner p {margin:0 0 3px 0; font-size:13px; font-size:1.3rem; color:#555555;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul > li .smallBanner strong {font-size:25px; font-size:2.5rem; color:#008675;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul > li .smallBanner img {position:absolute; bottom:15px; right:20px;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul > li > span a {display:block; padding-left:25px; margin-top:18px; font-size:13px; font-size:1.3rem; color:#007a6b;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul > li > span a.btnArr02 {display:none;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul > li > span:first-child a {margin-top:2px;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul > li > .depth4Ul {margin-top:5px;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul > li > .depth4Ul li a {padding-left:25px; color:#666666;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul > li > .depth4Ul li a:before {content:''; display:inline-block; width:2px; height:2px; margin:-1px 8px 0 0; vertical-align:middle; background:#999999;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul > li > .depth4Ul li:hover {background:#de4a63 url('../img/pc/common/layout/icoArrowR.png') no-repeat 235px center;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul > li > .depth4Ul li:hover a {color:#ffffff;}
	.gnb > ul > li > ul > li .depth3W .pcW .depth3Ul > li > .depth4Ul li:hover a:before {background:#ffffff;}

	.container, #container {width:1000px; margin:0 auto;}
	.visualW span {display:block; width:1000px; padding-right:30px; margin:0 auto; line-height:140%;}
	#container {overflow:hidden; position:relative; z-index:2; width:1000px; margin:-118px auto 0 auto;}

	#lnb {display:block; float:left; position:relative; z-index:2; width:184px;}
	#lnb ul {padding:0; margin:0; list-style:none;}
	#lnb ul li a {padding:0 1em; font-size:13px; font-size:1.3rem;}
	#lnb ul.menu {margin-top:2.0em; border-top:1px solid #cccccc}
	#lnb ul.menu li {border-bottom:1px solid #cccccc}
	#lnb ul.menu > li > a {display:block; position:relative; line-height:100%; padding:13px 35px 13px 10px; color:#333333; -webkit-transition-property:color; transition-property:color; -webkit-transition-duration:0.3s; transition-duration:0.3s;}
	#lnb ul.menu > li > a:before {content:""; position: absolute; top:0; left:0; right:0; bottom:0; z-index:-1; -webkit-background:#4d4d4d; -webkit-transform:scaleX(0); transform:scaleX(0); -webkit-transform-origin:0 50%; transform-origin:0 50%; -webkit-transition-property:transform; transition-property:transform; -webkit-transition-duration:0.3s; transition-duration:0.3s; -webkit-transition-timing-function:ease-out; transition-timing-function:ease-out;}
	#lnb ul.menu > li > a:hover:before, #lnb ul.menu > li.on > a:before {background:#4d4d4d; transform: scaleX(1);}
	#lnb ul.menu > li > a:hover, #lnb ul.menu > li.on > a {color:#ffffff;}
	#lnb ul.menu > li.hasChild > a {background:url('../img/pc/common/layout/icoPlus.png') no-repeat 163px center;}
	#lnb ul.menu > li.hasChild.on > a {background-image:url('../img/pc/common/layout/icoClose.png');}
	#lnb ul.menu li ul {display:none; padding:5px 0; border-top:1px solid #cccccc}
	#lnb ul.menu li ul li {border-bottom:0;}
	#lnb ul.menu li ul li a {position:relative; display:block; line-height:14px; padding:6px 35px 6px 17px; font-size:12px; font-size:1.2rem; color:#333333;}
	#lnb ul.menu li ul li a:hover, #lnb ul.menu li ul li a:active , #lnb ul.menu li.on ul li.on a {color:#008675;}
	#lnb ul.menu li.on ul li.on a {background:url('../img/pc/common/layout/icoLnbArr.png') no-repeat 169px center;}
	#lnb ul.menu li ul li a:before {content:''; position:absolute; left:10px; top:50%; width:2px; height:2px; margin-top:-1px; vertical-align:middle; background:#808080;}
	#lnb ul.menu li ul li.on a:before {background:#008675;}

	#lnb ul.qm01 {margin-top:4em;}
	#lnb ul.qm01 li {margin-top:0.5em;}
	#lnb ul.qm01 li a {display:block; border:1px solid #4d4d4d; line-height:48px; color:#333333; background:url('../img/pc/common/ico/icoArr01.png') no-repeat 163px -32px;}
	#lnb ul.qm01 li a:hover {color:#de4a63; background-position:165px -32px;}

	#lnb ul.qm02 {overflow:hidden; margin-top:5px;}
	#lnb ul.qm02 li {float:right; width:49%;}
	#lnb ul.qm02 li:first-child {float:left;}
	#lnb ul.qm02 li a {display:block; padding:5.0em 0 1.1em 0; font-size:11px; font-size:1.1rem; line-height:120%; color:#777777; text-align:center; background:#ededed url('../img/pc/common/layout/lnbQm02.png') no-repeat 0 -80px;}
	#lnb ul.qm02 li:first-child a {background-position:0 0;}
	#lnb ul.qm02 li a:hover{color:#4d4d4d;}
	#lnb .callW {height:68px; margin-top:30px; border:1px solid #ebebeb; text-align:center;}
	#lnb .callW img {padding-top:19px; vertical-align:top;}
	#lnb .callW p {display:inline-block; line-height:148%; margin:16px 0 0 8px; font-size:13px; font-size:1.3rem; text-align:left;}
	#lnb .callW p strong {font-size:24px; font-size:2.4rem; color:#008675;}

	.location {display:block; margin:125px 0 1em 0;}
	.location ul {float:right; padding:0; margin:0; list-style:none; text-align:right;}
	.location li {float:left; padding-left:3px; background:url('../img/pc/common/ico/icoArr01.png') no-repeat 0 10px;}
	.location li:first-child {background:none;}
	.location li:first-child a {display:block; width:15px; text-indent:9999px; background:url('../img/pc/common/ico/icoHome.png') no-repeat center 5px;}
	.location li:last-child {padding:3px 3px 3px 8px; color:#008675;}
	.location li.last {padding:3px 3px 3px 8px; color:#008675;}
	.location li a {display:block; padding:3px 6px; color:#333333;}
	.location li a:hover {color:#4d4d4d;}

	#contents {float:right; width:790px;}
	#contents{font-size:103%;};
	/*#contents.subLogin {width:650px; margin:0 auto; float:none;}*/

	#footerCon {width:1000px; margin:0 auto;}
	footer .contW .service {position:absolute; top:0; right:0;}
	footer address p span:first-child {padding-right:24px;}
	
	.btnDirectLink {display: inline-block; min-width: 90px; height: 40px; padding: 0 10px; margin: 0 2px 8px 2px; color: #ffffff !important; 
						font-size: 1.4rem; line-height: 40px; text-align: center; vertical-align: middle; background: #de4a63;}
}