


/*********** List *************/
.photo_list{display: flex; flex-wrap:wrap; gap:30px; max-width:100%;}
.photo_list .list{position:relative; width: calc((100% - 90px)/4); box-sizing:border-box; border:1px solid var(--border); border-radius:var(--borderR20); overflow: hidden;}
.photo_list .list .checkbox{display:inline-block; position: absolute; left:5px; top:5px; z-index:3;}
.photo_list .list a{display: block; position: relative; z-index: 2;	}
.photo_list .list a::after{content:''; display: block; width: 100%; height: 100%;  box-sizing:border-box; border:5px solid var(--main); position: absolute; left:0; top:0; border-radius:var(--borderR20); transition:all .3s; opacity: 0;}
.photo_list .list a:hover::after{opacity: 1; transition:all .3s linear;}
.photo_list .list a .thumb{aspect-ratio:1/1; overflow: hidden;}
.photo_list .list a .thumb img{display: block; width: 100%; height: 100%; object-fit:cover; transition:all .3s;}
.photo_list .list a .desc{padding: 30px 35px; box-sizing:border-box; transition:all .3s;}
.photo_list .list a .desc .category{margin: 0 0 5px; font-size:0.789rem; line-height: 120%; font-weight: 600; color:var(--main); text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal !important; display: block; transition:all .3s;}
.photo_list .list a .desc h4{color:var(--black); font-weight: 600; line-height: 1.6em; height: 3.2em; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; transition:all .3s;}
.photo_list .list a .desc .text_box{margin: 15px 0 0; line-height: 1.6em; height: 3.2em; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; transition:all .3s;}
.photo_list .list a .desc .date{margin: 30px 0 0; display: block; font-size:0.789rem; line-height: 130%; letter-spacing: 0; color:var(--basic); opacity: 0.6; transition:all .3s;}
.photo_list .list a .desc .date::before{content:'\e8b5'; display: inline-block; vertical-align: middle; margin: -2px 6px 0 0; font-size:18px; color:inherit; font-weight: 400; font-family:var(--icon);}

.photo_list .list a:hover .thumb img{transform:scale(1.1); transition:all .3s linear;}
.photo_list .list a:hover .desc{background:rgba(0,116,161,.9); transition:all .3s linear;}
.photo_list .list a:hover .desc .category{color:var(--white); transition:all .3s linear;}
.photo_list .list a:hover .desc h4{color:var(--white); transition:all .3s linear;}
.photo_list .list a:hover .desc h4 a{color:var(--white); transition:all .3s linear;}
.photo_list .list a:hover .desc .text_box{color:rgba(255,255,255,.6); transition:all .3s linear;}
.photo_list .list a:hover .desc .date{color:rgba(255,255,255,.6); transition:all .3s linear;}


/*********** View *************/
.bbs_view{border-top:3px solid var(--main);}
	.bbsView_tit{border-bottom:1px solid var(--border); padding:30px 100px 30px 20px; box-sizing:border-box; position: relative;}

	.bbsView_tit .subject{font-size:31px; letter-spacing:var(--letter-spacing-heading); line-height:130%; font-weight:700; color:var(--black);}
	.bbsView_tit .subject span{display:inline-block; margin-right: 5px; letter-spacing:inherit; font-weight:400;}
	
	.bbsView_tit .view_detail{margin:10px 0 0; display:flex; align-items:center; gap:0 40px;}
	.bbsView_tit .view_detail li{font-size:0.895rem; color:var(--basic); line-height:150%; position:relative;}
	.bbsView_tit .view_detail li::before{content:''; display:block; width:1px; height:12px; background:var(--border); position:absolute; left:-20px; top:50%; margin-top:-6px;}
	.bbsView_tit .view_detail li:first-child::before{display:none;}
	.bbsView_tit .view_detail li.count_txt{display: none;}
	.bbsView_tit .count{font-size:0.895rem; color:var(--basic); line-height:120%; position:absolute; right:20px; top:50%; transform:translateY(-50%);}
	.bbsView_tit .count::before{content:'\e8f4'; display: inline-block; vertical-align: middle; font-size:24px; margin: 0 6px 0 0; color:var(--black); font-weight: 400; font-family:var(--icon);}
	
	
	/* ÅÂ±× */
	.tags{box-sizing:border-box; border-bottom: 1px solid var(--border); padding:20px; display: flex;}
	.tags dt{width: 65px; text-align:center; font-size:0.789rem; font-weight: 700; color:var(--main); border-radius:var(--borderR5); background:rgba(0,116,161,.1); font-family:var(--eng); display: flex; flex-direction: column; justify-content: center; align-items: center;}
	.tags dd{width: calc(100% - 65px); padding: 0 0 0 15px; box-sizing:border-box;}

	.tags_list{display: flex; flex-wrap:wrap; gap:5px 10px;}
	.tags_list li{font-size:0.895rem; line-height: 150%; cursor:pointer; transition:all .3s;}  
	.tags_list li:hover{color:var(--black);}


	.view_content{padding:30px 0; box-sizing:border-box;}
	.view_content img{max-width:100%; height:auto !important;}

	.view_file{margin:30px 0 0; padding:20px; box-sizing:border-box; background:var(--grayBg); display:flex;}	
	.view_file .btit{width:120px; font-size:1rem; font-weight: 600; letter-spacing:var(--letter-spacing-body); line-height: 120%; color:var(--black); box-sizing:border-box; position: relative;}	
	.view_file .bstxt{width:calc(100% - 120px); font-size:1rem; letter-spacing:var(--letter-spacing-body); line-height: 120%; box-sizing:border-box;}	
	.view_file .bstxt a{display:inline-block; font-size:0.895rem; letter-spacing:var(--letter-spacing-body); line-height:150%; color:var(--black); text-decoration:underline; margin: 5px 0 0;}
	.view_file .bstxt a:first-child{margin: 0;}
	.view_file .bstxt a::before{content:'\e226'; display: inline-block; vertical-align: middle; font-size:20px; margin: 0; color:var(--black); font-weight: 400; font-family:var(--icon);}
	
	
	.bbs_bottom{border-top:1px solid var(--border); display:flex;}
	.bbs_bottom.next{border-bottom:1px solid var(--border);}
	.bbs_bottom dt{width:160px;  padding:20px 0 20px 20px; font-size:1rem; letter-spacing:var(--letter-spacing-body); line-height: 120%; color:var(--black); box-sizing:border-box; position: relative;}
	.bbs_bottom dt::after{content:'\e316'; display: block; width: 24px; height: 24px; line-height: 24px; font-size:24px; font-family:var(--icon); position: absolute; right:0; top:50%; margin-top: -12px;}
	.bbs_bottom.next dt::after{transform:rotate(180deg);}
	.bbs_bottom dd{width:calc(100% - 160px); padding:20px; font-size:1rem; letter-spacing:var(--letter-spacing-body); line-height: 120%; box-sizing:border-box;}
	.bbs_bottom dd a{line-height:inherit; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal !important; display: block;} 



.align_right{}
.align_right .btn_w{border-radius:50px;}



/*******************************************************************************
    @media 1680px
*******************************************************************************/
@media all and (max-width:1680px){



}

/*******************************************************************************
    @media 1300px
*******************************************************************************/
@media all and (max-width:1300px){


/*********** List *************/
.photo_list .list{width: calc((100% - 60px)/3);}
.photo_list .list a .desc{padding: 20px 25px;}
.photo_list .list a .desc .text_box{margin: 10px 0 0;}
.photo_list .list a .desc .date{margin: 20px 0 0;}



}

/*******************************************************************************
    @media  ~980px              
*******************************************************************************/
@media all and (max-width:980px){



/*********** List *************/
.photo_list{gap:20px; }
.photo_list .list{width: calc((100% - 20px)/2);}
.photo_list .list a .desc .category{margin: 0 0 3px;}
.photo_list .list a .desc .text_box{margin: 6px 0 0;}
.photo_list .list a .desc .date{margin: 15px 0 0;}



/*********** View *************/
	.bbsView_tit{padding:20px 15px;}
	.bbsView_tit .subject{font-size:26px;}
	.bbsView_tit .view_detail{gap:0 30px;}
	.bbsView_tit .view_detail li::before{height:12px; left:-15px; margin-top:-6px;}
	.bbsView_tit .view_detail li.count_txt{display: flex; flex-direction: row-reverse;}
	.bbsView_tit .view_detail li.count_txt::after{content:'\e8f4'; display: inline-block; vertical-align: middle; font-size:20px; margin: 0 6px 0 0; color:var(--black); font-weight: 400; font-family:var(--icon);}
	.bbsView_tit .count{display: none;}
	
	


}
/*******************************************************************************
    @media 481~680px
*******************************************************************************/
@media all and (max-width:680px){

/*********** List *************/
.photo_list{}
.photo_list .list{width: 100%; border-radius:var(--borderR10);}
.photo_list .list a::after{border-width:3px; border-radius:var(--borderR10);}
.photo_list .list a .desc{padding: 20px;}
.photo_list .list a .desc .date{margin: 10px 0 0;}
.photo_list .list a .desc .date::before{margin: 0 4px 0 0; font-size:16px;}



/*********** View *************/
.bbs_view{border-width:2px;}
	.bbsView_tit{padding:15px 10px;}

	.bbsView_tit .subject{font-size:21px;}
	
	.bbsView_tit .view_detail{margin:8px 0 0; gap:0 20px;}
	.bbsView_tit .view_detail li::before{height:10px; left:-10px; margin-top:-5px;}
	.bbsView_tit .view_detail li.count_txt::after{font-size:16px; margin: 0 4px 0 0;}
	
	
	/* ÅÂ±× */
	.tags{padding:15px 10px;}
	.tags dt{width: 50px;}
	.tags dd{width: calc(100% - 50px); padding: 0 0 0 10px;}

	.tags_list{gap:5px 10px;}
	.tags_list li{}  

	.view_content{padding:20px 0;}

	.view_file{margin:20px 0 0; padding:15px; flex-wrap:wrap;}	
	.view_file .btit{width:100%; padding: 0 0 10px;}	
	.view_file .bstxt{width:100%;}	
	.view_file .bstxt a::before{font-size:16px; margin: -2px 0 0;}

	.bbs_bottom{}
	.bbs_bottom dt{width:100px; padding:15px 0 15px 15px;}
	.bbs_bottom dt::after{width: 20px; height: 20px; line-height: 20px; font-size:20px; margin-top: -10px;}
	.bbs_bottom dd{width:calc(100% - 100px); padding:15px;} 


}