@charset "utf-8";

/* Icon */
.list-board .wr-icon { display:inline-block; padding:0px; margin:0px; overflow:hidden; vertical-align:middle; background-repeat: no-repeat; background-position: center; background-size:contain; margin-left:3px;}
.list-board .wr-secret { width:30px; height:30px; background-image: url('../img/icon_secret.png'); }
.list-board .wr-file { width:30px; height:30px; background-image: url('../img/icon_file.png'); }
.list-board .wr-link { width:30px; height:30px; background-image: url('../img/icon_link.png'); }
.list-board .wr-icon:first-of-type{margin-left:15px;}

.new-box { border:1px solid #ddd; background:#fafafa; padding:20px 15px 3px; margin-bottom:15px; }

.list-board { }
.list-board .chk { width:40px; }
.list-board .num { width:100px; }
.list-board .cate { width:100px; }
.list-board .name { width:120px; }
.list-board .date { width:120px; }
.list-board .hit { width:100px; }
.list-board .icon { position:relative; width:46px; height:46px; display:table; margin:0px auto; }
.list-board .icon a { display:table-cell; width:1%; vertical-align:middle; font-size:30px; color:#fff; }
.list-board .icon .bg-light { background:#eee; }

.list-board .board-list { list-style:none; padding:0px; margin:0px; }
.list-board .board-list li { border-bottom:1px solid #ddd; display:table; width:100%; table-layout:fixed; }
.list-board .board-list li:hover { color:#000; background-color:#F8F8F8; }
.list-board .board-list li > div { display:table-cell; height:34px; line-height:22px; padding:6px 0px; text-align:center; color:#666; vertical-align:middle; }
.list-board .board-list li .cate { padding-left:10px; text-align:left; }
.list-board .board-list li .subj { padding-left:10px; text-align:left; }
.list-board .board-list li .subj a { display:block; word-break:break-all; }
.list-board .board-list li .name { font-weight:bold; }
.list-board .board-list .subj-item { margin-right:-15px }
.list-board .board-list .subj-item a { display:inline !important; color:#888 !important; }
.list-board .board-list .subj-item > span { display:inline; margin-right:15px; font-weight:normal; color:#888; }
.list-board .board-list .subj-item > span:last-child { margin-right:0px; }
.list-board .board-list .subj-item .hide { display:none; }
.list-board .none { padding:50px 0px; }
@media all and (max-width:768px) {
	.responsive .list-board .board-list .subj-item .hide { display:inline !important; }
}




/***************** 기본 END ********************************************************************/
#my_page_con .my_page_top{display:flex;flex-wrap:wrap;}
#my_page_con .my_page_top > div{display:flex;flex-wrap:wrap;align-items:center;}
#my_page_con .my_page_top > div.left_box{width:33%;padding:50px 20px;text-align:center;background:#88bb1d;}
#my_page_con .my_page_top > div.left_box > div{width:100%;}
#my_page_con .my_page_top > div.left_box.sub_ha{background:#33a1db;}
#my_page_con .my_page_top > div.left_box.sub_mu{background:#fc9c35;}
#my_page_con .my_page_top > div.left_box *{color:#fff;}
#my_page_con .my_page_top > div.left_box b{font-size:18px;line-height:120%;}
#my_page_con .my_page_top > div.left_box strong{display:block;font-size:32px;line-height:120%;margin:10px 0 30px;}
#my_page_con .my_page_top > div.left_box .btn_box{max-width:270px;margin:0 auto;font-size:0;}
#my_page_con .my_page_top > div.left_box .btn_box span{margin-right:10px;}
#my_page_con .my_page_top > div.left_box .btn_box span,
#my_page_con .my_page_top > div.left_box .btn_box a{display:inline-block;width:calc(50% - 5px);font-size:16px;font-weight:700;border:1px solid #fff;height:45px;line-height:45px;}
#my_page_con .my_page_top > div.right_box{width:calc(67% - 30px);margin-left:30px;padding:20px 20px 20px 40px;border-top:2px solid #363458;border-bottom:1px solid #ddd;}
#my_page_con .my_page_top > div.right_box ul li{position:relative;font-size:18px;line-height:160%;padding-left:15px;margin-bottom:20px;}
#my_page_con .my_page_top > div.right_box ul li:last-child{margin-bottom:0;}
#my_page_con .my_page_top > div.right_box ul li:after{content:"";position:absolute;width:6px;height:6px;border-radius:50%;background:#ddd;top:10px;left:0;}
#my_page_con .my_page_top > div.right_box ul li b{margin-right:40px;}
#my_page_con .secession_btn{text-align:right;margin-top:15px;}
#my_page_con .secession_btn a{font-size:15px;line-height:120%;color:#999;}
#my_page_con .list_container h4{font-size:24px;font-weight:700;line-height:120%;margin-bottom:15px;}
#my_page_con .list_container .list_inner .div-head{border-top:3px solid #999;padding:25px 0;font-size:18px;}
#my_page_con .list_container .list_inner .div-head > span{border:0;}
#my_page_con .list_container .list_inner .list-board .board-list li:hover{background:none;}
#my_page_con .list_container .list_inner .list-board .board-list li > div{font-size:18px;font-weight:500;padding:25px 0;color:#333;}
#my_page_con .list_container .list_inner .list-board .board-list li > div.subj{padding-right:10px;}
#my_page_con .list_container .list_inner .pagination_box{text-align:center;margin-top:35px;}

@media all and (max-width:1024px){
	.list-board .wr-secret { width:25px; height:25px; }
	.list-board .wr-file { width:25px; height:25px;}
	.list-board .wr-link { width:25px; height:25px;}
	.list-board .wr-icon:first-of-type{margin-left:5px;}

	.list-board .num { width:60px; }
	.list-board .name { width:100px; }
	.list-board .date { width:100px; }
	.list-board .hit { width:60px; }
	
	#my_page_con .my_page_top > div.left_box{padding:30px 10px;}
	#my_page_con .my_page_top > div.left_box b{font-size:16px;}
	#my_page_con .my_page_top > div.left_box strong{font-size:23px;margin:10px 0 20px;}
	#my_page_con .my_page_top > div.left_box .btn_box span,
	#my_page_con .my_page_top > div.left_box .btn_box a{font-size:14px;height:35px;line-height:35px;}
	#my_page_con .my_page_top > div.right_box{width:calc(67% - 20px);margin-left:20px;padding:20px;}
	#my_page_con .my_page_top > div.right_box ul li{font-size:16px;margin-bottom:10px;}
	#my_page_con .my_page_top > div.right_box ul li:after{top:8px;}
	#my_page_con .my_page_top > div.right_box ul li b{margin-right:20px;}
	#my_page_con .secession_btn{margin-top:10px;}
	#my_page_con .list_container h4{font-size:20px;margin-bottom:10px;}
	#my_page_con .list_container .list_inner .div-head{padding:12px 0;font-size:15px;}
	#my_page_con .list_container .list_inner .list-board .board-list li > div{font-size:15px;padding:10px 0;}
	#my_page_con .list_container .list_inner .pagination_box{margin-top:20px;}
}
@media all and (max-width:768px){
	#my_page_con .my_page_top > div.left_box{padding:20px 10px;width:100%;}
	#my_page_con .my_page_top > div.left_box b{font-size:14px;}
	#my_page_con .my_page_top > div.left_box strong{font-size:20px;margin:5px 0 10px;}
	#my_page_con .my_page_top > div.left_box .btn_box span,
	#my_page_con .my_page_top > div.left_box .btn_box a{font-size:13px;}
	#my_page_con .my_page_top > div.right_box{width:100%;margin-left:0;padding:20px 10px;}
	#my_page_con .my_page_top > div.right_box ul li{font-size:14px;margin-bottom:5px;}
	#my_page_con .my_page_top > div.right_box ul li:after{top:6px;}
	#my_page_con .my_page_top > div.right_box ul li b{margin-right:10px;}
	#my_page_con .secession_btn{font-size:13px;}
	#my_page_con .list_container h4{font-size:18px;}
	#my_page_con .list_container .list_inner .div-head{padding:10px 0;font-size:13px;}
	#my_page_con .list_container .list_inner .list-board .board-list li > div{font-size:13px;padding:10px 0;}
	#my_page_con .list_container .list_inner .pagination_box{margin-top:20px;}
}