@charset "utf-8";

/* 메인페이지 스타일만 정의 */
/* ************************ 데스크탑 (992~) ************************ */
@media screen and (min-width: 992px), print {
	/* 상단비쥬얼 */
	.main.visual {
		display:table; height:800px !important; width:100%; max-width:100% !important;
		background-image:url(../images/main/bg_top2.jpg) !important; background-size:cover; background-position:50% !important;
	}
	.main.visual .wrap {display:table-cell; vertical-align:middle;}
	.main.visual .wrap .inner {position:relative; max-width:1200px; margin:0 auto; text-align:right;}
	.main.visual .wrap .inner .copy {margin-top:150px;}
	.main.visual .wrap .inner .copy p {font-weight:600; margin-bottom:10px;}
	.main.visual .wrap .inner .copy p:nth-child(1) {font-size:48px; line-height:1; color:#85c957; letter-spacing:-3px;}
	.main.visual .wrap .inner .copy p:nth-child(2) {font-size:60px; line-height:1; color:#4591e0; letter-spacing:-3px;}
	.main.visual .wrap .inner .copy p:nth-child(3) {font-size:16px; line-height:1.6; font-weight:400;}
	.main.visual .wrap .link {max-width:1200px; margin:0 auto; text-align:right;}
	.main.visual .wrap .link a {display:inline-block; padding:15px 30px; margin-top:30px; color:#fff; line-height:1; background-color:rgba(0,0,0,.3) !important; border-radius:5px;}
	.main.visual .wrap .link a:hover {background-color:#4591e0;}
	.main.visual .wrap i {position:absolute; left:0; bottom:30px; width:100%; text-align:center;}
	.main.visual .wrap i img:hover {padding-bottom:10px;}
	.main.visual .wrap .snsLink {position:absolute; bottom:5%; right:50px;width:100%;z-index: 1;}	
	.main.visual .wrap .snsLink ul {overflow:hidden;float:right;}
	.main.visual .wrap .snsLink li {float:left;margin-right:2px;background:#fff;border-radius:5px; transition:all 0.2s;}	
	.main.visual .wrap .snsLink li a {display:block;white-space:nowrap;padding:10px 15px 10px 45px;color:#fff;}	
	.main.visual .wrap .snsLink li:first-child {background:rgba(0,0,0,.3) url(../images/main/facebook.png)no-repeat 15%; background-size:20px;}	
	.main.visual .wrap .snsLink li:nth-child(2) {background:rgba(0,0,0,.3) url(../images/main/instagram.png)no-repeat 15%; background-size:20px;}		
	.main.visual .wrap .snsLink li:nth-child(3) {background:rgba(0,0,0,.3) url(../images/main/youtube.png)no-repeat 15%; background-size:20px;}	
	.main.visual .wrap .snsLink li:nth-child(4) {background:rgba(0,0,0,.3) url(../images/main/blog.png)no-repeat 15%; background-size:20px;}	
	.main.visual .wrap .snsLink li:first-child:hover {background:#85b5e6 url(../images/main/facebook.png)no-repeat 15%; background-size:20px;}	
	.main.visual .wrap .snsLink li:nth-child(2):hover {background:#85b5e6 url(../images/main/instagram.png)no-repeat 15%; background-size:20px;}
	.main.visual .wrap .snsLink li:nth-child(3):hover {background:#85b5e6 url(../images/main/youtube.png)no-repeat 15%; background-size:20px;}	
	.main.visual .wrap .snsLink li:nth-child(4):hover {background:#85b5e6 url(../images/main/blog.png)no-repeat 15%; background-size:20px;}
	/* 공지 */
	.main.board {max-width:100%; padding:28px 0; background-color:#f3f3f3  !important;}
	.main.board .wrap {width:1200px; margin:0 auto;}
	.main.board .wrap>* {padding:0;}
	.main.board .tabA {text-align:left;}
	.main.board .tabA a {background:#fff; font-size:14px;}
	.main.board .tabA a.on {background:#898989 !important;}
	.main.board .list {margin-left:-100px; height:44px;}
	.main.board .list a {line-height:1; padding-top:14px;}
	.main.board .list a:hover {text-decoration:underline !important;}
	.main.board .side {float:right;}
	.main.board .side p {float:left; padding:10px 10px 0 0;}
	.main.board .side a {display:inline-block; width:44px; height:44px; padding:0; background:url(../images/main/icon_plus.png) #fff no-repeat center; border:1px solid #ddd; border-radius:5px;}
	.main.board .side a span {display:none;}

	/* 비즈니스 */
	.main.business {max-width:1200px; margin:0 auto;}
	.main.business .item {padding:70px 150px 0 150px;}
	.main.business .item article {padding:30px; text-align:center;}
	.main.business .item article i {
		display:block; border:1px solid #ddd; border-radius:50%; margin-bottom:10px;
		background-repeat:no-repeat !important; background-position:center !important; background-color:#fff;
	}
	.main.business .item article:hover i {
		border:10px solid #85b5e6;
		transform:rotateY(180deg);
		-ms- transform:rotateY(180deg);
		-webkit- transform:rotateY(180deg);
	}
	.main.business .item article i.icon1 {background-image:url(../images/main/business_icon1.png) !important;}
	.main.business .item article i.icon2 {background-image:url(../images/main/business_icon2.png) !important;}
	.main.business .item article i.icon3 {background-image:url(../images/main/business_icon3.png) !important;}
	.main.business .item article i.icon4 {background-image:url(../images/main/business_icon4.png) !important;}
	.main.business .item article p {font-size:18px; font-weight:400; letter-spacing:-1px;}

	.main.business .txt {margin-top:80px; text-align:center;}
	.main.business .txt p:nth-child(1) {margin-bottom:15px; font-size:36px; color:#000; letter-spacing:-2px; line-height:1;}
	.main.business .txt a {display:inline-block; margin-top:30px; padding:15px 30px; color:#fff !important; line-height:1; letter-spacing:-1px; background:#85c957 !important; border-radius:100px;}
	.main.business .txt a:hover {padding:15px 35px; background:#4591e0;}

	.main.business .bg {margin-top:85px; text-align:center;}

	/* 하단 주요정보 */
	.main.info {max-width:100%; background-color:#85b5e6 !important; padding-top:120px; text-align:center;}
	.main.info .txt {max-width:1200px; margin:0 auto; letter-spacing:-1px;}
	.main.info .txt p {margin-bottom:20px; font-size:36px; color:#fff !important; line-height:1.2; letter-spacing:-2px;}
	.main.info .txt span {color:#000; opacity:.5;}

	.main.info .link {width:800px; margin:80px auto 50px auto; text-align:center;}
	.main.info .link li {padding:0 5px;}
	.main.info .link a {display:block; padding:15px 30px; line-height:1; letter-spacing:-1px; color:#fff !important; border-radius:5px; border:1px solid #fff !important;}
	.main.info .link a:hover {background-color:#fff; color:#4591e0 !important;}
	.main.info .tree {text-align:center; margin-top:55px;}

	/* 하단 카드사 */
	.main.card {max-width:1200px; padding:30px; margin:0 auto; text-align:center;}
	.main.card a {display:inline-block; margin:5px 10px; vertical-align:middle;}
	.main.card a.typeBank {margin:5px;}
	.main.card a.typeBank.new {margin:5px 10px;}
	.main.card a img {max-height:22px;}
}


/* ************************ 태블릿 이하(~991) ************************ */
@media screen and (max-width: 991px) {
	/* 상단비쥬얼 */
	.main.visual {
		display:table; width:100%; max-width:100% !important;
		background:url(../images/main/bg_top_m.jpg) no-repeat center; background-size:cover;
	}
	.main.visual .wrap {display:table-cell; vertical-align:middle;}
	.main.visual .wrap .inner {position:relative; margin:0 auto; text-align:right;}
	.main.visual .wrap .inner .copy {margin-top:25%;}
	.main.visual .wrap .inner .copy p {font-weight:600; margin-bottom:10px; padding-right:20px;}
	.main.visual .wrap .inner .copy p:nth-child(1) {font-size:28px; line-height:1; color:#85c957; letter-spacing:-2px;}
	.main.visual .wrap .inner .copy p:nth-child(2) {font-size:42px; line-height:1; color:#4591e0; letter-spacing:-2px;}
	.main.visual .wrap .inner .copy p:nth-child(3) {font-size:14px; line-height:1.6; font-weight:400;}
	.main.visual .wrap .link {text-align:right; padding-right:20px; margin-top:30px;}
	.main.visual .wrap .link a {display:inline-block; padding:15px 30px; color:#fff; line-height:1; background-color:rgba(0,0,0,.3); border-radius:5px;}
	.main.visual .wrap .link a:hover {background-color:#4591e0;}
	.main.visual .wrap i {display:none;}
	.main.visual .wrap .snsLink {position:absolute; bottom:5%; right:15px;width:100%; z-index: 1;}	
	.main.visual .wrap .snsLink ul {overflow:hidden;float:right;}
	.main.visual .wrap .snsLink li {float:left;margin-right:4px;background:#fff;border-radius:5px; transition:all 0.2s;}	
	.main.visual .wrap .snsLink li a {display:block;white-space:nowrap;padding:10px 15px 10px 45px;color:#fff;}	
	.main.visual .wrap .snsLink li:first-child {background:rgba(0,0,0,.3) url(../images/main/facebook.png)no-repeat 15%;background-size:20px;}	
	.main.visual .wrap .snsLink li:nth-of-type(2) {background:rgba(0,0,0,.3) url(../images/main/instagram.png)no-repeat 15%;background-size:20px;}	
	.main.visual .wrap .snsLink li:nth-of-type(3) {background:rgba(0,0,0,.3) url(../images/main/youtube.png)no-repeat 15%;background-size:20px;}
	.main.visual .wrap .snsLink li:nth-of-type(4) {background:rgba(0,0,0,.3) url(../images/main/blog.png)no-repeat 15%; background-size:20px;}	
	.main.visual .wrap .snsLink li:first-child:hover {background:#85b5e6 url(../images/main/facebook.png)no-repeat 15%;background-size:20px;}	
	.main.visual .wrap .snsLink li:nth-child(2):hover {background:#85b5e6 url(../images/main/instagram.png)no-repeat 15%;background-size:20px;}	
	.main.visual .wrap .snsLink li:nth-child(3):hover {background:#85b5e6 url(../images/main/youtube.png)no-repeat 15%;background-size:20px;}
	.main.visual .wrap .snsLink li:nth-child(4):hover {background:#85b5e6 url(../images/main/blog.png)no-repeat 15%; background-size:20px;}
	

	
	/* 공지 */
	.main.board {max-width:100%; padding:20px; background-color:#f3f3f3;}
	.main.board .wrap {}
	.main.board .wrap>* {padding:0;}
	.main.board .tabA {text-align:left;}
	.main.board .tabA a {background:#fff; font-size:12px; padding:10px;}
	.main.board .tabA a.on {background:#898989 !important;}
	.main.board .list {margin-left:-50px; height:32px;}
	.main.board .list a {line-height:1; padding-top:10px;}
	.main.board .list a:hover {text-decoration:underline !important;}
	.main.board .side {float:right; height:32px;}
	.main.board .side p {float:left; padding:5px 10px 0 0;}
	.main.board .side a {display:inline-block; width:32px; height:32px; padding:0; background:url(../images/main/icon_plus.png) #fff no-repeat center; border:1px solid #ddd; border-radius:5px;}
	.main.board .side a span {display:none;}
	
	/* 비즈니스 */
	.main.business {margin:0 auto;}
	.main.business .item {padding:20px 50px;}
	.main.business .item article {padding:20px; text-align:center;}
	.main.business .item article i {
		display:block; border:1px solid #ddd; border-radius:50%; margin-bottom:10px;
		background:no-repeat center;
		background-size:30%;
	}
	.main.business .item article i:hover {background-color:#f9f9f9;}
	.main.business .item article i.icon1 {background-image:url(../images/main/business_icon1_m.png);}
	.main.business .item article i.icon2 {background-image:url(../images/main/business_icon2_m.png);}
	.main.business .item article i.icon3 {background-image:url(../images/main/business_icon3_m.png);}
	.main.business .item article i.icon4 {background-image:url(../images/main/business_icon4_m.png);}
	.main.business .item article p br {display:none;}

	.main.business .txt {margin-top:30px; text-align:center;}
	.main.business .txt p:nth-child(1) {margin-bottom:15px; font-size:24px; color:#000; letter-spacing:-1px; line-height:1;}
	.main.business .txt p:nth-child(2) {font-size:14px;}
	.main.business .txt a {display:inline-block; margin-top:30px; padding:15px 30px; color:#fff; line-height:1; letter-spacing:-1px; background:#85c957; border-radius:100px;}
	.main.business .txt a:hover {padding:15px 35px; background:#4591e0;}

	.main.business .bg {margin-top:50px; text-align:center;}
	.main.business .bg img {max-width:50%;}
	
	/* 하단 주요정보 */
	.main.info {max-width:100%; background-color:#85b5e6; padding-top:50px; text-align:center;}
	.main.info .txt {padding:0 20px; letter-spacing:-1px; word-break:keep-all;}
	.main.info .txt p {margin-bottom:20px; font-size:24px; color:#fff; line-height:1.2; letter-spacing:-2px;}
	.main.info .txt span {color:#000; opacity:.5;}

	.main.info .link {margin:30px 15px; text-align:center;}
	.main.info .link li {padding:5px;}
	.main.info .link a {display:block; padding:10px; line-height:1; letter-spacing:-1px; color:#fff; border-radius:5px; border:1px solid #fff;}
	.main.info .link a:hover {background-color:#fff; color:#4591e0;}
	.main.info .tree {display:block; width:100%; text-align:center;}
	.main.info .tree img {max-width:70%;}

	/* 하단 카드사 */
	.main.card {padding:20px; margin:0 auto; text-align:center;}
	.main.card a {width:15%; display:inline-block; margin:5px 15px; vertical-align:middle;}
	.main.card a img {max-height:22px;}

}


/* ************************ 모바일 (0~767) ************************ */
@media screen and (max-width: 767px) {
	/* 상단비쥬얼 */
	.main.visual {position:relative;}
	.main.visual .wrap {vertical-align:bottom;}
	.main.visual .wrap .inner {position:relative; text-align:right;}
	.main.visual .wrap .inner .copy {position:absolute; width:100%; bottom:70px;}
	.main.visual .wrap .inner .copy p {font-weight:500; margin-bottom:5px; padding-right:20px;}
	.main.visual .wrap .inner .copy p:nth-child(1) {font-size:18px; line-height:1; color:#85c957; letter-spacing:-2px;}
	.main.visual .wrap .inner .copy p:nth-child(2) {font-size:22px; line-height:1; color:#4591e0; letter-spacing:-2px;}
	.main.visual .wrap .inner .copy p:nth-child(3) {display:none;}
	.main.visual .wrap .link {position:absolute; bottom:0; width:100%; padding:0;}
	.main.visual .wrap .link a {display:block; float:left; width:50%; padding:20px 5px; font-size:14px; letter-spacing:-1px; color:#fff; text-align:center; line-height:1; background-color:rgba(0,0,0,.5); border-radius:0;}
	.main.visual .wrap .link a:first-child {background-color:rgba(69,145,224,.8);}
	.main.visual .wrap .link a:last-child {background-color:rgba(133,201,87,.8);}
	.main.visual .wrap i {display:none;}
	.main.visual .wrap .snsLink {position:static; margin-top:100px; margin-bottom:150px; margin-right:8px; width:inherit;overflow:hidden;}	
	.main.visual .wrap .snsLink ul {overflow:hidden;float:right;}
	.main.visual .wrap .snsLink li {float:left;margin-right:2px;background:#fff;border-radius:5px;transition:all 0.2s;}	
	.main.visual .wrap .snsLink li a {display:block;white-space:nowrap;padding:10px 2vw 10px 8vw;color:#fff;font-size:2.2vw;}	
	.main.visual .wrap .snsLink li:first-child {background:rgba(0,0,0,.3) url(../images/main/facebook.png)no-repeat 15%;background-size:15px;}	
	.main.visual .wrap .snsLink li:nth-of-type(2) {background:rgba(0,0,0,.3) url(../images/main/instagram.png)no-repeat 15%;background-size:15px;}	
	.main.visual .wrap .snsLink li:nth-of-type(3) {background:rgba(0,0,0,.3) url(../images/main/youtube.png)no-repeat 15%;background-size:15px;}
	.main.visual .wrap .snsLink li:nth-of-type(4) {background:rgba(0,0,0,.3) url(../images/main/blog.png)no-repeat 15%; background-size:15px;}	
	.main.visual .wrap .snsLink li:first-child:hover {background:#85b5e6 url(../images/main/facebook.png)no-repeat 15%;background-size:15px;}	
	.main.visual .wrap .snsLink li:nth-child(2):hover {background:#85b5e6 url(../images/main/instagram.png)no-repeat 15%;background-size:20px;}	
	.main.visual .wrap .snsLink li:nth-child(3):hover {background:#85b5e6 url(../images/main/youtube.png)no-repeat 15%;background-size:15px;}
	.main.visual .wrap .snsLink li:nth-child(4):hover {background:#85b5e6 url(../images/main/blog.png)no-repeat 15%; background-size:15px;}
	
	/* 공지 */
	.main.board {max-width:100%; padding:15px; background-color:#fafafa; border-bottom:1px solid #eee;}
	.main.board .wrap {}
	.main.board .wrap>* {padding:0;}
	.main.board .tabA {text-align:left;}
	.main.board .tabA a {background:#fff; font-size:12px; padding:10px;}
	.main.board .tabA a.on {background:#898989 !important;}
	.main.board .tabA a span {display:none;}
	.main.board .list {margin-left:-10px; height:32px;}
	.main.board .list a {line-height:1; padding-top:10px;}
	.main.board .list a:hover {text-decoration:underline !important;}
	.main.board .side {display:none;}
	
	/* 비즈니스 */
	.main.business {margin:0 auto;}
	.main.business .item {padding:20px;}
	.main.business .item article {padding:20px; text-align:center;}
	.main.business .item article i {
		display:block; border:1px solid #eee; border-radius:50%; margin-bottom:10px;
		background:no-repeat center;
		background-size:35%;
	}
	.main.business .item article i:hover {background-color:#f9f9f9;}
	.main.business .item article i.icon1 {background-image:url(../images/main/business_icon1_m.png);}
	.main.business .item article i.icon2 {background-image:url(../images/main/business_icon2_m.png);}
	.main.business .item article i.icon3 {background-image:url(../images/main/business_icon3_m.png);}
	.main.business .item article i.icon4 {background-image:url(../images/main/business_icon4_m.png);}
	.main.business .item article p {line-height:1.2;}
	.main.business .item article p br {display:block;}	

	.main.business .txt {margin-top:30px; text-align:center;}
	.main.business .txt p:nth-child(1) {margin-bottom:15px; font-size:24px; color:#000; letter-spacing:-1px; line-height:1;}
	.main.business .txt p:nth-child(2) {font-size:14px;}
	.main.business .txt a {display:inline-block; margin-top:30px; padding:15px 30px; color:#fff; line-height:1; letter-spacing:-1px; background:#85c957; border-radius:100px;}
	.main.business .txt a:hover {padding:15px 35px; background:#4591e0;}

	.main.business .bg {margin-top:50px; text-align:center;}
	.main.business .bg img {max-width:50%;}
	
	/* 하단 카드사 */
	.main.card {padding:0;}
	.main.card a {display:block; float:left; width:33.33%; padding:15px 10px; margin:0; border:1px solid #eee; border-left:0; border-top:0; }
	.main.card a img {height:20px;}
	
	footer.main {border-top:0;}
	footer.main address .familysite {display:none;}
	footer.main address .address {margin-top:0;}	
}