/************************************************************************* * @ 서비스명 : commonui * @ 파일명 : /public_htm/css/commonui.css * @ 페이지설명 : commonui.css * @ 작성자 : 한주현 (pointweb) * @ 작성일 : 2020-05-08 ************************** 수정이력 ************************************** * 날짜 작업자 변경내용 * 2020-05-08 한주현 최초작성 * 2020-08-27 조영훈 포토갤러리 섬네일 테이블 변경 **************************************************************************/ @charset "utf-8"; /* 게시판 */ .page-tit {max-width: 1100px;margin: 0 auto;color: #000;font-size: 24px;font-weight: 600;margin-bottom: 40px;padding-bottom:40px;border-bottom: 1px solid #e1e1e1;} .search_box {margin-top: 30px;display: inline-block;} .board-search{font-size:0;text-align: center;background:rgba(255,255,255,0.7);border-radius: 5px;margin:10px 0;padding:10px;} .board-search select{display:inline-block;vertical-align: middle;height:50px;width:100px;padding:0 20px;background-color: #fff;border-top: 1px solid #e1e1e1;border-left: 1px solid #e1e1e1;border-bottom: 1px solid #e1e1e1;} .board-search input[type="text"]{display:inline-block;vertical-align: middle;padding:10px;width:280px;height:50px;background:#fff;box-sizing: border-box;border-top: 1px solid #e1e1e1;border-bottom: 1px solid #e1e1e1;} .board-search button{position:relative;display:inline-block;width:50px;height:50px;vertical-align:middle;box-sizing:border-box;background:#fff;border-top: 1px solid #e1e1e1;border-right: 1px solid #e1e1e1;border-bottom: 1px solid #e1e1e1;} .board-search button:before{content: "";display:inline-block; width:30px;height:30px;background:#fff url('/_public/images/@draft/sp_ico.png') no-repeat;background-position:-115px -61px; position: absolute;top: 10px;left: 5px;} #board-wrap{margin-top:40px;} /* basic */ #board-wrap .list-type1{margin:0 auto;max-width:1100px;background: #fff;border-top:2px solid #555;} #board-wrap .list-type1 .list{border-bottom:1px solid #e1e1e1} #board-wrap .list-type1 .list .board-tbody{} #board-wrap .list-type1 .list .board-thead li{color:#fff;} #board-wrap .list-type1 .list .board-thead li, #board-wrap .list-type1 .list .board-tbody li{display:table;table-layout:fixed;width:100%;border-top:1px solid #e1e1e1;box-sizing: border-box;line-height: 48px;} #board-wrap .list-type1 .list .board-thead li{border-top:0;border-bottom:1px solid #d9d9d9;background: #f5f5f5;} #board-wrap .list-type1 .list .board-tbody li.notice{} #board-wrap .list-type1 .list .board-tbody li:first-child{border-top:0;} #board-wrap .list-type1 .list .board-tbody li.notice .col.subject a{font-weight:500;color:#0d6fb8;} #board-wrap .list-type1 .list .board-thead li .col, #board-wrap .list-type1 .list .board-tbody li .col{display: table-cell;width:15%;height: 54px;color:#333;font-size:16px;text-align:center;font-weight:500;vertical-align: middle;} #board-wrap .list-type1 .list .board-thead li .col.idx, #board-wrap .list-type1 .list .board-tbody li .col.idx{width:10%;vertical-align: middle; } #board-wrap .list-type1 .list .board-thead li .col.subject, #board-wrap .list-type1 .list .board-tbody li .col.subject{width:55%;text-align: left;vertical-align: middle;} #board-wrap .list-type1 .list .board-tbody li .col.subject a{color:#333;display:inline-block;max-width:85%;vertical-align:middle;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;} #board-wrap .list-type1 .list .board-tbody li .col.subject a:hover{text-decoration: underline;} #board-wrap .list-type1 .list .board-tbody li .col.subject .icon-group{display:inline-block;vertical-align: middle;} #board-wrap .list-type1 .list .board-tbody li .col.subject .icon-group em{display: inline-block;margin-left:5px;} #board-wrap .list-type1 .list .board-tbody li .col .noti-icon{display:inline;margin-right:10px;color:#0d6fb8;} #board-wrap .list-type1 .list .board-tbody li .col.subject .icon-new{display:inline-block;width:15px;vertical-align: middle;} #board-wrap .list-type1 .list .board-tbody li .col.subject .icon-file{color:#333;} #board-wrap .list-type1 .list .board-tbody li .col.subject .reply-count{display:inline;margin-left:5px;color:#ff2f3b;font-size:13px;} #board-wrap .list-type1 .list .board-thead li .col.subject{text-align: center;} #board-wrap .list-type1 .list .board-tbody li .col{font-size:15px;font-weight:400;} /* 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);} #board-wrap .gallery tr td a{color: #444;display: block;font-size: 16px;} #board-wrap .gallery tr td {padding: 13px 0;} /* gallery-type1 */ #board-wrap .gallery-type1{font-size:0;margin:0 auto;max-width:1200px;} #board-wrap .gallery-type1 .list{display:inline-block;width:23%;margin:0 1% 40px;} #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:30px 0 10px;font-size:16px;text-align:center;font-weight:500;border-bottom:2px solid #333;} #board-wrap .gallery-type1 .list .txt-box .tit span{display:block;margin-top:10px;font-size: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:10px;} #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:10px 0;height:0.48rem;font-size: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:1px 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:30px;} #board-wrap .gallery-type2 .list .date-box > div span{display: block;color:#898989;font-size: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:20px;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:14px;color:#898989;font-weight:500;} #board-wrap .gallery-type2 .list .content-box .txt-box .txt{display:-webkit-box;margin-top:20px;height:58px;font-size: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[slide] */ #board-wrap .gallery-swiper{} #board-wrap .gallery-swiper .swiper-slide{width:2.4rem !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:20px;} #board-wrap .gallery-swiper .swiper-slide .txt-box a .tit{color:#333;font-size:16px;font-weight:500;} #board-wrap .gallery-swiper .swiper-slide .txt-box a .txt{margin-top:20px;color:#959595;font-size:12px;word-break: break-all;} #board-wrap .gallery-swiper .swiper-slide .txt-box a .name{margin-top:20px;color:#959595;font-size:12px;} #board-wrap .gallery-swiper .swiper-slide .txt-box a .name em{display:inline-block;font-style: italic;margin-right:5px;} #board-wrap .gallery-swiper .swiper-slide:hover .txt-box a .tit{text-decoration: underline;} #board-wrap .gallery-swiper .swiper-button-prev{width:100px;height:100px;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:100px;height:100px;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-list{margin:0 auto;padding-top:10px;max-width:1200px;border-top:2px solid #333;} #board-wrap .webzine-list .list{position:relative;font-size:0;background:#fff;margin-top:20px;padding:30px 20px;min-height:1.8rem;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 .webzine-list .list:first-child{margin-top:0;} #board-wrap .webzine-list .list.has-img .txt-box{display:inline-block;box-sizing: border-box;padding-right:1.5rem;} #board-wrap .webzine-list .list .txt-box{display:block;box-sizing: border-box;} #board-wrap .webzine-list .list .txt-box a{display: block;} #board-wrap .webzine-list .list .txt-box .tit{color:#333;font-size:20px;} #board-wrap .webzine-list .list .txt-box .txt{display:-webkit-box;margin-top:10px;color:#666;font-size:14px;-webkit-box-orient: vertical;-webkit-line-clamp:2;overflow: hidden;} #board-wrap .webzine-list .list .txt-box .bottom{margin-top:20px;} #board-wrap .webzine-list .list .txt-box .bottom span{display:inline-block;margin-right:10px;color:#959595;font-size:12px;} #board-wrap .webzine-list .list .txt-box .bottom .name{} #board-wrap .webzine-list .list .txt-box .bottom .name em{display: inline-block;margin-right:5px;font-style: italic;} #board-wrap .webzine-list .list .txt-box .bottom .date{} #board-wrap .webzine-list .list .txt-box .bottom .comment{} #board-wrap .webzine-list .list .img-box{display:inline-block;position:absolute;top:50%;right:20px;transform: translateY(-50%);} #board-wrap .webzine-list .list .img-box img {width:120px;height:120px;} #board-wrap .webzine-list .list .txt-box:hover a .tit{text-decoration: underline;} /* 상세 페이지 */ #board-wrap .view{background: #fff;margin:0 auto;max-width:1200px;} #board-wrap .view .top{padding:10px 0px 20px;border-top: 2px solid #000;} #board-wrap .view .top .tit{font-size:40px;} #board-wrap .view .top .txt{position:relative;margin-top:10px;color:#898989;font-size:14px;} #board-wrap .view .top .txt span{display:inline-block;margin-right:10px;} #board-wrap .view .top .txt .name{} #board-wrap .view .top .txt .name em{font-style: italic;font-family: san-serif;display:inline-block;margin-right:5px;} #board-wrap .view .top .txt .date{} #board-wrap .view .top .txt .modify-date{} #board-wrap .view .top .txt .comment{} #board-wrap .view .top .txt .comment a{display:block;color:#ff4947;text-align: center;font-weight:500;} #board-wrap .view .top .txt .file{float:right;} #board-wrap .view .top .txt .file a{color:#898989;font-size:14px;} #board-wrap .view .view-content{padding:20px 40px;min-height:300px;border-top:1px solid #ccc;} #board-wrap .view .view-content p{color: #444;display: block;font-size: 16px;} #board-wrap .view .bottom{overflow:hidden;padding:20px 40px;border-top:1px solid #ccc;border-bottom:1px solid #ccc;} #board-wrap .view .bottom a{display:inline-block;color:#333;font-size:14px;} #board-wrap .view .bottom a span{display:inline-block;} #board-wrap .view .bottom .prev{float:left;width: 50px;position: relative;text-align: right;} #board-wrap .view .bottom .prev:before{content: "";width: 30px;height: 30px;background: url(/_public/images/@draft/sp_ico.png) no-repeat;background-size: 210px;background-position: -120px -30px;display: block;position: absolute;top: 6px;left:0;transform: rotate(-180deg);} #board-wrap .view .bottom .prev span{margin-right:10px;} #board-wrap .view .bottom .next{float:right;width: 50px;position: relative;} #board-wrap .view .bottom .next:after{content: "";width: 30px;height: 30px;background: url(/_public/images/@draft/sp_ico.png) no-repeat;background-size: 210px;background-position: -120px -30px;display: block;position: absolute;top: 6px;right:0;} #board-wrap .view .bottom .next span{margin-left:10px;} #board-wrap .view .button-group{padding:20px 0;text-align: center;} #board-wrap .view .button-group .button{display:inline-block;background: #676767;color: #fff;line-height: 50px;font-size:16px;width: 100px;} /* 쓰기 페이지 [공통 폼 스타일] */ #board-wrap .write{background:#fff;margin:0 auto;max-width:1200px;} #board-wrap .write .button-group{text-align: center;padding:40px 0;font-size:0;} #board-wrap .write .button-group .button{display:inline-block;font-size:16px;width:10rem;line-height:40px;color:#fff;background:#0085d0;margin:0 5px;} #board-wrap .write .button-group .button.cancel{background:#515151; color:#d4d4d4;} #board-wrap .form-flex{display:flex;justify-content: space-between;} #board-wrap .form-flex .cmm-form{width:48% !important;} #board-wrap .form-flex .cmm-form:first-child{width:48% !important;} #board-wrap .cmm-form{padding:20px 0;box-sizing: border-box;} #board-wrap .cmm-form .form{position:relative;overflow:hidden;border-bottom:1px solid #f3f3f3;} #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: 10px 20px;font-sizE:14px;font-weight:500;float: left;width: 90px;} #board-wrap .cmm-form .label .add-button{float: right;display: inline-block;font-size: 16px;margin-top: 2px;} #board-wrap .cmm-form .form label{position: absolute;top:-9999px;left:-9999px;} #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:40px;line-height: 80px;height:80px;} #board-wrap .cmm-form .form input.inputTitle::-webkit-input-placeholder {line-height: 80px;height:80px;font-family:serif;} #board-wrap .cmm-form .form input::placeholder{color: #ccc;} #board-wrap .cmm-form .form input.inputTitle::placeholder{font-size:40px;line-height: 40px;font-weight:bold;} #board-wrap .cmm-form .form input:focus{border:0;outline: none;} #board-wrap .cmm-form .form textarea{border:0;resize: none;padding:20px;width:100%;height:300px;box-sizing: border-box;} #board-wrap .cmm-form .form .filebox{padding:20px;} #board-wrap .cmm-form .form .filebox input[type="file"]{ position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0;} #board-wrap .cmm-form .form .filebox .upload-name{background: transparent;border: 0;} #board-wrap .cmm-form .form .filebox label{display: inline-block;position: relative;top: inherit;left: inherit;margin-left: 10px;width: 100px;line-height:normal;text-align: center;color: #3497da;font-size: 14px;font-weight: 500;background: transparent;vertical-align: top;cursor: pointer;} #board-wrap .cmm-form .form .filebox .btnRemove{float:right;font-size:16px;color:#ff4947;} #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: #ff0000;vertical-align: middle;border-radius: 15px;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 .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:-9999px;left:-9999999rem;} .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{float:right;margin-top:10px;font-size:13px;border:1px solid #ff0000;background:#fff;color:#ff0000;text-align: center;width:70px;line-height: 35px;} .reply .comment-write .input-area 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:-9999px;left:-9999px;} .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;background:#333;color:#fff;text-align: center;width:70px;line-height: 40px;} .reply .inner-reply .inner-list{padding:20px;border-bottom:1px solid #f0f0f0;} /* 페이징 */ .pagination {text-align: center;overflow: hidden;margin-top: 30px;} .pagination .active {color: #333;font-size: 16px;font-weight: bold;border-bottom: 1px solid #333; padding-bottom: 1px;} .pagination a {display: inline-block;font-size: 16px;color: #5d5d5d;margin: 0 10px;} .first-prev {position: relative;left: 23px;padding: 11px 15px;border-top: 1px solid #dbdbdb;border-left: 1px solid #dbdbdb;border-bottom: 1px solid #dbdbdb;} .prev {padding: 11px 15px;;border: 1px solid #dbdbdb;margin-right: 80px !important;} .end-next {position: relative;right: 23px;padding: 11px 15px;border-top: 1px solid #dbdbdb;border-right: 1px solid #dbdbdb;border-bottom: 1px solid #dbdbdb;} .next {padding: 11px 15px;;border: 1px solid #dbdbdb;margin-left: 80px !important;} /* 게싶판 탭 */ .board-tap {max-width: 1100px;margin: 0 auto;font-size:0;} .board-tap a {width: calc(20% - 1px);display: inline-block;text-align: center;padding: 15px 0;border-left: 1px solid #e1e1e1;border-top: 1px solid #e1e1e1;border-bottom: 1px solid #e1e1e1; font-size: 16px;font-weight: 400;color: #5d5d5d;} .board-tap a:last-child {border-right: 1px solid #e1e1e1;} .board-tap .active {background: #0d6fb8;color: #fff;border: 0;} /* faq */ .faq .contents .toggle-box {border-top: 2px solid #000;} .faq .contents .toggle-box dt {cursor: pointer;position: relative;display: block;font-size: 15px;font-weight: 400;color: #222;padding: 20px 5px 20px 45px;border-bottom: 0.01rem solid #dbdbdb;} .faq .contents .toggle-box dt:before {content: "Q";position: absolute;left:20px;font-size: 15px;font-weight: 500;color: #222;} .faq .contents .toggle-box dd:before {content: "A";position: absolute;left:22px;font-size: 15px;font-weight: 500;color: #555;} .faq .contents .toggle-box dt:after {content: "";position: absolute;top: 25px;right: 25px;width: 25px;height: 25px;background: url(/_public/images/@draft/sp_ico.png) no-repeat;background-position: -90px -38px;} .faq .contents .toggle-box dd {display: none;background: #f9f9f9;position: relative;font-size: 15px;font-weight: 400;color: #555;border-bottom: 0.01rem solid #dbdbdb;padding: 20px 5px 20px 45px;} .community .tab li{flex:1;} .community .tab li a{width:100%;display:block;}