@charset "utf-8";
/*-------------------------------------------------
Author : siin
Create date : 2018-11-06
-------------------------------------------------*/

/* 서브레이아웃 */
.cont-top {padding: 3.5rem 0; background:url('/webroot/images/sub/sv01.jpg') center 0 /cover no-repeat; color:#fff;}
.cont-top.sv2 {background-image: url('/webroot/images/sub/sv02.jpg');}
/* .cont-top.sv3 {background-image: url('/webroot/images/sub/sv03.jpg');} */
/* .cont-top.sv4 {background-image: url('/webroot/images/sub/sv04.jpg');} */
/* .cont-top.sv5 {background-image: url('/webroot/images/sub/sv05.jpg');} */
.cont-top.sv3 {background-image: url('/webroot/images/sub/sv_new3.png');}
.cont-top.sv4 {background-image: url('/webroot/images/sub/sv_new4.png');}
.cont-top.sv5 {background-image: url('/webroot/images/sub/sv_new5.png');}
/*.cont-top.sv2 .container{padding-right:12.5rem;}
.cont-top.sv3 .container{padding-right:12.5rem;}
.cont-top.sv5 .container{padding-right:12.5rem;}*/

.cont-top.sv6 {background:linear-gradient(to right, #4382e7, #666abd); background:-webkit-gradient(linear, left top, right bottom, from(#4382e7), to(#666abd)); padding:3rem 0 0; text-align:center;}
.cont-top.sv6 img {max-width:100%;}
.cont-top::after {content:''; display:block; clear:both;}
.cont-top .container {position:relative;}
.cont-top .title {display: block; font-family:'宋體', 'simsun','Nanum Square'; font-size:1.2rem; margin-bottom: .7rem;}
.cont-top span {opacity:.6;}
.cont-top .btn-arr {position:absolute; top:50%; right:0; margin-top: -1.5rem; display:block; width: 7.5rem; height:3rem; border:3px solid #fff; border-width: 3px 3px 0 3px; line-height:2.7rem; text-align:center; font-size:.85rem;}
.cont-top .btn-arr::before {content:''; width:6.5rem; height:3px; background:#fff; position:absolute; bottom:0; left:0;}
.cont-top .btn-arr::after {content:''; width:.7rem; height:3px; background:#fff; position:absolute; bottom:5px; left:6rem; transform:rotate(50deg); -webkit-transform:rotate(50deg);}

/* 2019-05-09 추가 jmsong*/
.cont-top.sv1{background:url('/webroot/images/sub/sv01.jpg') no-repeat 50% 50%/ cover}
.cont-top.sv1 .container .desc-box2 {position:relative; margin: 1.0rem 0 1.0rem; border-left:10px solid rgba(255,255,255,.2); border-right:10px solid rgba(255,255,255,.2);font-family:'Nanum Square'; }
.cont-top.sv1 .container .desc-box2:after,
.cont-top.sv1 .container .desc-box2:before{position:absolute;display:block;width:16px;height:10px;content:'';background:rgba(255,255,255,.2);top:0;}
.cont-top.sv1 .container .desc-box2:after{left:0;}
.cont-top.sv1 .container .desc-box2:before{right:0;}
.cont-top.sv1 .container .desc-box2 .desc-inner{ padding: 1.5rem 2.5rem;padding-right:12.5rem;}
.cont-top.sv1 .container .desc-box2 .desc-inner:after,
.cont-top.sv1 .container .desc-box2 .desc-inner:before{position:absolute;display:block;width:16px;height:10px;content:'';background:rgba(255,255,255,.2);bottom:0}
.cont-top.sv1 .container .desc-box2 .desc-inner:after{left:0;}
.cont-top.sv1 .container .desc-box2 .desc-inner:before{right:0;}
.cont-top.sv1 .container .desc-box2 .row > li{position:relative;padding:.3rem 1rem;word-break:keep-all}
.cont-top.sv1 .container .desc-box2 .row > li .gray{display:block}
.cont-top.sv1 .container .desc-box2 .row > li:before{position:absolute;display:block;left:0;top:.2rem;content:'\e93f';font-family:"xeicon";font-size:.8rem;color:#fff}
.cont-top .container .btn-wrap{position:absolute;top:50%;right:2.5rem;transform:translateY(-50%);-webkit-transform:translateY(-50%);display:table;width:5.8rem;height:5.8rem;border-radius:50%;background:rgba(51,51,51,.8);transition: background .3s;-webkit-transition: background .3s;}
.cont-top .container .btn-wrap:hover{background:rgba(255,255,255,.2)}
.cont-top .container .btn-wrap > a{display:table-cell;vertical-align:middle;text-align:center;height:100%;font-size:.9rem;font-weight:600;line-height:1.5rem;color:#fff;}
.cont-top .container .btn-wrap:hover > a{color:#ea9d24;font-weight:800}
.cont-top .container .btn-wrap > a i{display:block;font-size:1.4rem;color:#ea9d24;padding-bottom:.4rem;}

.cont-mid {min-height:500px; letter-spacing:-1px;}

#spot {font-family:'Nanum Square';}
#spot .snb-title {display: block; text-align:center; font-size:1.4rem; color:#222; font-weight: 700; padding: 2rem 0;}
#spot .snb-pager {position:absolute; top:2rem; left:0; width: 100%;}
#spot .snb-pager > a {position:absolute; top:0; display: block;}
#spot .snb-pager > a .round {width: 1.7rem; height:1.7rem; border:1px solid #ddd; text-align:center; border-radius:50%; display:inline-block; vertical-align:middle;}
#spot .snb-pager > a .round i {font-size:.9rem; color:#999; line-height: 1.5rem;}
#spot .snb-pager .left .round {margin-right: 1rem;}
#spot .snb-pager .right .round {margin-left: 1rem;}
#spot .snb-pager > a span {display:inline-block; vertical-align:middle; font-size:.9rem; font-weight: 700; color:#999;}
#spot .snb-pager .left {left: 0;}
#spot .snb-pager .right {right: 0;}

#snb-depth2 {background:#f1f2f3; text-align:center; border-bottom: 1px solid #cad0d7; z-index: 1; position: relative;}
#snb-depth2 .title {display: none;}
#snb-depth2 .depth2 {height: 3.3rem;}
#snb-depth2 .depth2 > li {display: inline-block;}
#snb-depth2 .depth2 > li > a {display: block; height:3.3rem; padding:0 .7rem; line-height: 3.3rem; font-size:.9rem; color:#333;}
#snb-depth2 .depth2 > li.active > a {color:#3d86ef;}


#category-wrap {margin: 2.5rem 0; font-family:'Nanum Square'; z-index: 3; position:relative;}
#category-wrap .title {display: none;}
#category-wrap .depth3 {position: relative; z-index: 1;}
#category-wrap .depth3 > li {display:table-cell; width: 1%; border:1px solid #ddd; border-right:0;}
#category-wrap .depth3 > li:last-child {border-right:1px solid #ddd;}
#category-wrap .depth3 > li > a {display:flex; display:-webkit-flex; -webkit-align-items:center; align-items:center; justify-content:center; height: 2.8rem; font-weight: 700;}
#category-wrap .depth3 > li.active > a {background:linear-gradient(to right, #7064b2, #025fab); background:-webkit-gradient(linear, left top, right top, from(#7064b2), to(#025fab)); color:#fff;}

#category-wrap .depth4 {position: relative; width: 100%; z-index: 2; margin-top: -1px; height:3.2rem;}
#category-wrap .depth4 > li {position:absolute; top:0; left:0; width:100%; /*opacity: 0; z-index: -1; visibility:hidden;*/}
/* #category-wrap .depth4 > li.block {opacity: 1; z-index: 1; visibility:visible;} */
#category-wrap .depth4 .box {border:1px solid #ddd; background:#fafbfc; color:#333; position:relative;}
#category-wrap .depth4 .depth4-link {padding:0 .8rem; height: 3.2rem;}
#category-wrap .depth4 .depth4-link > li {display: inline-block; width: auto !important; vertical-align: top;}
#category-wrap .depth4 .depth4-link > li > a {display: block; height:3.2rem; padding:0 .7rem; line-height: 3.2rem;}
#category-wrap .depth4 .depth4-link > li.active > a {color:#085fab; font-weight: 700;}






/* ========================== 공통 스타일 ========================== */

.desc-box {margin: 2.7rem 0 1.8rem; border:10px solid #cad0d7; padding: 2rem 3.5rem; position:relative; font-family:'Nanum Square'; border-image: linear-gradient(to bottom, #faf2d5 0%, #e2edf0 100%); -webkit-border-image: linear-gradient(to bottom, #faf2d5 0%, #e2edf0 100%);
  border-image-slice: 1;}
.desc-box::before, .desc-box::after {content:''; width:97%; height:10px; background:#fff; position:absolute;  left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%);}
.desc-box::before {top:-10px;}
.desc-box::after {bottom:-10px;}
.desc-box .row > li.title {font-size:1rem; font-weight: 700; line-height: 1.3; position:relative;}
.desc-box .row > li.title::before {content:''; width:6.3rem; height:5.2rem; background:url('/webroot/images/sub/desc_bg1.png') 0 0 /contain no-repeat; position:absolute; top:-1.3rem; right:.5rem; z-index: -1;}
.desc-box .row > li.txt {line-height: 1.5; font-size:.85rem; word-break:keep-all;}
.desc-box .row > li.txt::before {content:''; width:4.2rem; height:3.6rem; background:url('/webroot/images/sub/desc_bg2.png') 0 0 /contain no-repeat; position:absolute; bottom:-1.3rem; right:.5rem; z-index: -1;}

h1.title {display: block; font-size:1.2rem; margin: 2.8rem 0 2.5rem; color:#333; text-align:center;}
h2.title {display: block; font-size:1rem; margin: 1.9rem 0 1.2rem;}


.tabs {display:table; width:calc(100% + 2px); margin: 2.5rem 0;}
.tabs > li {display:table-cell; position: relative; width:1%; border-radius:3px 6px 6px 3px; background:#8a96a7; vertical-align: middle;}
.tabs > li::before {position: absolute; right: 0; top: 0; width: 2px; height: 250px; background-color: #fff; content:'';}
.tabs > li > a {display:block; text-align:center; height: auto !important; padding: .9rem 0; position:relative; color:#fff; margin:0 2px;  font-family:'Nanum Square'; font-size:.85rem; font-weight: 700;}
.tabs > li.active {background:linear-gradient(to right, #7064b2, #025fab); background:-webkit-gradient(linear, left top, right bottom, from(#7064b2), to(#025fab));}
.tabs > li > a::before {content:''; width:0; height:0; border-top:14px solid #8a96a7; border-right:14px solid transparent; position:absolute; bottom:-14px; left:50%; margin-left: -7px; opacity:0;  transition:all .3s ease; -webkit-transition:all .3s ease;}
.tabs > li:hover > a::before {opacity:1;}
.tabs > li.active > a::before {border-top-color:#3961ae; opacity:1;}


.table-top {margin:2rem 0 1.5rem; font-family:'Nanum Square';}
.table-top::after {content:''; display: block; clear:both;}
.table-top .title {font-size:1.2rem; font-weight: 700; color:#333; vertical-align:middle;}
.table-top .page-total {display:inline-block; margin-left: 2rem; position:relative; vertical-align:middle;}
.table-top .page-total::before {content:''; width: 1px; height:.8rem; background:#ddd; position:absolute; top:.1rem; left:-1rem;}
.table-top .page-total em {color:#3d86ef; font-weight: 700;}
.table-top .btns {display:inline-block; vertical-align:middle; margin-left: 2rem; position:relative;}
.table-top .btns::before {content:''; width: 1px; height:.8rem; background:#ddd; position:absolute; top:.4rem; left:-1rem;}
.table-top .btns .btn.xs {min-width:3rem; height:1.6rem; font-size:.7rem; text-align:center; padding: 0.3rem; border-color:#999;}
.table-top .btns .btn.xs.active {background:#3d86ef; border-color:#256fd9; color:#fff;}

.search-box {position:relative; width:18rem; height:2rem;}
.search-box .form-control {border-radius:5px; border:0; background:#f9f9f9; color:#999; height:inherit; width: 100%;}
.search-box .btn {position:absolute; top:0; right:0; border:0; background:#3d3d3d; color:#fff; border-top-right-radius: 5px; border-bottom-right-radius: 5px; font-size:1rem; height:inherit; width:2.7rem; padding:0; text-align:center; line-height:2rem;}
.table-top .search-box {float:right;}

.table-wrap {position:relative;}
.table-wrap::before {content:''; width:100%; height:1px; background:#999; position:absolute; top:0; left:0;}
.table-wrap::after {content:''; width:100%; height:1px; background:#c8c8c8; position:absolute; bottom:0; left:0;}
.table-wrap thead th {border-bottom:1px solid #c8c8c8; padding:1rem .5rem; font-weight: 400;}
.table-wrap td {border-bottom:1px solid #e8e8e8; padding: .7rem .5rem;}

/* 리스트형 게시판 */
.table-wrap.board {text-align:center; margin-bottom: 1.5rem;}
.table-wrap.board td.category, .table-wrap.board td.subject {text-align:left;}
.table-wrap.board td.name, .table-wrap.board td.date {color:#767676;}
.table-wrap.board td.subject{white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; overflow:hidden; min-width: 100px; max-width: 200px;}

/* 카테고리별 컬러 분류 */
.table-wrap .category [class^="color"] {position:relative; display:block; /*padding-left:1rem;*/}
/*.table-wrap .category [class^="color"]::before {content:''; display:block; width:8px; height:8px; background:#516da8; position:absolute; top:.3rem; left:0; border-radius:50%;}*/
.table-wrap .category .color2::before {background:#33a6a6;}
.table-wrap .category .color3::before {background:#edb43c;}
.table-wrap .category .color4::before {background:#846dab;}
.table-wrap .category .color5::before {background:#f2697c;}
.table-wrap .category .color6::before {background:#f58e37;}
.table-wrap .category .color7::before {background:#b28c81;}
.table-wrap .category .color8::before {background:#818db2;}
.table-wrap .category .color9::before {background:#5ca8b1;}
.table-wrap .category .color10::before {background:#3ca273;}

/* 페이지네이션 */
.pagenation {text-align: center; font-size: 0; margin: 1rem 0 4rem; margin-bottom: 4.5rem;}
.pagenation > a:hover { border-color: #3d86ef; -webkit-transition: all .3s; transition: all .3s; }
.pagenation > a, .pagenation .active { display: inline-block; vertical-align: middle; width: 2rem; height: 2rem; font-size: .75rem; color: #555; background-color: #fff; margin: 0 2px; border: 1px solid #ddd; line-height: 1.8rem; border-radius:50%;}
.pagenation > a {background:#fafafa; border-color:#fafafa;}
.pagenation .active { background-color: #3d86ef; border-color: #3d86ef; color: #fff; }
.pagenation a.arr { font-size: 0; line-height: 0; border-color: #ddd; background-color: #fff; position: relative; }
.pagenation a.arr::before, .pagenation a.arr::after { font-family: 'xeicon'; position: absolute; top: 50%; left: 50%; font-size: 20px; color: #cdcdcd; height: 20px; margin-top: -10px; margin-left: -10px; line-height: 1; }
.pagenation a.arr.first::before { content: "\e93c"; left: 22px; }
.pagenation a.arr.first::after { content: "\e93c"; left: 15px; }
.pagenation a.arr.prev::before { content: "\e93c"; }
.pagenation a.arr.next::before { content: "\e93f"; }
.pagenation a.arr.last::before { content: "\e93f"; left: 24px; }
.pagenation a.arr.last::after { content: "\e93f"; left: 17px; }
.pagenation a.arr:hover { border-color: #969696; -webkit-transition: all .3s; transition: all .3s; }
.pagenation a.arr:hover::before, .pagenation a.arr:hover::after { color: #969696; }
.pagenation a.arr.prev {margin-right: 1rem;}
.pagenation a.arr.next {margin-left: 1rem;}

/* 동그라미 카테고리 */
.category-color {margin: 0 -.5rem; z-index: 1;}
.category-color::after {content:''; display:block; clear:both;}
.category-color > [class^="color"] {float:left; width:3rem; height:3rem; border-radius:50%; margin: 0 .5rem .5rem; text-align:center; color:#fff; font-size:.65rem; background:#3d86ef; display:flex; display:-webkit-flex; -webkit-align-items:center; align-items:center; justify-content:center; line-height:1.2; position:relative;}
.category-color .color1 {background:#516da8;}
.category-color .color2 {background:#33a6a6;}
.category-color .color3 {background:#edb43c;}
.category-color .color4 {background:#846dab;}
.category-color .color5 {background:#f2697c;}
.category-color .color6 {background:#f58e37;}
.category-color .color7 {background:#b28c81;}
.category-color .color8 {background:#818db2;}
.category-color .color9 {background:#5ca8b1;}
.category-color .color10 {background:#3ca273;}
.category-color > [class^="color"].active::after {content:'\e929'; font-family: 'xeicon' !important;display:inline-block;speak:none;font-style: normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased; display:block; width:1.1rem; height:1.1rem; background:#dd0373; border-radius:50%; position:absolute; top:0; right:0; padding:.2rem;}


/* 버튼 */
.btns {}
.btns .btn.sm {min-width:6.7rem; color:#fff; text-align:center; border-radius:5px; background:#484848; padding:0.55rem 1rem; line-height: 1.1; border:0;}
.btns .btn.sm:hover {background:#3d86ef;}
.btns .btn.white {border-color:#ddd; font-family:'Nanum Square';}
.btns .btn.like > i, .btns .btn.bookmark > i, .btns .btn.share > i {margin-left: .3rem; vertical-align:text-top;}
.btns .btn.like .xi-heart-o {color:#dd0373;}
.btns .btn.bookmark .xi-star-o {color:#f9b104;}
.btns .btn.share .xi-share-alt-o {color:#4c8fef;}
.btns .btn.like.active {background:#dd0373; color:#fff;}
.btns .btn.bookmark.active {background:#f9b104; color:#fff;}
.btns .btn.share.active {background:#4c8fef; color:#fff;}
.btns .btn.like.active .xi-heart-o, .btns .btn.bookmark.active .xi-star-o, .btns .btn.share.active .xi-share-alt-o
 {color:#fff;}
.btns .btn.black {background:#393d41; border-color:#393d41; color:#fff;}
.btns .btn.blue {background:#3d86ef; border-color:#3d86ef; color:#fff;}
.btns .gray {background:#717c8c; border-color:#717c8c; color:#fff;}
.btns .btn.round {border-radius:5px;}
.btns .btn.full {width: 100%;}
.btns .btn.triple {width:33%;}
.btns.base {margin: 2.5rem 0 9.5rem; text-align:center;}
.btns.base .btn {min-width:11.5rem; height:2.8rem; line-height: 2.8rem; padding: 0; text-align: center; font-size:.85rem; font-weight: 700;}

.slide-checkbox {position: relative;}
.slide-checkbox > label {display: inline-block; background: #e8e8e8; height: 2rem; position: relative; border-radius: 30px; min-width:7.5rem; cursor:pointer;}
.slide-checkbox > label > .dot {background: #3d86ef; height: 2rem; left: 0; border-radius: 30px; position: absolute; top: 0; width: 54%; transition: left 0.3s; -webkit-transition: left 0.3s;}
.slide-checkbox > label .value-text {display: block; float: left; height: 2rem; line-height: 2rem; position:relative; text-align: center; -webkit-transition: color 0.3s; transition: color 0.3s; width: 50%; z-index: 1;}
.slide-checkbox > label .value-text.text-1 {color: #fff; left: 2%;}
.slide-checkbox > label .value-text.text-2 {float: right; right: 2%;}
.slide-checkbox > label > input {position: absolute; visibility: hidden;}
.slide-checkbox > label > input:checked + .dot {left: 47%;}
.slide-checkbox > label > input:checked ~ .text-1 {color: #555;}
.slide-checkbox > label > input:checked ~ .text-2 {color: #fff;}

span.check {display:inline-block; width:1.2rem; height:1.2rem; border-radius:50%; background:#ddd; color:#fff; text-align:center; font-size:.8rem; line-height: 1.4rem;}
label {cursor:pointer; position:relative;}
label > input {opacity:0; z-index: -1; position:absolute; top:0; left:0;}
input[type="radio"]:checked + span.check {background:#3d86ef;}

.list.dot > li {padding-left: .7rem; position: relative; margin-bottom: .5rem;}
.list.dot > li::before {content:''; display: block; width:.3rem; height:.3rem; background:#959ca6; position:absolute; top:.4rem; left:0; border-radius:50%;}
.list .gray {display:block; font-size:.75rem; color:#999;}

/* 프로필 이미지 */
.user-img {width: 2.7rem; height: 2.7rem; border-radius:50%; overflow:hidden; display:inline-block; vertical-align: middle; margin-right: .5rem; text-align:center; font-size:1.2rem; line-height:2.7rem; color:#fff; background:#747c89;}
.user-img img {display: block; min-width:2.7rem; min-height:2.7rem; max-width:100%;}


/* data 없을 때 */
.nodata {text-align:center; margin:1rem 0;}





/* ================================================================================ */


/* 준비중 */
.ready {margin: 5rem 0;}



/* 게시판 뷰  */
.board-view {margin-top: 2.7rem;}
.board-view .top {padding-bottom: 1.5rem; border-bottom: 1px solid #e8e8e8;}
.board-view .top .title {display:block; font-size:1.3rem; color:#333; margin-bottom: .6rem;}
.board-view .top .info {margin-bottom: 1rem; color:#333;}
.board-view .top .info::after {content:''; display:block; clear:both;}
.board-view .top .info span {display:inline-block; position:relative; vertical-align:baseline;}
.board-view .top .info span + span {margin-left: 1rem;}
.board-view .top .info span + span::before {content:''; display:block; width:1px; height:.8rem; background:#ddd; position:absolute; top:.2rem; left:-.5rem;}
.board-view .top .info .name .img {border-radius:50%; overflow:hidden; width:2.2rem; height:2.2rem; display:inline-block; vertical-align: middle; margin-right: .5rem;}
.board-view .top .info span em {font-weight: 700; margin-right: .4rem;}
.board-view .top .info .mark {float:right; padding: 0.5rem 0;}
.board-view .top .btns::after {content:''; display:block; clear:both;}
.board-view .top .btns .btn {height:1.6rem; font-size:.75rem; text-align:center; padding: 0.2rem .5rem;}
.board-view .top .btns .btn i {vertical-align:baseline; margin-left: .2rem;}
.board-view .top .btns .print {float:right; position:relative;}
.board-view .top .btns .print ul {border:1px solid #ddd; padding:.4rem .5rem; position:absolute; top:1.6rem; right:0; background:#fff; z-index: 1; display:none;}
.board-view .top .btns .print ul > li > a {display:block; width:3rem; padding: .3rem 0;}

.board-view .mid {padding: 1.5rem 0 5rem; line-height: 1.6; font-size:.85rem; color:#767676; border-bottom: 1px solid #ddd;}
/* 2019-05-10추가 jmsong */
.board-view .mid.board-write{overflow:hidden}
.board-view .mid.board-write table{margin-left:-1px;border-right:0;border-top:2px solid #3d86ef}
.board-view .mid.board-write table th{background:#f4f7fb;text-align:center;font-size:.8rem;color:#313131;padding:.4rem 0;border-bottom:1px solid #c1c1c1;word-break:keep-all}
.board-view .mid.board-write table td{padding:.4rem 1.5rem;border-bottom:1px solid #c1c1c1;border-right:0;}

.board-view .bottom {}
.board-view .bottom .category-area {padding:.8rem .5rem; border-bottom: 1px solid #e8e8e8;}
.board-view .bottom .category-area .category {display:inline-block; font-size:.85rem; font-weight: 700; font-family:'Nanum Square'; color:#858990;}
.board-view .bottom .category-area .category em {vertical-align: middle; color:#333; padding-right: .4rem;}
.board-view .bottom .category-area .tag {display:inline-block; width:calc(100% - 6rem); vertical-align:middle; padding-left: 2rem; position:relative;}
.board-view .bottom .category-area .tag::before {content:''; width:1px; height:.8rem; background:#d2d8e0; position:absolute; top:.5rem; left:.9rem;}
.board-view .bottom .category-area .tag a {display:inline-block; padding:.4rem .8rem; background:#717c8c; border-radius:30px; color:#fff; margin-left: .5rem;}
.board-view .bottom .category-area .tag a:first-of-type {margin-left: 0;}
.board-view .bottom .btns {margin: 1.5rem 0; font-size:.85rem;}

.board-view .comment-write {padding:2rem 2.5rem; background:#f4f7fb; margin-bottom: 2.5rem;}
.board-view .comment-write textarea {height:9.5rem; padding: 1rem; margin-bottom: .8rem; border-color:#cad0d7;}
.board-view .comment-write .btns::after {content:''; display:block; clear:both;}
.board-view .comment-write .btns .add {display:inline-block;}
.board-view .comment-write .btns .add li {display: inline-block; vertical-align: top; width: 2.1rem; height: 2.1rem; position: relative;}
.board-view .comment-write .btns .add li a {display: block; border:1px solid #cad0d7; background:#fff; text-align:center; font-size:1.2rem; color:#5f6e81; line-height: 2rem; width:inherit; height:inherit;}
.board-view .comment-write .btns .add li input[type="file"] {opacity:0; width:inherit; height:inherit; position: absolute; top: 0; left: 0; cursor:pointer;}
.board-view .comment-write .btns .blue {width: 4.2rem; height:2.1rem; color:#fff; background:#3d86ef; line-height: 2rem; padding: 0; text-align:center; float: right;}

.board-view .comment-list-wrap {margin: 2.5rem 0;}
.board-view .comment-list-wrap .title {border-bottom:1px solid #ccc; padding-bottom: 1rem; font-family:'Nanum Square';}
.board-view .comment-list-wrap .title::after {content:''; display:block; clear:both;}
.board-view .comment-list-wrap .title .count {font-weight: 700;}
.board-view .comment-list-wrap .count em {color:#3d86ef;}
.board-view .comment-list-wrap .array {float:right;}
.board-view .comment-list-wrap .array .list-up {display: inline-block; vertical-align: middle;}
.board-view .comment-list-wrap .array .list-up > a {display:inline-block; font-size:.7rem; padding: .5rem; position: relative;}
.board-view .comment-list-wrap .array .list-up > a.active {color:#3d86ef;}
.board-view .comment-list-wrap .array .list-up > a::after {content:''; width:1px; height:.6rem; background:#ddd; position:absolute; top:.6rem; left:0;}
.board-view .comment-list-wrap .array .list-up > a:first-of-type::after {display: none;}
.board-view .comment-list-wrap .array .filter {display:inline-block; vertical-align: middle; margin-left: .5rem;}
.board-view .comment-list-wrap .array .filter > a {display: block; width:1.5rem; height:1.5rem; border:1px solid #ddd; color:#cad0d7; text-align:center; line-height: 1.5rem;}

.board-view .comment-list-wrap {}
.board-view .comment-list-wrap .reply {padding: .7rem .5rem; border-bottom: 1px solid #e8e8e8;}
.board-view .comment-list-wrap .info {margin-bottom: .6rem;}
.board-view .comment-list-wrap .info::after {content:''; display:block; clear:both;}
.board-view .comment-list-wrap .info .user {display:inline-block;}
.board-view .comment-list-wrap .info .user .img {width: 2.2rem; height: 2.2rem; border-radius:50%; overflow:hidden; display:inline-block; vertical-align: middle; margin-right: .5rem; text-align:center; line-height: 2rem; color:#fff; background:#747c89;}
.board-view .comment-list-wrap .info .user .name {vertical-align: middle; color:#333; font-family:'Nanum Square'; font-weight: 700;}
.board-view .comment-list-wrap .info .option {float:right; position:relative;}
.board-view .comment-list-wrap .info .dotted {display:block; width:1.5rem; height:1.5rem; line-height: 1.5rem; text-align:center;}
.board-view .comment-list-wrap .info ul {border:1px solid #ddd; position:absolute; top:1.5rem; right:0; background:#fff; z-index: 1; display: none;}
.board-view .comment-list-wrap .info ul a {display: block; padding:.3rem .5rem;; width: 4rem;}
.board-view .comment-list-wrap .talk {line-height: 1.5; color:#767676; margin-bottom: .5rem;}
.board-view .comment-list-wrap .date {font-size:.7rem; color:#bbb; margin-bottom: .8rem;}
.board-view .comment-list-wrap .date a {display:inline-block; margin-left: .5rem;}
.board-view .comment-list-wrap .btns::after {content:''; display:block; clear:both;}
.board-view .comment-list-wrap .reply .btns .btn {height:1.5rem; border:1px solid #ddd; line-height: 1.5rem; text-align:center; font-size:.7rem; padding: 0 .6rem;}
.board-view .comment-list-wrap .reply .btns .mark {float:right;}
.board-view .comment-list-wrap .reply .btns .mark .xi-flag {color:#747c89;}
.board-view .comment-list-wrap .reply .btns .mark .xi-thumbs-up {color:#e563a6; margin-right: .5rem;}
.board-view .comment-list-wrap .reply .btns .mark .xi-thumbs-down {color:#3d86ef; margin-right: .5rem;}

.board-view .comment-list-wrap .re-reply {display: none;}
.board-view .comment-list-wrap .re-reply .area {padding: .7rem 2.5rem; border-bottom: 1px solid #e8e8e8; background:#f6f7f9;}
.board-view .comment-list-wrap .re-reply .info .user {position:relative;}
.board-view .comment-list-wrap .re-reply .info .user::before {content: "\e97e"; font-family: 'xeicon' !important;display:inline-block;speak:none;font-style: normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased; color:#cad0d7; font-size:.9rem; position:absolute; top:.5rem; left:-1.2rem;}

.board-view .comment-write-re {}
.board-view .comment-write-re textarea {height:7rem; padding: 1rem; margin-bottom: .4rem; border-color:#cad0d7;}
.board-view .comment-write-re .btns::after {content:''; display:block; clear:both;}
.board-view .comment-write-re .btns .add {display:inline-block;}
.board-view .comment-write-re .btns .add li {display: inline-block; vertical-align: top; width: 2.1rem; height: 2.1rem; position: relative;}
.board-view .comment-write-re .btns .add li a {display: block; border:1px solid #cad0d7; background:#fff; text-align:center; font-size:1.2rem; color:#5f6e81; line-height: 2rem; width:inherit; height:inherit;}
.board-view .comment-write-re .btns .add li input[type="file"] {opacity:0; width:inherit; height:inherit; position: absolute; top: 0; left: 0; cursor:pointer;}
.board-view .comment-write-re .btns .black {width: 4.2rem; height:2.1rem; color:#fff; background:#393d41; line-height: 2rem; padding: 0; text-align:center; float: right;}
.board-view .comment-list-wrap .re-reply .close {display:block; width:100%; border-bottom:1px solid #e8e8e8; text-align:center; font-family:'Nanum Square'; padding: 1rem;}

.board-view .comment-list-wrap .more {display:block; text-align:center; font-family:'Nanum Square'; font-size:.9rem; font-weight: 700; padding: 1rem; border-bottom: 1px solid #ccc; color:#333;}

.board-view .survey-wrap {border-top:2px solid #333; border-left:1px solid #ddd; border-right:1px solid #ddd; border-bottom:1px solid #ccc; margin: 2.2rem 0 3.5rem; font-family:'Nanum Square';}
.board-view .survey-wrap .subject {padding: 1.5rem 2rem; background:#f6f7f9; color:#333;}
.board-view .survey-wrap .subject::after {content:''; display:block; clear:both;}
.board-view .survey-wrap .subject .title { font-size:1.1rem; font-weight: 700; display:inline-block;}
.board-view .survey-wrap .subject .date {float:right;}
.board-view .survey-wrap .survey-list {padding: 0 2.2rem;}
.board-view .survey-wrap .survey-list > li {padding: 2rem 0; border-bottom:1px dotted #ccc; position:relative;}
.board-view .survey-wrap .survey-list .category {display: block; width:2.9rem; height:1.5rem; color:#fff; background:#3d86ef; border-radius:5px; position:absolute; top:2rem; right:0; text-align:center; line-height: 1.5rem; font-size:.7rem;}
.board-view .survey-wrap .survey-list .category.purple {background:#7064b2;}
.board-view .survey-wrap .survey-list .title {font-size:.9rem; font-weight: 700; vertical-align: middle; margin-bottom: 1rem; display: block; padding-right: 4rem;}
.board-view .survey-wrap .survey-list .title em {display: inline-block; width:1.6rem; height:1.6rem; border-radius:50%; background:#3d3d3d; color:#fff; text-align:center; line-height: 1.6rem; font-size:.8rem; margin-right: 1rem; vertical-align: middle;}
.board-view .survey-wrap .survey-list .check-list {padding-left: 2.3rem;}
.board-view .survey-wrap .survey-list .check-list > li {margin-bottom: .5rem;}
.board-view .survey-wrap .survey-list .check-list > li .check {margin-right: .3rem;}
.board-view .survey-wrap .btns {margin: 2rem 0; text-align:center;}
.board-view .survey-wrap .btns .btn {min-width:11.5rem; text-align:center; font-weight: 700;}

.board-view .vote-wrap {border-top: 1px solid #ccc; margin: 1.5rem 0 3.5rem; font-family:'Nanum Square'; padding-top: 3rem;}
.board-view .vote-wrap .title {display: block; padding-top: 3.8rem; text-align:center; background:url('/webroot/images/sub/vote.gif') center 0 /2.6rem no-repeat; font-size:1.1rem; font-weight: 700; margin-bottom: 1rem;}
.board-view .vote-wrap .date {display: block; text-align:center; margin-bottom: 1.5rem;}
.board-view .vote-wrap .vs-box {position:relative;}
.board-view .vote-wrap .vs-box::after {content:''; display:block; clear:both;}
.board-view .vote-wrap .vs-box li {height:3rem;}
.board-view .vote-wrap .vs-box li.round {width:3rem; position:absolute; top:0; left:50%; margin-left: -1.5rem; background:#3d3d3d; border-radius:50%; color:#fff; line-height: 3rem; text-align:center; z-index: 1; font-weight: 700;}
.board-view .vote-wrap .vs-box .yes, .board-view .vote-wrap .vs-box .no{float: left; width:50%;}
.board-view .vote-wrap .vs-box .yes label, .board-view .vote-wrap .vs-box .no label {background:#f6f7f9; padding: 1rem; font-size:.9rem; font-weight: 700; display: block; height:inherit;}
.board-view .vote-wrap .vs-box .yes label {border-top-left-radius:5px; border-bottom-left-radius:5px; padding-right: 2rem;}
.board-view .vote-wrap .vs-box .yes .txt {color:#3d86ef;}
.board-view .vote-wrap .vs-box .no .txt {color:#e563a6;}
.board-view .vote-wrap .vs-box .no label {border-top-right-radius:5px; border-bottom-right-radius:5px; padding-left: 2.5rem;}
.board-view .vote-wrap .vs-box .check {width:1.8rem; height:1.8rem; line-height: 1.8rem;}
.board-view .vote-wrap .vs-box li.yes .check {position:absolute; top:.6rem; right:2.5rem;}
.board-view .vote-wrap .vs-box li.no .check {position:absolute; top:.6rem; right:1rem;}
.board-view .vote-wrap .vs-box .yes.active label {background:#3d86ef;}
.board-view .vote-wrap .vs-box .no.active label {background:#e563a6;}
.board-view .vote-wrap .vs-box .active .txt {color:#fff;}
.board-view .vote-wrap .vs-box .active .check {border:1px solid rgba(255,255,255,.5); background:transparent;}
.board-view .vote-wrap .btns {margin: 2rem 0; text-align:center;}
.board-view .vote-wrap .btns .btn {min-width:11.5rem; text-align:center; font-weight: 700;}




/* 게시판 쓰기폼 */
.board-write {}
.board-write .form-title {margin-bottom: .8rem;}
.board-write .caution {color:#3d86ef; font-size:.75rem; font-family:'Nanum Square'; display: block; margin: .7rem 0;}
.board-write .option-wrap {margin: .5rem 0 2.5rem;}
.board-write .option-wrap > li {border-bottom: 1px solid #ddd; padding: .4rem 1rem;}
.board-write .option-wrap > li::after {content:''; display:block; clear:both;}
.board-write .option-wrap > li .category {float: left; width:7rem; font-family:'Nanum Square'; font-weight:700; color:#333; line-height: 2rem;}
.board-write .option-wrap > li .category .dot {position:relative; padding-left: .8rem; }
.board-write .option-wrap > li .category .dot::before {content:''; display:block; width:.3rem; height:.3rem; position:absolute; top:.2rem; left:0; background:#7e93b0; border-radius:50%;}
.board-write .option-wrap > li .cont {padding-left:7rem;}
.board-write .option-wrap > li .cont .toggle {float:right; line-height: 2rem;}
.board-write .option-wrap > li .cont .toggle:hover {text-decoration:underline;}
.board-write .option-wrap > li.option-add {background:#f6f7f9; display: none;}
.board-write .option-wrap > li.option-add .category {padding-left: .8rem;}

.board-write .type-select2 {margin: 1.5rem -.5rem .5rem;}
.board-write .type-select2 li {padding:0 .5rem;}
.board-write .type-select2 .card {display: block; border:1px solid #ddd; border-radius:5px; padding: 2.5rem .7rem; text-align:center; position:relative; cursor:pointer;}
.board-write .type-select2 .active .card {border:2px solid #3d86ef;}
.board-write .type-select2 .card input {opacity:0; position:absolute; top:.7rem; right:.7rem; z-index: -1;}
.board-write .type-select2 .card .check {position:absolute; top:.7rem; right:.7rem; width: 1.7rem; height:1.7rem; font-size:.9rem; line-height: 1.7rem;}
.board-write .type-select2 .card .title {display: block; padding-top: 4rem; font-size:1rem; font-weight: 700; margin-bottom: .8rem; background:url('/webroot/images/sub/type_select2_1.gif') center top no-repeat; background-size:2.6rem;}
.board-write .type-select2 li:nth-child(2) .title {background-image:url('/webroot/images/sub/type_select2_2.gif');}
.board-write .type-select2 li:nth-child(3) .title {background-image:url('/webroot/images/sub/type_select2_3.gif');}
.board-write .type-select2 li:nth-child(1) input[type="radio"]:checked ~ .title {background-image:url('/webroot/images/sub/type_select2_1_over.gif');}
.board-write .type-select2 li:nth-child(2) input[type="radio"]:checked ~ .title {background-image:url('/webroot/images/sub/type_select2_2_over.gif');}
.board-write .type-select2 li:nth-child(3) input[type="radio"]:checked ~ .title {background-image:url('/webroot/images/sub/type_select2_3_over.gif');}

.board-write .desc-list {border:1px solid #ddd; border-radius:5px; background:#f6f7f9; padding:0 1.3rem; margin-bottom: .5rem;}
.board-write .desc-list li {padding: 1rem 0; border-bottom: 1px dotted #c5c6c7;}
.board-write .desc-list li .title {display:inline-block; width: 3.5rem; float: left; color:#3d86ef;}
.board-write .desc-list li .desc {padding-left: 3.5rem; display: block;}

.board-write .border-box {border:1px solid #ddd; margin-bottom: .5rem; border-radius:5px; padding: 1.5rem; font-family:'Nanum Square';}
.board-write .border-box .category {display:block; width:3rem; height:3rem; border-radius:50%; background:#3d86ef; color:#fff; line-height: 3rem; text-align:center; float:left;}
.board-write .border-box .cont {padding-left: 4.5rem;}
.board-write .border-box .cont .form-box {margin-bottom: 1rem;}
.board-write .border-box .cont .form-box .form-control {padding-right: 5rem;}
.board-write .border-box .cont .form-box .btn {position:absolute; top:0; right:0; height: 2rem; background:#3d3d3d; border:0; color:#fff; padding: .4rem 1rem;}
.board-write .border-box .cont .form-box .btn i {font-size:1.3rem; vertical-align: middle; line-height: 1; }
.board-write .border-box .cont > * {margin-bottom: .5rem;}
.board-write .add-question {display: block; border:1px solid #ddd; margin: .5rem 0; border-radius:5px; padding: .9rem; text-align:center; background:#fafafa; font-size:.9rem; font-family:'Nanum Square'; font-weight: 700;}

.board-write .option-wrap > li .cont .date {display:inline-block; margin-right: 1.54rem; vertical-align: middle; }
.board-write .option-wrap > li .cont .period {display: inline-block; vertical-align: middle;}
.board-write .option-wrap > li .cont .period label {cursor:pointer;}
.board-write .option-wrap > li .cont .period label .check {margin-right: .5rem;}



/* sub0104 온라인제안결과 */
.board-type1 {border:1px solid #999; border-width:1px 0; margin:2rem 0 1.5rem;}
.board-type1 .item {padding: 1.5rem 0; border-bottom: 1px solid #e8e8e8;}
.board-type1 .item:last-of-type {border: 0;}
.board-type1 .item::after {content:''; display:block; clear:both;}
.board-type1 .item .subject {}
.board-type1 .item .subject em {color:#3d86ef; display: block; margin-bottom: .3rem;}
.board-type1 .item .subject .title {font-size:1rem; display: block; margin-bottom: .8rem;}
.board-type1 .item .info {}
.board-type1 .item .info::after {content:''; display:block; clear:both;}
.board-type1 .item .info > li {float: left; width:33.33%; border-left:1px dotted #999; text-align:center;}
.board-type1 .item .info > li:first-child {border:0;}
.board-type1 .item .info > li > * {display: block; font-family:'Nanum Square';}
.board-type1 .item .info > li i {font-size:1.6rem; display: block; margin-bottom: .6rem;}
.board-type1 .item .info > li:nth-child(1) i {color:#3d86ef;}
.board-type1 .item .info > li:nth-child(2) i {color:#1160ac;}
.board-type1 .item .info > li:nth-child(3) i {color:#6664b1;}
.board-type1 .item .info > li em {font-size:.95rem; color:#333; margin-bottom: .5rem; font-weight: 700;}
.board-type1 .item .info > li span {color:#767676;}

/* sub0201 갤러리형 게시판  */
.board-type2 {margin:2rem 0 1.5rem;}
.board-type2 .row > li {padding: 0 .75rem 1.5rem;}
.board-type2 .card {border:1px solid #ddd; border-radius:5px; overflow:hidden; display: block; position:relative; max-width:19rem; margin:0 auto;}
.board-type2 .card .img {border-bottom:1px solid #ddd; overflow:hidden; position: relative; padding-bottom: 58%; height: 0; overflow: hidden; max-width: 100%;}
.board-type2 .card .img img {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.board-type2 .card .hexagon {display:block; position:absolute; bottom:1.5rem; left:1rem; width:2.2rem; height:1.3rem; background:#3d86ef; color:#fff; text-align:center; font-size:.7rem; line-height: 1.1rem; z-index: 1;}
.board-type2 .card .hexagon::before { content: ""; position: absolute; top: -.7rem; left: 0; width: 0; height: 0;  border-left: 1.1rem solid transparent; border-right: 1.1rem solid transparent; border-bottom: .7rem solid #3d86ef;}
.board-type2 .card .hexagon::after { content: ""; position: absolute; bottom: -.7rem; left: 0; width: 0; height: 0;  border-left: 1.1rem solid transparent; border-right: 1.1rem solid transparent; border-top: .7rem solid #3d86ef;}
.board-type2 .card .hexagon.color2 {background:#345aaa;}
.board-type2 .card .hexagon.color2::before {border-bottom-color:#345aaa;}
.board-type2 .card .hexagon.color2::after {border-top-color:#345aaa;}
.board-type2 .card .hexagon.color3 {background:#6664b1;}
.board-type2 .card .hexagon.color3::before {border-bottom-color:#6664b1;}
.board-type2 .card .hexagon.color3::after {border-top-color:#6664b1;}
.board-type2 .card .desc {padding: 1rem;}
.board-type2 .card .desc .title {font-size:.9rem; color:#333; display:block; margin-bottom: .5rem;}
.board-type2 .card .mark {}
.board-type2 .card .mark span {vertical-align:middle; display:inline-block; margin-right: 1rem; color:#707579;}
.board-type2 .card .mark span i {vertical-align: middle; margin-right: .1rem;}
.board-type2 .card .mark span .xi-heart-o {color:#dd0373;}
.board-type2 .card .mark span .xi-share-alt-o {color:#4c8fef;}
.board-type2 .card .mark span .xi-comment-o {color:#9d52d2;}


/* 정책의견수렴 글등록 */
.type-select {text-align:center; font-family:'Nanum Square';}
.type-select .row {margin-bottom: 2.5rem;}
.type-select .row > li {padding: 0 .75rem;}
.type-select .row > li.active .card {background:linear-gradient(to bottom, #fdf9e9, #e2edf0); background:-webkit-gradient(linear, left top, right bottom, from(#fdf9e9), to(#e2edf0));}
.type-select .card {border:1px solid #ddd; border-radius:5px; overflow:hidden; display: block; cursor:pointer; padding: 2.7rem .6rem 3rem; position:relative;}
.type-select .card .control {position:absolute; top:1rem; right:1rem;}
.type-select .card .control input[type="radio"] {opacity:0; position:absolute; top:inherit; right:inherit;}
.type-select .card .control .radio-btn {display: block; width:2rem; height:2rem; background:#ddd; border-radius:50%; color:#fff; font-size:1rem; line-height: 2rem; text-align:center;}
.type-select .card .control input[type="radio"]:checked + .radio-btn {background:#e563a6}
.type-select .card img {display:inline-block; width:9.9rem; height:9.9rem; margin-bottom: 1.5rem;}
.type-select .card .title {display: block; font-size:1.2rem; font-weight: 700; margin-bottom: 1rem;}
.type-select .card .desc {color:#707579;}


/* 로그인 */
.login-wrap {margin-bottom: 6rem;}
.login-wrap .sns-login {margin: 0; font-family:'Nanum Square';}
.login-wrap .sns-login li {}
.login-wrap .sns-login li a {border:1px solid #ddd; display:block; text-align:center; padding: 1.5rem .5rem; color:#333;}
.login-wrap .sns-login .round {display:inline-block; width:2.5rem; height:2.5rem; border-radius:50%; color:#fff; font-size:1rem; line-height: 2.8rem; margin-bottom: .5rem;}
.login-wrap .sns-login .naver .round {background:#1ec800;}
.login-wrap .sns-login .kakao .round {background:#ffeb33; color:#3d1d22;}
.login-wrap .sns-login .facebook .round {background:#345393;}
.login-wrap .sns-login .google .round {background:#f83229; font-size:1.3rem;}
.login-wrap .sns-login .txt {display: block;}
.login-wrap .sub-title {display: block; position:relative; text-align:center; font-size:.9rem; font-weight: 700; margin: 1.5rem 0 1rem;}
.login-wrap .sub-title::before {content:''; width:100%; height:1px; background:#999; position:absolute; top:50%; left:0; z-index: -2;}
.login-wrap .sub-title::after {content:''; width:10rem; height:1rem; background:#fff; position:absolute; top:0; left:50%; margin-left: -5rem; z-index: -1;}
.form-box {position:relative;}
.login-wrap .form-box .form-control {height:2.8rem; padding-left: 4.7rem; margin-bottom: 1rem;}
.login-wrap .form-box label {position:absolute; top:0; left:0; font-weight: 700; display:block; width:4.7rem; height: 2.8rem; line-height: 2.8rem; padding-left: 1rem;}
.login-wrap .btns .btn {text-align:center;}
.login-wrap .btns .btn.full {height:3rem; font-weight: 700;}
.login-wrap .save-box {margin: 1rem 0;}

/* 접근성 기능 문제로 잠시 숨김처리 : 참여마당 > 고객의소리 > sns간편로그인*/
/*.login-wrap .sns-login #facebookBtn, .login-wrap .sns-login #googleBtn {display:none;}*/


/* 열린토론 - 토론주제 - 댓글상세 */
.debate-card {font-family:'Nanum Square'; background:linear-gradient(to bottom, #edf4fd, #edecfc); background:-webkit-gradient(linear, left top, right bottom, from(#edf4fd), to(#edecfc)); position: relative; padding-bottom: 3.6rem;}
.debate-card::before {content:''; width:10rem; height:8.3rem; background:url('/webroot/images/sub/debate_card1.png') 0 0 /contain no-repeat; position:absolute; top:3rem; left:4rem; z-index: 0;}
.debate-card::after {content:''; width:5.9rem; height:5.2rem; background:url('/webroot/images/sub/debate_card2.png') 0 0 /contain no-repeat; position:absolute; bottom:4rem; right:3rem; z-index: 0;}
.debate-card .container {z-index: 2;}
.debate-card .container > .title {font-size:1.2rem; font-weight: 700; display: block; text-align:center; padding: 2.5rem 0 2rem;}
.debate-card .row > li {padding:0 .75rem; z-index: 1; margin-bottom:1rem;}
.debate-card .row .card {border-radius:5px; background:#fff; display: block; position: relative;}
.debate-card .row .active .card::after {content:''; width: 0; height: 0; border-left: 17px solid transparent; border-right: 17px solid transparent; border-top: 15px solid #fff; position:absolute; bottom:-15px; left:50%; margin-left: -17px;}
.debate-card .row .card .subject {background:#f6f8fb; padding: 1.5rem; border-top-left-radius:5px;  border-top-right-radius:5px; height: 7.5rem;}
.debate-card .row .active .card .subject {background:linear-gradient(to right, #5f63b1, #1460ac); background:-webkit-gradient(linear, left top, right bottom, from(#5f63b1), to(#1460ac));}
.debate-card .row .card .subject > span {color:#707d8f; display: block; margin-bottom: .7rem;}
.debate-card .row .active .card .subject > span {color:#fff;}
.debate-card .row .card .subject .title {font-size:1rem; color:#333; font-weight: 700; line-height: 1.4; overflow: hidden; height: 2.7rem; display: block;}
.debate-card .row .active .card .subject .title {color:#fff;}
.debate-card .row .card > .list {margin: 1rem 1.5rem 0; border-bottom: 1px solid #cad0d7; padding-bottom: 1.5rem; height: 7.5rem; overflow: hidden;}
.debate-card .row .card .total {padding: 1rem 1.5rem; text-align:center; font-size:.85rem; color:#333; font-weight: 700;}
.debate-card .row .card .total .count {color:#fff; display: inline-block; background:#e563a6; border-radius:10px; min-width:2.4rem; height:1.2rem; line-height: 1.2rem; font-size:.8rem; margin-left: .5rem;}



/* 우수활동 회원 */
.best-member {font-family:'Nanum Square';}
.best-member .color-box {border:1px solid #ddd; border-left:5px solid #3d86ef; padding: 1.2rem 2rem; margin-bottom: 1rem;}
.best-member .color-box::after {content:''; display:block; clear:both;}
.best-member .color-box.purple {border-left-color:#6d64b2;}
.best-member .color-box.pink {border-left-color:#dd0373;}
.best-member .color-box .title {display:block; float:left; width: 12rem; font-size:1rem; color:#333; font-weight: 700; line-height: 2.7rem;}
.best-member .color-box .title i {font-size:1.2rem; margin-right: .7rem; color:#3d86ef; vertical-align: middle;}
.best-member .color-box.purple .title i {color:#6d64b2;}
.best-member .color-box.pink .title i {color:#dd0373;}
.best-member .color-box .top5 {float:left;}
.best-member .color-box .top5 > li {display:inline-block; margin: 0 1.5rem; font-size:.9rem; font-weight: 700;}

.best-member .membership {}
.best-member .membership li {padding: 0 .75rem;}
.best-member .membership li > a {display:block; border:1px solid #ddd; margin-bottom: 1.5rem;}
.best-member .membership .top {background:#f6f7f9; padding: 1.3rem .5rem; text-align:center;}
.best-member .membership .top .user-img {margin-bottom: .5rem; margin-right: 0;}
.best-member .membership .top .name {display: block; font-size:.9rem; font-weight: 700;}
.best-member .membership .txt {padding: 1rem; height: 6.2rem; overflow: hidden;}
.best-member .more {display: block; border:1px solid #ddd; background:#fafafa; color:#333; font-size:.9rem; text-align:center; margin-bottom: 6rem; line-height: 3rem; font-weight: 700;}



/* 마이페이지 sub0801 */
.user-info-wrap {background:#f6f8fb;}
.user-info-wrap .container {padding: 3.3rem 0;}
.user-info-wrap .profile-box {float: left; width: 13rem;}
.user-info-wrap .profile-box .user-img {width: 4rem; height: 4rem; margin-right: 1rem;}
.user-info-wrap .profile-box .user-img img {min-width: 4rem; min-height:4rem;}
.user-info-wrap .profile-box .name {font-size:1rem; font-weight: 700; color:#333; }
.user-info-wrap .profile-box .modify {display:inline-block; vertical-align: baseline; font-size:1.1rem; color:#747c89; margin-left: .8rem;}
.user-info-wrap .count-area {float: left; width:calc(100% - 13rem);}
.user-info-wrap .count-area > li {display:table-cell; width:1%; text-align:center; border-left:1px dashed #acadaf;}
.user-info-wrap .count-area > li:first-child {border:0;}
.user-info-wrap .count-area .desc {color:#707d8f; font-size:.75rem; padding:2rem .5rem 0; text-align:center; background:url('/webroot/images/sub/count_area1.png') center 0 no-repeat; background-size:auto 1.6rem; vertical-align:middle; display: inline-block;}
.user-info-wrap .count-area > li:nth-child(2) .desc {background-image:url('/webroot/images/sub/count_area2.png');}
.user-info-wrap .count-area > li:nth-child(3) .desc {background-image:url('/webroot/images/sub/count_area3.png');}
.user-info-wrap .count-area > li:nth-child(4) .desc {background-image:url('/webroot/images/sub/count_area4.png');}
.user-info-wrap .count-area > li:nth-child(5) .desc {background-image:url('/webroot/images/sub/count_area5.png');}
.user-info-wrap .count-area em {vertical-align:middle; font-family:'Nanum Square'; color:#333; font-size:2rem; font-weight: 700; display: inline-block; margin-left: .5rem;}

.mypage-list {border-top:1px solid #999; margin-bottom: 6rem;}
.mypage-list > li > a {display:block; padding:1rem; border-bottom:1px solid #e8e8e8;}
.mypage-list > li > a::after {content:''; display:block; clear:both;}
.mypage-list .round {width:3rem; height:3rem; border:2px solid #1f60ad; border-radius:50%; float:left; text-align:center; padding: .5rem; font-size:.7rem; color:#1f60ad; margin-right: 2.2rem;}
.mypage-list .round.blue {border-color:#3d86ef; color:#3d86ef;}
.mypage-list .round.red {border-color:#f2697c; color:#f2697c;}
.mypage-list .round.green {border-color:#33a6a6; color:#33a6a6;}
.mypage-list .txt {float:left; width:78%; font-family:'Nanum Square'; margin-top: .2rem;}
.mypage-list .txt .title {font-size:1rem; color:#333; font-weight: 700; display: block; margin-bottom: .5rem;}
.mypage-list .txt .desc {color:#999; display:block; }
.mypage-list .txt .title, .mypage-list .txt .desc {white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; overflow:hidden;}
.mypage-list .date {display:inline-block; float:right; padding: 1rem 0; color:#999; font-family:'Nanum Square';}

/* 마이페이지 sub0802 즐겨찾기 */
.mypage-list .count1 .round {font-size:0; background:#fff url('/webroot/images/sub/count_area1.png') center .6rem no-repeat;}
.mypage-list .count2 .round {font-size:0; background:#fff url('/webroot/images/sub/count_area2.png') center .6rem no-repeat;}
.mypage-list .count3 .round {font-size:0; background:#fff url('/webroot/images/sub/count_area3.png') center .6rem no-repeat;}
.mypage-list .count4 .round {font-size:0; background:#fff url('/webroot/images/sub/count_area4.png') center .6rem no-repeat;}
.mypage-list .count5 .round {font-size:0; background:#fff url('/webroot/images/sub/count_area5.png') center .6rem no-repeat;}
.mypage-list .count6 .round {font-size:0; background:#fff url('/webroot/images/sub/count_area6.png') center .6rem no-repeat;}
.mypage-list .count2 .txt .title {margin-top: .7rem;}




/* 회원가입 1 sub0701 */
.join {font-family:'Nanum Square';}
.join .step-list {position:relative; margin: 3rem auto 4rem;}
.join .step-list > li {display:table-cell; width: 1%; text-align:center; position: relative;}
.join .step-list > li::before {content:''; width:100%; height:2px; background:#c0c4cc; position:absolute; top:1.2rem; left:50%; z-index: -1;}
.join .step-list > li:last-child::before {display: none;}
.join .step-list .num {display: inline-block; width: 2.5rem; height: 2.5rem; border:2px solid #222; border-radius:50%; line-height: 2.5rem; font-size:.9rem; font-weight: 700; background:#fff; margin-bottom: .7rem; }
.join .step-list > li.active .num {color:#fff; background:linear-gradient(to right, #5a63b1, #1f60ad); background:-webkit-gradient(linear, left top, right bottom, from(#5a63b1), to(#1f60ad)); border:0; }
.join .step-list span {display: block; font-size:.9rem; font-weight: 700; word-break:keep-all;}
.join .step-list > li.active span {color:#1f60ad;}

.join .join-type {margin-bottom: 9rem;}
.join .join-type > li {padding: 0 .75rem;}
.join .join-type .gray-box {background:#f6f7f9; padding: 2.8rem 2rem; text-align:center; min-height: 19rem;}
.join .join-type .title {display: block; font-size:1rem; font-weight: 700; color:#333; margin-bottom: 1rem;}
.join .join-type .desc {color:#767676; display: block; margin-bottom: 1rem;}
.join .join-type .mail-i {display: inline-block; width:3.6rem; height:4rem; margin-bottom: 1.7rem;}
.join .join-type .btn.black {padding: .5rem 4.5rem;}


/* 회원가입2 sub0702 */
.join .id-type {margin: 0;}
.join .id-type > li > a {display: block; background:#fff; border:1px solid #f6f7f9; padding: .85rem 1rem; text-align:left;}
.join .id-type .round {display:inline-block; width:2.5rem; height:2.5rem; border-radius:50%; color:#fff; font-size:1rem; line-height: 2.8rem; margin-right: 1rem; text-align:center; vertical-align: middle;}
.join .id-type .naver .round {background:#1ec800;}
.join .id-type .kakao .round {background:#ffeb33; color:#3d1d22;}
.join .id-type .facebook .round {background:#345393;}
.join .id-type .google .round {background:#f83229; font-size:1.3rem;}
.join .id-type .txt {display:inline-block; vertical-align:middle;}

.join .title {position:relative;}
.join .title .mark {position:absolute; top:.2rem; right:0; font-size:.8rem; color:#767676; font-weight: 400; padding-left: .7rem;}
.join .title .mark::before {content:''; width:.2rem; height: .2rem; border-radius:50%; background:#3d86ef; position:absolute; top:.4rem; left:0;}
.join .join-form-area {margin-bottom: 2rem;}
.join .join-form-area .row {margin: 0 0 .3rem; border:1px solid #ddd; border-radius:3px; overflow:hidden;}
.join .join-form-area label {background:#f6f7f9; padding-left: 1rem; color:#333; font-weight: 700; height: 2.5rem; line-height: 2.5rem; display:block; cursor:default; position: relative;}
.join .join-form-area label.mark::after {content:''; display:inline-block; width:.2rem; height: .2rem; border-radius:50%; background:#3d86ef; margin-left: .3rem; vertical-align: middle;}
.join .join-form-area .form-control {border:0; height:2.5rem; }
.join .join-form-area .attach-file {position: relative;}
.join .join-form-area .attach-file input[type="file"] {opacity:0;position:absolute;left:0;top:0;cursor:pointer;}

.join .terms {background:#f6f7f9; border-radius:3px; padding:1rem 1.5rem; margin-bottom:2.5rem;}
.join .terms .row > li {padding:0 .75rem; }
.join .terms .row > li > a {display: block; border:1px solid #ddd; text-align:center; background:#fff; border-radius:3px; height: 2.8rem; line-height: 2.8rem;}
.join .terms .row > li > a i {font-size:1.1rem; vertical-align: middle; margin-right: .5rem;}

/* 회원가입3 sub0703 */
.join .mail-send {background:#f6f7f9; padding: 4.2rem .7rem 5.5rem; text-align:center;}
.join .mail-send .mail-i {margin-bottom: 1.5rem;}
.join .mail-send .title {font-size:1rem; display: block; margin-bottom: 1rem; font-weight: 700; }
.join .mail-send .txt {color:#767676; line-height: 1.5; display: block;}
.join .mail-send .txt em {color:#3d86ef;}



/* r&d관련정보 sub0501 */
.rnd-link {margin-bottom: 6rem;}
.rnd-link .link li {padding: 0 .75rem; margin-bottom: 1.5rem;}
.rnd-link .link li a {display:block; border:1px solid #ddd;}
.rnd-link .link .img {height: 8.5rem; display:flex; display:-webkit-flex; align-items:center; -webkit-align-items:center; justify-content:center;}
.rnd-link .link .txt {padding: 1.2rem 1.3rem; background:#fafbfc; position:relative;}
.rnd-link .link .txt span {font-size:.9rem; font-weight: 700; color:#333;}
.rnd-link .link .round {position:absolute; top:.6rem; right:.5rem; width: 2.2rem; height:2.2rem; border-radius:50%; background:#3d86ef; color:#fff; text-align:center; line-height: 2.2rem;}




/* 일번가알아보기 sub0601 */
.sub0601 {font-family:'Nanum Square';}
.sub0601 .card-list {margin: 5rem 0; overflow:hidden; position:relative;}
.sub0601 .card-list::after {content:''; width: 100%; height:1px; background:#fff; position:absolute; bottom:0; left:0; z-index: 1;}
.sub0601 .card-list [class^="col-"] {padding:0 .75rem; border-bottom:1px solid #ddd;}
.sub0601 .card-list .card {height: 33rem; padding: 2.5rem 0;}
.sub0601 .card-list .card img {max-width:100%; display:block; margin-bottom: 1.5rem;}
.sub0601 .card-list .card .caption {display:block; font-size:1.3rem; color:#333; font-weight: 700; margin: 1.2rem 0;}
.sub0601 .card-list .card .desc {padding-top:1.3rem; position:relative; line-height: 1.7; word-break:keep-all;}
.sub0601 .card-list .card .desc::before {content:''; width:2.5rem; height:1px; background:#333; position:absolute; top:0; left:0;}

/* 일번가알아보기 sub0601 new */ 
/* 2019-05-10 추가 */
.sub05-new{padding-bottom:5rem;}
.process-list{position:relative}
.process-list .desc-box {padding:0;}
.process-list .desc-box .desc-inner{padding:2rem 3rem;}
.process-list .desc-box .desc-inner:after{clear:both;display:block;content:''}
.process-list .desc-inner > .tit{padding-top:1.75rem;padding-right:2.75rem;font-size:1.8rem;font-weight:700;text-align:center}
.process-list .desc-inner > .tit span{color:303030;display:block;}
.process-list .desc-inner > .tit strong{display:block;color:#dc894c;font-weight:700}
.process-list .object{position:relative;/* padding:0 1.5rem */}
.process-list .object:after{position:absolute;display:block;width:100%;height:10px;border-radius:30px;top:2.75rem;left:0;/* transform:translateY(-50%);-webkit-transform:translateY(-50%); */content:'';z-index:-1;
background: #faf2d5;background: -moz-linear-gradient(left, #faf2d5 0%, #e2edf0 100%);background: -webkit-linear-gradient(left, #faf2d5 0%,#e2edf0 100%);background: linear-gradient(to right, #faf2d5 0%,#e2edf0 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#faf2d5', endColorstr='#e2edf0',GradientType=1 );}
.process-list .object > li{position:relative;text-align:center;padding:0 20px;z-index:1}
.process-list .object > li:nth-child(1):after{position:absolute;right:-1.5rem;top:1.4rem;width:3.15rem;height:3.25rem;display:block;content:'';background:url('/webroot/images/sub/sub05_arrow.png')no-repeat 0 0 /contain;}
.process-list .object > li:nth-child(2):after{position:absolute;right:-1.5rem;top:1.4rem;width:3.15rem;height:3.25rem;display:block;content:'';background:url('/webroot/images/sub/sub05_arrow2.png')no-repeat 0 0 /contain;}
.process-list .object > li:nth-child(3):after{position:absolute;right:-1.5rem;top:1.4rem;width:3.15rem;height:3.25rem;display:block;content:'';background:url('/webroot/images/sub/sub05_arrow3.png')no-repeat 0 0 /contain;}
.process-list .object li > .tit{position:relative;z-index:1;display:table;border-radius:50%;background:#dc894c;width:5.5rem;height:5.5rem;margin:0 auto;padding-top:2.5rem;}
.process-list .object li:nth-child(2n+2) > .tit{background:#dcb54c}
.process-list .object li > .tit:after{position:absolute;display:block;width:2.25rem;height:2.25rem;left:50%;top:.8rem;transform:translateX(-50%);-webkit-transform:translateX(-50%);background-image:url('/webroot/images/sub/sub05_icons.png');background-repeat:no-repeat;background-size:9rem 2.25rem;content:''}
.process-list .object li:nth-child(1) > .tit:after{background-position:0 0}
.process-list .object li:nth-child(2) > .tit:after{background-position:-2.25rem 0}
.process-list .object li:nth-child(3) > .tit:after{background-position:-4.5rem 0}
.process-list .object li:nth-child(4) > .tit:after{background-position:-6.75rem 0}
.process-list .object li > .tit span{position:relative;display:table-cell;vertical-align:middle;font-size:1.2rem;line-height:1.2rem;color:#fff}
.process-list .object li > .tit span > em{display:none}
.process-list .object li .desc-list {padding-left:.5rem;padding-top:.4rem;}
.process-list .object li .desc-list > li{padding-left:1rem;padding-right:0;position:relative;font-size:.8rem;line-height:1.2rem;text-align:left}
.process-list .object li .desc-list > li:after{position:absolute;display:block;left:0;top:0;font-family:"xeicon";font-size:20px;color:#b0b0b0;content:"\e93f"}
.sub05-card {padding-top:4rem;}
.sub05-card .card-list > ul > li {position:relative;padding:1.5rem 0;min-height:9.8rem}
.sub05-card .card-list > ul > li > a{position:relative;display:block;width:100%;height:100%;padding-right:3.4rem;padding-bottom:1rem}
.sub05-card .card-list > ul > li > a:before,
.sub05-card .card-list > ul > li > a:after{position:absolute;content:'';display:block;background:#c6c6c6}
.sub05-card .card-list > ul > li > a:before{width:3.75rem;height:1px;right:0;bottom:10px;}
.sub05-card .card-list > ul > li > a:after{width:1.1rem;height:1px;right:-1px;bottom:18px;transform:rotate(45deg); -webkit-transform:rotate(45deg);}
.sub05-card .card-list > ul > li:first-of-type{padding-top:0}
.sub05-card .card-list .card{position:relative;width:100%;}
.sub05-card .card-list .card:after{clear:both;display:block;content:''}
.sub05-card .card-list .card .img-wrap {text-align:center}
.sub05-card .card-list .card .img-wrap img{}
.sub05-card .card-list .card > .txt{transition: color .4s;-webkit-transition: color .4s;}
.sub05-card .card-list .card > .txt:hover .caption,
.sub05-card .card-list .card > .txt:hover .desc{color:#4c9fdc}
.sub05-card .card-list .card > .txt .caption{position:relative;display:block;padding:1.2rem 0;font-size:1.3rem;line-height:1.6rem;font-weight:700}
.sub05-card .card-list .card > .txt .caption:before,
.sub05-card .card-list .card > .txt .caption:after{display:block;position:absolute;top:.2rem;width:.4rem;height:.4rem;border-radius:50%;content:'';}
.sub05-card .card-list .card > .txt .caption:before{background:#dc894c;left:0;}
.sub05-card .card-list .card > .txt .caption:after{background:#4c9fdc;left:.6rem;}
.sub05-card .card-list .card > .txt .desc{position:relative; }
.sub05-card .card-list .card > .txt .desc > ul > li{position:relative;padding:.1rem 10px .1rem;line-height:1.2rem;word-break:keep-all}
.sub05-card .card-list .card > .txt .desc > ul > li:after{position:absolute;display:block;width:5px;height:1px;top:.6rem;left:0;background:#333;content:''}


/* ==================== 반응형 ================== */


@media (max-width:1200px) {
  #spot .snb-pager .left {left: .75rem;}
  #spot .snb-pager .right {right: .75rem;}
}
@media (max-width:991px) {
	.process-list .object > li{width:25%;float:left;}
}
@media (max-width:835px) {
 /*  */
  .process-list .object{padding:0;}
  .process-list .desc-inner > .tit{padding-right:0;padding-bottom:2rem;}
}

@media (max-width:768px) {
  #spot .snb-pager {display: none;}

  #snb-depth2 {border-bottom: 0;}
  #snb-depth2 .container {padding: 0; position: relative;}
  #snb-depth2 .title {display: block; height: 3.3rem; font-size:.9rem; color:#3d86ef; line-height: 3.3rem; background:#f1f2f3; position:relative; z-index: 1;}
  #snb-depth2 .title i {position:absolute; top:1rem; right:1rem; color:#333;}
  #snb-depth2 .depth2 {background:#3d86ef; display: none; position:absolute; top:3.3rem; left:0; width: 100%;}
  #snb-depth2 .depth2 > li {display: block;}
  #snb-depth2 .depth2 > li > a, #snb-depth2 .depth2 > li.active > a {color:#fff;}
  #snb-depth2 .depth2 > li > a {height: 2.8rem; line-height: 2.8rem;}

  #category-wrap .title {display: block; width: 100%; height:3.2rem; line-height: 3.2rem; color:#fff; background:linear-gradient(to right, #7064b2, #025fab); background:-webkit-gradient(linear, left top, right top, from(#7064b2), to(#025fab)); text-align:center; font-size:.9rem; position: relative;}
  #category-wrap .title i {position:absolute; top:1.2rem; right:1.2rem;}

  #category-wrap .depth3 {position:absolute; top:3.2rem; left:0; width:100%; z-index: 3; border:1px solid #025fab; border-top-width:0; background:#fff; padding: .4rem 0; display: none;}
  #category-wrap .depth3 > li {display: block; width: 100%; border:0; color:#333;}
  #category-wrap .depth3 > li > a {height: 2.4rem;}
  #category-wrap .depth3 > li.active > a {background:#fff; color:#333;}

  #category-wrap .depth4 .box {padding:0 3.5rem;}
  #category-wrap .depth4 .box .bx-controls-direction {position:absolute; top:0; left:0; width:100%;}
  #category-wrap .depth4 .box .bx-controls-direction a {display: block; width: 3.2rem; height:3.2rem; background:#fff; position:absolute; top:0; font-size:0; line-height: 3.2rem; text-align:center;}
  #category-wrap .depth4 .box .bx-controls-direction a.bx-prev {left: 0; border-right:1px solid #ddd;}
  #category-wrap .depth4 .box .bx-controls-direction a.bx-next {right: 0; border-left:1px solid #ddd;}
  #category-wrap .depth4 .box .bx-controls-direction a::before {font-family: 'xeicon' !important;display:inline-block;speak:none;font-style: normal;font-weight:normal;font-variant:normal;text-transform:none;-webkit-font-smoothing:antialiased; font-size:1rem;}
  #category-wrap .depth4 .box .bx-controls-direction a.bx-prev::before {content: "\e906";}
  #category-wrap .depth4 .box .bx-controls-direction a.bx-next::before {content: "\e907";}

  .table-wrap.board {width:100%; text-align:left;}
  .table-wrap.board thead {display:none;}
  .table-wrap.board tr {border-bottom:1px solid #ddd; padding:1rem 0;}
  .table-wrap.board tr::after {content:''; display:block; clear:both;}
  .table-wrap.board td {display: block; border-width:0; padding: .5rem 1rem; float:left;}
  .table-wrap.board .num {display:none;}
  .table-wrap.board .category {width:6.5rem;}
  .table-wrap.board .subject {width:calc(100% - 7rem) !important;}
  .table-wrap.board .name::before {content:'작성자 : '; display:inline-block; vertical-align:top; margin-right:.3rem;}
  .table-wrap.board .date::before {content:'작성일 : '; display:inline-block; vertical-align:top; margin-right:.3rem;}


  .sub0601 .card-list .card {height:inherit;}

  .process-list .desc-box .desc-inner{padding:2rem 1rem}
  .desc-box {padding:2rem;}
  .desc-box .row > li.title {margin-bottom: 1rem;}
  .process-list .object > li{padding:0 .5rem;word-break:keep-all}
  .process-list .object li .desc-list{padding-left:0}
  
 
}

@media (max-width:604px) {
	.process-list .object:after{clear:both;display:block;content:''}
	.process-list .object > li:after{display:none}
	.process-list .object > li:nth-child(1):after,
	.process-list .object > li:nth-child(2):after,
	.process-list .object > li:nth-child(3):after{display:none}

/* 	.process-list .object > li{display:table-cell;float:inherit;padding-bottom:3rem;}
	.process-list .object > li:after{right:inherit;left:50%;bottom:-3rem;transform:rotate(90deg);-webkit-transform:rotate(90deg);  } */

}
@media (max-width:490px) {
  .board-type2 .row > li {width:100%;}
  .table-top .search-box {float:inherit; margin:1rem 0;}

  .cont-top.sv5 .container{padding-right:15px}
  .cont-top .container .btn-wrap{position:relative;right:inherit;top:inherit;transform:inherit;-webkit-transform:inherit;margin-top:2rem;width:100%;border-radius:1rem}

  /* .process-list .object:after{width:10px;height:100%;left:50%;transform:translateX(-50%);-webkit-transform:translateX(-50%)}
  .process-list .object > li{width:100%} */
  .process-list .object > li{width:50%;height:160px;background:#dc894c;border-right:1px solid #fff}
  .process-list .object > li:nth-child(2n+2){background:#dcb54c;border-right:0}
  .process-list .object > li:nth-child(1),
  .process-list .object > li:nth-child(2){margin-bottom:1px}
  .process-list .object li > .tit span > em{display:inline-block}
  .process-list .object li .desc-list,
  .process-list .object li .desc-list > li:after{color:#fff}

}

@media (max-width:418px) {
  .process-list .object > li{width:100%;border-right:0}
}