article {margin:40px 0;}
h4.title {font-weight: bold; color:#222; padding-bottom:10px; margin-bottom:20px; border-bottom:1px solid #ddd}
h4.subTitle {font-size: 34px; padding-bottom: 20px; font-weight: bold; color: #222; position: relative;}


/* 라디오/체크박스 */
.form-check{padding: 0 10px 10px 35px;}
.mark, mark {padding: 1.5em; background-color: #f7f9ff;}
.mark label{margin-top: 2px; margin-bottom: 2px; margin-left: 6px;}
.form-check input {position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0;}
.checkmark {position: absolute; top: 0; left: 0; height: 22px; width: 22px; background-color: #ddd; border-radius: 5px;}
.form-check:hover input ~ .checkmark {background-color: #ccc;}
.form-check input:checked ~ .checkmark {background-color: #51159D;}
.checkmark:after {content: ""; position: absolute; display: none;}
.form-check input:checked ~ .checkmark:after {display: block;}
.form-check .checkmark:after {left: 7px; top: 3px; width: 8px; height: 12px; border: solid white; border-width: 0 3px 3px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);}


/* 이미지 등록 */
.register-box {background: #fff; border:1px solid #ddd; border-radius: 10px; width:100%; max-width:900px; margin:0 auto; padding:50px 40px;}
.register-box ul li {float:left; margin-right:15px; margin-top: 5px;}
.register-box .col-form-label {font-weight: 500;}
.register-box .form-group {padding-bottom:30px; margin-bottom:30px; border-bottom: 1px solid #eee;}
.register-box textarea {min-height: 150px;}
.register-box .btn {margin:0 4px}

/* 이미지 제작 종류 */
.solution-type ul li.card {margin-bottom:20px; transition: all .3s ease;}
.solution-type ul li.card a {display: table; padding:35px 0;}
.solution-type ul li.card a div {display: table-cell; }
.solution-type ul li.card a div.icon {width:10%; text-align: center;}
.solution-type ul li.card a div.tit {width:15%; color:#222; font-size:24px; font-weight: bold;}
.solution-type ul li.card.one {background:#DFECFF url('../img/ico-link-in.png') 95% center no-repeat;}
.solution-type ul li.card.two {background:#FFEEB9 url('../img/ico-link-in.png') 95% center no-repeat;}
.solution-type ul li.card.three {background:#D6EFCD url('../img/ico-link-in.png') 95% center no-repeat;}
.solution-type ul li.card:hover {background-position: 96% center;}

/* 기관 및 상징소개 */
.site-list li {margin-bottom:40px;}
.site-list li .card {border-radius: 10px; padding:20px; font-size:1.1rem;}
.site-list li .card h5 {margin-bottom:30px;}
.site-list li .card h5 a{color:#222; font-weight: bold; font-size:24px;}
.site-list li .card h5 a {padding-right:20px;}
.site-list li .card p {margin-bottom:30px;}
.site-list li .card .email span {margin-right:20px;}
.site-list li .card .email a {background:url('../img/icon-email.png') left 3px no-repeat; padding-left:35px; margin-left:20px; word-break: keep-all;}



/****************************************************
그림판만들기
*****************************************************/
/* 이미지 상세보기 */
.detail-img {
    min-height:550px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.detail-img .img {position: relative; width:100%; padding-bottom:100%; overflow: hidden;}
.detail-img .img  img {position: absolute; left:50%; top:50%; transform: translate(-50%, -50%);}

.detail-info {padding-left:2rem}
.detail-info .tit {font-size:1.875rem; color:#222; font-weight: 500; padding-bottom:20px; border-bottom:1px solid #ddd;}
.detail-info .info {border-left:1px solid #ddd; display: flex;}
.detail-info .info li {width:calc(100% / 3); border-right:1px solid #ddd; border-right:1px solid #ddd; border-bottom:1px solid #ddd; padding:25px 20px; color:#222; float:left;}
.detail-info .info li span {color:#888; display: block;}
.detail-info p {color:#888; padding-bottom:5px;}
.detail-info .tag li {display: inline-block; background: #F1F1F1; border-radius: 30px; color:#444; margin:0 10px 10px 0; padding:4px 10px}
.detail-view {border-top:1px solid #ddd; border-bottom:1px solid #ddd; padding:50px 0; margin-bottom:50px;}

.symbol-wrap {position: relative; overflow: hidden;}
.symbol-box {border:1px solid #ddd; position: relative; overflow: hidden; display: flex; width:calc(100% - 60px)}
.symbol-box .slide-item {display: flex !important; justify-content: center; align-items: center; text-align: center; margin-bottom:10px;  width: 50%; border: 1px solid #ddd; position: relative;}
.symbol-box .slide-item:after {content: ""; display: block; padding-bottom: 100%;}
.symbol-box .slide-item a { width:100%; height:100%;display: inline-block; position: absolute; width: 100%; height: 100%;}
.symbol-box .slider .slick-list {margin:-5px;}
.symbol-box .slick-slide {margin:5px;}

.symbol-wrap .slick-pager {position: absolute; top:0; right:0; float:right; border:1px solid #ddd; border-left:0; height:100%; cursor: pointer;}
.symbol-wrap .slick-prev{width:60px; height:50%; display: block; background: url('../img/symbol_arrow_prev.jpg') center center no-repeat; border-bottom:1px solid #ddd;}
.symbol-wrap .slick-prev:hover {background: url('../img/symbol_arrow_prev_on.jpg') center center no-repeat;}
.symbol-wrap .slick-next{width:60px;  height:calc(100% / 2 - 60px); display: block; background: url('../img/symbol_arrow_next.jpg') center center no-repeat;}
.symbol-wrap .slick-next:hover{background: url('../img/symbol_arrow_next_on.jpg') center center no-repeat;}
.symbol-list-btn {border-top:1px solid #ddd; bottom:0; position: absolute; }
.symbol-list-btn a {display: block;  background: url('../img/symbol_list.jpg') center center no-repeat; width:60px; height:60px;}
.symbol-list-btn a:hover {background: url('../img/symbol_list_on.jpg') center center no-repeat;}

.itemCon {padding:20px 0;}
.itemCon h3 {position:relative; clear:both; font-size:24px; width:100%; padding-bottom:15px; border-bottom:1px solid #222; margin-bottom:20px; color:#222; font-weight: bold;}
.itemCon .item_content {padding-bottom:30px;}
.comment_write {margin-top:20px;}
.comment_write input {height:60px; line-height:60px;}
.comment_write button {width: 15%; height: 60px; margin-left:20px; border-radius: 3px;}

.comment_list li {padding:20px; border-bottom:1px solid #ddd;}
.comment_list li dt {font-weight:500; color:#000; padding-bottom:10px;}
.comment_list li dt span {color:#888; font-size:14px;}
.comment_list li dd {color:#666;}

.copy-box {padding:10px 15px; background:#f8f8f8; border:1px solid #ddd; font-size:18px; color:#222; font-weight: 600; margin-bottom:30px;}



/* 그림판 등록 */
.editor-con {align-items: center; background-color: #f5f5f5;}
.canvas-box {width:100%; height:100%;min-width:300px; height:300px; border:1px solid #ccc; background:#fff; align-items: center; display: flex; flex-direction: column; margin: auto; box-shadow: 1px 2px 2px rgba(0,0,0,0.05); margin-bottom:10px;}
.editor-check-box {position: relative; overflow: hidden; border:1px solid #dddd; background: #fff; padding:20px; margin:2rem 1rem;}
.editor-check-box dl dt {width:200px; float:left; padding:4px 0;}
.editor-check-box dl dd {width:calc(100% - 200px); float:right;}
.editor-check-box dl dd ul {position: relative; width:100%;}
.editor-check-box dl dd ul li {float:left; width:30%;}


.editor-left-frame {background: #fff; border-right:1px solid #ddd;}
.editor-right-frame {background: #fff; border-left:1px solid #ddd;}
.editor-frame h4 {font-weight: bold; font-size: 18px; color:#222; border-bottom:1px solid #ddd; padding:10px 0; position: relative;}
.editor-frame h4::after {content: ''; position: absolute; width:70px; height:3px; background: #6727BA; bottom:0; left:0;}
.editor-frame .list { column-gap: 10px; flex-direction: row; flex-wrap: wrap; padding-top:10px; padding-bottom:20px;}
.editor-right-frame .list { max-height: 350px; }

.editor-right-frame .list::-webkit-scrollbar {
    width: 8px;  /* 스크롤바의 너비 */
}

.editor-right-frame .list::-webkit-scrollbar-thumb {
    height: 30%; /* 스크롤바의 길이 */
    background: #6727BA; /* 스크롤바의 색상 */

    border-radius: 10px;
}

.editor-right-frame .list::-webkit-scrollbar-track {
    background: rgba(103, 39, 186, .1);  /*스크롤바 뒷 배경 색상*/
}

#templetelist_box::-webkit-scrollbar {
    width: 8px;  /* 스크롤바의 너비 */
}

#templetelist_box::-webkit-scrollbar-thumb {
    height: 30%; /* 스크롤바의 길이 */
    background: #6727BA; /* 스크롤바의 색상 */

    border-radius: 10px;
}

#templetelist_box::-webkit-scrollbar-track {
    background: rgba(103, 39, 186, .1);  /*스크롤바 뒷 배경 색상*/
}


#templetelist_box_table::-webkit-scrollbar {
    width: 8px;  /* 스크롤바의 너비 */
}

#templetelist_box_table::-webkit-scrollbar-thumb {
    height: 30%; /* 스크롤바의 길이 */
    background: #6727BA; /* 스크롤바의 색상 */

    border-radius: 10px;
}

#templetelist_box_table::-webkit-scrollbar-track {
    background: rgba(103, 39, 186, .1);  /*스크롤바 뒷 배경 색상*/
}



.draglist {width: 85px; padding: 5px; display: flex; align-items: center; margin-bottom:10px;}
.draglist:hover {border:1px solid #6727BA; box-sizing: border-box; padding:4px; cursor: pointer;}

.btn-upload {bottom:20px; width:100%;}
.btn-upload .btn {width:100%; display: inline-block;}
.detail-text {padding-left:2rem}


/****************************************************
마이페이지
*****************************************************/
.mypage {display: flex;}

.mp-title h4 {font-size:34px; padding-bottom:20px; font-weight: bold; color:#222; position: relative;}
.mp-title .btn-more {position: absolute; float: right; right:0; border:1px solid #ccc; border-radius: 30px; font-size:16px; padding:10px 20px;}
.mp-title .btn-more:hover {color:#fff; background:#5A259E;}
.mp-name {background: #f6f6f6; padding:30px; width:100%; border-radius: 10px; margin-bottom:30px;}
.mp-name span {color:#888; margin-top:5px;}
.mp-list ul {margin:0 -5px;}
.mp-list ul li {width:calc(100% / 3 - 10px); margin:0 5px; float:left; border:1px solid #ddd; margin-bottom:10px; padding:40px; border-radius: 10px; display: flex; justify-content: space-between;}
.mp-list ul li a {font-size:20px;}
.my-banner ul {margin:0 -5px; position: relative; overflow: hidden; margin-bottom:50px;}
.my-banner ul li {width:calc(100% / 2 - 10px); margin:0 5px; float:left;}
.my-banner ul li a {display: flex; border-radius: 10px; box-sizing: border-box;}
.my-banner ul li:first-child a {background:#F1EBF8; padding:40px; border:1px solid transparent;}
.my-banner ul li:last-child a {background:#DFECFF; padding:40px; border:1px solid transparent;}
.my-banner ul li:first-child a:hover {border:1px solid #6727BA}
.my-banner ul li:last-child a:hover {border:1px solid #518DE5}
.my-banner ul li a .icon {margin-right:40px;}
.my-banner ul li a .txt h5 {color:#222; font-weight: bold; font-size:20px; margin-top:20px;}
.my-banner ul li a .txt p {margin-top:5px; color:#666;}


.badge-mypage {background: #FF6B6B; color:#fff; margin-top:15px;}
.sidebar {width:220px;}
.my-content {width:calc(100% - 220px); padding-left:50px;}
.sidebar .my-tit {font-weight: bold; color:#222; margin-bottom:10px;}
.sidebar button {padding: 10px;}
.sidebar .category {background: #f9f9f9; border:1px solid #dedede; border-top:0; border-radius: 0 0 10px 10px; }
.sidebar .category li {border-bottom:1px solid #dedede;}
.sidebar .category li:last-child {border-bottom:0;}
.sidebar .category li a {padding:6px 20px; display: block;}
.sidebar .category li a:hover {color:#6727BA}

.vert-menu {display: none;}
.vert-menu.open {display: block;}
.vert-menu > a {display: block; color: inherit; padding: 0 20px; border:1px solid #dedede; border-radius: 10px; margin-top:10px; font-size:18px; height:55px;line-height: 55px;}
.vert-menu > a.cate-depth {border-radius: 10px 10px 0 0;}
.vert-menu > a:hover, .vert-menu > a:focus, .vert-menu > a.active {background: #F1EBF8; border:1px solid #6727BA;}
.btn-mypage {height:30px; line-height: 0;}

.my-con-list {width:100%; clear: both; width:100%; padding-top:20px;}

.search-fuild {border: 1px solid #dedede; border-radius: 5px; position: relative; *zoom: 1; display: block; min-width: 250px;}
.search-fuild:after { content: ""; display: block; clear: both;}
.search-fuild:before {content: ""; display: inline-block; background: #dedede; width: 1px; height: 38px; top: 0; bottom: 0; left: 100px; margin: auto; position: absolute; }
.search-fuild input[type=text] { float: left; color: #222; background: none; border: none; width: calc(100% - 100px); height: 38px; line-height: 38px;  padding-left:10px; }
.search-fuild select { float: left; color: #222; width: 100px; font-weight: 500; border: none; background-color: #fff; height: 38px;  line-height: 38px; border-radius: 5px 0 0 5px; padding-left:10px;}
.search-fuild .ico { position: absolute; top: 8px; bottom: 0; right: 10px; margin: auto; }


.img-list-vertical li {border:1px solid #dedede; padding:20px 15px; border-radius: 10px; margin-bottom:15px;}
.img-list-vertical li a {display: flex;}
.img-list-vertical li .img {position: relative; width:160px; height:120px; overflow: hidden; border:1px solid #eee; transition: all .3s ease;}
.img-list-vertical li .img img {position: absolute; left:50%; top:50%; transform: translate(-50%, -50%);}
.img-list-vertical li .con {padding-left:30px; width:calc(100% - 200px); }
.img-list-vertical li .con .tit {font-size:20px; color:#222; font-weight: 600; padding-bottom:10px;}
.img-list-vertical li .con span {width:100px; display: inline-block; color:#888;}


/* 로그인 */
.login-box {max-width:620px; margin:0 auto; border:1px solid #ddd; padding:60px 100px; border-radius: 15px;}
.login-box .login-input {border-bottom:1px solid #eee; padding-bottom:20px; margin-bottom:20px;}
.login-box .sns-login p {margin-bottom:30px;}
.login-box .sns-login ul {text-align: center;}
.login-box .sns-login li {width:22%; display: inline-block; padding:0 10px;}
.login-box .btn-login {width:100%; margin-top:30px; border-radius: 50px;}

/* 회원가입 */
.agree-input {max-width: 800px; margin:0 auto;}
.agree-input h5 {font-weight: bold; padding-bottom:5px; color:#222;}
.agree-input .agree-box {border:1px solid #ddd; overflow-y: scroll; min-height: 100px; max-height: 150px; margin-bottom:10px; padding:15px;}
.join-input {max-width: 800px; margin:0 auto; border:1px solid #ddd; border-radius: 15px; padding:40px 80px;}
.join-box .btn-join {border-radius: 50px; margin-top:40px; width:200px;}

@media screen and (min-width: 768px) {


    .vert-menu {display: block;}
    .mobile-only {display: none;}


}


@media screen and (max-width:992px) {

    .detail-img {min-height:400px;}
    .editor-check-box dl dt {width:100%; float:inherit; display: block; clear: both;}
    .editor-check-box dl dd {width:100%; float:inherit; margin-bottom:10px; display: block; overflow: hidden;}

    .solution-type ul li.card.one, .solution-type ul li.card.two, .solution-type ul li.card.three {background-position: 95% 20%;}
    .solution-type ul li.card a {padding:20px;}
    .solution-type ul li.card a div {display: block; width:100%;}
    .solution-type ul li.card a div.tit {width:100%; padding:10px 0;}

    .mp-list ul li {padding:20px;}
    .my-banner ul li a {display: block;}


}




@media screen and (max-width: 768px) {
    h4.title {font-size: 21px;}
    h4.subTitle {font-size: 24px;}
    .mp-title h4 {font-size:24px;}
    .mp-title .btn-more {font-size:14px;}



    .editor-check-box {margin: 2rem 0;}
    .editor-left-frame {background: #fff; border-right:0; padding-bottom:20px; border-bottom:1px solid #ddd; margin-bottom:30px;}
    .editor-right-frame {background: #fff; border-left:0; padding-top:20px; border-top:1px solid #ddd; margin-top:30px;}

    .detail-img {min-height:auto}
    .detail-info {padding-left:0;}
    .detail-info .tit {padding-top:30px}
    .detail-info .info li {padding:20px 10px;}

    .symbol-box {width:calc(100% - 40px);}
    .symbol-wrap .slick-prev, .symbol-wrap .slick-next{width:40px; background-size: 30%;}
    .symbol-list-btn a {width:40px; height:40px; background-size: 40%;}
    .symbol-wrap .slick-prev:hover, .symbol-wrap .slick-next:hover {background-size: 30%;}
    .symbol-list-btn a:hover {background-size: 30%;}

    .comment_write button {margin-left:10px;}
    .comment_list li {padding:15px 0;}

    .register-box {padding:30px 20px; margin:10px;}
    .register-box .form-group {padding-bottom:20px; margin-bottom:20px;}


    .mypage {display: block;}
    .sidebar {width:100%;}
    .badge-mypage {margin-top:10px;}
    .my-content {width:100%; padding-left:0;}
    .my-banner ul {margin:0;}
    .my-banner ul li {width:100%; float:inherit; margin:0; margin-bottom:10px;}
    .my-banner ul li:first-child a, .my-banner ul li:last-child a  {padding:20px;}

    .mp-list ul li {width:calc(100% / 2 - 10px); display: block; justify-content: inherit;}
    .mp-list ul li a {font-size:18px; display: block;}

    .vert-menu {border-radius: 10px;}
    .vert-menu > a {border-radius: 0; font-size:16px; height:40px; margin-top:5px; line-height: 40px;}
    .vert-menu > a.cate-depth {border-radius: 0;}
    .btn-mypage {height:30px; line-height: 0;}

    .sidebar .category {border-top:0; border-radius: 0; }
    .sidebar .category li a {padding:6px 15px;}

    .search-fuild {min-width: 80%;}
    .search-fuild:before {height: 15px; left: 70px;}
    .search-fuild input[type=text] {width: calc(100% - 70px); height: 33px; line-height: 33px;}
    .search-fuild select {width: 70px; height: 33px; line-height: 33px;}
    .search-fuild .ico {right: 5px;}
    .search-fuild .ico:before {width: 15px; height: 15px;}
    .d_m_none {
        display: none;
    }
}

.webzine_tbl {
    margin: 20px 0;
    width: 100%;
}

.webzine_tbl thead {
    box-shadow: 0 3px 0 rgba(0, 0, 0, 0.05);
}

.webzine_tbl th {
    border-top: 1px solid #222;
    padding: 15px 0;
    height: 60px;
    border-bottom: 1px solid #ddd;
}

.webzine_tbl td {
    padding: 15px 0;
    border-bottom: 1px solid #ddd;
}

.webzine_tbl td li {
    float: left
}

.board_view .webzine_tbl table {
    width: 100%;
}


.webzine_tbl td li .responsive-center {
    display: inline-block;
    width: 150px;
    height: 130px;
    border: 1px solid #ddd;
    margin-right: 30px;
}

.webzine_tbl td li .responsive-center img {
    display: block;
    max-width: 100%;
    height: auto;
}

.webzine_tbl td li .responsive-center {
    position: relative;
    height: 100px;
}

.webzine_tbl td li .responsive-center img {
    position: absolute;
    max-height: 90%;
    max-width: 90%;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

.webzine_tbl td li .tit {
    font-size: 20px;
    color: #222;
    padding-bottom: 10px;
}


/****************************
01. 통합검색
*****************************/
.all_search {
    margin-top: 20px;
    box-shadow: 1.2px 4.9px 0 0 rgba(0, 0, 0, 0.05);
    border: solid 1px #dddddd;
    padding: 20px 20%;
    margin-bottom: 30px;
    width: 100%;
}

.all_search input, .all_search select {
    border: 1px solid #019ef4;
    margin: 3px;
    height: 50px;
    line-height: 50px;
    border-radius: 0;
    font-size: 18px;
}

.all_search .input-group-btn {
    position: absolute;
    background: #019ef4;
    top: 0;
    float: right;
    right: 0;
    margin-top: 3px;
    width: 55px;
    height: 50px;
    line-height: 45px;
    text-align: center;
    transition: all 0.5s ease;
}

.all_search .input-group-btn i {
    color: #fff;
    font-size: 20px;
}

.all_search .input-group-btn:hover {
    background: #0173f4;
}

.all_search_select {
    width: 30%
}

.all_search_select select {
    width: 98%
}

.all_search_input {
    width: 66%
}


.btn_item_more {
    border-radius: 3px;
    background: #019ef4;
    color: #fff;
    border: 0;
    font-size: 16px;
    border: 0;
    padding: 10px 15px
}

.btn_item_more:hover {
    background: #0173f4
}

.btn_item_more i {
    font-size: 13px;
}

.search_result {
    position: relative;
    overflow: hidden;
    padding-bottom: 8rem;
}

.search_result .card {
    border: 0;
}

.search_result .card-body {
    padding: 0;
}

.search_result .card-title {
    font-size: 18px;
    color: #222;
}

.search_result .card-title p {
    color: #888;
    font-weight: 300;
    padding-top: 5px;
}

.search_result .thumbnail {
    position: relative;
    padding-top: 100%;
    overflow: hidden;
    border: 1px solid #ddd;
    margin-bottom: 10px;
}

.search_result .thumbnail img {
    position: absolute;
    top: 0;
    left: 0;
}

.search_result .thumbnail .centered {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    -webkit-transform: translate(50%, 50%);
    -ms-transform: translate(50%, 50%);
    transform: translate(50%, 50%);
}

.search_result .thumbnail .centered img {
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.search_result .thumbnail img.landscape {
    width: auto;
    max-width: none;
    height: 100%;
}


.search_result_list {
    padding-bottom: 50px;
}

.search_result_list ul {
    border-top: 1px solid #ddd;
    margin-bottom: 10px;
}

.search_result_list ul li {
    padding: 20px;
    border-bottom: 1px solid #ddd;
    position: relative;
}

.search_result_list ul li a {
    display: block;
}

.search_result_list ul li a dl dt {
    font-size: 20px;
    color: #222;
    padding-bottom: 10px;
    letter-spacing: -1pt;
}

.search_result_list ul li a dl dd {
    color: #666;
}

.search_result_list ul li a .date {
    bottom: 20px;
    color: #888;
    position: absolute;
    bottom: 20px;
    float: right;
    right: 0;
}


.inline-box{
    display: inline-block;
    margin-bottom: 20px;
}


/****************************
03. 게시판
*****************************/
/* 자유게시판 */
.free_tbl {margin:20px 0; width:100%; }
.free_tbl thead{ box-shadow: 0 3px 0 rgba(0, 0, 0, 0.05); }
/* 220405 bbs. 제목 스타일 변경 */
.free_tbl th {border-top:1px solid #222; padding:15px 0; /* height:60px; */ height: auto; border-bottom:1px solid #ddd;}
.free_tbl td {padding:15px 0; border-bottom:1px solid #ddd; }
.free_tbl td.tit {text-align: left;}

.board_view_tit {font-size:24px; color:#222; font-weight: bold; left: -.7pt;}
.board_view_info ul {float:right; right:0;}
.board_view_info li {float:left; padding:0 10px; color:#888; position: relative;}
.board_view_info li a {color:#888;}
.board_view_info li::after {position: absolute; width:1px; height:15px; background:#ccc; content: ''; margin-left:10px ;top:5px;}
.board_view_info li:last-child::after {content: none;}
.gallery_list {padding-bottom:3rem;}

/* 22-03-14 kys 반응형 추가*/
@media screen and (max-width:768px) {
    .board_view_info li {padding:0 5px;}
    .board_view_info li::after {margin-left:5px;}
}



.list_btn {
    padding: 20px 0;
}

.list_btn a {
    color: #fff;
    display: block;
    padding: 10px 0;
    width: 100px;
    text-align: center;
    border-radius: 3px;
    background-color: #8b8b8b;
    float: right;
    right: 0;
}

.item_btn .list_btn a {
    position: absolute;
    float: right;
    top: 0;
}


.BasicTit {
    width: 100%;
    font-size: 20px;
    font-weight: 500;
    color: #222;
    letter-spacing: -1pt;
    background: url('/resources/img/icon_dot.gif') left 15px no-repeat;
    padding: 0 0 15px 20px;
    position: relative;
    overflow: hidden;
}

.bigTit {
    width: 100%;
    font-size: 20px;
    font-weight: 500;
    color: #222;
    letter-spacing: -1pt;
    background: url('/resources/img/icon_dot.gif') left 15px no-repeat;
    padding: 0 0 15px 30px;
    border-bottom: 1px solid #222;
    position: relative;
    overflow: hidden;
}


/*돋보기 css*/
.magnify_popup {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 100000;
}

.magnify_area {
    position: absolute;
    top: 0;
    left: 0;
    display: none;
    z-index: 10000;
}

#magnify {
    display: none;
    background: #fff;
}

.magnify_lense {
    position: absolute;
    width: 180px;
    height: 180px; /*border-radius:100%;*/
    box-shadow: 0 0 0 7px rgba(255, 255, 255, 0.85), 0 0 5px 7px rgba(0, 0, 0, 0.25), inset 0 0 5px 1px rgba(0, 0, 0, 0.25);
    background-color: #fff;
    display: none;
}


/* 색상 반전 코드 */
html.invert {
    -webkit-filter: invert(); /* WebKit */
    /*filter: url("data:image/svg+xml;utf8,<svg height='0' xmlns='http://www.w3.org/2000/svg'><filter id='negative'><feColorMatrix values='-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 0 0 0 1 0'/></filter></svg>#negative");*//* Firefox */
    filter: progid:DXImageTransform.Microsoft.BasicImage(invert=1); /* IE 6-7 */
    -ms-filter: 'progid:DXImageTransform.Microsoft.BasicImage(invert=1)'; /* IE 8 */
}