@charset "utf-8";

/*************************************************************************
* @ 서비스명   : commonui
* @ 파일명     : /public_htm/css/commonui.css
* @ 페이지설명  : commonui.css
* @ 작성자     : 한주현 (pointweb)
* @ 작성일     : 2020-05-08
************************** 수정이력 **************************************
* 날짜                    작업자                  변경내용
* 2020-05-08              한주현                 최초작성
**************************************************************************/

/* 필수항목 체크 */
.necessary{display: inline-block;vertical-align: middle;color:#333;}
/* 게시판 */
.board-search{position:relative;border-radius: 5px;background: #f5f5f5;padding:20px 210px;}
.board-search .input-wrap{width:100%;}
.board-search input[type="text"]{width:100%;height:50px;border-radius: 5px;border: solid 1px #dedede;padding:0 20px;font-size: 18px;font-weight: normal;letter-spacing: -0.45px;background: #fff;}
.board-search input[type="text"]::placeholder{color: #8e8e8e;}
.board-search .btn-group{position:absolute;top:19px;right:60px;display: flex;gap:10px;}
.board-search .btn-group button{display: inline-block;width:50px;height:50px;font-size:0;}
.board-search .btn-group .btn-submit{background: url(/_public/images2/icon/ico_search.svg) no-repeat;background-size: cover;}
.board-search .btn-group .btn-reset{background: url(/_public/images2/icon/ico_reset.svg) no-repeat;background-size: cover;}

.board-search2{position:relative;border-radius: 5px;background: #f5f5f5;padding:20px 210px 20px 60px;}
.board-search2 .input-wrap{width:100%;}
.board-search2 .input-wrap form{display: flex;align-items: center;gap:40px;}
.board-search2 .input-wrap .select-box{display: flex;align-items: center;gap:20px;}
.board-search2 .input-wrap .select-box span{display: inline-block; font-size: 18px;font-weight: 500;letter-spacing: -0.45px;color: #202020;}
.board-search2 .input-wrap .select-box select{width:175px;height:50px; border-radius: 5px;
 border: solid 1px #dedede;background-color: #fff;padding:0 20px;font-size: 18px;font-weight: 500;letter-spacing: -0.45px;color: #202020;}
.board-search2 input[type="text"]{width:100%;height:50px;max-width: calc(100% - 330px);border-radius: 5px;border: solid 1px #dedede;padding:0 20px;font-size: 18px;font-weight: normal;letter-spacing: -0.45px;background: #fff;}
.board-search2 input[type="text"]::placeholder{color: #8e8e8e;}
.board-search2 .btn-group{position:absolute;top:19px;right:60px;display: flex;gap:10px;}
.board-search2 .btn-group button{display: inline-block;width:50px;height:50px;font-size:0;}
.board-search2 .btn-group .btn-submit{background: url(/_public/images2/icon/ico_search.svg) no-repeat;background-size: cover;}
.board-search2 .btn-group .btn-reset{background: url(/_public/images2/icon/ico_reset.svg) no-repeat;background-size: cover;}


.board-search3{position:relative;border-radius: 5px;background: #f5f5f5;padding:20px 210px 20px 60px;}
.board-search3 .input-wrap{width:100%;}
.board-search3 .input-wrap form{display: flex;align-items: center;gap:20px;}
.board-search3 .input-wrap .date-wrap{display: flex;align-items: center;gap:20px;}
.board-search3 .input-wrap .date-wrap span{display: inline-block; font-size: 18px;font-weight: 500;letter-spacing: -0.45px;color: #202020;}
.board-search3 .input-wrap .date-wrap .date-flex{display: flex;gap:8px;align-items: center;font-size: 18px;font-weight: 500;letter-spacing: -0.45px;text-align: center;color: #202020;}
.board-search3 .input-wrap .date-wrap .date-flex .input-date{position: relative;width:180px;}
.board-search3 .input-wrap .date-wrap .date-flex .input-date:after{content: "";position: absolute;top:14px;right:20px;width:20px;height:20px;background: url(/_public/images2/icon/ico_cal.svg) no-repeat;background-size: cover;}
.board-search3 .input-wrap .date-wrap .date-flex .input-date input{width:100%;height:50px; border-radius: 5px;border: solid 1px #dedede;background-color: #fff;padding:0 40px 0 20px; font-size: 18px;font-weight: normal;letter-spacing: -0.45px;}
.board-search3 .input-wrap .date-wrap .date-flex .input-date input::placeholder{color: #8e8e8e;}
.board-search3 input[type="text"]{width: calc(100% - 507px);height:50px;border-radius: 5px;border: solid 1px #dedede;padding:0 20px;font-size: 18px;font-weight: normal;letter-spacing: -0.45px;background: #fff;}
.board-search3 input[type="text"]::placeholder{color: #8e8e8e;}
.board-search3 .btn-group{position:absolute;top:19px;right:60px;display: flex;gap:10px;}
.board-search3 .btn-group button{display: inline-block;width:50px;height:50px;font-size:0;}
.board-search3 .btn-group .btn-submit{background: url(/_public/images2/icon/ico_search.svg) no-repeat;background-size: cover;}
.board-search3 .btn-group .btn-reset{background: url(/_public/images2/icon/ico_reset.svg) no-repeat;background-size: cover;}


.bbs .tab{margin-bottom: 30px;}

/* basic */
#board-wrap{}
#board-wrap .total-txt{margin-bottom:10px;font-size: 18px;font-weight:normal;letter-spacing: -0.45px;color: #626272;}
#board-wrap .total-txt strong{color: #1c275f;font-weight: 600;}
#board-wrap .list-type1{margin-top:40px;}
#board-wrap .list-type1 .list{}
#board-wrap .list-type1 .list .board-thead{border-top:2px solid #1c275f;border-bottom:1px solid #1c275f;background: #f5f6f9;display: flex;}
#board-wrap .list-type1 .list .board-thead li{display: flex;width:100%;}
#board-wrap .list-type1 .list .board-thead li > div{font-size: 20px;font-weight: 600;text-align: center;color: #202020;display: flex;align-items: center;justify-content: center;height:70px;}
#board-wrap .list-type1 .list .board-thead li .idx{width:10%;}
#board-wrap .list-type1 .list .board-thead li .subject{flex: auto;}
#board-wrap .list-type1 .list .board-thead li .name{width:10%;}
#board-wrap .list-type1 .list .board-thead li .date{width:10%;}
#board-wrap .list-type1 .list .board-thead li .viewcount{width:8%;}

#board-wrap .list-type1 .list .board-tbody{}
#board-wrap .list-type1 .list .board-tbody li{display: flex;border-bottom: 1px solid #ccc;width:100%;}
#board-wrap .list-type1 .list .board-tbody li.notice{background: #f8faff;}
#board-wrap .list-type1 .list .board-tbody li > div{font-size: 18px;font-weight: normal;letter-spacing: -0.45px;text-align: center;color: #202020;}
#board-wrap .list-type1 .list .board-tbody li > div{padding:22px 0;}
#board-wrap .list-type1 .list .board-tbody li .idx{width:10%;}
#board-wrap .list-type1 .list .board-tbody li .subject{flex: auto;}
#board-wrap .list-type1 .list .board-tbody li .subject .txt{display: flex;gap:5px;}
#board-wrap .list-type1 .list .board-tbody li .subject .txt a{display:inline-block;text-align: left;font-size: 18px;font-weight: 500;letter-spacing: -0.45px;color: #202020;max-width:calc(100% - 50px);}
#board-wrap .list-type1 .list .board-tbody li .subject .txt i{position:relative;top:2px;display: inline-block;width:20px;}
#board-wrap .list-type1 .list .board-tbody li .subject .txt i img{display: block;}
#board-wrap .list-type1 .list .board-tbody li .subject .txt i + i{}
#board-wrap .list-type1 .list .board-tbody li .name{width:10%;}
#board-wrap .list-type1 .list .board-tbody li .date{width:10%;color:#626272;}
#board-wrap .list-type1 .list .board-tbody li .viewcount{width:8%;}
#board-wrap .list-type1 .list .board-tbody li.notice .idx{color:#003cb2;font-weight: 600;}
#board-wrap .list-type1 .list .board-tbody li:hover .subject .txt a{text-decoration: underline;}


#board-wrap .list-type2{margin-top:40px;}
#board-wrap .list-type2 .list{}
#board-wrap .list-type2 .list .board-thead{border-top:2px solid #1c275f;border-bottom:1px solid #1c275f;background: #f5f6f9;display: flex;}
#board-wrap .list-type2 .list .board-thead li{display: flex;width:100%;}
#board-wrap .list-type2 .list .board-thead li > div{font-size: 20px;font-weight: 600;text-align: center;color: #202020;display: flex;align-items: center;justify-content: center;height:70px;}
#board-wrap .list-type2 .list .board-thead li .idx{width:10%;}
#board-wrap .list-type2 .list .board-thead li .subject{flex: auto;}
#board-wrap .list-type2 .list .board-thead li .ct{width:15%;}
#board-wrap .list-type2 .list .board-thead li .ct .ct-badge{position:relative;top:-4px;margin:0 auto;display:flex;align-items:center;justify-content:center;width:90px;height:35px; border-radius: 5px;font-size: 18px;font-weight: 500;letter-spacing: -0.45px;border:1px solid transparent;line-height: 1;}
#board-wrap .list-type2 .list .board-thead li .ct .ct-badge.ct0{border-color:#1c275f;background: #1c275f;color:#fff;}
#board-wrap .list-type2 .list .board-thead li .date{width:15%;}

#board-wrap .list-type2 .list .board-tbody{}
#board-wrap .list-type2 .list .board-tbody li{display: flex;border-bottom: 1px solid #ccc;width:100%;}
#board-wrap .list-type2 .list .board-tbody li.notice{background: #f8faff;}
#board-wrap .list-type2 .list .board-tbody li > div{font-size: 18px;font-weight: normal;letter-spacing: -0.45px;text-align: center;color: #202020;}
#board-wrap .list-type2 .list .board-tbody li > div{padding:22px 0;}
#board-wrap .list-type2 .list .board-tbody li .idx{width:10%;}
#board-wrap .list-type2 .list .board-tbody li .subject{width:60%;}
#board-wrap .list-type2 .list .board-tbody li .subject .txt{display: flex;gap:5px;}
#board-wrap .list-type2 .list .board-tbody li .subject .txt a{display:inline-block;text-align: left;font-size: 18px;font-weight: 500;letter-spacing: -0.45px;color: #202020;max-width:calc(100% - 50px);overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
#board-wrap .list-type2 .list .board-tbody li .subject .txt i{position:relative;top:2px;display: inline-block;width:20px;}
#board-wrap .list-type2 .list .board-tbody li .subject .txt i img{display: block;}
#board-wrap .list-type2 .list .board-tbody li .subject .txt i + i{}
#board-wrap .list-type2 .list .board-tbody li .ct{width:15%;}
#board-wrap .list-type2 .list .board-tbody li .ct .ct-badge{position:relative;top:-4px;margin:0 auto;display:flex;align-items:center;justify-content:center;width:90px;height:35px; border-radius: 5px;border:1px solid transparent;font-size: 18px;font-weight: 500;letter-spacing: -0.45px;line-height: 1;}
#board-wrap .list-type2 .list .board-tbody li .ct .ct-badge.ct1{border-color:#234b98;color:#234b98;}
#board-wrap .list-type2 .list .board-tbody li .ct .ct-badge.ct2{border-color:#3d8a11;color:#3d8a11;}
#board-wrap .list-type2 .list .board-tbody li .ct .ct-badge.ct3{border-color:#287ae5;color:#287ae5;}
#board-wrap .list-type2 .list .board-tbody li .ct .ct-badge.ct4{border-color:#df4d20;color:#df4d20;}
#board-wrap .list-type2 .list .board-tbody li .ct .ct-badge.ct5{border-color:#c9780d;color:#c9780d;}
#board-wrap .list-type2 .list .board-tbody li .ct .ct-badge.ct6{border-color:#6f29ab;color:#6f29ab;}
#board-wrap .list-type2 .list .board-tbody li .ct .ct-badge.ct7{border-color:#A54E02;color:#A54E02;}
#board-wrap .list-type2 .list .board-tbody li .ct .ct-badge.ct8{border-color:#11776C;color:#11776C;}
#board-wrap .list-type2 .list .board-tbody li .ct .ct-badge.ct9{border-color:#E82D66;color:#E82D66;}
#board-wrap .list-type2 .list .board-tbody li .ct .ct-badge.ct10{border-color:#8E8E8E;color:#8E8E8E;}
#board-wrap .list-type2 .list .board-tbody li .date{width:15%;color:#626272;}
#board-wrap .list-type2 .list .board-tbody li.notice .idx{color:#003cb2;font-weight: 600;}
#board-wrap .list-type2 .list .board-tbody li:hover .subject .txt a{text-decoration: underline;}

/* gallery-default */
#board-wrap .gallery{margin-top:50px;}
#board-wrap .gallery ul{font-size:0;}
#board-wrap .gallery ul li{display:inline-block;width:21.7%;margin-left:4.3%;margin-bottom:120px;}
#board-wrap .gallery ul li:nth-child(4n+1){margin-left:0;}{}
#board-wrap .gallery ul li a{display:block;}
#board-wrap .gallery ul li a .img{overflow: hidden;}
#board-wrap .gallery ul li a .img img{width:100%;display:block;-moz-transition: all 0.5s;-webkit-transition: all 0.5s;-ms-transition: all 0.5s;-o-transition: all 0.5s;transition: all 0.5s;}
#board-wrap .gallery ul li a .txt{margin-top:20px;color:#333;font-size:16px;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;}
#board-wrap .gallery ul li:hover a .img{display:block;}
#board-wrap .gallery ul li:hover a .img img{transform: scale(1.2);}

/* gallery-type1 */
#board-wrap .gallery-type1{font-size:0;margin:0 auto;}
#board-wrap .gallery-type1 .list{display:inline-block;width:23%;margin:0 1% 0.4px;}
#board-wrap .gallery-type1 .list .img{}
#board-wrap .gallery-type1 .list .img img{width:100%;}
#board-wrap .gallery-type1 .list .txt-box{}
#board-wrap .gallery-type1 .list .txt-box .tit{padding:0.3px 0 0.1px;font-size:0.16px;text-align:center;font-weight:500;border-bottom:0.02px solid #333;}
#board-wrap .gallery-type1 .list .txt-box .tit span{display:block;margin-top:0.1px;font-size:0.13px;font-weight:400;}
#board-wrap .gallery-type1 .list .txt-box .tit span a{color:#333;}
#board-wrap .gallery-type1 .list .txt-box .tit span em{display: inline-block;margin-left:0.1px;}
#board-wrap .gallery-type1 .list .txt-box .tit span:hover a{text-decoration: underline;}
#board-wrap .gallery-type1 .list .txt-box .txt{display:-webkit-box;padding:0.1px 0;height:0.48px;font-size:0.12px;font-weight:300;color:#898989;-webkit-box-orient: vertical;-webkit-line-clamp:3;overflow: hidden;}

/* gallery-type2 */
#board-wrap .gallery-type2{font-size:0;overflow: hidden;margin:0 auto;max-width:1200px;}
#board-wrap .gallery-type2 .list{float:left;display:flex;margin:2% 1%;width:31.3333%;background: #fff;box-sizing: border-box;box-shadow:6px 6px 10px -1px rgba(0,0,0,0.1), -6px -6px 10px -1px rgba(255,255,255,0.7) }
#board-wrap .gallery-type2 .list .date-box{position:relative;display:inline-block;width:30%;box-sizing: border-box;border-right:0.01px solid #ccc;}
#board-wrap .gallery-type2 .list .date-box > div{position: absolute;width:100%;text-align: center;top:50%;transform: translateY(-50%);}
#board-wrap .gallery-type2 .list .date-box > div strong{display: block;font-size:0.3px;}
#board-wrap .gallery-type2 .list .date-box > div span{display: block;color:#898989;font-size:0.13px;font-weight:500;}
#board-wrap .gallery-type2 .list .content-box{position:relative;display:inline-block;width:70%;overflow: hidden;}
#board-wrap .gallery-type2 .list .content-box img{}
#board-wrap .gallery-type2 .list .content-box .txt-box{opacity:0;position:absolute;bottom:-100%;left:0;padding:0.2px;width:100%;height:100%;background: #fff;box-sizing: border-box;-moz-transition: all 0.5s;-webkit-transition: all 0.5s;-ms-transition: all 0.5s;-o-transition: all 0.5s;transition: all 0.5s;}
#board-wrap .gallery-type2 .list .content-box .txt-box .tit{font-size:0.14px;color:#898989;font-weight:500;}
#board-wrap .gallery-type2 .list .content-box .txt-box .txt{display:-webkit-box;margin-top:0.2px;height:0.58px;font-size:0.13px;color:#333;-webkit-box-orient: vertical;-webkit-line-clamp:3;overflow: hidden;}
#board-wrap .gallery-type2 .list:hover{}
#board-wrap .gallery-type2 .list:hover .content-box .txt-box{opacity: 1;bottom:0;}

/* gallery-type3 */

#board-wrap .gallery-type3{margin-top:40px;}
#board-wrap .board-topinfo{font-size:16px;color:#333;padding:15px 0;}
#board-wrap .gallery-type3 .list{}
#board-wrap .gallery-type3 .list ul{display: flex;flex-wrap: wrap;gap:20px;}
#board-wrap .gallery-type3 .list ul li{width:calc(33.3333% - 14px);}
#board-wrap .gallery-type3 .list ul li a{display:block;border-radius: 5px;border: solid 1px #dedede;background: #fff;padding:20px 20px 30px;transition: all 0.3s;}
#board-wrap .gallery-type3 .list ul li .img{position:relative;padding-top: 67%;overflow: hidden;border-radius: 5px;}
#board-wrap .gallery-type3 .list ul li .img img{display: block;width:100%;height:100%;object-fit: cover;position: absolute;top: 0;left: 0;object-position: 50% 50%;}
#board-wrap .gallery-type3 .list ul li .txt-box{margin-top:20px;}
#board-wrap .gallery-type3 .list ul li .txt-box h4{font-size: 24px;font-weight: bold;letter-spacing: -0.6px;color: #1c275f;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;transition: all 0.3s;}
#board-wrap .gallery-type3 .list ul li .txt-box .b-cont{display: flex;align-items: flex-end;justify-content: space-between;margin-top:5px;}
#board-wrap .gallery-type3 .list ul li .txt-box .b-cont .date{font-size: 18px;font-weight: normal;letter-spacing: -0.45px;color: #8e8e8e;transition: all 0.3s;}
#board-wrap .gallery-type3 .list ul li .txt-box .b-cont i{background: url(/_public/images2/icon/ico_view3.svg) no-repeat;background-size: cover;display: block;width: 30px;height: 30px;transition: all 0.3s;}
#board-wrap .gallery-type3 .list ul li:hover a{border-color:#1c275f;background: #1c275f;}
#board-wrap .gallery-type3 .list ul li:hover .txt-box h4{color:#fff;}
#board-wrap .gallery-type3 .list ul li:hover .txt-box .b-cont .date{color:#c7d0fb;}
#board-wrap .gallery-type3 .list ul li:hover .txt-box .b-cont i{background: url(/_public/images2/icon/ico_view4.svg) no-repeat;background-size: cover;}


/* gallery-type3[slide] */
#board-wrap .gallery-swiper{}
#board-wrap .gallery-swiper .swiper-slide{width:240px !important;}
#board-wrap .gallery-swiper .swiper-slide .img{}
#board-wrap .gallery-swiper .swiper-slide .img img{display:block;width:100%;}
#board-wrap .gallery-swiper .swiper-slide .txt-box{margin-top:0.2px;}
#board-wrap .gallery-swiper .swiper-slide .txt-box a .tit{color:#333;font-size:0.16px;font-weight:500;}
#board-wrap .gallery-swiper .swiper-slide .txt-box a .txt{margin-top:0.2px;color:#959595;font-size:0.12px;word-break: break-all;}
#board-wrap .gallery-swiper .swiper-slide .txt-box a .name{margin-top:0.2px;color:#959595;font-size:0.12px;}
#board-wrap .gallery-swiper .swiper-slide .txt-box a .name em{display:inline-block;font-style: italic;margin-right:0.05px;}
#board-wrap .gallery-swiper .swiper-slide:hover .txt-box a .tit{text-decoration: underline;}
#board-wrap .gallery-swiper .swiper-button-prev{width:1px;height:1px;background: url(/public_html/images/@draft/Arrow-right-03.png) 50% 50% no-repeat;background-color:rgba(255,255,255,0.5);background-size:50%;border-radius: 100%;transform: rotate(-180deg);}
#board-wrap .gallery-swiper .swiper-button-next{width:1px;height:1px;background: url(/public_html/images/@draft/Arrow-right-03.png) 50% 50% no-repeat;background-color:rgba(255,255,255,0.5);background-size:50%;border-radius: 100%;}
#board-wrap .gallery-swiper .swiper-button-next:after,
#board-wrap .gallery-swiper .swiper-button-prev:after{display:none;}
#board-wrap .gallery-swiper .swiper-button-prev.swiper-button-disabled{opacity: 0;}

/* webzine */
#board-wrap .webzine-type1{margin-top:50px;}
#board-wrap .webzine-type1 ul{border-top:2px solid #000;}
#board-wrap .webzine-type1 ul li{position:relative;border-bottom: 1px solid #ccc;}
#board-wrap .webzine-type1 ul li a{position:relative;display: flex;padding:30px 40px;font-size:0;}
#board-wrap .webzine-type1 ul li .picture{display: inline-block;width:360px;}
#board-wrap .webzine-type1 ul li .txt-box{display: inline-block;width:calc(100% - 400px);margin-left:40px;}
#board-wrap .webzine-type1 ul li .txt-box h4{margin-top:20px;font-size: 24px;font-weight: bold;color: #202020;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
#board-wrap .webzine-type1 ul li .txt-box .date{margin-top:5px;font-size: 17px;font-weight: normal;color: #555;}
#board-wrap .webzine-type1 ul li .txt-box .txt{margin-top:28px;font-size: 16px;
 font-weight: normal;line-height: 1.63;color: #787878;display:-webkit-box;word-wrap:break-word;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;height:104px;}


.gallery-type4{}
.gallery-type4 .list{margin-top:80px;position: relative;overflow: hidden;}
.gallery-type4 .list .hidden-wrap{position: absolute;left:0;bottom:80px;width:100%;height:314px;  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0), #fff);z-index: 10;}
.gallery-type4 .list .grid{font-size:0;}
.gallery-type4 .list .grid .grid-item{margin-bottom: 10px;width:calc(33.3333% - 10px);}
.gallery-type4 .list .grid .grid-item a{position:relative;display: block;overflow: hidden;}
.gallery-type4 .list .grid .grid-item a img{display: block;width:100%;-moz-transition: all 0.3s;-webkit-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;transform: scale(1);}
.gallery-type4 .list .grid .grid-item a .mask{position: absolute;top:0;left:0;width:100%;height:100%;background: rgba(0,0,0,0.4);-moz-transition: all 0.3s;-webkit-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;opacity: 0;}
.gallery-type4 .list .grid .grid-item a .txt-box{position: absolute;width:100%;left:0;padding:0 20px;top:50%;transform: translateY(-50%);text-align:center;}
.gallery-type4 .list .grid .grid-item a .txt-box h4{color:#fff;font-size:20px;}
.gallery-type4 .list .grid .grid-item a .txt-box p{margin-top:10px;font-size: 14px;color:#fff;  display:-webkit-box;word-wrap:break-word;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;height:42px;}
.gallery-type4 .list .button-box{margin-top:40px;text-align: center;}
.gallery-type4 .list .button-box button{display: inline-block;width:60px;height:60px;background:url(/_public/images2/icon/more_btn.svg) no-repeat;background-size: cover;font-size:0;}
.gallery-type4 .list .button-box button:hover{background:url(/_public/images2/icon/more_btn_on.svg) no-repeat;background-size: cover;}
.gallery-type4 .list .grid .grid-item:hover a img{transform: scale(1.1);}
.gallery-type4 .list .grid .grid-item:hover a .mask{opacity: 1;}




/* 상세 페이지 */
#board-wrap .view{}
#board-wrap .view .top{padding:40px 50px;border-radius: 5px;background: #f5f5f5;}
#board-wrap .view .top .ct-badge{position:relative;display:flex;align-items:center;justify-content:center;width:90px;height:35px; border-radius: 5px;border:1px solid transparent;font-size: 18px;font-weight: 500;letter-spacing: -0.45px;margin-bottom: 10px;line-height: 1;}
#board-wrap .view .top .ct-badge.ct0{border-color:#1c275f;background: #1c275f;color:#fff;}
#board-wrap .view .top .ct-badge.ct1{border-color:#234b98;color:#234b98;}
#board-wrap .view .top .ct-badge.ct2{border-color:#3d8a11;color:#3d8a11;}
#board-wrap .view .top .ct-badge.ct3{border-color:#287ae5;color:#287ae5;}
#board-wrap .view .top .ct-badge.ct4{border-color:#df4d20;color:#df4d20;}
#board-wrap .view .top .ct-badge.ct5{border-color:#c9780d;color:#c9780d;}
#board-wrap .view .top .ct-badge.ct6{border-color:#6f29ab;color:#6f29ab;}
#board-wrap .view .top .ct-badge.ct7{border-color:#A54E02;color:#A54E02;}
#board-wrap .view .top .ct-badge.ct8{border-color:#11776C;color:#11776C;}
#board-wrap .view .top .ct-badge.ct9{border-color:#E82D66;color:#E82D66;}
#board-wrap .view .top .ct-badge.ct10{border-color:#8E8E8E;color:#8E8E8E;}
#board-wrap .view .top h2{font-size: 24px;font-weight: bold;letter-spacing: -0.6px;color: #202020;}
#board-wrap .view .top dl{margin-top:30px;}
#board-wrap .view .top dl dt{width:50px;font-size: 20px;font-weight: 600;letter-spacing: -0.5px;color: #fc7c5a;}
#board-wrap .view .top dl dd{padding:0 0 10px 50px;font-size: 20px;font-weight: 600;letter-spacing: -0.5px;color: #202020;}


#board-wrap .view .file-box{margin-top:20px;border-radius: 5px;border: solid 1px #dedede;background: #fff;overflow: hidden;display: flex;gap:30px;}
#board-wrap .view .file-box em{display: flex;align-items: center;justify-content: center;width:160px;min-height: 64px;border-radius: 5px;background: #1c275f;font-size: 20px;font-weight: 600;letter-spacing: -0.5px;color: #fff;}
#board-wrap .view .file-box ul{width:calc(100% - 190px);padding-right: 10px;}
#board-wrap .view .file-box ul li{height:64px;display: flex;align-items: center;gap:40px;}
#board-wrap .view .file-box ul li p{width:calc(100% - 190px); font-size: 20px;font-weight: normal;letter-spacing: -0.5px;color: #202020;display: flex;justify-content: space-between;}
#board-wrap .view .file-box ul li p span{color:#8e8e8e}
#board-wrap .view .file-box ul li a{display:flex;align-items:center;justify-content:center;width:150px;height:44px;gap:9px;border-radius: 5px;background: #003cb2; font-size: 18px;font-weight: 500;letter-spacing: -0.45px;color: #fff;}
#board-wrap .view .file-box ul li a:after{content: "";position: relative;display: block;width: 20px;height: 20px;background: url(/_public/images2/icon/ico_dwn.svg) no-repeat;background-size: cover;}
#board-wrap .view .view-content{margin-top:40px;padding:40px 0;border-top:2px solid #1c275f;border-bottom:1px solid #dedede;min-height:300px;font-size:18px;line-height: 1.67;}
#board-wrap .view .view-content .video-box{max-width:1120px;margin:0 auto 40px;}
#board-wrap .view .view-content .video-box video{width:100%;height:100%;}
#board-wrap .view .view-content img{display: block;margin:0 auto;}
#board-wrap .view .bottom{margin-top:40px;overflow:hidden;border-top:1px solid #dedede;border-bottom:1px solid #dedede;}
#board-wrap .view .bottom a{display:block;font-size:18px;padding:30px 25px;color:#000;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
#board-wrap .view .bottom a + a{border-top:1px solid #dedede;}
#board-wrap .view .bottom a span{display:inline-block;}
#board-wrap .view .bottom a em{display: inline-block;position: relative;padding-left:37px; font-size: 18px;color: #787878;margin-right:30px;}
#board-wrap .view .bottom a em:before{content: "";position:absolute;top:7px;left:0;display:inline-block;width:17px;height: 10px;background: url(/_public/images2/icon/bbs_arrow.svg) no-repeat;background-size: cover; }
#board-wrap .view .bottom .prev{}
#board-wrap .view .bottom .prev span{}
#board-wrap .view .bottom .next em:before{transform:rotate(-180deg);}
#board-wrap .view .bottom .next span{margin-left:10px;}
#board-wrap .view .button-group{margin-top:40px;display: flex;justify-content: center;}
#board-wrap .view .button-group .button{display: flex;align-items: center;justify-content: center;width:180px;height: 60px;border-radius: 5px;background: #1c275f;font-size: 20px;
 font-weight: 500;letter-spacing: -0.5px;color: #fff;}




/* 쓰기 페이지 [공통 폼 스타일] */
#board-wrap .write{background:#fff;border-top: 2px solid #333;margin-top:40px;}
#board-wrap .write .cmm-form .select{display:inline-block;width:180px;}
#board-wrap .write .button-group{text-align: center;padding:40px 0;font-size:0;}
#board-wrap .write .button-group .button{width:150px;margin:0 5px;}
#board-wrap .write dl{}
#board-wrap .write dl dt{top:25px;width:150px;padding:0 20px;font-size: 16px;font-weight: 600;color: #000;}
#board-wrap .write dl dd{padding:15px 0 15px 150px;}
#board-wrap .write dl dd input[type="text"],
#board-wrap .write dl dd input[type="password"],
#board-wrap .write dl dd input[type="tel"],
#board-wrap .write dl dd input[type="email"],
#board-wrap .write dl dd input[type="number"] {width:100%;border:1px solid #ccc;padding:0 20px;font-size: 16px;height:50px;}
#board-wrap .write .small{max-width:40%;}
#board-wrap .write dl dd select{width:100%;border:1px solid #ccc;padding:0 20px;font-size: 16px;height:50px;}
#board-wrap .write dl dd textarea{width:100%;border:1px solid #ccc;padding:10px 20px;font-size: 16px;height:200px;resize: none;}
#board-wrap .write .button-box{margin-top:50px;display: flex;justify-content: center;gap:10px;}
#board-wrap .write .button-box button{height:50px;width:160px;border-radius: 5px;font-size: 18px;background: #383838;color: #fff;}
#board-wrap .write2{border-top: 2px solid #333;}
#board-wrap .write2 table{}
#board-wrap .write2 table tbody tr th{padding:30px 20px;font-size:14px;font-weight:600;text-align: left;vertical-align: top;border-bottom:1px solid #e5e5e5;background: transparent;}
#board-wrap .write2 table tbody tr td{padding:20px 0;text-align: left;border-bottom:1px solid #e5e5e5;}
#board-wrap .write2 table tbody tr td .select{display:inline-block;width:175px;height:37px;}
#board-wrap .write2 table tbody tr td .select .select-styled{border-radius: 10px;font-weight:700;line-height: 35px;}
#board-wrap .write2 table tbody tr td input[type="text"],
#board-wrap .write2 table tbody tr td input[type="password"]{width:100%;height:35px;padding:0 10px;border: 1px solid #e5e5e5;}
#board-wrap .write2 table tbody tr td input[type="password"]{width:200px;}
#board-wrap .write2 table tbody tr td textarea{width: 100%;height: 229px;display: block;padding: 20px 20px 40px;resize: none;border: 1px solid #c0c0c0;}
#board-wrap .write2 table tbody tr td .txt{font-size: 12px;margin-top: 10px;}
#board-wrap .write2 table tbody tr td .button{line-height: 35px;font-size:14px;width:125px;}
#board-wrap .write2 table tbody tr td dl{}
#board-wrap .write2 table tbody tr td dl dt{position:relative;padding:20px 20px 20px 40px;font-size:14px;font-weight:500;cursor: pointer;}
#board-wrap .write2 table tbody tr td dl dt:before{content: "Q";position:absolute;top:16px;left:7px;display:inline-block;color:#333;font-size:21px;font-family: "NanumSquareRound";font-weight:100;}
/* #board-wrap .write2 table tbody tr td dl dt.on{color:#333;} */
#board-wrap .write2 table tbody tr td dl dd{position:relative;display:none;background: #fcfcfc;padding:20px 40px;font-size:14px;}
#board-wrap .write2 table tbody tr td dl dd:before{content: "A";position:absolute;top:16px;left:7px;display:inline-block;color:#333;font-size:21px;font-family: "NanumSquareRound";font-weight:100;}
#board-wrap .write2 table tbody tr td .checkbox-type1{}
#board-wrap .write2 table tbody tr td .checkbox-type1 + .checkbox-type1{margin-top:10px;}
#board-wrap .write2 table tbody tr td .checkbox-type1 label{padding-left:25px;width:90px;line-height: 37px;}
#board-wrap .write2 table tbody tr td .checkbox-type1 label:before{top:11px;}
#board-wrap .write2 table tbody tr td .checkbox-type1 label:after{top:11px;}
#board-wrap .write2 table tbody tr td .checkbox-type1 .select{vertical-align: middle;display:inline-block;width:100px;height:35px;}
#board-wrap .write2 table tbody tr td .checkbox-type1 .select .select-styled{line-height: 35px;border-radius: 10px;}
#board-wrap .write2 table tbody tr td .checkbox-type1 .select .select-options li{line-height: 35px;}
#board-wrap .write2 table tbody tr td .checkbox-type1 em{display: inline-block;margin:0 4px;vertical-align:middle;}
#board-wrap .write2 table tbody tr td .checkbox-type1 input[type="tel"],
#board-wrap .write2 table tbody tr td .checkbox-type1 input[type="number"],
#board-wrap .write2 table tbody tr td .checkbox-type1 input[type="text"],
#board-wrap .write2 table tbody tr td .checkbox-type1 input[type="email"]{display:inline-block;padding:0 10px;width:100px;border:1px solid #e5e5e5;height:35px;vertical-align: middle;}
#board-wrap .write2 table tbody tr td .checkbox-type1.email .select{width:135px;}
#board-wrap .write2 table tbody tr td .checkbox-type1.email input[type="tel"],
#board-wrap .write2 table tbody tr td .checkbox-type1.email input[type="number"],
#board-wrap .write2 table tbody tr td .checkbox-type1.email input[type="text"],
#board-wrap .write2 table tbody tr td .checkbox-type1.email input[type="email"]{width:135px;}
#board-wrap .write2 table tbody tr td .search-box{font-size:0;}
#board-wrap .write2 table tbody tr td .search-box .input-wrap{position: relative;display:inline-block;width:470px;}
#board-wrap .write2 table tbody tr td .search-box input[type="text"]{width:100%;padding:0 35px 0 10px;height:37px;border:1px solid #d0d0d0;background: #fafafa;}
#board-wrap .write2 table tbody tr td .search-box em{cursor: pointer;display:inline-block;position: absolute;top:8px;right:5px;width:20px;height:20px;background: url(/_public/images2/@draft/sp_ico.png) no-repeat;background-position: -180px 0;}
#board-wrap .write2 table tbody tr td select{margin-left:5px;padding:0 10px;width:120px;border:1px solid #d0d0d0;height:35px;background: url(/_public/images2/@draft/select_icon01.png) 95% 50% no-repeat;}
#board-wrap .write2 table tbody tr td .search-box .button{margin-left:10px;}
#board-wrap .write2 table tbody tr td .ios-chk label{font-size:14px;}
#board-wrap .write2 table tbody tr td .file-list{margin-bottom:10px;}
#board-wrap .write2 table tbody tr td .uploaded_files{position: relative;display:inline-block;font-size:13px;margin: 0 2px;padding: 0 30px 0 10px;color:#fff;background:#3cc194;line-height: 30px;border: 1px solid #3cc194;border-radius: 25px;}
#board-wrap .write2 table tbody tr td .uploaded_files button{position: absolute;top: 9px;right: 10px;color: #fff;}
#board-wrap .write2 table tbody tr td .filebox{position:relative;}
#board-wrap .write2 table tbody tr td .filebox button{position:absolute;width:30px;height:30px;line-height: 30px;text-align: center;background: #333;color:#fff;border-radius: 100%;right: 0;top: 8px;font-size: 20px;font-weight: 100;}
#board-wrap .write2 table tbody tr td .filebox button.del-button{font-size: 25px;line-height: 25px;}
#board-wrap .write2 table tbody tr td .filebox + .filebox{margin-top:5px;}
#board-wrap .write2 table tbody tr td .filebox .upload-name{width:300px;}
#board-wrap .write2 .button-group{padding:55px 0;text-align: center;}
#board-wrap .write2 .button-group .button{margin:0 5px;width:160px;line-height: 41px;font-weight:500;}


#board-wrap .form-flex{display:flex;}
#board-wrap .form-flex .cmm-form{}
#board-wrap .form-flex .cmm-form:first-child{width:195px !important;}
#board-wrap .cmm-form{padding:20px;box-sizing: border-box;}
#board-wrap .cmm-form .form{position:relative;overflow:hidden;border-bottom:1px solid #f3f3f3;}
#board-wrap .cmm-form .form .ios-chk{padding:10px 20px;}
#board-wrap .cmm-form .form .ios-chk label{position:relative !important;top:inherit !important;left:inherit !important;margin-right:10px;}
#board-wrap .cmm-form .form:after{content: "";opacity:0;display:inline-block;position:absolute;left:50%;transform: translateX(-50%);bottom:0;width:0;height:2px;background:#333;-moz-transition: all 0.5s;-webkit-transition: all 0.5s;-ms-transition: all 0.5s;-o-transition: all 0.5s;transition: all 0.5s;}
#board-wrap .cmm-form .form.active:after{opacity:1;width:100%;height:2px;-moz-transition: all 0.5s;-webkit-transition: all 0.5s;-ms-transition: all 0.5s;-o-transition: all 0.5s;transition: all 0.5s;}
#board-wrap .cmm-form .label{display:block;padding: 20px 20px 10px;font-size:16px;font-weight:500;}
#board-wrap .cmm-form .label .add-button{float: right;display: inline-block;font-size: 16px;}
#board-wrap .cmm-form .form label{position: absolute;top:-9999999px;left:-999999px;}
#board-wrap .cmm-form .form input[type="text"],
#board-wrap .cmm-form .form input[type="tel"],
#board-wrap .cmm-form .form input[type="email"],
#board-wrap .cmm-form .form input[type="password"]{width:100%;height:40px;color:#898989;border:0;box-sizing: border-box;padding:0 20px;}
#board-wrap .cmm-form .form input.inputTitle{font-size:20px;height:60px;}
#board-wrap .cmm-form .form input.inputTitle::-webkit-input-placeholder {}
#board-wrap .cmm-form .form input::placeholder{color: #ccc;}
#board-wrap .cmm-form .form input.inputTitle::placeholder{font-size:20px;line-height: 40px;}
#board-wrap .cmm-form .form input:focus{border:0;outline: none;}
#board-wrap .cmm-form .form textarea{border:0;resize: none;padding:20px 20px 40px;width:100%;height:300px;border:1px solid #c0c0c0;border-radius: 5px;}
#board-wrap .cmm-form .form .filebox{padding:20px 0;}
#board-wrap .cmm-form .form .filebox-txt{font-size: 12px;padding-bottom:10px;}
#board-wrap .cmm-form.error .form{border-color:#ff4947;}
#board-wrap .cmm-form.error .form input{color:#ff4947;}
#board-wrap .cmm-form.error .form input::placeholder{color:#ff4947;}

/* 댓글 */
.reply{padding:20px 40px;border-top:1px solid #ccc;}
.reply .tit{font-size:16px;font-weight:500;}
.reply .chk-button{display: inline-block;position:relative;margin-left:10px;width: 45px;height: 20px;background: #333;vertical-align: middle;border-radius: 10px;cursor:pointer;}
.reply .chk-button:before{content: "";display:inline-block;position:absolute;top:50%;margin-top:-8px;right:2px;width:16px;height:16px;background:#fff;border-radius: 100%;}
.reply .chk-button:after{content: "on";color: #fff;font-weight:100;font-size: 12px;position: absolute;left: 6px;}
.reply .chk-button.on{background:#e5e5e5;}
.reply .chk-button.on:before{right:inherit;left:2px;}
.reply .chk-button.on:after{content: "off";color: #fff;left: inherit;right:8px;}
.reply .reply-wrap{display:block;}
.reply .reply-wrap.disable{display:none;}
.reply .comment-write{margin-top:10px;padding:20px;border:1px solid #ccc;box-sizing: border-box;}
.reply .comment-write dl{padding-bottom:10px;border-bottom:1px solid #ccc;}
.reply .comment-write dl dt{display:inline-block;}
.reply .comment-write dl dt label{font-size:14px;}
.reply .comment-write dl dd{display:inline-block;padding:0 10px;}
.reply .comment-write dl dd input[type="text"],
.reply .comment-write dl dd input[type="password"]{border:1px solid #e5e5e5;padding:0 10px; width:120px;height:30px;}
.reply .comment-write .member{padding:5px;}
.reply .comment-write .member .user{padding:10px;font-size:14px;font-weight: 600;}
.reply .comment-write .input-area{overflow: hidden;}
.reply .comment-write .input-area label{position: absolute;top:-99999999px;left:-9999999px;}
.reply .comment-write .input-area textarea{padding:20px;border:0;border-bottom:1px solid #f3f3f3;box-sizing: border-box;width:100%;height:100px;resize: none;}
.reply .comment-write .input-area .button-box{margin-top:10px;text-align: right;}
.reply .comment-write .input-area .button-box button{display: inline-block;font-size:13px;border:1px solid #333;background:#fff;color:#333;text-align: center;width:70px;line-height:30px;}
.reply .comment-write .input-area .button-box button + button{margin-left:5px;}
.reply .comment-write .input-area .button-box button.del{border:1px solid #ff0000;background:#fff;color:#ff0000;}
.reply .reply-list{margin-top:20px;}
.reply .reply-list .sort{padding:10px 0;border-bottom:1px solid #ccc;}
.reply .reply-list .sort a{display:inline-block;margin-right:10px;color:#333;font-size:16px;}
.reply .reply-list .sort a.on{font-weight:500;}
.reply .reply-list .list{padding:10px 0;border-bottom:1px solid #f3f3f3;}
.reply .reply-list .list .name{font-size:14px;font-weight:500;}
.reply .reply-list .list .name em{color:#898989;font-weight:400;}
.reply .reply-list .list .txt{padding:10px 0;font-size:14px;}
.reply .reply-list .list .option{margin-top:10px;overflow: hidden;}
.reply .reply-list .list .option .reply-count{display:inline-block;padding:0 10px;color:#333;font-size:12px;background:#fff;border:1px solid #ccc;border-radius:5px;line-height:25px;}
.reply .reply-list .list .option .reply-count a{color:#333;}
.reply .reply-list .list .option .option-button{float:right;font-size:0;}
.reply .reply-list .list .option .option-button button{display:inline-block;margin-left:5px;background:#fff;color:#333;border:1px solid #333;font-size:11px;line-height:25px;width:50px;}
.reply .reply-list .more-button{margin-top:20px;display:block;width:100%;background:transparent;box-sizing: border-box;text-align: center;font-size:13px;line-height:40px;}
.reply .reply-list .more-button em{display:inline-block;margin-left:10px;}
.reply .reply-list .list .modify-comment{padding:20px;border:1px solid #ccc;overflow: hidden;}
.reply .reply-list .list .modify-comment textarea{padding:20px;border:0;border-bottom:1px solid #f3f3f3;box-sizing: border-box;width:100%;height:80px;resize: none;}
.reply .reply-list .list .modify-comment button{float:right;margin-top:10px;display: inline-block;margin-left: 5px;background: #fff;color: #333;border: 1px solid #333;font-size: 11px;line-height: 25px;width: 50px;}
.reply .inner-reply{display:none;margin-top:20px;padding:30px;background:#FBFCFD;}
.reply .inner-reply.active{display:block;}
.reply .inner-reply .inner-input-area{overflow: hidden;padding:20px;background:#fff;}
.reply .inner-reply .inner-input-area .member{padding: 0;}
.reply .inner-reply .inner-input-area .member .user{padding:10px;font-size:14px;font-weight: 600;}
.reply .inner-reply .inner-input-area input[name="name"]{border:1px solid #ccc;width:100px;height:25px;box-sizing: border-box;padding:0 10px;}
.reply .inner-reply .inner-input-area input[name="passwd"]{margin-left:10px;border:1px solid #ccc;width:100px;height:25px;box-sizing: border-box;padding:0 10px;}
.reply .inner-reply .inner-input-area label{position: absolute;top:-99999999px;left:-9999999px;}
.reply .inner-reply .inner-input-area textarea{padding:20px;border:0;border-bottom:1px solid #f3f3f3;box-sizing: border-box;width:100%;height:70px;resize: none;}
.reply .inner-reply .inner-input-area button{float:right;margin-top:10px;border:1px solid #333;background:#fff;color:#333;text-align: center;width:70px;line-height: 40px;}
.reply .inner-reply .inner-list{padding:20px;border-bottom:1px solid #f0f0f0;}

/* 비밀글 레이어 */
.layer-password{display:none;position: fixed;top:0;left:0;width:100%;height:100%;z-index:100;line-height: normal;}
.layer-password .layer-password-wrap{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:500px;background: #fff;padding:20px 50px;border-radius: 15px;}
.layer-password .layer-password-wrap .layer-body{padding:20px;}
.layer-password .layer-password-wrap .layer-body .form-wrap{text-align: center;font-size:0;}

.layer-password .layer-password-wrap .layer-body .form-wrap input[type="password"]{padding:0 10px;width:270px;vertical-align: top;height:40px;border:1px solid #dbdbdb;}
.layer-password .layer-password-wrap .layer-body .form-wrap .button{line-height: 38px;border-radius:0;width:80px;font-size:12px;vertical-align: top;}
.layer-password .layer-password-wrap .layer-body .layer-password-close{position:absolute;top:10px;right:20px;width:35px;height:35px;overflow: hidden;text-indent: -99999px;}
.layer-password .layer-password-wrap .layer-body .layer-password-close:before{content: "";position:absolute;top:0;left:0;display:inline-block;width:32px;height:32px;background: url("/_public/images2/@draft/sp_ico.png") no-repeat;background-size: 490px;background-position: -224px -20px;}



/* tablet */
@media all and (max-width:1280px) {
 .bbs{}

 .board-search{padding:15px 155px;}
 .board-search .btn-group{top:19px;right:40px;}
 .board-search .btn-group button{width:40px;height:40px;}

 .board-search2{padding:15px 155px 15px 15px;}
 .board-search2 .input-wrap form{gap:20px;}
 .board-search2 .btn-group{top:19px;right:40px;}
 .board-search2 .btn-group button{width:40px;height:40px;}

 .board-search3{padding:15px 155px 15px 20px;}
 .board-search3 .input-wrap .date-wrap{gap:10px;}
 .board-search3 .input-wrap .date-wrap span{font-size:16px;}
 .board-search3 .input-wrap .date-wrap .date-flex{gap:5px;font-size:16px;}
 .board-search3 .input-wrap form{gap:10px;}
 .board-search3 .btn-group{top:19px;right:40px;}
 .board-search3 .btn-group button{width:40px;height:40px;}

 #board-wrap .list-type1 .list .board-thead li > div{height:60px;font-size: 18px;}
 #board-wrap .list-type1 .list .board-tbody li > div{padding:18px 0;font-size:16px;}
 #board-wrap .list-type1 .list .board-tbody li .subject .txt a{font-size:16px;}


 #board-wrap .list-type2 .list .board-thead li > div{height:60px;font-size: 18px;}
 #board-wrap .list-type2 .list .board-tbody li > div{padding:18px 0;font-size:16px;}
 #board-wrap .list-type2 .list .board-tbody li .subject .txt a{font-size:16px;}
 #board-wrap .list-type2 .list .board-tbody li .ct .ct-badge{font-size:16px;}

 #board-wrap .gallery-type3 .list ul li a{padding:20px;}
 #board-wrap .gallery-type3 .list ul li .txt-box h4{font-size:20px;}
 #board-wrap .gallery-type3 .list ul li .txt-box .b-cont .date{font-size:16px;}

 #board-wrap .webzine-type1 ul li a{align-items: center;}
 #board-wrap .webzine-type1 ul li .picture{width:300px;}
 #board-wrap .webzine-type1 ul li .txt-box{width: calc(100% - 340px);}
 #board-wrap .webzine-type1 ul li .txt-box h4{margin-top:0;}
 #board-wrap .webzine-type1 ul li .txt-box .txt{margin-top:15px;}



 #board-wrap .view .top{padding:30px 40px;}
 #board-wrap .view .top h2{font-size:20px;}
 #board-wrap .view .top dl{margin-top:20px;}
 #board-wrap .view .top dl dt{font-size:16px;}
 #board-wrap .view .top dl dd{font-size:16px;}
 #board-wrap .view .top .ct-badge{font-size: 16px;height:30px;}
 #board-wrap .view .file-box{}
 #board-wrap .view .file-box em{font-size: 18px;}
 #board-wrap .view .file-box ul{padding:10px 10px 10px 0;}
 #board-wrap .view .file-box ul li{height:40px;}
 #board-wrap .view .file-box ul li + li{margin-top:10px;}
 #board-wrap .view .file-box ul li p{font-size:18px;}
 #board-wrap .view .file-box ul li a{height:40px;font-size: 16px;}
 #board-wrap .view .view-content{padding:30px 0;font-size: 16px;}
 #board-wrap .view .bottom a{padding:20px 15px;font-size:16px;}
 #board-wrap .view .bottom a em{font-size:16px;}
 #board-wrap .view .bottom a em:before{top:6px;width:15px;height:8px;}
 #board-wrap .view .button-group{margin-top:30px;}
 #board-wrap .view .button-group .button{height:55px;font-size: 18px;}

 #board-wrap .view .view-content .video-box{margin-bottom:20px;}

 .gallery-type4 .list{margin-top:40px;}
 .gallery-type4 .list .grid .grid-item{margin-bottom: 10px;width:48%;max-width:100%;}
 .gallery-type4 .list .grid .grid-item a img{width:100%;}
 .gallery-type4 .list .grid .grid-item a .mask{position: relative;top:0;left:0;height:auto;background: #fff;opacity: 1;}
 .gallery-type4 .list .grid .grid-item a .txt-box{position: relative;top:0;transform: none;text-align: left;padding:10px;}
 .gallery-type4 .list .grid .grid-item a .txt-box h4{color:#000;font-size:16px;}
 .gallery-type4 .list .grid .grid-item a .txt-box p{color:#000;margin-top:5px;font-size:13px;}
 .gallery-type4 .list .button-box button{width:40px;height:40px;}

}

@media all and (max-width:1024px) {
 .board-search{padding:10px 110px 10px 20px;}
 .board-search input[type="text"]{font-size:16px;height:45px;padding:0 15px;}
 .board-search .btn-group{top:13px;right:20px;gap:5px;}
 .board-search .btn-group button{width:35px;height: 35px;}

 .board-search2{padding:10px 110px 10px 20px;}
 .board-search2 .input-wrap .select-box{gap:10px;}
 .board-search2 .input-wrap .select-box select{height:45px;font-size: 16px;padding:0 15px;}
 .board-search2 .input-wrap .select-box span{font-size:16px;}
 .board-search2 input[type="text"]{height:45px;font-size:16px;padding:0 15px;max-width: calc(100% - 290px);}
 .board-search2 .btn-group{top:13px;right:20px;gap:5px;}
 .board-search2 .btn-group button{width:35px;height: 35px;}


 .board-search3{padding:10px 110px 10px 20px;}
 .board-search3 input[type="text"]{font-size:16px;height:45px; padding:0 15px;width: calc(100% - 401px);}
 .board-search3 .input-wrap .date-wrap .date-flex .input-date{width:145px;}
 .board-search3 .input-wrap .date-wrap .date-flex .input-date input{height:45px;font-size: 16px;padding:0 30px 0 15px;}
 .board-search3 .input-wrap .date-wrap .date-flex .input-date:after{top:13px;right:15px;width:18px;height:18px;}
 .board-search3 .btn-group{top:13px;right:20px;gap:5px;}
 .board-search3 .btn-group button{width:35px;height: 35px;}



 #board-wrap .total-txt{font-size:16px;}

 #board-wrap .list-type1{margin-top:30px;}
 #board-wrap .list-type1 .list .board-thead li > div{height:50px;font-size: 16px;}
 #board-wrap .list-type1 .list .board-tbody li > div{padding:15px 0;font-size:15px;}
 #board-wrap .list-type1 .list .board-tbody li .subject .txt a{font-size:15px;}


 #board-wrap .list-type2{margin-top:30px;}
 #board-wrap .list-type2 .list .board-thead li > div{height:50px;font-size: 16px;}
 #board-wrap .list-type2 .list .board-tbody li > div{padding:15px 0;font-size:15px;}
 #board-wrap .list-type2 .list .board-tbody li .subject .txt a{font-size:15px;}

 #board-wrap .gallery-type3 .list ul li{width:calc(50% - 10px);}
 #board-wrap .gallery-type3 .list ul li .txt-box{margin-top:10px;}
 #board-wrap .gallery-type3 .list ul li .txt-box h4{font-size:18px;}
 #board-wrap .gallery-type3 .list ul li .txt-box .b-cont i{width:25px;height:25px;}


 #board-wrap .view .top{padding:20px 30px;}
 #board-wrap .view .top h2{font-size:18px;}
 #board-wrap .view .top dl dt{font-size:15px;width:40px;}
 #board-wrap .view .top dl dd{font-size:15px;padding:0 0 5px 40px;}
 #board-wrap .view .file-box em{display: none;}
 #board-wrap .view .file-box ul{padding:10px;width:100%;}
 #board-wrap .view .file-box ul li{gap:20px;}
 #board-wrap .view .file-box ul li + li{margin-top:5px;}
 #board-wrap .view .file-box ul li p{font-size:16px;width:calc(100% - 140px);}
 #board-wrap .view .file-box ul li a{height:35px;font-size: 15px;width:120px;}
 #board-wrap .view .view-content{font-size: 15px;}
 #board-wrap .view .button-group .button{height:50px;font-size: 16px;}
 #board-wrap .view .bottom{margin-top:30px;}
 #board-wrap .view .bottom a{padding:15px 10px;font-size: 15px;}
 #board-wrap .view .bottom a em{font-size:15px;margin-right:20px;padding-left: 25px;}
 #board-wrap .view .bottom a em:before{top:7px;width:13px;height:6px;}
}


@media all and (max-width:768px) {
 .board-search input[type="text"]{width:100%;font-size:15px;}

 .board-search2 .input-wrap form{gap:10px;}
 .board-search2 .input-wrap .select-box span{display: none;}
 .board-search2 .input-wrap .select-box select{font-size:15px;width:130px;}
 .board-search2 input[type="text"]{font-size:15px;max-width: calc(100% - 140px);}

 .board-search3{padding:10px 20px;}
 .board-search3 .input-wrap form{flex-direction: column;align-items: flex-start;}
 .board-search3 .input-wrap .date-wrap{width:100%;}
 .board-search3 .input-wrap .date-wrap span{display: none;}
 .board-search3 .input-wrap .date-wrap .date-flex{width:100%;}
 .board-search3 .input-wrap .date-wrap .date-flex .input-date{width:100%;}
 .board-search3 .input-wrap .date-wrap .date-flex .input-date input{font-size:15px;}
 .board-search3 input[type="text"]{width: calc(100% - 90px);font-size:15px;}
 .board-search3 .btn-group{top:initial;bottom:15px;}


 #board-wrap .list-type1 .list{border-top: 2px solid #1c275f;}
 #board-wrap .list-type1 .list .board-thead{display: none;}
 #board-wrap .list-type1 .list .board-tbody li{position: relative;flex-wrap: wrap;padding:5px 5px 5px 70px;}
 #board-wrap .list-type1 .list .board-tbody li .subject{width:100%;}
 #board-wrap .list-type1 .list .board-tbody li > div{padding:5px;}
 #board-wrap .list-type1 .list .board-tbody li .idx{position: absolute;top:50%;left:0;transform: translateY(-50%);width:70px;}
 #board-wrap .list-type1 .list .board-tbody li .name{width:auto;}
 #board-wrap .list-type1 .list .board-tbody li .date{width:auto;}
 #board-wrap .list-type1 .list .board-tbody li .subject .txt i{width:18px;}



 #board-wrap .list-type2 .list{border-top: 2px solid #1c275f;}
 #board-wrap .list-type2 .list .board-thead{display: none;}
 #board-wrap .list-type2 .list .board-tbody li{position: relative;flex-wrap: wrap;padding:5px 5px 5px 70px;}
 #board-wrap .list-type2 .list .board-tbody li .subject{width:100%;}
 #board-wrap .list-type2 .list .board-tbody li > div{padding:5px;}
 #board-wrap .list-type2 .list .board-tbody li .ct .ct-badge{margin:0;top:0;font-size:14px;height:30px;width:70px;}
 #board-wrap .list-type2 .list .board-tbody li .idx{position: absolute;top:50%;left:0;transform: translateY(-50%);width:70px;}
 #board-wrap .list-type2 .list .board-tbody li .name{width:auto;}
 #board-wrap .list-type2 .list .board-tbody li .date{width:auto;}
 #board-wrap .list-type2 .list .board-tbody li .subject .txt i{width:18px;}


 #board-wrap .gallery-type3 .list ul li a{padding:15px;}
 #board-wrap .gallery-type3 .list ul li .txt-box h4{font-size: 16px;}
 #board-wrap .gallery-type3 .list ul li .txt-box .b-cont .date{font-size:14px;}


 #board-wrap .webzine-type1{margin-top:25px;}
 #board-wrap .webzine-type1 ul li a{padding:20px;display: block;}
 #board-wrap .webzine-type1 ul li .picture{display: block;width:100%;}
 #board-wrap .webzine-type1 ul li .picture img{display: block;width:100%;}
 #board-wrap .webzine-type1 ul li .txt-box{display:block;width:100%;margin:20px 0 0;}
 #board-wrap .webzine-type1 ul li .txt-box h4{font-size: 18px;font-weight: bold;color: #202020;display:-webkit-box;word-wrap:break-word;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;height:53px;white-space: inherit;}
 #board-wrap .webzine-type1 ul li .txt-box .date{font-size:16px;}
 #board-wrap .webzine-type1 ul li .txt-box .txt{font-size:14px;max-height: 93px;height: 100%;}
 #board-wrap .list-type1 .list .board-tbody li .col.subject a{font-size:15px;}

 #board-wrap .write dl dt{top:0;float:none;width:100%;padding:10px 0;}
 #board-wrap .write dl dd{padding:0;width:100%;}
 #board-wrap .write dl dd input[type="text"],
 #board-wrap .write dl dd input[type="password"],
 #board-wrap .write dl dd input[type="tel"],
 #board-wrap .write dl dd input[type="email"],
 #board-wrap .write dl dd input[type="number"]{height:40px;padding:0 10px;font-size:14px;}
 #board-wrap .write dl dd select{height:40px;width:100%;padding:10px;font-size:14px;}
 #board-wrap .write .small{max-width:100%;}
 #board-wrap .write .button-box{margin-top:30px;}
 #board-wrap .write .button-box button{height:40px;font-size:16px;}

 #board-wrap .view .top{padding:15px 20px;}
 #board-wrap .view .top h2{font-size:16px;}
 #board-wrap .view .top .ct-badge{font-size: 15px;height:30px;}
 #board-wrap .view .top dl dt{font-size:14px;}
 #board-wrap .view .top dl dd{font-size:14px;}
 #board-wrap .view .file-box ul li p{font-size:15px;}
 #board-wrap .view .file-box ul li a:after{width:18px;height:18px;}
 #board-wrap .view .view-content{margin-top:20px;padding:20px 0;}
 #board-wrap .view .button-group .button{font-size:15px;}
 #board-wrap .view .bottom a{padding:10px;font-size:14px;}

}


@media all and (max-width:460px) {
 .board-search2{padding:10px 85px 10px 10px;}
 .board-search2 .input-wrap .select-box{width:100%;}
 .board-search2 .input-wrap .select-box select{width:100%;}
 .board-search2 .input-wrap form{flex-direction: column;align-items: flex-start;gap:5px;}
 .board-search2 input[type="text"]{max-width:100%;}
 .board-search2 .btn-group{top:initial;right:10px;bottom:18px;}
 .board-search2 .btn-group button{width:30px;height:30px;}

 .board-search3{padding:10px;}
 .board-search3 input[type="text"]{width: calc(100% - 70px);}
 .board-search3 .btn-group{right:10px;bottom:18px;}
 .board-search3 .btn-group button{width:30px;height:30px;}
 .board-search3 .input-wrap .date-wrap .date-flex .input-date input{padding:0 25px 0 10px;}
 .board-search3 .input-wrap .date-wrap .date-flex .input-date:after{width:16px;height:16px;right:10px;}


 #board-wrap .list-type1 .list .board-tbody li{padding:10px;}
 #board-wrap .list-type1 .list .board-tbody li .idx{display: none;}

 #board-wrap .list-type2 .list .board-tbody li{padding:10px;}
 #board-wrap .list-type2 .list .board-tbody li .idx{display: none;}

 #board-wrap .gallery-type3 .list ul li{width:100%;}
 #board-wrap .gallery-type3 .list ul li a{padding:10px;}


 #board-wrap .view .file-box ul li{gap:10px;height:30px;}
 #board-wrap .view .file-box ul li p{width:calc(100% - 40px);font-size:14px;}
 #board-wrap .view .file-box ul li a{width:30px;height:30px;font-size: 0;gap:0;}
}