@charset "UTF-8";
@import url("board.css");

.contents{margin:68px 0 158px;}

/*TOP BG*/
.top{}
.top .top_visual{width:100%; height:240px; background-image: url(../images/content/top_bg1.png); background-repeat: no-repeat; background-position: center center; background-size: cover;overflow: hidden;}
.top .top_visual h2{margin-top:100px; font-weight: 500; font-size: 44px; line-height: 36px; color: #FFFFFF; text-align:center;}
.top .top_visual .top_btn{position:absolute; top:0; font-size: 20px; line-height: 36px; color: #FFFFFF; background-repeat: no-repeat; background-position: 0 center; padding:5px 0;}
.top .top_visual .left_arrow{padding-left:76px; background-image: url(../images/content/top_left.png); left:0;}
.top .top_visual .right_arrow{padding-right:76px; background-image: url(../images/content/top_right.png); background-position: right center; right:0;}


/*분야별 금융정보*/
.info_tab{border-bottom:1px solid #ddd; margin-bottom: 60px;}
.info_tab ul{overflow:hidden;}
.info_tab ul li{float:left;width: calc(15% - 10px);text-align: center;}
.info_tab ul li a{display:block; height:69px; font-weight: 500; font-size: 18px; line-height: 69px; color: #555555;}
.info_tab ul li a.on{color:#0A3A64; border-bottom:3px solid #0A3A64;}

.info_list{margin-top:25px; padding:30px 0 102px; border-top:3px solid #062641; overflow:hidden;}
.info_list ul{overflow:hidden; border-bottom:1px solid #80A4C1; margin: -20px -20px 60px 0; padding-bottom:30px;}
.info_list ul li{width: calc(25% - 20px);float:left;padding:30px;border: 1px solid #DDDDDD;margin: 20px 20px 0 0;}
.info_list ul li a{display:block; position: relative;}
.info_list ul li a:before{bottom:103px;}
.info_list ul li img{width: 100%; height:100% !important;}
.info_list ul li span{margin:20px 0 15px;}
.info_list ul li p{font-size: 16px; line-height: 23px;}


/*일반 게시판*/
.board{margin-top:68px;}
.board .board_list{}
.board .board_list table{margin-top:23px; border-top:3px solid #0A3A64; border-bottom:1px solid #80A4C1;}
.board .board_list table th{height:50px; font-weight: normal; font-size: 15px; line-height: 20px; color: #333333;}
.board .board_list table th:nth-child(1){width:6%}
.board .board_list table th:nth-child(2){width: 70%;}
.board .board_list table th:nth-child(3){width: 6%;}
.board .board_list table th:nth-child(4){width: 6%;}
.board .board_list table th:nth-child(5){width: 10%;}
.board .board_list table td{height:68px; border-top:1px solid #ccc; text-align: center; font-weight: normal; color:#666; font-size:15px;}
.board .board_list table td:nth-child(2){text-align: left; padding-left:10px; font-size: 16px; color: #222222;}
.board .board_list table .ico{width:17px; height:21px; display:block; margin:0 auto; background-image: url(../images/ico/ico_file.png); background-repeat: no-repeat; background-position: 0 0;}

/*일반 게시판 상세페이지*/
.board_view{}
.board_view .view_tit{text-align: center; padding:45px 0 30px; border-top:3px solid #062641; border-bottom:1px solid #ddd;}
.board_view .view_tit p{font-weight: 600; font-size: 24px; line-height: 27px; color: #222222; margin-bottom:10px;}
.board_view .view_tit span{display:inline-block; font-size: 14px; line-height: 13px; color: #666666;}
.board_view .view_tit .data{padding-right:12px; margin-right:12px; border-right:1px solid #999;}
.board_view .view_cont{padding:52px 33px;}
.board_view .view_cont p{font-size: 16px; line-height: 20px; color: #666666;}
.board_view .file{/* padding: 20px 24px 20px; */border:1px solid #ddd;border-bottom:1px solid #1F4270; overflow: hidden;}
.board_view .file p{font-weight: 600;font-size: 16px;line-height: 24px;color: #222222;position: relative;padding-bottom: 13px;border-bottom:1px solid #ddd;cursor: pointer;padding: 20px 0 20px;margin: 0 24px;}
.board_view .file p .ico_arrow{position: absolute; top:0; right:0;}
.board_view .file p .ico_arrow:before{content:'';position: absolute;top: 27px;right: 0;width: 18px;height:11px;background-image: url(../images/ico/ico_arrow.png);background-repeat: no-repeat;background-position: 0 0;}
.board_view .file p.on .ico_arrow:before{background-image: url(../images/ico/ico_arrow_on.png);}
.board_view .file ul{padding: 0 0 20px 0; margin: 0 24px; display:none;}
.board_view .file ul li{font-size: 14px; line-height: 24px; color: #666666; margin-top:17px;}
.board_view .file ul li:last-child{margin-top:13px;}
.board_view .file ul li span{display:inline-block; vertical-align: middle; margin-right:5px;}
.board_view .file ul li a{display:inline-block; width:28px; height:28px; position: relative; vertical-align: middle; margin-left:5px;}
.board_view .file ul li a:before{content:''; position:absolute; top:0; left:0; width:28px; height:28px; background-repeat: no-repeat; background-position: 0 0;}
.board_view .file ul li a.ico_view:before{background-image: url(../images/ico/ico_view.png);}
.board_view .file ul li a.ico_down:before{background-image: url(../images/ico/ico_download.png);}
.board_view .list_btn{text-align: center; margin:52px 0 72px;}
.board_view .list_btn a{display:inline-block; width:200px; height:50px; font-weight: 600; font-size: 16px; line-height: 50px; text-align: center; color: #FFFFFF; background-color: #222;}
.board_view .pn_cont{overflow: hidden; margin:0 28px;}
.board_view .pn_cont .prev_c{width:629px; float:left;}
.board_view .pn_cont .prev_c a:before{content:''; position:absolute; bottom:0; left:0; width:34px; height:26px; background-image: url(../images/ico/ico_view_l.png); background-repeat: no-repeat; background-position: 0 0;}
.board_view .pn_cont .next_c{width:629px; float:left; margin-left: 23px; padding-left: 29px; border-left: 1px solid #ddd;}
.board_view .pn_cont .next_c a:before{content:''; position:absolute; bottom:0; right:0; width:34px; height:26px; background-image: url(../images/ico/ico_view_r.png); background-repeat: no-repeat; background-position: 0 0;}
.board_view .pn_cont a{display:block; padding-bottom:46px; position:relative;}
.board_view .pn_cont a .stxt{font-size: 14px; line-height: 20px; color: #666666;}
.board_view .pn_cont a p{font-weight: 600; font-size: 16px; line-height: 24px; color: #222222; margin-top:6px;}
.board_view .pn_cont .prev_c a:hover:before{background-image: url(../images/ico/ico_view_l_on.png);}
.board_view .pn_cont .next_c a:hover:before{background-image: url(../images/ico/ico_view_r_on.png);}
.board_view .pn_cont a:hover p{color:#1F4270;}
.board_view .pn_cont a:hover p span{border-bottom:1px solid #1F4270;}


 
@media all and (max-width:1024px) {

    .top .inner{width:100%;}
    .top .top_visual h2{margin-top:75px;}
    .top .top_visual .p_move{width: 100%; height: 100%; overflow: hidden; margin-top: 63px; padding: 15px 0; background-color: rgba(0, 0, 0, 0.35); text-align: center;}
    .top .top_visual .p_move .p_left{width: 50%; float: left; }
    .top .top_visual .p_move .p-right{width: 50%; float: right;}
    .top .top_visual .top_btn{position: static;}

    .info_tab{margin-bottom:50px;}
    .info_tab .inner{width:95%;}
    .info_tab ul li{width: 13.3%;}
    .info_tab ul li:nth-child(5){width: 20%;}
    .info_tab ul li a{height:60px; line-height:60px;}

    .info_list{margin-top:20px; padding:30px 0 0;}
    .info_list ul{margin:-15px -15px 50px 0;}
    .info_list ul li{width:calc(33.3% - 15px); margin:0 15px 15px 0; padding:20px;}
    
	.board_view .pn_cont .prev_c{width:45%;}
	.board_view .pn_cont .next_c{width:45%;}

}

@media all and (max-width:768px) {

    .top .top_visual h2{font-size:40px;}
    .top .top_visual .p_move{}
    .top .top_visual .top_btn{font-size:18px;}
    .top .top_visual .left_arrow{padding-left:65px; background-size: 50px;}
    .top .top_visual .right_arrow{padding-right:65px; background-size: 50px; background-position: 99.5% center;}

    .info_tab ul li{width: 11%;}
    .info_tab ul li:nth-child(2){width: 15%;}
    .info_tab ul li:nth-child(5){width: 25%;}
    .info_tab ul li:nth-child(7){width: 16%;}

    .info_list ul li{width:calc(50% - 15px)}
    .info_banner .banner_r{left:90px;}

}


@media all and (max-width:480px) {

    .top .top_visual{height:150px;}
    .top .top_visual h2{font-size:30px; margin-top:33px;}
    .top .top_visual .p_move{margin-top:27px; padding:9px 0;}
    .top .top_visual .top_btn{font-size:15px;}
    .top .top_visual .left_arrow{padding-left:40px; background-size: 30px;}
    .top .top_visual .right_arrow{padding-right:40px; background-size: 30px;}

    .info_tab ul li a{font-size: 14px;}

    .info_list{margin-top:20px; padding:20px 0 0;}
    .info_list ul{margin:0; padding:0;}
    .info_list ul li{width:100%; border:none; padding:0; border-bottom:1px solid #ddd; padding-bottom:20px; margin:0 15px 30px 0;}
    .info_list ul li:last-child{border-bottom:none; padding-bottom:0;}
    
	.board_view .pn_cont .prev_c{width:45%;}
	.board_view .pn_cont .next_c{width:45%;}

}