@charset "utf-8"; 

.board123 {background:white;width:100%; height: 400px; box-sizing:border-box;}
.board123 ul.board_wrap {position:relative;width:100%;height:100%;}
.board123 ul.board_wrap:before {content:""; width:100%; height:1px; background:rgba(0,0,0,0.1); position:absolute; left:0;}

/*tab setting*/
.board123 ul.board_wrap > li {width:auto;/* float:left; */ display:inline-block; box-sizing:border-box; margin-left:-3px;
							/* border-bottom:2px solid rgba(0,0,0,0.2); *//* padding: 0 10px; */}
.board123 ul.board_wrap > li div {text-align:center;}
.board123 ul.board_wrap > li h3 {display:inline-block;padding: 0 10px;width:100%;color:#333;box-sizing: border-box;/* float:left; */ vertical-align:middle;}
.board123 ul.board_wrap > li h3 a.board_name {float:left; color:#606060; font-size:17px; letter-spacing:-0.5px; font-weight:600;
											/* line-height:22px; */ /* padding: 15px 0; */
											width:100%; box-sizing:border-box; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; position:relative;}
.board123 ul.board_wrap > li .more_box {position:absolute; top:0; right:15px; width:auto; display:none;}
.board123 ul.board_wrap > li .more_box a {font-size:23px; font-family:arial; color:#999; -webkit-transition:color 1s; transition:color 1s;}
.board123 ul.board_wrap > li .more_box:hover a {color:#333;}
.board123 ul.board_wrap > li.active:after {content:""; width:100%; height:4px; background:#b5121b; float:left; box-sizing:border-box; margin-top:-3px;}
.board123 ul.board_wrap > li.active h3 a.board_name {color:#333; font-size:18px;}
.board123 ul.board_wrap > li.active .more_box {display:inline;}

/* board setting */
.board123 ul.board_wrap ul {display:none;}
.board123 ul.board_wrap > li.active div ul {width:100%;display:block;padding:10px 15px;padding: 20px 0;box-sizing:border-box;}

.board123 ul.board_wrap ul li {position:relative; width:24.25%; padding:20px 15px; float:left; text-align:left; margin-right:1%; 
								border:1px solid rgba(0,0,0,0.1); box-sizing:border-box; line-height:normal;}
.board123 ul.board_wrap ul li:nth-child(4n) {margin-right:0;}
.board123 ul.board_wrap ul li p.tit {font-size:17px; font-weight:600; color:#cc5409; line-height:140%; letter-spacing:-0.5px; text-decoration:none;
									-webkit-transition:color 0.5s;transition:color 0.5s;
									height:46px; box-sizing:border-box; overflow:hidden; text-overflow:ellipsis;
									-webkit-line-clamp:2; -webkit-box-orient:vertical; display:-webkit-box; white-space:normal;}
.board123 ul.board_wrap ul li span.date {width:100%; display:block; line-height:140%; margin:5px 0 30px; font-size:12px;}
.board123 ul.board_wrap ul li span.co {font-size: 13px;line-height: 22px;word-break: keep-all;letter-spacing: -0.5px; overflow:hidden;
										width:100%; max-height:110px; float:left; margin-bottom:25px; box-sizing:border-box; 
										-webkit-line-clamp: 5; -webkit-box-orient:vertical;display:-webkit-box;white-space:normal;}

.board123 ul.board_wrap ul li .more_btn {max-width:90%; height:28px; line-height:16px; padding:5px 10px; 
										border:1px solid rgba(0,0,0,0.15); border-radius:20px; box-sizing:border-box; background:white;
										white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:inline-block; -webkit-transition: all 1s; transition:all 1s;}
.board123 ul.board_wrap ul li .more_btn:hover {background:#f0f0f0 !important;}



.board123 ul.board_wrap ul li.no_data {width:100%; height:100px;}
.board123 ul.board_wrap li div ul li.no_data p.tit {font-size:14px; color:#555;}






	@media (min-width:800px){
		.board123 ul.board_wrap:before {top:57px;}
		.board123 ul.board_wrap > li {min-width:130px; max-width:25%;}
		.board123 ul.board_wrap > li .more_box {height:57px; line-height:57px;}
		.board123 ul.board_wrap > li.active div ul {top:57px;}
		.board123 ul.board_wrap > li div {height:57px; line-height:57px;}

		.board123 ul.board_wrap ul {position:absolute;}
		.board123 ul.board_wrap ul li {min-height:305px;}
		.board123 ul.board_wrap ul li .more_btn {position:absolute; left:15px; bottom:20px;}
		.board123 ul.board_wrap > li.active div ul {top:52px; left:0;}
	}

	@media (min-width:800px) and (max-width:1200px){
	}

	@media (max-width:799px){
		.board123 {padding:0 10px; height:auto; position:relative;}
		.board123 ul.board_wrap:before {top:44px;}
		.board123 ul.board_wrap > li {margin-left:0; float:left; width:100%;}
		.board123 ul.board_wrap > li:first-child {margin-left:0; margin-top:44px;}
		.board123 ul.board_wrap > li .more_box {height:44px; line-height:44px;}
		.board123 ul.board_wrap > li.active div ul {/*top:44px; */float:left; padding-bottom:0;}
		.board123 ul.board_wrap > li div {/*height:44px; line-height:44px;*/}

		.board123 ul.board_wrap > li.active h3 a.board_name {font-size:16px; line-height:18px; word-break:break-all; }
		.board123 ul.board_wrap > li h3 {padding:0 10px; max-width:20%; float:left; position:absolute; top:0; height:44px; line-height:44px;}
		.board123 ul.board_wrap > li h3 a.board_name {font-size:15px; line-height:20px; float:none; display:inline-block; vertical-align:middle;
													 -webkit-line-clamp:2; -webkit-box-orient:vertical; display:-webkit-inline-box; white-space:normal;}

		.board123 ul.board_wrap > li:first-child h3 {left:0;}
		.board123 ul.board_wrap > li:nth-child(2) h3 {left:20%;}
		.board123 ul.board_wrap > li:nth-child(3) h3 {left:40%;}
		.board123 ul.board_wrap > li:nth-child(4) h3 {left:60%;}
		.board123 ul.board_wrap > li.active:after {display:none;}
		.board123 ul.board_wrap > li.active h3:after {content:""; width:100%; height:4px; float:left; background:#b5121b; box-sizing:border-box; position:absolute; left:0; bottom:0;}

		.board123 ul.board_wrap ul {position:relative;}
		.board123 ul.board_wrap li.active ul {display:inline;}
		.board123 ul.board_wrap ul li {width:100%; padding:20px 15px 15px; margin-bottom:20px; margin-right:0;}
		.board123 ul.board_wrap ul li p.tit {font-size:15px; height:auto; margin-bottom:10px;}
		.board123 ul.board_wrap ul li span.date {margin:5px 0 20px; opacity:0.8;}
		.board123 ul.board_wrap ul li span.co {font-size:13px; -webkit-line-clamp:2; max-height:44px; margin-bottom:23px;}

	}
	@media (max-width:599px){
		.board123 ul.board_wrap ul li p.tit {font-size:14px;}

	}