ul.photo>li, ul.photo>li span>b{
  -webkit-transition: all 0.3s ease-out;
	   -moz-transition: all 0.3s ease-out;
	     -o-transition: all 0.3s ease-out;
	        transition: all 0.3s ease-out;
}

ul.photo{
  display:inline-block;
  width:100%;
  text-align:left;
}
ul.photo>li{
  display:inline-block;
  width:275px;
  height:250px;
  margin-top:30px;
  margin-right:30px;
  border:1px solid #e1e1e1;
  box-sizing: border-box;
  vertical-align:top;
}
ul.photo>li:nth-child(4n){
  margin-right:0;
}
ul.photo>li:hover{
  border:1px solid #99999b;
}
ul.photo>li>a{
  display:inline-block;
  width:100%;
  height:100%;
  padding:10px;
  box-sizing: border-box;
}
ul.photo>li span, ul.photo>li strong{
  display:inline-block;
  width:100%;
}
ul.photo>li span{
  position:relative;
  height:200px;
  overflow:hidden;

}
ul.photo>li:hover span{
  border:none;
}
ul.photo>li span>b{
  display:inline-block;
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background-color:#000;
  z-index:3;
  opacity:0.0;
}
ul.photo>li:hover span>b{
  opacity:0.4;
}
/*ul.photo>li span>img{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
}*/

ul.photo>li span>img.lhimg{
  position:absolute;
  top:0;
  left:50%;
  width:280px;
  max-width:none;
  height:auto;
  z-index:1;
  -webkit-transform: translate(-50%,0);
  -ms-transform: translate(-50%,0);
  transform: translate(-50%,0);
  backface-visibility: hidden;
}
ul.photo>li:hover span>img.lhimg{
  transform:translate(-50%,0) scale(1.1) ;
  -webkit-transform:translate(-50%,0) scale(1.1) ;
  -moz-transform:translate(-50%,0) scale(1.1) ;
  -o-transform:translate(-50%,0) scale(1.1);
 transition: transform 0.2s linear;
  -webkit-transition:-webkit-transform 0.2s linear;
  -moz-transition:-moz-transform 0.2s linear;
  -o-transition:-o-transform 0.2s linear;
}
ul.photo>li span>img.lwimg{
  position:absolute;
  top:50%;
  left:50%;
  max-height:250px;
  max-width:none;
  height:auto;
  z-index:1;
  -webkit-transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  backface-visibility: hidden;

}
ul.photo>li:hover span>img.lwimg{
  transform:translate(-50%,-50%) scale(1.1);
  -webkit-transform:translate(-50%,-50%) scale(1.1) ;
  -moz-transform: translate(-50%,-50%) scale(1.1);
  -o-transform:translate(-50%,-50%) scale(1.1) ;
  transition: transform 0.2s linear;
  -webkit-transition:-webkit-transform 0.2s linear;
  -moz-transition:-moz-transform 0.2s linear;
  -o-transition:-o-transform 0.2s linear;
}
ul.photo>li strong{
  margin-top:3px;
  height:20px;
  font-size:1.05rem;
  font-weight:400;
  color:#666;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}


@media only screen and (max-width : 960px){
  ul.photo{
    display:inline-block;
    width:580px;
    text-align:left;
  }
  ul.photo>li{
    margin-left:5px;
    margin-right:5px;
  }
}
.view{
  display:inline-block;
  width:100%;
  border-top:1px solid #bbb;
}
/*.view>li{
  display:inline-block;
  width:100%;
  padding-top:10px;
  padding-bottom:10px;
  border-bottom:1px solid #e1e1e1;
}*/
@media only screen and (max-width : 610px){
  ul.photo{
    display:inline-block;
    width:300px;
    text-align:left;
  }
  ul.photo>li{
    width:100%;
    margin-left:0;
    margin-right:0;
  }
}


/*페이지*/
.pagination {
  min-width:300px;
  width:100%;
  margin-top:50px;
  text-align: center;
}
.pagination>a{
  display: inline-block;
  width:30px;
  height:30px;
  font-size: 0.6rem;
  line-height:30px;
  border:1px solid #e1e1e1;
  box-sizing: border-box;
}
.pagination>a:hover{
  border:1px solid #333;
  background-color:#333;
  color:#fff;
}
.pagination>ul{
  display: inline-block;
  width:200px;
  vertical-align:top;
}
.pagination>ul>li{
  display: inline-block;
  width:30px !important;
  height:30px !important;
  margin-bottom:0 !important;
  margin-left: 2px;
  border:1px solid #e1e1e1;
  box-sizing: border-box;
  vertical-align:top;
}
.pagination>ul>li:first-child{
  margin:0;
}
.pagination>ul>li>a{
  display:inline-block;
  width:100%;
  height:100%;
  line-height:26px;
  color:#555;
  font-size: 0.9rem
}
.pagination>ul>li:hover, .pagination>ul>li:hover>a, .pagination>ul>li.active, .pagination>ul>li.active>a{
  background-color:#333;
  border:1px solid #333;
  color:#fff;
}




/*일반리스트*/
.txtL{text-align:left !important;}  .txtC{text-align:center !important;}  .txtR{text-align:right !important;}
caption{font-size:0;line-height:0;display:none;}
.board{width:100%;}
.board table.bList{width:100%;}
.board table.bList thead tr th{padding-top:18px;padding-bottom:18px;font-size:15px;line-height:18px;}
.board table.bList tbody tr td{padding-top:18px;padding-bottom:18px;padding-left:5px;font-size:15px;line-height:18px;text-align:left;color:#555;}
.board table.bList tbody tr td span.notice{}

.board.gray table.bList{border-top:2px solid #333}
.board.gray table.bList thead, .board.gray table.list thead tr{width:100%;}
.board.gray table.bList thead tr th{border-bottom:1px solid #99999b;text-align: center;}
.board.gray table.bList tbody tr td{border-bottom:1px solid #dddddd;text-align: center;}
.board.gray table.bList .name{width:90px !important;}
.board.gray table.bList .number{width:70px !important;}
.board.gray table.bList .date{width:180px !important;}
.board.gray table.bList .hits{width:50px !important;}
.board.gray table.bList .file{width:50px !important;}
.board.gray  .notice{display:inline-block;padding-left:10px;padding-right:10px;margin-right:5px;font-size:13px;line-height:20px;background-color:#072444;color:#fff;}
.board.gray  .icon{display:inline-block;padding-left:10px;padding-right:10px;margin-right:5px;font-size:13px;line-height:20px;color:#aaa;border:1px solid #dddddd;}

/*검색*/
.board>.boardSelect{position:relative;float:right;width:370px;height:auto;padding-bottom:10px;padding-left:105px;padding-right:65px;box-sizing:border-box;}
.board>.boardSelect .searchGb{position:absolute;top:0;left:0;width:100px;height:36px;line-height:36px;border-radius:0;background-color:#fff;border:1px solid #d9d9d9}
.board>.boardSelect input[type=text]{width:100%;height:36px;box-sizing:border-box;border:1px solid #d9d9d9;}
.board>.boardSelect input[type=button]{position:absolute;top:0;right:0;width:60px;height:36px;font-size:1rem;line-height:36px;color:#fff;background-color:#575757;border-radius:0 !important;border:none;}

/*글보기*/
.board table.view{width:100%;}
.board table.view thead tr th{width:100px;padding-top:18px;padding-bottom:18px;font-size:1.3rem;line-height:22px;font-weight:500;}
.board table.view thead tr td{padding-top:10px;padding-bottom:10px;font-size:14px;line-height:18px;border-bottom:1px solid #99999b;}
.board table.view tbody tr td{padding-top:14px;padding-bottom:14px;padding-left:5px;font-size:14px;line-height:18px;text-align:center;}
.board.gray table.view{width:100%;border-top:2px solid #333}
.board.gray table.view thead, .board.gray table.view tbody, .board.gray table.view tfoot{width:100%;}
.board.gray table.view thead tr{width:100%;}
.board.gray table.view strong.title{display:inline-block;width:150px;text-align:center;}
.board.gray table.view thead tr th, .board.gray table.write thead tr td{border-bottom:1px solid #99999b;}
.board.gray table.view thead tr th{text-align: center;}
.board.gray table.view thead tr td{text-align: left;}
.board.gray table.view tbody tr>a{display:inline-block;width:100%;height:100%;}
.board.gray table.view tbody tr td{width:100%;border-bottom:1px solid #959a9e}
.board.gray table.view thead tr td>input[type=text], .board.gray table.write thead tr td>input[type=password]{width:200px;}
.board.gray table.view thead tr td>input[type=text].title{width:100% !important}
.board.gray table.view .w100{width:100% !important;}
.board.gray table.view  .option{text-align:left;}

@media only screen and (max-width : 640px){
  .board.gray table.view strong.title{width:100%;}
  .board.gray table.view  .option{text-align:center;}
  .board.gray table.bList .number{width:50px !important}
  .board.gray table.bList .date{width:100px !important;}
}


/**/
.board ul.view{
  width:100%;
  border-top:2px solid #333
}
.board ul.view>li{
  width:100%;
  padding-top:20px;
  padding-bottom:20px;
  font-size:1.15rem;
  line-height:1.5rem;
  text-align:left;
  border-bottom:1px solid #99999b;
}
.board ul.view>li:first-child{
  padding-top:0;
  padding-bottom:0;
}
.board ul.view>li>b.title{
  display:inline-block;
  width:100%;
  padding-top:18px;
  padding-bottom:18px;
  font-size:1.3rem;
  line-height:22px;
  font-weight:500;
  text-align:center;
}
.board ul.view>li.flie>strong.title{
  display:inline-block;
  width:110px;
  font-size:1.3rem;
  line-height:35px;
  font-weight:500;
  text-align:center;
  vertical-align:top;
}
.board ul.view>li.cont>div{
}
@media only screen and (max-width :960px) {
  .board ul.view>li.flie{
    text-align:center;
  }
  .board ul.view>li.flie>strong.title{
    width:100%;
  }
}
/*글쓰기*/
.board table.write{width:100%;}
.board table.write thead tr th{width:100px;padding-top:18px;padding-bottom:18px;font-size:1.1rem;line-height:22px;font-weight:400;}
.board table.write thead tr td{padding-top:10px;padding-bottom:10px;font-size:14px;line-height:18px;}
.board table.write tbody tr td{padding-top:14px;padding-bottom:14px;padding-left:5px;font-size:14px;line-height:18px;text-align:center;}
.board.gray table.write{border-top:2px solid #333}
.board.gray table.write thead tr th, .board.gray table.write thead tr td{border-bottom:1px solid #99999b;}
.board.gray table.write thead tr th{text-align: center;}
.board.gray table.write thead tr td{text-align: left;}
.board.gray table.write tbody tr>a{display:inline-block;width:100%;height:100%;}
.board.gray table.write tbody tr td{border-bottom:1px solid #959a9e}
.board.gray table.write thead tr td>input[type=text], .board.gray table.write thead tr td>input[type=password]{width:200px;}
.board.gray table.write thead tr td>input[type=text].title{width:100% !important}
.board.gray table.write thead tr td>span.txt{display:inline-block;font-size:13px;line-height:26px;}
.board.gray table.write thead tr td>span.explain{display:inline-block;width:200px;padding-left:10px;font-size:13px;line-height:26px;color:#666;}
.boardCont{width:100%;min-height:350px;font-size:1.1rem;line-height:24px;color:#555;}
/*업로드*/
.board p.upload{position:relative;display:inline-block;width:300px;padding-right:62px;box-sizing:border-box;}
.board p.upload>strong.file{position:relative;display:inline-block;width:100%;padding-right:62px;box-sizing:border-box;}
.board p.upload>strong.file span.button{position:absolute;top:0;right:0;display:inline-block;width:62px;font-size:13px;line-height:30px;text-align:center;font-weight:400;color:#fff;background-color:#666;}
.board p.upload input[type=text]{width:100% !important;}
.board p.upload input[type=file]{position:absolute;top:0;left:0;height:30px;}
.board p.upload input[type=button]{position:absolute;top:0;right:0;width:60px;height:30px;line-height:30px;color:#fff;background-color:#000;border:none;}
.uploadList{display:inline-block;width:300px;}
.uploadList li{position:relative;width:100%;height:20px;padding-right:30px;margin-bottom:3px;box-sizing:border-box;}
.uploadList li>.text{display:inline-block;width:100%;height:35px;font-size:13px;line-height:35px;color:#555;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;}
.uploadList li>input[type=button]{position:absolute;top:0;right:0;width:18px;height:18px;font-size:.7rem;color:#333;text-align:center;border:1px solid #959a9e;box-sizing:border-box;}
.uploadList a.link:hover{text-decoration:underline}
@media only screen and (max-width : 540px){
  .uploadList{width:100%;}
  .uploadList li{padding-right:0;}
}
/*글삭제*/
.boardDelete{text-align:center;padding-top:10px;padding-bottom:15px;border-bottom:1px solid #959a9e}
.boardDelete strong{display:inline-block;width:100%;text-align:center;font-size:1.1rem;font-weight:500;}
.boardDelete span{display:inline-block;width:200px;padding-top:10px;}


@media only screen and (max-width :1024px) {

    /*리스트*/
    .board{min-width:300px;width:100%;}
    .btnBox{min-width:300px;width:100%;}
    .board table.list thead tr th{padding-top:10px;padding-bottom:10px;font-size:13px;line-height:18px;}
    .board table.list tbody tr td{padding-top:10px;padding-bottom:10px;padding-left:5px;font-size:13px;line-height:18px;text-align:center;}



    /*갤러리*/
    .gallery>ul li{width:100%;margin-left:0;}


}
@media only screen and (max-width :640px){
  /*검색*/
  .board>.boardSelect{width:100%;padding-left:105px;padding-right:65px;}
  .board>.boardSelect select{position:relative;width:100%;margin-bottom:5px;}
  .board>.boardSelect input{margin-bottom:5px;}
  .board>.boardSelect button{position:relative;width:100%;}
}


/*이전 글, 다음 글*/
ul.moreList{
  position:relative;
  width:100%;
  border-bottom:1px solid #959a9e;
}
ul.moreList>li{
  position:relative;
  width:100%;
  height:46px;
  padding-left:120px;

  box-sizing:border-box;
}
ul.moreList>li:nth-child(1){
  border-bottom:1px solid #eee;
}
ul.moreList>li strong{
  position:absolute;
  display:inline-block;
  top:0;
  left:0;
  width:110px;
  height:100%;
  font-size:1.3rem;
  line-height:46px;
  font-weight:500;
  text-align:center;
  background-color:#f9f9f9;
}
ul.moreList>li span{
  display:inline-block;
  width:100%;
  height:100%;
  font-size:1.2rem;
  line-height:46px;
  font-weight:400;
  color:#666;
  text-align:left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.btnBox{
  width:100%;
  padding:50px 0 0 0;
  text-align:center;
}
.btnBox a{
  display:inline-block;
  width:170px;
  height:46px;
  font-size:1.3rem;
  line-height:46px;
  font-weight:300;
  text-align:center;
  vertical-align:top;
}
.btnBox a.ok{
  color:#fff;
  background-color:#666;
}




.trendS{
  margin-bottom:100px;
}
.trendS strong.title{
  display:inline-block;
  position:relative;
  width:100%;
  margin-bottom:40px;
  font-size:2.5rem;
  line-height:2.5rem;
  font-weight:400;
  text-align: center;
}
.trendS strong.title a.more{
  top:8px
}
.trendS ul.list>li{
  width:22.75%;
  margin-left:3%;
  margin-top:30px;
  vertical-align:top;
}
.trendS ul.list>li:nth-child(1), .trendS ul.list>li:nth-child(5){
  margin-left:0;
}
.trendS ul.list>li .img{
  height:270px;
  padding:40px;
  text-align:center;
  background-color:#3c4f8c;
  border-radius:20px;
  vertical-align:top;
  box-sizing: border-box;
}
.trendS ul.list>li:nth-child(1), .trendS ul.list>li:nth-child(2), .trendS ul.list>li:nth-child(3), .trendS ul.list>li:nth-child(4){
  margin-top:0;
}

.trendS ul.list>li:nth-child(3) .img, .trendS ul.list>li:nth-child(4) .img{
  background-color:#da465b;
}
.trendS ul.list>li:nth-child(7) .img, .trendS ul.list>li:nth-child(8) .img{
  background-color:#da465b;
}
.trendS ul.list>li .img>div{
  display:flex;
  position:relative;
  width:100%;
  height:100%;
  border:3px solid rgba(225, 225, 225, 0.6);
  justify-content:top;/*가로 정렬*/
  align-items:center;/*세로 중앙정렬*/
  flex-flow:column;/*요소 세로정렬*/
  box-sizing: border-box;
}
.trendS ul.list>li .img b, .trendS ul.list>li .img strong, .trendS ul.list>li .img span{
  display:inline-block;
  width:100%;
  color:#fff;
  font-weight:400;
  text-align:center;

}
.trendS ul.list>li .img b{
  position:absolute;
  top:10px;
  left:0;
  font-family: 'AppleSDGothicNeoB';
  font-size:0.8rem;
  line-height:0.8rem;
  letter-spacing:-0.01rem;
  font-weight:600;
  text-transform: uppercase;
  z-index:1;
}
.trendS ul.list>li .img strong{
  position:absolute;
  top:50%;
  left:0;
  font-family: 'GmarketSansBold';
  font-size:1.5rem;
  line-height:1.9rem;
  -webkit-transform: translate(0,-50%); -ms-transform: translate(0,-50%); transform: translate(0,-50%);
  z-index:1;
}
.trendS ul.list>li .img span.bg{
  height:100%;
  opacity:0.6;
}
.trendS ul.list>li.element1 .img span.bg{
    background-image: url(../../img/trend1.jpg);
    background-position: top center;
    background-repeat: no-repeat;
    background-size:cover;
}
.trendS ul.list>li.element2 .img span.bg{
  background-image: url(../../img/trend2.jpg);
  background-position: top center;
  background-repeat: no-repeat;
  background-size:cover;
}
.trendS ul.list>li.element3 .img span.bg{
  background-image: url(../../img/trend3.jpg);
  background-position: top center;
  background-repeat: no-repeat;
  background-size:cover;
}
.trendS ul.list>li.element4 .img span.bg{
  background-image: url(../../img/trend4.jpg);
  background-position: top center;
  background-repeat: no-repeat;
  background-size:cover;
}
.trendS ul.list>li .txt{
  margin-top:35px;
}
.trendS ul.list>li .txt>strong, .trendS ul.list>li .txt>p, .trendS ul.list>li .txt>b{
  display:inline-block;
  width:100%;
  font-family: 'AppleSDGothicNeoM';
  text-align: left;
  word-break: keep-all;
}
.trendS ul.list>li .txt>strong{
  margin-bottom:15px;
  font-size:1.25rem;
  line-height:1.5rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.trendS ul.list>li .txt>p{
  margin-bottom:15px;
  font-size:1rem;
  line-height:1.3rem;
  letter-spacing:-0.01rem;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.trendS ul.list>li .txt>b{
  font-size:0.9rem;
  line-height:0.9rem;
  font-weight:400;
}
.trendS ul.list>li:hover .img>div, .trendS ul.list>li.active .img>div{
  border:3px solid rgba(225, 225, 225, 0.3);
  -webkit-transition: all 0.3s ease-out;
	   -moz-transition: all 0.3s ease-out;
	     -o-transition: all 0.3s ease-out;
	        transition: all 0.3s ease-out;
}
.trendS ul.list>li:hover .img span.bg, .trendS ul.list>li.active .img span.bg{
  opacity:0.3;
}
@media only screen and (max-width : 1440px){
  .trendS ul.list>li{
    width:24.25%;
    margin-left:1%;
  }
}
@media only screen and (max-width : 1024px){
  .trendS{
    margin-bottom:80px;
  }
  .trendS .container{
    text-align: center;
  }
  .trendS ul.list{
    width:600px;
    margin: 0 auto;
  }
  .trendS ul.list>li{
    width:47.5%;
    margin-left:5%;
  }
  .trendS ul.list>li:nth-child(1), .trend ul.list>li:nth-child(2){
    margin-bottom:30px;
  }
  .trendS ul.list>li:nth-child(2n-1){
    margin-left:0;
  }
  .trendS ul.list>li .img{
    height:160px;
    padding:20px;
    border-radius:10px;
  }
  .trendS ul.list>li .txt{
    margin-top:20px;
  }
  .trendS ul.list>li .txt>strong, .trendS ul.list>li .txt>p, .trendS ul.list>li .txt>b{
    text-align: center;
  }
  .trendS ul.list>li .img strong{
    font-size:1.3rem;
    line-height:1.3rem;
  }
}
@media only screen and (max-width : 640px){
  .trendS ul.list{
    width:100%;
  }
}
@media only screen and (max-width : 460px){
  .trendS ul.list{
    max-width:270px;
  }
  .trendS ul.list>li{
    width:100%;
    margin-left:0;
    margin-bottom:20px;
  }
  .trendS ul.list>li:nth-child(4){
    margin-bottom:0;
  }
}



/*주요실적*/
.board.gray table.result .number{width:15% !important;}
.board.gray table.result .name{width:42.5% !important;}
@media only screen and (max-width : 1024px){

}
