#badm-wrap {border:0px solid #f00} #badm-wrap * {} #badm-wrap a {text-decoration:none; color:#333} #badm-wrap .inputa {border:1px solid #aaa; padding:3px} #badm-wrap select {padding:3px} #bbs-wrap {text-align:left; margin:0px auto; padding-bottom:70px; font-size:14px} #bbs-wrap * {} #bbs-wrap a {text-decoration:none; color:#333} #bbs-wrap img {border:0px none;} .bbs-blind {display:none; position;absolute;} /** 관리 폼 **/ #badm-wrap #f-table3 {width:100%; background-color:#FFF; border:1px solid #aaa; border-top:2px solid #333} #badm-wrap #f-table3 th {color:#444; width:15%; background-color:#f3f3f3; padding:8px 0px 8px 10px; text-align:left; border:1px solid #aaa;} #badm-wrap #f-table3 td {width:35%; padding:8px 0px 8px 10px; text-align:left; border:1px solid #aaa;} #badm-wrap .btns1 {background-color:#000; color:#fff; border:0px none; padding:8px 15px; font-weight:bold; font-size:13px; border-radius:2px} #badm-wrap .btns2 {background-color:#666; color:#fff; border:0px none; padding:8px 15px; font-weight:bold; font-size:13px; border-radius:2px} /** 관리 폼 **/ /* 테이블 - 마크업에 'cellspacing=0' 지정 함께 필요 */ #bbs-wrap table {border-collapse: collapse; border-spacing:0px; border:0 none;} #bbs-wrap .rss-icon {text-align:right; padding-bottom:2px} #bbs-wrap legend, #bbs-wrap caption, #bbs-wrap fieldset, #bbs-wrap form, #bbs-wrap table, #bbs-wrap th, #bbs-wrap td, #bbs-wrap p, #bbs-wrap legend, #bbs-wrap select, #bbs-wrap input, #bbs-wrap dl, #bbs-wrap dt, #bbs-wrap dd { margin:0px; padding:0px; } #bbs-wrap legend, #bbs-wrap caption {display:none; border:0 none;} /** FAQ **/ #bbs-wrap #faq-list {border-top:1px solid #dcdcdc} #bbs-wrap #faq-list .faq-no-data {border-bottom:1px solid #dcdcdc; padding:15px 0px; text-align:center;} #bbs-wrap #faq-list dl.faq-data {border-bottom:1px solid #dcdcdc; padding:15px 0px} #bbs-wrap #faq-list dl.faq-data dt.faq-title { background-repeat:no-repeat; background-position:100% 0; vertical-align:top; height:auto; font-weight:bold; position:relative;} #bbs-wrap #faq-list dl.faq-data dt.faq-title div {position:absolute; left:10px; top:0px; font-size:20px; font-weight:700} #bbs-wrap #faq-list dl.faq-data dt.faq-title a {display:block; margin-left:40px; padding:5px 0px} #bbs-wrap #faq-list dl.faq-data dd.faq-content {display:none; padding:10px 20px 20px 40px; margin-top:15px; border-top:1px dashed #dcdcdc;} /**** 리스트 페이지링크 ****/ #bbs-wrap #bbs-list-pagelink {margin:25px 0 20px 0; padding-bottom:10px; width:100%; border:0px solid #FF0000; text-align:center} #bbs-wrap #bbs-list-pagelink span {margin:0px 1px; padding:0.4em 0.8em; color:#fff; font-weight:bold; font-size:1em; border:1px solid #f60; line-height:1.5; vertical-align:middle; outline:0px none; display:inline-block; background-color:#f60} #bbs-wrap #bbs-list-pagelink a {margin:0px 1px; padding:0.4em 0.8em; line-height:1.5; font-size:1em; border:1px solid #ccc; line-height:1.5; vertical-align:middle; outline:0px none; display:inline-block} #bbs-wrap #bbs-list-pagelink a.ar {letter-spacing:-0.2em} /**** 리스트 검색 ****/ #bbs-list-search {width:100%; height:auto; border:1px solid #dcdcdc; border:1px solid #dcdcdc; background-color:#fdfdfd; padding:15px 20px} #bbs-list-search:after {clear:both; display:block; content:"";} #bbs-list-search span {width:40%; float:left; display:block} #bbs-list-search fieldset {width:auto; text-align:right; float:right; position:relative; height:auto; border:0px solid #f00; display:block} #bbs-list-search fieldset * {vertical-align:top;} #bbs-list-search fieldset input.s-input {border:1px solid #AAAAAA; width:160px; padding:8px 5px; height:32px; box-sizing:border-box; -moz-box-sizing:border-box;} #bbs-list-search fieldset input.s-btn {border:0px none; padding:5px 15px; height:32px; width:auto; background-color:#777777; color:#fff; display:inline-block; border-radius:3px} #bbs-list-search fieldset select {vertical-align: top; padding:4px; height:27px;} #bbs-list-search-faq {width:100%; height:auto; border:1px solid #dcdcdc; background-color:#fdfdfd; padding:15px 0px} #bbs-list-search-faq fieldset {width:auto; text-align:center; position:relative; height:auto; border:0px solid #f00; display:block} #bbs-list-search-faq fieldset * {vertical-align:top;} #bbs-list-search-faq fieldset input.s-input {border:1px solid #AAAAAA; width:30%; min-width:180px; max-width:250px; padding:8px 5px; height:35px;} #bbs-list-search-faq fieldset input.s-btn {border:0px none; padding:5px 20px; height:35px; width:auto; line-height:100%; background-color:#777777; color:#fff; font-weight:700; display:inline-block; border-radius:3px} #bbs-list-search-faq fieldset select {vertical-align: top; padding:4px; height:27px;} #bbs-wrap #bbs-list2 {padding:0px; margin:0px; width:100%; border-top:1px solid #999} #bbs-wrap #bbs-list2 li {list-style-type:none; padding:0px; margin:0px; position:relative;} #bbs-wrap #bbs-list2 li.blist-title {font-weight:bold; padding-top:15px; padding-bottom:15px; border-bottom:1px solid #dcdcdc} #bbs-wrap #bbs-list2 li.blist-list { padding-top:15px; padding-bottom:15px; border-bottom:1px solid #e1e1e1;} #bbs-wrap #bbs-list2 li.blist-list span.bbs-subject {text-align:left} #bbs-wrap #bbs-list2 li span {display:block; border:0px solid #f00; text-align:center;} #bbs-wrap #bbs-list2 li div.bbs-num {position:absolute; text-align:center; top:15px; left:0px; width:60px;} #bbs-wrap #bbs-list2 li div.bbs-subject {margin-left:60px; overflow:hidden; text-align:center; width:auto; text-overflow:ellipsis; white-space:nowrap; vertical-align:top;} #bbs-wrap #bbs-list2 li div.bbs-subject a {border:0px solid #f00; padding:2px; text-align:left; display:block;} #bbs-wrap #bbs-list2 li div.bbs-subject a span {display:inline} #bbs-wrap #bbs-list2 li div.bbs-etc {position:absolute; top:15px; right:0px;} #bbs-wrap #bbs-list2 li div.bbs-etc:after {clear:both; display:block; content:"";} #bbs-wrap #bbs-list2 li div.bbs-etc span.bbs-name {width:120px; float:left; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} #bbs-wrap #bbs-list2 li div.bbs-etc span.bbs-date {width:100px; float:left;} #bbs-wrap #bbs-list2 li div.bbs-etc span.bbs-hit {width:70px; float:left;} #bbs-wrap #bbs-list2 li div.bbs-etc span.bbs-check {width:40px; float:left;} #bbs-wrap #bbs-list2 li div.rm-100 {margin-right:120px} #bbs-wrap #bbs-list2 li div.rm-80 {margin-right:100px} #bbs-wrap #bbs-list2 li div.rm-55 {margin-right:70px} #bbs-wrap #bbs-list2 li div.rm-40 {margin-right:40px} #bbs-wrap #bbs-list2 li div.rm-290 {margin-right:290px} #bbs-wrap #bbs-list2 li div.rm-275 {margin-right:275px} #bbs-wrap #bbs-list2 li div.rm-235 {margin-right:235px} #bbs-wrap #bbs-list2 li div.rm-220 {margin-right:220px} #bbs-wrap #bbs-list2 li div.rm-195 {margin-right:195px} #bbs-wrap #bbs-list2 li div.rm-175 {margin-right:175px} #bbs-wrap #bbs-list2 li div.rm-180 {margin-right:180px} #bbs-wrap #bbs-list2 li div.rm-155 {margin-right:155px} #bbs-wrap #bbs-list2 li div.rm-140 {margin-right:140px} #bbs-wrap #bbs-list2 li div.rm-135 {margin-right:135px} #bbs-wrap #bbs-list2 li div.rm-120 {margin-right:125px;} #bbs-wrap #bbs-list2 li div.rm-95 {margin-right:95px} #bbs-wrap #bbs-list2 img {vertical-align:middle} #bbs-wrap #gallery-list {border-top:1px solid #dcdcdc; width:100%} #bbs-wrap #gallery-list .list-td {padding:20px 0px; border-bottom:1px solid #dcdcdc} #bbs-wrap #gallery-list .list-td .imgtd {width:240px; padding-left:15px; text-align:left} #bbs-wrap #gallery-list .list-td .imgtd img {width:200px} #bbs-wrap #gallery-list .list-td .bbs-subject {font-size:16px; margin-bottom:15px;} #bbs-wrap #gallery-list .list-td .bbs-contents {} #bbs-wrap #gallery-list .no-data {text-align:center; border-bottom:1px solid #dcdcdc; padding:25px 0px} #bbs-wrap .b-btns {border:0px solid #666; margin-bottom:3px; padding:7px 14px; border-radius:2px; background-color:#777777; color:#fff; vertical-align:middle; white-space:nowrap; display:inline-block;} #bbs-wrap .bf-btns1 {border:0px solid #666; margin-bottom:3px; cursor:pointer; padding:10px 20px; border-radius:2px; background-color:#333; color:#fff; line-height:100%; vertical-align:middle; white-space:nowrap; display:inline-block;} #bbs-wrap .bf-btns2 {border:0px solid #666; margin-bottom:3px; cursor:pointer; padding:10px 20px; border-radius:2px; background-color:#777777; color:#fff; line-height:100%; vertical-align:middle; white-space:nowrap; display:inline-block;} #bbs-wrap .b-btns-list {margin-bottom:3px; padding:10px 25px; border-radius:3px; background-color:#333; color:#fff; vertical-align:middle; white-space:nowrap; display:inline-block; cursor:pointer;} /** 글 읽기 **/ #bbs-wrap .bbs-read2 {width:auto; border-top:1px solid #dcdcdc;} #bbs-wrap .bbs-read2 .bbs-read-head {border-bottom:1px solid #dcdcdc; background-color:#fefefe} #bbs-wrap .bbs-read2 .bbs-read-head h3 {font-size:20px; line-height:110%; color:#4461f9; padding:20px 15px;} #bbs-wrap .bbs-read2 .bbs-read-head div {font-size:14px; line-height:110%; padding:0px 15px 20px 15px;} #bbs-wrap .bbs-read2 .bbs-read-head div span {padding:0px 25px; color:#999} #bbs-wrap .bbs-read2 .bbs-read-body {border:0px solid #f00; padding:35px 5px; position:relative; min-height:150px; line-height:160%} #bbs-wrap .bbs-read2 .bbs-read-body .read-ip {position:absolute; top:5px; right:10px;} #bbs-wrap .bbs-read2 .bbs-read-body p {margin-top:1px; margin-bottom:2px;} #bbs-wrap .bbs-read2 .bbs-read-body img {width:auto; max-width:100%} #bbs-wrap .bbs-read2 .bbs-read-body .thumb-img {text-align:center;} #bbs-wrap .bbs-read2 .bbs-read-body .fix-msg {text-align:center; padding:30px 0px; color:#f00} #bbs-wrap .bbs-read2 .read-file {border-top:1px solid #dcdcdc; background-color:#f9f9f9; padding:10px 5px;} #bbs-wrap .bbs-title {font-weight:bold; padding:35px 0px 2px 10px;} #bbs-wrap #bbs-commant-box {} #bbs-wrap #bbs-commant-box .bbs-commant {padding:10px 10px; border:1px solid #bbb; background-color:#fdfdfd} #bbs-wrap #bbs-commant-box .bbs-commant .commant-name {} #bbs-wrap #bbs-commant-box .bbs-commant .commant-name img {vertical-align:middle;} #bbs-wrap #bbs-commant-box .bbs-commant .commant-text {padding-top:5px; position:relative;} #bbs-wrap #bbs-commant-box .bbs-commant .commant-text div {width:auto; padding-right:70px;} #bbs-wrap #bbs-commant-box .bbs-commant .commant-text textarea {width:100%; height:60px; border-radius:0px} #bbs-wrap #bbs-commant-box .bbs-commant .commant-text .confirm-btn {position:absolute; height:66px; padding:0px; border:1px solid #666; border-left:0px none; width:61px; top:5px; right:0px;} #bbs-wrap #bbs-commant-box .bbs-commant .commant-text .confirm-btn input {display:block; width:100%; height:100%; background-color:#fcfcfc; border:0px none; font-weight:bold;} #bbs-wrap #bbs-commant-box .bbs-commant-list {border-left:1px solid #ddd; border-right:1px solid #ddd; padding:0px; margin:0px; list-style-type:none;} #bbs-wrap #bbs-commant-box .bbs-commant-list li {padding:10px; margin:0px; list-style-type:none; border-bottom:1px solid #ddd;} #bbs-wrap #bbs-commant-box .bbs-commant-list li .commant-list-name {font-weight:bold;} #bbs-wrap #bbs-commant-box .bbs-commant-list li .commant-list-content {border:0px solid #f00; padding:10px 0px;} #bbs-wrap #bbs-commant-box .bbs-commant-list li .commant-list-etc {text-align:right} #bbs-read-btn {padding-top:20px; border-top:1px solid #dcdcdc; width:auto} #bbs-read-btn #left-btn {display:inline-block; height:auto; width:50%; border:0px none} #bbs-read-btn #right-btn {display:inline-block; height:auto; width:49%; border:0px none; text-align:right} #bbs-read-btn2 {padding-top:20px; border-top:1px solid #dcdcdc; width:auto; text-align:right;} /** 포트폴리오 **/ #bbs-wrap .portfolio-list {display:flex; flex-wrap:wrap; justify-content:space-between; width:auto; padding:0 0.5%} #bbs-wrap .portfolio-list li {width:24%; margin-bottom:50px; } #bbs-wrap .portfolio-list li a {border:0px solid #f00; display:block;} #bbs-wrap .portfolio-list li a .ttle1 {padding:10px 0px; text-align:center; color:#f96} #bbs-wrap .portfolio-list li a .ttle2 {padding:0px 0px 10px 0px; text-align:center;} #bbs-wrap .portfolio-list li .thumbnail {width:auto; border-radius:10px; overflow:hidden; height:250px; border:1px solid #f8f8f8; transition:0.5s;} #bbs-wrap .portfolio-list li .thumbnail:hover {border:1px solid #4461f9} #bbs-wrap .portfolio-list li .thumbnail div {width:100%; height:100%; background-size:cover; background-position:center; transition:0.5s;} #bbs-wrap .portfolio-list li .thumbnail div:hover {transform:scale(1.15);} #bbs-wrap .sample-list {} #bbs-wrap .sample-list:after {clear:both; display:block; content:"";} #bbs-wrap .sample-list li {float:left; width:48%; margin-bottom:40px;} #bbs-wrap .sample-list li:nth-child(2) {margin-left:4%} #bbs-wrap .sample-list li:nth-child(4) {margin-left:4%} #bbs-wrap .sample-list li:nth-child(6) {margin-left:4%} #bbs-wrap .sample-list li:nth-child(8) {margin-left:4%} #bbs-wrap .sample-list li:nth-child(10) {margin-left:4%} #bbs-wrap .sample-list li:nth-child(12) {margin-left:4%} #bbs-wrap .sample-list li:nth-child(14) {margin-left:4%} #bbs-wrap .sample-list li a {border:0px solid #f00; display:block;} #bbs-wrap .sample-list li a p {padding:10px 0px; text-align:center;} #bbs-wrap .sample-list li .thumbnail {width:auto; border-radius:10px; overflow:hidden; height:100px; border:1px solid #ccc; transition:0.5s;} #bbs-wrap .sample-list li .thumbnail:hover {border:1px solid #4461f9} #bbs-wrap .sample-list li .thumbnail div {width:100%; height:100%; background-size:contain; background-repeat: no-repeat; background-position:center; transition:0.5s;} #bbs-wrap .sample-list li .thumbnail div:hover {transform:scale(1.15);} /* 라지 디바이스 (데스크탑 2) */ @media (min-width: 1024px) and (max-width: 1417px) { #bbs-wrap .portfolio-list li .thumbnail { height:220px;} } /* 미디엄 디바이스 (태블릿) */ @media (min-width: 768px) and (max-width: 1023px) { #bbs-wrap .portfolio-list { padding:0 1%} #bbs-wrap .portfolio-list li {width:32%;} #bbs-wrap .portfolio-list li .thumbnail { height:210px;} } /* 미디어 쿼리를 사용하여 화면 크기에 따라 레이아웃 조정 */ /* 스몰 디바이스 (모바일) */ @media (max-width: 767px) { #bbs-wrap #faq-list dl.faq-data {padding:10px 0px} #bbs-wrap #faq-list dl.faq-data dt.faq-title { vertical-align:top; height:auto; font-weight:bold; position:relative;} #bbs-wrap #faq-list dl.faq-data dt.faq-title div {position:absolute; left:0px; top:0px; font-size:20px; font-weight:700} #bbs-wrap #faq-list dl.faq-data dt.faq-title a {display:block; margin-left:30px; padding:5px 0px} #bbs-wrap #faq-list dl.faq-data dd.faq-content {display:none; padding:10px 5px 20px 5px; margin-top:10px; border-top:1px dashed #dcdcdc;} #bbs-wrap #bbs-list2 {border-top:1px solid #999} #bbs-wrap #bbs-list2 li {list-style-type:none; padding:0px; margin:0px; position:relative;} #bbs-wrap #bbs-list2 li.blist-title {font-weight:bold; padding-top:15px; padding-bottom:15px; border-bottom:1px solid #dcdcdc; display:none;} #bbs-wrap #bbs-list2 li.blist-list { padding-top:10px; padding-bottom:10px; border-bottom:1px solid #e1e1e1;} #bbs-wrap #bbs-list2 li.blist-list span.bbs-subject {text-align:left} #bbs-wrap #bbs-list2 li span {display:block; border:0px solid #f00; text-align:center;} #bbs-wrap #bbs-list2 li div.bbs-num {position:absolute; text-align:center; top:10px; left:0px; width:45px; padding:5px 0px} #bbs-wrap #bbs-list2 li div.bbs-subject {margin-left:45px; overflow:hidden; margin-right:5px} #bbs-wrap #bbs-list2 li div.bbs-subject a {border:0px solid #f00; padding:5px 0px; text-align:left; display:block;} #bbs-wrap #bbs-list2 li div.bbs-etc {display:none} #bbs-wrap #gallery-list .list-td {padding:20px 0px; border-bottom:1px solid #dcdcdc} #bbs-wrap #gallery-list .list-td .imgtd {width:160px; padding-left:0px; text-align:left} #bbs-wrap #gallery-list .list-td .imgtd img {width:150px} #bbs-wrap #gallery-list .list-td .bbs-subject {font-size:16px; margin-bottom:15px;} #bbs-wrap #gallery-list .list-td .bbs-contents {} #bbs-wrap .bbs-read2 {width:auto; border-top:1px solid #dcdcdc;} #bbs-wrap .bbs-read2 .bbs-read-head div span {padding:0px 15px} }