/*********** List *************/
.photo_list{display: flex; flex-wrap:wrap;}
.photo_list dl{position:relative; margin: 30px 30px 0 0; width: calc((100% - 90px)/4);}
.photo_list dl:nth-of-type(-n+4){margin-top: 0;}
.photo_list dl:nth-child(4n){margin-right: 0;}
.photo_list dl .checkbox{display:inline-block; position: absolute; left:10px; top:10px; z-index:2;}
.photo_list dl a{display: block;}
.photo_list dl dt {overflow: hidden; aspect-ratio: 3 / 3;}
.photo_list dl dt span {padding:16px 10px; box-sizing:border-box; position:absolute; top:20px; right:20px; z-index:10; display:flex; flex-wrap:wrap; align-items:center; justify-content:Center; text-align:Center; font-size:12px; color:rgba(255,255,255,0.5); font-weight: 500; line-height: 100%; /* 12px */ letter-spacing: 0.24px; background:rgba(25,33,45,0.85); border-radius:100%;}
.photo_list dl dt span b {color:var(--white); font-weight:700; line-height:inherit; font-size: 1.125rem; display:block; width:100%; margin:5px 0 0;}
.photo_list dl dt img{width: 100%;  display: block; width: 100%; height: 100%; object-fit: cover; transition:all .3s linear;}
.photo_list dl:hover dt img{transform:scale(1.1);}
.photo_list dl dd {}
.photo_list dl dd h4 {font-size: 1.125rem;  font-weight: 300; letter-spacing: -0.54px; color:var(--black); text-align:center; margin:15px 0 0;}


/*********** View *************/
.subTop_tit {color: var(--black);  font-size: 5.375rem; font-style: normal; font-weight: 500; line-height: 100%; margin:0 0 70px;}
/* .bbs_view{border-top:2px solid var(--black);} */
	.bbsView_tit {border-bottom:1px solid var(--border); padding:0 100px 35px 0; box-sizing:border-box; position: relative;}
	.bbsView_tit .subject {color: var(--black); font-size: 2.375rem; font-weight: 300; line-height: 120%; letter-spacing: -0.071rem;}
	.bbsView_tit p.eng {font-size: 1.562rem; font-weight: 500; line-height: 115%; color:var(--sub); margin:0 0 18px;}


	.bbsView_tit .count{font-size:1rem; color:var(--basic); line-height:120%; position:absolute; right:20px; bottom:45px;}
	.bbsView_tit .count span{display:inline-block; vertical-align:middle; margin:-2px 6px 0 0; color:var(--black);}
	.view_content{padding:35px 0; box-sizing:border-box;}
	.view_content img{max-width:100%; height:auto !important;}

	.view_file{margin:30px 0 0; box-sizing:border-box; background:var(--grayBg); display:flex;}	
	.view_file .btit{width:170px; padding:20px; font-size:1rem; letter-spacing:-0.35pt; line-height: 120%; color:var(--black); box-sizing:border-box; position: relative;}	
	.view_file .bstxt{width:calc(100% - 170px); padding:20px; font-size:1rem; letter-spacing:-0.35pt; line-height: 120%; box-sizing:border-box;}	
	.view_file .bstxt a{display:inline-block; font-size:1rem; letter-spacing:-0.25pt; line-height:150%; color:var(--black); border-bottom:1px solid var(--black); margin: 0 0 5px;}
	.view_file .bstxt a:last-child{margin: 0;}
	.view_file .bstxt .file{display: inline-block; vertical-align: middle; margin-left: -5px; font-size:1rem; color:var(--black);}	

	/*.bbs_bottom{border-top:1px solid var(--border); display:flex;}
	.bbs_bottom.last{border-bottom:1px solid var(--border);}
	.bbs_bottom dt{width:170px; padding:20px; font-size:1rem; letter-spacing:-0.35pt; line-height: 120%; color:var(--black); box-sizing:border-box; position: relative;}
	.bbs_bottom dt .arrow{color:var(--black); opacity:0.5; position:absolute; right:0; top:50%; transform:translateY(-50%);}
	.bbs_bottom dd{width:calc(100% - 170px); padding:20px; font-size:1rem; letter-spacing:-0.35pt; line-height: 120%; box-sizing:border-box;}
	.bbs_bottom dd a{text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal !important; display: block;}*/


.recom_list {display:flex; flex-wrap:wrap; margin:42px 0 0;}
.recom_list dl {width:calc((100% - 60px) / 3); margin-right:30px; margin-top:45px;}
.recom_list dl:nth-of-type(-n+3) {margin-top:0;}
.recom_list dl:nth-of-type(3n) {margin-right:0;}
.recom_list dl dt {position:relative; overflow: hidden; aspect-ratio:3 / 1.9257; background:var(--sub);}
.recom_list dl dt .cate {padding:8px 15px; box-sizing:border-box; background:rgba(25,33,45,0.3); border-radius:50px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; font-size: 13px; font-style: normal; font-weight: 600; line-height: 100%; letter-spacing: -0.26px; position:absolute; top:15px; right:15px; z-index:10; color:Var(--white); transition:all 0.5s ease;}
.recom_list dl dt img {display: block; width: 100%; height: 100%; object-fit: cover; transition:all .5s ease;}
.recom_list dl dd {}
.recom_list dl dd h4 {font-size: var(--fs18); font-weight: 500; letter-spacing: -0.034rem; color:var(--black); margin:15px 0 0;}
.recom_list dl dd p {color: var(--LightFont); font-size:0.875rem;}
.recom_list dl dd p span {display:inline-block; margin-right:3px; color:inherit; font-size:inherit; }


.recom_list dl:hover dt img {transform:scale(1.1); transition:all 0.5s ease; opacity:0.7;}
.recom_list dl:hover dt .cate {background:var(--main); transition:all 0.5s ease;}






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



}

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




}

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


.photo_list dl{position:relative; margin: 20px 15px 0 0; width: calc((100% - 30px)/3);}
.photo_list dl:nth-of-type(-n+4){margin-top: 20px;}
.photo_list dl:nth-child(4n){margin-right: 15px;}

.photo_list dl:nth-of-type(-n+3){margin-top: 0;}
.photo_list dl:nth-child(3n){margin-right: 0;}
.photo_list dl dt span {font-size:10px;}
.photo_list dl dt span b {font-size:1.1rem;}


.subTop_tit {font-size:3.6rem; margin:0 0 50px;}
.bbsView_tit {padding:0 80px 30px 0;}
.bbsView_tit p.eng {font-size:1.3rem;}
.bbsView_tit .subject {font-size:2rem;}
.bbsView_tit .count {bottom:33px;}


.recom_list dl {width:calc((100% - 30px) / 3); margin-right:15px; margin-top:35px;}

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

.photo_list dl{margin: 15px 10px 0 0; width: calc((100% - 10px)/2);}
.photo_list dl:nth-of-type(-n+4){margin-top: 15px;}
.photo_list dl:nth-child(4n){margin-right: 10px;}

.photo_list dl:nth-of-type(-n+3){margin-top: 15px;}
.photo_list dl:nth-child(3n){margin-right: 10px;}

.photo_list dl:nth-of-type(-n+2){margin-top: 0;}
.photo_list dl:nth-child(2n){margin-right: 0;}

.photo_list dl dt span {font-size:10px; padding:13px 8px; top:15px; right:15px;}
.photo_list dl dt span b {font-size:1.1rem;}
.photo_list dl dd h4 {font-size:1.1rem; margin:12px 0 0;}


.subTop_tit {font-size:2.6rem; margin:0 0 35px;}
.bbsView_tit {padding:0 80px 22px 0;}
.bbsView_tit p.eng {font-size:1.1rem; margin:0 0 10px;}
.bbsView_tit .subject {font-size:1.5rem;}
.bbsView_tit .count {bottom:25px;}
.bbsView_tit .count span {font-size:18px; margin:0px 2px 0 0;}
.view_content {padding:20px 0;}

.recom_list dl {width:100%; margin-right:0; margin-top:25px !important;}
.recom_list dl:first-of-type {margin-top:0 !important;}
.recom_list dl dt .cate {padding:6px 12px; font-size:12px;}




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


.photo_list dl {margin: 15px 0 0 0 !important; width:100%;}
.photo_list dl:first-of-type {margin-top:0 !important;}

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




}