@charset "utf-8";

/* list */
.top_info_box { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; width:100%; margin-bottom:30px; padding:30px; background:#F7F8F9; border-radius:20px; }
.top_info_box .bbs_cate { margin:0; }
.view_type_btn { order:2; display:flex; justify-content:flex-end; gap:5px; }
.view_type_btn a { display:inline-block; position:relative; padding:18px 20px; line-height:1.4; background-color:#fff; color:#000; border-radius:14px; border:1px solid #dcdcdc; transition:.3s; }
.view_type_btn a.on,
.view_type_btn a:hover { color:#fff; background-color:#010045; }
.view_type_btn a::before { content:''; display:inline-block; width:18px; height:18px; margin:-3px 8px 0 0; vertical-align:middle; background-image:url("../images/sub/ico_board_type_list.png"); background-position:center center; background-repeat:no-repeat; }
.view_type_btn a.card_type::before { background-image:url("../images/sub/ico_board_type_card.png"); }
.view_type_btn a.on::before,
.view_type_btn a:hover::before { background-image:url("../images/sub/ico_board_type_list_on.png"); }
.view_type_btn a.card_type.on::before,
.view_type_btn a.card_type:hover::before { background-image:url("../images/sub/ico_board_type_card_on.png"); }

.bbs_gallist { margin:20px 0; }
.bbs_gallist ul { display:flex; flex-wrap:wrap; gap:40px; margin:0; }
.bbs_gallist ul li.cell { flex:auto; max-width:calc(50% - 20px); width:calc(50% - 20px); margin:0; padding:0; }
.bbs_gallist ul li.cell a { display:block; min-height:260px; padding:30px 40px; color:#000; position:relative; box-shadow:inset 0 0 0 1px #ddd; border-radius:20px; transition:color 0.1s; overflow:hidden; z-index:1; }
.bbs_gallist ul li.cell a::before,
.bbs_gallist ul li.cell a::after { content:''; position:absolute; border:2px solid transparent; width:0; height:0; border-radius:20px; overflow:hidden; z-index:-1; }
.bbs_gallist ul li.cell a::before { top:0; left:0; }
.bbs_gallist ul li.cell a::after { bottom:0; right:0; }
.bbs_gallist ul li.cell a:hover::before,
.bbs_gallist ul li.cell a:hover::after { width:100%; height:100%; }
.bbs_gallist ul li.cell a:hover::before { border-top-color:var(--theme-color); border-right-color:var(--theme-color); transition:width 0.1s ease-out, height 0.1s ease-out 0.1s; }
.bbs_gallist ul li.cell a:hover::after { border-bottom-color:var(--theme-color); border-left-color:var(--theme-color); transition:border-color 0s ease-out 0.05s, width 0.1s ease-out 0.05s, height 0.1s ease-out 0.2s; }
/*
.bbs_gallist ul li.cell a { display:block; position:relative; padding:30px 40px; color:#000; z-index:1; }
.bbs_gallist ul li.cell a::before { content:''; display:block; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:100%; height:100%; border:1px solid #ddd; border-radius:20px; transition:.3s; z-index:-1; }
.bbs_gallist ul li.cell a:hover::before { border:3px solid transparent; background:linear-gradient(140deg, #009DE6, #E1352B, #008C61) border-box; -webkit-mask:linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0); -webkit-mask-composite: destination-out; mask-composite:exclude; }
*/
.bbs_gallist ul li.cell .cell_subject_state { display:flex; justify-content:space-between; }
.bbs_gallist ul li.cell .cell_subject_state .cell_subject { width:calc(100% - 80px); height:64px; margin:0; padding-right:30px; font-size:1.333rem; font-weight:700; line-height:1.4; word-break:keep-all; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.bbs_gallist ul li.cell .cell_subject_state .state { min-width:80px; }
.bbs_gallist ul li.cell .cell_subject_state .state span { display:inline-flex; justify-content:center; align-items:center; width:80px; height:60px; border-radius:999px; font-weight:700; }
.bbs_gallist ul li.cell .cell_subject_state .state .ing { color:#fff; background-color:var(--theme-color); }
.bbs_gallist ul li.cell .cell_subject_state .state .end { color:#fff; background-color:#718C9A; }
.bbs_gallist ul li.cell .cell_subject_state .state .wait { color:#fff; background-color:var(--theme-color-3); }
.bbs_gallist ul li.cell .cell_case { margin-top:10px; font-size:1.125rem;  }
.bbs_gallist ul li.cell .cell_cate { margin:15px 0; }
.bbs_gallist ul li.cell .cell_cate span { color:#57B76F; font-weight:500; font-size:1.125rem; }
.bbs_gallist ul li.cell .cell_period { color:#718C9A; }

@media (max-width: 1200px) {
	.bbs_gallist ul { gap:20px; }
	.bbs_gallist ul li.cell { max-width:calc(50% - 10px); width:calc(50% - 10px); }	
}
@media (max-width:992px) {
	.top_info_box { padding:25px; }
	.view_type_btn a { padding:10px 15px; }
	.bbs_gallist ul li.cell a { padding:20px 25px; }
}
@media (max-width:768px) {
	.top_info_box { gap:10px; padding:20px; }
	.top_info_box .bbs_cate,
	.view_type_btn { width:100%; }
	.bbs_gallist ul li.cell { max-width:none; width:100%; }
	.bbs_gallist ul li.cell a { min-height:auto; }
	.bbs_gallist ul li.cell .cell_subject_state { align-items:center; }
	.bbs_gallist ul li.cell .cell_subject_state .cell_subject { width:calc(100% - 45px); height:auto; -webkit-line-clamp:1; padding-right:20px; font-size:1.125rem; }
	.bbs_gallist ul li.cell .cell_subject_state .state { min-width:45px; }
	.bbs_gallist ul li.cell .cell_subject_state .state span { width:45px; height:45px; font-size:0.8rem; }
	.bbs_gallist ul li.cell .cell_case { margin-top:10px; font-size:1rem; }
	.bbs_gallist ul li.cell .cell_cate { margin:10px 0; }
	.bbs_gallist ul li.cell .cell_cate span { font-size:1rem; }
}
@media (max-width:486px) {
	.top_info_box { border-radius:10px; }
	.view_type_btn a { border-radius:10px; }
	.view_type_btn a::before { width:15px; height:15px; background-size:15px auto; }
	.bbs_gallist ul li.cell a { padding:20px; border-radius:10px; }
	.bbs_gallist ul li.cell a::before,
	.bbs_gallist ul li.cell a::after { border-radius:10px; }
}
@media (max-width:420px) {
	.top_info_box { padding:15px; }
}

/* view */
.bbs_view .bbs_cate { display:none; }