/* common title */
h2.heading { position:relative; display:inline-block; max-width:100%; line-height: 1; margin-right:1rem; margin-bottom:1.25rem; font-size:1.3rem; font-weight:600; color:#000; }
h2.heading > span { display:block; white-space:nowrap;overflow:hidden; }

/* 메인비주얼 */
.TC01_visual { position:relative; height:100%; border-bottom-right-radius:4rem; background:rgba(0,0,0,.1); overflow:hidden; }
.TC01_visual .slider { height:100%; overflow:hidden; }
.TC01_visual .slick-list,
.TC01_visual .slick-track { height:100%; }
.TC01_visual .item { height:100%; line-height:0; overflow:hidden; }
.TC01_visual .item img { position:relative; left:50%; width:auto; max-height:100%; -webkit-transform:translateX(-50%); transform:translateX(-50%); }
.TC01_visual .control { position:absolute; right:0; bottom:0; padding:0 1.5rem; line-height:3.5rem; z-index:1; background:#fff; border-top-left-radius:1.5rem; text-align:center; }
.TC01_visual .control > a { position:relative; display:inline-block; vertical-align:middle; font-size:1.1rem; color:#222; -webkit-transition:all 0.15s; transition:all 0.15s; }
.TC01_visual .control > a.play { display:none; color:#415b65; }
.TC01_visual .control > a.stop,
.TC01_visual .control > a.play { width:1.7rem; height:1.7rem; margin-left:0.25rem; background:#eae8e8; border-radius:50%; line-height:1.7rem; } 
.TC01_visual .control p { display:inline-block; padding:0 .5rem; vertical-align:middle; font-family:'Montserrat'; font-size:1rem; color:#555; font-weight:400; }
.TC01_visual .control p strong { position:relative; padding-right:2rem; color:#5665b6; font-weight:700; }
.TC01_visual .control p strong:after { position:absolute; top:50%; right:1rem; width:1px; height:11px; background:#c1c1c1; content:""; -webkit-transform:translateY(-50%); transform:translateY(-50%); }
/** 메인비주얼 :active **/
.TC01_visual .control > a:hover { color:#5665b6; }
.TC01_visual .control > a.stop:hover,
.TC01_visual .control > a.play:hover { background:#5665b6; color:#fff; }

/* 바로가기1 */
.TC01_link01 { position:relative; width:100%; height:100%; background: #003b79; padding: 2.5rem; padding-left: 41rem; border-radius:0 10rem 10rem 10rem; }
.TC01_link01 a { display:block; width:11rem; height:6rem; }
.TC01_link01 a:nth-of-type(n + 2) { display:none; }
.TC01_link01 h2.heading{position: relative; display: block; padding-right: 2rem; margin-right: 0;}
.TC01_link01 h2.heading > span{color: #fff;}
.TC01_link01 h2.heading:before { content: "\e93f"; font-family: 'xeicon'; display: flex; justify-content: center; align-items: center; font-size: 1.3rem; font-weight: 500; color: #fff; background: #002954; position:absolute; right: 0; top: 50%; width:2rem; height:2rem; z-index:1; -webkit-transition:all 0.15s; transition:all 0.15s; border-radius: 50%; transform: translateY(-50%);}
.TC01_link01 a p { position:relative; padding-right: 5.3rem; color: #fff; }
.TC01_link01 a .img{position: absolute; bottom: 2.5rem; right: 2rem;}
.TC01_link01 a .img img { display:block; }
/** 바로가기1 :active **/
.TC01_link01 a:hover p:before { left:0.9rem; }

/* 시설물 검색 */
.TC01_search { position:relative; width:100%; height:100%; max-height: 11rem; background: #017342; padding: 2.5rem 3rem; border-radius: 0 10rem 10rem 10rem; }
.TC01_search h2.heading > span{color: #fff;}
.TC01_search .search_wrap { position:relative; width:100%; }
.TC01_search .search_wrap .inner { width:100%; height:3.5rem; border-radius:5rem; background:#fff; overflow:hidden; }
.TC01_search .search_wrap .inner select { float:left; width:10rem; height:100%; padding:0 2.5rem 0 1rem; border:none; border-radius:0.75rem 0 0 0.75rem; font-size:0.8rem; color:#000; background: #fff url(/images/po/template/TC01/main/select_arr.png) no-repeat; background-position-x: calc(100% - 0.5rem); background-position-y: center; -webkit-appearance: none; -moz-appearance: none; appearance: none; }
.TC01_search .search_wrap .inner input { float:left; width:calc(100% - 10rem); height:100%; padding:0 7rem 0 0.75rem; color:#000; font-size:0.8rem; border:none; border-radius:0 0.75rem 0.75rem 0; }
.TC01_search .search_wrap .inner input::-webkit-input-placeholder { color:#a09d9d; }
.TC01_search .search_wrap .inner input::placeholder { color:#a09d9d; }

.TC01_search .search_wrap .inner {
	position:relative;
}
.TC01_search .search_wrap .inner > a.inputDel {
	position:absolute;
	right:90px;
	top:25px;
	display:block;
}

.TC01_search .search_wrap button { position:absolute; top:50%; right:0; width:4rem; height:4rem; border-radius:50%; background:#f4781f; transform: translateY(-50%); }
.TC01_search .search_wrap button:before {content: "\e97a"; font-family: 'xeicon'; font-size: 2rem; color: #fff; display: block; position:absolute; top:50%; left:50%; -webkit-transform:translate(-50%, -50%); transform:translate(-50%, -50%); -webkit-transition:all 0.15s; transition:all 0.15s; }
/** 시설물 검색 :active **/
.TC01_search .search_wrap button:hover:before { top:calc(50% - 3px); }

/* 시설물 현황 */ 
.TC01_facility { text-align:center; }
.TC01_facility h2.heading { margin-right:0 ; }
.TC01_facility .list_box { margin-top:2.25rem; }
.TC01_facility .list_box > ul { overflow:hidden; margin:-1.25rem; }
.TC01_facility .list_box > ul > li { width:25%; float:left; padding:1.25rem; }
.TC01_facility .list_box > ul > li > div { position:relative; width:100%; height:27.5rem; background:#fff; border-radius:1rem; box-shadow:0 0 6px rgba(42,42,42,0.16); -webkit-transition:all 0.15s; transition:all 0.15s; }
.TC01_facility .list_box > ul > li > div:before { content:""; position:absolute; top:0; left:0; width:100%; height:100%; border-radius:1rem; background:url(/images/po/template/TC01/main/bg_01.png); z-index:-1; opacity:0; -webkit-transition:all 0.15s; transition:all 0.15s; }
.TC01_facility .list_box > ul > li > div > .img { position:relative; display:block; width:100%; height:10.4rem; overflow:hidden; z-index:1; border-radius:1rem 1rem 0 1rem; background-color:rgba(0,0,0,0.1); }
.TC01_facility .list_box > ul > li > div > .img:before { content:"\e913"; position:absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width:3rem; height:3rem; line-height:3rem; background:#017342; color:#fff; border-radius:50%; font-family:"xeicon"; font-size:1.2rem; z-index:1; opacity:0; -webkit-transition:all 0.15s; transition:all 0.15s; z-index: 2;}
.TC01_facility .list_box > ul > li > div > .img:after{content: ''; display: block; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: rgba(1, 115, 66, 0.3); z-index: 1; opacity: 0; transition: all 0.15s;}  
.TC01_facility .list_box > ul > li > div > .img > img { position:absolute; display:block; top:50%; left:50%; width:100%; height:auto; -webkit-transform:translate(-50%, -50%); transform:translate(-50%, -50%); -webkit-transition:all 0.15s; transition:all 0.15s; }
.TC01_facility .list_box > ul > li > div .info { padding:1.15rem 1.4rem; }
.TC01_facility .list_box > ul > li > div .info > ul { margin:-0.1rem; }
.TC01_facility .list_box > ul > li > div .info > ul > li { padding:0.1rem; overflow:hidden; text-align:left; letter-spacing:-1px; }
.TC01_facility .list_box > ul > li > div .info > ul > li > strong { position:relative;  display:inline-block; width:4.5rem; vertical-align:top; padding-left:0.5rem; font-weight:500; font-size:0.75rem; color: #000;}
.TC01_facility .list_box > ul > li > div .info > ul > li > strong:before { content:""; position:absolute; top:50%; left:0; width:0.2rem; height:0.2rem; background:#525c6e; border-radius:50%; transform: translateY(-50%);}
.TC01_facility .list_box > ul > li > div .info > ul > li > span { display:inline-block; vertical-align:top; width:calc(100% - 5rem); font-size:0.75rem; }
.TC01_facility .list_box > ul > li > div .btns { position:relative; padding:1.15rem 1.4rem; overflow:hidden; }
.TC01_facility .list_box > ul > li > div .btns:before { content:""; position:absolute; top:0; left:50%; width:calc(100% - 2.8rem); height:1px; border-top:2px dotted #cecece; -webkit-transform:translateX(-50%); transform:translateX(-50%); }
.TC01_facility .list_box > ul > li > div .btns > ul { margin:-0.25rem; }
.TC01_facility .list_box > ul > li > div .btns > ul > li { width:50%; padding:0.25rem; float:left; }
.TC01_facility .list_box > ul > li > div .btns > ul > li > a { display:flex; height:2.65rem; padding: 0 0.25rem; border-radius:0.5rem; font-weight:600; font-size:0.7rem; word-break:keep-all; color:#000; letter-spacing:-1px; background:#e3f3ec; border-width:2px; border-color:#017342; border-style:solid; align-items:center; justify-content:center;}
.TC01_facility .list_box > ul > li > div .btns > ul > li > a.not_use { color: #555; background:#f0f0f0; border-color:#f0f0f0; cursor: default;}
.TC01_facility .pager_wrap { margin-top:3.25rem; text-align:center; }
.TC01_facility .pager_wrap .pagination { display:inline-block; margin:-0.15rem; }
.TC01_facility .pager_wrap .pagination > li { float:left; padding:0.15rem; }
.TC01_facility .pager_wrap .pagination > li > a { display:inline-block; vertical-align:middle; width:2.2rem; height:2.2rem; border-radius:50%; color:#000; font-size:0.8rem; font-weight:600; line-height:2.2rem; border-color:transparent; background:transparent; }
.TC01_facility .pager_wrap .pagination > li > a.first,
.TC01_facility .pager_wrap .pagination > li > a.last { position:relative; background:#fff; line-height:calc(2.2rem - 4px); border-width:2px; border-style:solid; border-color:#d5d6d6; }
.TC01_facility .pager_wrap .pagination > li > a.first > i,
.TC01_facility .pager_wrap .pagination > li > a.last > i { -webkit-transition:all 0.15s; transition:all 0.15s; }
.TC01_facility .pager_wrap .pagination > li.active > a{ background:#017342; border-color:#017342; color:#fff; }
/** 시설물 현황 :active **/
.TC01_facility .list_box > ul > li > div .btns > ul > li > a:not(.not_use):hover { color:#017342; }
.TC01_facility .list_box > ul > li.on > div:before{ top:0.5rem; left:0.5rem; opacity:1; }
.TC01_facility .list_box > ul > li.on > div > .img:before { opacity:1; -webkit-transform:translate(-50%, -50%) rotate(180deg); transform:translate(-50%, -50%) rotate(180deg); }
.TC01_facility .list_box > ul > li.on > div > .img:after{ opacity: 1;}

/* 배너존 */
.banner_zone {line-height: 1; border-top: 1px solid #e5e5e5; background: #fff;}
.banner_zone .container {position: relative; height: 4rem; overflow: hidden;}
.banner_zone .container::after{content: ''; display: block; clear: both; }
.banner_zone h2 {float:left; margin-top: 1.5rem; width: 5rem; font-size: 0.9rem; font-weight: 700; color: #000;}
.banner_zone .bnWrap { width: calc(100% - 10rem); float:left; padding-top: 0.75rem; overflow: hidden;}
.banner_zone .bnWrap a {display: block; height: 2.5rem; line-height: 2.3rem; text-align: center; margin:0 1.5rem; overflow: hidden;}
.banner_zone .bnWrap a img {max-width: 100%; max-height: 100%; vertical-align: middle;}
.banner_zone .btn {float: right; margin-top: 1.3rem;}
.banner_zone .btn::after{content: ''; display: block; clear: both;}
.banner_zone .btn a {float: left; width: 1.4rem; height: 1.4rem; line-height:1.4rem; text-align:center; overflow: hidden; color: #7f7f7f;}

/* 페이징 : Start ********************************************************************************************************************************************************************************************************************************/
.bbs_pagerA {margin: 3rem 0 0 0; text-align: center; line-height: 0; font-size: 0;}
.bbs_pagerA a, 
.bbs_pagerA span, 
.bbs_pagerA strong { display: inline-block; margin: 0 2px; border-radius: 20px; vertical-align: middle;}
.bbs_pagerA div { display: inline-block; margin: 0 5px;}
.bbs_pagerA .bbs_arr { width: 38px; height: 38px; line-height: 38px; text-indent: -10000em; border: 1px solid #bfbfbf; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease;}
.bbs_pagerA .bbs_arr:hover, 
.bbs_pagerA .bbs_arr:focus { background-color: #f7f7f7; border-color: #b1b1b1;}
.bbs_pagerA .bbs_arr.pgeL1:hover, 
.bbs_pagerA .bbs_arr.pgeL1:focus, 
.bbs_pagerA .bbs_arr.pgeL2:hover, 
.bbs_pagerA .bbs_arr.pgeL2:focus { background-position: -3px center;}
.bbs_pagerA .bbs_arr.pgeR1:hover, 
.bbs_pagerA .bbs_arr.pgeR1:focus, 
.bbs_pagerA .bbs_arr.pgeR2:hover, 
.bbs_pagerA .bbs_arr.pgeR2:focus { background-position: 3px center;}
.bbs_pagerA .pgeL1 { background: url('/resource/images/board/bbs_PAarrL1.png') no-repeat center #fff;}
.bbs_pagerA .pgeL2 { background: url('/resource/images/board/bbs_PAarrL2.png') no-repeat center #fff;}
.bbs_pagerA .pgeR1 { background: url('/resource/images/board/bbs_PAarrR1.png') no-repeat center #fff;}
.bbs_pagerA .pgeR2 { background: url('/resource/images/board/bbs_PAarrR2.png') no-repeat center #fff;}
.bbs_pagerA .bbs_pge_num { min-width: 40px; height: 40px; line-height: 40px; font-size: 15px;}
.bbs_pagerA .bbs_pge_num:hover, 
.bbs_pagerA .bbs_pge_num:focus { color: #555; background: #ededed;}
.bbs_pagerA strong.bbs_pge_num, 
.bbs_pagerA strong.bbs_pge_num:hover, 
.bbs_pagerA strong.bbs_pge_num:focus { color: #fff; font-weight: 400; background: #017342;}

/* color */
/* 페이징 : End ********************************************************************************************************************************************************************************************************************************/



@media (max-width: 1540px) { 
	/* 메인비주얼 */
	.TC01_visual .item img{width: 100%;}
}
@media (max-width: 1420px) { 
	h2.heading{font-size: 1.2rem;}

	/* 메인비주얼 */
	.TC01_visual .control{right: 2rem;}

	/* 바로가기 */
	.TC01_link01{padding: 1.5rem; padding-left: 40rem; border-radius: 0 3rem 3rem 3rem;}

	/* 시설물검색 */
	.TC01_search{height: 9rem; padding: 1.5rem 2rem; border-radius: 0 3rem 3rem 3rem;}
}
@media (max-width:1280px) {
	
	/* 시설물 현황 */
	.TC01_facility .list_box > ul > li { width:33.333%; }
}

@media (max-width:1240px) {
	/* 메인비주얼 */
	.TC01_visual .control{right: 0;}
	
}


@media (max-width:1070px) {
	/* 메인비주얼 */
	.TC01_search{padding: 1.5rem; border-radius: 0 3rem 3rem 0;}

	/* 바로가기 */
	.TC01_link01{padding-left: calc(65% + 1rem); border-radius: 0;}
	.TC01_link01 a{width: auto;}
	.TC01_link01 a p{padding-right: 4.3rem;}

}

@media (max-width:950px) { 
	/* common title */
	h2.heading { font-size:1rem; }
	
	/* 메인비주얼 */
	.TC01_visual .control { line-height:2.75rem; }
	.TC01_visual .control > a { font-size:1rem; }
	.TC01_visual .control > a.stop, 
	.TC01_visual .control > a.play { width:1.5rem; height:1.5rem; line-height:1.5rem; }
	.TC01_visual .control p { font-size:0.8rem; }
	.TC01_visual .control p strong { padding-right:1.5rem; }
	.TC01_visual .control p strong:after { right:0.75rem; }

	/* 시설물 검색 */
	.TC01_search .search_wrap .inner{height: 2.8rem;}
	.TC01_search .search_wrap .inner input{padding: 0 3rem 0 0.75rem;}
	.TC01_search .search_wrap button{width: 3rem; height: 3rem; }
	.TC01_search .search_wrap button:before{font-size: 1.3rem;}
	
	/* 시설물 현황 */
	.TC01_facility .list_box{margin-top: 0;}
	.TC01_facility .list_box > ul { margin:-0.75rem; }
	.TC01_facility .list_box > ul > li { width:50%; padding:0.75rem; }
}

@media screen and (max-width: 800px) {
    /* 페이징 : Start ********************************************************************************************************************************************************************************************************************************/ 
	/*
	.bbs_pagerA .bbs_pge_num {
        display:none;
    }
    .bbs_pagerA strong.bbs_pge_num, .bbs_pagerA strong.bbs_pge_num:hover, .bbs_pagerA strong.bbs_pge_num:focus {
        display: inline-block;
        min-width: auto;
        color: #044ca4;
        background: none;
    }
	*/

    .bbs_pagerA strong.bbs_pge_num, .bbs_pagerA strong.bbs_pge_num:hover, .bbs_pagerA strong.bbs_pge_num:focus {
        color: #fff;
    }

    /* color */
    .bbs_pagerA div a.bbs_pge_num:last-child {
        display: inline-block;
        min-width: auto;
        padding-left: 15px;
        background: url('/resource/images/board/bbs_pgeNum_mb.png') no-repeat 4px center;
    }

    /* 페이징 : End ********************************************************************************************************************************************************************************************************************************/
}


@media (max-width:768px) { 

	/* 바로가기 */
	.TC01_link01{padding: 1rem;}
	.TC01_link01 h2.heading:before{transform: none;}
	.TC01_link01 a{height: auto;}
	.TC01_link01 a p{padding-right: 0;}
	.TC01_link01 a .img img{display: none;}

	/* 시설물 검색 */
	.TC01_search{height: auto; padding: 1rem; border-radius: 0;}
	
	/* 시설물 현황 */
	.TC01_facility .pager_wrap .pagination > li > a { width:2rem; height:2rem; line-height:2rem; }
	.TC01_facility .pager_wrap .pagination > li > a.first, 
	.TC01_facility .pager_wrap .pagination > li > a.last { line-height:calc(2rem - 4px); }
	
	/* 배너존 */
	.banner_zone h2 { display:none; }
	.banner_zone .bnWrap { width:calc(100% - 6.5rem); }
}
@media (max-width:640px) { 
	
	/* 메인비주얼 */
	.TC01_visual .control { padding:0 1rem; }

	
	/* 시설물 현황 */
	.TC01_facility h2.heading:after { width:4rem; height:4rem; }
	.TC01_facility .list_box > ul > li { width:100%; }
	.TC01_facility .list_box > ul > li > div { height:auto; }
}

@media (max-width:540px) { 
	
}

@media (max-width:480px) { 
	
	/* 시설물 검색 */
	.TC01_search .search_wrap .inner { height:auto; border:0; border-radius: 0; background: none; }
	.TC01_search .search_wrap .inner select { width:100%; height:3rem; border-radius:1rem; }
	.TC01_search .search_wrap .inner input { width:100%; height:3rem; margin-top:0.5rem; padding-right:4.25rem; border-radius:1rem; }
	.TC01_search .search_wrap button { top:auto; bottom:0; right:0; border-radius:0; border-radius:0 1rem 1rem 0; transform: none;}
	.TC01_facility .pager_wrap { margin-top:2rem; }
}

@media (max-width:380px) { 
	
	/* 메인비주얼 */
	.TC01_visual .control { line-height:2.5rem; }
	
}