@charset "utf-8";

/* ========== 공통 START ========== */

.Board_inner button {cursor:pointer; font-family:inherit;}
.Board_inner textarea, select, input, button {appearance:none; -webkit-appearance:none; -moz-appearance:none; border-radius:0; font-size:16px; font-family:inherit;}
.Board_inner input::placeholder {font-size:16px; font-family:inherit; opacity:0.6;}
.Board_inner select {
    width: 150px;
    height: 45px;
    border: 1px solid #e0e0e0;
    padding: 0 0 0 10px;
    font-family: inherit;
    background: #fff url('../images/board/ico_select.png')no-repeat 90% 50%;
    background-size: 16px;
    cursor: pointer;
}

/* 전체 영역박스 */
.Board_inner{position:relative; max-width:1200px; min-height:500px; height:100%; margin:0 auto; font-family:'Noto Sans KR','Malgun Gothic','Roboto','dotum'; font-weight:normal;}

/* 상단 및 검색 */
.Board_sch_Wrap{display:flex; width:100%; height:100px; background:#f8f9fb; margin-bottom:30px; border-radius: 10px;}
.Board_sch {position:relative; width:auto; font-size:18px; text-align:center; padding:0 0px; margin:0 auto; margin-top:30px; }
.Board_sch select {width:130px;  height: 45px; border:1px solid #DDD; margin-right:-5px; border-radius: 6px 0 0 6px; padding-left: 14px;}
.Board_sch input {
    width: 280px;
    height: 45px;
    padding-right: 20px;
    border: 1px solid #DDD;
    border-right: none;
    font-size: 16px;
    font-family: inherit;
    padding-left: 10px;
    margin-right: -3px;
}
.Board_sch input::placeholder {color:#999;}
.Board_sch button {float:right; width: 45px; height: 45px; background: url('../images/board/ico_searchB.png') no-repeat center center;} 
.Board_sch:after {content:''; display:block; clear:both;}

/*  페이지 넘버 */
.B_paging {position:relative; width:100%; border-top:1px solid #e1e1e1; margin-top:20px;}
.B_paging_pbm {border-top:none !important; margin-top:none !important;}
.B_paging .number {display: table; margin:30px auto 0;}
.B_paging .number li {float:left;  margin-right:2px;}
.B_paging .number li:last-child {margin-right:0;}
.B_paging .number li a {display: block; width:40px; height:40px; color:#444; line-height:40px; text-align:center; background:#fff; border:1px solid #d9d9d9; box-sizing:border-box;}
.B_paging .number li.on a {background:#ffc000; color:#fff; border:none;}
.B_paging .number li a:hover {text-decoration: underline;}
.B_paging .number .prevBtnla {background:url('../images/board/arrow_first.png')no-repeat center;text-indent:-9999px;overflow: hidden;}
.B_paging .number .prevBtn {background:url('../images/board/arrow_prev.png')no-repeat center;text-indent:-9999px;overflow: hidden;}
.B_paging .number .nextBtn {background:url('../images/board/arrow_next.png')no-repeat center;text-indent:-9999px;overflow: hidden;}
.B_paging .number .nextBtnla {background:url('../images/board/arrow_last.png')no-repeat center;text-indent:-9999px;overflow: hidden;}

/*  게시판 버튼 */
.B_button {position:relative; width:100%; height:70px; margin-top:30px; padding:0 10px;}
.B_button .right_box {float:right; width:100%; height:70px; line-height:70px; text-align:right;}
.B_button .center_box {width:100%; height:70px; line-height:70px; text-align:center;}
.Btn_board {
    padding: 15px 25px;
    font-size: 16px;
    color: #666;
    border: 1px solid #d9d9d9;
    background: #fff;
    box-sizing: border-box;
    margin-left: 5px;
    transition: all 0.25s ease;
    border-radius: 5px;
}
.Btn_board:hover {color:#fff; background:#2d3e50; border:1px solid #2d3e50;}
.Btn_write {
    padding: 15px 25px;
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    background: #ffc000;
    box-sizing: border-box;
    margin-left: 5px;
    transition: all 0.25s ease;
    border-radius: 5px;
}
.Btn_write:hover {color:#fff; background:#ff7800;}
.Btn_basicR {padding:15px 40px; font-size:18px; color:#fff; background:#333; box-sizing:border-box; transition:all 0.3s ease; -webkit-transition:all 0.3s ease; border-radius:30px;}
.Btn_basicR:hover {color:#fff; background:#213c82; transition:all 0.3s ease; border-radius:30px;}
.B_button:after {content:''; display:block; clear:both;}

/* 게시글 보기 */
.View_wrap {position:relative; width:100%; overflow:hidden;}
.View_wrap h3 {
    width: 100%;
    font-size: 26px;
    color: #333;
    margin: 0px 0px 30px 0px;
    padding: 0 0px;
    font-weight: 500;
    letter-spacing: -1px;
    white-space: normal;
    line-height: 1.5;
    max-height: 3em;
    word-wrap: break-word;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}
.View_wrap h3.center {text-align:center !important;}
.View_wrap h3.mb20 {margin-bottom:20px !important;}
.View_wrap h3.titgroup {font-size:54px; margin-top:80px;}
.View_list_basic {position:relative; width:100%; min-height:60px; border-top:2px solid #666 !important; font-size:16px; padding:15px 10px; border-bottom: 1px solid #ddd;}
.View_list_basic ul {width:80%; overflow:hidden;}
.View_list_basic ul li {float:left; margin:5px 10px 5px 0;}
.View_list_basic ul li a {line-height:24px;}
.View_list_basic ul li a img {margin-right:4px;}
.View_list_basic ul li a:hover {color:#0094ce; text-decoration:underline;}
.View_list_basic ul li:first-child a img {margin-right:0px;}
.View_list_basic:after {content:''; display:block; clear:both;}
.View_list_basic .view_date {position:absolute; padding:20px 0; position: absolute; top:0px; right:10px;}
.View_list_basic .view_date .division {font-size:15px; color:#057bc5; padding-bottom:5px;}
.View_list_basic .view_date .days {position:relative; font-size:16px; color:#555; padding-right:10px;}
.View_list_basic .view_date .days:after {content: ''; position:absolute; right:0; top:50%; margin-top:-5px;  width:1px; height:12px; background-color: #c5c5c5;}
.View_list_basic .view_date .hits {font-size:16px; color:#555; padding-left:5px;}
.View_list_basic .end_date {font-size:17px;}
.View_list_basic .end_date span {color:#e4173e;}

.View_Tdate {display:flex; align-items:center; flex-wrap: wrap; width:100%;  padding:15px 10px;  border-bottom:1px solid #ddd;}
.View_Tdate .stitle{width:8%; min-width:80px; font-size:18px; font-weight:500; padding:0 20px;}
.View_Tdate span{padding-right:10px; display:inline-block;}

.View_Tlink {display:flex; align-items:center; flex-wrap: wrap; width:100%;  padding:15px 10px;  border-bottom:1px solid #ddd;}
.View_Tlink .stitle{width:8%; min-width:80px; font-size:18px; font-weight:500; padding:0 20px;}

.View_wrap .category {width:100%; padding-bottom:30px; text-align:center;} 
.View_wrap .category .claf {position:relative; font-size:18px; font-weight:500; color:#99a357; padding-right:6px;}
.View_wrap .category .sect{position:relative; font-size:18px; font-weight:500; color:#99a357; padding-left:8px; padding-right:6px;}
.View_wrap .category .sect:before {content: ''; position:absolute; left:0; top:50%; margin-top:-5px;  width:1px; height:12px; background-color: #c5c5c5}
.View_wrap .category .sect.none:before {display:none;}
.View_wrap .category .gname{position:relative; font-size:18px; font-weight:500; color:#99a357; padding-left:8px;}
.View_wrap .category .gname:before {content: ''; position:absolute; left:0; top:50%; margin-top:-5px;  width:1px; height:12px; background-color: #c5c5c5}

.view_cnt {position:relative; width:100%; /* 최소 높이 값*/ min-height:500px; padding:50px 10px; color:#666; line-height:1.8; border-bottom:1px solid #ddd; word-break: keep-all;}
.view_cnt .youtube_container {position: relative; width: 100%; height: 0; padding-bottom: 56.25%; margin-bottom:30px;} /* 보기내용 중 유튜브동영상 w100% 값적용 */
.view_cnt .youtube_container .video {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.view_cnt .view_edu_img {width:100%; text-align:center;} /* 보기내용 중 이미지 w100% 값적용 */
.view_cnt .view_edu_img img {max-width:100%;height:auto; margin-bottom:50px;}
.view_cnt .view_edu_img img:last-child {margin-bottom:0px;}
.view_cnt img {max-width:100%;height:auto;}

.view_post {width:100%}
.view_post li {position:relative; padding:20px 20px 20px 100px; border-bottom:1px solid #ddd;}
.view_post li a {height:auto; padding-left:35px; color:#666;}
.view_post li strong {position:absolute; left:35px;}
.view_post li:first-child {background: url('../images/board/post_prev.png')no-repeat 10px center;}
.view_post li:last-child {background: url('../images/board/post_next.png')no-repeat 10px center;}
.view_post .toe {display:block; overflow:hidden; height:24px; text-overflow:ellipsis; -o-text-overflow:ellipsis; white-space:nowrap; word-wrap:normal;}



/* 삼성플러스샵 설치사례 보기 */
.View_wrap h3.install_company {
    width: 100%;
    font-size: 32px;
    color: #000;
    margin:4px 0;
    padding: 0 10px;
    font-weight: 700;
    letter-spacing: -1.2px;
    white-space: normal;
    line-height: 1.5;
    max-height: 3em;
    word-wrap: break-word;
    overflow: hidden;
    display: -webkit-box;
    line-clamp:3;
    -webkit-line-clamp:3;
    -webkit-box-orient: vertical;
}
.View_wrap .category_title {display: block; padding: 0 10px; font-size: 16px; font-weight: 600; color: #666;}
.View_wrap .product_title {display: block; padding: 0 10px; font-size: 22px; font-family: 'Samsung Sharp Sans'; font-weight: 600; color: #666; margin-bottom: 20px;}



/* 게시글 쓰기 */
.Write_wrap{position:relative; width:100%; overflow:hidden;}
.Write_wrap .Wrbox {width:100%; margin-bottom:30px;}
.Write_wrap .Wrbox li {border-bottom:1px solid #e0e0e0; text-align:left;}
.Write_wrap .Wrbox li:first-child {border-top:2px solid #333;}
.Write_wrap .Wrbox li dl {padding:10px 10px;}
.Write_wrap .Wrbox li dl  dt,dd {display:inline-block; vertical-align: middle;}
.Write_wrap .Wrbox li dl dt {width:130px; font-size:16px;}
.Write_wrap .Wrbox li dl dt .point {display:inline-block; color:#ff7700;font-size:18px; font-style:normal;margin-left:5px;}
.Write_wrap .Wrbox li dl dd {width:calc(100% - 140px);}
.Write_wrap .Wrbox li dl dd .etc_text {display: block; font-size: 14px; font-weight:400; line-height: 1.6; margin-top: 6px; color: #999;}
.Write_wrap .Wrbox li dl dd input {height:40px; padding:0 10px; border:1px solid #e0e0e0; background:#f9f9f9; border-radius: 4px;}
.Write_wrap .Wrbox li dl dd input.w100 {width:100%;}
.Write_wrap .Wrbox li dl dd input.w80 {width:80%;}
.Write_wrap .Wrbox li dl dd input.w60 {width:60%;}
.Write_wrap .Wrbox li dl dd input.w30 {width:30%;}
.Write_wrap .Wrbox li dl dd input.w15 {width:15%;}
.Write_wrap .Wrbox li dl dd input.date {text-align:center;}
.Write_wrap .Wrbox li dl dd input.hit {text-align:center;}
.Write_wrap .Wrbox li dl dd input.file {margin-bottom:10px; padding:5px 0 0 0;}
.Write_wrap .Wrbox li dl dd input.file:last-child { margin-bottom:0px;}
.Write_wrap .Wrbox li dl dd input.address {margin-bottom:10px; padding:0 10px;}
.Write_wrap .Wrbox li dl dd input.address:last-child {margin-bottom:0px;}
.Write_wrap .Wrbox li dl dd button {position: relative; width:60px; height:40px; background:#2d3e50; color:#fff; font-size:14px;}
.Write_wrap .Wrbox li dl dd button:hover{background:#0490fa; transition: all 0.25s ease;}
.Write_wrap .Wrbox li dl dd textarea {width:100%; max-width:100%; min-width:100%; min-height:500px; padding:10px 10px; border:1px solid #e0e0e0; background:#fff; border-radius: 4px;}
.Write_wrap .Wrbox li dl dd textarea.sub_textarea {width:100%; max-width:100%; min-width:100%; min-height:100px; padding:10px 10px; border:1px solid #e0e0e0; background:#fff; border-radius: 4px;}
.Write_wrap .Wrbox li dl dd select {height:40px; border:1px solid #e0e0e0; margin-top:-5px; margin-left:5px; border-radius: 4px;}
.Write_wrap .Wrbox li dl dd select.mgL0{margin-left:0px;}
.Write_wrap .Wrbox li dl dd .addr {display:flex; align-items:center; margin-bottom:10px;}
.Write_wrap .Wrbox li dl dd .addr .addrleft {margin-left:4px;}
.Write_wrap .Wrbox li dl dd .email {display:flex; align-items:center; flex-wrap: wrap;}
.Write_wrap .Wrbox li dl dd .email select { margin-top: 0px;}
.Write_wrap .Wrbox li dl dd .email .at { display: inline-block; padding: 0 6px;}
.Write_wrap .Wrbox li dl dd .Eat {font-size:16px; color:#999; padding:0 4px;}
.Write_wrap .Wrbox li dl dd .Btext {font-size:16px; color:#999; padding:6px 0; word-break: keep-all;}
.Write_wrap .Wrbox li dl dd .Btext .BrNo {display:block;}
.Write_wrap .Wrbox li dl .SubjectBox{line-height: 50px;}
.Write_wrap .Texwrap {width:100%; text-align:right; padding-bottom:10px; padding-right:10px;}
.Write_wrap .Texwrap .point {color:#ff7700;}
.Write_wrap .Wrbox select {
    width: 150px;
    height: 45px;
    border: 1px solid #e0e0e0;
    padding: 0 0 0 10px;
    font-family: inherit;
    background: #fff url('../images/board/ico_select.png')no-repeat 90% 50%;
    background-size: 16px;
    cursor: pointer;
}
.Write_wrap .Wrbox input::placeholder {font-size:15px; font-family:inherit; opacity:0.6;}










/* 개인정보동의 */
.Policy_wrap {position:relative; width:100%; overflow:hidden;}
.Policy_wrap .policycheck {width:100%; padding:10px; text-align:center;}
.Policy_wrap .policyBox {width:100%; margin: 0 auto; height:150px; border:1px solid #e0e0e0; background: #f9f9f9; padding:15px; color: #333; font-size:16px; line-height:1.5; margin-top:10px; overflow:auto;}

 /* 라디오 및 체크박스 */
.checks {position: relative; height:40px; display:flex; align-items:center;}
.checks input[type="radio"] {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0;} 
.checks input[type="radio"] + label { display: inline-block; position: relative; padding-left:26px; margin-right:10px; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; user-select: none;} 
.checks input[type="radio"] + label:before { content: ''; position: absolute; left: 0; top:3px; width: 20px; height: 20px; text-align: center; background: #f9f9f9; border:1px solid #ccc; border-radius:100%;} 
.checks input[type="radio"]:checked + label:before {background: #fafafa; border-color: #e6d5b1;} 
.checks input[type="radio"]:checked + label:after { content: ''; position: absolute; top:7px; left:4px; width: 12px; height: 12px; background:#ff0004; border-radius: 100%;}
.checks {position: relative; height:40px; display:inline-block; display:flex; align-items:center;}

.checks input[type="checkbox"] {position: absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0;}
.checks input[type="checkbox"] + label {display: inline-block; position: relative; cursor: pointer; font-size:16px; color: #333; -webkit-user-select: none; -moz-user-select: none; user-select: none; margin-right:10px;}
.checks input[type="checkbox"] + label:before {content: ' '; display: inline-block; width: 20px; height: 20px; line-height: 20px; margin: -2px 8px 0 0; text-align: center; vertical-align: middle;
    background: #fff; border: 1px solid #ccc; border-radius:3px; margin-left:10px;}
.checks input[type="checkbox"]:checked + label:before {content: ''; border-color:#0374fe; background:#0374fe url("../images/board/check_on.png")no-repeat center center;}
.checks_none {display:block !important;}

/* 게사판 글쓰기 체크박스 */
.Bchecks {position: relative; height:40px; display:inline-block; display:flex; align-items:center;}
.Bchecks input[type="checkbox"] {position: absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0;}
.Bchecks input[type="checkbox"] + label {display: inline-block; position: relative; cursor: pointer; font-size:16px; color: #333; -webkit-user-select: none; -moz-user-select: none; user-select: none; margin-right:10px;}
.Bchecks input[type="checkbox"] + label:before {content: ' '; display: inline-block; width: 20px; height: 20px; line-height: 20px; margin: -2px 8px 0 0; text-align: center; vertical-align: middle;
    background: #fff8e8; border: 1px solid #e6d5b1; border-radius:3px; margin-left:10px;}
.Bchecks input[type="checkbox"]:checked + label:before {content: ''; border-color:#e6d5b1; background:#fff8e8 url("../images/icon/check_on.png")no-repeat center center;}
.Bchecks_none {display:block !important;}

/* 기타 메세지 출력 페이지 */
.Mess_wrap {position:relative; display:block; width:50%; height:auto; margin:0 auto; padding:10px; border:1px solid #ddd;  text-align:center; border-radius:10px;}
.Mess_wrap .iconbox {width:100px; height:100px; background:#2d3e50; margin:0 auto;margin-top:30px; border-radius:50px;}
.Mess_wrap .iconbox .icon { width:100%; height:100%; background:url('../images/board/icon_message.png')no-repeat center center;}
.Mess_wrap dl {margin-top: 20px;}
.Mess_wrap dl span {color:#f15804;}
.Mess_wrap dl dt {font-size:24px;padding-bottom:15px; font-weight: 500;}
.Mess_wrap dl dd {width:80%; padding-bottom:30px;}

/* 게시판 리스트 탭 메뉴 */
.Tap_wrap {position:relative; width:100%; display:flex; flex-wrap: wrap; align-items:center; justify-content:center; margin-bottom:30px;}
.Tap_wrap.Mgb0 {margin-bottom:0px !important;}
.Tap_wrap li {position:relative; flex: 1 1; text-align:center; margin-left:-1px;}
.Tap_wrap li:first-child {margin-left:1px;}
.Tap_wrap li a {display: flex; padding:15px 0; font-size:18px; align-items: center; justify-content: center; background:#fff; border:1px solid #dedede;}
.Tap_wrap li a:hover {color:#0ab6a7;} 
.Tap_wrap li.active a {border:1px solid #2c2c2c; background-color:#2c2c2c; color:#fff;} 


.BsTabBox {position: relative; padding-bottom:60px;}
.BsTabBox ul {position:relative; display:flex; flex-wrap: wrap; width:80%; border:1px solid #EEE; border-radius:27px; margin: 0 auto;}
.BsTabBox ul li {position:relative; flex: 1 1;}
.BsTabBox ul li a {display:flex; height:54px; font-size:18px; font-weight: 500; align-items:center; justify-content:center;}
.BsTabBox ul li.active {background-image: linear-gradient(115deg, #fbd302 3%, #05ac97 110%); color:#FFF; border-radius: 27px 27px;}
.BsTabBox ul li.active:before {display:none}
.BsTabBox ul li.active + li:before {display:none;}
.BsTabBox ul li + li:before {position:absolute; content: ''; display: block; width: 1px; height:16px; background: #DDD; top: 50%; left: 0; margin-top: -8px;}




/* ========== 게시판 형식별 리스트 ========== */

/* 01 일반형 게시판(자료실+공지사항) 리스트 */
.B_board_wrap {position: relative; width:100%; height:100%; overflow:hidden;}
.Bhead_Tline{ position: absolute; width: 100%; height: 2px; top:0; background: linear-gradient(to right, #f9cc23, #00cbb7);}
.Bhead {width:100%; height:auto; border-top:2px solid #666; background: #f8f9fb; border-bottom:1px solid #e1e1e1;}
.Bhead li {float:left; padding: 18px 0;font-size:17px; font-weight:500;  color:#333; text-align:center;}
.Bhead li:nth-child(5n+1) {width:7%;}
.Bhead li:nth-child(5n+2) {width:67%;}
.Bhead li:nth-child(5n+3) {width:9%;}
.Bhead li:nth-child(5n+4) {width:10%;}
.Bhead li:nth-child(5n+5) {width:7%;}
.Bbody_box {width:100%;}
.Btr {width:100%; border-bottom:1px solid #e1e1e1;}
.Btd {display:flex; width:100%; align-items: center;}
.Btd li {padding:0 10px; text-align:center; font-size:16px; /* 기본폰트 16 */ color: #333; line-height:1.8;}
.Btd li:nth-child(5n+1) {width:7%;}
.Btd li:nth-child(5n+2) {width:67%; text-align:left;}
.Btd li:nth-child(5n+3) {width:9%}
.Btd li:nth-child(5n+4) {width:10%;}
.Btd li:nth-child(5n+5) {width:7%}
.Btd li img {padding-top:5px; padding-right:5px;}
.Btd li .subject {font-size:18px; font-weight:400; line-height:1.8;}
.Btd li .flag {font-size:14px;line-height:30px;display: inline-block;margin-right:10px; line-height:30px;  font-style:normal; padding:0px 15px; background:#ff7700; border-radius:3px; color:#fff;}
.Btd li .Ftap {font-size:13px; padding:4px 6px; background:#333; color:#fff; border-radius:3px; margin-right:10px; }
.Btd li .toe {display:block; overflow:hidden;  text-overflow:ellipsis; -o-text-overflow:ellipsis; white-space:nowrap; word-wrap:normal;}/* 텍스트 자르기 */
.Btd li .look {display:none;}
.Btd li a span {padding:15px 0;}
.Btd li a:hover { color:#0383a0;}
.Btd:hover {background:#f8fbfe; transition: all .15s ease;}


/* 02 FAQ 게시판 리스트 */
.B_faq_wrap {position: relative; width:100%; height:100%; overflow:hidden;}
.B_faq_Tline {position: relative; width: 100%; height: 2px; top:0; background: linear-gradient(to right, #f9cc23, #00cbb7);}
.B_faq {position:relative; width:100%; border-bottom: 1px solid #ddd; overflow:hidden;}
.B_faq li {position:relative; border-top:1px solid #ddd; background:url('../images/board/faq_down.png')no-repeat; background-position: right 20px top 42px;}
.B_faq li.on {background: #FFF url('../images/board/faq_up.png')no-repeat; background-position: right 20px top 42px;}
.B_faq li:first-child {border-top: 0;}
.B_faq li .subText {display: none; padding: 40px 55px 54px 55px; color: #626262;  background: #f9f9f9;}
.B_faq li .subText .img {width:auto; max-width: 100%;}
.B_faq li .subText .img img {width:100%; max-width:100%;}
.B_faq li .subText .txt {font-size:16px;line-height:1.8;}
.B_faq li .subText .txt p {font-size:16px;line-height:1.8;}
.B_faq li .subText .img + .txt {margin-top: 40px;}
.B_faq li .mark {font-size:18px; display:block; padding:30px 50px; color: #333; background: url('../images/board/q.png') no-repeat 20px center;}
.B_faq li .btnBox {display:flex; align-items: center; justify-content: end;}
.B_faq li.on .mark {color:#000;background: url('../images/board/q_on.png') no-repeat 20px center;}
.B_faq li.on .subText {display: block;}


/* 03 설치사례 리스트 */
.B_install_wrap {width:100%; height:100%; overflow:hidden;}
.B_install {position:relative; display: flex; flex-wrap: wrap; width:100%;}
.B_install li {width:33.333%; min-width: 230px; padding: 0 15px; margin-bottom:50px; transition: all .25s ease;}
.B_install li .insimgBox {position: relative;  width: 100%; height: auto; margin-bottom: 26px; overflow: hidden; border-radius: 10px;}
.B_install li .insimgBox img { width: 100%; height: auto; min-height:160px; max-height: 230px; object-fit: cover;}
.B_install li .insimgBox::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 10px;
    border: 1px solid transparent;
    transition: border-color 0.25s ease; 
    box-sizing: border-box; 
}
.B_install li:hover .insimgBox::before {border-color: #000; }
.B_install li .summaryBox {width: 100%; overflow:hidden;}
.B_install li .summaryBox .category {display: block; font-size: 16px; font-weight: 600; padding-bottom: 6px; color: #666;}
.B_install li .summaryBox .title {
    width: 84%;
    font-size: 22px;
    font-weight: 600;
    padding-bottom: 6px;
    color: #000;
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    -ms-text-overflow: ellipsis;
    white-space: nowrap;
}
.B_install li .summaryBox .prod_name {
    width: 84%;
    display: block;
    font-size: 18px;
    font-weight: 400;
    color: #666;
    font-family: 'Samsung Sharp Sans';
    padding-bottom: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    -ms-text-overflow: ellipsis;
    white-space: nowrap;
}
.B_install li .summaryBox .date { position: relative; font-size: 16px; color: #a1a1a1; padding-right: 10px;}
.B_install li:hover .summaryBox .title {color: #0563c1;}





/* ***** 댓글 ***** */
.cm_wrap { width: 100%; min-height:200px; border: 1px solid #FFF; border-bottom:1px solid #DDD; margin-top: 40px;}
.cm_wrap .com_Topbox {display: flex;  width: 100%; align-items: center; justify-content: space-between; flex-wrap: wrap; font-family:'Roboto';}
.cm_wrap .com_Topbox .number {font-size: 16px; color: #000; font-weight: 400;}
.cm_wrap .com_Topbox .number b { color: #00c6b3;}
.cm_wrap .com_Topbox .etc{font-size: 14px; color: #999; }
.com_write { display: flex; align-items: center; justify-content: space-between; width: 100%; max-width: 100%; margin: 14px 0; font-family:'Roboto';}
.com_write .comment_input {
    flex: 1;
    padding: 20px;
    font-size: 16px;
    margin-right:0px;
    min-height: 100px;
    border: 1px solid #ccc;
    border-right: none;
    border-radius: 5px 0px 0px 5px;
    overflow-x: hidden;
    overflow-y: auto;
    resize: none;
    box-sizing: border-box;
}
.com_write .comment_input::placeholder { font-size: 14px; color: #999;}
.com_write .comment_button {
    padding:0% 5%;
    min-height: 100px;
    font-size: 16px;
    background-color: #00c6b3;
    color: white;
    border: none;
    border-radius: 0 5px 5px 0;
    transition: all .15s ease;
    cursor: pointer;
}
.com_write .comment_button:hover { background-color: #009182; transition: all .15s ease;}

/* 댓글 게시글 */
.com_listTop { width: 100%; display: flex; align-items: center; justify-content: space-between; font-size: 15px; font-family:'Roboto';}
.com_listTop .time_tab { display: flex;}
.com_listTop .time_tab li { padding: 0 10px; position: relative; color: #999;}
.com_listTop .time_tab li.on { font-weight: 500; color: #000;}
.com_listTop .time_tab li.Pointer { cursor: pointer;}
.com_listTop .time_tab li:before { position:absolute; content: ''; display: block; width: 1px; height:12px; background: #CCC; top: 50%; right: -1px; margin-top: -4px;}
.com_listTop .time_tab li:last-child::before { display: none;}
.com_listTop .refresh_btn { width: auto; height: 24px; padding-left: 18px; font-size: 14px; background:url('/home/homepage/images/board/refresh.png') no-repeat left top 4px; color: #666;}
.com_listWrap { width: 100%; min-height: 200px; border-top: 1px solid #DDD; margin-top: 14px;}
.com_listWrap .listBox {width: 100%; font-family: 'Roboto'; }
.com_listWrap .listBox li { width: 100%; min-height: 100px; padding: 14px 0; border-bottom: 1px solid #DDD;}
.com_listWrap .listBox li .userbox {display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; width: 100%; font-size: 14px; font-family: 'Roboto';}
.com_listWrap .listBox li .userbox .user {display: flex; align-items: center; color: #666;}
.com_listWrap .listBox li .userbox .user span { display: inline-block; font-weight:300;}
.com_listWrap .listBox li .userbox .user span.name {margin: 0px 4px 0 6px; font-size: 15px; font-weight: 400;}
.com_listWrap .listBox li .userbox .user span.date {margin-left: 6px; color: #999;}
.com_listWrap .listBox li .userbox .delete { color: #999; font-size: 14px;}
.com_listWrap .listBox li .userbox .delete:hover { color: #000;}
.com_listWrap .listBox li .contents {padding: 10px 0px 2px 30px; font-size: 15px; font-family: 'Roboto'; line-height: 1.5; letter-spacing: 0;}

/* 댓글 페이지 넘버 */
.cm_wrap .pagn_wrap { display: flex; align-items: center; justify-content: center; width: 100%; height: 80px; margin-bottom: 20px;}
.cm_wrap .pagination {position: relative; display:flex; align-items: center; justify-content: center; width: auto; height: auto;}
.cm_wrap .pagination .pagination-group {display: flex; align-items:center; justify-content: center; width: auto; height: auto;}
.cm_wrap .pagination .pagination-group > ul {display: flex; align-items: center; justify-content: center;}
.cm_wrap .pagination .pagination-group > ul > li {
    display: flex;
    align-items: center;
    justify-content: center;
    width: auto;
    height: auto;
    margin: 0px 4px;
}
.cm_wrap .pagination .pagination-group > ul > li.on .pagination-item i {font-weight: 700; color: #000; border: 1px solid #666;}
.cm_wrap .pagination .pagination-item { position: relative; display: inline-block; min-width:15px; text-align: center;}
.cm_wrap .pagination:not(.pagination-option) .pagination-item i {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    line-height: 0;
    font-size: 16px;
    font-style: normal;
    border: 1px solid #ddd;
    border-radius: 3px;
    font-size: 15px;
    color: #666;
}
.cm_wrap .pagination:not(.pagination-option) .pagination-item i.Licon { font-size:18px; border: 1px solid #DDD; transition: all .15s ease; }
.cm_wrap .pagination:not(.pagination-option) .pagination-item i.Licon:hover {border: 1px solid #000; background: #000; color: #FFF; transition: all .15s ease;}
.cm_wrap .pagination .pagination-item i:hover { font-weight:bold; color: #000; transition: all .15s ease;}









/* :::::::::::::::::::::::::::::::::::::::::::::::::: 1200px ::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
@media screen and (max-width: 1200px){

    /* 전체 영역박스 */
    .Board_inner{padding:0 20px;}

}



/* :::::::::::::::::::::::::::::::::::::::::::::::::: 1024px ::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
@media screen and (max-width: 1024px){

    /* 전체 영역박스 */
    .Board_inner{padding:0 15px;}

    /*  상단 및 검색 */
    .Board_sch {padding:0 0px;}
     
    /* 메세지 페이지 */
    .Mess_wrap {position:relative; display:block; width:80%;}
  
}



/* :::::::::::::::::::::::::::::::::::::::::::::::::: 768px ::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
@media screen and (max-width: 768px){
     
    .Board_inner {min-height:500px;}

	/*  게시판 버튼 */
    .B_button {padding:0;}
    .B_button .right_box {float:none; text-align:center;}
	.Btn_write {padding:14px 30px; font-size:16px;}
	.Btn_basicR {padding:14px 30px; font-size:16px;}
    .Btn_board {padding:14px 24px; font-size:16px; margin-left:3px;}

    /* 게시판 보기 */
    .View_wrap h3 {font-size:24px; margin:10px 0px 20px 0px; max-height: 4.5em; -webkit-line-clamp: 3; line-clamp: 3; padding-right:5px;}
	.View_wrap h3.titgroup {font-size:38px; margin-top:50px;}
	.View_list_basic .print { display:none;}
	.View_Tdate .stitle{width:auto; min-width:auto; font-size:16px; font-weight:500; padding:0 10px 0 0; text-align:left;}
    .View_Tdate span{padding-right:8px; font-size:16px; font-weight:500;}
	.View_Tdate p{font-size:16px; font-weight:500;}
    .View_Tlink .stitle{width:auto; min-width:auto; font-size:16px; font-weight:500; padding:0 10px 0 0; text-align:left}
	.View_Tlink p{font-size:16px; font-weight:500;}
	.view_post li a {height:auto; padding-left:10px; color:#666;}

	/* 게시글 쓰기 */
    .Write_wrap .Wrbox li dl dd input.w15 {width:25%;}
	.Write_wrap .Wrbox li dl dd input.w30 {width:40%;}
	.Write_wrap .Wrbox li dl dd .Btext .BrNo {display:none;}
    .Write_wrap .Wrbox li dl dd .email  { margin-top: 6px; margin-left: 0px;}
    .Write_wrap .Wrbox li dl dd .email select { margin-top: 6px; margin-left: 0px;}
    .Write_wrap .Wrbox li dl dd .email .Mgtop768  {margin-top: 6px;}

    /* 메세지 페이지 */
	.Mess_wrap {width:90%;}
	.Mess_wrap .iconbox {margin-top:20px;}
    .Mess_wrap dl {margin-top: 20px;}
    .Mess_wrap dl dt { font-size:20px;}

    /* 게시판 리스트 탭 메뉴 */ 
    .Tap_wrap li a {padding:10px 0; font-size:16px;}
	 
    .BsTabBox {padding-bottom:50px;}
    .BsTabBox ul {width:100%;}
    .BsTabBox ul li a {height:50px; font-size:16px; letter-spacing: -1px;}

    /* 01 일반형 게시판(공지사항) 리스트 */
    .Bhead{display:none}
	.Bbody_box .Btr:first-child{border-top:1px solid #e1e1e1;}
	.Btd{display:block; width:100%; padding-bottom:15px;}
    .Btd li:nth-child(5n+1) {display:none;}
    .Btd li:nth-child(5n+2) {width:100%;}
    .Btd li:nth-child(5n+3) {float:left; width:auto; height:20px; padding:0px 5px 0 10px; font-size: 15px; color: #a1a1a1; line-height:1.5;}
	.Btd li:nth-child(5n+3):after{content: ''; position:absolute;  margin-left:7px; margin-top:5px;  width:1px; height:12px; background-color: #e1e1e1;}
    .Btd li:nth-child(5n+4) {float:left; width:auto; padding:0px 10px; font-size: 15px; color: #a1a1a1; line-height:1.5;}
	.Btd li:nth-child(5n+4):after{content: ''; position:absolute;  margin-left:7px; margin-top:5px;  width:1px; height:12px; background-color: #e1e1e1;}
    .Btd li:nth-child(5n+5) {float:left; width:auto; padding:0px 5px; font-size: 15px; color: #a1a1a1; line-height:1.5;}
	.Btd li .look {display:inline-block;}
	.Btd li a span {padding:15px 0 4px 0;}

    /* 03 설치사례 리스트 */
    .B_install li {width:50%; padding: 0 10px; margin-bottom:50px;}
    .B_install li .insimgBox {margin-bottom: 20px;}
    .B_install li .summaryBox .title {font-size: 20px;}

}



/* :::::::::::::::::::::::::::::::::::::::::::::::::: 674px ::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
@media screen and (max-width: 674px){
     
    /*  페이지 넘버 */ 
    .B_paging {border-top:none}  /* 게시판 별 상단 border-top값 사용 체크 */
    .B_paging .number li a {display: block; width:35px; height:35px; line-height:35px;}


    /* 서브 탭 메뉴 */
    .BsTabBox {position: relative; padding-bottom:30px;}
    .BsTabBox ul {flex-wrap: wrap; border-radius:25px;}
    .BsTabBox ul li {flex:100%;}
    .BsTabBox ul li a {height: 40px;}
    .BsTabBox ul li.active {border-radius: 25px; margin: 0px;}
    .BsTabBox ul li + li:before {display: none;}


    /* 게시판 보기 */
    .View_wrap h3 {font-size:18px; margin:0px 0px 30px 0px;}
	.View_list_basic ul {width:100%; overflow:hidden;}
	.View_list_basic ul li a {font-size:15px;}
    .View_list_basic .view_date {position:absolute; padding:20px 0; position: absolute; top:-50px; right:10px;}
	.view_cnt {min-height:400px; padding:30px 0  50px;}
	.view_post li a {height:auto; padding-left:10px; color:#666;}

    /* 게시글 쓰기 */
    .Write_wrap .Wrbox {margin-bottom:10px;}
	.Write_wrap .Wrbox li dl dt {width:100px; font-size:16px;}
	.Write_wrap .Wrbox li dl dd {width:calc(100% - 110px);}
    .Write_wrap .Wrbox li dl dd input.w30 {width:60%;}
	.Write_wrap .Wrbox li dl dd input.di_block {width:50% !important;}
    .Write_wrap .Wrbox li dl dd select.w30_seletc {width:30% !important;}
    .Write_wrap .Wrbox li dl dd input.w15 {width:50%;}
    .Write_wrap .Wrbox li dl dd textarea {width:100%; min-height:300px}
	.Write_wrap .Wrbox li dl dd .Wmb {margin-bottom:10px;}

	/* 메세지 페이지 */
	.Mess_wrap {width:100%;}
    .Mess_wrap .Mbr_no {display:none}

}



/* :::::::::::::::::::::::::::::::::::::::::::::::::: 500px ::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
@media screen and (max-width: 500px){
     
	/*  상단 및 검색 */
    .Board_sch_Wrap{height:auto; background:#fff;}
	.Board_sch {width:100%;}
    .Board_sch input {width:55%;}
    .Board_sch select { width:35.42%;}
	.Board_sch button {width:9.58%;}
    .Board_sch .total{display:none;}
	
	/*  페이지 넘버 */
    .B_paging .number .prevBtnla {display:none}
    .B_paging .number .nextBtnla {display:none}

	/*  게시판 버튼 */
	.Btn_write {padding:12px 24px;}
    .Btn_board {padding:8px 16px; margin-left:3px}

    /* 게시글 쓰기 */
    .Write_wrap .Wrbox li dl dt{width:80%; margin-bottom:10px;}
    .Write_wrap .Wrbox li dl dt.hide480{display:none}
	.Write_wrap .Wrbox li dl dd {width:100%}
    .Write_wrap .Wrbox li dl dd input.w30{width:80%;}
    .Write_wrap .Wrbox li dl dd input.w15{width:50%;}
	.Write_wrap .Wrbox li dl dd input.di_block{width:70% !important;}
	.Write_wrap .Wrbox li dl dd textarea { width:100%; min-height:200px}
	.Write_wrap .Wrbox li dl dd textarea.sub_textarea{height:150px;}
	.Write_wrap .Wrbox li dl dd select{margin-top:0px; margin-left:0px;}
	.Write_wrap .Wrbox li dl dd .Wmb2{margin-bottom:10px;}
	
	/* 게시판 리스트 탭 메뉴 */
    .Tap_wrap {margin-bottom:30px;}
    .Tap_wrap li {flex:100%; margin-left:0px; margin-top:-1px;}
    .Tap_wrap li:first-child {margin-left:1px;}
    .Tap_wrap li a { padding:8px 0; font-size:15px;}


    /* 02 FAQ 게시판 리스트 */
    .B_faq li {background-position: right 15px top 42px;}
    .B_faq li.on {background-position: right 15px top 42px;}
    .B_faq li .subText {padding:20px;}
    .B_faq li .subText .img {width:auto; max-width: 100%;}
    .B_faq li .mark {font-size:18px; padding:30px 35px; background: url('../images/board/q.png') no-repeat 5px center;}
    .B_faq li.on .mark {background: url('../images/board/q_on.png') no-repeat 5px center;}

    /* 03 설치사례 리스트 */
    .B_install li {width:100%; padding: 0 10px; margin-bottom:50px;}
    .B_install li .insimgBox {margin-bottom: 20px;}
    .B_install li .summaryBox .title {font-size: 20px;}


}



/* :::::::::::::::::::::::::::::::::::::::::::::::::: 360px ::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
@media screen and (max-width: 360px){

	/*  상단 및 검색 */
	.Board_sch {width:100%;}
    .Board_sch input {width:50%;}
    .Board_sch select { width:36.355%;}
	.Board_sch button {width:13.645%;}
    .Board_sch .total{display:none;}
   
 	/* 게시글 쓰기 */
	.Write_wrap .Wrbox li dl dd input.w80{width:100%;}
    .Write_wrap .Wrbox li dl dd input.w60{width:100%;}
    .Write_wrap .Wrbox li dl dd input.w30{width:100%;}
    .Write_wrap .Wrbox li dl dd input.w15{width:100%;}
    .Write_wrap .Wrbox li dl dd .email .at { display: none;}

  }



/* :::::::::::::::::::::::::::::::::::::::::::::::::: 320px ::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
@media screen and (max-width: 320px){

	select {font-size:14px; font-family:inherit;}

	/*  상단 및 검색 */
	.Board_sch {width:100%;}
    .Board_sch input {width:50%; font-size:14px; padding-right:0;}
    .Board_sch select { width:35.355%;}
	.Board_sch button {width:13.645%; border-right:1px solid #bababa;}

    /* 라디오 및 체크박스 */
	.checks input[type="radio"] + label { display:block; margin-bottom:10px;}
    .checks {position: relative; height:80px; display:block; align-items:center; }

  }