@charset "utf-8";

.board016 {background:white;box-sizing:border-box;width: 100%;height: 100%;}
.board016 ul.board_wrap {position:relative;width: 100%;height: 100%;/* background: #fff; */float: left;box-sizing: border-box;}
.board016 ul.board_wrap > li {width:auto;float:left;display:inline-block;max-width: 33%;/* margin-left: -1px; */}
.board016 ul.board_wrap > li .tit {display: inline-block;width: 100%;}
.board016 ul.board_wrap > li .tit a.board_name {float:left; color:#838383; border-width: 0 1px 1px 0; font-size:17px; padding: 0 15px; box-sizing:border-box;
												letter-spacing:-1px; width: 100%; text-overflow: ellipsis; overflow: hidden; height: 57px; line-height: 57px; white-space: nowrap;
												/* vertical-align: top; */ position: relative; font-weight: 400;}
.board016 ul.board_wrap > li:first-child .tit a.board_name {/* padding-left:0; */}
.board016 ul.board_wrap > li.active + li .tit a.board_name:after {content:"";width: 1px;height: 15px;background: #ccc;float: right;position: absolute;right: 0;top: 21px;}
.board016 ul.board_wrap > li:last-child .tit a.board_name:after {display:none;}
.board016 ul.board_wrap > li.active .tit a.board_name {color:#333;font-size:18px;font-weight:600;background: #fff;border-bottom: none;z-index: 1;border: 1px solid rgba(0,0,0,0.1);border-bottom: none;}

.board016 ul.board_wrap > li .imgbox {position: absolute; top: 90px; left: 15px; z-index: 1; width: 87px; height: 87px; line-height: 85px;
    text-align: center; border-radius: 100%; border: 1px solid rgba(0,0,0,0.1); overflow:hidden;}
.board016 ul.board_wrap > li .imgbox img {display:inline-block; vertical-align:middle; margin:auto; top:-9999px; bottom:-9999px; left:-9999px; right:-9999px; max-widht:100%; max-height:100%;}
.board016 ul.board_wrap > li:not(.active) .imgbox {display:none;}

.board016 ul.board_wrap li div ul {height:100%;position:absolute;display:none;background:#fff;}
.board016 ul.board_wrap > li.active div ul {position:absolute;left:0;width:100%;height: calc(100% - 56px);display:block;float: left;
											padding: 15px 15px;box-sizing: border-box;border: 1px solid rgba(0,0,0,0.1);}

.board016 ul.board_wrap > li .more_box {display:none;}
.board016 ul.board_wrap > li.active .more_box {display:inline;position:absolute;top:0;right: 0;}
.board016 ul.board_wrap > li.active .more_box a {font-family:arial;color: #fff;width: 20px;height: 20px;line-height: 20px;
												background: #333;-webkit-transition:color 1s, background 1s;transition:color 1s, background 1s; cursor:pointer;}
.board016 ul.board_wrap > li.active .more_box a:hover {background:#333; color:#fff;}

.board016 ul.board_wrap ul li a {text-decoration:none;position:relative;width:100%;float:left;margin-bottom: 2px;}
.board016 ul.board_wrap ul li:not(:first-child) a .imgbox {display:none;}
.board016 ul.board_wrap ul li a .imgbox {width:30%; height:150px; overflow:hidden; float:left; margin-bottom:15px; position:relative;}
.board016 ul.board_wrap ul li a .imgbox img {position:absolute; margin:auto; top:-999px; bottom:-999px; right:-999px; left:-999px; min-height:100%; min-width:100%;}
.board016 ul.board_wrap ul li:first-child {padding-left: 100px;box-sizing: border-box;margin-top: 10px;}
.board016 ul.board_wrap ul li:first-child a .txtbox {width: 100%;float:left;box-sizing:border-box;padding-bottom: 10px;margin-bottom: 10px;text-align:left;}
.board016 ul.board_wrap ul li a .tit {font-size: 16px; width: 70%; color:#555; line-height: 30px; letter-spacing: -0.5px; -webkit-transition:color 0.5s; transition:color 0.5s; white-space:nowrap;
									   overflow:hidden; text-overflow:ellipsis; text-decoration:none; text-align:left; display: block;}
.board016 ul.board_wrap ul li a .tit:before {content: "/";font-size: 9px;font-weight: 600;padding-right: 6px;color: #f08300;vertical-align: middle;text-decoration:none;display: inline-block;}
.board016 ul.board_wrap ul li a .tit:hover {color:#727272; text-decoration:underline;}
.board016 ul.board_wrap ul li:first-child a .tit:hover {color:#727272; font-weight:600; text-decoration:none;}
.board016 ul.board_wrap ul li:first-child a .tit {font-size: 18px;/* font-weight:600; */padding-bottom: 5px;/* font-weight: 600; */width: 100%;}
.board016 ul.board_wrap ul li:first-child a .tit:before {content:""; display:none;}
.board016 ul.board_wrap ul li:not(:first-child) a .co {display:none;}
.board016 ul.board_wrap ul li a .co {line-height: 150%; font-size: 15px; word-break:keep-all; margin-bottom: 10px; -webkit-line-clamp:2; -webkit-box-orient:vertical;
									  display:-webkit-box; white-space:normal; max-height:40px; overflow:hidden; color: #555; letter-spacing: -0.5px;}
.board016 ul.board_wrap ul li a .date {color: #555; font-size: 14px; line-height:32px; position:absolute; top:0px; right:0; -webkit-transition:color 0.5s; transition:color 0.5s;}
.board016 ul.board_wrap ul li a:hover .date {color:#838383;}
.board016 ul.board_wrap ul li:first-child a .date {position:relative;float:left;line-height: normal;font-size: 14px;}

.board016 ul.board_wrap li div ul li.no_data .tit {font-size: 17px;color: #555;/* line-height:29px; */letter-spacing: -0.5px;/* padding-left:5px; */padding-top: 40px;}

.border-radius .board016 ul.board_wrap > li.active div ul {border-radius: 0 15px 15px 15px;}
.border-radius .board016 ul.board_wrap > li.active .tit a.board_name {border-radius: 15px 15px 0 0;}

/* layout setting */
.layout_01 .board016 {height:340px;}
.layout_06 .board016 ul.board_wrap > li {width:20%; text-align:center;}


.layout_height_M .board016 ul.board_wrap > li.active div ul li:nth-child(3) ~ li {display:none;}
.layout_height_H .board016 ul.board_wrap ul li a .tit {line-height:30px;}
.layout_height_M .board016 ul.board_wrap ul li a .imgbox {height:110px;}
.layout_height_M .board016 ul.board_wrap ul li:first-child a .txtbox {padding-top:0px;margin-bottom:0;padding-bottom: 0;}
.layout_height_M .board016 ul.board_wrap > li.active div ul {padding:0 15px;}
.layout_height_M .board016 ul.board_wrap > li .imgbox {top:75px;}

.borderbox .board016 ul.board_wrap > li.active div ul {border-width: 1px 0 0;}
.borderbox .board016 ul.board_wrap > li.active .tit a.board_name {border-top:none;}
.borderbox .board016 ul.board_wrap > li:first-child.active .tit a.board_name {border-left:none;}


	@media (min-width:800px){
		.board016 ul.board_wrap > li>div {height:57px;}
		.board016 ul.board_wrap > li.active .more_box {height: 57px;line-height: 57px;}
		.board016 ul.board_wrap > li.active>div .tit a.board_name {height:58px;}
		.board016 ul.board_wrap > li.active div ul {top:56px;}

		.layout_height_A .board016 {height:400px;}
		.layout_height_H .board016 {height:350px;}
		.layout_height_M .board016 {height:250px;}
		.layout_height_A .board016 ul.board_wrap > li.active div ul {padding-top:30px;}
		.layout_height_A .board016 ul.board_wrap ul li:first-child a .tit {-webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box; white-space: normal; line-height: 120%; padding-bottom: 0; margin-bottom: 10px; font-weight: 600;}
	}

	@media (min-width:800px) and (max-width:1200px){
		.board016 ul.board_wrap > li.active .tit a.board_name,
		.board016 ul.board_wrap > li .tit a.board_name {font-size:17px;}
		.layout_03 .board016 ul.board_wrap ul li a .date {text-indent:-33px; overflow:hidden;}
	}

	@media (max-width:799px){
		.board016 ul.board_wrap > li>div {height:44px;}
		.board016 ul.board_wrap > li.active>div .tit a.board_name {height: 45px;}
		.board016 ul.board_wrap > li.active .more_box {height:44px;line-height:44px;}
		.board016 ul.board_wrap > li.active div ul {top: 43px;height: calc(100% - 43px);}

		.board016 ul.board_wrap > li.active .tit a.board_name {font-size:17px;}
		.board016 ul.board_wrap > li .tit a.board_name {line-height:44px;height: 44px;}
		.board016 ul.board_wrap ul li a .imgbox {height:120px;}
		.board016 ul.board_wrap ul li a .imgbox img {max-width:120%;}

		.layout_01 .board016 {height:325px;}
		.layout_height_H .board016 {height:335px;}
		.layout_height_M .board016 {height:240px;}
	}
	@media (min-width:600px) and (max-width:799px){
		.layout_block4 .layout_04.layout_height_H .board016 {height:350px;}
		.layout_block4 .layout_04.layout_height_M .board016 {height:250px;}
	}
	@media (max-width:599px){
		.board016 ul.board_wrap ul li a .tit {font-size: 14px;}
		.board016 ul.board_wrap ul li a .date {font-size: 12px !important;text-indent: -31px;overflow:hidden;}

		.board016 ul.board_wrap ul li:first-child a .tit {font-size: 17px;}
        .board016 ul.board_wrap > li .imgbox {top: 70px;}
	}
