@charset "utf-8";

/***************************************
	Common Search Style
****************************************/

.resultContent * {word-break:keep-all;}
.resultContent h2 {display:block; position:relative; padding:1.25em 0; font-size:1.1em; font-family:'OneMobileTitle', Helvetica, Arial, sans-serif; color:#000; border-bottom:2px solid #000; font-weight:500;}
.resultContent h2 em {color:#FF0000;}
.resultContent h2 em:before,
.resultContent h2 em:after {content:'"';}
.resultContent h3 {color:#000; margin-bottom:1.5em;}
.resultContent h3 strong {font-size:1.3em; font-weight:500 !important; font-family:'OneMobileTitle', Helvetica, Arial, sans-serif;}
.resultContent h3 span {margin-left:1em; color:#000; font-weight:600;}
.resultContent h3 span em {color:#FF0000;}
@media all and (max-width:1024px) {
	.resultContent h3 {margin-bottom:1.75em;}
}
@media all and (max-width:640px) {
	.resultContent h2 {padding:1.2em 0;}
	.resultContent h3 {margin-bottom:1em;}
}
@media all and (max-width:450px) {
	.resultContent h2 {text-align:center; line-height:1.4em;}
}

.welfareArea,
.tourArea,
.reservArea,
.graphArea,
.recruitArea {margin:1.5em 0; padding:2.25em 1.5em; background:#FAFBFD; overflow:hidden;}
@media all and (max-width:640px) {
	.resultBox,
	.resultBox {padding:1.5em 1em;}
}

.resultContent .tbl th,.resultContent .tbl td {padding:1em .5em; background:#fff; border-left:none; border-right:none; color:#333;}
.resultContent .list-ul > li:before {width:0.25em; height:0.25em; top:1em; background:#FF0000; border:none; border-radius:0;}
.resultContent .tip {position:relative; padding-left:1em !important; background:none !important; font-weight:500;}
.resultContent .tip:before {content:"※"; position:absolute; left:0; top:0;}

.bod_page {display:block; position:relative; text-align:center; margin-top:.5em;}
.bod_page > * {display:inline-block; vertical-align:middle; position:relative; margin:.05em; font-size:.9em; padding:0 .2em; height:2.22em; line-height:2.22em; min-width:2.22em;}
.bod_page span {background:#323768; color:#fff; font-weight:600;}
.bod_page a[class*="btn_"] {font-size:1em; width:2em; height:2em; min-width:0; padding:0; line-height:1; background:url(../img/spr_paging.svg) no-repeat 0 0; background-size:auto 100%; text-indent:-999px; overflow:hidden; border:1px solid #DDDDDD; padding:0;}
.bod_page a.btn_first {background-position:0 50%;}
.bod_page a.btn_10prev {background-position:-2.2em 50%;}
.bod_page a.btn_10next {background-position:-4.25em 50%;}
.bod_page a.btn_end {background-position:-6.4em 50%;}

@media all and (max-width:640px) {
	.bod_page {font-size:.9em;}
}

/***************************************
	Result Total List
****************************************/

.totalList {display:block; position:relative; padding:1em 1.5em; border:1em solid #F8F7FD;}
.totalList:after {content:""; display:block; clear:both;}
.totalList li {display:block; position:relative; width:33.3%; float:left; padding:.75em 0;}
.totalList li a {display:block; position:relative; color:#454545; font-weight:600; padding-left:.75em;}
.totalList li a:before {content:""; display:block; position:absolute; left:0; top:50%; width:.25em; height:.25em; background:#222; border-radius:1px; transform:translateY(-50%); -webkit-transform:translateY(-50%);}
@media all and (max-width:1024px) {
	.totalList li a {font-size:.9em;}	
}
@media all and (max-width:840px) {
	.totalList {padding:0.45em 1em;}
	.totalList li {width:33.3333%; padding:.5em 0;}
}
@media all and (max-width:450px) {
	.totalList li {width:50%;}	
}
@media (max-width: 320px) {
	.totalList li {width:auto; float:none;}	
}

/* Quick Style */
.quickLink {display:block; position:relative; min-height:2.3em; padding-left:7.5em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:20px;}
.quickLink strong {display:block; position:absolute; top:0; left:0; width:6.5em; height:2.3em; line-height:2.3em; text-align:center; border-radius:9em; background:#5B6471; color:#fff; font-weight:600;}
.quickLink span {font-size:1.1em; font-weight:400; color:#000; line-height:2.09em; font-family:'OneMobileTitle', Helvetica, Arial, sans-serif;}
.quickLink a {font-size:1em; color:#004AB9; line-height:2em; margin-left:1em;}
@media all and (max-width:640px) {
	.quickLink {font-size:.9em; padding-left:6.2em;}
	.quickLink strong {width:5.5em;}
	.quickLink span {font-size:1em; line-height:2em;}
	.quickLink a {margin-left:.5em;}
	.quickLink a,
	.quickLink span {letter-spacing:-.03em;}
}

/***************************************
	Depart Result Style
****************************************/

/* Welfare */
.welfareArea {display:block; position:relative; overflow:hidden;}
.welfareArea h3 {display:block; position:relative; color:#222222; font-family:'OneMobileTitle', Helvetica, Arial, sans-serif; font-size:1.8em; text-align:center; font-weight:800; margin-bottom:.83em;}
.welfareArea .txt {text-align:center; margin-bottom:1.5em;}
.welfareArea .tabs {display:block; position:relative; width:30.45%; float:left;}
.welfareArea .tabs li + li {margin-top:.5em;}
.welfareArea .tabs li > * {display:block; position:relative; border-radius:.25em; border:1px solid #DDDDDD; padding:.65em; text-align:center; background:#fff;}
.welfareArea .tabs li strong {display:block; position:relative; line-height:1.2em; color:#222;}
.welfareArea .tabs li > *.on {border-color:#323768; background:#323768;}
.welfareArea .tabs li > *.on strong {font-weight:700; color:#fff;}
.welfareArea .tab-content {display:block; position:relative; width:66.497%; float:right; padding:.75em; border-radius:.75em; background:#fff; height:21.6em;}
.welfareArea .scroll-box {display:block; position:relative; width:100%; height:100%; overflow:auto; padding-right:1.25em;}
.welfareArea .list {display:block; position:relative;}
.welfareArea .list > li + li {margin-top:1em;}
.welfareArea .list > li > a {display:block; position:relative; padding:1em; background:#4A4D65;}
.welfareArea .list > li > a span {display:block; position:relative; font-weight:600; color:#fff;}
.welfareArea .list > li > ul {display:block; position:relative; padding:.65em 1em; border:1px solid #DFE4F2; border-top-width:0; overflow:hidden;}
.welfareArea .list > li > ul > li {display:block; position:relative; width:50%; float:left; padding:.35em 0;}
.welfareArea .list > li > ul > li > a {display:block; position:relative; padding-left:.45em; padding-right:.3em; font-size:.9em;}
.welfareArea .list > li > ul > li > a:before {content:""; display:block; position:absolute; width:4px; height:4px; left:0; top:50%; margin-top:-2px; background:#bbb; border-radius:100%;}
.welfareArea .list > li > ul > li > a span {display:block; position:relative; font-size:.9em; line-height:1.2em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
@media all and (min-width:641px) {
	.welfareArea h3 br {display:none;}
}
@media all and (max-width:640px) {
	.welfareArea {padding:.75em;}
	.welfareArea h3 {font-size:1.4em; line-height:1.3em; margin:0 0 1em; text-align:center;}
	.welfareArea .tabs,
	.welfareArea .tab-content {width:auto; float:none;}
	.welfareArea .tabs {margin-bottom:1em;}
	.welfareArea .tabs > ul {margin:-.25em; overflow:hidden;}
	.welfareArea .tabs > ul > li {width:50%; float:left; padding:.25em;}
	.welfareArea .tabs > ul > li + li {margin-top:0;}
	.welfareArea .tabs li strong {font-size:.9em;}
	
	.welfareArea .tab-content {height:auto;}
	
	.welfareArea .list > li > a {padding:.8em;}
	.welfareArea .list > li > ul > li {width:auto; float:none;}
	
	.welfareArea .scroll-box {height:auto; padding-right:0;}
}

/* recruitArea */

.recruitArea h3 {display:block; position:relative; color:#222222; font-family:'OneMobileTitle', Helvetica, Arial, sans-serif; font-size:1.8em; text-align:center; font-weight:800; margin-bottom:.83em;}
.recruitArea .txt {text-align:center; margin-bottom:1.5em; line-height:1.4em;}
.recruitArea dl {display:table-row;}
.recruitArea dl > dt,
.recruitArea dl > dd {display:table-cell; vertical-align:middle; position:relative; padding:.3em;}
.recruitArea dl > dt {width:10.58em; text-align:left; font-weight:700; line-height:120%;}
.recruitArea dl > dd {color:#333;}
.recruitArea dl > dd label {margin-right:1rem;}
.recruitArea input,
.recruitArea select,
.recruitArea textarea {border:1px solid #ddd !important; border-radius:0.25em !important; color:#333; font-size:1em !important;}
.recruitArea input[type="text"],
.recruitArea select {height:2.5em; padding-right:2em; width:100%; padding-left:1em; padding-right:2em; appearance:none; background-image:url(../img/ico_select_b.svg); background-repeat:no-repeat; background-position:top 50% right 0.55em; background-size:0.9em auto;}
.recruitArea input[type=button] {cursor:pointer;}
.recruitArea input[type="checkbox"] {display:block; position:absolute; top:0; left:0; opacity:0; z-index:-999;}

.custom-search-wrap .search-box				{border:1px solid #ddd; background:#fff; border-radius:0.75em; padding:1.75em;}
.custom-search-wrap .search-box .area label {margin:.4%; text-align:left; border:1px solid #ddd; border-radius:0.25em; display:inline-block; padding:0.65em 1.3em;}
.custom-search-wrap .search-box .area input[type="checkbox"]:checked + label {border:1px solid #000000; color:#000000; font-weight:700;}
.custom-search-wrap .btnWrap {text-align:center; margin-top:1.5em; border-top:1px solid #ddd; padding-top:2em;}
.custom-search-wrap .btn {display:inline-block; padding:0.65em 6em;background:#323768; color:#fff; border-radius:0.5em;}
.custom-search-wrap .list-box {margin-top:1em;}
.custom-search-wrap .list-box li {position:relative; overflow:hidden; border:1px solid #ddd; padding:1.25em 1.75em; background:#fff; border-radius:0.5em;}
.custom-search-wrap .list-box li + li {margin-top:0.5em;}
.custom-search-wrap .list-box li a {position:absolute; top:0; left:0; display:block; width:100%; height:100%; text-indent:-9999px;}
.custom-search-wrap .list-box li .tit {font-size:1.2em; margin-bottom:1em;}
.custom-search-wrap .list-box li .date {position:absolute; top:50%; transform:translateY(-50%); right:2em; border-radius:0.5em; padding:0.75em; min-height:3.9em; display:table; width:10em; text-align:center; color:#fff; background:#209EE4; font-size:0.9em;}
.custom-search-wrap .list-box li .date em {display:table-cell; vertical-align:middle; line-height: 1.3em;}
.custom-search-wrap .list-box li .tag span {display:inline-block; vertical-align:middle; border-radius:1em; padding:0.65em 1em;background:#F6F7FB; font-size:0.8em;}
.custom-search-wrap .list-box .btn {margin-top:1em; width:100%; background:#A8AABC;}

@media all and (max-width:1024px) {
	.recruitArea dl > dt {width:6.58em}
	.custom-search-wrap .list-box li .date {top:0; right:0; font-size:0.8em; border-radius:0 0 0 0.5em; transform:inherit; width:auto; min-height:auto; padding:0.5em 1em;}
	.custom-search-wrap .list-box li .date br {display:none;}
	.custom-search-wrap .list-box li .tit strong {display:block; overflow:hidden; text-overflow:ellipsis; white-space: nowrap;} 
}

@media all and (max-width:640px){
	.recruitArea dl > * {width:100%; display:block !important;}

	.custom-search-wrap .btn {width:100%; padding-left:1em; padding-right:1em;}
}
@media all and (max-width:580px){
	.custom-search-wrap .search-box .area label {width:31%; font-size:0.85em; padding:0.65em; text-align:center;}
	.custom-search-wrap .list-box li  {padding-bottom:2.8em;}
	.custom-search-wrap .list-box li .date  {top:auto; right:auto; bottom:0; left:0; width:100%;}
	.custom-search-wrap .list-box li .tag span {display:inline-block; margin:0.25em 0;}
}
@media all and (max-width:460px){
	.custom-search-wrap .search-box .area label {width:48%;}
}

/* Tour */

.tourArea {display:block; position:relative;}
.tourArea .thumb {position:relative; overflow:hidden; border-radius:.5em; background:#F8F8F8;}
.tourArea .thumb:before {content:""; display:block; position:relative; padding-top:65%; z-index:-1;}
.tourArea .thumb:after {content:""; display:block; position:absolute; top:0; left:0; right:0; bottom:0; z-index:1; border:1px solid #D3D3D3; border-radius:.5em;}
.tourArea .thumb img {display:block; position:absolute; top:50%; left:50%; min-width:100%; min-height:100%; max-width:200%; max-height:200%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); z-index:0;}
.tourArea .thumb img[src*="noimage"] {max-width:70%; height:auto; min-width:0; min-height:0;}

.tourArea h3 {font-size:1.4em; margin-bottom:.7em; font-weight:800; color:#222;}
.tourArea h3 .link {display:inline-block; vertical-align:middle; padding-left:1em; font-size:0.6em; color:#004AB9; font-weight:400;}
.tourArea .tit {font-size:0.9em; margin-bottom:1em;}
.tourArea .txt {display:table; width:100%; table-layout:fixed; position:relative; color:#555; line-height:1.5em; margin-bottom:1em; font-size:.9em;}
.tourArea .txt > *  {display:table-cell;}
.tourArea .txt strong {width:2.8em; color:#222;}
.tourArea .gallery {margin:0; padding:.25em; overflow:hidden;}
.tourArea .gallery > li {width:33.3333%; float:left; padding:.25em;}
.tourArea .gallery .thumb,
.tourArea .gallery .thumb:after {border-radius:0;}
.tourArea .gallery > li span {margin-top:0.5em; text-align:center; display:block; font-size:0.9em;}

.tourArea .visual {display:block; position:relatie; float:left; width:40.61%;}
.tourArea .visual .quick {margin:0 -.25em; overflow:hidden; padding:.25em 0;}
.tourArea .visual .quick li {display:block; position:relative; width:50%; padding:.25em; float:left;}
.tourArea .visual .quick li a {display:block; position:relative; border-radius:.25em; padding:.75em .5em; border:1px solid #ddd; background:#fff; text-align:center;}
.tourArea .visual .quick li a span {font-size:.9em; color:#222;}
.tourArea .visual .quick li a:hover,
.tourArea .visual .quick li a:focus {border-color:#323768; background:#323768;}
.tourArea .visual .quick li a:hover span,
.tourArea .visual .quick li a:focus span {color:#fff; font-weight:600;}

.tourArea .info {margin-top:1em;}
.tourArea .info li {color:#555; line-height:1.6em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:0.9em;}
.tourArea .info li strong {color:#222; font-weight:800; margin-right:0.5em;}
.tourArea .quick {margin:-0.25em;}
.tourArea .quick li {position:relative; width:20%; padding:0.25em; float:left; color:#222; font-size:0.9em; line-height:1.3em; text-align:center;}
.tourArea .quick li.ico a {display:block;}
.tourArea .quick li.ico a:before {content:""; display:block; width:4.35em; height:4.25em; margin:0 auto 0.5em; border-radius:1em; background:#FAFBFD no-repeat 50% 50%;}
.tourArea .quick li.ty1 a:before{background-image:url(../img/ico_tour_ty1.svg);}
.tourArea .quick li.ty2 a:before{background-image:url(../img/ico_tour_ty2.svg);}
.tourArea .quick li.ty3 a:before{background-image:url(../img/ico_tour_ty3.svg);}
.tourArea .quick li.ty4 a:before{background-image:url(../img/ico_tour_ty4.svg);}
.tourArea .quick li.ty5 a:before{background-image:url(../img/ico_tour_ty5.svg);}
.tourArea .desc {display:block; position:relative; float:right; width:56.35%; background:#fff; padding:1.5em; border-radius:.75em;}

/* festival */
.festivalArea .gallery > li  {width:25%;}

@media all and (max-width:840px) {
	.tourArea .thumb {max-width:20em; margin-left:auto; margin-right:auto;}
	.tourArea .visual,
	.tourArea .desc {float:none; width:auto;} 
	.tourArea .desc {padding:1em;}

}
@media all and (max-width:640px) {
	.tourArea  {padding:.5em;}

}
@media all and (max-width:580px) {
	.tourArea .gallery > li,
	.festivalArea .gallery > li {width:auto; float:none;}
	.tourArea .gallery .thumb {max-width:15em; margin-left:auto; margin-right:auto;}
	.tourArea .quick li {width:33.3333%;}
	.tourArea .quick li br {display:none;}

}
@media all and (max-width:460px) {
	.tourArea h3 .link {padding-left:0;}
	.tourArea .quick li {width:50%;}
	
}

/* graph */
.graphArea {display:block; position:relative;}
.graphArea .tit {font-weight:700; margin-bottom:1.5em; line-height:1.5em;}
.graphArea .tit em {margin:0 0.5em; font-size:1.4em; font-weight:500; font-family:'OneMobileTitle', Helvetica, Arial, sans-serif;}
.graphArea .tit .standard {color:#FF0000; font-weight:400;}
.graphArea .graph {background:#fff; border-radius:0.5em; width:100%; height:28em;}
.graphArea .graph .thumb {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%);}
.graphArea .btn-link {position:absolute; top:2em; right:1.5em; display:inline-block; vertical-align:middle; border:1px solid #D3D3D3; border-radius:2px; color:#333; padding:.38em 2em .34em .75em;}
.graphArea .btn-link:after {content:""; display:block; position:absolute; top:50%; margin-top:-.375em; right:.75em; width:.75em; height:.75em; background:url(../img/ico_blank.svg) no-repeat 50% 50%; background-size:contain;}
.graphArea .btn-link span {display:block; line-height:1.4em; font-size:.8em; color:#333; font-weight:600;}

@media all and (max-width:740px) {
	.graphArea .tit em {display: block; margin:0;}
}

/* Reservation */
.reservArea {display:block;}
.reservArea .tabs ul {margin:-.25em; overflow:hidden;}
.reservArea .tabs li {display:Block; position:relative; padding:.25em; float:left; width:50%;}
.reservArea .tabs button {display:block; position:relative; width:100%; height:2.5em; text-align:center; background:#fff; border-radius:.25em; border:1px solid #ddd;}
.reservArea .tabs button strong {display:block; position:relative; font-size:.9em;}
.reservArea .tabs button.on {background:#323768; border-color:#323768;}
.reservArea .tabs button.on strong {color:#fff; font-weight:600;}
.reservArea .tab-content {display:block; position:relative; margin-top:1.5em; padding:1.5em; background:#fff; border-radius:.75em;}

.reserv-content .category {text-align:center;}
.reserv-content .category li {display:inline-block; vertical-align:middle; padding:0 .7em;}
.reserv-content .category li a {display:block;}
.reserv-content .category li a:before {content:""; display:inline-block; vertical-align:middle; width:1em; height:1em; background:url(../img/ico_tab_off.svg) no-repeat 50% 50%; background-size:contain; margin-right:.4em;}
.reserv-content .category li a span {font-size:1em; color:#222; vertical-align:middle;}
.reserv-content .category li a.active:before {background-image:url(../img/ico_tab_on.svg);}
.reserv-content .category li a.active span {color:#2A49B9; font-weight:800;}

.reserv-content .list {display:block; position:relative; margin:1.5em -.5em 1em; overflow:hidden; }
.reserv-content .list > li {position:relative; padding:.5em; box-sizing:border-box; width:50%; float:left;}
.reserv-content .list a {display:block; position:relative; padding:1.25em; z-index:0;}
.reserv-content .list a:before {content:""; display:block; position:absolute; top:0; left:0; right:0; bottom:0; z-index:-1; background:#fff; border-radius:.5em; border:1px solid #DFE4F2;}
.reserv-content .list a:hover:before,
.reserv-content .list a:focus:before {border:2px solid #323768;}
.reserv-content .list .date {display:block; position:relative; font-size:.9em; line-height:1.5em; color:#555555;}
.reserv-content .list .date strong {display:inline-block; vertical-align:middle; min-width:4.4em; font-weight:800; color:#222;}

.reserv-content .list .subj {display:block; position:relative; font-size:1.1em; color:#222; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:1.1em; margin-bottom:.68em;}
.reserv-content .list .subj .cate {display:inline-block; position:relative; font-size:.73em; line-height:1.495em; font-weight:600; border:1px solid #00AAA0; color:#00AAA0; border-radius:3px; padding:0 .625em; vertical-align:middle; margin-right:.3em;}
.reserv-content .list .subj .cate[data-cate="무료"] {color:#00AAA0; border-color:#00AAA0;}
.reserv-content .list .subj .cate[data-cate="유료"] {color:#FF4141; border-color:#FF4141;}
.reserv-content .list .subj .cate[data-cate="강동문화복지회관"] {color:#FF4141; border-color:#FF4141;}

@media all and (max-width:1024px) {
	.reserv-content .list {margin:1.5em -.25em 1em;}
	.reserv-content .list > li {padding:.25em;}	
	.reserv-content .list a {padding:1em;}
}
@media all and (max-width:740px) {
	.reserv-content .list > li {float:none; width:auto;}	
}
@media all and (max-width:640px) {
	.reservArea {padding:.5em;}
	.reservArea .tab-content {padding:1em;}
	
	.reserv-content .list {margin-top:1em;}
	.reserv-content .category li {padding:.3em;}
	.reserv-content .list .subj {font-size:1em;}
}

/***************************************
	Common Resut Box
****************************************/

.resultBox {position:relative; padding:1.85em 0; border-bottom:1px solid #D3D3D3;}
@media all and (max-width:640px) {.resultBox {padding:2em 0;}}

.resultBox .more {display:block; position:absolute; top:2.25em; right:0; width:1.5em; height:1.5em; background:url(../img/btn_more.svg) no-repeat 50% 50%; background-size:contain; border:1px solid #D3D3D3; border-radius:2px; margin-top:-.1em;}
.resultBox .more span {display:block; position:absolute; top:0; left:0; text-indent:-999px; overflow:hidden; opacity:0;}
@media all and (max-width:640px) {.resultBox .more {top:2em; margin-top:-.1em;}}

.no-data {display:block; position:relative; text-align:center; background:#fafafa; border-radius:1em; padding:1.5em;}
.no-data > strong {display:table; width:100%; height:5em;}
.no-data > strong > * {display:table-cell; vertical-align:middle; font-size:.85em;}

.no-result {display:block; position:relative; background:#fff; padding:1.5em; text-align:center;}
.no-result .tit {font-size:1.333334em; font-family:'OneMobileTitle', Helvetica, Arial, sans-serif;}
.no-result .tit strong {font-weight:500 !important;}
.no-result .tit:before {content:""; display:block; width:4.5em; height:4.5em; margin:0 auto 1.666667em; background:#FAFBFD url(../img/img_no_result.svg) no-repeat 50% 50%; font-size:1.2em; border-radius:1.388889em;}
.no-result .txt {font-size:.9em; line-height:1.3; margin-top:1em; color:#666666;}
.no-result .txt .point {color:#004AB9 !important;}

/***************************************
	Menu Search Box
****************************************/

.menuList {display:block; position:relative;}
.menuList li {display:Block; position:relative; padding-left:1em;}
.menuList li:before {content:""; display:block; position:absolute; width:.25em; height:.25em; border-radius:1px; background:#FF0000; left:0; top:.625em; margin-top:-.125em;}
.menuList li + li {margin-top:.5em;}
.menuList li a {display:block; position:relative; line-height:1.25em; color:#666666;}
.menuList li a strong {color:#333333; margin-right:.75em; font-weight:600;}
.menuList li a strong:before {content:"[";}
.menuList li a strong:after {content:"]";}
/*.menuList li a span + span:before {content:""; display:inline-block; position:relative; width:1em; height:1em; background:url(../img/ico_menu_depth.svg) no-repeat 50% 50%; background-size:contain; vertical-align:middle;}*/

/***************************************
	Work Person Resut Box
****************************************/
.work-item .depart strong,
.work-item .depart span {display:block; word-break:break-all;}
.work-item > * strong br {display:none !important;}
.work-item .office span {word-break: break-all;}

@media all and (min-width:891px) {
	.work-item {display:table; width:100%; table-layout:fixed; border-bottom:1px solid #D3D3D3;}
	.work-item > * {display:table-cell; vertical-align:middle; word-break:break-all; padding:1em .5em; text-align:center; line-height:1.4em;}
	.work-item > * .tit {position:absolute; top:0; left:0; width:0; height:0; text-indent:-999px; overflow:hidden;}
	.work-item > * strong {font-weight:600;}
	.work-item .depart {width:8em;}
	.work-item .office {width:9.2em;}
	.work-item .name {width:5.7em;}
	.work-item .tel {width:10em;}
	.work-item .descript {text-align:left;}

	.workTitle {display:block; position:relative; border-top:2px solid #333; border-bottom:1px solid #D3D3D3;}
	.workTitle .work-item {border:none;}
	.workTitle .work-item > * {font-weight:600;}
	.workTitle .work-item .descript {text-align:center;}
}
@media all and (max-width:890px) {
	.workTitle {display:none;}
	.workList li + li {margin-top:1em;}

	.work-item {position:relative; border:1px solid #DDDDDD; padding:3.4em 1.5em .75em;}
	.work-item > * {line-height:1.4em;}
	.work-item .name {position:absolute; top:0; left:0; right:0; height:2.9em; padding:.65em; background:#F8F7FD;}
	.work-item .name > span {display:block; position:relative; font-size:1.15em; color:#222; font-weight:400; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-family:'OneMobileTitle', Helvetica, Arial, sans-serif;}
	.work-item .office,
	.work-item .depart {display:block; position:relative; padding:0 0 0 6.5em; margin:.4em 0;}
	.work-item .office > *,
	.work-item .depart > * {display:inline-block; font-size:.925em; color:#333; padding:0; vertical-align:top;}
	.work-item .office .tit,
	.work-item .depart .tit {display:block; position:absolute; top:0; left:0; font-weight:600;}
	.work-item .office strong,
	.work-item .depart strong {font-weight:600;}
	.work-item .office strong,
	.work-item .depart strong,
	.work-item .office span,
	.work-item .depart span {margin-right:.3em;}
	.work-item .descript .tit {display:block; position:absolute; top:0; left:0; width:0; height:0; text-indent:-999px; overflow:hidden;}
	.work-item .descript {display:block; position:relative; margin-top:.8em; margin-bottom:2.35em; padding:.75em 0; border-top:1px solid #DDDDDD;}
	.work-item .descript span {display:block; font-size:.925em; color:#333;}

	.work-item .tel {display:block; position:absolute; padding:.35em 1.5em .35em 3.25em; bottom:.75em; left:50%; border:1px solid #ddd; border-radius:9em; transform:translateX(-50%); -webkit-transform:translateX(-50%); white-space:nowrap; max-width:100%; overflow:hidden; text-overflow:ellipsis;}
	.work-item .tel span {display:block; position:relative; font-family:'Kanit', 'Pretendard', sans-serif; font-weight:600;}
	.work-item .tel .tit {display:block; position:absolute; top:50%; left:1em; margin-top:-.75em; width:1.5em; height:1.5em; background:url(../img/ico_tel.svg) no-repeat 50% 50%; background-size:contain; border-radius:100%; overflow:hidden; text-indent:-999px;}
}
@media all and (max-width:480px) {
	.work-item .office,
	.work-item .depart {padding-left:4.5em;}
}

.work-title .name, 
.work-item .name {display:none;}

/***************************************
	Other Common Resut Box
****************************************/

.contentList {display:block; position:relative;}
.contentList > li + li {margin-top:1.8em;}

.cont-item {display:block; position:relative; overflow:hidden;}
.cont-item .tit {display:block; margin-bottom:.5em; line-height:1.4em; max-width:100%;}
.cont-item .tit > * {display:inline-block; vertical-align:middle;}
.cont-item .tit .subj {font-size:1em; color:#333; font-weight:600; margin-right:1em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:90%;}
.cont-item .tit .subj em {font-weight:400; color:#5B6471; margin-right:.5em;}
.cont-item .tit .subj em:before {content:"[";}
.cont-item .tit .subj em:after {content:"]";}
.cont-item .tit .date {font-size:.9em; color:#AAAAAA; margin-right:1em;}
.cont-item .tit .btn-link {display:inline-block; position:relative; vertical-align:middle; border:1px solid #D3D3D3; border-radius:2px; color:#333; padding:.38em 2em .34em .75em;}
.cont-item .tit .btn-link:after {content:""; display:block; position:absolute; top:50%; margin-top:-.375em; right:.75em; width:.75em; height:.75em; background:url(../img/ico_blank.svg) no-repeat 50% 50%; background-size:contain;}
.cont-item .tit .btn-link span {display:block; line-height:1.4em; font-size:.8em; color:#333; font-weight:600;}
.cont-item .desc {display:block; position:relative; line-height:1.4em; font-size:.9em; color:#666; max-height:2.8em; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2;}
.cont-item .location {display:block; clear:both; margin-top:.5em;}
.cont-item .location li {display:inline; vertical-align:middle; font-size:.9em; color:#004AB9;}
.cont-item .location li + li:before {content:""; display:inline-block; position:relative; margin-top:-1px; width:1em; height:1em; background:url(../img/ico_menu_depth2.svg) no-repeat 50% 50%; background-size:contain; vertical-align:middle;}

@media all and (max-width:1024px) {
	.cont-item .tit .subj {display:block; clear:both; max-width:100%; margin-bottom:.5em; margin-right:0;}
	.cont-item .tit .btn-link {font-size:.9em;}
}

/* Thumbnail */

.cont-item .thumb {display:block; position:absolute; top:0; right:0; width:11.75em; max-height:100%; overflow:hidden; background:#F8F8F8; z-index:0;}
.cont-item .thumb:before {content:""; display:block; position:relative; padding-top:57.4468%; z-index:-1;}
.cont-item .thumb:after {content:""; display:block; position:absolute; top:0; left:0; right:0; bottom:0; z-index:1; border:1px solid #D3D3D3;}
.cont-item .thumb img {display:block; position:absolute; top:50%; left:50%; min-width:100%; min-height:100%; max-width:200%; max-height:200%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); z-index:0;}
.cont-item .thumb img[src*="noimage"] {max-width:70%; height:auto; min-width:0; min-height:0;}
.cont-item .thumb ~ * {margin-right:13.25em;}
.cont-item .thumb ~ .tit {padding-top:.7em; margin-bottom:.7em;}
.cont-item .thumb ~ .desc {height:2.8em; margin-right:14.72em; margin-bottom:1em;}
@media all and (max-width:1024px) {
	.cont-item .thumb {position:relative; top:auto; right:auto; width:auto; margin-bottom:1.5em;}
	.cont-item .thumb ~ * {margin-right:0 !important;}
	.cont-item .thumb ~ .tit {padding-top:0;}
	.cont-item .thumb ~ .desc {margin-bottom:0;}
}

/* Title Icon */
.cont-item .tit .icon {display:inline-block; vertical-align:middle; margin-right:.5em; width:1.5em; height:1.5em; text-indent:-999px; overflow:hidden; background:url(../img/ico_file_etc.svg) no-repeat 50% 50%; background-size:contain;}
.cont-item .tit .icon.doc {background-image:url(../img/ico_file_doc.svg);}
.cont-item .tit .icon.hwp {background-image:url(../img/ico_file_hwp.svg);}
.cont-item .tit .icon.pdf {background-image:url(../img/ico_file_pdf.svg);}
.cont-item .tit .icon.zip {background-image:url(../img/ico_file_zip.svg);}
.cont-item .tit .icon.ppt {background-image:url(../img/ico_file_ppt.svg);}
.cont-item .tit .icon.txt {background-image:url(../img/ico_file_txt.svg);}
.cont-item .tit .icon.xls {background-image:url(../img/ico_file_xls.svg);}
.cont-item .tit .icon.jpg {background-image:url(../img/ico_file_jpg.svg);}
.cont-item .tit .icon.png {background-image:url(../img/ico_file_png.svg);}
.cont-item .tit .icon.gif {background-image:url(../img/ico_file_gif.svg);}
.cont-item .tit .icon.img {background-image:url(../img/ico_file_img.svg);}

.cont-item .tit .icon.X {background-image:url(../img/ico_sns_x.svg);}
.cont-item .tit .icon.twitter {background-image:url(../img/ico_sns_twitter.svg);}
.cont-item .tit .icon.facebook {background-image:url(../img/ico_sns_facebook.svg);}
.cont-item .tit .icon.blog {background-image:url(../img/ico_sns_blog.svg);}

@media all and (max-width:1024px) {
	.cont-item .tit .icon {position:absolute; top:0; left:0;}
	.cont-item .tit .icon ~ .subj {margin-left:2em;}
}

/* Grid */
@media all and (min-width:1025px) {
	.contentList.col-pc-5 > li {width:20%;}
	.contentList.col-pc-4 > li {width:25%;}
	.contentList.col-pc-3 > li {width:33.33%;}
	.contentList.col-pc-2 > li {width:50%;}
	.contentList.col-pc-1 > li {width:100%;}

	.contentList[class*="col-pc"] {margin:-.6em; overflow:hidden;}
	.contentList[class*="col-pc"] > li {float:left; padding:.6em;}
	.contentList[class*="col-pc"] > li + li {margin-top:0;}	

	.contentList[class*="col-pc"] .cont-item .btn-link {display:block; position:absolute; top:0; left:0; right:0; bottom:0; z-index:2; border:none; padding:0; border-radius:0; text-indent:-999px; background:none;}
	.contentList[class*="col-pc"] .cont-item .btn-link:after {display:none;}
	.contentList[class*="col-pc"] .cont-item .thumb {position:relative; top:auto; right:auto; width:auto; margin-bottom:1em;}
	.contentList[class*="col-pc"] .cont-item .thumb ~ * {margin-right:0 !important;}
	.contentList[class*="col-pc"] .cont-item .thumb ~ .tit {padding-top:0; margin-bottom:.5em;}
	.contentList[class*="col-pc"] .cont-item .thumb ~ .desc {margin-bottom:0;}

	.contentList.col-pc-3,
	.contentList.col-pc-2,
	.contentList.col-pc-1 {margin:-1em;}
	.contentList.col-pc-3 > li,
	.contentList.col-pc-2 > li,
	.contentList.col-pc-1 > li {padding:1em;}
}
@media all and (max-width:1024px) and (min-width:581px) {
	.contentList.col-ta-5 > li {width:20%;}
	.contentList.col-ta-4 > li {width:25%;}
	.contentList.col-ta-3 > li {width:33.33%;}
	.contentList.col-ta-2 > li {width:50%;}
	.contentList.col-ta-1 > li {width:100%;}

	.contentList[class*="col-ta"] {margin:-.6em; overflow:hidden;}
	.contentList[class*="col-ta"] > li {float:left; padding:.6em;}
	.contentList[class*="col-ta"] > li + li {margin-top:0;}	

	.contentList[class*="col-ta"] .cont-item .btn-link {display:block; position:absolute; top:0; left:0; right:0; bottom:0; z-index:2; border:none; padding:0; border-radius:0; text-indent:-999px; background:none;}
	.contentList[class*="col-ta"] .cont-item .btn-link:after {display:none;}
	.contentList[class*="col-ta"] .cont-item .thumb {position:relative; top:auto; right:auto; width:auto; margin-bottom:1em;}
	.contentList[class*="col-ta"] .cont-item .thumb ~ * {margin-right:0 !important;}
	.contentList[class*="col-ta"] .cont-item .thumb ~ .tit {padding-top:0; margin-bottom:.5em;}
	.contentList[class*="col-ta"] .cont-item .thumb ~ .desc {margin-bottom:0;}

	.contentList.col-ta-3,
	.contentList.col-ta-2,
	.contentList.col-ta-1 {margin:-.7em;}
	.contentList.col-ta-3 > li,
	.contentList.col-ta-2 > li,
	.contentList.col-ta-1 > li {padding:.7em;}
}
@media all and (max-width:580px) {
	.contentList.col-mo-5 > li {width:20%;}
	.contentList.col-mo-4 > li {width:25%;}
	.contentList.col-mo-3 > li {width:33.33%;}
	.contentList.col-mo-2 > li {width:50%;}
	.contentList.col-mo-1 > li {width:100%;}

	.contentList[class*="col-mo"] {margin:-.6em; overflow:hidden;}
	.contentList[class*="col-mo"] > li {float:left; padding:.6em;}
	.contentList[class*="col-mo"] > li + li {margin-top:0;}	

	.contentList[class*="col-mo"] .cont-item .btn-link {display:block; position:absolute; top:0; left:0; right:0; bottom:0; z-index:2; border:none; padding:0; border-radius:0; text-indent:-999px; background:none;}
	.contentList[class*="col-mo"] .cont-item .btn-link:after {display:none;}
	.contentList[class*="col-mo"] .cont-item .thumb {position:relative; top:auto; right:auto; width:auto; margin-bottom:1em;}
	.contentList[class*="col-mo"] .cont-item .thumb ~ * {margin-right:0 !important;}
	.contentList[class*="col-mo"] .cont-item .thumb ~ .tit {padding-top:0; margin-bottom:.5em;}
	.contentList[class*="col-mo"] .cont-item .thumb ~ .desc {margin-bottom:0;}

	.contentList.col-mo-3,
	.contentList.col-mo-2,
	.contentList.col-mo-1 {margin:-1em -.5em;}
	.contentList.col-mo-3 > li,
	.contentList.col-mo-2 > li,
	.contentList.col-mo-1 > li {padding:1em .5em;}
}

/***************************************
	Side Area : Rank list
****************************************/

.sideList section {display:block; position:relative; padding:2.25em 0 2em; border-bottom:1px solid #D3D3D3;}
.sideList section .control {position:absolute; top:2.25em; right:0;}
.sideList section .control > * {width:1.5em; height:1.5em; float:left; background:no-repeat 50% 50%; margin:0 0.15em; text-indent:-9999px; background-size:1.5em auto;}
.sideList section .control .prev {background-image:url(../img/ico_prev.svg);}
.sideList section .control .next {background-image:url(../img/ico_next.svg);}
.sideList section h3 {display:block; position:relative; margin-bottom:1em;}
.sideList section h3 strong {display:block; position:relative; font-size:1.3em; line-height:1.1em; font-family:'OneMobileTitle', Helvetica, Arial, sans-serif; font-weight:500 !important;}

@media all and (max-width:1024px) and (min-width:641px) {
	.sideList {margin:-2em -1.3em 0;}
	/*.sideList:before {content:""; display:block; position:absolute; top:2.5em; bottom:2.5em; left:55%; width:1px; background:#ddd;}*/
	.sideList section {width:50%; float:left; padding:2.5em 1.3em; border:none;}
	.sideList section + section + section {padding-top:0;}
	.sideList section .control {right:1em;}
}
@media all and (max-width:640px) {
	.sideList {margin-top:-2.5em;}
	.sideList:before {display:none;}
	.sideList section {border-bottom-width:0;}
	.sideList section + section {border-top:1px solid #D3D3D3;}
}

/* Tab Style */

.sideList .tab-list {display:block; position:relative; padding-top:3.2em;}
.sideList .tab-list > li > button {display:block; position:absolute; top:0; left:0; width:25%; height:1.7em; border-radius:3px 3px 0 0; border:1px solid #D3D3D3;}
.sideList .tab-list > li > button span {display:block; position:relative; font-size:.8em; color:#666; font-weight:600;}
.sideList .tab-list > li.active > button {border-color:#000; border-bottom-color:transparent;}
.sideList .tab-list > li.active > button span {color:#000;}
.sideList .tab-list > li + li > button {left:25%;}
.sideList .tab-list > li + li + li > button {left:50%;}
.sideList .tab-list > li + li + li + li > button {left:75%;}
.sideList .tab-list > li > ul {display:none;}
.sideList .tab-list > li.active > ul {display:block;}

.sideList .tab-list.topic > li > button {width:33.3333%;}
.sideList .tab-list.topic > li + li > button {left:33.3333%;}
.sideList .tab-list.topic > li + li + li > button {left:66.6666%;}

/* Rank List */

.rank-list li + li {margin-top:.5em;}

/* Rank Item */
.rank-item {display:table; width:100%; table-layout:fixed;}
.rank-item > * {display:table-cell; vertical-align:middle;}

.rank-item .num {border-radius:3px; border:1px solid #BFC2CA; color:#666; text-align:center; font-size:.75em; width:1.47em; height:1.47em; font-family:'Kanit', 'Pretendard', sans-serif;}
.tab-list .rank-list > li:first-child .rank-item .num {background:#1C1F85; border-color:#1C1F85; color:#fff;}
.tab-list .rank-list > li:first-child + li .rank-item .num {background:#3437A0; border-color:#3437A0; color:#fff;}
.tab-list .rank-list > li:first-child + li + li .rank-item .num {background:#5A5DC2; border-color:#5A5DC2; color:#fff;}
.rank-item .subj {font-size:.8em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#000;}
.rank-item .num + .subj {padding-left:.8em;}
.rank-item .mod {font-size:.75em; width:2.5em; text-align:center;}
.rank-item .mod.new {text-indent:-9999px; overflow:hidden; background:url(../img/ico_new.svg) no-repeat 50% 50%; background-size:auto 1em; text-align:left; color:#C0C0C0;}
.rank-item .mod.up,
.rank-item .mod.down {color:#000; line-height:1.2em;}
.rank-item .mod.up:before,
.rank-item .mod.down:before {content:""; display:inline-block; width:.6667em; height:1em; vertical-align:middle; margin-right:.2em; background:no-repeat 50% 0; background-size:contain;}
.rank-item .mod.up:before {background-image:url(../img/ico_up.svg);}
.rank-item .mod.down:before {background-image:url(../img/ico_down.svg);}
.rank-item .del {width:1.8em; text-indent:-999px; overflow:hidden; background:url(../img/btn_del.svg) no-repeat 50% 50%; background-size:.6em auto;}

.topic .rank-list .rank-item .num {border:1px solid #BFC2CA !important; background:#fff !important; color:#666 !important;}
.topic.tabBox.hide {display:none;}

/* Site Link */

.relation-list li {display:Block; position:relative; padding-left:1em;}
.relation-list li:before {content:""; display:block; position:absolute; width:.25em; height:.25em; border-radius:1px; background:#FF0000; left:0; top:.625em; margin-top:-.125em;}
.relation-list li + li {margin-top:.25em;}
.relation-list li a {display:block; position:relative; line-height:1.25em;}
.relation-list li a span {font-size:.9em; color:#000;}
