/*서브*/ @import url("reset.css"); .form {} .form .input-area {width:100%; font-size:0; margin-top:8px; position:relative;} .form .input-area:nth-child(1) {margin-top:0;} .form .input-area > * {display:inline-block; vertical-align:middle;} .form .input-area.tel > * {width:calc((100% - 16px) / 3); margin-left:8px; max-width:100px;} .form .input-area.tel > *:nth-child(1) {width:calc(((100% - 16px) / 3) - 1px); margin-left:0;} .form .input-area.phone > * {width:calc((100% - 24px) / 4); margin-left:8px; max-width:100px;} .form .input-area.phone > *:nth-child(1) {width:calc(((100% - 24px) / 4) - 1px); margin-left:0;} .form .input-area.phone .btn {height:44px; background:#666;} .form .input-area.phone .btn a {display:block; text-align:center; font-size:16px; color:#fff; line-height:44px;} .form .input-area.col-2 > * {width:calc((100% - 8px) / 2); margin-left:8px;} .form .input-area.col-2 > *:nth-child(1) {width:calc(((100% - 8px) / 2) - 1px); margin-left:0;} .form .input-area.col-3 > * {width:calc((100% - 16px) / 3); margin-left:8px;} .form .input-area.col-3 > *:nth-child(1) {width:calc(((100% - 16px) / 3) - 1px); margin-left:0;} .form .input-area.addfile [type="file"] {width:0; height:0; opacity:0; position:absolute; left:0; top:0;} .form .input-area.addfile .file-txt {width:calc(100% - 96px); margin-right:8px; height:44px; border:1px solid #e4e4e4; background:#fafafa; padding:0 10px; font-size:16px; line-height:42px; color:#BDBDBD; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .form .input-area.addfile .btn-addfile {width:88px; height:44px; background:#666; cursor:pointer; text-align:center; font-size:16px; line-height:44px; color:#fff;} .form .input-area.security > * {margin-left:8px;} .form .input-area.security > *:nth-child(1) {margin-left:0;} .form .input-area.security .img-box {width:100px; height:44px; border:1px solid #e4e4e4; background:#FAFAFA; padding:0 5px;} .form .input-area.security .img-box span {display:block; width:100%; height:0; padding-bottom:calc(44 / 100 * 100%); position:relative;} .form .input-area.security .img-box span img {max-width:100%; position:absolute; left:50%; top:50%; -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); transform:translate(-50%,-50%);} .form .input-area.security .input-box {width:calc(100% - 108px);} .form .input-area.certification > * {margin-left:8px;} .form .input-area.certification > *:nth-child(1) {margin-left:0;} .form .input-area.certification .input-box {width:calc(100% - 128px);} .form .input-area.certification .btn {width:120px; height:44px; background:#666;} .form .input-area.certification .btn a {display:block; text-align:center; font-size:16px; color:#fff; line-height:44px;} .form .input-area.date-select > * {margin-left:8px;} .form .input-area.date-select > *:nth-child(1) {margin-left:0;} .form .input-area.date-select .fix-txt {width:calc(100% - 52px);} .form .input-area.date-select .btn-delete {width:44px; height:44px; border:1px solid #E4E4E4; background:url(/img/com/delete.svg) center no-repeat; background-size:15px auto;} .form .input-area.date-select .btn-delete a {display:block; width:100%; height:100%; font-size:0;} .form .input-area.addr > * {margin-left:8px;} .form .input-area.addr > *:nth-child(1) {margin-left:0;} .form .input-area.addr .input-box {width:calc(100% - 88px);} .form .input-area.addr .btn {width:80px; height:44px; background:#666;} .form .input-area.addr .btn a {display:block; text-align:center; font-size:16px; color:#fff; line-height:44px;} /*.form .input-box {}*/ .form .input-box [type="text"], .form .input-box [type="password"] {width:100%; height:44px; background:#fff; border:1px solid #E4E4E4; font-size:16px; padding:0 10px; -webkit-appearance:none; -webkit-border-radius:0;} .form .input-box input::placeholder {color:#BDBDBD;} .form .input-box input:focus {border-color:#202020;} .form .input-box textarea {width:100%; min-height:150px; box-sizing:border-box; background:#fff; border:1px solid #e4e4e4; padding:10px; font-size:16px; resize:none;} .form .input-box textarea::placeholder {color:#BDBDBD;} .form .fix-val {height:44px; background:#FAFAFA; border:1px solid #E4E4E4; padding:0 10px; font-size:16px; line-height:42px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .form .fix-txt {height:44px; background:#FAFAFA; border:1px solid #E4E4E4; padding:0 10px;} .form .fix-txt > .wrap {display:table-cell; vertical-align:middle; font-size:0;} .form .fix-txt > .wrap > * {display:inline-block; vertical-align:middle; margin-left:5px; font-size:16px; line-height:42px;} .form .fix-txt > .wrap > *:nth-child(1) {margin-left:0;} .form .form-inner {width:100%; max-width:800px; margin:0 auto; border-radius:8px; background:#fff; padding:60px 100px;} .form .form-wrap {width:100%;} .form .form-wrap .form-box {width:100%; margin-top:40px;} .form .form-wrap .form-box:nth-child(1) {margin-top:0;} .form .form-wrap .form-box h2 {font-size:24px; font-weight:700; margin-bottom:20px;} .form .form-wrap .form-box h2 span {display:inline-block; position:relative;} .form .form-wrap .form-box h2 span.required:after {content:"*"; font-size:16px; font-weight:400; color:#EE1621; display:inline-block; vertical-align:top; margin-left:3px;} .form .form-wrap .form-box .txt {font-size:14px; font-weight:400; color:#666; margin-top:5px;} .form .form-tb {width:100%;} .form .form-tb li.tr {width:100%; font-size:0; margin-top:20px;} .form .form-tb li.tr:nth-child(1) {margin-top:0;} .form .form-tb li.tr > * {display:inline-block; vertical-align:top; font-size:16px;} .form .form-tb li.tr .th {width:175px; padding:10px 10px 0 0;} .form .form-tb li.tr .th span.required {position:relative;} .form .form-tb li.tr .th span.required:after {content:"*"; color:#EE1621;} .form .form-tb li.tr .td {width:calc(100% - 175px);} .form .form-tb li.tr .td .txt {display:block; width:100%; font-size:14px; color:#666; margin-top:8px;} .form .form-tb li.tr.wid .th {width:100%;} .form .form-tb li.tr.wid .td {width:100%;} .form .form-tb li.tr .head {width:175px; color:#666;} .form .form-tb li.tr .conts {width:calc(100% - 175px); font-weight:500;} .form .form-tb li.tr .td span.point {position:relative;} .form .form-tb li.tr .td span.point:before {content:"* "; color:#EE1621;} .form .button-box, .board .button-box {width:100%; margin-top:30px; font-size:0; text-align:center;} .form .button-box > *, .board .button-box > * {display:inline-block; vertical-align:middle; margin-left:8px;} .form .button-box > *:nth-child(1), .board .button-box > *:nth-child(1) {margin-left:0;} .form .button-box.ty-l, .board .button-box.ty-l {text-align:left;} .form .button-box.ty-r, .board .button-box.ty-r {text-align:right;} .form .bd-btn-box, .board .bd-btn-box {width:100%; margin-top:20px; font-size:0;} .form .bd-btn-box > *, .board .bd-btn-box > *{display:inline-block; vertical-align:middle; font-size:0;} .form .bd-btn-box > *:only-child, .board .bd-btn-box > *:only-child {width:100%;} .form .bd-btn-box > *:first-child:nth-last-child(2), .form .bd-btn-box > *:first-child:nth-last-child(2) ~ * {width:50%;} .board .bd-btn-box > *:first-child:nth-last-child(2), .board .bd-btn-box > *:first-child:nth-last-child(2) ~ * {width:50%;} .form .bd-btn-box .rt-box, .board .bd-btn-box .rt-box {text-align:right;} .form .bd-btn-box .rt-box, .board .bd-btn-box .rt-box > * {display:inline-block; vertical-align:middle;} .form .bd-btn-box .bd-btn, .board .bd-btn-box .bd-btn {display:inline-block; vertical-align:middle; margin-left:8px; min-width:70px; height:36px; border-radius:4px; background:#fff; border:1px solid #e4e4e4; overflow:hidden; text-align:center;} .form .bd-btn-box .bd-btn:nth-child(1), .board .bd-btn-box .bd-btn:nth-child(1) {margin-left:0;} .form .bd-btn-box .bd-btn a, .board .bd-btn-box .bd-btn a {display:block; font-size:16px; color:#666; line-height:34px; padding:0 10px;} .form .bd-btn-box .bd-btn.fill, .board .bd-btn-box .bd-btn.fill {border-color:#666; background:#666;} .form .bd-btn-box .bd-btn.fill a, .board .bd-btn-box .bd-btn.fill a {color:#fff;} .form .bd-btn-box .input-box {height:36px;} .form .bd-btn-box .input-box input {height:100%;} .form .val-box {min-height:44px; display:flex; align-items:center;} .board .board-paging {width:100%; margin-top:40px;} .board .board-paging ul {width:100%; font-size:0; text-align:center;} .board .board-paging ul li {display:inline-block; vertical-align:middle; margin-left:4px; min-width:36px; height:36px; position:relative;} .board .board-paging ul li:nth-child(1) {margin-left:0;} .board .board-paging ul li a {display:block; width:100%; height:100%; font-family: 'Poppins', sans-serif; font-size:16px; line-height:36px; color:#666; position:relative; z-index:10;} .board .board-paging ul li.nav a {color:#202020;} .board .board-paging ul li.on:before {content:""; width:100%; height:100%; border-radius:18px; background:#009554; position:absolute; left:0; top:0; z-index:0;} .board .board-paging ul li.on a {color:#fff;} .board .board-paging ul li.nav.prev {margin-right:10px;} .board .board-paging ul li.nav.next {margin-left:10px;} .board .board-search {width:100%; display:flex; flex-wrap:wrap; align-items:center; flex-direction: row-reverse; margin-bottom:40px;} .board .board-search > * {width:50%;} .board .board-search .search-box {font-size:0; text-align:right;} .board .board-search .search-box > * {display:inline-block; vertical-align:middle; margin-left:8px;} .board .board-search .search-box > *:nth-child(1) {margin-left:0;} .board .board-search .search-box .select-box {width:130px;} .board .board-search .search-box .input-box {width:calc(100% - 138px); font-size:0; height:44px; border:1px solid #e4e4e4; background:#fff; max-width:280px;} .board .board-search .search-box .input-box > * {display:inline-block; vertical-align:middle;} .board .board-search .search-box .input-box [type=text] {width:calc(100% - 42px); height:100%; box-sizing:border-box; font-size:16px; padding:0 10px; border:none; background:none; text-align:left;} .board .board-search .search-box .input-box .btn-search {width:42px; height:100%; background:url(/img/conts/icon_search.svg) center no-repeat;} .board .board-search .search-box .input-box .btn-search a {display:block; width:100%; height:100%; font-size:0;} .board .board-search .total-box {font-size:16px;} .board .board-search .total-box em {font-weight:700; color:#009554;} .board .board-list {width:100%;} .board .board-list .list-tb {width:100%;} .board .board-list .faq-tb {border-top:2px solid #202020;} .board .board-list .faq-tb li {width:100%; position:relative; border-bottom:1px solid #e4e4e4;} .board .board-list .faq-tb li > div {width:100%; position:relative; padding:20px 10px; display:table;} .board .board-list .faq-tb li > div span {position:relative; padding-left:50px; position:relative; display:table-cell; vertical-align:top; font-size:16px;} .board .board-list .faq-tb li > div span:before {width:36px; height:36px; border-radius:50%; background:#FAFAFA; text-align:center; font-family: 'Poppins', sans-serif; font-size:18px; line-height:36px; position:absolute; left:0; top:-4px;} .board .board-list .faq-tb li .question {height:70px; background:#fff; cursor:pointer;} .board .board-list .faq-tb li .question:after {content:""; width:10px; height:10px; box-sizing:border-box; border:solid #202020; border-width:0 1px 1px 0; position:absolute; right:20px; top:calc(50% - 2px); -webkit-transform:translateY(-50%) rotate(45deg); -moz-transform:translateY(-50%) rotate(45deg); transform:translateY(-50%) rotate(45deg); transition:transform .25s ease-in-out;} .board .board-list .faq-tb li .question span {width:calc(100% - 30px); font-weight:700;} .board .board-list .faq-tb li .question span:before {content:"Q"; font-weight:400;} .board .board-list .faq-tb li .ask {background:#FAFAFA; color:#666; display:none;} .board .board-list .faq-tb li .ask .ask-conts {height:130px; display:table;} .board .board-list .faq-tb li .ask .ask-conts span {display:table-cell; vertical-align:top;} .board .board-list .faq-tb li .ask span:before {content:"A"; background:#fff; color:#009554;} .board .board-list .faq-tb li.active .question:after {top:calc(50% + 1px); -webkit-transform:translateY(-50%) rotate(225deg); -moz-transform:translateY(-50%) rotate(225deg); transform:translateY(-50%) rotate(225deg); border-color:#009554;} .board .board-list .faq-tb li.active .question span, .board .board-list .faq-tb li:hover .question span {color:#009554;} .board .board-list .faq-tb li.active .question span:before, .board .board-list .faq-tb li:hover .question span:before {background:#009554; color:#fff;} .board .board-list .list-tb.ty-1 {width:100%; font-size:0; margin-top:-40px;} .board .board-list .list-tb.ty-1 li {display:inline-block; vertical-align:top; margin-left:28px; margin-top:40px; width:calc((100% - 84px) / 4);} .board .board-list .list-tb.ty-1 li:nth-child(4n+1) {margin-left:0; width:calc(((100% - 84px) / 4) - 1px);} .board .board-list .list-tb.ty-1 li a {display:block; width:100%; height:100%; position:relative;} .board .board-list .list-tb.ty-1 li a:before, .board .board-list .list-tb.ty-1 li a:after {content:""; width:0; height:0; position:absolute; transition:height .15s ease-ou, width .15s .15s ease-out, border-color .15s .3s; border:6px solid transparent; box-sizing:border-box; z-index:1;} .board .board-list .list-tb.ty-1 li a:before {left:0; top:0;} .board .board-list .list-tb.ty-1 li a:after {right:0; bottom:0;} .board .board-list .list-tb.ty-1 li a:hover:before, .board .board-list .list-tb.ty-1 li a:hover:after {width:100%; height:100%;} .board .board-list .list-tb.ty-1 li a:hover:before {border-top-color:#009554; border-right-color:#009554; transition:width .15s ease-out, height .15s .15s ease-out;} .board .board-list .list-tb.ty-1 li a:hover:after {border-bottom-color:#009554; border-left-color:#009554; transition:border-color 0s .3s ease-out, width .15s .3s ease-out, height .15s .45s ease-out;} .board .board-list .list-tb.ty-1 li .list-wrap {width:100%; height:374px; position:relative; background:#fff; border:1px solid #e4e4e4;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts .category {font-size:14px; font-weight:700; color:#72BB6F; margin-bottom:10px; display:block;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts .subject {font-size:18px; font-weight:700; margin-bottom:10px; overflow:hidden; text-overflow:ellipsis;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts .conts {font-size:16px; color:#666; overflow:hidden; text-overflow:ellipsis;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts .date {font-family: 'Poppins', sans-serif; font-size:14px; color:#AAA; position:absolute; left:30px;} .board .board-list .list-tb.ty-1 li .list-wrap .thumnail {width:100%;} .board .board-list .list-tb.ty-1 li .list-wrap .thumnail span {display:block; width:100%; height:0; padding-bottom:calc(199 / 299 * 100%); position:relative; overflow:hidden;} .board .board-list .list-tb.ty-1 li .list-wrap .thumnail span img {position:absolute; left:50%; top:50%; -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); transform:translate(-50%,-50%); z-index:0;} .board .board-list .list-tb.ty-1 li .list-wrap .thumnail.ty-1 span img {width:auto; height:100%;} .board .board-list .list-tb.ty-1 li .list-wrap .thumnail.ty-2 span img {width:100%; height:auto;} .board .board-list .list-tb.ty-1 li .list-wrap > *:only-child {padding:40px 30px;} .board .board-list .list-tb.ty-1 li .list-wrap > *:only-child .subject {height:54px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;} .board .board-list .list-tb.ty-1 li .list-wrap > *:only-child .conts {height:72px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical;} .board .board-list .list-tb.ty-1 li .list-wrap > *:only-child .date {bottom:40px;} .board .board-list .list-tb.ty-1 li .list-wrap > *:first-child:nth-last-child(2) ~ .list-conts {padding:20px 30px;} .board .board-list .list-tb.ty-1 li .list-wrap > *:first-child:nth-last-child(2) ~ .list-conts .subject {white-space:nowrap;} .board .board-list .list-tb.ty-1 li .list-wrap > *:first-child:nth-last-child(2) ~ .list-conts .conts {white-space:nowrap;} .board .board-list .list-tb.ty-1 li .list-wrap > *:first-child:nth-last-child(2) ~ .list-conts .date {bottom:20px;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts-box {width:100%; margin-top:20px;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts-box .subject {font-size:18px; font-weight:700; margin-bottom:8px; width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts-box .subject a {font-size:18px; font-weight:700; display:inline-block; vertical-align:middle; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts-box .subject a:before, .board .board-list .list-tb.ty-1 li .list-wrap .list-conts-box .subject a:after {display:none;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts-box .date {font-family: 'Poppins', sans-serif; font-size:14px; color:#AAA;} .board .board-list .list-tb.ty-1 li .list-wrap.ty-2 {height:auto; border:none;} .board .board-list .list-tb.ty-1 li .list-wrap.ty-2 .thumnail span {padding-bottom:100%;} .board .board-list .list-tb.ty-1 li .list-wrap.ty-2 .thumnail a:before, .board .board-list .list-tb.ty-1 li .list-wrap.ty-2 .thumnail a:after {border-width:6px; z-index:20;} .board .board-view {width:100%;} .board .board-view .view-tb {width:100%; border-top:2px solid #202020;} .board .board-view .view-tb .tr {width:100%; border-bottom:1px solid #e4e4e4; padding:0 60px;} .board .board-view .view-tb .tr .th {padding:30px 0; text-align:center;} .board .board-view .view-tb .tr .th .category {width:100%; display:block; font-size:14px; font-weight:700; color:#72BB6F; margin-bottom:8px;} .board .board-view .view-tb .tr .th .subject {font-size:24px; font-weight:700; margin-bottom:8px;} .board .board-view .view-tb .tr .th .info {width:100%; font-size:0;} .board .board-view .view-tb .tr .th .info span {display:inline-block; vertical-align:middle; margin-left:20px; position:relative; font-size:16px; font-family:'Poppins', 'Noto Sans KR', sans-serif;} .board .board-view .view-tb .tr .th .info span:nth-child(1) {margin-left:0;} .board .board-view .view-tb .tr .th .info span.hit {padding-left:30px;} .board .board-view .view-tb .tr .th .info span.hit:before {content:""; width:22px; height:100%; background:url(/img/conts/icon_hit.svg) center no-repeat; background-size:100% auto; position:absolute; left:0; top:0;} .board .board-view .view-tb .tr .td {padding:60px 0;} .board .board-view .view-tb .tr .td .view-conts {font-size:16px; color:#666;} .board .board-view .view-tb .tr .td .view-conts img {max-width:100%;} .form .hide-box {width:100%; font-size:16px; margin-top:10px; display:none;} .form .hide-box a {font-size:15px; position:relative;} .form .hide-box a:before {content:"* "; color:#EE1621;} .form .hide-box.active {display:block;} @media screen and (max-width: 1280px){ .board .board-list .list-tb.ty-1 li {margin-left:20px; width:calc((100% - 60px) / 4);} .board .board-list .list-tb.ty-1 li:nth-child(4n+1) {margin-left:0; width:calc(((100% - 60px) / 4) - 1px);} .board .board-list .list-tb.ty-1 li .list-wrap {height:360px;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts .date {left:20px;} .board .board-list .list-tb.ty-1 li .list-wrap > *:only-child {padding:40px 20px;} .board .board-list .list-tb.ty-1 li .list-wrap > *:first-child:nth-last-child(2) ~ .list-conts {padding:20px;} } @media screen and (max-width: 1024px){ .form .form-wrap .form-box h2 {font-size:22px;} .form .form-tb li.tr .th {width:160px;} .form .form-tb li.tr .td {width:calc(100% - 160px);} .form .form-tb li.tr .head {width:160px;} .form .form-tb li.tr .conts {width:calc(100% - 160px);} .board .board-list .list-tb.ty-1 li {margin-left:20px; width:calc((100% - 40px) / 3);} .board .board-list .list-tb.ty-1 li:nth-child(odd), .board .board-list .list-tb.ty-1 li:nth-child(even) {width:calc((100% - 40px) / 3); margin-left:20px;} .board .board-list .list-tb.ty-1 li:nth-child(3n+1) {margin-left:0; width:calc(((100% - 40px) / 3) - 1px);} .board .board-view .view-tb .tr {padding:0 50px;} .board .board-view .view-tb .tr .th {padding:25px 0;} .board .board-view .view-tb .tr .th .category {font-size:13px;} .board .board-view .view-tb .tr .th .subject {font-size:20px;} .board .board-view .view-tb .tr .th .info span {font-size:15px;} .board .board-view .view-tb .tr .th .info span.hit {padding-left:27px;} .board .board-view .view-tb .tr .th .info span.hit:before {width:20px;} .board .board-view .view-tb .tr .td {padding:50px 0;} .board .board-view .view-tb .tr .td .view-conts {font-size:15px;} } @media screen and (max-width: 900px){ .board .board-search > * {width:100%;} .board .board-search .total-box {text-align:right; margin-top:10px;} } @media screen and (max-width: 768px){ .form .input-area.phone .btn a {font-size:15px;} .form .input-area.addfile .file-txt {font-size:15px;} .form .input-area.addfile .btn-addfile {font-size:15px;} .form .input-area.certification .btn a {font-size:15px;} .form .input-area.addr .btn a {font-size:15px;} .form .input-box [type="text"], .form .input-box [type="password"] {font-size:15px;} .form .input-box textarea {min-height:120px; font-size:15px;} .form .fix-val {font-size:15px;} .form .fix-txt > .wrap > * {font-size:15px;} .form .form-inner {padding:60px 40px; -webkit-box-shadow:0 3px 6px 0 rgba(0,0,0,0.16); -moz-box-shadow:0 3px 6px 0 rgba(0,0,0,0.16); box-shadow:0 3px 6px 0 rgba(0,0,0,0.16);} .form .form-wrap .form-box {margin-top:30px;} .form .form-wrap .form-box h2 {font-size:20px; margin-bottom:15px;} .form .form-wrap .form-box h2 span.required:after {font-size:15px;} .form .form-wrap .form-box .txt {font-size:13px;} .form .form-tb li.tr > * {font-size:15px;} .form .form-tb li.tr .th {width:130px; padding:11px 8px 0 0;} .form .form-tb li.tr .td {width:calc(100% - 130px);} .form .form-tb li.tr .td .txt {font-size:13px;} .form .form-tb li.tr .head {width:130px;} .form .form-tb li.tr .conts {width:calc(100% - 130px);} .form .bd-btn-box .bd-btn a, .board .bd-btn-box .bd-btn a {font-size:15px;} .board .board-paging {margin-top:30px;} .board .board-paging ul li a {font-size:15px;} .board .board-search {margin-bottom:30px;} .board .board-search .search-box .input-box [type=text] {font-size:15px;} .board .board-search .total-box {font-size:15px;} .board .board-list .faq-tb li > div span {padding-left:45px; font-size:15px;} .board .board-list .faq-tb li > div span:before {width:32px; height:32px; font-size:17px; line-height:32px;} .board .board-list .faq-tb li .question {height:64px;} .board .board-list .faq-tb li .question:after {width:8px; height:8px; right:15px;} .board .board-list .faq-tb li .question span {width:calc(100% - 25px);} .board .board-list .faq-tb li .ask .ask-conts {height:110px;} .board .board-list .list-tb.ty-1 {margin-top:-30px;} .board .board-list .list-tb.ty-1 li {margin-left:15px; margin-top:30px; width:calc((100% - 30px) / 3);} .board .board-list .list-tb.ty-1 li:nth-child(odd), .board .board-list .list-tb.ty-1 li:nth-child(even) {width:calc((100% - 30px) / 3); margin-left:15px;} .board .board-list .list-tb.ty-1 li:nth-child(3n+1) {margin-left:0; width:calc(((100% - 30px) / 3) - 1px);} .board .board-list .list-tb.ty-1 li a:before, .board .board-list .list-tb.ty-1 li a:after {border-width:5px;} .board .board-list .list-tb.ty-1 li .list-wrap {height:300px;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts .category {font-size:13px; margin-bottom:8px;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts .subject {font-size:17px; margin-bottom:8px;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts .conts {font-size:15px;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts .date {font-size:13px; left:15px;} .board .board-list .list-tb.ty-1 li .list-wrap > *:only-child {padding:30px 15px;} .board .board-list .list-tb.ty-1 li .list-wrap > *:only-child .subject {height:51px;} .board .board-list .list-tb.ty-1 li .list-wrap > *:only-child .conts {height:68px;} .board .board-list .list-tb.ty-1 li .list-wrap > *:only-child .date {bottom:30px;} .board .board-list .list-tb.ty-1 li .list-wrap > *:first-child:nth-last-child(2) ~ .list-conts {padding:15px;} .board .board-list .list-tb.ty-1 li .list-wrap > *:first-child:nth-last-child(2) ~ .list-conts .date {bottom:15px;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts-box {margin-top:15px;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts-box .subject {font-size:17px;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts-box .subject a {font-size:17px;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts-box .date {font-size:13px;} .board .board-list .list-tb.ty-1 li .list-wrap.ty-2 .thumnail a:before, .board .board-list .list-tb.ty-1 li .list-wrap.ty-2 .thumnail a:after {border-width:5px;} .form .hide-box {font-size:15px;} .form .hide-box a {font-size:14px;} } @media screen and (max-width: 600px){ .form .form-tb li.tr .th {width:100%; padding-right:0; margin-bottom:8px;} .form .form-tb li.tr .td {width:100%;} .form .form-tb li.tr .head {width:100%; padding-right:0; margin-bottom:8px;} .form .form-tb li.tr .conts {width:100%;} .board .board-list .list-tb.ty-1 li {margin-left:20px; width:calc((100% - 20px) / 2);} .board .board-list .list-tb.ty-1 li:nth-child(odd), .board .board-list .list-tb.ty-1 li:nth-child(even) {width:calc((100% - 20px) / 2); margin-left:20px;} .board .board-list .list-tb.ty-1 li:nth-child(2n+1) {margin-left:0; width:calc(((100% - 20px) / 2) - 1px);} } @media screen and (max-width: 480px){ .form .input-area {margin-top:5px;} .form .input-area.tel > * {width:calc((100% - 10px) / 3); margin-left:5px;} .form .input-area.tel > *:nth-child(1) {width:calc(((100% - 10px) / 3) - 1px);} .form .input-area.phone > * {width:calc((100% - 15px) / 4); margin-left:5px;} .form .input-area.phone > *:nth-child(1) {width:calc(((100% - 15px) / 4) - 1px);} .form .input-area.phone .btn {height:40px;} .form .input-area.phone .btn a {font-size:13px; line-height:40px;} .form .input-area.col-2 > * {width:100%; margin-left:0; margin-top:5px;} .form .input-area.col-2 > *:nth-child(1) {width:100%; margin-top:0;} .form .input-area.addfile .file-txt {width:calc(100% - 85px); height:40px; line-height:38px; margin-right:5px; font-size:13px;} .form .input-area.addfile .btn-addfile {width:80px; height:40px; font-size:13px; line-height:40px;} .form .input-area.security > * {margin-left:5px;} .form .input-area.security .img-box {height:40px;} .form .input-area.certification > * {margin-left:5px;} .form .input-area.certification .input-box {width:calc(100% - 105px);} .form .input-area.certification .btn {width:100px; height:40px;} .form .input-area.certification .btn a {font-size:13px; line-height:40px;} .form .input-area.date-select > * {margin-left:5px;} .form .input-area.date-select .fix-txt {width:calc(100% - 45px);} .form .input-area.date-select .btn-delete {width:40px; height:40px; background-size:10px auto;} .form .input-area.addr > * {margin-left:5px;} .form .input-area.addr .input-box {width:calc(100% - 65px);} .form .input-area.addr .btn {width:60px; height:40px;} .form .input-area.addr .btn a {font-size:13px; line-height:40px;} /*.form .input-box {height:40px;}*/ .form .input-box [type="text"], .form .input-box [type="password"] {font-size:13px; padding:0 8px; height:40px;} .form .input-box textarea {min-height:100px; font-size:13px; padding:8px;} .form .fix-val {height:40px; font-size:13px; line-height:38px; padding:0 8px;} .form .fix-txt {height:40px; padding:0 8px;} .form .fix-txt > .wrap > * {font-size:13px; line-height:38px;} .form .form-inner {padding:40px 20px;} .form .form-wrap .form-box {margin-top:25px;} .form .form-wrap .form-box h2 {font-size:18px; margin-bottom:12px;} .form .form-wrap .form-box h2 span.required:after {font-size:13px;} .form .form-wrap .form-box .txt {font-size:12px;} .form .form-tb li.tr {margin-top:15px;} .form .form-tb li.tr > * {font-size:13px;} .form .form-tb li.tr .th {margin-bottom:5px;} .form .form-tb li.tr .td .txt {font-size:12px; margin-top:5px;} .form .form-tb li.tr .head {margin-bottom:5px;} .form .button-box, .board .button-box {margin-top:25px;} .form .bd-btn-box, .board .bd-btn-box {margin-top:15px;} .form .bd-btn-box .bd-btn, .board .bd-btn-box .bd-btn {margin-left:5px; height:32px; min-width:60px;} .form .bd-btn-box .bd-btn a, .board .bd-btn-box .bd-btn a {font-size:13px; padding:0 8px; line-height:30px;} .form .bd-btn-box .input-box {height:30px;} .board .board-paging {margin-top:25px;} .board .board-paging ul li {min-width:32px; height:32px;} .board .board-paging ul li a {font-size:13px; line-height:32px;} .board .board-search {margin-bottom:25px;} .board .board-search .search-box > * {margin-left:5px;} .board .board-search .search-box .select-box {width:100px;} .board .board-search .search-box .input-box {width:calc(100% - 105px); height:40px} .board .board-search .search-box .input-box [type=text] {width:calc(100% - 38px); font-size:13px; padding:0 8px; border:none; background:none; text-align:left;} .board .board-search .search-box .input-box .btn-search {width:38px; background-size:auto 17px;} .board .board-search .total-box {font-size:13px;} .board .board-list .faq-tb li > div {padding:15px 10px;} .board .board-list .faq-tb li > div span {padding-left:32px; font-size:13px;} .board .board-list .faq-tb li > div span:before {width:25px; height:25px; font-size:14px; line-height:25px; top:-2px;} .board .board-list .faq-tb li .question {height:60px;} .board .board-list .faq-tb li .question:after {width:7px; height:7px; right:12px; top:calc(50% - 4px);} .board .board-list .faq-tb li .ask .ask-conts {height:90px;} .board .board-list .faq-tb li.active .question:after {top:calc(50% - 3px);} .board .board-list .list-tb.ty-1 {margin-top:-20px;} .board .board-list .list-tb.ty-1 li {margin-left:10px; margin-top:20px; width:calc((100% - 10px) / 2);} .board .board-list .list-tb.ty-1 li:nth-child(odd), .board .board-list .list-tb.ty-1 li:nth-child(even) {width:calc((100% - 10px) / 2); margin-left:10px;} .board .board-list .list-tb.ty-1 li:nth-child(2n+1) {margin-left:0; width:calc(((100% - 10px) / 2) - 1px);} .board .board-list .list-tb.ty-1 li a:before, .board .board-list .list-tb.ty-1 li a:after {border-width:4px;} .board .board-list .list-tb.ty-1 li .list-wrap {height:240px;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts .category {font-size:12px; margin-bottom:5px;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts .subject {font-size:15px; margin-bottom:5px;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts .conts {font-size:13px;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts .date {font-size:12px; left:15px;} .board .board-list .list-tb.ty-1 li .list-wrap > *:only-child {padding:25px 15px;} .board .board-list .list-tb.ty-1 li .list-wrap > *:only-child .subject {height:45px;} .board .board-list .list-tb.ty-1 li .list-wrap > *:only-child .conts {height:59px;} .board .board-list .list-tb.ty-1 li .list-wrap > *:only-child .date {bottom:25px;} .board .board-view .view-tb .tr {padding:0 25px;} .board .board-view .view-tb .tr .th {padding:15px 0;} .board .board-view .view-tb .tr .th .category {font-size:12px; margin-bottom:5px;} .board .board-view .view-tb .tr .th .subject {font-size:18px; margin-bottom:5px;} .board .board-view .view-tb .tr .th .info span {font-size:13px; margin-left:12px;} .board .board-view .view-tb .tr .th .info span.hit {padding-left:20px;} .board .board-view .view-tb .tr .th .info span.hit:before {width:15px;} .board .board-view .view-tb .tr .td {padding:30px 0;} .board .board-view .view-tb .tr .td .view-conts {font-size:13px;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts-box {margin-top:10px;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts-box .subject {font-size:15px; margin-bottom:5px;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts-box .subject a {font-size:15px;} .board .board-list .list-tb.ty-1 li .list-wrap .list-conts-box .date {font-size:12px;} .board .board-list .list-tb.ty-1 li .list-wrap.ty-2 .thumnail a:before, .board .board-list .list-tb.ty-1 li .list-wrap.ty-2 .thumnail a:after {border-width:4px;} .form .hide-box {font-size:13px; margin-top:8px;} .form .hide-box a {font-size:12px;} .form .val-box {min-height:auto;} }