@charset "utf-8";
/* *******************************************************
 * filename : download.css
 * description : 다운로드형 게시판 관련 CSS
 * date : 2021-03-29
******************************************************** */

/* ******************   다운로드 게시판 :: 기본형 02 ********************** */
.download-list-con-style02 .download-item{position:relative; border-bottom:1px solid #e1e1e1; }
.download-list-con-style02 .download-item:first-child{border-top:1px solid #333;}
.download-list-con-style02 .download-item .inner-box {position:relative;padding:16px 20px; }
.download-list-con-style02 .download-item .info-box{width:calc(100% - 210px);}
.download-list-con-style02 .download-item .info-box .date-box{display:inline-block; vertical-align:middle; box-sizing:border-box; width:75px; height:75px; padding-top:15px; background-color:#8b857e; margin-right:32px; text-align:center; color:#fff; transition:background-color 0.5s}
.download-list-con-style02 .download-item:hover .info-box .date-box{background-color:#eb8500;}
.download-list-con-style02 .download-item .info-box .date-box .month{display:block; font-size:24px; font-weight:700; margin-bottom:5px;}
.download-list-con-style02 .download-item .info-box .tit-box{display:inline-block; vertical-align:middle; width:calc(100% - 120px); height:46px; line-height:46px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#2f2821; font-size:22px; font-weight:500; letter-spacing:-0.5px;}
.download-list-con-style02 .download-item .download-btn{position:absolute; top:50%; right:20px; width:193px; height:46px; padding:0 20px; line-height:44px; border:1px solid #333;  text-align:left; transform:translateY(-50%)}
.download-list-con-style02 .download-item .download-btn em{position:relative; left:0px; z-index:1; font-size:11px; letter-spacing:1.5px; font-weight:900; color:#333;}
.download-list-con-style02 .download-item .download-btn em .icon{position:static; margin-right:10px; font-size:16px; position:relative; top:2px; right:auto; line-height:40px;}
.download-list-con-style02 .download-item .download-btn .arrow{font-size:20px; top:0px; right:18px; transition:all 0.5s; position:absolute;  line-height:45px; color:#333;}
.download-list-con-style02 .download-item .download-btn:hover .arrow{transform:translateX(5px)}
.download-list-con-style02 .download-btn,
.download-list-con-style02 .download-btn em,
.download-list-con-style02 .download-btn i{transition:color 0.5s 0.1s}
.download-list-con-style02 .download-btn{position:relative; overflow:hidden; display:inline-block; border:1px solid #fff; text-align:center; box-sizing:border-box;}
.download-list-con-style02 .download-btn:before{
display:block; position:absolute; left:-140%; bottom:-10%; content:""; width:130%; height:160%; background-color:#333; transform:skew(-20deg);  transition:all 1s cubic-bezier(0.25, 0.1, 0.09, 1.06);
}

@media all and (min-width:1025px){
	.download-list-con-style02 .download-btn:hover:before{left:-10%; opacity:1.0;filter:Alpha(opacity=100);}
	.download-list-con-style02 .download-btn:hover em,
	.download-list-con-style02 .download-btn:hover em .icon,
	.download-list-con-style02 .download-btn:hover .arrow{color:#fff;}
}

@media all and (max-width:800px){
	.download-list-con-style02 .download-item .inner-box {padding:10px; }
	.download-list-con-style02 .download-item .info-box{width:calc(100% - 130px);}
	.download-list-con-style02 .download-item .info-box .date-box{width:50px; height:50px; padding-top:10px; margin-right:15px; font-size:11px;}
	.download-list-con-style02 .download-item .info-box .date-box .month{font-size:16px; }
	.download-list-con-style02 .download-item .info-box .tit-box{width:100%; height:34px; line-height:34px; font-size:18px;}
	.download-list-con-style02 .download-item .download-btn {width:120px; right:10px; height:34px; line-height:34px; padding:0 10px; text-align:center;}
	.download-list-con-style02 .download-item .download-btn i{display:none;}
}
@media all and (max-width:480px){
	.download-list-con-style02 .download-item{padding:10px 0;}
	.download-list-con-style02 .download-item .info-box{width:auto}
	.download-list-con-style02 .download-item .download-btn{position:static; transform:translateY(0); width:100%; margin-top:10px;}
	.download-list-con-style02 .download-item .download-btn em .icon{display:inline-block; line-height:28px; margin-right:5px;}
}