@charset "UTF-8";
.txt_hidden { left:-9999px; top:auto; width: 1px; height: 1px; overflow:hidden; position: absolute;}
.idx {background-color: rgb(255, 255, 255, 0) !important}
.nt_mark {width:100px;padding:8px 10px;background:#d9a61e;border-radius:8px;text-align:center;color:#fff;font-size:1.6rem}
.content {
	width: 1440px;
	position: relative;
	margin: 0 auto;
	text-align: center;
	margin-top: 190px;
}
.sec01 {
	position: relative;
	float: left;
	text-align: left;
	width: 100%;
	overflow: hidden;
}
.sec01:after {
	content: "";
	position: absolute;
	top: 54%;
	right: 26%;
	transform: translateY(-50%);
	width: 284px;
	height: 149px;
	background: url('/resource/img/main/object_people.png') no-repeat;
}
.sec01 h2 {
font-family:'Godo'!important;
font-size: 5.5rem;
line-height:5.5rem;
	font-weight: 700;
	color: #111;

}

.sec01 p {
	font-size: 1.9rem;
	font-weight: 500;
	color: #111;
	padding: 20px 0 55px 0
}
.sec02 {
	position: relative;
	width: 100%;
	height: 250px;
	clear: both;
}
.sec02 > .banner {
	position: relative;
	float: left;
	box-sizing: border-box;
	margin: 0 1%;
	text-align: left;
}
.sec02 > .banner:first-child {
	height: 100%;
	width: 18.4%;
	background: #001f3b;
	margin-left: 0
}
.sec02 > .banner:nth-child(2) {
	height: 100%;
	width: 18.4%;
	background: #ac0001
}
.sec02 > .banner:last-child {
	height: 100%;
	width: 38.8%;

	margin-right: 0
}
.sec02 > .banner:nth-child(-n+2) a:after {
	content: "";
	position: absolute;
	top: 74%;
	left: 40px;
	transform: translateY(-50%);
	width: 50px;
	height: 56px;
	background: url('/resource/img/icon/bannerBtn.png') no-repeat;
	transition:all 0.3s;
}

.sec02 > .banner:first-child a:after {background-position: 0 0;}
.sec02 > .banner:first-child a.on:after {background-position: 0 100%;}
.sec02 > .banner:nth-child(2) a:after {background-position: 100% 0;}
.sec02 > .banner:nth-child(2) a.on:after {background-position: 100% 100%;}
.sec02 > .banner a {
	color: white;
	display: block;
	width: 100%;
	height: 100%;
	padding: 30px
}
.sec02 > .banner h3 {
	font-size: 3rem
}
.sec02 > .banner p {
	font-size: 1.9rem;
	padding-top: 5px;
}
.sec02 > .banner i {
   position:absolute;
   display:block;
   top:68%;
   right:20%;
   font-size:1.3rem
}
.sec02_2 {
	position: relative;
    width: 100%;
    clear: both;
}

.sec02_2 > .suggest {
	background: #1c2e54 url(/resource/img/sub/icon/suggest_bg.png) no-repeat right bottom;
	position:absolute;
	width: 100%;
	height: 100px
}
.sec02_2 > .suggest a {
	color: white;
	display: block;
	width: 100%;
	height: 100%;
	padding: 15px 0 15px 80px;
}
.sec02_2 > .suggest a:after {
	content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    background: url(/resource/img/sub/icon/suggest_icon.png) no-repeat;
	width: 120px;
    height: 100px;
    background-size: 120px auto;
}
.sec02_2 > .suggest h3 {
	font-family: 'Godo' !important;
	display: inline;
	margin: 0 10px 0 0;
}
.sec02_2 > .suggest h3 .tit01 {
	font-size: 1.5rem;
}
.sec02_2 > .suggest h3 .tit02 {
	font-size: 2.5rem;
}
.sec02_2 > .suggest p {
	position: relative;
	background: #1c2e54;
	border:1px solid #fff;
	border-radius: 20px;
	padding:0 40px 0 25px;
    height: 40px;
    text-align: center;
    display: inline-block;
    margin: 10px 0 0;
    font-size: 1.5rem;
    line-height: 39px;
}
.sec02_2 > .suggest p i {
   position:absolute;
   display:block;
   top:38%;
   right:16%;
   font-size:1.3rem
} 
.sec02_2 > .suggest a:hover p i {
   right:18%;
   transition: all 0.3s;
}
.sec03 {
	position: relative;
	width: 100%;
	height: 100px;
	clear: both;
	margin-top: 30px;
}
.sec03 > .banner {
	position: relative;
	float: left;
	box-sizing: border-box;
	margin: 0 1%;
	background: #fff;
	text-align: left;
	width: 15%;
	height: 100px !important;
}

.sec03 > .banner:hover {
box-shadow:3px 3px 5px 1px rgb(0 0 0 /10%) !important;
}
.sec03 > .banner:first-child {
	margin-left: 0;
	background: #ac0001;/* 20240314 수정 --#004eae*/
}

.sec03 > .banner:last-child {
	margin-right: 0
}
.sec03 > .banner:nth-child(n+1) a:after {
	content: "";
	position: absolute;
	top: 51%;
	right: 20px;
	transform: translateY(-50%);
	width: 50px;
	height: 35px;
	background: url('/resource/img/icon/quickBtn.png') no-repeat;
	transition:all 0.3s;
}

/* 20240308 변경 */
.sec03 > .banner:first-child a:after  {background-position: 0 0;}
.sec03 > .banner:first-child a.on:after {background-position: 0 100%;} 
/*.sec03 > .banner:nth-child(2) a:after {background-position: 28% 0;}
.sec03 > .banner:nth-child(2) a.on:after {background-position: 28% 100%;}
/* //20240308 변경 */
/*.sec03 > .banner:nth-child(3) a:after {background-position: 54% 0;}
.sec03 > .banner:nth-child(3) a.on:after {background-position: 54% 100%;}
.sec03 > .banner:nth-child(4) a:after {background-position: 105% 0;}
.sec03 > .banner:nth-child(4) a.on:after {background-position: 105% 100%;}
.sec03 > .banner:last-child a:after {background-position: 80% 0;}
.sec03 > .banner:last-child a.on:after {background-position: 80% 100%;}*/

/* //20250812 변경 */
.sec03 > .banner:nth-child(2) a:after {background-position: 16% 0;}
.sec03 > .banner:nth-child(2) a.on:after {background-position: 16% 100%;}
.sec03 > .banner:nth-child(3) a:after {background-position: 42% 0;}
.sec03 > .banner:nth-child(3) a.on:after {background-position: 42% 100%;}
.sec03 > .banner:nth-child(4) a:after {background-position: 60% 0;}
.sec03 > .banner:nth-child(4) a.on:after {background-position: 60% 100%;}
.sec03 > .banner:nth-child(5) a:after {background-position: 80% 0;}
.sec03 > .banner:nth-child(5) a.on:after {background-position: 80% 100%;}
.sec03 > .banner:last-child a:after {background-position: 100% 0;}
.sec03 > .banner:last-child a.on:after {background-position: 100% 100%;}

.sec03 > .banner a {
	color: #000;
	display: block;
	height: 100%;
	width:80%;
	padding: 0 0 0 35px;
	display:table;
}
@media screen and (min-width:1240px) and (max-width:1440px)  {
	.sec03 > .banner a {
		width:68%;
		padding: 0 0 0 20px;
	}
}
.sec03 > .banner h3 {
	font-size: 1.8rem;
	display:table-cell;
	 vertical-align: middle;
}
.sec03 > .banner:nth-child(1) h3 {
	color:#fff;
}
.sec02 > .board a {
	color: #111;
	padding: 40px 125px 40px 40px
}
.sec02 > .board a .date {
	display: block;
	font-size: 1.7rem;
	color: #bababa
}
.sec02 > .board a h3 {
	display: block;
	white-space: normal;
	overflow: hidden;
	text-overflow: ellipsis;
	height:90px;
	font-size: 2.6rem;
	padding: 15px 0 0;
	line-height: 3.3rem;
	word-break:break-all
}
.sec02 > .board a .ctt {
	white-space: normal;
	overflow: hidden;
	text-overflow: ellipsis;
	font-size: 1.5rem;
	font-weight: 300;
	line-height: 2.6rem
}
.sec04 {position:relative;width:100%;height:300px;margin-top:40px;}
.callcenter {
	float: right;
	width: 430%;
	text-align: right;
	margin-top: 40px;
	color: #fff
}
.callcenter ul {
	margin-top: 14px;
}
.callcenter ul li {
	display: inline;
	font-size: 1.6rem;
}





.main_bg {
	position: fixed;
	right: 0;
	top: 0;
	width: 36%;
	height: 100%;	
	z-index: -1;
	overflow:hidden;
}
.main_bg:after {
content: "";
position:absolute;
width:100%;
height:100%;
background:rgb(0, 0, 0, 0);
transition:all 3s
}
.main_bg:before {
content: "";
position: absolute;
background-size: cover;
left: 50%;
top: 50%;
transform: translate(-50%, -50%) scale(1.2);
width: 100%;
height: 100%;
background: url('/resource/img/main/mainBg_wide.jpg');
background-position:83%, 0;
background-size:cover;
transition: all 2s;
}
.main_bg.on:before {
transform: translate(-50%, -50%) scale(1.1);
}


.btns {
 position: absolute;
bottom: 55px;
right: 38px;
z-index:999999;
}
.btn-stop {text-indent: -9999px;}
.btn-stop.on {background-image: url(/resource/img/icon/icon-play.svg);}
.btn-stop {
   width: 10px;
   height: 10px;
   background: url(/resource/img/icon/icon-stop.svg) no-repeat center;
   cursor: pointer;
   z-index:99999;
   margin-top:-4px;
   margin-left:4px;
}
.swiper {height:100%}
.swper1-pagination 
{bottom:15px !important} 
.swper1-pagination > .swiper-pagination-bullet 
{display:inline-block;background:#0b131a;opacity:1;width:10px;height:10px;margin-left:2px !important;} 
.swper1-pagination > .swiper-pagination-bullet-active 
{background:#fff;border:2px solid #ff5152;width:10px;height:10px;margin-left:0px !important;} 

.chkbox_all {font-size:1.7rem;font-weight:700;margin-top:10px}

/* one-page */
#timeOv {width:100%;position:relative;height:100%;text-align:center;margin:0 auto}
.wrap_img {max-width:1000px;width:100%;margin:0 auto;text-align:center;}
@media screen and (max-width:1000px) {
.wrap_img ul li img {width:100%}
}

#myModal .h2_ttl.h2_caution {
color: #db1112 !important;
position:relative;
padding-left:22px;
font-weight:bold;
}
#myModal .h2_ttl.h2_caution:before {
content: "※";
position:absolute;
width:8px;
hegiht:80px;
left:4px;
top:0;
}


/* 나에게 알맞은 프로그램 250929*/

.sec02 > .banner.newleap a {
    color: #222;
}
.sec02 > .banner.newleap h3{
    line-height: 3.5rem;
	letter-spacing: -.075rem;
}
.sec02 > .banner.newleap {
    height: 100%;
    width: 18.4%;
    background: #fff;
}
.sec02 > .banner.newleap a:after {
    content: "";
    position: absolute;
    top: 74%;
	right: auto;
    left: 40px;
    transform: translateY(-50%);
    width: 50px;
    height: 56px;
    background: url(/resource/img/icon/bannerBtnNewleap.png) no-repeat;
    transition: all 0.3s;
}
.sec02 > .banner.newleap a:after {
	background-position: 0 0;
}
.sec02 > .banner.newleap a.on:after {
	background-position: 0 100%;
}
@media screen and (max-width:768px)  {
	.sec02 > .banner.newleap h3 br {
		display: none
	}
}
@media screen and (max-width:449px)  {
	.sec02 > .banner.newleap {
        height: 100%;
        width: 100%;
        margin: 2% 0;
    }
	.sec02 > .banner.newleap a:after {
        top: 50%;
        left: auto;
        right: 10%;
    }
}
@media screen and (min-width: 450px) and (max-width: 767px) {
    .sec02 > .banner.newleap {
        height: auto;
    }
	.sec02 > .banner.newleap a:after {
		top: 50%;
		left: auto;
		right: 40px;
	}
}
@media screen and (min-width: 1200px) and (max-width: 1400px) {
    .sec02 > .banner.newleap h3 {
      font-size:2.4rem;
	}
}

/* 서민금융있다 배너 추가 251016*/
.sec02_2 > .kin-wp {
	background: #fff;
	position: absolute;
	width: 100%;
	height: 140px;
}
.sec02_2 > .kin-wp a {
	position: relative;
	display: block;
	height: 100%;
	text-align: left;
	padding: 15px;
}
.sec02_2 > .kin-wp h3 {
	text-align:left;
}
.sec02_2 > .kin-wp h3 .tit01 {
	font-size: 1.3rem;
	color: #555;
	font-weight: 400;
}
.sec02_2 > .kin-wp h3 .tit02 {
	color: #222;
	font-size:1.7rem;
	letter-spacing: -.05rem;
	line-height: 2.1rem;
}
.sec02_2 > .kin-wp h3 .tit02 .po-box {
	display:inline-block;
	color: #dd225e;
	border-radius:3px;
}
.sec02_2 > .kin-wp .kin-link {
	background: #1c2e54;
	color: #fff;
	font-size: 1.5rem;
	font-weight: 600;
	border-radius: 20px;
	padding: 0  25px;
	height: 40px;
	text-align: center;
	display: inline-block;
	margin: 5px 0 0;
	line-height: 39px;
}
.sec02_2 > .kin-wp a:after {
    content: "";
    position: absolute;
    top: 50%;
    right: 20px;
    background: url(/resource/img/sub/icon/kin_logo.png) no-repeat;
    width: 90px;
    height: 90px;
    background-size: 90px auto;
    box-shadow: rgba(0, 0, 0, 0.3) 1px 1px 5px;
    border-radius: 17px;
    margin-top: -45px;
}

@media screen and (min-width: 1240px) {
    .sec02_2 > .kin-wp {
        top: -160px;
        right: 0;
        left: auto;
        width: 380px;
    }
}
@media screen and (min-width: 768px) and (max-width: 1239px) {
    .sec02_2 > .kin-wp {
        top: 270px;
        right: 0;
        left: 0;
        margin: 0 auto;
        width: 100%;
        height: 100px;
    }
	.sec02_2 > .kin-wp a {
		display: flex;
		align-items: center;
	}
	.sec02_2 > .kin-wp a:after {
		right: 15px;
	    width: 70px;
	    height: 70px;
	    background-size: 70px auto;
	    margin-top: -35px;
	}
	.sec02_2 > .kin-wp h3 {
		margin-right: 12px;
	}
	.sec02_2 > .kin-wp h3 .tit02 br {
		display:none
	}
}
@media screen and (min-width: 576px) and (max-width: 1239px){
.sec02_2 > .kin-wp h3 .tit02 br {
		display:none
	}
}
@media screen and (max-width: 768px) {
    .sec02_2 .kin-wp {
        top: 740px;
        height: 120px;
    }
}
@media screen and (max-width: 576px) {
    .sec02_2 .kin-wp {
        height: 140px;
    }
	.sec02_2 > .kin-wp a:after {
	    right: 10px;
	    width: 80px;
	    height: 80px;
	    background-size: 80px auto;
	    margin-top: -40px;
	}
}
@media screen and (max-width: 449px) {
	.sec02_2 .kin-wp {
        top: 770px;
        height: 150px;
    }	
}
@media screen and (max-width: 360px) {
	.sec02_2 .kin-wp {
        top: 750px;
        height: 190px;
    }
	.sec02_2 > .kin-wp a {
		text-align:center;
		width: 100%;
		padding: 70px 0 0;
	}
	.sec02_2 > .kin-wp h3 {
    text-align: center
	}
	.sec02_2 > .kin-wp a:after {
	  /* display:none */
	  right: 50%;
	  top: 15px;
	  bottom:0;
	  margin-top: 0;
	  left:auto;
	  width: 50px;
	  height: 50px;
	  background-size: 50px auto;
	  margin-right: -25px;
	}
}