@charset "utf-8";


/************************************
common Custom
************************************/

/* COMMON MARGIN */
.mg_t0{margin-top:0 !important;}
.mg_t5{margin-top:5px !important;}
.mg_t10{margin-top:10px !important;}
.mg_t15{margin-top:15px !important;}
.mg_t20{margin-top:20px !important;}
.mg_t25{margin-top:25px !important;}
.mg_t30{margin-top:30px !important;}
.mg_t35{margin-top:35px !important;}
.mg_t40{margin-top:40px !important;}
.mg_t45{margin-top:45px !important;}
.mg_t50{margin-top:50px !important;}
.mg_t60{margin-top:60px !important;}
.mg_t70{margin-top:70px !important;}
.mg_t80{margin-top:80px !important;}
.mg_t90{margin-top:90px !important;}
.mg_t100{margin-top:100px !important;}

.mg_b0{margin-bottom:0 !important;}
.mg_b5{margin-bottom:5px !important;}
.mg_b10{margin-bottom:10px !important;}
.mg_b15{margin-bottom:15px !important;}
.mg_b20{margin-bottom:20px !important;}
.mg_b25{margin-bottom:25px !important;}
.mg_b30{margin-bottom:30px !important;}
.mg_b40{margin-bottom:40px !important;}
.mg_b45{margin-bottom:45px !important;}
.mg_b50{margin-bottom:50px !important;}
.mg_b60{margin-bottom:50px !important;}
.mg_b70{margin-bottom:70px !important;}
.mg_b80{margin-bottom:80px !important;}

.mg_r0{margin-right:0 !important;}
.mg_r5{margin-right:5px !important;}
.mg_r10{margin-right:10px !important;}
.mg_r20{margin-right:20px !important;}
.mg_r30{margin-right:30px !important;}
.mg_r40{margin-right:40px !important;}
.mg_r50{margin-right:50px !important;}
.mg_r60{margin-right:60px !important;}
.mg_r70{margin-right:70px !important;}
.mg_r80{margin-right:80px !important;}

.mg_l0{margin-left:0 !important;}
.mg_l10{margin-left:10px !important;}
.mg_l20{margin-left:20px !important;}
.mg_l30{margin-left:30px !important;}
.mg_l40{margin-left:40px !important;}

/* COMMON PADDING */
.pd_none{padding: 0;}
.pd_a20{padding:20px !important;}

.pd_t10{padding-top:10px !important;}
.pd_t15{padding-top:15px !important;}
.pd_t20{padding-top:20px !important;}
.pd_t30{padding-top:30px !important;}
.pd_t40{padding-top:40px !important;}
.pd_t45{padding-top:45px !important;}
.pd_t50{padding-top:50px !important;}
.pd_t150{padding-top:150px !important;}

.pd_b10{padding-bottom:10px !important;}
.pd_b15{padding-bottom:15px !important;}
.pd_b20{padding-bottom:20px !important;}
.pd_b30{padding-bottom:30px !important;}
.pd_b40{padding-bottom:40px !important;}
.pd_b45{padding-bottom:45px !important;}
.pd_b50{padding-bottom:50px !important;}
.pd_b150{padding-bottom:150px !important;}

.pd_l10{padding-left:10px !important;}
.pd_l20{padding-left:20px !important;}
.pd_l30{padding-left:30px !important;}
.pd_l40{padding-left:40px !important;}
.pd_l45{padding-left:45px !important;}
.pd_l50{padding-left:50px !important;}

.pd_r10{padding-right:10px !important;}
.pd_r20{padding-right:20px !important;}
.pd_r30{padding-right:30px !important;}
.pd_r40{padding-right:40px !important;}
.pd_r45{padding-right:45px !important;}
.pd_r50{padding-right:50px !important;}

.bold{font-weight: 500;}

/* text-align */
.ta_c{text-align: center !important;}
.ta_l{text-align: left !important;}
.ta_r{text-align: right !important;}

/* text-align */
.fl_l{float: left !important;}
.fl_r{float: right !important;}

/* font-color */
.font-white{color: #fff !important;}
.font-black{color: #333 !important;}
.font-blue{color: #2544f3 !important;}
.font-red{color: #f55145 !important;}
.font-humangreen{color: #198194 !important;}
.font-humanblue{color:#2d96cd !important;}

/* font-size */
.font-sm{font-size:1.0em;}
.font-md{font-size:1.3em;}
.font-lg{font-size:1.5em;}
.font-xl{font-size:1.8em;}

/* background-color */
.bg-white{background: #fff !important;}
.bg-primary{background: #294f75 !important;}
.bg-blue{background: #1f4787 !important;}
.bg-mint{background: #009999 !important;}
.bg_humanblue{background:#2196F3;}
.bg_humangreen{background:#198194;}
.bg_plant{background:#31872A;}
.bg_gade{background:#008479;}
.bg_indigo{background:#555c77;}
.bg_skyblue{background:#017DB7;}
.bg_gray{background:#f3f5f7 !important;}

.blind{display:none;}
.bd-box{border: 1px solid #e7e7e7;}
.hidden-lg{display:none !important;}
.img-responsive {max-width: 100%;}
.short-box{display:inline-block;width:100%;margin: 30px 0;}
.short-box02{display:inline-block;width:100%;margin: 10px 0 30px 0;}
.dp-ib{display:inline-block !important;}
.clear{clear:both;}
.txt-hidden{display:inline-block;overflow:hidden;font-size:0;line-height:0;text-indent:-9999px;}
.font-line{text-decoration:underline;}

/* width */
.w5{width: 5% !important;}
.w10{width: 10% !important;}
.w15{width: 15% !important;}
.w20{width: 20% !important;}
.w23{width: 23% !important;}
.w25{width: 25% !important;}
.w30{width: 30% !important;}
.w32{width: 32% !important;margin-right: 1.2%;}
.w33{width: 33% !important;}
.w35{width: 35% !important;}
.w40{width: 40% !important;}
.w45{width: 45% !important;}
.w49{width: 49% !important;}
.w50{width: 50% !important;}
.w55{width: 55% !important;}
.w60{width: 60% !important;}
.w65{width: 65% !important;}
.w68{width: 68% !important;}
.w69{width: 69% !important;}
.w70{width: 70% !important;}
.w75{width: 75% !important;}
.w80{width: 80% !important;}
.w85{width: 85% !important;}
.w90{width: 90% !important;}
.w95{width: 95% !important;}
.w100{width: 100% !important;}

/******************************** btn css ************************************
**default, primary, blue, green, mint, warning, red, pink, purple, dark**
******************************************************************************/
.btn-area{text-align:center;}
.btn {cursor: pointer;background-color: transparent;color: inherit;padding: 12px;border: 1px solid transparent;font-size: 1.2em;line-height: 1.475;transition: all 0.25s;margin: 3px;}
.btn-small {cursor: pointer;background-color: transparent;color: inherit;padding: 5px 10px;border-radius: 3px;border: 1px solid transparent;font-size: 1.2em;line-height: 1.475;vertical-align: middle;transition: all 0.25s;margin:3px;}
.btn-small02 {cursor: pointer;background-color: transparent;color: inherit;padding: 5px 10px;border-radius: 3px;border: 1px solid transparent;font-size: .9em;line-height: 1.475;vertical-align: middle;transition: all 0.25s;margin: 3px;}
.btn-small03 {cursor: pointer;background-color: transparent;color: inherit;padding: 5px 10px;border-radius: 3px;border: 1px solid transparent;font-size: .9em;line-height: 1.475;vertical-align: middle;transition: all 0.25s;margin: 3px;}
.btn:not(.btn-icon) {min-width: 14.5%;}
.btn:not(.disabled):not(:disabled):hover {box-shadow: 0 3px 15px rgba(0,0,0,0.25);}
.btn-circle{border-radius: 20px;}
.btn-default, .btn-default:focus {background-color: #fff;border-color: rgba(0,0,0,0.17) !important;color: #7a878e;}
.btn-primary, .btn-primary:focus {background-color: #3f61b2;border-color: #25476a !important;color: #fff;}
.btn-blue, .btn-blue:focus {background-color: #0ab1fc;border-color: #03a9f4 !important;color: #fff;}
.btn-green, .btn-green:focus {background-color: #92c755;border-color: #8bc34a !important;color: #fff;}
.btn-mint, .btn-mint:focus {background-color: #29b2a6;border-color: #26a69a !important;color: #fff;}
.btn-warning, .btn-warning:focus {background-color: #ffb80f;border-color: #ffb300 !important;color: #fff;}
.btn-red, .btn-red:focus {background-color: #f55145;border-color: #f44336 !important;color: #fff;}
.btn-pink, .btn-pink:focus {background-color: #f1709c;border-color: #f06292 !important;color: #fff;}
.btn-purple, .btn-purple:focus {background-color: #b052c0;border-color: #ab47bc !important;color: #fff;}
.btn-dark, .btn-dark:focus {background-color: #414c57;border-color: #3a444e !important;color: #fff;}
.btn-confirm, .btn-confirm:focus {background-color: #6b7482;border-color: #45495b !important;color: #fff;}

.btn-default:hover, .btn-hover-default:hover, .btn-hover-default:active, .btn-hover-default.active, .btn-default:active, .btn-active-default.btn:active, .btn-active-default.btn.active, .btn-active-default+.dropdown-menu>li>a:hover, .btn-active-default+.dropdown-menu>li>a:focus, .btn-active-default+.dropdown-menu>.active>a, .open .dropdown-toggle.btn.btn-active-default, .btn-group.open .dropdown-toggle.btn.btn-active-default, .btn-default.active, .btn-default:disabled, .btn-default.disabled, .btn-default:not([class*="btn-active-"])+.dropdown-menu>li>a:hover, .btn-default:not([class*="btn-active-"])+.dropdown-menu>li>a:focus, .btn-default:not([class*="btn-active-"])+.dropdown-menu>.active>a, .btn-default+.dropdown-menu:not(.head-list)>li>a.active, .open>.dropdown-toggle.btn-default {background-color: #ededed !important;border-color: rgba(0,0,0,0.17) !important;color: #7a878e !important;}
/* .btn-primary:hover, .btn-hover-primary:hover, .btn-hover-primary:active, .btn-hover-primary.active, .btn-primary:active, .btn-active-primary.btn:active, .btn-active-primary.btn.active, .btn-active-primary+.dropdown-menu>li>a:hover, .btn-active-primary+.dropdown-menu>li>a:focus, .btn-active-primary+.dropdown-menu>.active>a, .open .dropdown-toggle.btn.btn-active-primary, .btn-group.open .dropdown-toggle.btn.btn-active-primary, .btn-primary.active, .btn-primary:disabled, .btn-primary.disabled, .btn-primary:not([class*="btn-active-"])+.dropdown-menu>li>a:hover, .btn-primary:not([class*="btn-active-"])+.dropdown-menu>li>a:focus, .btn-primary:not([class*="btn-active-"])+.dropdown-menu>.active>a, .btn-primary+.dropdown-menu:not(.head-list)>li>a.active, .open>.dropdown-toggle.btn-primary {background-color: #005cff !important;border-color: #1c3550 !important;color: #fff !important;}*/
.btn-primary:hover, .btn-hover-primary:hover, .btn-hover-primary:active, .btn-hover-primary.active, .btn-primary:active, .btn-active-primary.btn:active, .btn-active-primary.btn.active, .btn-active-primary+.dropdown-menu>li>a:hover, .btn-active-primary+.dropdown-menu>li>a:focus, .btn-active-primary+.dropdown-menu>.active>a, .open .dropdown-toggle.btn.btn-active-primary, .btn-group.open .dropdown-toggle.btn.btn-active-primary, .btn-primary.active, .btn-primary:disabled, .btn-primary.disabled, .btn-primary:not([class*="btn-active-"])+.dropdown-menu>li>a:hover, .btn-primary:not([class*="btn-active-"])+.dropdown-menu>li>a:focus, .btn-primary:not([class*="btn-active-"])+.dropdown-menu>.active>a, .btn-primary+.dropdown-menu:not(.head-list)>li>a.active, .open>.dropdown-toggle.btn-primary {background-color: #ffffff !important;border-color: #145193 !important;color: #145193 !important;}
.btn-blue:hover, .btn-hover-info:hover, .btn-hover-info:active, .btn-hover-info.active, .btn-blue:active, .btn-active-info.btn:active, .btn-active-info.btn.active, .btn-active-info+.dropdown-menu>li>a:hover, .btn-active-info+.dropdown-menu>li>a:focus, .btn-active-info+.dropdown-menu>.active>a, .open .dropdown-toggle.btn.btn-active-info, .btn-group.open .dropdown-toggle.btn.btn-active-info, .btn-blue.active, .btn-blue:disabled, .btn-blue.disabled, .btn-blue:not([class*="btn-active-"])+.dropdown-menu>li>a:hover, .btn-blue:not([class*="btn-active-"])+.dropdown-menu>li>a:focus, .btn-blue:not([class*="btn-active-"])+.dropdown-menu>.active>a, .btn-blue+.dropdown-menu:not(.head-list)>li>a.active, .open>.dropdown-toggle.btn-blue {background-color: #0391d1 !important;border-color: #0391d1 !important;color: #fff !important;}
.btn-green:hover, .btn-hover-success:hover, .btn-hover-success:active, .btn-hover-success.active, .btn-green:active, .btn-active-success.btn:active, .btn-active-success.btn.active, .btn-active-success+.dropdown-menu>li>a:hover, .btn-active-success+.dropdown-menu>li>a:focus, .btn-active-success+.dropdown-menu>.active>a, .open .dropdown-toggle.btn.btn-active-success, .btn-group.open .dropdown-toggle.btn.btn-active-success, .btn-green.active, .btn-green:disabled, .btn-green.disabled, .btn-green:not([class*="btn-active-"])+.dropdown-menu>li>a:hover, .btn-green:not([class*="btn-active-"])+.dropdown-menu>li>a:focus, .btn-green:not([class*="btn-active-"])+.dropdown-menu>.active>a, .btn-green+.dropdown-menu:not(.head-list)>li>a.active, .open>.dropdown-toggle.btn-green {background-color: #79af3a !important;border-color: #79af3a !important;color: #fff !important;}
.btn-mint:hover, .btn-hover-mint:hover, .btn-hover-mint:active, .btn-hover-mint.active, .btn-mint:active, .btn-active-mint.btn:active, .btn-active-mint.btn.active, .btn-active-mint+.dropdown-menu>li>a:hover, .btn-active-mint+.dropdown-menu>li>a:focus, .btn-active-mint+.dropdown-menu>.active>a, .open .dropdown-toggle.btn.btn-active-mint, .btn-group.open .dropdown-toggle.btn.btn-active-mint, .btn-mint.active, .btn-mint:disabled, .btn-mint.disabled, .btn-mint:not([class*="btn-active-"])+.dropdown-menu>li>a:hover, .btn-mint:not([class*="btn-active-"])+.dropdown-menu>li>a:focus, .btn-mint:not([class*="btn-active-"])+.dropdown-menu>.active>a, .btn-mint+.dropdown-menu:not(.head-list)>li>a.active, .open>.dropdown-toggle.btn-mint {background-color: #1f897f !important;border-color: #1f897f !important;color: #fff !important;}
.btn-warning:hover, .btn-hover-warning:hover, .btn-hover-warning:active, .btn-hover-warning.active, .btn-warning:active, .btn-active-warning.btn:active, .btn-active-warning.btn.active, .btn-active-warning+.dropdown-menu>li>a:hover, .btn-active-warning+.dropdown-menu>li>a:focus, .btn-active-warning+.dropdown-menu>.active>a, .open .dropdown-toggle.btn.btn-active-warning, .btn-group.open .dropdown-toggle.btn.btn-active-warning, .btn-warning.active, .btn-warning:disabled, .btn-warning.disabled, .btn-warning:not([class*="btn-active-"])+.dropdown-menu>li>a:hover, .btn-warning:not([class*="btn-active-"])+.dropdown-menu>li>a:focus, .btn-warning:not([class*="btn-active-"])+.dropdown-menu>.active>a, .btn-warning+.dropdown-menu:not(.head-list)>li>a.active, .open>.dropdown-toggle.btn-warning {background-color: #db9a00 !important;    border-color: #db9a00 !important;color: #fff !important;}
.btn-red:hover, .btn-hover-danger:hover, .btn-hover-danger:active, .btn-hover-danger.active, .btn-red:active, .btn-active-danger.btn:active, .btn-active-danger.btn.active, .btn-active-danger+.dropdown-menu>li>a:hover, .btn-active-danger+.dropdown-menu>li>a:focus, .btn-active-danger+.dropdown-menu>.active>a, .open .dropdown-toggle.btn.btn-active-danger, .btn-group.open .dropdown-toggle.btn.btn-active-danger, .btn-red.active, .btn-red:disabled, .btn-red.disabled, .btn-red:not([class*="btn-active-"])+.dropdown-menu>li>a:hover, .btn-red:not([class*="btn-active-"])+.dropdown-menu>li>a:focus, .btn-red:not([class*="btn-active-"])+.dropdown-menu>.active>a, .btn-red+.dropdown-menu:not(.head-list)>li>a.active, .open>.dropdown-toggle.btn-red {background-color: #f22314 !important;border-color: #f22314 !important;color: #fff !important;}
.btn-pink:hover, .btn-hover-pink:hover, .btn-hover-pink:active, .btn-hover-pink.active, .btn-pink:active, .btn-active-pink.btn:active, .btn-active-pink.btn.active, .btn-active-pink+.dropdown-menu>li>a:hover, .btn-active-pink+.dropdown-menu>li>a:focus, .btn-active-pink+.dropdown-menu>.active>a, .open .dropdown-toggle.btn.btn-active-pink, .btn-group.open .dropdown-toggle.btn.btn-active-pink, .btn-pink.active, .btn-pink:disabled, .btn-pink.disabled, .btn-pink:not([class*="btn-active-"])+.dropdown-menu>li>a:hover, .btn-pink:not([class*="btn-active-"])+.dropdown-menu>li>a:focus, .btn-pink:not([class*="btn-active-"])+.dropdown-menu>.active>a, .btn-pink+.dropdown-menu:not(.head-list)>li>a.active, .open>.dropdown-toggle.btn-pink {background-color: #ed417b !important;border-color: #ed417b !important;color: #fff !important;}
.btn-purple:hover, .btn-hover-purple:hover, .btn-hover-purple:active, .btn-hover-purple.active, .btn-purple:active, .btn-active-purple.btn:active, .btn-active-purple.btn.active, .btn-active-purple+.dropdown-menu>li>a:hover, .btn-active-purple+.dropdown-menu>li>a:focus, .btn-active-purple+.dropdown-menu>.active>a, .open .dropdown-toggle.btn.btn-active-purple, .btn-group.open .dropdown-toggle.btn.btn-active-purple, .btn-active-dark.btn:active, .btn-active-dark.btn.dark, .btn-purple.active, .btn-purple:disabled, .btn-purple.disabled, .btn-purple:not([class*="btn-active-"])+.dropdown-menu>li>a:hover, .btn-purple:not([class*="btn-active-"])+.dropdown-menu>li>a:focus, .btn-purple:not([class*="btn-active-"])+.dropdown-menu>.active>a, .btn-purple+.dropdown-menu:not(.head-list)>li>a.active, .open>.dropdown-toggle.btn-purple {background-color: #953ca4 !important;border-color: #953ca4 !important;color: #fff !important;}
.btn-dark:hover, .btn-hover-dark:hover, .btn-hover-dark:active, .btn-hover-dark.active, .btn-dark:active, .btn-active-dark+.dropdown-menu>li>a:hover, .btn-active-dark+.dropdown-menu>li>a:focus, .btn-active-dark+.dropdown-menu>.active>a, .open .dropdown-toggle.btn.btn-active-dark, .btn-group.open .dropdown-toggle.btn.btn-active-dark, .btn-dark.active, .btn-dark:disabled, .btn-dark.disabled, .btn-dark:not([class*="btn-active-"])+.dropdown-menu>li>a:hover, .btn-dark:not([class*="btn-active-"])+.dropdown-menu>li>a:focus, .btn-dark:not([class*="btn-active-"])+.dropdown-menu>.active>a, .btn-dark+.dropdown-menu:not(.head-list)>li>a.active, .open>.dropdown-toggle.btn-dark {background-color: #2b323a !important;border-color: #2b323a !important;color: #fff !important;}
.btn-confirm:hover, .btn-hover-confirm:hover, .btn-hover-confirm:active, .btn-hover-confirm.active, .btn-confirm:active, .btn-active-confirm+.dropdown-menu>li>a:hover, .btn-active-confirm+.dropdown-menu>li>a:focus, .btn-active-confirm+.dropdown-menu>.active>a, .open .dropdown-toggle.btn.btn-active-confirm, .btn-group.open .dropdown-toggle.btn.btn-active-confirm, .btn-confirm.active, .btn-confirm:disabled, .btn-confirm.disabled, .btn-confirm:not([class*="btn-active-"])+.dropdown-menu>li>a:hover, .btn-confirm:not([class*="btn-active-"])+.dropdown-menu>li>a:focus, .btn-confirm:not([class*="btn-active-"])+.dropdown-menu>.active>a, .btn-confirm+.dropdown-menu:not(.head-list)>li>a.active, .open>.dropdown-toggle.btn-confirm {background-color: #2b323a !important;border-color: #2b323a !important;color: #fff !important;}


.blue-btn{font-size: 1.3em;background-color: #2060c6;color: #fff;padding: 5px 10px;display: block;border-radius: 5px;margin-top: 10px;border: 1px solid #2060c6;width: 20%;margin: 0 auto;}
.blue-btn:hover{background-color: #ffffff;transition: .3s;border: 1px solid #2060c6;color: #2060c6;}
/*************************************************************************
***************************** breadcrumb css *****************************
**************************************************************************/
.breadcrumb-area{background-size: cover;background-position: center 70%;}
.breadcrumb-bg1{background-image: url(/resources/img/bg_03.png);background-position: center 78%;animation: background-move1 15s linear both;}
.breadcrumb-bg2{background-image: url(/resources/img/bg_04.png);background-position: center 75%;animation: background-move2 15s linear both;}
.breadcrumb-bg3{background-image: url(/resources/img/bg_05.png);background-position: center 50%;animation: background-move3 15s linear both;}
.breadcrumb-bg4{background-image: url(/resources/img/bg_06.jpg);background-position: center 65%;animation: background-move4 15s linear both;}
.breadcrumb-bg5{background-image: url(/resources/img/bg_07.png);background-position: center 60%;animation: background-move5 15s linear both;}
.breadcrumb-bg6{background-image: url(/resources/img/bg_08.png);background-position: center 60%;animation: background-move6 15s linear both;}
.breadcrumb-bg7{background-image: url(/resources/img/bg_09.png);background-position: center 50%;animation: background-move7 15s linear both;}
.breadcrumb-bg8{background-image: url(/resources/img/bg_10.png);background-position: center 65%;animation: background-move8 15s linear both;}
.breadcrumb-bg9{background-image: url(/resources/img/bg_11.jpg);background-position: center 95%;animation: background-move6 15s linear both;}
.happycall-breadcrumb-bg{background: url(/resources/img/bn_01.jpg) no-repeat;background-size: cover;background-position: bottom;}
.breadcrumb-box{width:100%;height:50px;background: rgba(0,0,0,0.6);position: absolute;margin-top: 131px;}
.breadcrumb{position: relative;display: inline-block;background: none;margin: 0;padding: 0;border-radius: initial;float:right;z-index: 9;}
.breadcrumb>li{width: auto;height: 50px;padding: 15px 5px;float: left;text-align: center;color: #fff;font-weight: 300;font-size: 15px;}
.breadcrumb>li a{color: #fff;}
.breadcrumb>li.current a{font-weight: 400;color:#ffeb3b;}
.breadcrumb>li:first-child a{color: #fff;}
.breadcrumb-icon{font-size:1.0em;}

/*************************************************************************
***************************** table css *****************************
**************************************************************************/
/* Table Type01 Style */
.tb_type01{border-top:2px solid #2460db; width:100%;border-collapse:collapse;}
.tb_type01 th, .tb_type01 td{color:#464646;font-size:15px;vertical-align:middle;text-align:center;line-height:18px;border-right:1px solid #d7d7d7;;padding:15px 6px;}
.tb_type01 th{background:#f3f3f3;font-weight:500;color:#333;border-bottom:1px solid #d7d7d7;}
.tb_type01 th a, .tb_type01 td a{color:#23527c;font-size:1.0em;}
.tb_type01 th a:hover, .tb_type01 th a:focus{color:#0099da;}
.tb_type01 td a.tb_blue:hover{text-decoration:none;color:#1c75c9;background:transparent;cursor:pointer;}
.tb_type01 td:last-child, .tb_type01 th:last-child{border-right:none;}
.tb_type01 td.tdbg_gray{background:#f8f8f8;}
.tb_type01 td{background:transparent;color:#464646;font-size:15px;font-weight: 300;vertical-align:middle;text-align:center;border-bottom:1px solid #d7d7d7;border-right:1px solid #d7d7d7;line-height:1.3em}
.tb_type01 td.bd_r{border-right:1px solid #d7d7d7;}
.tb_type01 th.thbd_r{border-right:1px solid #d7d7d7 !important;}
.tb_type01 td .dl_01 dt{font-weight:700;margin-bottom:5px;}
.tb_type01 td .dl_01 dd{padding-left:20px}
.tb_type01 p, .tb_type01 strong, .tb_type01 span{font-size:15px;}
.tb_type01 tfoot td{background:#fbfbfb;}

/* notice table Style */
.notice-view{border-top:2px solid #2460db; width:100%;}
.notice-view th, .notice-view td{color:#464646;font-size:15px;vertical-align:middle;text-align:center;line-height:18px;border-bottom:1px solid #d7d7d7;}
.notice-view th{background:#f9f9f9;font-weight:500;color:#09326d !important;padding: 15px;}
.notice-view th a, .notice-view td a{color:#23527c;font-size:1.0em;}
.notice-view th a:hover, .notice-view th a:focus{color:#0099da;}
.notice-view td a{color:#464646;}
.notice-view td a:hover{color:#23527c;text-decoration: underline;}
.notice-view td a.tb_blue:hover{text-decoration:none;color:#1c75c9;background:transparent;cursor:pointer;}
.notice-view td:last-child, .notice-view td:last-child{border-right:none;}
.notice-view td.tdbg_gray{background:#f8f8f8;}
.notice-view td{background:transparent;color:#464646;font-size:15px;vertical-align:middle;text-align:center;padding: 12px 20px;white-space: nowrap;word-wrap: normal;overflow: hidden;text-overflow: ellipsis;max-width: 400px;}
.notice-view td.bd_r{border-right:1px solid #d7d7d7;}
.notice-view th.thbd_r{border-right:1px solid #d7d7d7 !important;}
.notice-view td .dl_01 dt{font-weight:700;margin-bottom:5px;}
.notice-view td .dl_01 dd{padding-left:20px}

/* SubPage Table Style */
.sub_table{width:100%;border-collapse:collapse;border-top:2px solid #2460db;border-bottom:1px solid #d7d7d7;margin-bottom:10px;}
.sub_table th, .sub_table td{color:#464646;font-size:15px;vertical-align:middle;text-align:center;line-height:18px;padding:15px 6px;}
.sub_table th{background:#f3f5f7;font-weight:500;color:#333;border-bottom:1px solid #d7d7d7;border-right:1px solid #d7d7d7;}
.sub_table th a{color:#23527c;}
.sub_table th a:hover, .sub_table th a:focus{color:#333;}
.sub_table td a{color:#23527c;}
.sub_table td a:hover, .sub_table td a:focus{color:#333;}
.sub_table td a.tb_blue:hover{text-decoration:none;color:#1c75c9;background:transparent;cursor:pointer;}
.sub_table th:last-child{border-right:none;}
.sub_table td.tdbg_gray{background:#f8f8f8;}
.sub_table td{background:transparent;color:#464646;font-size:15px;vertical-align:middle;text-align:center;border:1px solid #d7d7d7;padding:15px 6px;line-height:1.3em}
.sub_table td:first-child{border-left:none;}
.sub_table td:last-child{border-right:none;border-bottom:1px solid #d7d7d7;}
.sub_table td.bd_r{border-right:1px solid #d7d7d7;}
.sub_table th.thbd_r{border-right:1px solid #d7d7d7 !important;}
.sub_table td .dl_01 dt{font-weight:700;margin-bottom:5px;}
.sub_table td .dl_01 dd{padding-left:20px}
.sub_table th p, .sub_table td p, .sub_table strong, .sub_table span{ font-size:15px;}
.sub_table td p{color:#000;}


/* Table Type02 Style */
.tb_type02{border-top:2px solid #25476a; width:100%;}
.tb_type02 th, .tb_type02 td{color:#464646;font-size:15px;vertical-align:middle;text-align:center;line-height:18px;}
.tb_type02 th{background:#f3f3f3;border-bottom: 1px solid #d7d7d7;border-right: 1px solid #d7d7d7;font-weight:700;color:#23527c;height: 6vh;}
.tb_type02 th a{color:#23527c;}
.tb_type02 th a:hover, .tb_type02 th a:focus{color:#0099da;}
.tb_type02 td a{color:#23527c;}
.tb_type02 td a:hover, .tb_type02 td a:focus{color:#0099da;}
.tb_type02 td a.tb_blue:hover{text-decoration:none;color:#1c75c9;background:transparent;cursor:pointer;}
.tb_type02 td:last-child, .tb_type02 td:last-child{border-right:none;}
.tb_type02 td.tdbg_gray{background:#f8f8f8;}
.tb_type02 td{background:transparent;color:#464646;font-size:15px;vertical-align:middle;text-align:center;border-bottom:1px solid #d7d7d7;padding:15px 6px;line-height:1.3em}
.tb_type02 td.bd_r{border-right:1px solid #d7d7d7;}
.tb_type02 th.thbd_r{border-right:1px solid #d7d7d7 !important;}
.tb_type02 td .dl_01 dt{font-weight:700;margin-bottom:5px;}
.tb_type02 td .dl_01 dd{padding-left:20px}

/* Table notice view Style */
.notice_view{border-top:2px solid #25476a; width:100%;}
.notice_view th, .notice_view td{color:#464646;font-size:15px;vertical-align:middle;padding:5px 6px;line-height:18px;}
.notice_view th{background:#f3f3f3;font-weight:700;padding:15px 6px;border-bottom:1px solid #d7d7d7;}
.notice_view th{background:#f3f3f3; color:#25476a;}
.notice_view td{background:#fff;}
.notice_view td > div.board_view{height: 100%;}
.notice_view td a.tb_blue:hover{text-decoration:none;color:#1c75c9;background:transparent;cursor:pointer;}
.notice_view td:last-child, .notice_view td:last-child{border-right:none;}
.notice_view td.tdbg_gray{background:#f8f8f8;}
.notice_view td{background:#fff;color:#464646;font-size:15px;vertical-align:top;border-bottom:1px solid #d7d7d7;padding:15px 6px;}
.notice_view td.bd_r{border-right:1px solid #d7d7d7;}
.notice_view th.thbd_r{border-right:1px solid #d7d7d7 !important;}
.notice_view td .dl_01 dt{font-weight:700;margin-bottom:5px;}
.notice_view td .dl_01 dd{padding-left:20px}


/* 화면 공통 css */
#accessibility{position: absolute;top: -1px;left: 0;background-color: #333;z-index: 999999;}
#accessibility a {position: absolute;top: 0;left: 0;padding: 10px 25px;margin-top: -100px;text-align: center;line-height: 1;white-space: nowrap;background: #000;}
#accessibility a:focus{margin-top: 0;text-decoration: underline;color: #fff;}
#map-accessibility a{position: absolute;top: 98px;left: 4px;padding: 10px 25px;text-align: center;line-height: 1;white-space: nowrap;background: #000;color:#fff;}
#map-accessibility a:focus{display:block;z-index:99999;}

.container{max-width: 1200px;width: 100%;padding-right: 0;padding-left: 0;margin-right: auto;margin-left: auto; }
#side_menu{width: 23%;display: inline-block;float: left;}
.main-contents{width: 77%;display: inline-block;float: left;}
.main-wrap{width: 100%;}
.contentsWrap{width: 100% !important;padding: 50px 0;}
.title-box {background: url(/resources/img/bg_section.png) repeat-x 0 100%;margin-bottom:30px;}

p.letPress{font-size: 1.4em;margin-left: 15px;margin-bottom: 10px;font-weight: 300;}
p.letPress::before{content: "";display: inline-block;width: 5px;height: 5px;margin: 0 6px 3px -9px;background: #949494;vertical-align: middle;}
p.letPress > span{font-size: 1.0em;}
.title-dep01{font-size: 3.5em;font-weight: 500;color: #000;margin-bottom: 30px;/* padding-bottom: 30px; background: url(/resources/img/bg_section.png) repeat-x 0 100%;*/display:inline-block;}
.title-dep02{font-size: 2.0em;font-weight: 500;color: #000;margin-bottom: 20px;padding-left: 15px;border-left:4px solid #0061b5;}
.title-dep03{font-size: 1.5em;font-weight: 500;color: #000;margin-bottom: 10px;margin-left: 5px;background: url(/resources/img/title-dep04.png) 1px 4px no-repeat; padding-left:25px;}
.title-dep04{font-size: 1.3em;font-weight: 500;color: #000;margin-bottom:15px;margin-left: 10px;}
.title-dep04:before{display: inline-block;width: 9px;height: 3px;left: 0;margin: 5px 4px 5px 0;background: #000;content: '';}
.title-dep05{font-size: 1.5em;font-weight: 600;color: #5c5c5c;margin-bottom:10px;}

#scheduleTarget p::before{background: none;}

/* 페이지평가 css */
.evaluationForm{width:100%;margin-bottom:50px;border:1px solid #dfdfdf;}
.charge{display: inline-block;width: 100%;height: 100%;border-bottom:1px solid #efefef;background:#fff;margin:0 auto;padding: 15px 40px;text-align: center;}
.charge span{float:left;color:#333;font-size:13px;line-height:22px;}
.eval01, .eval02, .eval03, .eval04{display: inline-block;width: 24%;}
.charge span.icon{background:url('/resources/img/icon_charge.png') no-repeat;padding-left:25px}
.charge span.icon01{background-position:0 0;}
.charge span.icon02{background-position:0 -23px;}
.charge span.icon03{background-position:0 -46px;}
.charge span.icon04{background-position:0 -69px;}
.charge span{margin-right:24px;}
.evaluation{background:#f5f7f9;padding:19px 40px;}
.evaluation dl dt{font-size:14px;font-weight:700;color:#333;float:left;margin-right:40px;}
.evaluation dl dd{font-size:13px;color:#333;float:left;margin-right:35px;}
.evaluation dl dd input{    margin-top: 4px;}
.evaluation dl dd label{font-size:1.0em;}
.evaluation-btn{padding: 7px 15px !important;}

/* file download css */
.fileList{margin-top: 20px;padding: 20px 10px 0 10px;border-top: 1px solid #d3d3d3;text-align: left;}
.file-list{display: inline-block;}
.file-list > a{display: block;margin-left: 10px;margin-bottom: 15px;color: #23527c;}
.file-list > a:last-child{margin-bottom: 0;}

.info-box{position: relative;display: inline-block;width:100%;height:100%;min-height:300px;border:1px solid #ddd;padding: 15px 0;}
.info-box::before{content: "";position: absolute;bottom: -4px;left: -1px;display: block;width: 100%;height: 3px;background: #f1f1f1;}
.info-img{display:inline-block;float:left;width:45%;height:100%;min-height:300px;padding: 40px 30px;margin: 0 auto;}
.info-img > img{width: 100%;height: 220px;object-fit: cover;}
.info-text{display:inline-block;float:left;width: 55%;height:100%;min-height:300px;padding: 13px 40px;}
.info-table{position: relative;width:100%;border:0;margin:0;padding:0;}
.info-table th, td{text-align:left;color: #333;}
.info-table th{font-size: 1.7em;padding: 5px;border-bottom: 3px solid #333;}
.info-table td.sub-title{font-size: 1.7em;padding: 5px;border-bottom: 3px solid #333 !important;}
.info-table td{font-size: 1.1em;padding: 20px;border-bottom: 1px dotted #ccc;}
.info-table tr:last-child > td{border-bottom: none;}
.info-table td > p{font-size: 1.1em;}
.info-table td > p > span{font-size: 1.0em;}
.info-table td > span.info-btn{position: absolute;right: 0;}
.info-table td > span.vr-btn{position: absolute;right: 115px;}
.info-table td > p:before{display: inline-block;position: absolute;left: 0;width: 4px;height: 4px;margin: 9px;background:#3761b6;box-sizing: border-box;content: '';}

ul.list-style{display: block;margin-left: 10px;margin-bottom: 20px}
ul.list-style > li > span{font-size:1.0em;}
ul.list-style > li{position: relative;margin-bottom: 10px;padding-left: 21px;font-size: 1.3em;color: #333;line-height: 21px;letter-spacing: 0;font-weight: 300;list-style: none;}
ul.list-style > li > a {font-size: 1.0em;color: #000;}
ul.list-style > li > a:hover{text-decoration: underline;}  
ul.list-style > li::before{content: "";display: inline-block;width: 5px;height: 5px;margin: 0 6px 3px -9px;background: #949494;vertical-align: middle;}
ul.list-style > li > p{font-size: 1.0em;margin:5px;}
ul.list-style > li > p > span{font-size: 1.0em;}
ul.list-style > li > ul > li{font-size:1.3em;line-height:1.7;text-indent: 5px;}


ul.list-style02{display: block;margin-left: 10px;margin-bottom:20px;}
ul.list-style02 > li > span{font-size:1.0em;}
ul.list-style02 > li{position: relative;margin-bottom: 10px;font-size: 1.3em;color: #333;line-height: 21px;letter-spacing: 0;font-weight: 300;list-style: none;}
ul.list-style02 > li > a {font-size: 1.0em;color: #000;}
ul.list-style02 > li > p{font-size: 1.0em;margin:5px;}
ul.list-style02 > li > p > span{font-size: 1.0em;}
ul.list-style02 > li > p > u{font-size:1.0em;}
ul.list-style02 > li > p > a >span{font-size: 1.0em;margin:5px;}
ul.list-style02 > li > p > a{font-size:1.0em;}


dl.list-style{margin-left: 10px;margin-bottom: 20px}
dl.list-style > dt, dl.list-style > dd{padding: 0 0 5px 10px;font-size:1.3em;}
dl.list-style > dt{font-weight: 500;display:table-cell;float:left;clear:left;}
dl.list-style > dd{display:table-cell;word-break: keep-all;font-weight:300;}
dl.list-style > dd > span{font-size:1.0em;}
dl.list-style > dd > p{font-size:1.0em;}
dl.list-style > dd > a {font-size: 1.0em;color: #000;}
dl.list-style > dd > a:hover{text-decoration: underline;}  
dl.list-style > dt::before{content: "";display: inline-block;width: 5px;height: 5px;margin: 0 6px 3px -9px;background: #949494;vertical-align: middle;}

/* 서브페이지 탭메뉴 */
.tab-area{height: 70px;margin:25px 0;}
.tab-area li{}
/* .tab-area li a{width: 25%;height:60px;display: inline-block;float: left;text-align:center;padding-top: 18px;color: #333;font-size: 1.2em;border: 1px solid #999;border-right:none;} */
.tab-area li a.bd_none{border-right: none;}
.tab-area li a.next{border-right: 1px solid #999;}
.tab-area li:last-child a{border-right: 1px solid #999;}
.tab-area li a.current{background:#5d5873;color:#fff;}

#divSearch{margin-bottom:30px;}
.search_box{position: relative;border: 1px solid #d9d9d9;}
.search_box::before{content: "";position: absolute;bottom: -4px;left: -1px;display: block;width: 100%;height: 3px;background: #f1f1f1;}
.quickSearchForm{text-align: center;}
.search-form{display: inline-block;width: 80%;padding: 15px 0;}
.searchSelect, .searchText, .searchBtn{display: inline-block;float:left;padding-right: 10px;}
.searchSelect, .searchBtn{width:15%;}
.searchText{width:70%;}
.selectBox{padding: 10px 15px;border: 1px solid #ccc;width: 100%;font-size: 1.1em;}
.selectBox > option{font-size: 1.1em;}
.search-text{padding: 11px 15px;border: 1px solid #ccc;width: 100%;font-size: 1.1em;}
.search-btn{padding: 10px 15px;margin: 0 !important;width: 100%;font-size: 1.2em;}

.pagination{display:inline-block;margin-top: 30px;}
.pagination > li{display:inline-block;float:left;margin-right: 5px;}
.pagination > li > a{display: inline-block;padding: 10px;background-color:#fff !important;border: 1px solid #ccc;color:#333;}
.pagination > li.active > a{background:#0075ee !important;color:#fff !important}
/* .pagination > li{box-shadow:inset 0 3px 2px rgba(0,0,0,0.3) !important;background-color:#25476a !important;color:#fff !important} */

.site-menu-all a.close {top: 5%;}

.page-btn{display:inline;float: right;}
.page-btn li{display:inline-block;float:left;margin: 10px 5px;}
.page-btn li a{display: inline-block;}
.page-btn li a img{width: 45px;border: 1px solid #000;border-radius: 90px;padding: 5px;}
.page-btn li a img.link:hover, .page-btn li a img.print:hover{border:2px solid #304A90;}

.bookmark{position: fixed;z-index: 10;right: 0;margin-top: 20%;}
.bookmark-btn{display: inline-block;float:left;right: 0;background: #0165a5;border-radius: 15px 0 0 15px;}
.bookmark-btn img{width: 50px;padding: 12px;animation: bookmark 1.3s linear both infinite;}
.bookmark-area{display: inline-block;float:right;width:200px;height: auto;max-height: 300px;background:#fff;border-radius: 0 0 0 15px;box-shadow: 15px 15px 25px 6px rgba(0, 0, 0, 0.2);border: 1px solid #0165a5;border-right: none;}
.bookmark-area .title{text-align: left;padding: 13.5px;background: #e1e8ff;}
.bookmark-area .title h4{font-size: 1.3em;font-weight: 500;color: #003556;}
.bookmark-area .list{padding:15px 10px;text-align:center;}
.bookmark-area .list a{display:block;padding: 7px 20px;margin-bottom: 10px;text-align:left;width:100%;font-size: 1.2em;border-radius:15px;color: #fff;}
.bookmark-area .list a i{color:#fff;float:right;padding-top: 5px;}
.bookmark-area .list a:hover i{animation: link 1.0s linear both infinite;}
.bookmark-area .list a.siseol{background-color:#0165a5;}
.bookmark-area .list a.eticket{background-color:#7fa013;}
.bookmark-area .list a.happycall{background-color:#029080;}
.bookmark-area .list a.minwon{background-color:#e91e63;}
.bookmark-close{display:none !important;}


@keyframes bookmark {
	from {
    	transform: translateY(0);
	} 50% {
	    transform: translateY(-5px);
	} to {
	    transform: translateY(0);
	}
}

@keyframes background-move {
	from {
    	background-position: center 35%;
	} 50% {
	    background-position: center 20%;
	} to {
	    background-position: center 35%;
	}
}

@keyframes background-move1 {
	from {
    	background-position: center 78%;
	} 50% {
	    background-position: center 65%;
	} to {
	    background-position: center 78%;
	}
}

@keyframes background-move2 {
	from {
    	background-position: center 75%;
	} 50% {
	    background-position: center 65%;
	} to {
	    background-position: center 75%;
	}
}

@keyframes background-move3 {
	from {
    	background-position: center 50%;
	} 50% {
	    background-position: center 45%;
	} to {
	    background-position: center 50%;
	}
}

@keyframes background-move4 {
	from {
    	background-position: center 70%;
	} 50% {
	    background-position: center 65%;
	} to {
	    background-position: center 70%;
	}
}

@keyframes background-move5 {
	from {
    	background-position: center 65%;
	} 50% {
	    background-position: center 55%;
	} to {
	    background-position: center 65%;
	}
}

@keyframes background-move6 {
	from {
    	background-position: center 15%;
	} 50% {
	    background-position: center 25%;
	} to {
	    background-position: center 15%;
	}
}

@keyframes background-move7 {
	from {
    	background-position: center 50%;
	} 50% {
	    background-position: center 35%;
	} to {
	    background-position: center 50%;
	}
}

@keyframes background-move8 {
	from {
    	background-position: center 75%;
	} 50% {
	    background-position: center 85%;
	} to {
	    background-position: center 75%;
	}
}

@keyframes link {
	from {
    	transform: translateX(0);
	} 50% {
	    transform: translateX(-5px);
	} to {
	    transform: translateX(0);
	}
}


/************************************
Header Page Custom
************************************/
.head-navbar {box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), inset 0 0 2px rgba(255, 255, 255, 0.75);background-image: linear-gradient(to top, #ececec, #f4f4f4);margin-bottom: 0;border-bottom: 1px solid #ddd;background-color: #fff;background-image: none;color: #444;box-shadow: none;}
.navbar-header{width: 100%;float: none;text-align: center;display: inline-block;border-bottom: 1px solid #ddd;}
.header{text-align: center;}

.top-menu{background: transparent;border-bottom:1px solid #ddd;width: 100%;height: 50px;}
.tophead{display: inline;line-height: 2.0;width: 145px;height: 50px;padding: 10px 0;font-size: 1.2em;text-align: center;}
.tophead a{font-size: 1.0em;}

.current-site-nav{background: #19699c !important;color: #fff !important;}
.happy-site-nav{background: #4e9e88 !important;color: #fff !important;}
.other-site-nav{border-right: 1px solid #ddd;}
.other-site-nav a{color: #888 !important;}
.other-site-nav a:hover{color: #19699c !important;}
.tophead01{width: 519px;/* background: #0142a1; */border-right: none !important;}

/* .site-nav{display: inline-block;width: 80px;padding: 10px;text-align: center;}
.site-nav a{color: #333;}
.site-nav a:hover{color: #19699c;text-decoration: none;}

.total-nav{display: inline-block;float: left;padding: 12px 10px;}
.logo-nav{display: inline-block;float: left;}
.sns-nav{display:inline-block;float: left;padding-right: 50px;} */

/*****************************************************************************************/
span.d-day {position: absolute;top: 0;left: 45%;font-size: 1.5em;font-weight:500;padding: 11px;color: #fff;}
span.d-day i{font-size:1.2em;margin-right:2px;}
.site-nav{display: inline-block;width: 80px;padding: 10px;text-align: center;border-right: 1px solid #ddd;position:relative;}
.tophead01{width: 519px;/* background: #0142a1; */border-right: none !important;}
.site-nav:first-child{border-left:1px solid #ddd;}
.site-nav a{color: #333;}
.site-nav a:hover{color: #19699c;text-decoration: none;}

.total-nav{display: inline-block;float: left;padding: 12px 10px;}
.logo-nav{display: inline-block;float: left;}
.nav-right{display:inline-block;float:right;}
.slogan-img{width:440px;}
.sns-nav{display:inline-block;float: left;/* padding-right: 50px; */padding: 10px 0;position:relative;}
.sns-tit-img{vertical-align:baseline;}
.sns-contents{display:none;position: absolute;background-color: #fff;width: 80px;left: -1px;top: 50px;/* box-shadow: 0px 8px 16px 0px rgb(0 0 0 / 20%); */z-index: 1;border: 1px solid #ddd;border-top: none;}
.sns-tit{cursor: pointer;background:#fff;}

/* 검색창 */
.srch-btn{width: 30px;height:30px;cursor:pointer;font-size:0;background: #007ac6 url(/resources/img/srch-btn.png)no-repeat 50%;background-size: 40%;}
.search-box{position:relative;display: inline-block;margin: 16px 0;width: 35%;background: linear-gradient(to right, #009852, #007ac6) border-box;border-radius: 10px;}
.search-box input{height: 45px;margin: 2px;padding-left: 10px;width: 88%;font-size: 1.3em;float: left;border-radius: 8px 0 0 8px;}
.search-box .srch-btn {position:absolute;top: 1px;right: 1px;padding: 23px;border-radius: 0 10px 10px 0;}
.m-search{display:none;}

/************************************************************************************/

.total-btn{padding: 10px;display: inline-block;}
.total-btn:hover{outline: thin dotted;}
.nav-bar{font-size: 2.5em;}
.navbar-logo img{padding: 10px 20px;}
/* .sns-btn{display: inline-block;padding: 23px 5px;} */
.sns-btn{display: inline-block;padding: 10px 5px;}
.main-menu{width: 100%;text-align: center;}
.header_text{color: #333;font-size: 13px;}
.header_text:hover{color: #1d7cd4;outline: 0;cursor: pointer;text-decoration: none !important;}
.subnav{border: 1px solid #ddd !important;    border-top: 3px solid #1f4787 !important;}

.scroll {box-shadow: 8px 20px 17px 2px rgba(0, 0, 0, 0.2);} 
.scroll nav {align-items: center;}

.navbar-nav {float: none !important;text-align: center;display:inline-block;}
.gnb{float: left;}
.gnb1::before, .gnb2::before, .gnb3::before, .gnb4::before, .gnb5::before, .gnb6::before{display: block;position: absolute;content: '';right: 0;top: 31px;width: 1px;height: 10px;background: #a2a2a2;transform: rotate(45deg);-moz-transform: rotate(45deg);-ms-transform: rotate(45deg);-o-transform: rotate(45deg);-webkit-transform: rotate(45deg);}
.gnb > a{color: #444 !important;display: inline-block !important;font-size: 19px;}
.gnb > a{position: relative;box-sizing: border-box;height: 64px;padding:0 36px !important;padding-top: 20px !important;padding-bottom: 20px !important;color: #444 !important;display: inline-block !important;}
.gnb > a:hover{border-bottom: 4px solid #1f4787;background:none !important;}
.snb{display: none;position: absolute;width: 100%;background-color: #fff;border-top: 1px solid #ddd;border-bottom: 1px solid #ddd;box-shadow: 8px 20px 17px 2px rgba(0, 0, 0, 0.2);left:0;}
.snb1, .snb4{height: 600px;}
.snb2, .snb3, .snb5, .snb6, .snb7{height: 400px;}


.bg-dark{display:none;width: 100%;height: 100%;position: fixed;background: rgba(0,0,0,0.5);z-index: 999;}
.site-menu-all{display:none;position: absolute;width:90%;height: 85%;margin-right: 5%;margin-left: 5%;margin-top: 5%;background:#fff;border:1px solid #ddd;box-shadow: 15px 25px 6px rgba(0, 0, 0, 0.2);z-index:99999999;overflow:auto;overflow-x:hidden;}
.site-menu-all a.close{position: fixed;top: 13%;right: 0;margin-right: 7%;padding: 15px;background:url('/resources/img/close.png') no-repeat;}
.sample-site-menu-all a.close{position: fixed;top: 13%;right: 0;margin-right: 13%;width: 40px;height:40px;padding: 15px;background:url(/resources/img/close.png) no-repeat 50%;text-indent:-9999px;transition:.5s;}
.sample-site-menu-all a.close:hover{background:url('/resources/img/close-hover.png') no-repeat;background: #e6e6e6 url(/resources/img/close.png) no-repeat 50%;border-radius: 5px;}
.site-menu-all a.openInfoClose{margin-right: 18%;transition:.5s;}
.site-menu-all a.openInfoClose:hover{background:url('/resources/img/close-hover.png') no-repeat;background: #e6e6e6 url(/resources/img/close.png) no-repeat 50%;border-radius: 5px;}
.openBoardList{width: 70%;margin-right: 15%;margin-left: 15%;}
.sample-site-menu-all{display:none;position: absolute;width: 80%;height: 85%;margin-right: 10%;margin-left: 10%;margin-top: 5%;background:#fff;border:1px solid #ddd;box-shadow: 15px 25px 6px rgba(0, 0, 0, 0.2);z-index:99999999;overflow:auto;overflow-x:hidden;}




.bg01{background: url('/resources/img/gnb-bg-01.png') no-repeat;}
.menu-bg{height: 100%;width: 30%;float: left;background-size: cover;background-position: center;position:relative;}
.menu-bg::before{content:'';background:#fff;width:1px;height:150px;position:absolute;top:-18px;left:220px;transform:rotate(40deg);}
.menu-bg::after{content:'';background:#fff;width:1px;height:150px;position:absolute;bottom:-18px;right:220px;transform:rotate(40deg);}
.menu-title{color: #fff;text-align: right;padding: 50px 50px 10px 0;font-size: 1.9em;font-weight: 600;position:relative;}
.menu-subtit{color: #fdec5a;text-align: right;padding-right: 50px;font-weight: 600;font-size: 0.8em;}
.menu-subtit > span{position:relative;font-size:1.7em;padding-bottom: 100px;}
.tit01{background: url('/resources/img/gb1.png') right 50px no-repeat;}
.tit02{background: url('/resources/img/gb2.png') right 50px no-repeat;}
.tit03{background: url('/resources/img/gb3.png') right 50px no-repeat;}
.tit04{background: url('/resources/img/gb4.png') right 50px no-repeat;}
.tit05{background: url('/resources/img/gb5.png') right 50px no-repeat;}
.tit06{background: url('/resources/img/gb6.png') right 50px no-repeat;}
.tit07{background: url('/resources/img/gb7.png') right 50px no-repeat;}
.tit08{background: url('/resources/img/gb8.png') right 50px no-repeat;}
.tit09{background: url('/resources/img/gb9.png') right 50px no-repeat;}
.tit10{background: url('/resources/img/gb10.png') right 50px no-repeat;}
.tit11{background: url('/resources/img/gb11.png') right 50px no-repeat;}


.bg1{background: url('/resources/img/gnb-bg-01.png') no-repeat;}
.bg2{background: url('/resources/img/gnb-bg-02.png') no-repeat;}
.bg3{background: url('/resources/img/gnb-bg-03.png') no-repeat;}
.bg4{background: url('/resources/img/gnb-bg-04.png') no-repeat;}
.bg5{background: url('/resources/img/gnb-bg-05.png') no-repeat;}
.bg6{background: url('/resources/img/gnb-bg-06.png') no-repeat;}
.bg7{background: url('/resources/img/gnb-bg-07.png') no-repeat;}
.menu-bg{height: 100%;min-width: 30%;float: left;background-size: cover;background-position: center;}

.menu-title{color: #fff;text-align: right;padding-right: 50px;font-size: 1.9em;font-weight: 600;}
.menu-list{height: 100%;width: 70%;float: left;padding: 20px 10px;}
.snb-depth1{float: left;position: relative;top: 0;height: 100% !important;width: 100%;/* padding: 35px 0 0; */text-align: left;margin: 0;}
.snb-depth1 > li{display: block;float: left;width: 20%;padding: 0 10px;margin: 0 0 20px;text-align: left;line-height: 18px;}
.snb-depth1 > li.double{display: block;float: left;width: 40%;height:180px;padding: 0 10px;margin: 0 0 20px;text-align: left;line-height: 18px;}
.snb-depth1 > li > a.snb-title, .snb-depth1 > li.double > a.snb-title{display: inline-block;position: relative;min-width: 100%;padding: 10px 25px 10px 10px;border: 1px solid #c1c7cb;border-radius: 4px;line-height: 1.2;color: #313437;font-weight: 700;font-size: 15px;letter-spacing: -0.1em;box-sizing: border-box;word-break: keep-all;word-wrap: break-word;}
.snb-depth1 > li > a.on, .snb-depth1 > li.double > a.on{background: #19699c;color: #fff;border: 1px solid #0e3b88;}
.snb-depth1 > li > a.snb-title:hover, .snb-depth1-double > li > a.snb-title:hover{background: #19699c;color: #fff;}
.nextMenu{clear: both;}
.snb-depth2, .snb-depth2-double{display: block !important;margin-top: 8px;height: auto;transition: all .3s;}
.snb-depth2 > li{display: block;}
.snb-depth2-double > li{float: left;width: 50%;}
.snb-depth2 > li > a, .snb-depth2-double > li > a{display: block;position: relative;padding: 4px 0 4px 13px;line-height: 1.2;color:#7b7b7b;font-size:1.2em;}
.snb-depth2 > li > a::before, .snb-depth2-double > li > a::before{position: absolute;top: 11px;left: 4px;width: 3px;height: 3px;background-color: #aeaeaf;content: "";}
.snb-depth2 > li > a:hover, .snb-depth2-double > li > a:hover{color: #19699c;font-weight: 700;}
.snb-depth2 > li > a:hover::before, .snb-depth2-double > li > a:hover::before{color: #19699c;}



/************************************
SubPage Custom
************************************/
.sports-photo{width: 100%;height: auto;}
.sports-photo > span{float: left;width: 33.3%;text-align: center;}
.sports-photo > img{}

.swimming-info{font-size: 1.3em;padding: 20px 10px;border: 2px solid #c6c6c6;text-align: center;}

.img_box{display:flex;flex-wrap:wrap;justify-content:space-between;}
.img_box>img{width:49.9%;display:block;border:1px solid #ddd;}
.img_box>img:nth-child(1), .img_box>img:nth-child(2){margin-bottom:1px;}

/******* 정보공개 css ******/
.oath-box{border:5px solid #efefef;text-align: center;padding: 0 60px 30px 60px;background:none;}
.oath-img{width:150px;height:150px;margin: 0 auto;background:url('/resources/img/medal.png') center no-repeat;background-color:#0a4996;background-size: 80px;}
.oath-box > h4{font-size: 2.8em;color:#0a4996;margin-top: 50px;}
.oath-box > h5{font-size: 2.8em;color:#000;margin-top: 50px;}
.oath-box > p{font-size: 1.3em;color: #666;}
.oath-box > .oath-text-bg{width:100%;background: #efefef;padding: 15px;font-size: 1.3em;margin:10px 0;color:#0a4996;}
.oath-box > .oath-text-bg > span.num{font-size: 1.2em;padding-right: 20px;display:block;margin-bottom: 5px;}
.oath-box > .oath-text-bg > span.text{font-size: 1.0em;display:block;}
.clear-box{width:100%;border:5px solid #efefef;text-align: center;padding: 30px;display:inline-block;}
.chart-box{display: inline-block;width: 50%;float: left;}
.select-year{display:inline-block;float:right;}
.select-year > select{font-size: 1.3em;display:inline-block;border:1px solid #999;padding:11px;}
.select-year > select > option{font-size: 1.1em;}
.select-year > button{display:inline-block;}
.select-year2{display:inline-block;float:right;}
.select-year2 > select{font-size: 1.3em;display:inline-block;border:1px solid #999;padding:11px;}
.select-year2 > select > option{font-size: 1.1em;}
.select-year2 > button{display:inline-block;}
.remark{font-size:1.2em;font-weight: 500;color: #666;margin-bottom: 20px;}
.openInfo-img{border: 1px solid #d9dee2;padding: 20px;position: relative;}
.openInfo-img::before, .openInfo-img::after{content: "";position: absolute;background: url(/resources/img/textBox-edge.png) left top no-repeat;width: 15px;height: 15px;}
.openInfo-img::before{top: -1px;left: -1px;}
.openInfo-img::after{bottom: -1px;right: -1px;background-position: right bottom;}
.openInfo-img > img{width:100%;}
#boardArea{padding: 0 70px;}

.auth-box{width:50%;}
.auth-box > div{margin-bottom:50px;}
.auth-box > div > img {box-shadow:5px 5px 10px 2px gray;margin: 10px 0 0 20px;}
.auth-wrap{width:100%;}

.btn-document{font-size: 0.9em;font-weight: 300;background-color: #45495b;color: #fff !important;transition: background-color .05s ease-in-out;-webkit-transition: background-color .05s ease-in-out;-moz-transition: all 0.3s;padding: 5px 10px;border-radius: 90px;}
.btn-document:hover, .btn-document:focus{background-color: #3a5ca4;}
.searchField{padding: 11px 15px;border: 1px solid #ccc;font-size: 1.1em;}
.search-select{padding: 10px 15px;border: 1px solid #ccc;font-size: 1.1em;}



.organization li .organiz_tit{text-align:center;height:40px; padding:12px 0; border-radius:5px 5px 0 0;}
.organization li .organiz_tit h6{color:#fff;font-size:16px;font-weight:700;}
.operation li{height:auto;position:relative;}
.operation li::after{content:url('../img/sub04/arrow_operation.png');position:absolute;left:260px;top:50%;width:24px;height:23px;}




.depart_refund{background:url('/resources/img/openInfo/refund_bg01.png') center no-repeat;text-align:center;margin-top:50px;}
.depart_refund ul{margin-bottom:100px;height:40px}
.depart_refund ul:last-child{margin-bottom:0}
.depart_refund > ul > li{}
.depart-ul02 > li{width:251px;height:106px;/* margin-right: 30px; */margin: 0 2%;width: 30%;border-radius:5px;border:1px solid #e3e3e3;float:left;background:#fff;}
.depart_refund li.last{margin-right:0;}
.depart_refund li .depart_body01{height:211px;position:relative;}
.depart_refund li .depart_body01 ul{/* width:200px; */height:211px;/* padding:22px 0 10px 5px; */margin-bottom:0;}
.depart_refund li .depart_body01 .btn_group{position:absolute;bottom:14px;left:26%;}
.depart_refund{height:auto;position:relative;}
.depart_refund .operation .depart_body01{padding:25px;height:160px}
.depart_refund .depart_tit h6, .depart_refund .depart_sub_tit h6{color:#fff;font-size:1.5em;font-weight:700;text-align: center;padding: 10px;}
.depart_refund .depart_tit{display:inline-block;text-align:center;/* height:40px; */border-radius:5px 5px 0 0;}
.depart_refund .depart_tit h6{padding:10px 100px;}
.depart-content{text-align:left;}
.depart-content li{padding-left:18px;color:#3d3d3d;font-size: 1.2em;padding-bottom:8px;padding: 10px 10px 5px 20px;}
.depart-content > li::before{content: "";display: inline-block;width: 3px;height: 3px;margin: 0 6px 3px -9px;background: #000;vertical-align: middle;}
.depart-ul03 > li{width:251px;height:211px;margin:0 2%;width: 30%;border-radius:5px;border:1px solid #e3e3e3;float:left;background:#fff;}

.depart_refund2{background:url('/resources/img/openInfo/refund_bg02.png') center no-repeat;text-align:center; margin-top:50px;}
.depart_refund2 ul{margin-bottom: 100px;height:41px;}
.depart_refund2 ul:last-child{margin-bottom:0}
.depart_refund2 li.last{margin-right:0;float: right;}
.depart_refund2 li .depart_tit{text-align:center;border-radius:5px 5px 0 0;}
.depart_refund2 li .depart_body01{/* width: 200px; */height:211px;position:relative;}
.depart_refund2 li .depart_body01 ul{/* width:200px; */width: 100%;height: auto;/* padding:22px 0 10px 5px; */margin-bottom:0;}
.depart_refund2 li .depart_body01 .btn_group{position:absolute;bottom:14px;left:26%;}
.depart_refund2{height:auto;position:relative;}
.depart_refund2::after{content:url('../img/sub04/arrow_operation.png');position:absolute;left:260px;top:50%;width:24px;height:23px;}
.depart_refund2 .depart_body{padding:25px;height:160px}
.refund2-ul > li {width: 35%;height: 270px;border-radius:5px;border:1px solid #e3e3e3;float:left;background:#fff;/* padding: 10px; */}
.depart_refund2 .depart_tit h6, .depart_refund2 .depart_sub_tit h6{color:#fff;font-size:1.5em;font-weight:700;text-align: center;padding: 10px;}
.depart_refund2 .depart_tit{display:inline-block;text-align:center;/* height:40px; */border-radius:5px 5px 0 0;}
.depart_refund2 .depart_tit h6{padding:10px 100px;}


/* 막대그래프 */
.v_graph{padding:10px 0 30px 0; width:600px; clear:both;box-sizing:content-box;}
.v_graph ul{height:130px;margin:0; padding:0; border:1px solid #ddd;border-top:0;border-right:0;font-size:11px;font-family:Tahoma, Geneva, sans-serif;list-style:none;box-sizing:content-box;}
.v_graph ul:after{display:block;clear:both;content:""}
.v_graph li{display:inline;float:left;position:relative;width:8%;height:100%;margin:0 3%;text-align:center;white-space:nowrap;box-sizing:content-box;}
.v_graph .g_term{display:inline-block;position:relative;width:100%;height:30px;margin:0 -100% -30px 0;padding:130px 0 0 0;font-weight:700;color:#545454;line-height:20px;vertical-align:bottom; font-size:11px;box-sizing:content-box;}
.v_graph .g_bar01{display:inline-block;position:relative;width:100%;margin:-1px 0 0 0;border:1px solid #cc9f9d;border-bottom:0;background:#f8f1f1;vertical-align:bottom;box-sizing:content-box;}
.v_graph .g_bar02{display:inline-block;position:relative;width:100%;margin:-1px 0 0 0;border:1px solid #c8cc9d;border-bottom:0;background:#f8f8f1;vertical-align:bottom;box-sizing:content-box;}
.v_graph .g_bar03{display:inline-block;position:relative;width:100%;margin:-1px 0 0 0;border:1px solid #9dccc7;border-bottom:0;background:#f1f8f7;vertical-align:bottom;box-sizing:content-box;}
.v_graph .g_bar04{display:inline-block;position:relative;width:100%;margin:-1px 0 0 0;border:1px solid #9db6cc;border-bottom:0;background:#f1f5f8;vertical-align:bottom;box-sizing:content-box;}
.v_graph .g_bar05{display:inline-block;position:relative;width:100%;margin:-1px 0 0 0;border:1px solid #9f9dcc;border-bottom:0;background:#f1f1f8;vertical-align:bottom;box-sizing:content-box;}
.v_graph .g_bar06{display:inline-block;position:relative;width:100%;margin:-1px 0 0 0;border:1px solid #cc9dc7;border-bottom:0;background:#f8f1f8;vertical-align:bottom;box-sizing:content-box;}
.v_graph .g_bar span{position:absolute;top:-20px;left:0;width:100%;color:#545454;box-sizing:content-box;}
.v_graph span span{font-size:12px;line-height:20px}

.v_graph2{padding:10px 0 30px 0; width:50%;box-sizing:content-box;}
.v_graph2 ul{height:130px;margin:0; padding:0; border:1px solid #ddd;border-top:0;border-right:0;font-size:11px;font-family:Tahoma, Geneva, sans-serif;list-style:none;box-sizing:content-box;}
.v_graph2 ul:after{display:block;clear:both;content:""}
.v_graph2 li{display:inline;float:left;position:relative;width:8%;height:100%;margin:0 3%;text-align:center;white-space:nowrap;box-sizing:content-box;}
.v_graph2 .g_term{display:inline-block;position:relative;width:100%;height:30px;margin:0 -100% -30px 0;padding:130px 0 0 0;font-weight:700;color:#545454;line-height:20px;vertical-align:bottom; font-size:11px;box-sizing:content-box;}
.v_graph2 .g_bar01{display:inline-block;position:relative;width:100%;margin:-1px 0 0 0;border:1px solid #cc9f9d;border-bottom:0;background:#f8f1f1;vertical-align:bottom;box-sizing:content-box;}
.v_graph2 .g_bar02{display:inline-block;position:relative;width:100%;margin:-1px 0 0 0;border:1px solid #c8cc9d;border-bottom:0;background:#f8f8f1;vertical-align:bottom;box-sizing:content-box;}
.v_graph2 .g_bar03{display:inline-block;position:relative;width:100%;margin:-1px 0 0 0;border:1px solid #9dccc7;border-bottom:0;background:#f1f8f7;vertical-align:bottom;box-sizing:content-box;}
.v_graph2 .g_bar04{display:inline-block;position:relative;width:100%;margin:-1px 0 0 0;border:1px solid #9db6cc;border-bottom:0;background:#f1f5f8;vertical-align:bottom;box-sizing:content-box;}
.v_graph2 .g_bar05{display:inline-block;position:relative;width:100%;margin:-1px 0 0 0;border:1px solid #9f9dcc;border-bottom:0;background:#f1f1f8;vertical-align:bottom;box-sizing:content-box;}
.v_graph2 .g_bar06{display:inline-block;position:relative;width:100%;margin:-1px 0 0 0;border:1px solid #cc9dc7;border-bottom:0;background:#f8f1f8;vertical-align:bottom;box-sizing:content-box;}
.v_graph2 .g_bar span{position:absolute;top:-20px;left:0;width:100%;color:#545454}

/******* 교통·편의시설 css ******/
.btn-map{font-size: 1.0em;padding: 5px 10px;}


/******* 게시판 css ******/
.popup-view{width:100%;border-top:2px solid #236dc7;}
.popup-title-box{padding: 20px 10px 10px 10px;border-bottom: 1px dashed #333;}
.popup-title-box > .title{font-size: 2.0em;font-weight: 500;}
.popup-info{margin: 15px 0;}
.popup-info > .date, .popup-info > .hit{font-size: 1.2em;}
.popup-info > .hit{margin-left: 20px;}
.popup-file-box{background:#fafafa;padding: 10px 15px;border-bottom: 1px solid #bbb;}
.popup-file-box > p{margin: 5px 0;font-size: 1.3em;}
.file{font-size: 1.0em;color:#666;font-weight:400;}
.file:hover{text-decoration: underline;}
.file > i{margin: 0 10px}
.popup-contents{padding:30px;border-bottom: 1px solid #bbb;font-size: 1.3em !important;min-height: 200px;}
.popup-contents  span, .popup-contents  p, .popup-contents  div{font-size: 1.0em;}
.popup-contents > span{font-size: 1.1em !important;}
.popupBtn{margin:30px 0;}
.board-photo{max-width: 100%;}

/******* 자주하는질문 css ******/
.tab_faq{width:100%;}
.tab_faq > ul{}
.tab_faq > ul > li{display: inline-block;width: 20%;text-align: center;float: left;border: 1px solid #ddd;border-right:none;}
.tab_faq > ul > li:last-child{border-right: 1px solid #ddd;}
.tab_faq > ul > li > a{display: inline-block;width: 100%;padding: 15px 0;color: #333;font-size: 1.2em;}
.tab_faq > ul > li.active-tab{border: 3px solid #114ab0;}
.tab_faq > ul > li.active-tab > a{color: #114ab0;font-weight: 600;}
.team_1, .team_2, .team_3, .team_4, .team_5, .team_6, .team_7{color:#fff;font-size: 1.0em;font-weight:300;padding: 3px 10px;}
.team_1{background:#0c7c2d;}
.team_2{background:#92c755;}
.team_3{background:#f55145;}
.team_4{background:#f1709c;}
.team_5{background:#7150ac;}
.team_6{background:#1b76b1;}
.team_7{background:#0d1960;}


/******* 인권경영 css ******/
.human-text-box{width: 100%;padding: 25px;background: #f1f3ff;}
.human-text-box > h4{font-size: 1.8em;margin-bottom: 10px;}
.human-text-box > p{font-size: 1.3em;}

.human-text-box02{width: 100%;padding: 25px;}
.human-text-main{position:relative;display:inline-block;}
.human-text-main::before{content:'';width:100%;height:3px;background-color: lightskyblue;position:absolute;top:17px;opacity: 0.5;}
.human-text-box02 > p{font-size:1.3em;}
.human-text-box02 > p > span{background-color:#0a4996;color:#fff;width:10px;height:10px;font-size:1.2em;padding: 1px 10px;margin-right: 10px;}
.human-img{width:150px;height:160px;margin: 0 auto;background:url('/resources/img/badge.png') center 20px no-repeat;background-color:#0a4996;background-size: 80px;position:relative;}
.human-img::before{content:'';width:0px;height:0px;position:absolute;top: 121px;right:-1px;border-left: 76px solid transparent;border-right: 76px solid transparent;border-bottom:40px solid #fff;}
.human-border{border-top:2px solid #d8d8d8;border-bottom:2px solid #d8d8d8;margin: 10px 0 50px 0;padding:10px;}

 .human-img02{width:150px;height:160px;margin: 0 auto;background:url('/resources/img/badge.png') center 20px no-repeat;background-color:#3b9a3f;background-size: 80px;position:relative;}
.human-img02::before{content:'';width:0px;height:0px;position:absolute;top: 121px;right:-1px;border-left: 76px solid transparent;border-right: 76px solid transparent;border-bottom:40px solid #fff;}
.human-text-box03{padding: 30px;margin-bottom:20px;}
.human-text-box03 > p{font-size:1.3em;margin:20px 20px 50px 20px;}
.human-text-box03 > p > span{/* background-color: #3a993e; */color: #3b9a3f;font-weight: 600;/* width:10px; *//* height:10px; */font-size: 1.4em;padding: 1px 10px;/* margin-right: 10px; */}
.human-text-box03 > h4{font-size: 2.5em;margin: 20px 0;color: #3b9a3f;}
.human-border02{padding: 20px;background-color: #deeade;}
.human-border02 > p {font-size:1.3em;}


.open-info-btn{margin-top: -150px;margin-left: 100px;display:inline-block;}
.open-info-btn a {font-size:1.3em;background-color:#2060c6;padding:5px 10px;border-radius:5px;color:#fff;}
.open-info-btn a:hover{background-color: #ffffff;transition:.3s;border: 1px solid #2060c6;color: #2060c6;}

.cleaneye{margin-top: -165px;margin-left: 20px;display:inline-block;}
.cleaneye a{font-size:1.3em;background-color:#2060c6;color:#fff;padding:5px 10px;display:block;border-radius:5px;margin-top: 10px;border: 1px solid #2060c6;}
.cleaneye a:hover{background-color: #ffffff;transition:.3s;border: 1px solid #2060c6;color: #2060c6;}
.cleaneye-p{font-size: 1.5em;margin: 20px 0;}
.cleaneye-box{background:url('/resources/img/openInfo/cleaneye.png') center no-repeat;padding-top: 400px;}

/* 인권경영 위원회 구성 */
.depart-human{background: url('/resources/img/human/humanright_organization.png') center 115px no-repeat;}
.depart-human ul{margin-bottom:300px;height:101px;margin-left: 2%;}
.depart-human ul:last-child{margin-bottom:0}
.depart-human > ul > li.inner{width: 29%;height:106px;margin-right:39px;border-radius:5px;border:1px solid #e3e3e3;float:left;background:#fff;}
.depart-human > ul > li.inner:last-child{margin-right:0;}
.depart-human > ul > li.outer{width: 48%;height:106px;border-radius:5px;border:1px solid #e3e3e3;float:left;background:#fff;}
.depart-human > ul > li.outer:nth-child(1){margin-right: 15px;}
.depart-human > ul > li.outer:nth-child(2){margin-right: 15px;}
.depart-human > ul > li.outer:nth-child(3){margin-right: 15px;}
.depart-human > ul > li.outer:nth-child(4){margin-right:0;}
.depart-human li.last{margin-right:0;}
.depart-human li .depart_tit{text-align:center;padding:12px 0;border-radius:5px 5px 0 0;}
.depart-human li .depart_tit h6{color:#fff;font-size:16px;font-weight:700;}
.depart-human li .depart_body{height:211px;position:relative;/* width: 57%; */}
.depart-human li .depart_body ul{width:200px;height:211px;padding:22px 0 10px 5px;margin-bottom:0;}
.depart-human li .depart_body2{height:211px;position:relative;}
.depart-human li .depart_body2 ul{width: 208px;height:211px;padding:12px 0 10px 5px;margin-bottom:0;}
.depart-human li .depart_body .btn_group{position:absolute;bottom:14px;left:26%;}
.depart-human .operation li{height:auto;position:relative;}
.depart-human .operation li::after{content:url('/resources/img/human/arrow_operation.png');position:absolute;left:260px;top:50%;width:24px;height:23px;}
.depart-human .operation .depart_body{padding:25px;height:160px}

/* 윤리경영 위원회 구성 */
.depart-human2{background: url('/resources/img/human/ethics_organization.png') center 115px no-repeat;}
.depart-human2 ul{margin-bottom:300px;height:101px;margin-left: 2%;}
.depart-human2 ul.last-ul {margin-left: 33%;}
.depart-human2 ul:last-child{margin-bottom:0}
.depart-human2 > ul > li.inner{width: 15%;height:106px;margin-right:39px;border-radius:5px;border:1px solid #e3e3e3;float:left;background:#fff;}
.depart-human2 > ul > li.inner:last-child{margin-right:0;}
.depart-human2 > ul > li.outer{width: 48%;height:106px;border-radius:5px;border:1px solid #e3e3e3;float:left;background:#fff;}
.depart-human2 > ul > li.outer:nth-child(1){margin-right: 15px;}
.depart-human2 > ul > li.outer:nth-child(2){margin-right: 15px;}
.depart-human2 > ul > li.outer:nth-child(3){margin-right: 15px;}
.depart-human2 > ul > li.outer:nth-child(4){margin-right:0;}
.depart-human2 li.last{margin-right:0;}
.depart-human2 li .depart_tit{text-align:center;padding:12px 0;border-radius:5px 5px 0 0;}
.depart-human2 li .depart_tit h6{color:#fff;font-size:16px;font-weight:700;}
.depart-human2 li .depart_body{height:211px;position:relative;/* width: 57%; */}
.depart-human2 li .depart_body ul{width:200px;height:211px;padding:22px 0 10px 5px;margin-bottom:0;}
.depart-human2 li .depart_body2{height:211px;position:relative;}
.depart-human2 li .depart_body2 ul{height:211px;padding:12px 0 10px 5px;margin-bottom:0;}
.depart-human2 li .depart_body .btn_group{position:absolute;bottom:14px;left:26%;}
.depart-human2 .operation li{height:auto;position:relative;}
.depart-human2 .operation li::after{content:url('/resources/img/human/arrow_operation.png');position:absolute;left:260px;top:50%;width:24px;height:23px;}
.depart-human2 .operation .depart_body{padding:25px;height:160px}


/*		인권경영 추진체계 	  */
.depart2{background:url('../img/sub06/organization_01.png') center 265px no-repeat;}
.depart2 ul{margin-bottom:300px;height:190px;}
.depart2 ul:last-child{margin-bottom:0}
.depart2 > ul > li{width: 30%;height:156px;/* margin-right:41px; */margin: 0 2%;border-radius:5px;border:1px solid #e3e3e3;float:left;background:#fff;}
.depart2 li.last{margin-right:0;}
.depart2 li .depart_tit, .organization li .organiz_tit{text-align:center;height:40px;padding:12px 0;border-radius:5px 5px 0 0;}
.depart2 li .depart_tit h6, .organization li .organiz_tit h6{color:#fff;font-size:16px;font-weight:700;}
.depart2 li .depart_body{height:211px;position:relative;}
.depart2 li .depart_body ul{width:215px;height:211px;padding:22px 0 10px 5px;margin-bottom:0;}
.depart2 li .depart_body .btn_group{position:absolute;bottom:14px;left:26%;}
.depart2 .operation li{height:auto;position:relative;}
.depart2 .operation li::after{content:url('../img/sub04/arrow_operation.png');position:absolute;left:260px;top:50%;width:24px;height:23px;}
.depart2 .operation .depart_body{padding:25px;height:160px}

/* 인권경영  추진체계*/
.depart3 ul{margin-bottom:300px;height:190px;}
.depart3 ul:last-child{margin-bottom:0}
.depart3 > ul > li{width: 48%;height:100px;/* margin-right:41px; */margin: 0 1%;border-radius:5px;float:left;background:#fff;}
.depart3 li.last{margin-right:0;}
.depart3 li .depart_tit{text-align:center;height:100px;padding:35px 0;border-radius:5px;}
.depart3 li .depart_tit h6{color:#fff;font-size:20px;font-weight:700;}
.depart3 .operation li{height:auto;position:relative;}
.depart3 .operation li::after{content:url('../img/sub04/arrow_operation.png');position:absolute;left:260px;top:50%;width:24px;height:23px;}
.depart3 .operation .depart_body{padding:25px;height:160px}

/* 윤리경영 추진체계 */
.depart4 ul{margin-bottom:300px;height:190px;}
.depart4 ul:last-child{margin-bottom:0}
.depart4 > ul > li{width: 31%;height:100px;margin: 0 1%;border-radius:5px;float:left;background:#fff;}
.depart4 li.last{margin-right:0;}
.depart4 li .depart_tit{text-align:center;height:100px;padding:35px 0;border-radius:5px;}
.depart4 li .depart_tit h6{color:#fff;font-size:20px;font-weight:700;}
.depart4 .operation li{height:auto;position:relative;}
.depart4 .operation li::after{content:url('../img/sub04/arrow_operation.png');position:absolute;left:260px;top:50%;width:24px;height:23px;}
.depart4 .operation .depart_body{padding:25px;height:160px}

.depart5 ul{margin-bottom:300px;height:190px;}
.depart5 ul:last-child{margin-bottom:0}
.depart5 > ul > li{width: 31%;height:100px;margin: 0 1%;border-radius:5px;float:left;background:#fff;}
.depart5 li.last{margin-right:0;}
.depart5 li .depart_tit{text-align:center;height:100px;padding:25px 0;border-radius:5px;}
.depart5 li .depart_tit h6{color:#fff;font-size:20px;font-weight:700;}
.depart5 li .depart_tit p{color:#fff;font-size:1.2em;}
.depart5 .operation li{height:auto;position:relative;}
.depart5 .operation .depart_body{padding:25px;height:160px}

.depart6 ul{margin-bottom:300px;height:190px;}
.depart6 ul:last-child{margin-bottom:0}
.depart6 > ul > li{width: 30%;height:215px;margin: 0 2%;border-radius:5px;border:1px solid #e3e3e3;float:left;background:#fff;}
.depart6 li.last{margin-right:0;}
.depart6 li .depart_tit, .organization li .organiz_tit{text-align:center;height:40px;padding:12px 0;border-radius:5px 5px 0 0;}
.depart6 li .depart_tit h6, .organization li .organiz_tit h6{color:#fff;font-size:16px;font-weight:700;}
.depart6 li .depart_body{height:211px;position:relative;}
.depart6 li .depart_body ul{width:200px;height:211px;padding:22px 0 10px 5px;margin-bottom:0;}
.depart6 li .depart_body .btn_group{position:absolute;bottom:14px;left:26%;}
.depart6 .operation .depart_body{padding:25px;height:160px;}

.depart7 > ul > li{width: 18%;margin: 0 1%;float:left;}
.depart7 li.last{margin-right:0;}
.depart7 li .depart_tit{text-align:center;padding: 25px 0;border-radius:5px;}
.depart7 li .depart_tit h6{color:#fff;font-size: 1.5em;font-weight:700;}
.depart7 .operation .depart_body{padding:25px;height:160px;}

.depart8 > ul > li{width: 23%;margin: 0 1%;float:left;border-radius: 5px;border: 3px solid #28bad9;}
.depart8 li.last{margin-right:0;}
.depart8 li .depart_tit{text-align:center;padding: 25px 0;border-radius:5px;}
.depart8 li .depart_tit h6{font-size: 1.5em;font-weight:700;}
.depart8 .operation .depart_body{padding:25px;height:160px;}

span.sign {background: none !important;color: #000 !important;}


/********left menu*******/
.left-area{width: 85%;}
.left-bg{position: relative;width: 19.3%;background: linear-gradient(90deg, #247AB5, #203E7B);background-size: cover;padding: 50px 0;height: 181px;box-shadow: 8px 2px 17px 2px rgba(0, 0, 0, 0.2);}
.left-bg2{position: relative;width: 19.3%;    background: linear-gradient(90deg, #006055, #002341);background-size: cover;padding: 50px 0;height: 181px;box-shadow: 8px 2px 17px 2px rgba(0, 0, 0, 0.2);}
.sidemenu_title{background:url(/resources/img/lnb_icon01.png) no-repeat center -5px;margin: 0;padding: 0;padding-top:46px;color: #fff;font-weight: 500;text-align: center;font-size: 2.0em;height:80px;}
.sidemenu_subtitle{color: #fed33f;font-size: 1.2em;font-weight: 500;text-align: center;}
.sidebar-nav {background-color: #fff;margin: 0;  padding: 0;font-size: 1.0em;padding-top: 10px;}
.sidebar-nav li {padding: 0;list-style: none;}
.sidebar-nav li.category-menu {margin-bottom: 10px;}
.sidebar-nav li:last-child {border-bottom:none;}
.sidebar-nav li a > i {margin: 2px 5px 0 0;font-size: 0.5em;color: #999;}
.sidebar-nav li a {display: block;padding: 10px 15px;color: #5a5a5a;text-decoration: none;background-color: #f3f3f3;}
.sidebar-nav li a.menu {position: relative;background-color: #fff;color: #333;font-size: 1.18em;font-weight:500;padding: 13px 10px;box-shadow: 8px 8px 17px 2px rgba(0, 0, 0, 0.2);}
.sidebar-nav li a.menu{border: 2px solid #3f51b5;color: #3f51b5;}
.sidebar-nav li a.happycall-menu{border: 2px solid #006055;color: #006055;}
.sidebar-nav li a.close{border: 2px solid #d7d7d7;color: #5a5a5a;background: #fff;box-shadow: none;}
.sidebar-nav li a.close > i{transform: rotate(-90deg);color: #aaa !important;}
.category-icon{color: #3f51b5 !important;font-size: 1.3em !important;}
.happycall-category-icon{color: #006055 !important;}
.sidebar-nav li a.menu:hover i {color:#fff;}
.sidebar-nav li a.submenu {background-color: #fff;}
.sidebar-nav > li > a.no-toggle:after {content: none;}
.sidebar-nav li a.collapsed {background-color: transparent;}
.sidebar-nav li a.submenu:hover {background-color: #f3f3f3;}

.menu-submenu{border:none !important;padding: 15px 7px;background: rgba(244, 246, 250, 1);}
.menu-submenu[aria-expanded="false"]{display:none;}
.menu-submenu li a {padding:5px 15px;background-color: transparent;font-size: 1.1em;}
.menu-submenu li a::before {content: url(/resources/img/sub-micon03.png);padding-right: 5px;}
.menu-submenu li a:hover {color: #3f51b5;text-decoration: underline;outline: thin dotted;}
.menu-submenu li.active a {background-color: #f3f3f3;}


/********responsive menu*******/
.site-container, .sb-slidebar, body, html {margin: 0;padding: 0;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.site-container, .sb-slide, .sb-slidebar {-webkit-transform: translate(0px);-moz-transform: translate(0px);-o-transform: translate(0px);transform: translate(0px);-webkit-transition: -webkit-transform 400ms ease;-moz-transition: -moz-transform 400ms ease;-o-transition: -o-transform 400ms ease;transition: transform 400ms ease;-webkit-transition-property: -webkit-transform,left,right;-webkit-backface-visibility: hidden;}
.sb-slidebar {width: 80%;height: 100%;overflow-y: auto;position: fixed;top: 0;z-index: 0;display: none;background-color: #fff;}
.sb-slidebar, .sb-slidebar * {-webkit-transform: translateZ(0px);}
.sb-left {left: 0;box-shadow: 0px 0px 10px #333;background: rgba(244, 246, 250, 1);}
.sb-style-overlay {z-index: 9999;}
.sb-slidebar.sb-active {display: block;}

.wrap-side{display:block;width: 100%;height: 80px;padding: 20px 10px;}
.brand-logo {display:inline-block;float:left;}
/* .close-responsive{display:inline-block;float:right;}												 */
.close-responsive{display:inline-block;float:right;background:url(/resources/img/close01.png) no-repeat;padding: 16px;margin-top: 5px;}
.close-responsive > i{font-size: 2.5em;padding-top: 10px;}
.responsive-sns-nav{padding-top:10px;}
.res-sns-btn{display: inline-block;padding: 23px 10px;}	
.res-sns-btn img{width:35px;}

.response-nav li {padding: 0;list-style: none;}
.response-nav li.category-menu {margin-bottom: 10px;}
.response-nav li:last-child {border-bottom:none;}
.response-nav li a > i {margin: 2px 5px 0 0;font-size: 0.5em;color: #fff;}
.response-nav li a {display: block;padding: 10px 15px;color: #5a5a5a;text-decoration: none;background-color: #f3f3f3;}
.response-nav li a.menu {position: relative;background-color: #fff;color: #333;font-size: 1.3em;font-weight:500;padding: 13px 15px;box-shadow: 8px 8px 17px 2px rgba(0, 0, 0, 0.2);}
/* .response-nav li a.menu {position: relative;background-color: #fff;color: #333;font-size: 1.18em;font-weight:500;padding: 13px 15px;box-shadow: 8px 8px 17px 2px rgba(0, 0, 0, 0.2);} 	*/
/* .response-nav li a.menu{background: #3f51b5;color: #fff;} 										*/
/* .response-nav li a.close{background: #3f51b5;color: #fff;} 										*/
.response-nav li a.menu{background: #009688;color: #fff;}
.response-nav li a.close{background: #004a85;color: #fff;}
.response-nav li a.close > i{transform: rotate(-90deg);color: #fff !important;}
.response-nav li a.menu:hover i {color:#fff;}
.response-nav li a.submenu {background-color: #fff;}
.response-nav > li > a.no-toggle:after {content: none;}
.response-nav li a.collapsed {background-color: transparent;}
.response-nav li a.submenu:hover {background-color: #f3f3f3;}
/* .response-nav li.category{ border-top: 1px solid #2e3238;} 									*/										
/* .response-nav li.category a{background:#5a5a5a;} 											*/
.response-nav li.category a{background:#8b8b8b url(/resources/img/response-minus.png) no-repeat 93% 12px;}
.response-nav li.category a.close {background: #8b8b8b url(/resources/img/response-plus.png) no-repeat 93% 12px;color: #fff;}
.response-nav li.category a.res-new{background:#8b8b8b url('/resources/img/response-new.png') no-repeat 93% 12px;}
.response-nav li.category a.res-arrow{background:#8b8b8b url('/resources/img/response-arrow.png') no-repeat 93% 12px;}

.response-menu-submenu{display:none;border:none !important;background: rgba(244, 246, 250, 1);}
.response-menu-submenu li a {padding:5px 15px;background-color: transparent;font-size: 1.1em;}
.response-menu-submenu li a::before {content: url(/resources/img/sub-micon03.png);padding-right: 5px;}
.response-menu-submenu li a:hover {color: #3f51b5;text-decoration: underline;outline: thin dotted;}
.response-menu-submenu li.active a {background-color: #f3f3f3;}
/* .sub-toggle{padding: 8px 0 !important;color: #fff !important;padding-left: 15px !important;padding-right: 10px !important;} 					*/
.sub-toggle{padding: 10px 0 !important;color: #fff !important;padding-left: 15px !important;padding-right: 10px !important;}
.sub-toggle::before{content: "" !important;}

.response-site-icon{color: #fff !important;font-size: 1.3em !important;}
.response-category-icon{color: #fff !important;font-size: 1.3em !important;}

.module{padding: 10px 15px;}
.module li a{background: transparent !important;}


.happycall-response-nav li a.menu {background: #218279;}

.response-nav03 li {padding: 0;list-style: none;}
.response-nav03 li.category-menu {margin-bottom: 10px;}
.response-nav03 li:last-child {border-bottom:none;}
.response-nav03 li a > i {margin: 2px 5px 0 0;font-size: 0.5em;color: #fff;}
.response-nav03 li a {display: block;padding: 10px 15px;color: #5a5a5a;text-decoration: none;background-color: #f3f3f3;}
.response-nav03 li a.menu {position: relative;background-color: #fff;color: #333;font-size: 1.5em;font-weight:500;padding: 13px 15px;/* box-shadow: 8px 8px 17px 2px rgba(0, 0, 0, 0.2); *//* border-bottom: 1px solid #c8e7ff99; */}
.response-nav03 li a.menu{background: #0064b3;color: #ffffff;/* border-bottom: 1px solid #d6edff; */}
.response-nav03 li a.close{background: #ffffff;color: #0076d4;}
.response-nav03 li a.close > i{transform: rotate(-90deg);color: #2196f3 !important;}
.response-nav03 li a.menu:hover i {color: #2196f3;}
.response-nav03 li a.submenu {background-color: #fff;}
.response-nav03 > li > a.no-toggle:after {content: none;}
.response-nav03 li a.collapsed {background-color: transparent;}
.response-nav03 li a.submenu:hover {background-color: #f3f3f3;}
.response-nav03 li.category{border: 1px solid #e0e0e0;}
.response-nav03 li.category:first-child{border-top:none;}
.response-nav03 li.category a{background: #ffffff;}
.response-nav03 li.category a.close {background: #ffffff;border-bottom: 1px solid #e0e0e0;}

.response-menu-submenu03{display:none;border:none !important;background: rgb(247 247 247);}
.response-menu-submenu03 li a {padding:5px 15px;background-color: transparent;font-size: 1.2em;}
.response-menu-submenu03 li a::before {content: url(/resources/img/sub-micon03.png);padding-right: 5px;}
.response-menu-submenu03 li a:hover {color: #007bdc;text-decoration: underline;outline: thin dotted;}
.response-menu-submenu03 li.active a {background-color: #f3f3f3;}
.sub-toggle03{padding: 8px 0 !important;/* color: #fff !important; */padding-left: 15px !important;padding-right: 10px !important;}
.sub-toggle03::before{content: "" !important;}


/********happycall responsive menu*******/
.response-nav02 li {padding: 0;list-style: none;}
.response-nav02 li.category-menu {margin-bottom: 10px;}
.response-nav02 li:last-child {border-bottom:none;}
.response-nav02 li a > i {margin: 2px 5px 0 0;font-size: 0.5em;color: #fff;}
.response-nav02 li a {display: block;padding: 10px 15px;color: #5a5a5a;text-decoration: none;background-color: #f3f3f3;}
.response-nav02 li a.menu {position: relative;background-color: #fff;color: #333;font-size: 1.5em;font-weight:500;padding: 13px 15px;/* box-shadow: 8px 8px 17px 2px rgba(0, 0, 0, 0.2); */}
.response-nav02 li a.menu{background: #218a80;color: #fff;}
.response-nav02 li a.close{background: #ffffff;color: #218a80;}
.response-nav02 li a.close > i{transform: rotate(-90deg);color: #218a80 !important;}
.response-nav02 li a.menu:hover i {color: #218a80;}
.response-nav02 li a.submenu {background-color: #fff;}
.response-nav02 > li > a.no-toggle:after {content: none;}
.response-nav02 li a.collapsed {background-color: transparent;}
.response-nav02 li a.submenu:hover {background-color: #f3f3f3;}
.response-nav02 li.category{border-bottom: 1px solid #e0e0e0;}
.response-nav02 li.category a{background: #ffffff;}
.response-nav02 li.category a.close {background: #ffffff;}


.response-menu-submenu02{display:none;border:none !important;background: rgba(244, 246, 250, 1);}
.response-menu-submenu02 li a {padding:5px 15px;background-color: transparent;font-size: 1.1em;}
.response-menu-submenu02 li a::before {content: url(/resources/img/sub-micon03.png);padding-right: 5px;}
.response-menu-submenu02 li a:hover {color: #1f8278;text-decoration: underline;outline: thin dotted;}
.response-menu-submenu02 li.active a {background-color: #f3f3f3;}
.sub-toggle02{padding: 8px 0 !important;color: #000 !important;padding-left: 15px !important;padding-right: 10px !important;}
.sub-toggle02::before{content: "" !important;}

.res-btns{margin-top: 20px;}
.res-btn{display: inline-block;padding: 10px;border: 1px solid #d0d0d0;width: 45%;margin:0 1%;color:#666;}


/************************************
Main Page Custom
************************************/

.main-section1{background: url('/resources/img/bg_01.png') no-repeat;background-size: cover; background-position: top center; padding: 30px 0;}
.weather{width: 260px;height: 120px;display: inline-block;}
.weather > .icon{display: inline-block;float: left;width: 70px;height: 120px;padding-top: 17px;}
.weather > .icon > img{width: 70px;}
.weather > .text{display: inline-block;float: left;width: 190px;height: 120px;padding-top: 15px;padding-left: 15px;}
.weather > .text > p{color: #2B3E61;font-weight: 400;margin: 0 !important;}
.weather > .text > p.temper{font-size: 1.5em;font-weight: 700;}
.weather > .text > p.dust{margin-top: 5px !important}
.weather > .text > p.dust > span{padding: 5px 10px;background: green;border-radius: 15px;color: #fff;}
.main-container{padding: 10px 0 40px 0;outline:none;}

.popup-section{float: left;display: inline-block;max-width: 750px;width: 100%;box-shadow: 15px 15px 25px 6px rgba(0, 0, 0, 0.2);}
.popup-container{width: 100%;font-weight: 700;}
.swiper{position: relative;height: 100%;}
.area-prev, .area-next{background-size: 27px 44px !important;position: absolute;top: 400px;}
.area-prev{left: 5% !important;}
.area-next{right: 5% !important;}
.area-pagination{display: inline-block;width: 275px;height: 120px;padding: 25px 0;text-align: left !important;}
.area-pagination > span.swiper-pagination-bullet{margin: 5px;width: auto;height: auto;border-radius: 0;padding: 15px;color: #fff;opacity: 1;font-size: 1.2em;background: rgba(0,0,0,0.2);}
.swiper-pagination-bullet-active {opacity: 1;background: #007aff !important;}
.swiper2{width: 100%;height: auto;}
.swiper-button-next, .swiper-button-prev{background: transparent;top: 600px;}
.swiper-button-next {background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E") !important;}
.swiper-button-prev{background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E") !important;}
.popup-link > img{width: 100%;max-height: 350px;}
.popup-control{position: absolute;bottom: 0;right: 0;background-color: rgba(0, 0, 0, 0.7);z-index: 1;}
.popup-btn{display:inline-block;}
.popup-prev, .popup-next{padding: 20px;height: 100% !important;}
.popup-prev{border-right: 1px solid #aaa;}


/* 공단소식 Tab NEW(웹접근성 준수) */
.notice-area{margin-top:20px;display: inline-block;float: left;}
.tab_main{position:relative;width:750px;height:300px;overflow:hidden;box-shadow: 15px 15px 25px 6px rgba(0, 0, 0, 0.20);}
.tab_main ul{position:relative;margin:0;padding:0;list-style:none;font-size:12px;*zoom:1;background: rgba(255,255,255,0.85);}
.tab_main ul:after{content:"";display:block;clear:both;}
.tab_main ul li{float:left;border-right: 1px solid #134896;}
.tab_main ul li:last-child{border-right: none;}
.tab_main ul li a{position:relative;float:left;text-decoration:none;background:#fafafa;color:#666;border-bottom:1px solid #d7d7d7;border-left:none;}
.tab_main ul li a.tab_on:first-child{border-left:none;}
.tab_main ul li a.tab_on{width:175px;height:48px;padding:6px 0;font-size:19px;font-weight:400;text-align:center;background: #1e56a9;color: #fff;}
.tab_main ul li a span{display:inline-block;letter-spacing:-1px;padding-top:4px;cursor:pointer;font-size: 0.9em;}
.tab_main ul li a.tab_on span{display:inline-block;}
.tab_main ul li ul{width:100%;height:250px;position:absolute;top:47px;left:0;list-style:none;border:0;margin:0;padding:0;*zoom:1;}
.tab_main ul li li{float:none;position:relative;background:url(/resources/img/bullet_list.png) no-repeat left 6px;font-size:12px;margin: 19px 25px;line-height:1;color:#999}
.tab_main ul li li:first-child{}
.tab_main ul li li a{float:none;padding:0;margin:0;border:0 !important;color:#464646 !important;display:inline-block;white-space:nowrap;word-wrap:normal;overflow:hidden;text-overflow:ellipsis;font-weight:normal;background:transparent;padding-left:15px;font-size:17px;font-weight: 300;width:85%;}
.tab_main ul li li a:hover{color: #19699c!important;font-weight: 400;}
.tab_main ul li li a:active{color: #19699c!important;font-weight: 400;}
.tab_main ul li li a:focus{color: #19699c!important;font-weight: 400;}
.tab_main ul li li time, .tab_main li li .time{position:absolute;top:0;right:0;color:#464646;line-height:1.0;margin-right:10px;font-size:17px;font-weight: 300;}
.tab_main ul li li.more{position:absolute;background:none !important;top:-65px;margin-left:697px;width:58px;height:50px;}
.tab_main ul li li.more a{margin-left:-10px;}
.tab_main ul li.active a{text-overflow:ellipsis;color:#fff;border-bottom:none;}
.tab_main ul li.active a.tab_on{background: #fff !important;}
.tab_main ul li.active a span{font-weight:400;color: #333;}
.tab_main.jx{height:auto}
.tab_main.jx ul{border:0}
.tab_main.jx li{float:none;position:relative}
.tab_main.jx li a{float:none;display:block;font-weight:bold;color:#333;border:1px solid #eee !important;border-bottom-color:#ccc !important;background:#fafafa !important}
.tab_main.jx li ul{position:static;display:block;left:0;top:0;padding:5px 0}
.tab_main.jx li li a{display:inline;border:0 !important;background:none !important;font-weight:normal}
.tab_list > li{border-right: none !important;}


.nav-section{display: inline-block;width: 430px;height: auto;margin-left: 20px;}
.nav-section > .box1 {position: relative;width: 100%;height: 273px;}
.nav-section > .box1 > a{display:block;width: 100%;height: 100%;box-shadow: 15px 15px 25px 6px rgba(0, 0, 0, 0.2);background :url('/resources/img/smart-parking.jpg')no-repeat;background-size:cover;}
.nav-section > .box1 > ul.qr-box {position:absolute;bottom: 10px;left: 20px;}
.nav-section > .box1 > ul.qr-box li{display:inline-block;margin-right: 25px;}
.nav-section > .box1 > ul.qr-box li a img{width: 85px;}
.nav-section > .box2{width:100%;height:150px;box-shadow: 15px 15px 25px 6px rgba(0, 0, 0, 0.20);/*background: linear-gradient(45deg, #2196f3, #69c342);*/margin-top: 20px;}
.nav-section > .box2 ul li{float:left;width:50%;background-size:50%;}
.nav-section > .box2 ul li:nth-child(1){background: #8b65ce url(/resources/img/box2-bg1.png)no-repeat;background-size: 60%;background-position: 90% 90%;}
.nav-section > .box2 ul li:nth-child(2){background: #15854a  url(/resources/img/box2-bg2.png)no-repeat;background-size: 55%;background-position: 90% 90%;}
.nav-section > .box2 ul li:nth-child(2) a span{background: #1a5e3a;}
.nav-section > .box2 a{color: #fff;display: block;padding: 20px 10px 65px 10px;}
.nav-section > .box2 a h4{font-size: 1.5em;font-weight: 500;margin-bottom: 15px;}
.nav-section > .box2 a span{font-size: 1.2em;background: #654799;padding: 5px 15px;}

@keyframes rotation {
	from {
		left:0;
		transform:translate(0, 0);
	} 50% {
		left:0;
		transform:translate(0, -10%);
	} to {
		left:0;
		transform:translate(0, 0);
	}
}

.nav-section > .box2 > a > span.navbtn{
	display: inline-block;
    max-width: 100%;
    vertical-align: middle;
}

.nav-section > .box2 > a > span.navbtn > span.icon{
	display: inline-block;
    width: 100%;
    margin-bottom: 10px;
}

.nav-section > .box2 > a > span.navbtn > span.text{
	display: inline-block;
    width: 100%;
    color: #fff;
    font-size: 1.2em;
    /* text-shadow: 1px 1px darkslategrey; */
}

.nav-section > .box3{
	width:100%;
	height:200px;
	box-shadow: 15px 15px 25px 6px rgba(0, 0, 0, 0.20);
	margin-top: 20px;
}

.waste-bg{width: 100%;height: 200px;background: url(/resources/img/waste-icon.png) no-repeat;padding: 35px 20px;}
.waste-bg > p{
	margin: 0;
	font-size: 1.1em;
	font-weight: 300;
	text-shadow: 1px 1px darkslategrey;
}

.waste-bg > h4{
	font-size: 1.8em;
	font-weight: 400;
	text-shadow: 1px 1px darkslategrey;
}

.waste-btn, .navi-btn{
	width: 200px;
    height: 40px;
    box-sizing: border-box;
    display: block;
    margin-top: 30px;
    border: 1px solid #ddd;
    background: rgba(0,0,0,0.1);
    font-size: 1.1em;
}

.waste-btn a, .navi-btn a{
	display:block;
}

.waste-btn > a > span, .navi-btn > a > span {
	padding: 10px 15px;
    display: block;
}

.waste-btn > a:hover, .navi-btn > a:hover {
	text-decoration: none;
}

.right-icon{
	padding: 3px 10px 0 0;
	transition: all 0.25s;
}

.waste-btn > a:hover > span > i, .navi-btn > a:hover > span > i {
	padding: 3px 0 0 0;
}

.box-head{
	width: 100%;
	height: 50px;
	background: linear-gradient(to right, #FE7568, #e91e63) !important;
}

.box-title{
	margin: 0;
	padding: 13.5px;
	font-weight: 300;
	font-size: 1.4em;
}

.box-title > i{padding: 5px 7px;font-size: 1.0em;}

.box-contents{
	width: 100%;
	max-height: 222px;
}

.youtube-iframe{width:100%;height:226px;}

.main-section2{
	position: relative;
	background: #fff;
}

.icon-nav{
	width: 100%;
	height:180px;
	background: #fff;
	top: 0;
	border-bottom: 1px dotted #dcdcdc;
}

.nav-title{
	width: 30%;
	height: 150px;
	display: inline;
	float: left;
	background: url('/resources/img/2024service-title.png') no-repeat;
}

.nav-box{
	width: 70%;
	height: 150px;
	display: inline;
	float: left;
	padding: 20px 10px;
}

.nav-box > a{
    display: inline-block;    
    margin: 10px 13px;
}

.nav-box > a > img{
    -webkit-transition: 0.8s all ease;
    -moz-transition: 0.8s all ease;
    -o-transition: all 0.8s;
    transition: 0.8s all ease;
    background: #f4f6f8;
    border-radius: 20px;
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.15);
}

.nav-box > a:hover > img{
    -webkit-transform: rotateY(360deg);
    -moz-transform: rotateY(360deg);
    -o-transform: rotateY(360deg);
    transform: rotateY(360deg);    
}

.nav-box > a > p{
    text-align: center;
    margin: 0;
    color: #333;
    font-size: 1.2em;
    padding-top: 5px;
}

.nav-box > a:hover{
    text-decoration: none !important;
}

.photo-div{	
	display: inline-block;	
	position:relative;
	padding: 30px 0 50px 0;
	width: 100%;
	height: auto;
}

.left-side{
	width: 100%;
	height: 400px;
	display: inline-block;
	float: left;
	padding: 0 15px;
}

.photo-box{
	width: 100%;
    height: 420px;
    background: #fff;
    box-shadow: 15px 15px 25px 6px rgba(0, 0, 0, 0.2);
    padding: 15px;
}

.photo-box > .title{
	width: 100%;
    height: 30px;
    margin: 0 0 15px 10px;
}

.photo-box > .title > span.text{
	font-size: 1.7em;
    color: #333;
}

.right-side{
	width: 30%;
    height: 500px;
    right: 0;
    position: absolute;
}

.right-side > .nav01{
	width: 100%;
	height: 300px;
	border-radius: 20px 0;
	padding: 30px;
	box-shadow: 15px 15px 25px 6px rgba(0, 0, 0, 0.2);
	background: #512c93;
	background-image: url('/resources/img/nav-test3.png'), url('/resources/img/nav-test4.png');
	background-repeat: no-repeat;
	background-position:left, bottom right;
}

.right-side > .nav01 > p.title{
	margin-bottom: 15px;
	font-size: 1.6em !important;
    color: #fff;
    font-weight: 500;
    font-size: 1.2em;
}

.right-side > div > p.text{
	margin: 0;
    color: #fff;
    font-size: 1.2em;
}

.right-side > .nav02{
	width: 100%;
	height: 200px;
	margin-top: 20px;
	padding: 30px;
	border-radius: 0 20px;
	background: /* #fa990a */ #057b70 url('/resources/img/nav-test5.png') no-repeat;
	box-shadow: 15px 15px 25px 6px rgba(0, 0, 0, 0.2);
}

.right-side > .nav02 > p.title{
	margin-bottom: 15px;
	font-size: 1.6em;
    color: #fff;
    font-weight: 500;
}


.board-area{
	width: 100%;
	height: 340px;
	padding: 0 5px;
}

.board-card{
	width: 100%;
	height: 340px;
	border: 1px solid rgba(0,0,0,.2);
}

.board-img{
}

.board-img > a {
	position: relative;
	display:inline-block;
}

.board-img > a > img{
	width:100%;
    height: 200px;
    border-bottom: 1px solid rgba(0,0,0,.2);
}

.board-img > a > span{
	clear: both;
	position: absolute !important;
	z-index: 9;
	display: inline;
	top: 0;
	left: 0;
	width: 80px;
	text-align: center;
	padding: 5px 10px;
	color: #fff;
	background: rgba(25,105,156,.7);
}

.board-text{
	padding: 15px;
}

.board-text a{
	display:block;
}

.board-text > a > span.title{
    font-size: 1.3em;
    font-weight: 400;
    width: 100%;
    height: 3.6em;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;    
    white-space: normal; 
    line-height: 1.2;      
    text-align: left;
    word-wrap: break-word;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    -webkit-line-clamp: 3;
    -ms-line-clamp: 3;
    -moz-line-clamp: 3;  
    -webkit-box-orient: vertical;
    -mox-box-orient: vertical;
    -ms-box-orient: vertical;
}

.board-text > a > span.date{
	color: #333;
    font-weight: 300;
    display: inline-block;
    padding-top: 20px
}



.main-section3{
	width: 100%;
	height: auto;
	display: inline-block;
	padding: 30px 0 70px 0;
	background: #f0f8ff  url('/resources/img/section03-bg.png') no-repeat;
	background-size: initial;
}

.callDiv{
	width: 100%;
	height: 100%;
	padding: 30px 0;
	background: none;
	padding: 0;
}

.call-box{
	display: inline-block;
	float: right; 
	width: 65%;	
	height: auto;
}

.callList{
	padding-top: 50px;	
}

.callList li{
	display: inline-block;
	margin: 7px 10px;
	width: 230px;
	font-size: 1.2em;
}

.callList li >span{
	font-size: 1.0em;
}

.callList li:before{
    display: inline-block;
	width: 7px;
	height: 7px;
	margin-right: 7px;
    margin-bottom: 2px;
	background:url(/resources/img/li-list.png) no-repeat;
	content: '';
}

.main-section4{
	width: 100%;
    height: auto;
}

#banner-slider{
	width: 100%;
	padding: 15px;
	padding: 15px 50px;
}

#banner-slider img{
	margin:2%;
}

.footer01, .footer02{
	clear: both;
	width: 100%;
	display: block;
	border-top: 1px solid #999;
    padding: 20px 0;
}

.footer02{
	padding: 10px 0;
    background: #666;
}

.foot-nav{
	height:60px;
}

.foot-btn{width: 23%;display: inline-block;margin: 10px 10px;padding: 10px 15px;border: 1px solid #999;text-align: center;color: #666;font-size: 1.2em;}
.foot-btn:nth-child(1){color: #0165a5;border: 1px solid #0165a5;font-weight: 500;}
.foot-btn:hover{border: 1px solid #0165a5;color: #0165a5;font-weight:500;}

.address{
	padding: 15px 0;
}

.address-list{
	padding: 10px 0;
}

.address-list li{
	padding: 3px 0;
    font-size: 1.2em;
}

.web-mark{
	display: inline-block;
	float: left;
	padding: 0 30px;
}

.copyright{
	font-size: 1.2em;
}


.facility{
	width:100%;height:360px;background:white;box-shadow: 15px 15px 25px 6px rgba(0, 0, 0, 0.2);
}








/*****************************************************************************
/******************************** input css **********************************
******************************************************************************/

/************* radio ***************/

.form-horizontal .checkbox, .form-horizontal .radio {
    min-height: 30px;
}

input[type=radio].btn-radio, input[type=checkbox].btn-checkbox {
    position: fixed;
    z-index: -50;
    top: -2000px;
}

.btn-checkbox+label:not(:empty) {
    margin: 0 5px 0 0;
    text-indent: 25px;
}
.btn-radio+label:not(:empty){
    margin: 0 30px 0 0;
}

.btn-radio+label, .btn-checkbox+label {
    cursor: pointer;
    display: inline-block;
    margin: 0;
    min-width: 1.34em;
    padding: 0;
    position: relative;
    vertical-align: middle;
}

.btn-radio:checked+label:before {
    border: 2px solid #25476a;
}

.btn-radio:checked+label:before, .btn-checkbox:checked+label:before {
    animation-name: none;
}

.btn-radio+label:before {
    border-radius: 50%;
}

.btn-checkbox+label:before {
    border-radius: 2px;
}

.btn-checkbox:checked+label:before {
    background: #25476a;
    border-color: #25476a;
}

.btn-radio+label:before, .btn-checkbox+label:before {
    border: 1px solid rgba(0,0,0,0.15);
    box-shadow: 0 0 0 0 rgba(0,0,0,0.07);
    content: '';
    display: block;
    height: 17px;
    left: 0;
    position: absolute;
    top: 0;
    width: 17px;
    transition: all 0.3s;
}

.btn-radio:checked+label:after, .btn-checkbox:checked+label:after {
    display: block;
}

.btn-radio+label:after {
    background: #25476a;
    border-radius: 50%;
    height: 9px;
    left: 4px;
    top: 4px;
    width: 9px;
}

.btn-checkbox+label:after {
    border-color: #fff;
    border-style: solid;
    border-width: 0 2px 2px 0;
    box-sizing: border-box;
    height: 13px;
    left: 6px;
    top: 0;
    transform: rotate(48deg);
    width: 6px;
}

.btn-radio+label:after, .btn-checkbox+label:after {
    content: '';
    display: none;
    position: absolute;
}


/*****************************************************************************
/******************************** 메인화면 css **********************************
******************************************************************************/

.section01, .section03{
	width: 100%;	
    height: 100%;
    background: #fff;
}

.contents-box{
	padding:50px 0;
}

.contents-title{
	display: inline-block;
	padding: 5px 0 0 45px;
	margin: 0;
	font-size: 25px;
	color: #393939;
	font-weight:500;
}

.popup-box, .notice-box{
	padding: 30px;
}

.popup-title{
	display: inline-block;
	text-align:center;
	opacity:1;
	margin: 0;
	font-size: 25px;
	color: #fff;
	font-weight:500;
}

.popup-text{
	display: inline-block;
	text-align:center;
	opacity:1;
	margin: 0;
	font-size: 25px;
	color: #fff;
	font-weight:500;
}

.more-btn{
	display: inline-block;	
	background: url(/resources/img/more.png) no-repeat center;
	width: 25px;
	height: 25px;
	margin-top: 5px;
	text-indent: -10000em;
	transition: all .3s ease;
	-ms-transition: all .3s ease;
	-webkit-transition: all .3s ease;
    -o-transition: all .3s ease;
}

.more-btn:hover{
	transform: rotate( 180deg );
}

.notice-icon{
	background: url(/resources/img/notice-icon.png) no-repeat;
	min-height: 35px;
}

.notice-list{
	list-style: none;
	padding-top: 40px;
	padding-left: 0;
}

.notice-list li{
	padding: 10px 0;
}

.notice-list li a{
	background: url(/resources/img/ul_arrow.png) 5px no-repeat;
	color: #393939;
	text-decoration: none;
	padding-left: 25px;
	font-size: 20px;
}

.notice-list li a:hover{
	text-decoration: underline;
	color: #1f4787;
	
}

.notice-list li span.date{
	float:right;
	color: #828282;
	font-size: 17px;
}

.notice-list li:first-child{
	border-bottom: 2px dashed #d3d3d3;
	padding: 0 0 30px 0;
}

.notice-list li:first-child a{
	display: block;
	background: none;
	padding-left: 10px;
}

.notice-list li:first-child span.date{
	display:block;
	float: none;
	padding-left: 10px;
	padding-top: 10px;
}

.notice-list li:nth-child(2){
	padding: 40px 0 10px 0;
}

.popup-icon{
	background: url(/resources/img/popup-icon.png) no-repeat;
}

.popup-btn{
	display:inline-block;
	height: 44px;
}

.popup-btn a{
	position: absolute;
    width: 20px;
    height: 20px;
    right: 70px;
    top: 35px;
    display: block;
    font-size: 0;
    z-index: 1000;
}

.popup-btn a#prev{
	right: 95px;
	background: url(/resources/img/btn_prev_white.png) no-repeat center;
}

.popup-btn a#pause{
	background: url(/resources/img/btn_stop_white.png) no-repeat center;
}

.popup-btn a#play{
	background: url(/resources/img/btn_play_white.png) no-repeat center;
}

.popup-btn a#next{
	right: 45px;
	background: url(/resources/img/btn_next_white.png) no-repeat center;
}

.popup{
	width: 100%;
	margin-top: 15px
}

.img-box{
	width: auto;
	max-width: 360px;
	height: 340px !important;
	overflow:hidden
	
}

.popup-img{
	width: 100%;
	height: 340px !important;
	transform: scale(1);
  	-webkit-transform: scale(1);
  	-moz-transform: scale(1);
  	-ms-transform: scale(1);
 	-o-transform: scale(1);
  	transition: all 0.3s ease-in-out;   /* 부드러운 모션을 위해 추가*/
}

.img-box:hover > .popup-img{
  	transform: scale(1.2);
  	-webkit-transform: scale(1.2);
  	-moz-transform: scale(1.2);
  	-ms-transform: scale(1.2);
  	-o-transform: scale(1.2);
  	transition: transform .5s;
}

.popup-pagination{z-index: 1;position: absolute;padding: 0 15px;bottom:0 !important;margin-bottom:15px;}
.swiper-pagination-bullet{background: #fff !important;width: 20px !important;height: 20px !important;text-align: center;margin: 0 3px !important;opacity: 1 !important;}
.swiper-pagination-bullet-active {color:#fff !important;background: #007aff !important;}

.img-box span.overlay{
	position: absolute;
    display: none;
    top: 0;
    left: 0;
    background: rgba(0,0,0,.5);
    width: 100%;
    height: 340px;    
}

.img-box:hover span{	
    display: block;
}


.section02{
	width: 100%;	
    height: 100%;
    background: url(/resources/img/bg_section.png);
}


.service-title{
	font-size: 1.5em;
}

.address-body{
	padding: 22px !important;
}


.history-date{
	color: #1f4787 !important;
    font-size: 1.4em;
    font-weight: 500;
}

.history-body{
	padding: 10px 15px;
}

.history-body > p{
	margin: 15px;
}

.three_cols > li {
    padding-bottom: 10px;
}

.call01{
	background-image: url('/resources/img/c_030301.png');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

.call02{
	background-image: url('/resources/img/c_030303.gif');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

.call03{
	background-image: url('/resources/img/c_030304.gif');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}


/*****************************************************************************
******************************** 자주하는질문 css ******************************
******************************************************************************/

.qna_list{
    border-top: 4px solid #1f4787;
}

/*****************************************************************************
******************************** 공지사항 css *********************************
******************************************************************************/



.closeSite{
	padding-top: 15px; 
	line-height: 2em;
}

.side-title{
	color: #fff;
	font-size: 15px;
	padding: 10px 0;
}

.nav-dep01{
	padding: 2px 10px 0 0;
}


.response-menu{
	display: inline-block;
    float: right;
}

.response-menu a{
}

.response-menu a > i{
	color: #000;
    vertical-align: middle;
    font-size: 2.2em;
    padding: 25px 5px;
}


.navbar-brand{
	
	height: auto !important;
	line-height: initial !important;
	padding-top: 25px;
    padding-bottom: 18px;
}



.submenu{
	list-style: none;
	margin: 0;
    padding: 0;
}

.submenu li{
	display: block;
	height: 100%;
	padding: 5px 0;
}

.submenu li a{
	color: #333;
}

.submenu li a:hover{
	color: #1f4787;
	font-weight: 700;
}

.snb-ul li.last-bg{
	width:338px;
	height:400px;
	border-left:1px solid #ddd;
}

.nav-menu1{
	float: right;
    width: 322px;
    height: 200px;
    margin-top: 25px;
    border: 1px solid #ddd;
    border-radius: 15px;
}

.call-title{
	text-align: center;
    font-size: 1.8em;
    font-weight: 500;
    margin-top: 30px;
}

.call-number{
	text-align: center;
    font-size: 1.8em;
}

.call-text{
	text-align: center;
	margin-top: 20px;
}

.btn-sitemap{
	width: 170px;
	background-color: #fff;
    border: 1px solid #ddd !important;
    color: #777;
    padding: 6px 12px;
    border-radius: 3px;
    font-size: 13px;
    line-height: 1.475;
    vertical-align: middle;
    transition: all 0.25s;
}

.btn-sitemap:hover{
    border: 1px solid #1f4787 !important;
    color: #1f4787;
}

.nav-menu2{
	float: right; 
	width: 322px; 
	height: 100px;
	margin-top: 25px; 
	border: 1px solid #ddd; 
}

.submenu1, .submenu2{
	width: 160px;
    height: 100px;
    display: inline;
    float: left;
}

.submenu1{
	
}

.navi-info{
	margin-top: 6px; 
	width:100%; 
	height:110px; 
	border:1px solid #ddd;
	border-left:3px solid #1f4787;
	background-color: #fff;
}

.navi-title{
	color: #333;
    margin: 19px 0 0 0;
    font-size: 1.6em;
    font-weight: 500;
}

.navi-text{
	margin-top: 13px;
}

.navi-text a{
	color: #1f4787;	
	display: block;
    width: 100%;
    font-size: 1.2em;
    font-weight: 700;
}

.navi-text a:hover{
	text-decoration: none;
}

.navi-text a > i{
	display: inline-block;
	color: #1f4787;
    margin-right: 10px;
    transition: all 0.25s;
    margin-left: 10px;
}

.navi-text a:hover > i{
    margin-left: 20px;
}

.slider-title{
    color: #333;
    font-size: 2.2em;
    font-weight: 500;
}

.slider-title2{
    color: #fff;
    font-size: 2.2em;
    font-weight: 500;
}

.slider-text{
	color: #333;
	margin: 40px 0;
}

.slider-text2{
	color: #fff;
	margin: 40px 0;
}

.slider-btn{
	width: 170px;
    background-color: #333;
    border: none;
    color: #fff;
    padding: 10px 15px;
    font-size: 15px;
    text-align: left;
    line-height: 1.475;
    vertical-align: middle;
    transition: all 0.25s;
}

.slider-btn2{
	width: 170px;
    background-color: #fff;
    border: none;
    color: #333;
    padding: 10px 15px;
    font-size: 15px;
    text-align: left;
    line-height: 1.475;
    vertical-align: middle;
    transition: all 0.25s;
}

.slider-btn:hover{
    background-color: #1f4787;
}

.slider-btn2:hover{
    background-color: #1f4787;
    color: #fff;
}

.slider-btn > i, .slider-btn2 > i{
	margin-left: 35px;
	transition: all 0.25s;
}

.slider-btn:hover > i, .slider-btn2:hover > i{
	margin-left: 45px;
}

.item1{	
	background: url(/resources/img/ars-01.jpg) no-repeat;
    background-size: cover;
    background-position: bottom;
    height: 500px !important;
    width: 100% !important;
}

.item2{
	background: url(/resources/img/monitoring.jpg) no-repeat;
    background-size: cover;
    background-position: top;
    height: 500px !important;
    width: 100% !important;
}

.item3{
	background: url(/resources/img/call_02.jpg) no-repeat;
    background-size: cover;
    background-position: bottom;
    height: 500px !important;
    width: 100% !important;
}

.item4{
	background: url(/resources/img/network-01.jpg) no-repeat;
    background-size: cover;
    background-position: top;
    height: 500px !important;
    width: 100% !important;
}

.item5{
	background: url(/resources/img/web.jpg) no-repeat;
    background-size: cover;
    background-position: center;
    height: 500px !important;
    width: 100% !important;
}

.business-area{
	position: absolute;
	background-color: rgba(0, 0, 0, .5);
	width: 100%;
	height: 100px;
}

.business-menu{
	text-align: center;
	padding: 35px 0;
	/* border-left: 1px solid #888; */
}

.business-menu:last-child{
	/* border-right: 1px solid #888; */
}

.business-menu a{
	color: #fff;
    font-size: 1.5em;
}

.business-menu a:hover{
	text-decoration: underline;	
}

.qna-img{
    padding-top: 15px;
    padding-left: 10px;
}

.info-content{
	height: 400px;
	padding-top: 20px;	
}

.content-info{
	font-size: 6.5em;
    color: #1f4787;
}

.content-text{
	font-size: 4.5em;
    color: #1f4787;
}


.btn-nav{
	width: 120px;
}

.breadcrumb > li + li:before {
    content: none;
}

.dropdown-menu {
    min-width: 100%;
    margin: 0;
    padding: 0;
    border-top: none;
    border-radius: 0;
    list-style: none;
}

.dropdown-menu li {    
    list-style: none;
}

.dropdown-menu li > a{
	padding: 10px 30px;
}





.nav-btn{
	text-align: center;
}

.nav-btn button{
	cursor: pointer;
    background-color: transparent;
    color: inherit;
    padding: 6px 12px;
    border-radius: 3px;
    border: 1px solid transparent;
    font-size: 13px;
    line-height: 1.475;
    vertical-align: middle;
    transition: all 0.25s;
	background-color: #25476a;
	color: #fff;
	min-width: 12.5%;
}

.nav-btn button:hover, .nav-btn button:focus{
	box-shadow: 0 3px 15px rgba(0,0,0,0.25);
}

.panel-body {
    padding: 0;
}

.qna-category{
	padding: 15px 0;
}

.faq-head{
	border-color: transparent;
	background: #fff !important;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	border-right: 1px solid #ddd;
	border-left: 4px solid #1f4787 !important;
}

.faq-head a{
	color: #333;
}

.faq-title[aria-expanded="true"] > i{
	transform: rotate( 90deg );
}

.faq-title[aria-expanded="false"] > i{
	transform: none;
}

.faq-arrow{
	position: absolute;
    right: 0;
    margin-right: 30px;
}

.faq-contents{
	padding: 20px;
}

.term-body{
	padding:0 15px;
}

/* 사이트맵 */
.sitemap{width:193px;float:left;margin-right:21px;}
.sitemap.last{margin:0}
.sitemap > h2{font-size:18px;font-weight:700;color:#187fa8;text-align:center;padding:14px 0;border-top:4px solid #47beed;border-bottom:1px solid #359ec8}
.sitemap:nth-child(5) h2{padding:10px;}
.mapbody{padding:13px 3px;}
.mapbody > li{position:relative;color:#4d4d4d;font-weight:700;letter-spacing:normal;line-height:1;}
.mapbody > li > a{vertical-align:middle;display:inline-block;margin-bottom:14px;padding-left:14px;}
.mapbody > li::before{content:url('/resources/img/sub/bullet_sitemap.png');position:absolute;top:-2px;left:3px;}
.mapbody > li ul{padding-left:18px;}
.mapbody > li ul li{margin-bottom:12px;line-height:1;}
.mapbody > li ul li a{color:#848484;font-size:13px;font-weight:700;}




.ul-list{
	padding: 15px 5px;
}

.ul-list li{
	margin-left: 25px;
	padding-bottom: 5px;
	list-style-type : square;
}

.nav-pills > li > a {
    padding: 10px 5px;
}

#controler{
    position: fixed;
    bottom: 20px;
    left: 20px;
    z-index: 999999999;
    color: #eee;
    background-color: rgba(0, 0, 0, 0.3);
    transition: all .25s ease;
    padding: 10px;
    border-radius: 5px;
    text-align: center;
}

.play-control{
	width: auto;
}

.play-control > a{
	float:left;
	padding: 0 7px;
	color: #fff;
    opacity: 0.7;
}

.play-control > a#stop-audio{
	padding-right:20px;
}

.play-control > a#close-audio{
	float: right;
}

.play-control > a:hover{
    opacity: 1;
}


.tab-ul{z-index: 50;margin-bottom: 45px;background: #fff;}
.tab-ul li{width: 25%;display: table;float: left;height: 100%;min-height: 60px;height: 100%;margin-left: -1px;margin-top: -1px;vertical-align: middle;}
.tab-ul li a{color: #121212;font-size: 15px;line-height: 1;height: 60px;display: table-cell;border: 1px solid transparent;background-image: none;color: inherit;text-align: center;vertical-align: middle;cursor: pointer;transition: background-color .05s ease-in-out;-webkit-transition: background-color .05s ease-in-out;-moz-transition: all 0.3s;text-align: left;border-color: #d2d2d2;padding: 20px;}
.tab-ul li a i{color:#666;float:right;font-size: 1.1em;}
.tab-ul li a:hover{border-color: #45495b;border-bottom-color: #45495b;background-color: #45495b;color: #fff;}
.tab-ul li a:hover i{color:#fff;}
.tab-ul li a.double{padding: 10px 20px;}
.tab-ul li a.double span{display: inline-block;width:80%;}
.tab-ul li a.double i{padding-top: 7px;}
.tab-ul li.on a{background: #40d9d9;color: #000;}
.tab-ul li.on a i{color:#000;}

.map-area{display:none;position: fixed;width: 50%;height: 505px;top: 25%;left: 25%;background: #fff;box-shadow: 15px 25px 6px rgba(0, 0, 0, 0.2);z-index: 1;overflow: auto;overflow-x: hidden;}
.close-map{display: block;margin: 9px 10px 9px 0;float:right;}

.cartoon-area{display:none;position: fixed;padding: 15px;border:5px solid #ddd;width: 50%;height: 620px;top: 27%;left: 25%;background: #fff;box-shadow: 15px 25px 6px rgba(0, 0, 0, 0.2);z-index: 1;overflow: auto;overflow-x: hidden;}
.close-cartoon{display: block;padding: 9px 10px 9px 0;float:right;}
.cartoon-box{display:none;}
#cartoon1{display:block;}


/*******trash*******/
.trash-content{display:none;width:100%;}
.trash-content.active{display:block;}
.trash.current{background:#3a5ca4;}
.trash.current a{color:#fff;}
.trash.current i{color:#fff;}
.trash-btn img{}

/*	kakao-map  */
.map-content{display: none;width:100%;}
.map-content > h4{margin-top: 30px;font-size: 1.8em;}
.map-content.active{display: block;}
.map-box{display:inline-block;width:100%;}
#focusMap{position:relative;}


dl.map-dl{width:100%;display:inline-block;border-bottom: 1px solid #efefef;}
dl.map-dl:nth-child(2){padding-top:50px;}
dl.map-dl:last-child{border-bottom:none;padding-top:50px;}
dl.map-dl > dt{width:200px;padding-top:75px;float:left;text-align:center; box-sizing: border-box;clear:both;font-size:1.4em;}
dl.map-dl > dd{padding: 5px 0;float:left;font-weight:normal;color:#333333;/* margin-top: 25px; */margin: 25px 0 100px 0;font-size:1.3em;width:70%;}
dl.map-dl > dd > span{font-size:1.0em;}
dl.map-dl > dd > p{font-size:1.0em;}
dl.map-dl > dd > a {font-size: 1.0em;color: #000;}
dl.map-dl > dd > a:hover{text-decoration: underline;}  
dl.map-dl > dd::before{content: "";display: inline-block;width: 5px;height: 5px;margin: 0 6px 3px -9px;background: #000;vertical-align: middle;border-radius: 50%;}
.sub-dd::before{content: "";display: inline-block;width: 5px;height: 5px;margin: 0 6px 3px -9px;background: #000;vertical-align: middle;border-radius: 50%;}
.bus, .subway, .car {padding-top: 80px;text-align: center; color: #0487e8;font-weight:bold;}
.bus{background: url('/resources/img/intro/bus.png') center  no-repeat; padding-top: 80px;}
.subway{background:url('/resources/img/intro/train.png') center 10px no-repeat;}
.car{background: url('/resources/img/intro/car.png') center no-repeat;}
p.dd-p::before {content: "";display: inline-block;width: 5px;height: 5px;margin: 0 6px 3px -9px;background: #000;vertical-align: middle;border-radius: 50%;}

        


/* div scroll box  */
.figure_box{border:5px solid #d7d7d7;height:500px;overflow: auto;overflow-x: hidden;padding: 30px 20px;}
.figure_box p { font-size:1.3em; margin-left:10px;}
.info-txt {font-size: 1.3em;}
.figure_box h4 {font-size: 1.3em;margin:20px 0 10px 0;}


.notice-content{border: 3px dashed #c0c0c0; padding: 20px;}
.notice-content li { padding-left:50px; font-size:1.2em;}

.short-box > p { font-size: 1.3em;}
.short-box > p::before{content: "";display: inline-block;width: 5px;height: 5px;margin: 0 6px 3px -9px;background: #949494;vertical-align: middle;}
.short-box > span { font-size:1.0em;}

/* download-btn  */
.download-btn{display:inline-block; height:30px; line-height:30px; padding:0 10px;font-size:1.2em;color:#fff !important; font-weight:300; background-color:#2489eb;position: relative;}
.download-btn::after{float: right;display: block;content: '';width: 30px;height: 30px;position: absolute;top: 0;right: -30px;;background: url('/resources/img/download-btn.png') no-repeat center center;background-color: #0076e8;}   
.download-btn:hover{background-color:#006ad1;}
.download-btn:hover::after{background-color:#0058ad;}

/* link-btn  */
.link-btn{display:inline-block; height:30px; line-height:30px; padding:0 10px;font-size: 1em;color:#fff !important; font-weight:300;background-color: #2489eb;position: relative;cursor:pointer;}
.link-btn::after{float: right;display: block;content: '';width: 30px;height: 30px;position: absolute;top: 0;right: -30px;background: url('/resources/img/move.png') no-repeat center;background-size: 14px;background-color: #0076e8;}   
.link-btn:hover{background-color: #006ad1;}
.link-btn:hover::after{background-color:#0058ad;}

/* treehouse */
.carousel{width:500px;margin-top:15px;position:relative;-webkit-transition:0.3s;transition:0.3s;overflow:hidden;}
.carousel li{opacity:0;filter:alpha(opacity=0);position:absolute;left:0;top:0;width:100%;-webkit-transition:0.4s linear;-ms-transition: 0.4s linear;-moz-transition:0.4s linear;-o-transition: 0.4s linear;transition:0.4s linear;height:184px;overflow:hidden;}
.carousel li:first-child {opacity:1;filter:alpha(opacity=100);}
.carousel li.current{opacity:1;filter:alpha(opacity=100);}
.carousel img{display:block;width:100%;height:auto;border:none;vertical-align:bottom;}
.thumbnails ul{overflow:hidden;}
.thumbnails li{width:64px;height:43px;margin-right:7px;float:left;}
.thumbnails li:last-child{margin-right:0;}
.thumbnails div{position:relative;background:#fff;}
.thumbnails .selected div:before{display:block;position:absolute;left:-6px;top:-6px;width:100%;height:100%;content:"";}
.thumbnails img{display:block;position:relative;z-index:10;width:100%;height:auto;border:none;vertical-align:bottom;cursor:pointer;-webkit-transform: translateZ(0); /* bug fix for chrome */-webkit-transition:0.4s;transition:0.4s;}
.thumbnails img:hover{opacity:0.7;filter:alpha(opacity=70);}
.thumbnails .selected img{cursor:default;}
.thumbnails .selected img:hover{opacity:1;filter:alpha(opacity=100);}
.cabin{position:relative;border-bottom:1px dashed #9e9e9e;overflow:hidden;}
.cabin:last-child{border-bottom:none;}
.cabin.last{border:none;padding:0}
.cabin_info table td{text-align:left;}
.apply-btn{position:absolute;top:0;right:0;}

/* treehouse slide  */
.treehouse-wrap {overflow: hidden;}
.slidewrap{width:400vw; overflow: hidden;}
.slidelist{width: 100vw;float: left;}


/* symbol  */
.symbol{/* height:338px; */}
.symbol > div{width:397px;float: left;margin-right: 25px;padding-bottom: 30px;text-align:center;background:url('/resources/img/intro/checkerboard.png') no-repeat;}
.symbol > div:last-child{margin-right:0;}
.symbol > div > div{width:100%;position:relative;padding-top: 60px;height:240px;margin-bottom:20px;}
.symbol p{position:absolute;right:0;bottom:0;background:#4f5260;opacity:0.8;color:#fff;padding:10px 30px;}
.symbol .basic > li, .symbol .gray > li{float:left;width:33.3333%;color:#fff;height:80px;padding:15px 12px;}
.symbol ul > li > ul > li{color:#fff;font-size:12px;text-align:left;margin-bottom:7px;line-height:1;}
.symbol .basic > li:nth-child(1){background:#00a261;}
.symbol .basic > li:nth-child(2){background:#8dc63f;}
.symbol .basic > li:last-child{background:#9fcf67;width:33.3334%}
.symbol .gray > li:nth-child(1){background:#0082c8;}
.symbol .gray > li:nth-child(2){background:#00aedb;}
.symbol .gray > li:last-child{background:#88d4e3;width:33.3334%}


/* history  */
.history_wrap {width: 100%;max-width:1000px;overflow-y: auto;position: relative;}
.history_wrap::before {content: "";width: 3px;height:100%;display: block;background-color: #e4e4e4;position: absolute;top: 0;left: 50%;}
.history_wrap .item { clear: both;padding-top: 20px;}
.history_wrap .item .cont {width: 50%;box-sizing: border-box;float: right;padding-left: 5%;position: relative;/* border: 1px solid #efefef; *//* box-shadow: 10px 5px 5px #ddd; */}
.logo-img{background: url('/resources/img/intro/logo-img.png') center no-repeat;margin: 0 auto;width: 150px;height: 150px;border-radius: 50%;border: 2px solid #eee;background-size: 114px;margin-bottom: 5px;}

/* 짝수 순서 내용 */
.history_wrap .item:nth-child(even) .cont {float: left;padding-left: 8%;padding-right: 0;}
.history_wrap .item .cont strong {display: block;margin-bottom: 20px;font-size: 2.5em;color: #326ebd;}
.history_wrap .item .cont strong::before{content: "";position: absolute;top: 37px;left: -7px;display: block;width: 13px;height: 13px;border-radius:50%;background-color: #ffffff;border: 3px solid #326ebd;}
.history_wrap .item .cont strong::after{content: "";position: absolute;top: 45px;left: 10px;display: block;width: 400px;height: 2px;background-color:#326ebd;}
.history_wrap .item:nth-child(even) .cont strong::after{left: auto;right: 5px;}
.history_wrap .item:nth-child(even) .cont strong::before{left: auto;right: -11px;}
.history_wrap .item .cont dl {margin-top: 10px;font-size: 0;}
.history_wrap .item .cont dl:first-child {margin-top: 0;}
.history_wrap .item .cont dt, .history_wrap .item .cont dd {display: inline-block;font-size: 14px;}
.history_wrap .item .cont dt {width: 20%;vertical-align: top;font-weight: 600;color: #333;}
.history_wrap .item .cont dt::before{content: "";}
.history_wrap .item .cont dd { width: 80%; word-break: keep-all;}


/* 부서별업무  */
.depart{background:url('/resources/img/intro/organization_01_new.png') center no-repeat;}
.depart ul{margin-bottom:300px;height:251px;}
.depart ul:last-child{margin-bottom:0;width:100%;}
.depart-li01 {margin-left: 164px !important;}
.depart > ul > li{width: 31%;height:256px;margin: 0 1%;border:1px solid #e3e3e3;float:left;}
.depart > ul > li:last-child{margin-right:0;}
.depart li .depart_tit{text-align:center;height:40px;padding:6px 0;}
.depart li .depart_tit h6{color:#fff;font-size:1.5em;font-weight:700;}
.depart li .depart_body{height:auto;position:relative;}
.depart li .depart_body ul{height:211px;padding:22px 5px 10px 5px;margin-bottom:0;}
.depart li .depart_body .btn_group{position:absolute;bottom:14px;left:33%;border: 1px solid #e3e3e3;}
.depart li .depart_body .btn_group .bt_white{color: #000;font-size:1.1em;display:block;padding:7px;}
.depart li .depart_body .btn_group:hover{box-shadow: 0 1px 5px #d7d7d7;}
.depart-last > li{width: 23% !important;}
.depart-last .btn_group {left: 26% !important;}

.depthList li{padding-left:18px;color:#3d3d3d;font-size:1.1em;padding-bottom:8px;}
.depthList > li::before{content: "";display: inline-block;width: 3px;height: 3px;margin: 0 6px 3px -9px;background: #000;vertical-align: middle;}
.depthList li > span{line-height:18px;}

/*	site-map  */
.short-box02 .site-mcont{margin-left:70px;}
.site-mwrap .site-mcont{float: left;width: 27%;margin-right: 50px;}
.site-mwrap .site-mcont:first-child{margin-left:10px;}
.site-mwrap .site-mcont p{/* margin-bottom: 10px; */position: relative;/* border-bottom: 1px solid black; */}
.site-mwrap .site-mcont span{font-size: 2em;font-weight: 500;/* padding-bottom: 21px; *//* margin-left: 23px; *//* text-align: center; */margin-left: 30px;color: #000;}
/* .site-mwrap .site-mcont span::after{content: ''; background-color: rgba(0, 138, 255, 0.4);width: 10px;height:10px;position: absolute;top: -7px;left: 20px; border-radius: 50%; display: inline-block;} */
.site-msub{margin-left: 15px;margin-top: 10px;width:100%;border-top: 3px solid #1c77be;}
.site-msub > li{/* margin-bottom: 15px; */margin: 15px 0;position: relative;/* border-top: 1px solid black; */}
.site-msub > li > a{font-size: 1.3em;color: #000;font-weight: 500;margin-left: 15px;}
.site-msub > li > ul{width:100%;background-color: #fcfcfc;border-top: 1px solid #efefef;border-bottom: 1px solid #efefef;/* margin-top: 20px; */margin: 15px 0;}
.site-msub > li > ul > li{position: relative;margin: 10px 30px;/* text-align: center; */}
.site-msub > li > ul > li > a{color: #888;/* font-weight: 500; */font-size: 1.1em;}
.site-msub > li > ul > li > a::before{content: '';background-color: #999;width:3px;height:3px;position: absolute;top:9px;left:-10px;}
.site-msub > li > ul > li > a:hover{color:#000;}
.site-msub > li > ul > li > a:hover::before{background-color:#000;}


/*	main site-map  */
.site-wrap{width:100%!important;}
.site-dep{display: inline-block;width: 100%;background:#efefef;border-top: none;margin-bottom:20px;}
.site-dep:hover .sm-title h3{color:#fff;transition:.3s;}
.site-dep:hover .s-sports{background:url('/resources/img/gb1.png') center no-repeat;}
.site-dep:hover .s-traffic{background:url('/resources/img/gb2.png') center no-repeat;}
.site-dep:hover .s-welfare{background:url('/resources/img/gb3.png') center no-repeat;}
.site-dep:hover .s-innovation{background:url('/resources/img/gb4.png') center no-repeat;}
.site-dep:hover .s-human{background:url('/resources/img/gb5.png') center no-repeat;}
.site-dep:hover .s-notice{background:url('/resources/img/gb6.png') center no-repeat;}
.site-dep:hover .s-intro{background:url('/resources/img/gb7.png') center no-repeat;}
.site-dep:hover{background:url(/resources/img/site-left-top.png) no-repeat, linear-gradient(to right, #005aa7, #fffde4); box-shadow:5px 5px 20px 5px #e3e3e3;transition:.3s;}
.sm-title{float: left;width: 20%;text-align: right;}
.sm-title h3{font-size: 2em;font-weight: 500;height: 100%;padding-right: 20px;padding-top: 20px;position:relative;color: #000000;padding-bottom: 150px;display: inline-block;}
/* .sm-title h3::before{content:'';background-color: #39a3ff;width: 5px;height: 20px;position:absolute;left:0;top: 0;} */
.sm-content{width:80%;display: inherit;padding: 20px;background: #fefefe;}
.site-dep02{float: left;width: 25%;margin-bottom: 30px;}
.site-dep02 h4{margin-bottom: 5px;border: 2px solid #2781c7;padding: 15px;}
.site-dep02 h4 a{font-size: 1.3em;color: #1a6cab;font-weight: 500;}
.site-dep02 li{padding: 5px;}
.site-dep02 li > a{font-size: 1.2em;color: #666;font-weight: 300;    padding: 10px 20px;}
.site-dep02 li > a:hover{color:#2196F3;background:url('/resources/img/next.png') right no-repeat;}
.site-dep02:hover .sitem-tit{background: url('/resources/img/site-hover.png') center no-repeat;}
.site-dep02:hover .sitem-tit a{color:#fff;}

.site-box{width:100%;background: #efefef;padding: 15px;font-size: 1.3em;margin:10px 0;}
.site-box > h5{font-size:1.4em; margin-bottom:10px;}
.site-box p{font-size:1.0em;}
.site-btn {background-color:#3285d8;padding: 5px 15px; border-radius:3px;font-size:.9em;color:#fff !important;}

.sitem-title-on{background: #156cb1;color: #fff;}

p.security-txt {font-size: 1.3em;margin-bottom:5px}
p.security-title {font-size:2em;font-weight:600;text-align:center;margin-top:10px;}
img.img-size {margin-bottom: 10px;}

h4.etc-title {font-size: 2.0em;font-weight: 500;color: #000;padding-left:10px;line-height:2;}


/*	introduce  */
.master-img{position:relative;width: 30%;float: left;margin-left: 30px;margin-top: 13px;}
.master-img::before{position:absolute;content:'';background:#0f5a9f;height: 320px;width: 250px;top: 10%;left: 35px;z-index:-1;}
.master-img img{width: 90%;margin-bottom: 10px;}
.master-box{width: 60%;float:right;}
.master-box > p{font-size: 1.7em;margin-bottom: 20px;color:#222;font-weight:400;padding-right:20px;}
.mas-span01{font-size:1.3em; color:#00478e;}
.mas-span02{font-size:1.2em;font-weight:600;}
.mas-span03{font-size:1.1em;color:#00478e;font-weight:600;}
h4.ceo-h4{position:relative;font-size: 2.5em;color: #888;font-weight:400;padding-bottom:30px;position:relative;}
h4.ceo-h4::before{content:'';background-color:#00478e;width:50px;height:3px;position:absolute;bottom:13%;}
.mas-name{/* float:right; */}
.mas-name p{font-size: 1.8em;}


.sample-section1{background: url('/resources/img/sbg1.png') center no-repeat;/* background: linear-gradient(15deg,  #e8f3f9 0%, #bbd5fb 100%); */ }
.sample-section2{background: url(/resources/img/bg_section.png);}
.sample-section3{padding: 50px 0;border-bottom: 1px solid #999;background: #fff;}
.sample-callDiv{height: 350px;background: url(/resources/img/callnum-bg.png) left top no-repeat;padding: 30px 0;}
.sample-section1{background: url('/resources/img/bg_01.png') no-repeat;animation: background-move 60s linear both infinite; }
.sample-section2{background:#fff;}
.sample-section3{padding:30px 0 80px 0;background:#f0f8ff  url('/resources/img/section03-bg.png') no-repeat; background-size:cover;border-bottom:none;}
.sample-callDiv{height:100%;background:none;padding: 0;}
.nav-box > a > .nav-box-img{border-radius:50%;box-shadow:none;}
.sample-nav-title{background: url(/resources/img/service-title.png) no-repeat;}
.nav-section > .sample-box2 > a {border-left:none;}
.nav-section > .sample-box2 > .sample-box2-a01{background: #0098ac;}
.nav-section > .sample-box2 > .sample-box2-a02{background: #0071cb;}
.nav-section > .sample-box2 > .sample-box2-a03{background: #1c4d96;}
.nav-section > .sample-box3{background:#4593d1;}
.sample-nav-box{padding: 0 30px;}
.sample-icon-nav{height:150px;}

/* 시설예약 바로가기 */
.rsv-left, .rsv-right{display:inline-block;}
.rsv-left{padding: 0 50px;}
.rsv-right{padding-top: 120px;}
.rsv-sub01{font-size: 2em;}
.rsv-tit span{position:relative;}
.rsv-tit, .rsv-tit02{display:inline-block;font-weight: bold;}
.rsv-tit{font-size: 4em;color: #00988a;position:relative;padding: 0 5px;}
.rsv-tit02{font-size:3em;padding:10px 0;}
.rsv-tab01, .rsv-tab02, .rsv-tab03{background: #ececec;}
.rsv-tab01.current{background:url('/resources/img/rsv-tab01.png') no-repeat;position:relative;}
.rsv-tab02.current{background:url('/resources/img/rsv-tab02.png') no-repeat;position:relative;}
.rsv-tab03.current{background:url('/resources/img/rsv-tab03.png') no-repeat;position:relative;}
.rsv-tab01.current a, .rsv-tab02.current a, .rsv-tab03.current a{color:#fff;font-weight:bold;}
.rsv-tab01.current::before{content: '';display: block;position: absolute;top: 50%;right: -16px;margin-top: -9px;width: 0px;height: 0px;border-left: 10px solid #6d193f;border-top: 9px solid transparent;border-right: 6px solid transparent;border-bottom: 10px solid transparent;}
.rsv-tab02.current::before{content: '';display: block;position: absolute;top: 50%;right: -16px;margin-top: -9px;width: 0px;height: 0px;border-left: 10px solid #174235;border-top: 9px solid transparent;border-right: 6px solid transparent;border-bottom: 10px solid transparent;}
.rsv-tab03.current::before{content: '';display: block;position: absolute;top: 50%;right: -16px;margin-top: -9px;width: 0px;height: 0px;border-left: 10px solid #512679;border-top: 9px solid transparent;border-right: 6px solid transparent;border-bottom: 10px solid transparent;}
.rsv-tabs a{font-size:1.5em;color: #000;display:block;}
.rsv-contents a{display:inline-block;text-align: center;font-size: 1.3em;color: #000;padding: 9px 40px;border-right: 1px dotted #ddd;}
.rsv-contents a:last-child{border-right:none;}
.rsv-contents span{display:block;margin-top:6px;}
.rsv-contents {display:none;}
.rsv-contents img{border-radius: 30%;box-shadow: 1px 2px 2px 1px lightgrey;}
.rsv-contents a:hover img{box-shadow:1px 2px 10px rgb(150 150 150 / 70%);}
.rsv-contents.active{display: inline-block;padding: 53px 0;text-align: center;background: #fff;width: 80%;float: right;position: absolute;right: 0;top: 0;} 
.rsv-tabs{width: 20%;height:77px;line-height:77px;text-align: center;border-top: 1px solid #e2e2e2;cursor: pointer;display: inline-block;z-index: 1;}
.rsv-tabs:last-child{border-bottom:none;}
.rsv-allBox ul{position:relative;}
.rsv-allBox ul li{display:block;float:none;}
.rsv-allBox {box-shadow: 5px 5px 10px rgba(0,0,0,.2);}


.right-side > .sample-nav01{
    background: #119FB8 url(/resources/img/nav-test1.png) no-repeat;
    border-radius: 0;
}
.right-side > .sample-nav02{
	background: #CF7C11 url(/resources/img/nav-test2.png) no-repeat;
	border-radius: 0;
}

/*********아름다운 동행*********/
.photo-list{margin-left:auto;margin-right:auto;}
.photo-list li{display:inline-block;border:1px solid #ddd;padding:10px;width: 30%;margin: 1%;transition:0.3s;}
.photo-list li:hover{box-shadow:2px 2px 10px rgb(0 0 0 / 20%);}
.photo-img img{width: 100%;margin-bottom: 10px;}
.photo-title strong{font-size: 1.5em;color: #000;display: inline-block;/*padding: 15px 0 10px 0;*/padding-top:10px;width: 100%;border-top: 1px solid #ddd;/* text-align: center; */}
.photo-date{padding-top: 10px;color:#8d8d8d;font-size: 1.2em;}


/*************** 통합검색 **************/
.search-header{padding-top:10px;}

.search-contents {padding: 20px 0 50px 0;background: #edf3fb  url(/resources/img/section03-bg.png) no-repeat}
.search-title img{margin-top: 20px;padding: 10px;}
.search-title span{display:inline-block;font-size: 2em;padding-top: 30px;color: #000;}
.search-size{width:50%;margin:0;}
.search-size input{height:55px;width: 93%;font-size:1.5em;}
.search-size button{padding: 28px 29px !important;top: 2px !important;right: 5px !important;background-size:50% !important;}

.short-sub-box{position:relative;padding:30px 0;}
.list-mg li{margin-bottom:20px !important;}
.short-sub-box:not(:last-child){border-bottom:1px dashed #ddd;}
.search-result{margin:25px 0;}
.search-result p{font-size:2em;color:#585858;font-weight: 300;}
.search-list{display:inline-block;width:100%;}
.search-list li{float:left;width: 25%;font-size:1.5em;}
.search-list li a{display:block;padding:10px 20px;text-align: center;color:#000;}
.search-list li a:hover{background:#f5f5f5;color:#006ad1;}
.search-list .on{color:#006ad1;background:#f5f5f5;}
.search-detail{position:relative;width: 100%;display: inline-block;padding: 25px;background: #edf3fb;border: 1px solid #c8daf2;}
.search-detail div{margin-right: 25px;}
.search-detail div span{font-size: 1.3em;padding: 10px;margin-left: 10px;}
.search-detail div, .search-detail div span, .search-detail div ul{float:left;}
.search-detail div ul li{float:left;width: 100px;text-align: center;border: 1px solid #ddd;border-right: none;}
.search-detail div ul .calendar-btn{width:50px;}
.search-detail div ul .calendar-btn button{background:#fff;padding:14px;cursor: pointer;}
.search-detail div ul .calendar-btn img{width:70%;}
.search-detail div ul li:last-child{border-right:1px solid #ddd;}
.search-detail div ul li a{display: block;padding:10px;background:#fff;color:#000;font-size:1.2em;font-weight: 300;}
.search-detail .on{background:#142480;color:#fff;font-weight: 400;}

.more-content{position: absolute;top: 30px;right: 15px;}
.more-detail {font-size: 1.2em;color: #777;font-weight: 300;display: inline-block;vertical-align: middle;}
.more-detail-icon{display: inline-block;background: url('/resources/img/more2.png')no-repeat 50%;width: 15px;height: 15px;background-size: 65%;vertical-align: middle;transition: all ease .5s;}
.more-content a:hover .more-detail-icon{transform: rotate(180deg);}

.board-list li{overflow: hidden;}
.board-pic {float:left;width: 14%;}
.board-pic img{width: 100%;}
.searchResultTitle{font-size: 1.3em !important;font-weight: 500;}
.board-contents{float: right;width: 85%;font-size: 1.3em;color: #333;line-height: 1.5;font-weight: 300;padding: 20px 0;}
.board-contents a{color:#000;}
.board-txt{font-size:1em;margin:10px 0;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}
.no-img{float:none;width:100%;}

#dateBox{display:none;position:absolute;top: 395px;margin-left: 400px;width:500px;background:#fafafa;border: 1px solid #142480;padding: 10px;text-align: center;z-index:1;}
.dateBox-contents{text-align: center;}
.dateBox-contents input, .dateBox-contents button{font-size:1.3em;padding:5px;border: 1px solid #ddd;}
.dateBox-contents input{background:#efefef;width:33%;}
.dateBox-contents button{display: inline-block;width: 120px;margin: 0 1%;cursor: pointer;}

.search-photo-list{margin-left:auto;margin-right:auto;}
.search-photo-list li{float:left;border:1px solid #ddd;padding:10px;width: 18%;margin: 1%;}
.search-photo-list li img{width: 100%;}

.choose-box {padding: 10px;border: 1px solid #000;font-size: 1.2em;}

/* 테니스장 이용안내 팝업 */
.guide-btn {padding: 5px;border:1px solid #25476a;cursor: pointer;transition:.3s;}
.guide-btn:hover{border:1px solid #25476a;}

.tennis-box{position:relative;}
.bg-black{display:none;width: 100%;height: 100%;position: fixed;top: 0;left: 0;background: rgba(0,0,0,0.5);z-index: 999;}
.use-guide{display:none;position: absolute;height: 80%;width: 44%;left: 32%;top: 10%;background: #fff;border: 1px solid #ddd;box-shadow: 15px 25px 6px rgba(0, 0, 0, 0.2);z-index: 99999999;overflow: hidden;}
.guide-top {width: 100%;padding: 10px;background: #f7f7f7;border-bottom:1px solid #ddd;}
.guide-top span{font-size:1.5em;font-weight: 600;}
.guide-top button{float:right;font-size: 1.1em;background:#585858;color:#fff;padding: 5px 10px;cursor:pointer;transition:.3s;}
.guide-top button:hover{background:#777;}
.guide-contents {padding: 10px;overflow-y: auto;height: 95%;}
.guide-contents img{width:100%;}
.guide-contents p {font-size: 1.4em;margin: 10px 0 5px 0;font-weight:500;}
p.sub-text{font-size: 1.2em;color:#ff0808;font-weight:400;margin-top: 0;}  

img.list-down {width: 10px;margin-top: 5px;margin-left: 2px;}
img.list-down.up{transform: rotate(180deg);}

/* ESG경영 */
.tb-img {width: 200px;}
span.tag {display: inline-block;padding: 5px 10px;margin-bottom: 10px;border-radius: 25px;}
span.tag.tag-1{background:#009688;color:#fff;font-weight:500;}
span.tag.tag-2{background:#FF9800;color:#fff;font-weight:500;}
span.tag.tag-3{background:#9C27B0;color:#fff;font-weight:500;}

/*개발사업*/
.typeVerticalStep {
    text-align: center;
}

.typeVerticalStep * {
    box-sizing: border-box;
}

.typeVerticalStep *:before, .typeVerticalStep *:after {
    position: absolute;
    z-index: -100;
    content: "";
}

.typeVerticalStep>ol>li {
    position: relative;
}

.typeVerticalStep dl {
    position: relative;
    padding-left: 20%;
}

.typeVerticalStep dl:after {
    position: static;
    display: block;
    clear: both;
}

.typeVerticalStep dl>dt {
    position: absolute;
    left: 0;
    top: 50%;
    width: 20%;
    transform: translateY(-50%);
}

.typeVerticalStep dl>dt>p {
    position: relative;
    width: 100%;
    height: 120px;
    border-radius: 5px;
    background: #ccc;
    box-shadow: 1px 1px 10px rgba(0,0,0,.25);
}

.typeVerticalStep dl>dt>p>span {
    position: relative;
    display: block;
    top: 50%;
    color: #fff;
    font-size: 18px;
    font-weight: 900;
    line-height: 26px;
    transform: translateY(-50%);
}

.typeVerticalStep dl>dd {
    float: left;
    width: 44%;
    margin-left: 6%;
}

.typeVerticalStep dl>dd>ol>li {
    position: relative;
    padding: 10px;
    font-size: 14px;
    border: 1px solid #aaa;
    border-radius: 5px;
    background: #9CAFAA;
    word-break: keep-all;
}

.typeVerticalStep dl>dd>ol>li:not(:first-child) {
    margin-top: 30px;
}

.typeVerticalStep>ol>li:not(:first-child) {
    margin-top: 60px;
}

.typeVerticalStep dl>dd>ol>li:not(:first-child):before, .typeVerticalStep .useArr:before {
    top: -28px;
    left: 50%;
    margin-left: -8px;
    width: 12px;
    height: 12px;
    border-right: 5px solid #777676;
    border-bottom: 5px solid #777676;
    transform: rotate(45deg);
}

.typeVerticalStep dl>dt+dd>ol>li:first-child:after, .typeVerticalStep dl>dt+dd>ol>li:last-child:after {
    top: 50%;
    right: 100%;
    height: 1px;
    width: 108px;
    background: #797676;
}

.typeVerticalStep dl:before {
    top: 22px;
    bottom: 20px;
    left: 140px;
    width: 1px;
    background: #797676;
}

.typeVerticalStep>ol>li:nth-child(3n-2)>dl>dt>p {
    border: 1px solid #004a6d;
    background: #0785c0;
    background-image: linear-gradient(to right, #868f96 0%, #596164 100%);
    text-shadow: 1px 0 #004a6d, -1px 0 #004a6d, 0 1px #004a6d, 0 -1px #004a6d;
}

.typeVerticalStep>ol>li:nth-child(3n-1)>dl>dt>p {
    border: 1px solid #9e5300;
    background: #ed8e24;
    background-image: linear-gradient(to right, #868f96 0%, #596164 100%);
    /*text-shadow: 1px 0 #9e5300, -1px 0 #9e5300, 0 1px #9e5300, 0 -1px #9e5300;*/
}

.typeVerticalStep>ol>li:nth-child(3n)>dl>dt>p {
    border: 1px solid #5e7800;
    background: #9ec50e;
    background-image: linear-gradient(to right, #868f96 0%, #596164 100%);
    /*text-shadow: 1px 0 #5e7800, -1px 0 #5e7800, 0 1px #5e7800, 0 -1px #5e7800;*/
}

.typeVerticalStep>ol>li.depth1 {
    text-align: left;
    padding-left: 20%;
}

.typeVerticalStep>ol>li>p {
    position: relative;
    text-align: center;
    display: inline-block;
    width: 44%;
    margin-left: 6%;
    padding: 10px;
    font-size: 14px;
    border: 1px solid #aaa;
    border-radius: 5px;
    background: #9CAFAA;
    word-break: keep-all;
}

.typeVerticalStep dl>dd>ol>li>ul {
    position: absolute;
    text-align: left;
    top: 50%;
    right: -295px;
    width: 259px;
    padding: 10px 15px;
    border: 1px solid #bbb;
    background: #D6DAC8;
    transform: translateY(-50%);
}

.typeVerticalStep dl>dd>ol>li>ul>li {
    position: relative;
    padding-left: 9px;
}

.typeVerticalStep dl>dd>ol>li>ul>li:not(:first-child) {
    margin-top: 5px;
}

.typeVerticalStep dl>dd>ol>li>ul>li:before {
    left: 0;
    top: 7px;
    width: 2px;
    height: 2px;
    border: 1px solid #555;
    background: #aaa;
}

.typeVerticalStep dl>dd>ol>li>ul:not(.mid) {
    margin-top: 37px;
}

.typeVerticalStep dl>dd>ol>li>ul:before {
    right: 100%;
    top: 50%;
    width: 36px;
    height: 1px;
    background: #797676;
    z-index: -100;
}

.typeVerticalStep dl>dd>ol>li>ul:not(.mid):before {
    width: 157px;
}

.typeVerticalStep dl>dd>ol>li>ul.noLine:before {
    display: none;
}

.typeVerticalStep li.depth1>ul {
    position: absolute;
    text-align: left;
    top: 50%;
    right: 0;
    width: 259px;
    padding: 10px 15px;
    border: 1px solid #bbb;
    background: #D6DAC8;
    transform: translateY(-50%);
}

.typeVerticalStep li.depth1>ul>li {
    position: relative;
    padding-left: 9px;
}

.typeVerticalStep li.depth1>ul>li:not(:first-child) {
    margin-top: 5px;
}

.typeVerticalStep li.depth1>ul>li:before {
    left: 0;
    top: 7px;
    width: 2px;
    height: 2px;
    border: 1px solid #555;
    background: #aaa;
}

.typeVerticalStep li.depth1>ul:not(.mid) {
    margin-top: 37px;
}

.typeVerticalStep li.depth1>ul:before {
    right: 100%;
    top: 50%;
    width: 36px;
    height: 1px;
    background: #ccc;
    z-index: -100;
}

.typeVerticalStep li.depth1>ul:not(.mid):before {
    width: 157px;
}

.typeVerticalStep li.depth1>ul.noLine:before {
    display: none;
}

.typeVerticalStep.type1>ol>li:nth-child(1):before {
    left: 310px;
    bottom: -30px;
    width: 145px;
    height: 30px;
    border: 1px solid #797676;
    border-top: 0;
    border-right: 0;
}

.typeVerticalStep.type1>ol>li:nth-child(1):after {
    left: 455px;
    bottom: -60px;
    height: 30px;
    width: 1px;
    background: #797676;
}

.typeVerticalStep.type1>ol>li:nth-child(2) {
    margin-top: 90px;
}

.typeVerticalStep.type1>ol>li:nth-child(2) dt+dd>ol>li:nth-child(3) {
    margin-top: 176px;
}

.typeVerticalStep.type1>ol>li:nth-child(2) dt+dd>ol>li:nth-child(2):after {
    top: 100%;
    left: 50%;
    width: 1px;
    height: 160px;
    background: #797676;
}

.typeVerticalStep.type1>ol>li:nth-child(2):before {
    left: 312px;
    right: 125px;
    top: -31px;
    height: 30px;
    border: 1px solid #797676;
    border-bottom: 0;
}

.typeVerticalStep.type1>ol>li:nth-child(2):after {
    left: 312px;
    right: 125px;
    bottom: -31px;
    height: 30px;
    border: 1px solid #797676;
    border-top: 0;
}

.typeVerticalStep.type1>ol>li.depth1 p {
    margin-left: 183px;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    border: 1px solid #47484c;
    background: #6e6f72;
    background: linear-gradient( to bottom, #b0b1b2 1px, #747578 1px, #68696c 100%);
    text-shadow: 1px 0 #47484c, -1px 0 #47484c, 0 1px #47484c, 0 -1px #47484c;
}

.typeVerticalStep.type1>ol>li.depth1 p:before {
    left: 50%;
    bottom: 100%;
    height: 30px;
    width: 1px;
    background: #797676;
}

.typeVerticalStep.type1 ul.mid {
    margin-top: 57px;
}

.typeVerticalStep.type1 ul.mid:before {
    top: 7px;
}

.typeVerticalStep.type2>ol>li:nth-child(2) {
    margin-top: 120px;
}

.typeVerticalStep.type2>ol>li:nth-child(2) p:before {
    left: 50%;
    top: -125px;
    bottom: -35px;
    width: 1px;
    background: #797676;
}

.typeVerticalStep.type2>ol>li:nth-child(3) {
    margin-top: 30px;
}

.typeVerticalStep.type2 ul.mid+ul {
    margin-top: 100px;
}

.typeVerticalStep.type2 ul.mid+ul:before {
    width: 165px;
}

.typeVerticalStep.type4>ol>li:not(:first-child) {
    margin-top: 40px;
}

.typeVerticalStep.type4>ol>li>p:before {
    top: -33px;
    left: 50%;
    margin-left: -8px;
    width: 12px;
    height: 12px;
    border-right: 5px solid #aaa;
    border-bottom: 5px solid #999;
    transform: rotate(45deg);
}

.typeVerticalStep.type4>ol>li:nth-child(4) {
    margin-top: 70px;
}

.typeVerticalStep.type4>ol>li:nth-child(4)>dl>dt>p {
    border: 1px solid #9e5300;
    background: #ed8e24;
    background-image: linear-gradient(to right, #868f96 0%, #596164 100%);
   /* text-shadow: 1px 0 #9e5300, -1px 0 #9e5300, 0 1px #9e5300, 0 -1px #9e5300;*/
}

ol.verticalStep {
    margin-top: 10px;
    padding-right: 40%;
}

ol.verticalStep * {
    box-sizing: border-box;
}

ol.verticalStep *:before, ol.verticalStep *:after {
    position: absolute;
    z-index: -100;
    content: "";
}

ol.verticalStep>li {
    position: relative;
    text-align: center;
    padding: 10px;
    font-size: 14px;
    border: 1px solid #aaa;
    border-radius: 5px;
    background: #f9f9f9;
    word-break: keep-all;
}

ol.verticalStep>li:first-child {
    background: #fff;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

ol.verticalStep>li:last-child {
    color: #fff;
    border: 1px solid #222;
    background: #595959;
}

ol.verticalStep>li:not(:first-child) {
    margin-top: 30px;
}

ol.verticalStep>li:not(:first-child):before {
    top: -28px;
    left: 50%;
    margin-left: -8px;
    width: 12px;
    height: 12px;
    border-right: 5px solid #777676;
    border-bottom: 5px solid #777676;
    transform: rotate(45deg);
}

ol.verticalStep>li>ul {
    position: absolute;
    text-align: left;
    top: 50%;
    right: -285px;
    width: 261px;
    padding: 10px 15px;
    border: 1px solid #bbb;
    background: #eee;
    transform: translateY(-50%);
}

ol.verticalStep>li>ul>li {
    position: relative;
    padding-left: 9px;
}

ol.verticalStep>li>ul>li:not(:first-child) {
    margin-top: 5px;
}

ol.verticalStep>li>ul>li:before {
    left: 0;
    top: 7px;
    width: 2px;
    height: 2px;
    border: 1px solid #555;
    background: #aaa;
}

ol.verticalStep>li>ul:not(.mid) {
    margin-top: 37px;
}

ol.verticalStep>li>ul:before {
    right: 100%;
    top: 50%;
    width: 36px;
    height: 1px;
    background: #ccc;
    z-index: -100;
}

ol.verticalStep>li>ul:not(.mid):before {
    width: 232px;
}

ol.verticalStep>li>ul.noLine:before {
    display: none;
}

ol.verticalStep.rewardStep {
    padding-right: 65%;
}

ol.verticalStep.rewardStep>li>ul {
    right: -475px;
    width: 455px;
}

ol.colStep2 {
    margin-top: 10px;
}

ol.colStep2 * {
    box-sizing: border-box;
    word-break: keep-all;
}

ol.colStep2:after {
    display: block;
    clear: both;
    content: "";
}

ol.colStep2>li {
    position: relative;
    float: left;
    text-align: center;
    padding: 0 15px;
    width: 30.66%;
    color: #222;
    border: 1px solid #aaa;
    border-radius: 5px;
    background: #f9f9f9;
    box-sizing: border-box;
}

ol.colStep2>li:first-child {
    background: #fff;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

ol.colStep2>li:last-child {
    border: 1px solid #222;
    background: #595959;
}

ol.colStep2>li:last-child * {
    color: #fff;
}

ol.colStep2>li:after {
    position: absolute;
    content: "";
    top: 50%;
    right: -15px;
    width: 12px;
    height: 12px;
    border-top: 4px solid #aaa;
    border-right: 4px solid #999;
    transform: rotate(45deg) translateY(-50%);
}

ol.colStep2>li:last-child:before, ol.colStep2>li:last-child:after {
    display: none;
}

ol.colStep2>li:not(:nth-child(3n)) {
    margin-right: 4%;
}

ol.colStep2>li:nth-child(n+4) {
    margin-top: 30px;
}

ol.colStep2>li:nth-child(3n):before, ol.colStep2>li:nth-child(3n):after {
    display: none;
}

ol.colStep2>li>p {
    position: relative;
    height: 70px;
    border-bottom: 1px solid #aaa;
}

ol.colStep2>li>p span {
    position: relative;
    top: 50%;
    display: block;
    font-size: 15px;
    font-weight: bold;
    line-height: 22px;
    transform: translateY(-50%);
}

ol.colStep2>li>div {
    position: relative;
    padding: 0 5px;
    height: 120px;
}

ol.colStep2>li>div>ul {
    position: relative;
    top: 50%;
    text-align: left;
    transform: translateY(-50%);
}

ol.colStep2>li>div>ul>li {
    position: relative;
    padding-left: 8px;
}

ol.colStep2>li>div>ul>li:not(:first-child) {
    margin-top: 5px;
}

ol.colStep2>li>div>ul>li:before {
    position: absolute;
    left: 0;
    top: 7px;
    width: 2px;
    height: 2px;
    border: 1px solid #777;
    background: #aaa;
    content: "";
}

ol.colStep2>li:last-child>div>ul>li:before {
    border: 1px solid #fff;
    background: #888;
}
ol.colStep {
    margin-top: 10px;
}

ol.colStep:after {
    display: block;
    clear: both;
    content: "";
}

ol.colStep>li {
    position: relative;
    float: left;
    text-align: center;
    padding: 15px;
    width: 22%;
    height: 80px;
    color: #222;
    border: 1px solid #aaa;
    border-radius: 5px;
    background: #f9f9f9;
    box-sizing: border-box;
}

ol.colStep>li:first-child {
    background: #fff;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

ol.colStep>li:last-child {
    border: 1px solid #222;
    background: #595959;
}

ol.colStep>li:last-child>p {
    color: #fff;
}

ol.colStep>li:after {
    position: absolute;
    content: "";
    top: 50%;
    right: -15px;
    width: 12px;
    height: 12px;
    border-top: 4px solid #aaa;
    border-right: 4px solid #999;
    transform: rotate(45deg) translateY(-50%);
}

ol.colStep>li:last-child:before, ol.colStep>li:last-child:after {
    display: none;
}

ol.colStep>li:not(:nth-child(4n)) {
    margin-right: 4%;
}

ol.colStep>li:nth-child(n+5) {
    margin-top: 15px;
}

ol.colStep>li:nth-child(4n):before, ol.colStep>li:nth-child(4n):after {
    display: none;
}

ol.colStep>li>p {
    position: relative;
    top: 50%;
    font-size: 15px;
    transform: translateY(-50%);
    word-break: keep-all;
}
.mid2{position:absolute; left:63.3%;}