@charset "utf-8";

/***************************************
	Common Search Style
****************************************/

.resultContent * {word-break:keep-all; color:#333;}
.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:0 0 1.153847em; font-family:'OneMobileTitle', Helvetica, Arial, sans-serif;}
.resultContent h3 strong {font-size:1.3em; font-weight:500 !important;}
.resultContent h3 span {margin-left:1em; color:#000; font-weight:500;}
.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 {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:0.45em 1.25em; 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:50%; padding:.5em 0;}	
}
@media all and (max-width:320px) {
	.totalList li {width:auto; float:none;}	
}


/* Quick Style */
.totalSearch_golink {margin-top:1.3em;}
.quickLink {display:block; position:relative; min-height:2.3em; padding-left:7.5em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.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-size:1.8em; font-weight:800; margin-bottom:.83em;}
.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;}
}


/* Tour */

.tourTabList {display: block; position: relative; padding: 0.45em 1.25em; border: 1px solid #D3D3D3; background:#FAFBFD;}
.tourTabList:after {content: ""; display: block; clear: both;}
.tourTabList li {display: block; position: relative; width: 25%; float: left; padding: .75em 0;}

.tourTabList li i.ico-regCate{display: block; position: absolute; left:0; top:.2em; width: 2em; height: 2em; border-radius: 100%; text-indent: -999px; overflow: hidden; background: linear-gradient(90deg, rgba(0, 82, 173, 1) 0%, rgba(246, 105, 70, 1) 100%);}

.ico-regCate:before {content:""; display:block; position:absolute; top:0; left:0; right:0; bottom:0; background:no-repeat 50% 50%; background-size:2.75em auto;}
.ico-regCate[data-cate=""],
.ico-regCate:not([data-cate]) {display:none !important;}
.ico-regCate[data-cate="전체"]:before {background-image:url(../img/ico_tour_01.svg);}
.ico-regCate[data-cate*="산/산성"]:before {background-image:url(../img/ico_tour_02.svg);}
.ico-regCate[data-cate*="호수"]:before {background-image:url(../img/ico_tour_03.svg);}
.ico-regCate[data-cate*="공원"]:before {background-image:url(../img/ico_tour_04.svg);}
.ico-regCate[data-cate*="사찰"]:before {background-image:url(../img/ico_tour_05.svg);}
.ico-regCate[data-cate*="성지"]:before {background-image:url(../img/ico_tour_06.svg);}
.ico-regCate[data-cate*="미륵/탑"]:before {background-image:url(../img/ico_tour_07.svg);}
.ico-regCate[data-cate*="묘/고루비"]:before {background-image:url(../img/ico_tour_08.svg);}
.ico-regCate[data-cate*="향교/객사/고택"]:before {background-image:url(../img/ico_tour_09.svg);}
.ico-regCate[data-cate*="박물관/문학관"]:before {background-image:url(../img/ico_tour_10.svg);}
.ico-regCate[data-cate*="농촌체험마을"]:before {background-image:url(../img/ico_tour_11.svg);}
.ico-regCate[data-cate*="골프장"]:before {background-image:url(../img/ico_tour_12.svg);}
.ico-regCate[data-cate*="승마장"]:before {background-image:url(../img/ico_tour_13.svg);}
.ico-regCate[data-cate*="수상스포츠"]:before {background-image:url(../img/ico_tour_14.svg);}
.ico-regCate[data-cate*="체육시설"]:before {background-image:url(../img/ico_tour_15.svg);}
.ico-regCate[data-cate*="휴양림"]:before {background-image:url(../img/ico_tour_16.svg);}
.ico-regCate[data-cate*="캠핑장"]:before {background-image:url(../img/ico_tour_17.svg);}
.ico-regCate[data-cate*="둘레길"]:before {background-image:url(../img/ico_tour_18.svg);}
.ico-regCate[data-cate*="문화/공연장"]:before {background-image:url(../img/ico_tour_19.svg);}
.ico-regCate[data-cate*="기타(추천명소)"]:before {background-image:url(../img/ico_tour_20.svg);}


.tourTabList li span {display:block; font-size: .9em; margin-left: 2.75em; font-weight: 500;}

.tourTabList li.on span {color:#1C1F85; font-weight: 600;} 


.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; color:#222;}
.tourArea h3 span {margin-left:0;}
.tourArea .tit h3 {display:inline-block; vertical-align:middle;}
.tourArea .btn-link {display:inline-block; position:relative; margin-top:-0.25em; margin-left:1em; vertical-align:top; border:1px solid #D3D3D3; border-radius:2px; color:#333; padding:.38em 2em .34em .75em;}
.tourArea .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;}
.tourArea .btn-link span {display:block; line-height:1.4em; font-size:0.8em; color:#333; font-weight:600;}
.tourArea .txt {display:block; position:relative; color:#555; line-height:1.3em; margin-bottom:1em; font-size:.8em;}
.tourArea .gallery {margin:0; padding:.25em; overflow:hidden;}
.tourArea .gallery > li {width:33.33%; float:left; padding:.25em;}
.tourArea .gallery .thumb,
.tourArea .gallery .thumb:after {border-radius:0;}

.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 {display:table; width:100%; table-layout:fixed;}
.tourArea .info li > * {display:table-cell; vertical-align:top; padding:.4em 0; font-size:.8em; min-height:1.5em; line-height:1.3em;}
.tourArea .info li strong {color:#222; width:4.2em; font-weight:800;}
.tourArea .info li span {Color:#555;}

.tourArea .desc {display:block; position:relative; float:right; width:56.35%; background:#fff; padding:1.5em; border-radius:.75em;}

@media all and (max-width:840px) {

	.tourTabList li {width: 33.3333%;}

	.tourArea .thumb {max-width:20em; margin-left:auto; margin-right:auto; margin-bottom:1em;}
	.tourArea .visual,
	.tourArea .desc {float:none; width:auto;} 
	.tourArea .desc {padding:1em;}
}
@media all and (max-width:640px) {
	.tourTabList li {width: 50%;}

	.tourArea  {padding:.5em;}
}
@media all and (max-width:580px) {
	.tourArea .gallery > li {width:auto; float:none;}
	.tourArea .gallery .thumb {max-width:15em; margin-left:auto; margin-right:auto;}
}

/* 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:1.5em 0;}}

.resultBox .more {display:block; position:absolute; top:1.85em; 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:1.5em; 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 em {color:#333333; margin-right:.75em; font-weight:600;}
.menuList li a em:before {content:"[";}
.menuList li a em: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:5em;}
	.work-item .name {width:5em;}
	.work-item .tel {width:9.5em;}
	.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 .depart strong, .work-item .depart span {display:inline-block;}
	.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; font-size:1.111112em;}
	.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;}	
}


/***************************************
	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:60%;}
.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 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:55%; float:left; padding:2.5em 1.3em; border:none;}
	.sideList section + section {width:45%;}
	.sideList section + section + section {padding-top:0;}
}
@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:#1C1F85; border-bottom-color:transparent;}
.sideList .tab-list > li.active > button span {color:#1C1F85;}
.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;}

/* 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;}

/* 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;}

