@import url(font-awesome.min.css);
.main-bgarea {
  background-color: #92cbff;
}
/*container*/
#wrapper .main_wrap{background: url(/images/npps/main_bg01.png) no-repeat, url(/images/npps/main_bg03.png) no-repeat right 80px; overflow:auto; position:relative;  padding:70px 0px 50px;  width:100%; justify-content:space-evenly; margin: 0 auto;  display: flex; flex-direction: column; min-height: 789px; align-items: center;}

#wrapper .main_wrap h2{padding-bottom:55px; word-break: keep-all;  display: block;}
#wrapper .main_wrap h2 span{color:#fff; font-size: 26px; font-weight: 600; padding-bottom:5px; display:inline-block;text-shadow:2px 3px 2px rgba(0, 0, 0, 0.2)}
#wrapper .main_wrap h2 strong{color: #fff; display: block;font-size:46px; line-height: 1.2;text-shadow:2px 3px 2px rgba(0, 0, 0, 0.2);font-weight: 500;
 } 

/* .main_contents{display:flex; width:100%; flex-wrap:wrap; justify-content:space-between; background: url(/images/npps/main_bg04.png) no-repeat right; padding-bottom:140px; background-size:75%;} */
.main_contents{display:flex; width:100%; flex-wrap:wrap; justify-content:space-between; background: url(/images/npps/main_bg04.png) no-repeat right; background-size:75%;}


.main_link_wrap{display:flex; width:1300px; margin: 0 auto; flex-wrap:wrap; justify-content: space-between;}
/* 20250703 .main_link_wrap .link{width:49.5%; border-radius:20px; box-shadow:3px 5px 5px rgba(0, 0, 0, 0.1); border:1px solid #8dbde9;   position: relative; overflow: hidden;background: #f8fbff url('/images/npps/icon01.png') no-repeat 95% 50%;transition: 0.3s;} */
.main_link_wrap .link{width:34%; border-radius:20px; box-shadow:3px 5px 5px rgba(0, 0, 0, 0.1); border:1px solid #8dbde9;   position: relative; overflow: hidden;background: #f8fbff url('/images/npps/icon01.png') no-repeat 95% 50%;transition: 0.3s;}

/* 20250703 .main_link_wrap .link a{display:block;  width:100%; height:100%; padding:20px 20px 40px 45px; } */
.main_link_wrap .link a{display:block;  width:100%; height:100%; padding:70px 20px 40px 45px; margin-bottom: -20px; margin-top: 20px;}

/* 20250703 .main_link_wrap .link strong{font-size:32px; color:#172c76; padding:8px 0; text-align:left; position: relative; width:100%; display:block;} */
.main_link_wrap .link strong{font-size:40px; color:#172c76; padding:2px 0; text-align:left; position: relative; width:100%; display:block;}

/* .main_link_wrap .link p{font-size:15px; word-break: keep-all; line-height:1.5; display: block; position:relative;  width: 85px; margin: 0 auto;} */

/* .main_link_wrap .link img{display:block; width:120px; margin:0 auto;} 
.main_link_wrap .link:hover img{display:none; transition: all 0.9s;}
.main_link_wrap .link:hover{justify-content:flex-end;background-color: #cfdcee;} */
/* .main_link_wrap .link:hover a{color:#172c76;}
.main_link_wrap .link .link_list {padding-top:60px;}
.main_link_wrap .link .link_list li{padding:4px 0 4px 15px; position:relative; z-index: 3;}
.main_link_wrap .link .link_list li:before{content: '';width:4px; height:4px; border-radius:4px; position: absolute; display: block;background: #8c8c8c; left: 0; top: 15px;}
.main_link_wrap .link .link_list li a{padding-left:11px; font-size:17px;}
.main_link_wrap .link:hover .link_list li:before{background:#fff;}
.main_link_wrap .link .link_list li a:hover{font-weight:800;} */

.main_link_wrap .link:hover{background: #fff url('/images/npps/icon01-on.png') no-repeat 95% 50%;}
/* .main_link_wrap .link::after{content: ''; width:100%; height:100%; top:329px; position: absolute; z-index:0;}
.main_link_wrap .link:hover::after{content: ''; width: 100%; height:100%; top: 0; display: block; position:absolute; z-index:1; transition:all 0.8s;}
.main_link_wrap .link:hover strong::after{content: ''; width:6px; height:6px; display:block; position: absolute; background:#fff; top:0; left:-10px; border-radius:50px;} */

/* 20250703 .main_link_wrap .link:nth-child(1) .link_list{background: url(/images/npps/m_icon04_bak.png) no-repeat 90% 100px; background-size:75px; height:inherit;} */
.main_link_wrap .link:nth-child(1) .link_list{background-size:75px; height:inherit;}

/* 20250703 .main_link_wrap .link_wrap{display: flex; flex-direction:column;  justify-content:space-between;  width:49.5%;} */
.main_link_wrap .link_wrap{display: flex; flex-direction:column;  justify-content:space-between;  width:38%;}

/* 20250703 .main_link_wrap .link_wrap a{background:#fff url('/images/npps/icon02.png') no-repeat 95% 50% ; border-radius:20px; padding:30px 35px;box-shadow:3px 5px 5px rgba(0, 0, 0, 0.1); border: 1px solid #8dbde9;height: 1000%;} */
.main_link_wrap .link_wrap a{background:#fff url('/images/npps/icon02.png') no-repeat 95% 50% ; border-radius:20px; padding:15px 35px; box-shadow: 3px 5px 5px rgba(0, 0, 0, 0.1); border: 1px solid #8dbde9;height: 1000%;}

/* .main_link_wrap .link_wrap a strong{font-size:32px; color: #172c76;} */
.main_link_wrap .link_wrap a strong{font-size:28px; color: #172c76;}
.main_link_wrap .link_wrap a:nth-child(1){background:#fff url('/images/npps/icon02.png') no-repeat 95% 50%; transition: 0.3s;}
.main_link_wrap .link_wrap a:nth-child(1):hover{background:#fff url('/images/npps/icon02-on.png') no-repeat 95% 50%; color:#172c76;}
 .main_link_wrap .link_wrap a:nth-child(1):hover button{background: #2e4a97 url(/images/npps/btn-arrow.png) no-repeat 90% 50%;}
                               
/* .main_link_wrap .link_wrap a:nth-child(2){background: url(/images/npps/m_icon04_bak.png) no-repeat 93% 50px #fff; background-size:75px;} */
.main_link_wrap .link_wrap a:nth-child(2){background: url(/images/npps/m_icon04_bak.png) no-repeat 93% 50px #fff; background-size:75px; margin-top:5px;}
.main_link_wrap .link_wrap a:nth-child(2):hover{background: url(/images/npps/m_icon04_bak.png) no-repeat 93% 50px, linear-gradient(358deg, #ffffff, #c8ddf5 100%); background-size:75px; color:#172c76;}
                                 
.main_link_wrap .link_wrap .link{width:100%; box-shadow: 5px 5px 10px #eff5fe; border: 1px solid #f6f9ff; position: relative; overflow: hidden;  box-shadow:5px 5px 10px #eff2f5;}
.main_link_wrap .link_wrap .link_list {position:relative;}
.main_link_wrap .link_wrap .link_list li{position:relative; padding-left:10px;}
.main_link_wrap .link_wrap .link_list li:before {content: ''; width: 4px; height: 4px; border-radius: 4px; position: absolute; display: block;background: #8c8c8c; left: 0; top:10px;}


.btn-linkwrap {
  display: block;
  background: #1447a1 url(/images/npps/btn-arrow.png) no-repeat 90% 50%;
  font-size: 18px;
  font-weight: 500;
  color:#fff;
  padding:10px 40px 10px 20px;
  border-radius:50px;
  margin-top:15px; /* 20250703 추가 */
}

.btn-linkwrap1 {
  display: block;
  background: #4061be url(/images/npps/btn-arrow.png) no-repeat 90% 50%;
  font-size: 18px;
  font-weight: 500;
  color:#fff;
  padding:10px 40px 10px 20px;
  border-radius:50px
}
.main_link_wrap .link:hover button {
  background: #2e4a97 url(/images/npps/btn-arrow.png) no-repeat 90% 50%;
}
.banner_wrap{border-radius:20px; overflow:hidden; width:322px; height:322px; position: relative;}
.banner_wrap img{width:100%; height:fit-content;}
.banner_wrap a {width:100%;}
.banner_wrap .tit_wrap {background-color: rgb(25 28 50 / 77%); padding:12px; display:flex; justify-content: space-between; position:absolute; bottom: 0; width:100%;}
.banner_wrap .tit_wrap h3{color:#fff; font-size:16px;}
.banner_wrap .tit_wrap strong{color:#ffd964;  font-size:15px; position:relative; padding-right:18px; }
.banner_wrap .tit_wrap strong::after{content: ''; display:block; width:10px; height:1px; background:#fff; position:absolute; top:10px; left:20px;}
.banner_wrap .tit_wrap span{color:#fff; font-size:15px;}
.banner_wrap .right{display:flex;}
.banner_wrap .button_w {padding:5px 0 0 15px;  display: flex;}
.banner_wrap .button_w button{width:15px; height:19px;}
.banner_wrap .button_w .prev{background:url(/images/npps/con_left.svg) no-repeat;}
.banner_wrap .button_w .stop{background:url(/images/npps/pause.svg) no-repeat;}
.banner_wrap .button_w .next{background:url(/images/npps/con_right.svg)  no-repeat;}
.banner_wrap .button_w .play {background: url(/images/npps/play.png) 5px 0px no-repeat;}

.main_top{background: url(/images/npps/main_bg02.png) no-repeat right 0; overflow: hidden; width:1300px; margin-bottom:70px; border-radius:20px; padding:75px 0 0;}
.main_top li .heart{background: url(/images/npps/icon_good.png) no-repeat  0 center; background-size:16px 16px; padding-left:25px;}
.main_top li .talk{background: url(/images/npps/talk_icon.svg) no-repeat  0 center; background-size:20px 20px; padding-left:25px;}
.main_top li .read{background: url(/images/npps/pres/layout/icon_hBot_sch.png) no-repeat  0 center; background-size:15px 15px; padding-left:25px;}
.main_top li p{margin-left:10px; color:#a0a0a0;}

.main_pro{display:flex; justify-content: space-between;}
.proposal_list{background:#1447a1; padding:8px 10px 10px; width: 49.5%; border-radius:20px;}
.proposal_list .tit{display:flex; align-items: center;justify-content: space-between;}
.proposal_list .tit h3{color:#fff; font-size:22px; padding:8px 0 10px 10px;}
/* .proposal_list ul{background: #fff;border-radius:15px; padding:10px 12px;} */
.proposal_list ul{background: #fff;border-radius:20px;}
.proposal_list ul li{display:flex; justify-content: space-between; padding:8px;}
.proposal_list ul li a{position:relative;  padding-left:12px; line-height: 1.3;  white-space: nowrap; overflow: hidden;text-overflow: ellipsis;}
.proposal_list ul li a::before{content: ''; width:5px; height:5px; position: absolute; display: block;background: #172c76; left: 0; top:10px; border-radius: 5px;}
.proposal_list ul li a:hover{color:#172c76; font-weight:600;}
.proposal_list ul .empt{display:flex;align-items:center;}
.swiperLiSecond {margin-left:8px; margin-right:8px; margin-top:8px;}

.main_pro .button_w {display:flex; padding-right:10px; align-items: center;}
.main_pro .button_w button{width:15px; height:19px;}
.main_pro .button_w .prev{background:url(/images/npps/con_left.svg) no-repeat center;}
.main_pro .button_w .stop{background:url(/images/npps/pause.svg) no-repeat center;}
.main_pro .button_w .next{background:url(/images/npps/con_right.svg)  no-repeat center;}
.main_pro .button_w .play {background: url(/images/npps/play.png) 5px 0px no-repeat center;}
.main_pro .button_w a {background: url(/images/npps/more_02.png) no-repeat center;}
.main_pro .button_w a {background: url(/images/npps/more_02.png) no-repeat center #3e7be6; width:29px; height:29px; background-size: 16px; border-radius:3px; margin-left:5px;}
.main_pro .button_w a:hover{background: url(/images/npps/more_02.png) no-repeat center #2863ca; background-size: 16px; }

.main_pro .button_w .prev2{background:url(/images/npps/con_left.svg) no-repeat center;}
.main_pro .button_w .stop2{background:url(/images/npps/pause.svg) no-repeat center; margin-right: 4px;}
.main_pro .button_w .next2{background:url(/images/npps/con_right.svg)  no-repeat center;}
.main_pro .button_w .play2{background: url(/images/npps/play.png) 5px 0px no-repeat center;}
.main_pro .button_w .prev3{background:url(/images/npps/con_left.svg) no-repeat center;}
.main_pro .button_w .stop3{background:url(/images/npps/pause.svg) no-repeat center; margin-right: 4px;}
.main_pro .button_w .next3{background:url(/images/npps/con_right.svg)  no-repeat center;}
.main_pro .button_w .play3{background: url(/images/npps/play.png) 5px 0px no-repeat center;}

.mlike_list{background:#032b72; padding:8px 10px 10px; width: 49.5%; border-radius:20px;}
.mlike_list .tit{display:flex; align-items: center;justify-content: space-between;}
.mlike_list .tit h3{color:#fff; font-size:22px; padding:8px 0 10px 10px;}
/* .mlike_list ul{background: #fff;border-radius:15px; padding:10px 12px;} */
.mlike_list ul{background: #fff;border-radius:15px;}
.mlike_list ul li{display:flex; justify-content: space-between; padding:8px;}
.mlike_list ul li a{position:relative;  padding-left:12px; line-height: 1.3; white-space: nowrap; overflow: hidden;text-overflow: ellipsis;}
.mlike_list ul li a:hover{color:#c3a983; font-weight:600;}
.mlike_list ul li a strong{color:#c3a983; padding-right:8px;}
.mlike_list ul .empt{display:flex;align-items:center;}


@media (max-width:1680px){
  #wrapper .main_wrap{padding:60px 0; min-height:auto; background-size:25%;}
  #wrapper .main_wrap h2 {font-size:35px; padding:0px 0 30px;}
  #wrapper .main_wrap h2 strong {font-size:32px;}


}


@media (max-width:1550px){
  .main_link_wrap .link .link_list {padding-top:50px;}

}


@media (max-width:1320px) {
.main_top{width:96%; background-size:28%;margin-bottom:30px;}

.main_contents {background:none; padding-bottom:40px;}

.main_link_wrap {width:96%;padding:0 2%; justify-content: center; margin: 0 auto;}
.main_link_wrap .banner_wrap{margin: 8px;}
.main_link_wrap .link a {height: auto;}
.main_link_wrap .link:nth-child(1) .link_list {background-size:75px;}

.main_link_wrap {flex-wrap:wrap; width:100%; margin: 0 auto;justify-content: space-between;}
.main_link_wrap .link {width:34%;}
.main_link_wrap .link_wrap {width:35%;}
}

@media (max-width:1145px) {
	.main_link_wrap .link {width:49.5%;}
	.main_link_wrap .link_wrap {width:49.5%;}
}

@media (max-width:1120px) {
#wrapper .main_wrap{flex-direction:column; justify-content: center;  padding:50px 2%; width:100%; background-size:50%;box-sizing: border-box;}    
#wrapper .main_wrap h2 {width:100%; font-size:30px;}
#wrapper .main_wrap h2 strong {font-size:28px;}

.main_link_wrap .banner_wrap:hover a{padding:0;}

}




@media (max-width:1000px) {
  #wrapper {min-height: calc(100% - 300px);}
  #wrapper .main_wrap {padding:0 2%;padding-bottom:0;margin-bottom:0;}
  #wrapper .main_wrap h2 strong {font-size:26px;padding-bottom:20px;}

  .main_top {margin-bottom:15px; padding: 40px 0 0; width:100%;}

  .proposal_list .tit h3 {font-size:20px;}

  .main_link_wrap {width:100%;padding:0 0%; justify-content: space-between; margin: 0 auto;}
  .main_link_wrap .link {background-size: 76px;}
  .main_link_wrap .link:hover {background-size: 76px;}
  /* 20250703 .main_link_wrap .link a{padding:15px 15px 25px 20px;} */
  .main_link_wrap .link a{padding:88px 15px 25px 40px;}
  .main_link_wrap .link_wrap {width:49.5%;}
  .main_link_wrap .link_wrap a:nth-child(1) {background-size: 76px;}
  .main_link_wrap .link_wrap a:nth-child(1):hover {background-size: 76px;}
  .main_link_wrap .link_wrap a {padding:15px 15px 25px 20px;}
  .main_link_wrap .link_wrap a strong {
    font-size: 24px;
    display: block;
    padding-bottom:5px;
    color: #172c76;
  }
  .main_link_wrap .link strong {
      font-size: 38px;
      padding:0 0 0px 0;
  }
  .btn-linkwrap {
    padding:5px 30px 5px 15px
  }

  .btn-linkwrap1 {
    padding:5px 30px 5px 15px;
  }
  
}



@media (max-width:768px) {
 #wrapper .main_wrap {padding: 10px 2%;}
 #wrapper .main_wrap h2 {width:100%; font-size:22px; padding-bottom:0;padding-left:20px;}
 #wrapper .main_wrap h2 strong {font-size: 22px;}
 #wrapper .main_wrap h2 span {font-size:18px;}

 .main_top {background-size:30%;}
 .main_pro {flex-direction: column;}
 .proposal_list{width:100%; margin:5px 0;}
 /* .proposal_list ul {padding: 10px 5px;} */	/* 슬라이드 크기 padding 문제로 주석처리 */
 .proposal_list ul li a::before {top: 6px;}
 /* .mlike_list ul{padding: 10px 5px;} */		/* 슬라이드 크기 padding 문제로 주석처리 */
 .mlike_list ul li a {padding-left: 0px;}
 .mlike_list .tit h3 {font-size: 18px;}

 .mlike_list{width:100%;}
 .main_contents {padding-bottom: 10px;}

 .main_link_wrap{flex-direction:column; width:100%;}
 .main_link_wrap li {margin:0px; }
 .main_link_wrap li a strong {font-size: 16px;}
 .main_link_wrap .banner_wrap{margin:0;}

 .main_link_wrap .link {width:100%; padding:20px; height:auto;  margin:5px 0; min-height: 140px;}
 .main_link_wrap .link:nth-child(1) .link_list {background-size:60px;}
 .main_link_wrap .link_wrap a:nth-child(1) {background: url(/images/npps/icon02.png) no-repeat 95% 50% #fff; background-size:76px;}
 .main_link_wrap .link_wrap a:nth-child(2) {background: url(/images/npps/m_icon04_bak.png) no-repeat 90% 30px #fff; background-size:60px;}
 .main_link_wrap .link_wrap a:nth-child(1):hover{background: url(/images/npps/icon02-on.png) no-repeat 95% 50%; background-size:76px;}                              
 .main_link_wrap .link_wrap a:nth-child(2):hover{background: url(/images/npps/m_icon04_bak.png) no-repeat 90% 30px, linear-gradient(358deg, #ffffff, #c8ddf5 100%); background-size:60px;}
      
 .main_link_wrap .link:hover{margin:3px 0;}
 .main_link_wrap .link strong {font-size:26px;}
 .main_link_wrap .link .link_list {padding-top:5px;}
 .main_link_wrap .link .link_list li a {font-size:15px;}
 .main_link_wrap .link a {padding:0px;}
 .main_link_wrap .link_wrap {width: 100%; margin-bottom: 10px;}
 .main_link_wrap .link_wrap a {padding: 20px}

 .mlike_list .tit h3 {font-size:20px;}
 .main_top li p {font-size:13px}

 .banner_wrap{width:100%; height:auto;}
 .banner_wrap img {width:100%; height:auto;}

 .swiperLiSecond {margin-top:0px;}
 
 .btn-linkwrap {margin-bottom:15px; margin-top:2px; font-size: 15px;}
 .main_link_wrap .link a {margin-top:5px;}
 
}



@media (max-width:580px) {
  #wrapper .main_wrap h2 span {font-size:16px;}
  #wrapper .main_wrap h2 strong {font-size:18px;}
  .main_link_wrap .link strong {font-size:24px; padding: 2px 0;}
  .main_link_wrap .link_wrap a strong {font-size:20px;}
  .main_top{height: auto; margin: 0; border-radius: 10px; background-size:33%;}
 
}


@media (max-width:412px) {
  .main_top {padding: 20px 0 0;}
  .proposal_list .tit h3 {font-size: 18px;}

  .main_link_wrap .link{background: #f8fbff url('/images/npps/icon01.png') no-repeat 95% 70%; background-size:60px;}
  .main_link_wrap .link:hover{background: #fff url('/images/npps/icon01-on.png') no-repeat 95% 70%; background-size:60px;}

  .main_link_wrap .link_wrap a:nth-child(1) {background: url(/images/npps/icon02.png) no-repeat 95% 70% #fff; background-size:60px;}
  .main_link_wrap .link_wrap a:nth-child(1):hover {background: url(/images/npps/icon02-on.png) no-repeat 95% 70% #fff; background-size:60px;}

  .btn-linkwrap {
    font-size: 14px;
    font-weight: 500;
    background: #4061be url(/images/npps/btn-arrow.png) no-repeat 93% 50%; 
    background-size:5px;
  }
  
  .btn-linkwrap1 {
	 font-size: 14px;
     font-weight: 500;
     background: #4061be url(/images/npps/btn-arrow.png) no-repeat 93% 50%; 
     background-size:5px;
	}
}