@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700&family=Roboto:wght@300;400;500&display=swap');

*, :before, :after {margin:0; padding:0; border:0; vertical-align:top; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}

html {-webkit-font-smoothing:antialiased;}
table {width:100%; border-collapse:collapse; border-spacing:0; table-layout:fixed;}
th, td {vertical-align:middle; word-break:break-word;}
ul, ol, dl {list-style:none;}
hr {display:none;}
caption, figcaption, legend {overflow:hidden; position:absolute; z-index:-1; height:0; visibility:hidden;}
h1, h2, h3, h4, h5, h6, strong {font-weight:600;}
a {color:#020000; text-decoration:none;}
a:hover, a:focus {text-decoration:none; outline:none;}
em {font-style:normal;}
address {font-style:normal;}
strong {font-style:normal;}
button {padding:0 ; cursor:pointer; background:none; vertical-align:middle; appearance:none; font-family:"Noto Sans KR", "맑은 고딕", sans-serif; color:#020000;}
label, input, select {outline:none; appearance:none;}

select {appearance:none; color:#020000; font-family:"Noto Sans KR", "맑은 고딕", sans-serif; min-width:100px; height:48px; padding:0 20px; font-size:16px; line-height:48px; vertical-align:top; border:1px solid #ddd; border-radius:8px; background:url(../../resources/img/icon_select_arrow.png) no-repeat 100% 50%; transition:.5s;}
select:focus {border:1px solid #0ACF83;}
select:disabled {background-color:#fafafa; color:#666;}
select::-ms-expand {display:none;}

input {margin:0; padding:0; color:#020000; font-family:"Noto Sans KR", "맑은 고딕", sans-serif; min-width:80px; height:48px; padding:0 20px; font-size:16px; line-height:48px; vertical-align:top; appearance:none; border-radius:0;}
input[type="text"],
input[type="password"],
input[type="number"],
input[type="tel"],
input[type="file"],
input[type="email"],
input[type="date"] {height:48px; background-color:#fff; box-sizing:border-box; border:1px solid #ddd; appearance:none; border-radius:8px; transition:.5s;}
input[type="text"]:focus,
input[type="password"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="file"]:focus,
input[type="email"]:focus,
input[type="date"]:focus {border:1px solid #0ACF83;}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {appearance:none; margin:0;}

.inputWrap {display:flex; gap:10px 30px; flex-wrap:wrap; align-items:center; margin-top:15px;}
.inputWrap label input {width:80%;}
input[type=checkbox] {position:absolute; z-index:-1; top:6px; left:1px; width:22px; height:22px;}
input.check + label {position:relative; z-index:1; display:inline-block; overflow:hidden; min-height:24px; padding-left:34px; line-height:24px; cursor:pointer;  transition:.5s;}
input.check + label:before {content:''; position:absolute; top:1px; left:0; width:24px; height:24px; border:2px solid #ddd; border-radius:4px; background-color:#fff;}
input.check + label:after {content:''; position:absolute; top:3px; left:8px; width:8px; height:14px; border-right:2px solid #fff; border-bottom:2px solid #fff; transform:rotate(45deg);}
input.check:checked + label:before {border:2px solid#0ACF83; background-color:#0ACF83;}

input.keyWord + label {height:32px; padding:0 10px; font-size:14px; line-height:32px; border-radius:16px; background:#F9F9FA; cursor:pointer;}
input.keyWord:checked + label {color:#fff; background:#0ACF83;}

input.toggle + label {position:relative; display:inline-block; width:68px; height:48px;}
input.toggle + label:before {content:''; position:absolute; top:13px; left:0; width:70px; height:24px; border-radius:4px; border:1px solid #ddd; background:#fff; transition:.5s;}
input.toggle + label:after {content:'NO'; color:#020000; font-size:12px; line-height:20px; text-align:center; position:absolute; top:15px; left:2px; width:40px; height:20px; border:0; border-radius:4px; background:#ddd; transition:.5s;}
input.toggle:checked + label:after {content:'YES'; color:#fff; border:0; background:#0ACF83; transform:translateX(26px);}

input[type="radio"] {position:absolute; z-index:-1; visibility:hidden; width:22px; height:22px;}
input[type="radio"] + label {position:relative; display:inline-block; overflow:hidden; height:48px; padding-left:30px; color:#020000; font-size:16px; line-height:22px; vertical-align:middle; cursor:pointer;}
input[type="radio"] + label:after {content:''; position:absolute; left:0; top:0; width:24px; height:24px; text-indent:-9999em; border:2px solid #ddd; border-radius:12px;}
input[type="radio"]:checked + label {color:#000;}
input[type="radio"]:checked + label:after {border:2px solid #0ACF83; background:#0ACF83;}
input[type="radio"]:checked + label:before {content:''; position:absolute; left:6px; top:6px; z-index:2; width:12px; height:12px; text-indent:-9999em; background:#fff; border-radius:6px;}
input[type="radio"].noText + label {position:relative; display:inline-block; overflow:hidden; width:18px; height:18px; text-indent:-9999em; border:1px solid #ccc; vertical-align:middle; cursor:pointer;}
input[type="radio"].noText:checked + label {border:1px solid #40cecd;}
input[type="radio"].noText:checked + label:after {content:''; position:absolute; top:0; left:5px; width:6px; height:12px; border-right:2px solid #40cecd; border-bottom:2px solid #40cecd; transform:rotate(45deg);}

textarea {-webkit-appearance:none; border-radius:0; border:1px solid #d1d1d1; color:#222; font-weight:300; background:#fff; padding:8px 12px; font-family:"Noto Sans KR", "맑은 고딕", sans-serif; font-size:17px; width:100%; min-height:80px; box-sizing:border-box; resize:none;}

::placeholder {color:#858689; font-weight:400; opacity:1;}
:-ms-input-placeholder {color:#858689; font-weight:400;}
::-ms-input-placeholder {color:#858689; font-weight:400;}

body {font-family:"Noto Sans KR", "맑은 고딕", sans-serif; font-weight:400; font-size:16px; color:#020000; line-height:26px; word-break:keep-all; -webkit-text-size-adjust:100%; -moz-text-size-adjust:100%; -ms-text-size-adjust:100%; font-style:normal;}

#wrap {width:100%;}
#wrap.on {position:absolute; width:100%; height:100%; overflow:hidden;}


/*========================================= Header =========================================*/
header {width:100%; height:60px; border-bottom:1px solid #f0f0f0;position:relative;}
header.openMenu {height:auto; min-height:100vh;} /* 메뉴 열릴 때만 높이 증가 */
/****************** logo ******************/
header > h1 {width:100%; height:60px; padding-top:16px; text-align:center; border-bottom:1px solid #eee;}
header > h1 img {width:140px;}

/****************** nav ******************/
header > nav {position:absolute; top:60px; left:0; width:100%;z-index:9999;}
header > nav.on {min-height:calc(100vh - 60px);}
header > nav > a {position:absolute; top:-40px; left:15px; width:24px; height:20px; text-indent:-9999em; border-top:2px solid #333; border-bottom:2px solid #333;}
header > nav > a:after {content:''; position:absolute; top:7px; left:0; width:100%; height:2px; background:#333;}
header > nav > ul {display:none; position:absolute; top:0; left:0; z-index:9999; width:100%; height:100%; padding-top:30px; overflow:hidden; overflow-y:auto; background:#fff;}
header > nav > ul:before {content:'';}
header > nav > ul > li {position:relative;}
header > nav > ul > li > a {display:block; height:50px; padding-left:15px; font-size:18px; font-weight:500; line-height:50px;}
header > nav > ul li ul {display:none;}
header > nav > ul li ul li {height:28px; margin-top:10px; line-height:28px;}
header > nav > ul li ul li:first-child {margin-top:0;}
header > nav > ul li ul li a {display:block; padding-left:20px; color:#858585;}

/****************** login ******************/
header > div {position:absolute; top:60px; left:0; z-index:100; width:100%; height:0; padding:0 15px; background:transparent;}
header > div .search {position:relative; border:1px solid #eee; border-radius:20px;}
header > div .search input {width:100%; height:40px; padding-right:50px; border:1px solid #fff; border-radius:20px; transition:.5s;}
header > div .search:hover input {border-color:#0ACF83;}
header > div .search button {position:absolute; top:0; right:0; width:40px; height:40px; text-indent:-9999em; background:url(../../resources/img/header_serch.png) no-repeat 50% 50%;}
header > div .login {position:absolute; top:-45px; right:15px; overflow:hidden; width:30px; height:30px; padding:0; text-indent:-9999em; border:1px solid #eee; border-radius:15px; background:#fff url(../../resources/img/icon_user_default.png) no-repeat 50% 50%; background-size:100% 100%;}
header > div .info {position:absolute; top:0; right:0;}
header > div .info > a {position:absolute; top:-45px; right:15px; display:table-cell; text-align:center; vertical-align:middle; overflow:hidden; width:30px; height:30px; padding:0; border:1px solid #eee; border-radius:15px;}
header > div .info > a img {vertical-align:middle; max-width:100%; max-height:100%;}
header > div .info div {display:none; flex-direction:column; position:absolute; top:0; right:5px; z-index:2; width:140px; padding:10px; line-height:18px; border-radius:10px; background:#fff; box-shadow:0 0 20px 0px rgba(0, 0, 0, 0.2);}
header > div .info div.on {display:flex;}
header > div .info div span {font-size:14px; color:#858585;}
header > div .info div a {font-size:14px; margin-top:5px; transition:.5s;}
header > div .info div a:hover {color:#0ACF83;}
header > div .lang-buttons {position:absolute;top:-45px; right:15px; display:flex; gap:5px;}
header > div .lang-btn {width:30px; height:30px; border-radius:15px; background-color:#18763E; color:white; font-weight:bold; font-size:12px; text-align:center; line-height:30px; text-decoration:none; transition:background-color 0.3s, transform 0.2s;}
header > div .lang-btn:hover {background-color:#0ACF83; transform:scale(1.05);}
/*========================================= // Header =========================================*/



/*========================================= Main content =========================================*/
.main h3 {font-size:18px; font-weight:600;}
/* slide */
.main .slide {position:relative; overflow:hidden; width:100%; height:280px;}
.main .slide ul {height:280px;}
.main .slide ul li {position:relative; height:280px;padding:0 15px; background:url(../../resources/img/key01.png) no-repeat 50% 50%; background-size:cover; pointer-events:none; transition-property:opacity; backface-visibility:hidden;}
.main .slide ul li:nth-child(2) {background:url(../../resources/img/key02.png) no-repeat 50% 50%; background-size:cover;}
.main .slide ul li:nth-child(3) {background:url(../../resources/img/key03.png) no-repeat 50% 50%; background-size:cover;}
.main .slide ul li:nth-child(4) {background:url(../../resources/img/key04.png) no-repeat 50% 50%; background-size:cover;}
.main .slide ul li:nth-child(5) {background:url(../../resources/img/key05.png) no-repeat 50% 50%; background-size:cover;}
.main .slide ul li:nth-child(6) {background:url(../../resources/img/key06.png) no-repeat 50% 50%; background-size:cover;}
.main .slide ul li > div {width:100%; padding:30px 0 15px;}
.main .slide ul li > div h5 {color:#FFF; font-size:18px; font-weight:500; line-height:20px; text-shadow:0 0 5px rgba(0,0,0,.5);}
.main .slide ul li > div p {margin-top:10px; color:#FFF; font-size:12px; font-weight:400; line-height:16px; text-shadow:0 0 5px rgba(0,0,0,.5); overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:5; -webkit-box-orient:vertical;}
.main .slide .swiperBtn {display:none; position:absolute; top:50%; z-index:99; width:60px; height:60px; transform:translateY(-50%); transform:rotate(45deg); cursor:pointer;}
.main .slide .swiperBtn.swiper-button-disabled {opacity:.2;}
.main .slide .swiper-prev {left:80px; border-bottom:2px solid #fff; border-left:2px solid #fff;}
.main .slide .swiper-next {right:80px; border-top:2px solid #fff; border-right:2px solid #fff;}
.main .slide .swiper-paging {position:absolute; bottom:15px; left:0; z-index:99; width:100%; height:5px; padding:0 15px; display:flex; gap:10px; justify-content:center;}
.main .slide .swiper-paging span {position:relative; overflow:hidden; flex:1; height:2px; background:rgba(255,255,255,.3); border-radius:1px; cursor:pointer; transition:.5s;}
.main .slide .swiper-paging span:hover {background:rgba(255,255,255,.6);}
.main .slide .swiper-paging span:after {content:''; position:absolute; top:0; left:0; width:0px; height:5px; background:#fff;}
.main .slide .swiper-paging span.swiper-pagination-bullet-active:after {width:100%; background:#fff; animation-name:slideBar; animation-duration:8s;}

@keyframes slideBar {
  0% {width:0px;}
  100% {width:100%;}
}

.main .slide .count {display:flex; justify-content:space-between; gap:10px; position:absolute; bottom:35px; left:50%; z-index:99; width:100%; padding:0 15px 10px; background:rgba(0,0,0,.3); transform:translateX(-50%);}
.main .slide .count > a {display:none; width:60px; height:56px; margin-top:15px; color:#fff; font-weight:600; line-height:20px; word-break:keep-all; border-radius:8px; background:#0ACF83;}
.main .slide .count dl {flex:1; text-align:center;}
.main .slide .count dl dt {width:55px; margin:0 auto; color:#fff; font-size:12px; line-height:14px;}
.main .slide .count dl dd {color:#fff; font-size:24px; font-weight:600; line-height:36px;}
.main .slide .count dl dd:after {content:'+'; margin-left:5px;}

.main .grid {width:100%;}
.main .grid > div {position:relative; width:100%;}
.main .grid > div:first-child {padding-top:15px; background:#F9FAFC;}
.main .grid .more {position:absolute; top:0; right:15px; overflow:hidden; width:24px; height:24px; text-indent:-9999em; border:1px solid #ccc; border-radius:16px;}
.main .grid .more:after {content:''; position:absolute; top:7px; right:8px; width:8px; height:8px; border-top:2px solid #ccc; border-right:2px solid #ccc; transform:rotate(45deg); transition:.5s;}

.main .grid .kProject {overflow:hidden; padding:0 15px 15px;}
.main .grid .kProject > div {width:100%; /*padding-left:80px;*/}
.main .grid .kProject > div:last-child {margin-top:20px;/* padding-left:0;*/}
.main .grid .kProject ul {column-gap:20px; transition-timing-function:linear;}
.main .grid .kProject > div:last-child ul {padding-left:80px;}
.main .grid .kProject ul li {display:flex; align-items:center; gap:10px; position:relative; width:320px !important; height:50px; padding:0 30px 0 10px; border-radius:12px; box-shadow:4px 10px 20px 0px rgba(0, 0, 0, 0.06);background:#fff; cursor:pointer;}
.main .grid .kProject ul li:before {content:''; position:absolute; top:20px; right:10px; width:12px; height:12px; border-radius:6px; background:#F3F3F3; transition:.5s;}
.main .grid .kProject ul li:after {content:''; position:absolute; top:22px; right:12px; width:6px; height:6px; border-top:2px solid #888; border-right:2px solid #888; transform:rotate(45deg); transition:.5s;}
.main .grid .kProject ul li:hover:before {background:#0ACF83;}
.main .grid .kProject ul li:hover:after {border-top:2px solid #fff; border-right:2px solid #fff;}
.main .grid .kProject ul li div {display:flex; justify-content:center; align-items:center; overflow:hidden; width:30px; height:30px; border-radius:8px; background:#FAFAFA;}
.main .grid .kProject ul li div img {max-width:100%; max-height:100%;}
.main .grid .kProject ul li dl {flex:1; overflow:hidden; line-height:20px;}
.main .grid .kProject ul li dl dt {overflow:hidden; width:100%; text-overflow:ellipsis; white-space:nowrap; font-size:14px;}
.main .grid .kProject ul li dl dd {overflow:hidden; width:100%; color:#858689; font-size:12px; text-overflow:ellipsis; white-space:nowrap;}

.main .grid .kBanner {overflow:hidden; width:100%;}
.main .grid .kBanner img {max-width:100%;}

.main .grid .kCase {position:relative; margin-top:40px;}
.main .grid .kCase ul {display:flex; justify-content:space-between; gap:20px; margin-top:20px;}
.main .grid .kCase ul li {flex:1; overflow:hidden; border-radius:24px; background:#fff;}
.main .grid .kCase ul li div {display:flex; justify-content:center; align-items:center; overflow:hidden; height:226px;}
.main .grid .kCase ul li div img {max-width:100%; max-height:100%;}
.main .grid .kCase ul li dl {height:150px; padding:32px;}
.main .grid .kCase ul li dl dt {width:100%; height:52px; margin-bottom:10px; font-size:18px; line-height:26px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.main .grid .kCase ul li dl dd {color:#888;}

.main .grid .kNotice {position:relative; margin-top:20px; padding:0 15px;}
.main .grid .kNotice > div:first-child {margin-bottom:20px;}
.main .grid .kNotice .noticeList {margin-top:20px; padding:0 15px; border-radius:10px; background:#fff;}
.main .grid .kNotice .noticeList li {display:flex; justify-content:space-between; align-items:center; gap:15px; border-top:1px solid #eee;}
.main .grid .kNotice .noticeList li:first-child {border-top:0;}
.main .grid .kNotice .noticeList li:hover {background:#f8f8f8;}
.main .grid .kNotice .noticeList li a {flex:1; overflow:hidden; font-size:14px; line-height:46px; text-overflow:ellipsis; white-space:nowrap;}
.main .grid .kNotice .noticeList li span {color:#858689; font-size:12px; line-height:46px;}

.main .grid .kNotice .linkList {margin-top:20px; padding:0 15px; border-radius:10px; background:#fff;}
.main .grid .kNotice .linkList li {display:none; justify-content:center; align-items:center; overflow:hidden; height:60px; border-top:1px solid #eee;}
.main .grid .kNotice .linkList li:nth-child(1),
.main .grid .kNotice .linkList li:nth-child(2),
.main .grid .kNotice .linkList li:nth-child(3) {display:flex;}
.main .grid .kNotice .linkList li:first-child {border-top:0;}
.main .grid .kNotice .linkList li img {max-width:100%; max-height:100%;}

.main .grid .kMovie {position:relative; margin-top:20px; padding: 0 15px;}
.main .grid .kMovie .movieList {margin-top:20px; border-radius:10px; background:#fff;}
.main .grid .kMovie .movieList > div {display:flex; justify-content:center; align-items:center; overflow:hidden; width:100%; border-radius:10px; background:#000;}
.main .grid .kMovie .movieList > div img {max-width:100%; max-height:100%;}
.main .grid .kMovie .movieList ul {width:100%; margin-top:15px;}
.main .grid .kMovie .movieList ul li {display:flex; gap:15px; padding:12px 0; border-bottom:1px solid #DDD;}
.main .grid .kMovie .movieList ul li div {display:flex; justify-content:center; align-items:center; overflow:hidden; width:80px; height:60px; border-radius:8px; cursor:pointer; background:#000;}
.main .grid .kMovie .movieList ul li div img {max-width:100%; max-height:100%;}
.main .grid .kMovie .movieList ul li dl {flex:1; overflow:hidden;}
.main .grid .kMovie .movieList ul li dl dt {width:100%; font-size:14px; line-height:18px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.main .grid .kMovie .movieList ul li dl dd {width:100%; color:#888; font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}

.main .grid .kCommu {position:relative; margin-top:40px; padding:0 15px;}
.main .grid .kCommu .scroll-wrapper {margin-top:20px;}
.main .grid .kCommu .scrollbar-inner {margin-top:20px; overflow:hidden !important;}
.main .grid .kCommu .scrollbar-inner > li {margin-top:15px; padding:15px; border-radius:10px; background:#F9FAFC;}
.main .grid .kCommu .scrollbar-inner > li:first-child {margin-top:0;}
.main .grid .kCommu .uInfo {display:flex; gap:8px;}
.main .grid .kCommu .uInfo div {display:flex; justify-content:center; align-items:center; overflow:hidden; width:40px; height:40px; border-radius:20px; background:#fff;}
.main .grid .kCommu .uInfo div img {width:100%; max-height:100%;}
.main .grid .kCommu .uInfo dl {}
.main .grid .kCommu .uInfo dl dt {font-weight:500;}
.main .grid .kCommu .uInfo dl dd {font-size:14px; line-height:16px;}
.main .grid .kCommu .uText {margin-top:24px;}
.main .grid .kCommu .uText dt {font-size:16px; font-weight:500; word-break:break-word;}
.main .grid .kCommu .uText dd {margin-top:10px; color:#858689; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical;}
.main .grid .kCommu .uText dd span {display:inline-block; height:24px; padding:0 10px; color:#22593F; font-size:14px; line-height:24px; border-radius:4px; background:#DEF5EA;}
.main .grid .kCommu .HitLike {margin-top:24px; justify-content:flex-start;}

/*========================================= // Main-content =========================================*/



/*========================================= Sub-page =========================================*/
section {width:100%;}
section.location {width:100%; height:210px; background:url(../../resources/img/sub_img_intro.jpg) no-repeat 50% 50%; background-size:cover;}
section.location ol {display:flex; width:100%; height:40px; margin:0 auto; border-radius:10px 8px 0px 0px; background:rgba(0, 0, 0, 0.50);}
section.location h2 {height:170px; font-size:36px; color:#fff; font-weight:600; text-align:center; line-height:170px;}
section.location ol > li {position:relative; text-align:center;}
section.location ol > li a {position:relative; display:block; padding:0 25px 0 15px; color:#fff; font-size:14px; font-weight:300; line-height:40px; white-space:nowrap;}
section.location ol > li:first-child {width:40px; padding:0; margin-right:10px;}
section.location ol > li:first-child > a {overflow:hidden; width:40px; height:40px; text-indent:-9999em; border-radius:8px 8px 0px 0px; background:#fff url(../../resources/img/icon_location_home.png) no-repeat 50% 50%; background-size:18px 18px;}
section.location ol > li:last-child:before {content:''; position:absolute; top:17px; left:-5px; width:1px; height:10px; background:#ddd;}
section.location ol > li:last-child {padding-right:25px;}
section.location ol > li:last-child > a {padding-right:0;}
section.location ol > li:last-child > a.open {position:absolute; top:14px; right:0; width:10px; height:10px; padding:0; border-right:1px solid #fff; border-bottom:1px solid #fff; transform:rotate(45deg); transition:.5s;}
section.location ol > li:last-child:hover > a.open.on {transform:rotate(130deg);}
section.location ol li ul {display:none; position:absolute; top:40px; left:0; z-index:10; width:auto; background:rgba(0, 0, 0, .5);}
section.location ol li ul li a {padding:0 20px;}
section.location ol li ul li a:hover {background:rgba(0, 0, 0, .2);}
section.location.community {margin-top:0;}

section.contents {width:100%; padding:40px 15px 0;}
section.contents h3 {font-size:26px; font-weight:600; line-height:32px;}
section.contents h4 {margin-top:70px; padding-left:20px; font-size:18px; line-height:24px; background:url(../../resources/img/bullet_h4.png) no-repeat 0 4px; background-size:17px 18px;}
section.contents h4 span {color:#999; font-size:14px; font-weight:400;}
section.contents .view h4 {padding-left:0; margin-top:0; background:none;}
section.contents > .img, .tapContents > .img {overflow:hidden; margin-top:10px; text-align:center;}
section.contents > .img img, .tapContents > .img img {width:100%;}
section.contents p {margin-top:10px;}
section.contents > .img.bg, .tapContents > .img.bg {border-radius:16px; border:1px solid #DDD; background:#F9F9FA;}
section.contents > .img.grid, .tapContents > .img.grid {padding:80px 30px; border-radius:10px; border:1px solid #DDD; background:#F9F9FA url(../../resources/img/bg_grid.png) repeat 0 0;}
/*========================================= // Sub-page =========================================*/

/*========================================= contents =========================================*/
/****************** Contents Tap ******************/
.contentsTap {display:flex; margin-bottom:30px; justify-content:space-between; gap:10px; flex-wrap:wrap;}
.contentsTap li {position:relative; width:48%; height:40px; padding:0; border-radius:8px; background:#F9F9FA;}
.contentsTap li a {display:block; width:100%; color:#858689; font-size:14px; font-weight:500; text-align:center; line-height:40px;}
.contentsTap li.on {background:#0ACF83;}
.contentsTap li.on a {color:#fff;}
.contentsTap li.on:before {display:none;}
.contentsTap li.on + li:before {display:none;}

/****************** Text Box ******************/
.textBox {padding:10px; margin-top:15px; border-radius:10px; background:#F9F9FA;}
.textBox p {margin-top:10px; font-size:14px; text-align:left;}
.textBox p:first-child {margin-top:0;}
.textBox p a {height:36px; display:inline-block; border:1px solid #22593F; line-height:36px; background:#fff; padding:0 20px 0 25px; vertical-align:revert; border-radius:8px; color:#22593F; font-weight:600;}
.textBox p a:after {content:''; display:inline-block; width:36px; height:36px; background:url(../../resources/img/icon_link.png) no-repeat 50% 50%;}
.textBox .opa {margin-top:20px; text-align:center;}
.textBox .opa a {}
.textBox .opa a img {width:150px;}

.textBox > dl {margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid #e0e0e0;}
.textBox > dl dt {display:flex; align-items:flex-end;}
.textBox > dl dt strong {font-size:24px; font-weight:600; line-height:35px;}
.textBox > dl dt span {font-size:15px; color:#666; margin-left:10px;}
.textBox > dl dd {margin-top:8px; color:#858689;}
.textBox > dl dd a {transition:.3s;}
.textBox > dl dd a:hover {text-decoration:underline; color:#0ACF83;}
.textBox div dl {margin-top:40px;}
.textBox div dl:first-child {margin-top:0;}
.textBox div dl dt {font-weight:500;}

/******************  Login ******************/
.login {padding:50px 15px;}
.login > div {width:100%;}
.login > div h2 {margin-bottom:20px; font-size:22px; line-height:26px;}
.login > div p {margin-bottom:20px; color:#858689;}
.login > div p.passYes {color:#65C188;}
.login > div p.passNo {color:#FF67D1;}
.login > div fieldset label {display:block; margin-bottom:8px;}
.login > div fieldset input {width:100%; margin-bottom:20px;}
.login > div fieldset .checkText {justify-content:flex-start; margin-bottom:35px; color:#FF67D1; font-weight:600;}
.login > div fieldset .boardBtn {margin:0; padding:0; gap:10px;}
.login > div fieldset .boardBtn button {flex:1;}
.login > div fieldset div {display:flex; justify-content:center;; gap:41px; padding-top:20px;}
.login > div fieldset div a {position:relative; color:#858689;}
.login > div fieldset div a:hover {color:#0ACF83;}
.login > div fieldset div a:first-child:after {content:''; position:absolute; top:9px; right:-21px; width:1px ;height:10px; background:#ddd;}

/*------------------ Member join ------------------*/
.join {width:100%; padding:40px 15px;}
.join h3 {margin-bottom:30px; font-size:22px; font-weight:600; line-height:28px;}
.join h4 {margin-bottom:20px; font-size:18px; line-height:24px;}
.join .board {margin-top:0;}
.join ol {margin-bottom:30px; display:flex; justify-content:center; gap:20px;}
.join ol li {position:relative; color:#ddd; font-size:16px; line-height:20px; text-align:center;}
.join ol li span {position:relative; display:block; height:30px; margin-bottom:5px; color:#ddd; line-height:28px; text-align:center;}
.join ol li span:after {content:''; position:absolute; top:0; left:50%; z-index:-1; width:30px; height:30px; border:1px solid #ccc; border-radius:15px; transform:translateX(-50%);}
.join ol li.on {color:#0ACF83; font-weight:500;}
.join ol li.on span {color:#fff;}
.join ol li.on span:after { border:1px solid #0ACF83; background-color:#0ACF83;}
.join ol li.clear span {text-indent:-9999px;}
.join ol li.clear span:before {content:''; position:absolute; top:8px; left:50%; width:6px; height:15px; border-right:2px solid #fff; border-bottom:2px solid #fff; transform:rotate(45deg) translateX(-50%);}
.join ol li.clear span:after {background-color:#ccc;}
.join .info {overflow:hidden;}
.join .info h5 {float:left; margin-left:31px; font-size:19px;}
.join .info > p {float:right; margin-right:29px; font-size:15px; letter-spacing:-0.2px; word-spacing:-1px; color:#666666; padding-right:8px; position:relative;}
.join .info > p:after {content:"*"; color:#fd9026; position:absolute; top:4px; right:0;}

/*------------------ Member agree ------------------*/
.join .agree {border-top:2px solid #333; padding:15px 0 0;}
.join .agree > div {overflow:hidden; position:relative;}
.join .agree > div h5 {float:left; margin-left:9px; font-size:17px; letter-spacing:-1px; font-weight:500;}
.join .agree ul li {margin-top:22px;}
.join .agree ul li .check h6 {line-height:30px; font-weight:400; word-spacing:-0.5px; float:left; font-size:17px;}
.join .agree ul li .text {border:1px solid #e0e0e0; overflow:auto; padding:10px 15px; height:106px; margin-top:10px; color:#666666; font-size:15px; letter-spacing:-0.5px; overflow-x:hidden;}
.join .agree ul li .text strong {font-weight:500;}
.join .agree ul li .text dl {margin-top:20px;}
.join .agree ul li .text dl:first-child {margin-top:0;}

/*------------------ Member join detail ------------------*/
.basic-info .write {margin-top:23px; padding:52px 30px 30px 32px;}
.basic-info .write input {width:500px;}
.basic-info .write .id dd input {width:406px; float:left;}
.basic-info .write .id dd button {float:left; width:93px; text-align:center; background-color:#666; color:#fff; font-weight:500; font-size:15px; border-radius:3px; margin-left:5px; letter-spacing:-0.5px;}
.basic-info .write .pass dd p {font-size:15px; word-spacing:1.5px; color:#666666; margin-top:8px;}
.basic-info .write .email dd input {width:160px;}
.basic-info .write .email dd select {width:143px;}
.basic-info .write .tel dd input {width:157px;}
.basic-info .write .tel dd input:first-child {width:140px;}
.basic-info .write .phone dd select {width:140px; padding-left:15px;}
.basic-info .write .phone dd input {width:157px;}
.basic-info .write .phone dd:before {content:""; position:absolute; top:20px; left:120px;}

/*------------------ Member join complete ------------------*/
.complete .celebrate {padding-top:50px; text-align:center;}
.complete .celebrate div {display:inline-block; width:110px; height:110px; text-indent:-9999px; background-color:#ffe1cc; margin-bottom:36px;}
.complete .celebrate dl dt {font-size:24px; font-weight:600; line-height:30px;}
.complete .celebrate dl dd {color:#666666; letter-spacing:-0.7px; margin-top:18px;}

/****************** Card Contents ******************/
.cardContents {margin-top:10px;}
.cardContents ul {}
.cardContents ul li {width:100%; padding:15px; margin-top:10px; border-radius:10px; background:#F9F9FA;}
.cardContents ul li:first-child {margin-top:0;}
.cardContents ul li dl {text-align:center;}
.cardContents ul li dl dt {margin-bottom:8px; font-size:16px; font-weight:600; line-height:22px;}
.cardContents ul li dl dt br,
.cardContents ul li dl dd br {display:none;}
.cardContents ul li dl dd {color:#858689; font-size:14px; line-height:18px;}


.summary .expect > div ul {display:flex; flex-wrap:wrap; padding:70px 50px;}
.summary .expect > div ul li {width:220px; margin-left:30px; padding:20px 32px;}
.summary .expect > div ul li:first-child {margin-left:0;}
.summary .expect > div ul li:nth-child(n+3) {margin-top:30px;}
.summary .expect > div ul .hw {background:#fff url("../img/money_icon.png") no-repeat 0 0; background-position:34px 30px;}
.summary .expect > div ul .sw {margin-right:250px; background:#fff url("../img/thunder_icon.png") no-repeat 0 0; background-position:33px 30px;}
.summary .expect > div ul .maintenance {margin-left:0; background:#fff url("../img/fix_icon.png") no-repeat 0 0; background-position:35px 30px;}
.summary .expect > div ul .scale {background:#fff url("../img/scale_icon.png") no-repeat 0 0; background-position:32px 31px;}
.summary .expect > div ul .cloud {background:#fff url("../img/cloud_icon.png") no-repeat 0 0; background-position:29px 30px;}

.summary .expect > div ul li dl dt {color:#f16100; font-weight:500; font-size:18px; padding-right:50px; word-break:keep-all; line-height:25px; padding-top:73px; letter-spacing:-0.5px;}
.summary .expect > div ul li dl dd {margin-top:10px; line-height:25px; font-size:15px; color:#333; word-break:keep-all;}

/****************** BI Page ******************/
.biDownload {display:flex; gap:10px; margin-top:10px;}
.biDownload a {padding:10px; font-size:14px; line-height:20px; border:1px solid #ddd; border-radius:8px;}
/*.biDownload a:after {content:''; display:inline-block; width:26px; height:26px; background:url("../../resources/img/icon_download02.png") no-repeat 50% 50%;}*/

.biAlign {margin-top:20px;}
.biAlign dl {width:100%; padding:30px 20px; border-radius:10px; border:1px solid #DDD; background:#F9F9FA;}
.biAlign dl:first-child {margin-bottom:10px;}
.biAlign dl dt {width:100%; font-size:14px; font-weight:500;}
.biAlign dl dd {width:100%; margin-top:10px; text-align:center;}
.biAlign dl dd img {max-width:100%; max-height:100%;}

.biColor {margin-top:20px;}
.biColor dl {padding-top:50px; margin-top:10px; border-radius:10px;}
.biColor dl:first-child {margin-top:0;}
.biColor dl.color01 {background:#22593F;}
.biColor dl.color02 {background:#002E40;}
.biColor dl.color03 {background:#858689;}
.biColor dl.color04 {background:#020000;}
.biColor dl dt {font-size:16px; font-weight:600; padding:7px 7px 0; border-left:1px solid #ddd; border-right:1px solid #ddd; background:#fff;}
.biColor dl dd {font-size:12px; color:#858689; padding:0 7px 7px; border:1px solid #ddd; border-top:0; border-radius:0 0 10px 10px; background:#fff;}

/****************** About K-Paas Page ******************/
.releaseGit {display:flex; justify-content:space-between; align-items:center; padding:10px; margin-top:10px; border-radius:10px; background:#F9F9FA;}
.releaseGit span {font-size:16px;}
.releaseGit a {min-width:150px; color:#22593F; font-weight:600; text-decoration:underline;}
.releaseGit a:after {content:''; display:inline-block; width:26px; height:26px; background:url(../../resources/img/icon_link.png) no-repeat 50% 50%;}
.releaseList > ul > li {padding:10px 0; border-bottom:1px solid #ddd;}
.releaseList > ul > li div {display:flex; justify-content:center; align-items:center; overflow:hidden; width:100%; padding:35px; border-radius:10px; background:#F9F9FA;}
.releaseList > ul > li div img {max-width:100%; max-height:100%;}
.releaseList > ul > li dl {margin-top:10px;}
.releaseList > ul > li dl dt {margin-bottom:10px; font-size:18px; font-weight:600; line-height:26px;}
.releaseList > ul > li dl dt span {margin-left:10px; color:#858689; font-size:14px; font-weight:400;}
.releaseList > ul > li dl dd {font-size:14px; line-height:22px;}
.releaseList > ul > li dl dd ul li {position:relative; padding-left:10px;}
.releaseList > ul > li dl dd ul li:before {content:'ㆍ'; position:absolute; left:-4px;}

/****************** About Center Page ******************/
.organization {margin-top:20px; padding-bottom:50px; width:100%;}
.organization h5 {text-align:center; color:#fff; font-size:17px; line-height:54px; font-weight:500; width:100%; height:54px; background-color:#363147; position:relative; border-radius:8px;}
.organization h5:before {content:""; width:1px; height:523px; background-color:#d2d2d2; position:absolute; top:54px; left:15px;}
.organization div {margin-top:20px; padding-left:40px;}
.organization div dl {position:relative; padding:10px; margin-top:10px; border:1px solid #ddd; border-radius:8px; background-color:#F9F9FA;}
.organization div dl:before {content:""; width:25px; height:1px; background-color:#d2d2d2; position:absolute; top:30px; left:-26px;}
.organization div dl:first-child {margin-top:0;}
.organization div dl dt {font-weight:500; font-size:15px; text-align:center; border-bottom:1px solid #d2d2d2; padding-bottom:14px; margin:0 12px;}
.organization div dl dd {font-size:14px; color:#666666; line-height:20px; padding-left:20px; padding-right:12px; position:relative; margin-top:8px;}
.organization div dl dd:before {content:""; width:3px; height:3px; background-color:#999999; position:absolute; top:10px; left:13px;}

.mou {margin-top:10px;}
.mou li {width:100%; margin-top:20px;}
.mou li:first-child {margin-top:0;}
.mou li div {overflow:hidden; border-radius:8px;}
.mou li div img {width:100%;}
.mou li dl dt {font-weight:600;}
.mou li dl dd {position:relative; padding-left:14px; font-size:14px; line-height:18px;}
.mou li dl dd:before {content:'ㆍ'; position:absolute; left:0;}

.partners {display:flex; flex-wrap:wrap; justify-content:flex-start; gap:20px 6%; margin-top:10px;}
.partners li {display:flex; flex-direction:column; width:47%;}
.partners li a {display:flex; justify-content:center; align-items:center; overflow:hidden;  width:100%; height:70px; padding:5px; border:1px solid #ddd; border-radius:8px;}
.partners li a img {width:100%;}
.partners li p {padding-left:8px; margin-top:0; font-size:14px; font-weight:500; line-height:20px; word-break:break-all;}
.partners li dl {padding-left:8px;}
.partners li dl dt {font-size:16px; font-weight:500;line-height:22px;}
.partners li dl dd {font-size:14px; line-height:20px;}

.map {width:100%; height:532px; margin-top:20px;}

/****************** Suport Guide Page ******************/
.guide {margin-top:20px;}
.guide li {width:100%; margin-top:5px;}
.guide li:first-child {margin-top:0}
.guide li a {display:block; width:100%; padding:10px 35px 10px 10px; font-size:14px; line-height:20px; border:1px solid #ddd; border-radius:8px; background:url("../../resources/img/newwindowgy_icon.png") no-repeat 97% 50%; background-size:14px 14px;}
.guide li a:hover {border:1px solid #0ACF83;}

.faq {margin-top:30px;}
.faq .list {border-top:2px solid #333;}
.faq .list li {border-bottom:1px solid #ddd;}
.faq .list li > a {display:block; position:relative; width:100%; overflow:hidden; padding:10px 25px; font-size:16px; line-height:22px;}
.faq .list li > a:before {content:""; width:10px; height:1px; background-color:#000; position:absolute; top:50%; right:10px;}
.faq .list li > a:after {content:""; width:10px; height:1px; background-color:#000; position:absolute; top:50%; right:10px; transform:rotate(90deg); transition:.3s;}
.faq .list li.on > a:before {background-color:#ddd;}
.faq .list li.on > a:after {background-color:#ddd; transform:rotate(0deg);}
.faq .list li > a > span {position:relative; display:block; margin-bottom:10px;}
.faq .list li > a > span:before {content:"Q"; position:absolute; top:0; left:-22px; color:#d8e4df; font-size:20px;}
.faq .list li > a:hover {color:#22593F;}
.faq .list li > div {display:none; border-top:1px solid #ebebeb; padding:10px;}
.faq .list li .escape h1,
.faq .list li .answer h1 {display:none;}
.faq .list li .escape p,
.faq .list li .answer p {margin-top:0;}
.faq .list li .answer {position:relative; margin-top:20px; padding:20px 0 0; border-top:1px solid #ddd;}
/*.faq .list li .answer:before {content:"A"; position:absolute; top:-2px; left:2px; height:50px; color:#d8e4df; font-size:50px;}*/
.faq .list li .answer p {color:#01a163;}

/****************** Support Technical Page ******************/
.technical {margin-top:10px;}
.technical li {position:relative; margin-top:5px; border:1px solid #ddd; border-radius:8px;}
.technical li:first-child {margin-top:0;}
.technical li:before {content:""; position:absolute; top:45%; left:-46px; width:22px; height:22px; border-top:2px solid #0ACF83; border-right:2px solid #0ACF83; transform:rotate(45deg);}
.technical li:first-child:before {display:none;}
.technical li dl {position:relative; overflow:hidden; padding:10px;}
.technical li dl:before {content:"01"; position:absolute; top:-13px; left:-8px; font-size:50px; color:#ddd; font-weight:600; line-height:50px; letter-spacing:-5px;}
.technical li:nth-child(2) dl:before {content:"02";}
.technical li:nth-child(3) dl:before {content:"03";}
.technical li:nth-child(4) dl:before {content:"04";}
.technical li dl dt {padding-left:40px; font-size:16px; font-weight:500;}
.technical li dl dd {margin-top:10px; color:#888; font-size:14px; line-height:20px;}

/****************** Support Certified Page ******************/
.certified {margin-top:10px; padding:10px; background-color:#fafafa;}
.certified > dl {margin-top:39px;}
.certified > dl:first-child {margin-top:0;}
.certified dl dt {font-size:20px; font-weight:500; margin-bottom:10px;}
.certified div {margin-top:20px;}
.certified div:first-child {margin-top:0;}
.certified div h5 {font-size:16px; font-weight:500;}
.certified div p {font-size:14px;}
.certified div:not(.inquiry) dl {position:relative; padding-left:13px; margin-top:10px;}
.certified div:not(.inquiry) dl:last-child {margin-top:14px;}
.certified div:not(.inquiry) dl:before {content:""; width:4px; height:4px; background-color:#666; position:absolute; top:14px; left:1px; border-radius:3px;}
.certified div:not(.inquiry) dl dt {color:#666; font-size:14px; font-weight:700;}
.certified div:not(.inquiry) dl dd {font-size:14px;}
.certified div dl dd .btnAlign {display:flex; gap:10px; margin-top:10px;}
.certified > p {color:#666; font-weight:500; margin-top:15px;}
.certified .inquiry dl {display:flex;}
.certified .inquiry dl dt {margin:0; font-size:16px; font-weight:300; margin-right:5px; white-space:nowrap;}
.certified .inquiry dl dd {font-size:16px;}
.certified a:hover {text-decoration:underline;}

.intro .img img {width:100%; margin-top:10px;}

.compati {margin-top:20px;}
.compati h5 {font-size:18px; color:#296caf; font-weight:500; margin-bottom:10px;}
.compati ul li {padding-left:12px; position:relative; margin-top:15px;}
.compati ul li:first-child {margin-top:0;}
.compati ul li:before {content:""; width:3px; height:3px; font-size:30px; background-color:#999999; position:absolute; top:13px; left:0;}
.compati ul li a:hover {text-decoration:underline;}
.compati ul li .btnAlign {display:flex; gap:10px; margin-top:10px;}
.compati ul li .downBtn {padding:10px 40px; line-height:26px; border:1px solid #ddd; border-radius:8px; transition:.5s;}
.compati ul li .downBtn span {padding-right:40px; background:url("../../resources/img/icon_download02.png") no-repeat 100% 50%;}
.compati ul li .downBtn:hover {text-decoration:none; border:1px solid #0ACF83;}

.companyList {margin-top:30px;}
.companyList .pro {display:flex; flex-wrap:wrap; gap:10px; padding-top:20px; border-top:2px solid #020000;}
.companyList .pro > li {position:relative; display:flex; gap:20px; width:100%; padding:10px; border:1px solid #ddd; border-radius:10px; background:#fff;}
.companyList .pro > li .img {display:table-cell; vertical-align:middle; width:100px; height:100px;}
.companyList .pro > li .img img {width:auto; max-width:100%; height:auto; max-height:100%;}
.companyList .pro > li .spec {flex:1; display:flex; flex-direction:column; justify-content:space-between;}
.companyList .pro > li .spec dl {}
.companyList .pro > li .spec dl dt {font-weight:600;}
.companyList .pro > li .spec dl dd {margin-top:5px;}
.companyList .pro > li .spec dl dd .state {position:relative; display:inline-block; height:30px; padding:0 50px 0 15px; color:#999; font-size:14px; line-height:30px; border:1px solid #eee; border-radius:8px; background:#fff;}
.companyList .pro > li .spec dl dd .state em {position:absolute; top:3px; right:2px; width:40px; height:24px; color:#fff; text-align:center; line-height:24px; border-radius:8px;}
.companyList .pro > li .spec dl dd .state em.stateY {background:#65C188;}
.companyList .pro > li .spec dl dd .state em.stateN {background:#ccc;}
.companyList .pro > li .spec > a {position:absolute; bottom:-1px; right:-1px; height:30px; padding:0 15px; color:#fff; font-size:14px; line-height:30px; border:1px solid #eee; border-top-left-radius:10px; border-bottom-right-radius:10px; background:#EBBE58;}

.companyList .com {display:flex; flex-wrap:wrap; gap:40px 20px; padding-top:20px; border-top:2px solid #020000;}
.companyList .com > li {position:relative; display:flex; gap:20px; width:400px; padding:24px; border:1px solid #ddd; border-radius:24px; background:#fff;}
.companyList .com > li .img {display:flex; justify-content:center; width:100px; height:100px;}
.companyList .com > li .img img {width:auto; max-width:100%; height:auto; max-height:100%;}
.companyList .com > li .spec {flex:1; display:flex; flex-direction:column; justify-content:space-between;}
.companyList .com > li .spec dl {}
.companyList .com > li .spec dl dt {font-weight:600;}
.companyList .com > li .spec dl dd {margin-top:5px;}
.companyList .com > li .spec dl dd .state {position:relative; display:inline-block; height:30px; padding:0 50px 0 15px; color:#999; font-size:14px; line-height:30px; border:1px solid #eee; border-radius:8px; background:#fff;}
.companyList .com > li .spec dl dd .state em {position:absolute; top:3px; right:2px; width:40px; height:24px; color:#fff; text-align:center; line-height:24px; border-radius:8px;}
.companyList .com > li .spec dl dd .state em.stateY {background:#65C188;}
.companyList .com > li .spec dl dd .state em.stateN {background:#ccc;}
.companyList .com > li .spec > a {position:absolute; bottom:-1px; right:-1px; height:30px; padding:0 15px; color:#fff; font-size:14px; line-height:30px; border:1px solid #eee; border-top-left-radius:24px; border-bottom-right-radius:24px; background:#EBBE58;}

.companyList .suit {display:flex; flex-wrap:wrap; gap:10px; padding-top:10px; border-top:2px solid #020000;}
.companyList .suit > li {position:relative; display:flex; gap:10px; width:100%; padding:35px 10px 30px; border:1px solid #ddd; border-radius:10px; background:#fff;}
.companyList .suit > li .img {display:table-cell; width:90px; height:100px; vertical-align:middle;}
.companyList .suit > li .img img {width:100%; max-width:100%; max-height:100%;}
.companyList .suit > li .spec {display:flex; flex-direction:column; flex:1;}
.companyList .suit > li .spec dl {width:100%;}
.companyList .suit > li .spec dl dt {font-size:16px; font-weight:600; overflow:hidden;}
.companyList .suit > li .spec dl dd {position:relative; overflow:hidden; font-size:14px;}
.companyList .suit > li .spec dl dd .state {position:relative; display:inline-block; height:30px; padding:0 50px 0 15px; color:#999; font-size:14px; line-height:30px; border:1px solid #eee; border-radius:8px; background:#fff;}
.companyList .suit > li .spec dl dd .state em {position:absolute; top:3px; right:2px; width:40px; height:24px; color:#fff; text-align:center; line-height:24px; border-radius:8px;}
.companyList .suit > li .spec dl dd .state em.stateY {background:#65C188;}
.companyList .suit > li .spec dl dd .state em.stateN {background:#ccc;}
.companyList .suit > li .spec > div {min-height:52px; overflow:hidden;}
.companyList .suit > li .spec > div em {position:absolute; top:-1px; left:50%; width:90%; height:30px; font-size:12px; text-align:center; text-transform:uppercase; line-height:28px; border-radius:0 0 80px 80px; transform:translateX(-50%);}
.companyList .suit > li .spec > div em.found {color:#40CCF2; border: 1px solid#40CCF2;}
.companyList .suit > li .spec > div em.advan {color:#FF7E47; border: 1px solid #FF7E47;}
.companyList .suit > li .spec > div p {font-size:14px;}
.companyList .suit > li .spec > a {position:absolute; bottom:-1px; right:-1px; height:30px; padding:0 15px; color:#fff; font-size:14px; line-height:30px; border:1px solid #eee; border-top-left-radius:10px; border-bottom-right-radius:10px; background:#EBBE58;}
.companyList .suit > li .spec > a span {padding-right:30px; background:url(../../resources/img/icon_download.png) no-repeat 100% 50%;}
.companyList .suit > li .spec > a.modify {right:auto; left:-1px; border-radius:0 10px; background:#65C188;}

.companyList .detailWrap {display:none; position:absolute; top:150px; left:0; z-index:1; width:100%; padding:10px; border:1px solid #ddd; border-radius:10px; background:#fff; box-shadow:5px 5px 10px rgba(0,0,0,.1);}
.companyList .detailWrap .scrollbar-inner {max-height:280px;}
.companyList .detailWrap .scrollbar-inner .scroll-content {padding-right:30px;}
.companyList .detailWrap .scrollbar-inner dl {display:flex;}
.companyList .detailWrap .scrollbar-inner dl:nth-child(3n+4){margin-top:10px; padding-top:10px; border-top:1px solid #ddd;}
.companyList .detailWrap .scrollbar-inner dl dt {width:65px; font-size:14px; font-weight:500;}
.companyList .detailWrap .scrollbar-inner dl dt:before {content:' ㆍ ';}
.companyList .detailWrap .scrollbar-inner dl dd {font-size:14px;}
.companyList .detailWrap .scrollbar-inner dl.date dt {color:#999;}
.companyList .detailWrap .scrollbar-inner dl.date dd {color:#999;}


/****************** My Page ******************/
.mypage .contentsTap {margin-top:80px; margin-bottom:0;}
section.contents.mypage h4 {margin-top:40px;}

/****************** Community Page ******************/
.community {margin-top:30px;}
.community .boardBtn  {margin-top:20px;}
.community .grid {display:flex; flex-wrap:wrap; gap:20px; max-width:100%;}
.community .grid-item {position:relative; overflow:hidden; width:100%; margin-bottom:15px; padding:32px 15px 15px; border-radius:10px; background:#F9F9FA;}
.community .grid-item .flag {position:absolute; top:0; right:0; min-width:110px; height:30px; padding:0 20px; color:#fff; font-size:12px; font-weight:500; text-align:center; line-height:30px; background:#22593F; border-bottom-left-radius:10px;}
.community .grid-item .flag.CG_CM_CLSF_01 {background:#FF7E47;}
.community .grid-item .flag.CG_CM_CLSF_02 {background:#65C188;}
.community .grid-item .flag.CG_CM_CLSF_03 {background:#EBBE58;}
.community .grid-item .flag.CG_CM_CLSF_04 {background:#40CCF2;}
.community .grid-item .flag.CG_CM_CLSF_05 {background:#FF67D1;}
.community .grid-item .flag.CG_CM_CLSF_06 {background:#6C52FF;}

.community .grid-item .user {display:flex; gap:10px;}
.community .grid-item .user > div {display:flex; justify-content:center; align-items:center; overflow:hidden; width:40px; height:40px; border-radius:20px; background:#F9FAFC;}
.community .grid-item .user .HitLike {margin-left:25px;}
.community .grid-item .user > div img {width:100%;}
.community .grid-item .user dl dt {font-weight:600;}
.community .grid-item .user dl dd {color:#858689; font-size:14px; line-height:20px;}
.community .grid-item > dl {margin:15px 0; cursor:pointer;}
.community .grid-item > dl dt {font-size:18px; font-weight:500; word-break:break-word;}
.community .grid-item > dl dd {margin-top:10px; font-size:14px; color:#858689; display:-webkit-box; text-overflow:ellipsis; -webkit-line-clamp:5; -webkit-box-orient:vertical;}
.community .grid-item ul.HitLike {justify-content:flex-start; margin-top:15px;}

.community.library .grid .grid-item {width:100%;}
.community.library .grid-item > dl {margin:14px 0 0;}
.community.library .grid-item > dl dt {overflow:hidden; display:block; word-break:break-all;}
.community.library .grid-item > dl dd {overflow:hidden; display:block; margin-top:8px;}
.community.library .grid-item ul.HitLike {margin-top:0;}
.writeList .hashGuide { background-color: #e0f7da; border-radius: 8px; padding: 5px 20px; font-family: 'Arial', sans-serif; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); }
.writeList .hashGuide ul { list-style-type: none; padding: 0; }
.writeList .hashGuide li { font-size: 13px; color: #006400; font-weight : 550;}
.writeList .hashGuide li:last-child { margin-bottom: 0; }
.writeList .hashGuide li:before { content: "• "; color: #4CAF50; }

/****************** K-PaaS LandScape ******************/
.landScape {position:relative;}
.landScape .search_field > div {display:flex; gap:10px;}
.landScape .search_field + .list {margin-top:20px;}

.landScapeWrap {width:100%; padding:20px 10px;}
.landScape h3 {font-size:32px; font-weight:600; line-height:48px;}
.landScape .list {position:relative; overflow:hidden; min-height:136px; padding-left:30px; border-radius:8px; background:#efefef;}
.landScape .list + .list {margin-top:20px;}
.landScape .list h5 {position:absolute; top:0; left:0; display:flex; justify-content:center; align-items:center; width:30px; height:100%; color:#fff; line-height:22px; writing-mode:vertical-rl; border-top-right-radius:8px; border-bottom-right-radius:8px; background:#666; transform:rotate(180deg);}
.landScape .list > div {flex:1; border-left:1px solid #666;}
.landScape .list > div h6 {display:flex; justify-content:center; align-items:center; height:30px; font-size:13px; font-weight:500; text-align:center; line-height:22px; background:#ddd;}
.landScape .list > div > ul {display:flex; flex-wrap:wrap; gap:8px; padding:8px;}
.landScape .list > div > ul > li {overflow:hidden; width:55px; height:55px; border:1px solid #ddd; border-radius:5px; background:#fff; box-shadow:4px 10px 20px 0px rgba(0, 0, 0, .06);}
.landScape .list > div > ul > li > a {display:table-cell; vertical-align:middle; text-align:center; width:53px; height:53px;}
.landScape .list > div > ul > li > a img {max-width:50px; max-height:50px;}
.landScape .list > div > ul > li .tempPop {position:fixed; top:50%; left:50%; z-index:10; flex-wrap:wrap; transform:translate(-50%, -50%); display:none; gap:15px; width:90%; padding:10px 10px 25px; border:1px solid #ddd; border-radius:8px; background:#fff; box-shadow:4px 10px 20px 0px rgba(0, 0, 0, .06);}
.landScape .list > div > ul > li .tempPop .close {position:absolute; top:10px; right:20px; font-size:36px;}
.landScape .list > div > ul > li .tempPop > div:first-child {width:130px; padding-top:20px;}
.landScape .list > div > ul > li .tempPop > div:first-child img {width:100%;}
.landScape .list > div > ul > li .tempPop > div:nth-child(2) {width:100%;}
.landScape .list > div > ul > li .tempPop > div dl {padding-top:10px;}
.landScape .list > div > ul > li .tempPop > div dl dt {font-size:20px; font-weight:600;}
.landScape .list > div > ul > li .tempPop > div dl dd.link {font-size:14px; color:#999;}
.landScape .list > div > ul > li .tempPop > div dl dd a {font-size:14px; color:#999; text-decoration:underline; word-break:break-all;}
.landScape .list > div > ul > li .tempPop > div ul {display:flex; gap:10px; flex-wrap:wrap; margin-top:20px;}
.landScape .list > div > ul > li .tempPop > div ul li {height:30px; padding:0 20px; font-size:14px; color:#666; line-height:26px; border:1px solid #ddd; border-radius:4px;}

.landScape .list.app {background:#f1eeff;}
.landScape .list.app h5 {background:#6C52FF;}
.landScape .list.app > div {border-left:1px solid #6C52FF;}
.landScape .list.app > div h6 {background:#d7ceff;}
.landScape .list.app  > div > ul > li {border:1px solid #6C52FF;}

.landScape .list.orchest {background:#ecfafe;}
.landScape .list.orchest h5 {background:#40ccf2;}
.landScape .list.orchest > div {border-left:1px solid #40ccf2;}
.landScape .list.orchest > div h6 {background:#caf1fb;}
.landScape .list.orchest > div > ul > li {border:1px solid #40ccf2;}

.landScape .list.runtime {background:#f0f9f4;}
.landScape .list.runtime h5 {background:#65c188;}
.landScape .list.runtime > div {border-left:1px solid #65c188;}
.landScape .list.runtime > div h6 {background:#d4eede;}
.landScape .list.runtime > div > ul > li {border:1px solid #65c188;}

.landScape .list.provision {background:#fdf9ef;}
.landScape .list.provision h5 {background:#ebbe58;}
.landScape .list.provision > div {border-left:1px solid #ebbe58;}
.landScape .list.provision > div h6 {background:#f9edd1;}
.landScape .list.provision > div > ul > li {border:1px solid #ebbe58;}

.landScape .list.obser {background:#fef0fb;}
.landScape .list.obser h5 {background:#ff67d1; line-height:14px;}
.landScape .list.obser > div {border-left:1px solid #ff67d1;}
.landScape .list.obser > div h6 {background:#ffd5f3;}
.landScape .list.obser > div > ul > li {border:1px solid #ff67d1;}

/*------------------ Notice terms ------------------*/
.terms h4.arrow {margin-top:30px;}
.terms {width:100%; padding:30px 0;}
.terms p {background-color:#f7f7f7; padding:10px; line-height:22px; font-size:14px; color:#666; letter-spacing:-0.5px;}
.terms dl {margin-top:20px; letter-spacing:-0.7px; font-size:14px;}
.terms dl:nth-child(2) {margin-top:32px;}
.terms dl dt {font-size:16px; font-weight:500; margin-bottom:10px; letter-spacing:-1px;}
.terms dl dd{word-break:keep-all;}
.terms dl dd span {margin-left:10px; display:inline-block;}
.terms dl dd strong {font-size:14px; color:#666; display:inline-block; margin-top:7px;}


/*------------------ Notice privacy ------------------*/
.privacy {margin-top:30px;}
.privacy h4 {margin-top:30px !important; margin-bottom:20px;}
.privacy p {background-color:#f7f7f7; padding:15px; font-size:14px; color:#666; letter-spacing:-0.5px;}
.privacy dl {margin-top:38px; letter-spacing:-0.7px; font-size:16px;}
.privacy dl:nth-child(2) {margin-top:32px;}
.privacy dl dt {font-size:16px; font-weight:500; margin-bottom:10px; letter-spacing:-1px;}
.privacy dl dt .privacyText {height:35px; object-fit:cover; margin:0 6px 0 0; vertical-align:middle;}
.privacy dl dd span {font-size:15px; color:#666666;}
.privacy dl dd strong {color:#666; display:inline-block; margin-top:15px; font-size:16px;}
.privacy ul li .privacyList {height:30px; object-fit:cover;}
.privacy ul li {padding:0 0 6px 0;}
.privacy ul .desc_box{width:100%; border-radius:10px; border:1px solid #d9d9d9; box-sizing:border-box; padding:10px 15px; margin:10px 0px 18px 0px; line-height:25px; display:flex; flex-flow:row wrap; position:relative;}
.privacy .label-p {padding:0; background-color:transparent;}
.privacy div .label-p {padding:0; font-size:13px; background-color:transparent;}
.privacy div .label-span {font-size:15px;}
.privacy .privacy-list-outline {border:1px solid #d9d9d9; padding:10px; margin:10px 0 0 0;}
.privacy .privacy-list-outline li {margin-top:10px;}
.privacy .privacy-list-outline li:first-child {margin-top:0;}
.privacy .privacy-list-outline a {font-size:14px; text-decoration:underline;}
.privacy .privacyLabel {width:50px; object-fit:cover;}
.privacy .privacy-label {display:flex; justify-content:space-between; gap:10px; margin:0 0 15px 0;}
.privacy .privacy-label .label-box {flex:1;; padding:10px; border:1px solid #d9d9d9; text-align:center;}
.privacy .privacy-label .label-box .tooltiptext .desc_btm .desc_mid {text-align:left; padding:0 20px;}
.privacy .privacy-label .label-box .tooltiptext .desc_btm .desc_wrap {padding:5px 20px;}
.privacy .privacy-label .label-box .tooltiptext .desc_btm .desc_wrap .desc_box .desc_tit {padding:0; background-color:transparent; margin:0 35px 0 0; font-size:14px; color:#f16100;}
.privacy .privacy-label .label-box .tooltiptext .desc_btm .desc_wrap .desc_box .desc_cnt {padding:0; background-color:transparent; font-size:14px;}
.privacy .tooltip {position:relative; display:block;}
.privacy .tooltip:hover {cursor:pointer; text-decoration:underline; border:1px solid #f16100; box-shadow:0 0.2rem 0.8rem rgb(22 71 170 / 20%);}
.privacy .tooltip .tooltiptext {visibility:hidden; width:500px; background-color:white; text-align:center; border-radius:6px; position:absolute; z-index:1;}
.privacy .tooltip:hover .tooltiptext {visibility:visible;}
.privacy .tooltip .tooltiptext::after {content:" "; position:absolute; border-style:solid; border-width:5px;}
.privacy .tooltip .tooltip-left {top:-2px; left:-211%; border:1px solid #d9d9d9;}
.privacy .tooltip .tooltip-left::after {top:50%; left:100%; margin-top:-5px; border-color:transparent transparent transparent #f16100;}
.privacy .tooltip .tooltip-right {top:-2px; left:105%; border:1px solid #d9d9d9;}
.privacy .tooltip .tooltip-right::after {top:50%; right:100%; margin-top:-5px; border-color:black; border-color:transparent #f16100 transparent transparent;}
.privacy .tooltip .tooltip-top {width:120px; bottom:150%; left:50%; margin-left:-60px;}
.privacy .tooltip .tooltip-top::after {top:100%; left:50%; margin-left:-5px; border-color:#f16100 transparent transparent transparent;}
.privacy .tooltip .tooltip-bottom {width:500px; top:106%; left:-70px; margin-left:-60px; border:1px solid #d9d9d9;}
.privacy .tooltip .tooltip-bottom::after {bottom:100%; left:50%; margin-left:-5px; border-color:transparent transparent #f16100 transparent;}
.privacy .tooltip-title {background-color:#f16100; color:white; margin:0 0 10px 0;}
/*========================================= // contents =========================================*/



/*========================================= Table List =========================================*/
/****************** Text Box ******************/
.scWrap {overflow:hidden; overflow-x:scroll;}
.scWrap table.default {width:250%;}
table.default {margin-top:20px; border-top:2px solid #020000;}
table.default thead tr th {padding:5px 10px; font-size:12px; font-weight:500; line-height:18px; text-align:left; border-left:1px solid #e1e1e1; border-bottom:1px solid #e1e1e1; background:#F9F9FA;}
table.default tbody tr th,
table.default tfoot tr th {padding:5px 10px; font-size:12px; font-weight:500; line-height:18px; text-align:left; border-left:1px solid #e1e1e1; border-bottom:1px solid #e1e1e1; background:#F9F9FA;}
table.default tbody tr td,
table.default tfoot tr td {padding:5px 10px; font-size:12px; line-height:18px; border-left:1px solid #e1e1e1; border-bottom:1px solid #e1e1e1;}
table.default thead tr th:first-child ,
table.default tbody tr th:first-child,
table.default tbody tr td:first-child,
table.default tfoot tr th:first-child {border-left:0;}
table.default thead tr th.line,
table.default tbody tr th.line,
table.default tfoot tr th.line,
table.default tbody tr td.line,
table.default tfoot tr td.line {border-left:1px solid #e1e1e1;}
table.default thead tr th.underLine,
table.default tbody tr th.underLine,
table.default tfoot tr th.underLine,
table.default tbody tr td.underLine,
table.default tfoot tr td.underLine {border-bottom:1px solid #e1e1e1;}
table.default thead tr th.center,
table.default tbody tr th.center,
table.default tfoot tr th.center,
table.default tbody tr td.center,
table.default tfoot tr td.center {text-align:center;}
table.default tbody tr td li {position:relative; padding-left:15px;}
table.default tbody tr td li:before {content:'ㆍ'; position:absolute; left:0;}
table.default .route {margin-top:20px;}
table.default .route:first-child {margin-top:0;}
table.default .route dt {font-weight:500;}
table.default .route dd {margin-top:10px;}
table.default .route dd:first-child {margin-top:0;}
table.default .route dd em {display:block; white-space:normal; font-weight:300;}
table.default .route dd span {display:block; height:26px; padding:0 11px; color:#fff; background-color:#2b3b8c; border-radius:13px; font-size:12px; line-height:26px;}
table.default .route dd .blue {background-color:#2b3b8c;}
table.default .route dd .green {background-color:#479d36;}
table.default .route dd .red {background-color:#d7172d;}

/****************** Board List ******************/
.board {width:100%; margin-top:30px;}
.board .tableList {border-top:2px solid #020000;}
.board .tableList ul li {display:flex; flex-wrap:wrap; gap:10px; padding:5px 0; border-bottom:1px solid #E6E6E6;}
.board .tableList ul li.edu {justify-content:space-between;}
.board .tableList ul li dl {line-height:36px;}
.board .tableList ul li dl.viewDt {display:flex; white-space:nowrap;}
.board .tableList ul li dl.viewDt dt {display:block; padding:0 5px 0 10px; color:#999;}
.board .tableList ul li dl.viewDt dd {color:#666;}
.board .tableList ul li dl.subject {width:100%; flex:none; line-height:24px;}
.board .tableList ul li dl.subject2 {width:100%; flex:none; line-height:24px;}
.board .tableList ul li dl.subjectNotice,
.board .tableList ul li dl.subjectFaq,
.board .tableList ul li dl.subjectMy  {width:100%; flex:none; line-height:24px;}
.board .tableList ul li dl.wideAll {width:100%; flex:none;}
.board .tableList ul li dl.smallFont dt,
.board .tableList ul li dl.smallFont dd {font-size:14px;}
.board .tableList ul li dl.date dd {color:#999;}
.board .tableList ul li dl.state {width:100%; flex:none;}
.board .tableList ul li dl.state dd {color:#999;}
.board .tableList ul li dl.sequen1 {order:1;}
.board .tableList ul li dl.sequen2 {order:2;}
.board .tableList ul li dl.sequen3 {order:3;}
.board .tableList ul li dl.sequen4 {order:4;}
.board .tableList ul li dl.sequen5 {order:5;}
.board .tableList ul li dl.sequen6 {order:6;}
.board .tableList ul li dl.wid30 {width:30%;}
.board .tableList ul li dl.wid70 {width:70%;}
.board .tableList ul li dl dt {display:none;}
.board .tableList ul li:first-child dl:first-child dt {border-left:0;}
.board .tableList ul li dl dd {overflow:hidden; width:100%; padding:0; word-break:break-all;}
.board .tableList ul li dl:first-child dd {border-left:0;}
.board .tableList ul li dl dd.box {color:#666;}
.board .tableList ul li dl dd.box:after {content:' ㆍ ';}
.board .tableList ul li dl dd a {display:block; width:100%; text-align:left; line-height:24px; word-break:break-all;}
.board .tableList ul li dl dd a:hover {color:#0ACF83;}
.board .tableList ul li dl dd > span {text-indent:-9999px; float:left; background:url("../../resources/img/add_icon.png") no-repeat 0 0; width:22px; height:22px; background-position:50%; margin-left:5px;}
.board .tableList ul li dl dd > em {padding:0px 6px 2px 6px; background:linear-gradient( to bottom, #ffffff, #fafafa); border:1px solid #cccccc; border-radius:2px; font-size:13px;}
.board .tableList ul li dl dd > textarea {height:165px; border:1px solid #cccccc; font-size:14px;}
.board .tableList ul li dl dd > textarea::placeholder {color:#a1a1a1;}
.board .tableList ul li dl dd .textbox {height:auto; max-height:400px; min-height:100px; border:1px solid #cccccc; overflow-y:scroll; white-space:normal; padding:10px 15px; background-color:#fafafa; color:#a1a1a1;}
.board .tableList ul li dl dd.none {height:260px; text-align:center;}
.board .tableList ul li dl dd button {height:30px; padding:0 10px; cursor:pointer; background:none; vertical-align:middle; appearance:none; font-size:14px; line-height:28px; font-family:"Noto Sans KR", "맑은 고딕", sans-serif; color:#020000; border:1px solid #ddd; border-radius:6px; transition:.5s;}
.board .tableList ul li dl dd button.download {padding-right:26px; background:url("../../resources/img/icon_download.png") no-repeat 90% 50%; background-size:16px;}
.board .tableList ul li dl dd button:disabled {color:#999; background:#efefef;}
.board .tableList ul li dl dd button.download:disabled {background:#efefef url("../../resources/img/icon_download.png") no-repeat 90% 50%; background-size:16px;}
.board .tableList ul li dl dd .flag {color:#aaa;}
.board .tableList ul li dl dd .flag.complete {color:#01a163;}
.board .tableList ul li.wait a {color:#333; cursor:text;}
.board .tableList ul li.prog a {color:#129360;}
.board .tableList ul li.end a {color:#999;}
.board .tableList ul li.cancel a {color:#ccc; text-decoration:line-through;}
.board .tableList ul li .results dd {width:80px; color:#999; text-align:center; background:#f4f4f4; border-radius:8px;}
.board .tableList ul li.wait .results dd {color:#fff; cursor:text; background:#999;}
.board .tableList ul li.prog .results dd {color:#fff; background:#129360;}
.board .tableList ul li.end .results dd {color:#999;}
.board .tableList ul li.cancel .results dd {color:#ccc; text-decoration:line-through;}

.board .tableView {border-top:2px solid #020000;}
.board .tableView dl {line-height:60px; border-bottom:1px solid #E6E6E6;}
.board .tableView dl dt {padding:0 20px; font-weight:600; background-color:#F9F9FA;}
.board .tableView dl dd {overflow:hidden; width:100%; padding:15px 20px; line-height:28px;}

.board .gallery {display:flex; gap:50px; flex-wrap:wrap; padding-top:20px; border-top:2px solid #000;}
.board .gallery li {width:100%;}
.board .gallery li .img {display:flex; justify-content:center; align-items:center; overflow:hidden; width:100%; background:#F9F9FA; border-radius:10px;}
.board .gallery li .img img {width:100%;}
.board .gallery li p {overflow:hidden; width:100%; margin-bottom:5px; font-weight:400;}
.board .gallery li p.title {position:relative; margin-bottom:0; font-size:18px; font-weight:500;}
.board .gallery li p.title span {position:relative; margin-right:20px; color:#858689;}
.board .gallery li p.title span:after {content:''; position:absolute; right:-10px; top:10px; width:1px; height:10px; background:#ddd;}
.board .gallery li p.title + P:not(.date) {margin-top:0;}
.board .gallery li p.date {display:flex; margin:0; color:#858689; font-weight:400;}
.board .gallery li p.date span {position:relative; height:40px; padding:0 20px; line-height:38px; border:1px solid #ddd; border-radius:20px;}
	
/****************** Board Write ******************/
.write {margin-top:40px;}
.write h4 {font-size:24px; margin-top:0 !important;}
.write h5 {font-size:16px; font-weight:600; line-height:22px; margin-top:50px;}
.write .writeList {margin-top:20px;}
.write .writeList > div {padding-top:15px; border-top:2px solid #000;}
.write .writeList div dl {width:100%; margin-top:15px;}
.write .writeList div dl:first-child {margin-top:0;}
.write .writeList div dl.wide {width:100%;}
.write .writeList div dl dt {min-height:40px; text-align:left; font-weight:500; line-height:40px;}
.write .writeList div dl dd {min-height:48px; text-align:left; vertical-align:top; line-height:48px;}
.write .writeList div dl dd select {width:100%}
.write .writeList div dl dd input[type=text],
.write .writeList div dl dd input[type=password],
.write .writeList div dl dd input[type=number],
.write .writeList div dl dd input[type=date] {width:100%}
.write .writeList div dl dd p {margin-top:0; color:#858689; font-size:14px; line-height:26px;}
.write .writeList div dl.certificationCode dd {display:flex; gap:20px;}
.write .writeList div dl dd .count {color:#ff0000; font-size:20px; font-weight:500;}
.write .writeList div dl dd .btnOver {position:relative; width:100%;}
.write .writeList div dl dd .btnOver input {padding-right:20px;}
.write .writeList div dl dd .btnOver button {width:100%; height:48px; margin-top:5px; color:#fff; font-size:18px; font-weight:600; text-align:center; line-height:48px; border-radius:8px; background:#0ACF83; cursor:pointer;}
.write .writeList div dl dd .email {display:flex; gap:10px 0; justify-content:space-between; flex-wrap:wrap; position:relative;}
.write .writeList div dl dd .email input {width:45%;}
.write .writeList div dl dd .email select {width:45%;}
.write .writeList div dl dd .email button {width:45%; height:48px; color:#fff; font-size:18px; font-weight:600; text-align:center; line-height:48px; border-radius:8px; background:#0ACF83; cursor:pointer;}
.write .writeList div dl dd.phone .email {flex-wrap:nowrap; gap:5px;}
.write .writeList div dl dd.phone .email input,
.write .writeList div dl dd.phone .email select {width:auto;}
.write .writeList div dl dd .tagify {border-radius:8px; line-height:23px;}
.write button.accordion-header {position:relative; padding-right:30px;padding-bottom:20px; margin-top:35px; font-size:24px;}
.write button.accordion-header:before {content:''; position:absolute; top:10px; right:13px; width:4px; height:20px; background:#0ACF83;}
.write button.accordion-header:after {content:''; position:absolute; top:18px; right:5px; width:20px; height:4px; background:#0ACF83;}

/****************** Board View ******************/
.view {margin-top:20px;}
.view h1 {display:none;}
.view h4 {margin-bottom:20px; font-size:18px; font-weight:500;}
section.contents .view p {margin-top:5px; word-wrap:break-word;}
section.contents .view p span {word-break:break-word;}
.view .title dt {margin-bottom:10px; font-size:20px; line-height:35px; word-break:break-word;}
.view .title dt span {margin-right:10px; color:#858689;}
.view .title dd {display:flex; gap:0 20px; align-items:center; flex-wrap:wrap; color:#858689; line-height:28px;}
.view .title dd > strong {font-weight:500;}
.view .title dd a img {vertical-align:middle;}
.view .title dd ul.HitLike {width:100%;}
.view .text {padding-top:10px; margin:10px 0 20px; border-top:2px solid #020000;}
.view .text img {width:100% !important; height:auto !important;}
.view .tag {min-height:84px; margin-top:30px; margin-bottom:30px;}
.view .tag .hashTag {width:100%;}
.view .answer {padding-top:10px; color:#01a163; border-top:1px solid #ddd;}
.view .answer p a {word-break:break-all;}

/****************** More List ******************/
.moreList {margin-top:20px; border-bottom:1px solid #ddd;}
.moreList li {border-top:1px solid #ddd; line-height:22px;}
.moreList li dl {}
.moreList li dl dt {padding:10px 0; position:relative;}
.moreList li dl dt:after {content:""; position:absolute; top:18px; right:10px; width:12px; height:12px; border-top:2px solid #222; border-right:2px solid #222; transform:rotate(-45deg);}
.moreList li.next dl dt:after {top:12px; transform:rotate(135deg);}
.moreList li dl dd {overflow:hidden; padding:10px 0;}
.moreList li dl dd a {display:block; width:95%; color:#000; text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}
.moreList li:not(.zero) a:hover dd {color:#f16100;}
.moreList .zero a {cursor:default;}
.moreList .zero a dl dt:after {content:""; width:0px; height:0px; border-top:4px solid #ccc; border-bottom:4px solid none; border-right:4px solid transparent; border-left:4px solid transparent; position:absolute; top:28px; right:39px;}

/****************** Board Blog Style ******************/
.blog {width:100%; margin-top:40px;}
.blog h1 {display:none;}
.blog .list {border-top:2px solid#020000;}
.blog .list > ul > li {padding:20px 0 10px; border-bottom:1px solid #ddd;}
.blog .list > ul > li.noContents {justify-content:center; padding:80px 0; text-align:center;}
.blog .list .image {position:relative; overflow:hidden; width:100%; height:80px; border-radius:10px 10px 0 0; background:#F9F9FA;}
.blog .list .image img {position:absolute; top:50%; width:100%; transform:translateY(-50%);}
.blog .list .content {margin-top:15px;}
.blog .list .content dl {margin-bottom:15px;}
.blog .list .content dl dt {margin-bottom:10px;}
.blog .list .content dl dt a {display:block; margin-bottom:5px; font-size:18px; font-weight:600; line-height:24px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-break:break-all;}
.blog .list .content dl dt span {display:block; color:#858689; font-size:14px; line-height:24px;}
.blog .list .content dl dd a {font-size:16px; line-height:24px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; word-break:break-word;}
.blog .list .content dl dd a p {margin-top:0;}
.blog .list .content > div {}

/****************** Board Search ******************/
.search_field {margin-bottom:20px;}
.search_field .count {justify-content:flex-start; margin-top:0; font-size:16px; font-weight:400;}
.search_field .count strong {padding:0; color:#0ACF83; font-weight:400;}
.search_field > div {width:100%; margin-top:10px;}
.search_field.end > div {display:block;}
.search_field > div select {width:100%; margin-bottom:5px;}
.search_field > div.fiilterWrap {display:flex; gap:10px;}
.search_field > div.fiilterWrap > a {position:fixed; bottom:10px; left:10px; z-index:1000; width:80px; height:80px; padding:0; line-height:80px; min-width:auto; border-radius:40px; box-shadow:0px 0px 10px rgba(0, 0, 0, 0.3);}
.search_field > div .fillter > button {width:48px; height:48px; padding:0; text-indent:-9999em; border:1px solid #ddd; border-radius:8px; background:url(../../resources/img/icon_filter.png) no-repeat 50% 50%;}
.search_field > div .search {position:relative; flex:1;}
.search_field > div .search input[type=text] {width:100%; padding-right:58px;}
.search_field > div .search button {position:absolute; top:0; right:0; width:48px; height:48px; text-indent:-9999em; background:url(../../resources/img/header_serch.png) no-repeat 50% 50%;}
.search_field > div > a {min-width:130px; height:48px; padding:0 30px; color:#fff; font-size:18px; text-align:center; font-weight:600; line-height:48px; border:0; border-radius:8px; background:#0ACF83; transition:.5s;}

.search_field > div .search3 {position:relative; margin-bottom:10px;}
.search_field > div .search3 input[type=text] {width:100%;}
.search_field > div .search3 button {position:absolute; top:0; right:0; width:48px; height:48px; text-indent:-9999em; background:url(../../resources/img/header_serch.png) no-repeat 50% 50%;}

/****************** Board Button ******************/
.boardBtn {display:flex; gap:5px; margin-top:30px;}
.boardBtn div {display:flex; gap:20px;}
.boardBtn.center {justify-content:center;}
.boardBtn.end {justify-content:flex-end;}
.boardBtn.wide {justify-content:space-between;}
.boardBtn.over {flex-wrap:wrap; gap:10px;}
.boardBtn.over a, .boardBtn.over button {width:100%;}
.boardBtn a, .boardBtn button {min-width:100px; height:40px; padding:0 10px; color:#858689; font-size:14px; text-align:center; font-weight:600; line-height:40px; border:1px solid #ddd; border-radius:8px;}
.boardBtn a:hover, .boardBtn button:hover {border:1px solid #0ACF83;}
.boardBtn .add {color:#fff; border:1px solid #0ACF83; background:#0ACF83;}
.boardBtn .reset {color:#0ACF83; border:1px solid rgba(10, 207, 131, 0.20); background:rgba(10, 207, 131, 0.10);}
.boardBtn .full {width:100%;}
.boardBtn button:disabled {color:#fff; border:0; background:#ddd;}

/******************  Paging ******************/
.paging {display:flex; justify-content:center; margin-top:30px;}
.paging ul {display:flex; justify-content:center;}
.paging li,
.paging a {position:relative; width:36px; height:36px; line-height:36px; font-weight:400; text-align:center;}
.paging li a {display:block;}
.paging .first, .paging .prev, .paging .last {margin-left:0;}
.paging li.on a,
.paging a.on {color:#0ACF83;}
.paging li.on a:after,
.paging a.on:after {content:''; position:absolute; left:50%; bottom:5px; width:10px; height:1px; background:#0ACF83; transform:translateX(-50%);}
.paging li a:nth-child(n+4):not(.last):before {content:""; width:1px; height:13px; background-color:#ebebeb; position:absolute; top:8px; left:0px;}
.paging .first {position:relative;}
.paging .first:before {position:absolute; top:12px; left:15px; content:""; width:13px; height:13px; border-top:1px solid #020000; border-left:1px solid #020000; transform:rotate(-45deg);}
.paging .first:after {content:""; position:absolute; top:9px; left:6px; width:1px; height:19px; border-left:1px solid #020000;}
.paging .prev {position:relative;}
.paging .prev:before {content:""; position:absolute; top:12px; left:15px; width:13px; height:13px; border-top:1px solid #020000; border-left:1px solid #020000; transform:rotate(-45deg);}
.paging .next {position:relative;}
.paging .next:before {content:""; position:absolute; top:12px; right:15px; width:13px; height:13px; border-top:1px solid #020000; border-right:1px solid #020000; transform:rotate(45deg);}
.paging .last {position:relative;}
.paging .last:before {content:""; position:absolute; top:12px; right:15px; width:13px; height:13px; border-top:1px solid #020000; border-right:1px solid #020000; transform:rotate(45deg);}
.paging .last:after {content:""; position:absolute; top:9px; right:6px; width:1px; height:19px; border-top:1px solid #333; border-right:1px solid #020000;}
.paging .first, .paging .prev, .paging .next, .paging .last {text-indent:-9999em;}
.paging .nor {cursor:default;}
.paging .nor:after {border-color:#ccc;}
.paging .nor:before {border-color:#ccc;}

/******************  Attach Add ******************/
.attachFile {display:flex; gap:10px;}
.text + .attachFile {margin-bottom:15px;}
.attachFile a {position:relative; overflow:hidden; height:64px; padding:0 54px; color:#000; line-height:64px; border:1px solid #DDD; border-radius:4px;}
.attachFile a:before {content:""; position:absolute; top:0; left:10px; width:44px; height:64px; background:url(../../resources/img/icon_file.png) no-repeat 50% 50%;}
.attachFile a:after {content:""; position:absolute; top:0; right:10px; width:44px; height:64px; background:url(../../resources/img/icon_download.png) no-repeat 50% 50%;}
.attachFile a span {margin-left:25px; color:#888;}
.attachFile a:hover {border:1px solid #0ACF83;}

/******************  File Add ******************/
.addfile {display:flex;}
.addfile > div {position:relative; width:100%; height:48px; background-color:#fff; border:1px solid #ddd; box-sizing:border-box; border-radius:8px;}
.addfile > div input[type=text] {padding-right:150px; border:0; background:none;}
.addfile > div input[type=text] + label {position:absolute; top:-1px; right:-1px; width:130px; height:48px; color:#858689; text-align:center; line-height:48px; border:1px solid #ddd; border-radius:8px; background:#fff; cursor:pointer;}
.addfile > div input[type=file] {visibility:hidden;}
.addfile > button {width:130px; height:48px; margin-left:20px; color:#858689; font-size:16px; font-weight:400; text-align:center; line-height:48px; border:1px solid #ddd; border-radius:8px; background:#F9F9FA;}

/******************  Any Question ******************/
.anyQuest {margin-top:20px; padding:10px; border-radius:8px; background:#f4f4f4;}
.anyQuest p {font-size:14px; line-height:20px;}
.anyQuest a {display:block; height:48px; margin-top:10px; padding:0 15px; line-height:48px; text-align:center; border:1px solid #ddd; border-radius:8px; background:#fff;}
.anyQuest a:hover {border:1px solid #0ACF83;}
section.contents .anyQuest p {margin-top:0;}

/******************  Reply ******************/
.reply .replyInput {position:relative;}
.reply .replyInput input {width:100%;}
.reply .replyInput button {position:absolute; top:0; width:80px; height:48px; color:#fff; font-size:18px; text-align:center; font-weight:600; line-height:48px; border-radius:8px; background:#0ACF83;}
.reply .replyInput button.add {right:0;}
.reply .replyInput button.close {position:relative; margin-top:5px; color:#333; background:#ddd;}
.reply .replyInput button.close + button.add {right:0;}
.reply .replyInput button.close + button#rebtnInsert {position:relative; margin-top:5px;}
.reply > p {padding:40px 0; text-align:center;}
.reply > ul {margin-top:20px;}
.reply > ul > li {border-bottom:1px solid #ddd;}
.reply ul li > div {display:flex; gap:8px; padding:20px 0;}
.reply ul li div > div {display:flex; justify-content:center; align-items:center; overflow:hidden; width:40px; height:40px; border-radius:20px; background:#F9FAFC;}
.reply ul li div > div img {width:100%;}
.reply ul li div > dl {flex:1;}
.reply ul li div > dl dt {line-height:24px;}
.reply ul li div > dl dd {display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-top:8px; line-height:24px; word-break:break-all;}
.reply ul li div > dl dd span {width:100%; color:#858689; font-size:14px; line-height:20px;}
.reply ul li div > dl dd button {color:#858689; font-size:14px; line-height:20px;}
.reply ul li div > dl dd:not(.replyInput) button.btnShowReply:before {content:' ㆍ '}
.reply ul li.reple2 {padding-left:50px; border-top:1px solid #ddd; background:url("../../resources/img/icon_reply_depth.png") no-repeat 30px 30px;}

/******************  Hash Tag ******************/
.hashTag {display:flex; flex-wrap:wrap; gap:5px; width:100%;}
.hashTag a {height:26px; padding:0 8px; color:#858689; font-size:14px; line-height:26px; border-radius:10px; border:1px solid #ddd; background:#F9F9FA; transition:.5s;}
.hashTag a:hover {border:1px solid #0ACF83;}
.hashTag a:before {content:'#';}

/******************  Hit Like ******************/
ul.HitLike {display:flex; gap:10px; align-items:center; margin-top:15px;}
ul.HitLike li {position:relative; width:65px; height:24px; padding-left:28px; color:#858689; font-size:14px; line-height:24px; text-indent:-1000px;}
ul.HitLike li button {width:30px; overflow:hidden; text-indent:-1000px; line-height:24px;}
ul.HitLike li strong {position:absolute; top:0; left:28px; height:24px; color:#020000; font-size:14px; text-indent:0; line-height:24px; border-radius:8px; background:#F6F6F6;}
ul.HitLike li.hits {background:url("../../resources/img/icon_list_view.png") no-repeat 0 50%;}
ul.HitLike li.like {background:url("../../resources/img/icon_list_like.png") no-repeat 0 50%;}
ul.HitLike li.like.ok {background:url("../../resources/img/icon_list_like_on.png") no-repeat 0 50%;}
ul.HitLike li.like.on {background:url("../../resources/img/icon_list_like_on.png") no-repeat 0 50%;}
ul.HitLike li.like button {color:#858689;}
ul.HitLike li.comment {background:url("../../resources/img/icon_list_comment.png") no-repeat 0 50%;}
ul.HitLike li.share {background:url("../../resources/img/icon_list_share.png") no-repeat 0 50%;}
ul.HitLike li.share button {color:#858689;}

/******************  Button ******************/
.btnAlign {display:flex; gap:10px; margin-top:10px;}
.downBtn {padding:5px 10px; line-height:22px; border:1px solid #ddd; border-radius:8px; background:#fff; transition:.5s;}
.downBtn span {padding-right:20px; background:url("../../resources/img/icon_download02.png") no-repeat 100% 50%; background-size:16px 16px;}
.downBtn:hover {text-decoration:none; border:1px solid #0ACF83;}
.downBtn.disable {background:#ddd; cursor:auto;}
.downBtn.disable span {padding-right:0; color:#fff; background:none;}
.downBtn.disable:hover {border:1px solid #ddd;}

/****************** List Style ******************/
.dotList {margin-top:20px;}
.dotList li {position:relative; padding-left:16px;}
.dotList li:before {content:'ㆍ'; position:absolute; left:0;}

/****************** None List ******************/
.noneList {min-height:300px; justify-content:center !important; padding:130px 0 !important; text-align:center;}
.noneList span {}
/*========================================= // Table List =========================================*/


/*========================================= Search  =========================================*/
.search {}
.search fieldset {position:relative; display:none; gap:10px; align-items:center; width:100%; height:40px; padding:10px 60px 10px 20px; margin:0 auto; border-radius:36px; border:2px solid #0ACF83; background:#F9F9FA;}
.search fieldset input {width:100%; border:0; background:none;}
.search fieldset input:focus {border:0;}
.search fieldset a {width:18px; height:18px;}
.search fieldset button {position:absolute; top:20px; right:20px; width:32px; height:32px; text-indent:-9999em; background:url(../../resources/img/header_serch.png) no-repeat 50% 50%; background-size:32px 32px;}
.search .searchText {text-align:center;}
.search .searchText p {margin-top:0; font-size:14px;}
.search .searchText strong {display:block; margin-top:20px; font-size:22px; font-weight:600; line-height:28px;}
.search .searchText strong span {color:#0ACF83;}
.search .contentsTap {margin-top:40px;}
.search .srachCategory {display:flex; justify-content:space-between; align-items:center; margin-top:40px;}
.search .srachCategory h4 {margin-top:0;}
.search .srachCategory a {position:relative; padding-right:15px; color:#999;}
.search .srachCategory a:after {content:''; position:absolute; top:10px; right:0; width:8px; height:8px; border-top:1px solid #999; border-right:1px solid #999; transform:rotate(45deg);}
.search .blog {margin-top:0;}
.search .blog .list {border-top:0;}

.search .community {margin-top:20px;}
.search .commList {margin-top:20px;}
.search .community .grid {}
.search .community .grid .grid-item {}

/*========================================= // Search =========================================*/


/*========================================= Error  =========================================*/
/****************** Error404 ******************/
.error {width:1240px; margin:0 auto; padding:170px 0; text-align:center;}
.error > .error404 {padding-top:90px; background:url("../../resources/img/error_icon.png") no-repeat 0 0; background-position:top center;}
.error > div h5 {font-size:33px; line-height:50px; letter-spacing:-1.2px; text-align:center; font-weight:500;}
.error > div p {margin-top:27px; line-height:24px; letter-spacing:-0.7px;}
.error > div p span {margin-top:15px; display:inline-block;}
.error > div p a {text-decoration:underline; color:#296caf;}

/****************** Error500 ******************/
.error > .error500 {padding-top:90px; text-align:center; background:url("../../resources/img/error500_icon.png") no-repeat 0 0; background-position:top center;}
/*========================================= // Error  =========================================*/



/*========================================= Footer  =========================================*/
footer {position:relative; width:100%; margin-top:30px;}
footer a.top {position:fixed; right:0; z-index:9998; bottom:30px; height:30px; padding:0 15px; font-size:14px; line-height:30px; color:#fff; border-radius:15px 0 0 15px; background:#0ACF83;}
footer .menu {width:100%; border-bottom:1px solid #F0F0F0;}
footer .menu ul {display:flex; justify-content:center; width:100%;}
footer .menu ul li {position:relative; font-size:14px; line-height:40px;}
footer .menu ul li:first-child {margin-right:10px; padding-right:10px;}
footer .menu ul li:first-child:after {content:""; position:absolute; top:17px; right:0; width:1px; height:10px; background-color:#ebebeb;}
footer .menu ul li a:hover {text-decoration:underline;}
footer .menu > div {float:right; margin-top:13px; padding-right:2px;}
footer .menu > div > a {float:left; width:31px; height:31px; padding:7px 0; text-align:center;}
footer .menu > div > a:first-child {margin-right:35px; position:relative;}
footer .menu > div > a:first-child:after {content:""; width:2px; height:10px; background-color:#ebebeb; position:absolute; top:12px; left:45px;}

footer .company_info {position:relative; width:100%;}
footer .company_info > div {position:relative; width:100%; padding:90px 15px 15px; line-height:18px; background:url("../../resources/img/footer_logo.png") no-repeat 40px 15px; background-size:100px auto;}
footer .company_info div h5 {width:100%; font-size:14px; font-weight:500; position:relative; padding-right:10px; margin-right:7px; line-height:25px;}
footer .company_info div p {margin-top:10px; font-size:12px;}
footer .company_info div div {}
footer .company_info div div address {position:relative; padding-right:10px; margin-right:7px; font-size:12px; line-height:18px; letter-spacing:-1px;}
footer .company_info div div address:after {content:""; width:1px; height:10px; background-color:#ebebeb; position:absolute; top:8px; right:0;}
footer .company_info div div dl {display:flex;}
footer .company_info div div dl dt {margin-right:5px; font-size:12px;}
footer .company_info div div dl dd {font-size:12px;}
footer .company_info div div a {font-size:12px; text-decoration:underline;}
footer .company_info div div a:hover {text-decoration:underline;}
footer .company_info .link {position:absolute; top:28px; right:35px;}
footer .company_info .link a {float:left;}
footer .company_info .link a img {height:40px;}
/*========================================= // Footer  =========================================*/



/*========================================= Modal  =========================================*/
/******************  Fillter Modal ******************/
.fillterModal {display:none; position:fixed; top:0; left:0; z-index:100; width:100%; height:100%; background:rgba(0, 0, 0, 0.2);}
.fillterModal > div {position:absolute; top:50%; left:50%; width:90%; margin-left:-45%; padding:15px; border-radius:10px; background:#fff; transform:translateY(-50%);}
.fillterModal > div > button {position:absolute; top:7px; right:15px; font-size:26px;}
.fillterModal > div h4 {margin:0 0 20px; padding:0; font-size:22px; line-height:40px; background:none;}
.fillterModal > div h5 {margin-bottom:10px; font-size:16px; line-height:26px;}
.fillterModal > div fieldset {}
.fillterModal > div fieldset div {display:flex; flex-wrap:wrap; gap:8px; padding-bottom:20px;}
.fillterModal > div fieldset .boardBtn {margin-top:20px;}

/******************  Landscape Modal ******************/
.landscapeModal {display:none; position:fixed; top:0; left:0; z-index:100; width:100%; height:100%; background:rgba(0, 0, 0, 0.2);}
.landscapeModal > div {position:absolute; top:50%; left:50%; width:90%; padding:15px; border-radius:10px; background:#fff; transform:translate(-50%, -50%);}
.landscapeModal > div > button {position:absolute; top:15px; right:15px; font-size:26px;}
.landscapeModal > div h4 {margin:0 0 20px; padding:0; font-size:26px; line-height:40px; background:none;}
.landscapeModal > div h5 {margin-bottom:10px; font-size:16px; line-height:20px;}
.landscapeModal > div fieldset {height:300px; overflow:hidden; overflow-y:scroll;}
.landscapeModal > div fieldset > div {margin-top:20px;}
.landscapeModal > div fieldset > div:first-child {margin-top:0;}
.landscapeModal > div fieldset > div ul li {margin-top:5px;}
.landscapeModal > div fieldset > div ul li:first-child {margin-top:0;}
.landscapeModal > div fieldset > div label {font-size:14px;}
.landscapeModal > div fieldset .scrollbar-inner {overflow:hidden;}
.landscapeModal > div .boardBtn {margin-top:40px;}

/******************  Board Modal ******************/
.alert {display:none; position:fixed; top:0; left:0; z-index:100; width:100%; height:100%; background:rgba(0, 0, 0, 0.2);}
.alert > div {position:absolute; top:50%; left:50%; width:90%; margin-left:-45%; padding:20px; border-radius:10px; background:#fff; transform:translateY(-50%);}
.alert fieldset {width:100%; margin:0 auto; text-align:center;}
.alert fieldset input {width:100%;}
.alert > div .close {position:absolute; top:19px; right:19px; font-size:20px;}
.alert > div h4 {margin:0 0 20px; font-size:18px; text-align:center;; line-height:24px; background:none;}
.alert > div p {font-size:18px; text-align:center; line-height:26px;}

/* 기본 팝업 스타일 */
.page_popup {
    background-color: green;
    background-repeat: no-repeat;
    position: absolute;
    cursor: move;
    border-style: ridge;
    z-index: 200;
    width: 80%;
    display: none;
}

.page_popup .absolute span {
    font-size: 14px;
}

.page_popup img {
    width: 100% !important;
    height: auto !important;
    display: none;
}

/* 모바일 화면에서 팝업 숨기기 */
@media (max-width: 768px) {
    .page_popup {
        display: none;
    }
}

/*========================================= // Modal  =========================================*/


/*=========================================  CK Editer  =========================================*/
.ck-editor .ck-content p.ck-placeholder {min-height:150px;}
/*========================================= // CK Editer  =========================================*/


 
/*=========================================  SCROLLBAR BASE CSS  =========================================*/
.scroll-wrapper {overflow:hidden !important; padding:0 !important; position:relative;}
.scroll-wrapper > .scroll-content {border:none !important; box-sizing:content-box !important; height:auto; left:0; margin:0; max-height:none; max-width:none !important; overflow:scroll !important; padding:0; position:relative !important; top:0; width:auto !important;}
.scroll-wrapper > .scroll-content::-webkit-scrollbar {height:0; width:0;}
.scroll-element {display:none;}
.scroll-element, .scroll-element div {box-sizing:content-box;}
.scroll-element.scroll-x.scroll-scrollx_visible,
.scroll-element.scroll-y.scroll-scrolly_visible {display:block;}
.scroll-element .scroll-bar,
.scroll-element .scroll-arrow {cursor:default;}

.scroll-textarea {border:1px solid #ddd; border-top-color:#999;}
.scroll-textarea > .scroll-content {overflow:hidden !important;}
.scroll-textarea > .scroll-content > textarea {border:none !important; box-sizing:border-box; height:100% !important; margin:0; max-height:none !important; max-width:none !important; overflow:scroll !important; outline:none; padding:2px; position:relative !important; top:0; width:100% !important;}
.scroll-textarea > .scroll-content > textarea::-webkit-scrollbar {height:0; width:0;}

/*************** SIMPLE INNER SCROLLBAR ***************/
.scrollbar-inner > .scroll-element,
.scrollbar-inner > .scroll-element div {border:none; margin:0; padding:0; position:absolute; z-index:10;}
.scrollbar-inner > .scroll-element div {display:block; height:100%; left:0; top:0; width:100%;}
.scrollbar-inner > .scroll-element.scroll-x {bottom:2px; height:8px; left:0; width:100%;}
.scrollbar-inner > .scroll-element.scroll-y {height:100%; right:2px; top:0; width:8px;}
.scrollbar-inner > .scroll-element .scroll-element_outer {overflow:hidden;}
.scrollbar-inner > .scroll-element .scroll-element_outer,
.scrollbar-inner > .scroll-element .scroll-element_track,
.scrollbar-inner > .scroll-element .scroll-bar {-webkit-border-radius:8px; -moz-border-radius:8px; border-radius:8px;}
.scrollbar-inner > .scroll-element .scroll-element_track,
.scrollbar-inner > .scroll-element .scroll-bar {-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; filter:alpha(opacity=40); opacity:0.4;}
.scrollbar-inner > .scroll-element .scroll-element_track { background-color:#e0e0e0; }
.scrollbar-inner > .scroll-element .scroll-bar { background-color:#c2c2c2; }
.scrollbar-inner > .scroll-element:hover .scroll-bar { background-color:#919191; }
.scrollbar-inner > .scroll-element.scroll-draggable .scroll-bar { background-color:#919191; }

/* update scrollbar offset if both scrolls are visible */
.scrollbar-inner > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track { left:-12px; }
.scrollbar-inner > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track { top:-12px; }
.scrollbar-inner > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { left:-12px; }
.scrollbar-inner > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { top:-12px; }

/*ckeditor css*/
.ck.ck-editor{max-width:100%;}
.ck-editor__editable{min-height:200px;}

#chatbot_button {display:none !important;}

.tagify {line-height:20px; border-radius:8px;}
.tagify__tag > div {padding:2px 25px 2px 10px !important;}
.tagify__tag > div > * {font-size:14px; line-height:20px;}

.tagify:before {content:'#'; display:inline-block; padding-left:10px; color:#aaa; font-size:18px; line-height:42px;}
.tagify .tagify__tag > div::before {content:' # '; line-height:32px; padding-left:5px;}
.tagify__tag .tagify__tag-text {padding-left:5px; line-height:28px;}