@charset "utf-8";

/* 포트폴리오 관리 */

.info-detail .category-wrap { float: left; width: 300px; margin-right:20px; }
.info-detail .detail-wrap { float: left; width: calc(100% - 320px); }


.info-detail .category-wrap .title { width: 100%; padding: 15px 0; font-size: 1.4rem; font-weight: 600; color: #333; text-align: center; background: #272a3b;color:#fff;border-top: 1px solid #999;}
.info-detail .category-wrap .category .wrap { position: relative; height: 600px; overflow-y: auto; background: #fff; border: 1px solid #dee3eb; border-top: 0; padding-bottom: 70px;}
.info-detail .category-wrap .category .wrap > ul { position: relative;}
.info-detail .category-wrap .category .wrap > ul > li > a { position: relative; display: block; padding: 10px 15px; padding-right: 30px; font-size: 1.3rem; font-weight: 500; border-bottom: 1px solid #f1f1f1;}
.info-detail .category-wrap .category .wrap > ul > li > a i { position: absolute; top:12px; right: 15px; color: #555 }
.info-detail .category-wrap .category .wrap > ul > li:hover a.li-a,
.info-detail .category-wrap .category .wrap > ul > li.select a.li-a { background: #e2e3ef; }
.info-detail .category-wrap .category .btn-wrap.add-btn {display: inline-block; margin-top: 0; position: relative; top: 11px;}
.info-detail .category-wrap .category .btn-wrap.add-btn .small-btn { height: 28px; line-height: 28px; padding: 0 17px; }
.info-detail .category-wrap .category .btn-foot {background: #fff; margin: 0; padding: 10px; height: 50px; border: 1px solid #dee3eb; border-top: 0;}
.info-detail .category-wrap .category .wrap > ul > li.add {padding: 0 15px 10px; border-bottom: 1px solid #f1f1f1;}

.info-detail .portfolio-list ul li {display: inline-block;}
.info-detail .portfolio-list .selectbox {width: 100%;}

.info-detail .portfolio-title {position: relative; margin-top: 30px;}
.info-detail .portfolio-title .portfolio-add {position: absolute; top:-7px; right: 0; margin: 0;}

.info-detail .portfolio-detail { position: relative; margin-top: 30px;}
.info-detail .portfolio-detail .left {float: left; width: 350px; margin-right: 20px; }
.info-detail .portfolio-detail .right {float: left; width: calc(100% - 370px);}
.info-detail .portfolio-detail .popup-img-table.img-input-table .row .btn-area { width: 100%; border: 0; padding-bottom: 0; }
.info-detail .portfolio-detail .popup-img-table.img-input-table .row .btn-area .file-modify { margin: 0; }
.info-detail .portfolio-detail .popup-img-table.img-input-table .row .preview-area {width: 100%;}
.info-detail .portfolio-detail .popup-img-table.img-input-table .row .preview-area .thumbnail {width: 100%;}
.info-detail .portfolio-detail .info-table {margin-bottom: 20px;}
.info-detail .portfolio-detail .info-table:first-child {margin-top: 0;}
.info-detail .portfolio-detail .info-table table tr th {width: 100px; text-align: center;}
.info-detail .portfolio-detail .popup-img-table.img-input-table.banner-img-table { border: 0; }
.info-detail .portfolio-detail .popup-img-table.img-input-table.banner-img-table .row { padding: 0; margin: 0; border: 0; }
.info-detail .portfolio-detail .popup-img-table.img-input-table.main-img-table {border: 0;}
.info-detail .portfolio-detail .popup-img-table.img-input-table.main-img-table .row { padding: 0; margin: 0; border: 0; }
.info-detail .portfolio-detail .popup-img-table.img-input-table.main-img-table .row .thumbnail { height: 600px; }

p.exc {margin-top: 2px; font-size: 11px; color: #da3535;}




/* 스크롤 스타일 변경 */
::-webkit-scrollbar {
  width: 5px;  /* 세로축 스크롤바 길이 */
  height: 5px;  /* 가로축 스크롤바 길이 */
}
::-webkit-scrollbar-track {
  background-color: lightblue;
}
::-webkit-scrollbar-track-piece {
  background-color: #eee;
}
::-webkit-scrollbar-thumb {
  border-radius: 8px;
  background-color: #ccc;
}
::-webkit-scrollbar-button {
  background-color: #eee;
  width: 5px;
  height: 5px;
}
::-webkit-scrollbar-button:start {
  background-color: #eee; /* Top, Left 방향의 이동버튼 */
  border-radius: 5px 5px 0 0;
}
::-webkit-scrollbar-button:end {
  background-color: #eee; /* Bottom, Right 방향의 이동버튼 */
  border-radius: 0 0 5px 5px;
}