@charset "UTF-8";
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* Author : 을숙도문화회관
/* Date : 2016-10-18 ~
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* 서브 공통스타일
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* Common */
.blind {position:absolute;top:-9999px;left:-9999px;z-index:-1; height:0; padding:0; margin:0;overflow:hidden; font:0/0 Sans-serif;}
.mT20 { margin-top: 20px !important;}
.right { text-align: right; }


 /* Color */
.red, a.red {color:#e65231}
.orange, a.orange {color:#ff7113}
.blue, a.blue {color:#2466c0}
.sky, a.sky {color:#0084aa}
.green, a.green {color:#008c44}
.olive, a.olive {color:#529823}
.pp { color: #4b5399 !important;}

span[class^="bgr_"], em[class^="bgr_"] {padding:3px 5px 2px;border-radius:3px;color:#fff;font-size:0.923em;font-weight:700}
.bgr_red {background-color:#e65231}
.bgr_blue {background-color:#2466c0}
.bgr_sky {background-color:#0084aa}
.bgr_green {background-color:#008c44}
.bgr_olive {background-color:#529823}

/* Tab */
.tab_menu { margin:20px 0 10px}
.tab_menu li { float:left; width: 25%;}
.tab_menu li a {display:block; position:relative; height:42px; margin:-1px 0 0 -1px; padding:0 20px; border:1px solid #d2d4d8; background:#ebeeef; color:#6f6f6f; text-align:left; line-height:44px; font-size: 15px; text-decoration:none; transition:all .2s}
.tab_menu li a:hover, .tab_menu li a:active, .tab_menu li a:focus {border-color:#ccc; background-color: #DFDFDF; color:#222; z-index:1}
.tab_menu li.current a { position:relative; border-color:#d8507d; font-weight:700; z-index:2; background:#d8507d url(../../images/sub/tab_on.png) 90% 50% no-repeat; color: #fff; }
.tab_menu li a img { margin-right:-5px}


/* Heading */
h3.bar { margin-bottom: 10px; padding-left: 10px; font-size: 18px; line-height: 18px; color: #3b4a98; background: url(../../images/sub/icon_h3.gif) 0px 50% no-repeat; box-sizing: border-box; }
h4.circle { margin: 10px 0 10px 10px; padding-left: 15px; font-size: 15px; line-height: 15px; color: #444; background: url(../../images/sub/icon_h4.gif) 0px 50% no-repeat; box-sizing: border-box; }

/* 문단 */
.h3content { margin: 0 0 15px 5px; padding: 0 0 5px 5px; box-sizing: border-box; position: relative; }
.h4content { margin: 0 0 15px 15px; padding: 0 0 5px 12px; box-sizing: border-box; position: relative; }
.h3content p, .h4content p { padding-bottom: 5px; }
.contentBox {margin: 0 0 30px 0; }
.contentBox p {padding-bottom: 10px; }
.contentBox .ttl { font-size: 30px; line-height: 40px; padding-bottom: 15px;}
.contentBox .ttl span { color: #3c62bd; }

/* Btn */
.btn_link { display: inline-block; margin-bottom: 2px; padding: 5px 46px 5px 28px; line-height: 25px; color: #fff!important; background: #2d6eb4 url(/eulsukdo/images/sub/btn_link.png) 92% 50% no-repeat; }
.btn_link:hover { background-color: #0E4B8D; text-decoration: none; }
.url_link { display: inline-block; height: 25px; padding: 5px 35px 5px 0px; line-height: 25px; color: #1278DE!important; background: url(/eulsukdo/images/sub/url_link.png) 90% 50% no-repeat; }
.url_link:hover { color: #2d6eb4; }
.btn_file { display: inline-block; height: 20px; padding: 5px 35px 5px 18px; border: 1px solid #ddd; border-left: 2px solid #333C7D;  line-height: 20px; color: #333C7D!important; background: #fff url(/eulsukdo/images/sub/btn_file.png) 100% 50% no-repeat; }
.btn_file:hover { background-color: #f9f9f9; text-decoration: none; }

a.btn_go {display:inline-block;height:25px;margin-bottom: 2px;padding: 5px 40px 5px 28px; background:#2d6eb4 url(../../images/sub/btn_icon.png) no-repeat 90% -170px;
color:#fff;line-height:25px;text-decoration:none;transition:background-color .3s}
a.btn_go:hover { background-color: #0E4B8D; text-decoration: none; }

.btn_area { padding: 50px 0;  text-align: center; }
.btn_area .btn { margin: 0 2px; } 
.btn { display: inline-block; padding: 0px 15px; line-height: 28px; background: #4C5499; border: 1px solid #454B7E; color: #fff!important;text-align: center; border-radius: 3px; cursor: pointer; }
.btn:hover { text-decoration: none; background: #454B7E; }
.bgray { background: #6E6E6E; border-color: #6E6E6E; }
.cancel { background: #545661; border-color: #424453; }
.button { display: inline-block; padding: 5px 10px; line-height: 18px; border-radius: 3px; border: 1px solid #CDD5DE; background: #fff; font-size: 13px; color: #4e5359; text-align: center; }
.button:hover { text-decoration: none; }

.big { width: 100px; height: 45px; line-height: 45px; font-size: 15px; }
.large { width: 150px; height: 50px; line-height: 50px; font-size: 15px; background-color: #F0F4FA;  }
.large:hover { background-color: #DCE6F3; }
.small { font-size: 13px; }

/* Icon */
.ico_num_l {display:inline-block;float:none;width:18px;height:18px;margin:-3px 7px 0 0;background:url(/eulsukdo/images/sub/img_num.png) no-repeat;vertical-align:middle;/* *text-indent:0 */}
.ico_num_l.num1 {background-position:50% 0}
.ico_num_l.num2 {background-position:50% -30px}
.ico_num_l.num3 {background-position:50% -60px}
.ico_num_l.num4 {background-position:50% -90px}
.ico_num_l.num5 {background-position:50% -120px}
.ico_num_l.num6 {background-position:50% -150px}
.ico_num_l.num7 {background-position:50% -180px}
.ico_num_l.num8 {background-position:50% -210px}
.ico_num_l.num9 {background-position:50% -240px}
.ico_num_l.num10 {background-position:50% -270px}
.ico_num_l.num11 {background-position:50% -300px}
.ico_num_l.num12 {background-position:50% -330px}
.ico_num_l.num13 {background-position:50% -360px}
.ico_num_l.num14 {background-position:50% -390px}
.ico_num_l.num15 {background-position:50% -420px}

.ico_num, .ico_num_b {display:inline-block;float:none;width:16px;height:16px;margin:-2px 4px 0 0;background:url(/eulsukdo/images/sub/img_num.png) no-repeat;vertical-align:middle;/* *text-indent:0 */}
.ico_num.num1 {background-position:50% -450px}
.ico_num.num2 {background-position:50% -480px}
.ico_num.num3 {background-position:50% -510px}
.ico_num.num4 {background-position:50% -540px}
.ico_num.num5 {background-position:50% -570px}
.ico_num.num6 {background-position:50% -600px}
.ico_num.num7 {background-position:50% -630px}
.ico_num.num8 {background-position:50% -660px}
.ico_num.num9 {background-position:50% -690px}
.ico_num.num10 {background-position:50% -720px}
.ico_num.num11 {background-position:50% -750px}
.ico_num.num12 {background-position:50% -780px}
.ico_num.num13 {background-position:50% -810px}
.ico_num.num14 {background-position:50% -840px}
.ico_num.num15 {background-position:50% -870px}

.ico_num_b.num1 {background-position:50% -900px}
.ico_num_b.num2 {background-position:50% -930px}
.ico_num_b.num3 {background-position:50% -960px}
.ico_num_b.num4 {background-position:50% -990px}
.ico_num_b.num5 {background-position:50% -1020px}
.ico_num_b.num6 {background-position:50% -1050px}
.ico_num_b.num7 {background-position:50% -1080px}
.ico_num_b.num8 {background-position:50% -1110px}
.ico_num_b.num9 {background-position:50% -1140px}
.ico_num_b.num10 {background-position:50% -1170px}
.ico_num_b.num11 {background-position:50% -1200px}
.ico_num_b.num12 {background-position:50% -1230px}
.ico_num_b.num13 {background-position:50% -1260px}
.ico_num_b.num14 {background-position:50% -1290px}
.ico_num_b.num15 {background-position:50% -1320px}
.ico_num_b.num16 {background-position:50% -1350px}


/* List */
.ul_dot { padding-bottom: 5px; overflow: hidden; position: relative;}
.ul_dot li { padding: 0 0 5px 10px; background: url(/eulsukdo/images/sub/icon_arrow.gif) 0px 8px no-repeat; box-sizing: border-box; /*text-align: lefr*/}
.ul_dot li ul { padding-bottom: 10px; }
.ul_dot li ul li { padding: 0 0 0 8px; background: url(/eulsukdo/images/sub/icon_dot.gif) 0px 8px no-repeat; }
.ul_dot li ol li { padding: 0px; background: none; }
.ul_dot li ul li li { padding: 0 0 0 10px; background: url(/eulsukdo/images/sub/icon_bl.gif) 3px 10px no-repeat; }
.ul_bar {padding-top:5px; overflow: hidden; position: relative;}
.ul_bar li { padding: 0 0 3px 15px; background: url(/eulsukdo/images/sub/icon_bar.gif) 0px 9px no-repeat; box-sizing: border-box; text-align: left; }
.ul_img { clear:both; padding: 5px 0 10px; overflow: hidden; position: relative;}
.ul_img li { float: left; width: 33.330%; box-sizing: border-box; padding-left: 1px; padding-bottom: 10px; position: relative; }
.ul_img li:FIRST-CHILD {padding-left: 0}
.ul_img li.first {clear:both;float: left;}
.ul_img li img { width: 100%}
.ul_img li span { position:absolute; left: 1px; bottom:10px; display: block; text-align: center; font-size: 13px; padding: 3px; background-color: rgba(0,0,0,.8);  color: #fff; padding: 5px 10px}
.ul_img li:FIRST-CHILD span  {left: 0px}
.ul_img.col2 li {width: 50%; text-align: center;}
.ul_img.col4 li {width: 25%; text-align: center;}
.bul_num li {position:relative;padding-left:20px; margin-bottom: 5px}
.bul_num .ico_num, .bul_num .ico_num_b {position:absolute;top:5px;left:0}


/* Image */
.img_full {margin:6px 0}
.img_full, .img_full img {max-width:100%}
.img_border {margin:10px 0;padding:25px 10px !important;border:1px solid #ddd;text-align:center; overflow: hidden;box-sizing: border-box; }
.img_border img {max-width:100%}


/* Box */
.boderBox { border: 1px solid  #ddd; padding: 20px; overflow: hidden; margin-bottom: 30px}
.border_box {border: 1px solid #ddd; padding: 20px; margin-bottom: 15px; }

 /* Table */
 table {width:100%; border-collapse:collapse; border:0; border-spacing:0;/*table-layout:fixed*/}
.table { margin:4px 0 20px; border-top: 2px solid #2349B4; }
.table th, .table td { padding:8px 10px 6px; border:1px solid #ddd; line-height:1.615; vertical-align:middle}
.table thead th { border-top:0; background:#ECF0FB; text-align:center}
.table tbody th { font-weight:400; text-align:center}
.table tbody .bg { background:#f2f2f2}
.table tbody tr:first-child th, .table tbody tr:first-child td { border-top:0}
.table tbody th { background-color: #f9f9f9; font-weight: 600; }
.table tfoot th, .table tfoot td { background:#ECF0FB; font-weight: 600;}
.table .line_dash td { border-top:1px dashed #ddd; border-bottom:0}
.table .line_dash.first td { border-top:1px solid #ddd; border-bottom:1px dashed #ddd}
.tc  {text-align:center}
table td.tl, table th.tl {text-align:left !important}
table td.tr, table th.tr {text-align:right}
table td.vt { vertical-align:top }

.table.data th { padding:8px 5px 6px; font-size: 14px }
.table.data td { padding:6px 5px 4px; font-size: 13px; line-height: 18px }
.table_r {position:absolute; right:0; top:-30px; color: #888; font-size: 13px}
.table_tip { position: relative; top:-10px; font-size: 13px;}




/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* 1.0 회관안내 (Saha District Office)
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* 인사말 */
.pageTopWrap {padding-right: 100px;position: relative; margin-bottom: 30px}
.pageTopWrap .viewimg img {width: 100%;}
.pageTopWrap .infoBgbox {position: absolute; right: 0;top: 40px;z-index: 22;width: 357px;background: #0ba3ba url(../../images/sub/bg_pattern1.gif) repeat;text-align: center;padding: 50px 0;}
.pageTopWrap .infoBgbox p { color: #fff; font-size: 22px;line-height: 30px}
.pageTopWrap .infoBgbox p.eng { padding-top: 20px; font-size: 16px; letter-spacing: 1px; color:#a3d8e0}

.greeting p { padding: 10px 0; font-size: 16px; }
.greeting .point { font-size: 24px; font-weight: bold; }

.greeting .sigh { font-size: 24px; text-align: right; margin-top: 30px;  color: #000; }
.greeting .sigh img {vertical-align: bottom; padding: 0 5px;}

/* 공연시설 */
.imgArea { padding-left: 37%; position: relative; box-sizing: border-box; min-height: 200px }
.imgArea .pic {position: absolute;left: 0; top:0; width: 33.3%}
.imgArea .pic img {width: 100%}	
.imgArea .btn_wrap {padding-top: 0}
.btnWrap { margin-bottom: 30px}

/* 찾아오시는길 */
.btn_skip {font-size:0; position: relative;}
.btn_skip a {position:absolute; display:block; width:100%; left:0; text-align:center; top:-10000px; z-index:500; font-size:12px; color:#fff }
.btn_skip a:hover, 
.btn_skip a:focus, 
.btn_skip a:active{position: absolute; top: 0; padding: 10px 0;  background:#2349B4; z-index:500}
#map {position:relative;overflow:hidden;width:100%;height:350px;background-color: #eee; margin-bottom: 30px}
.customoverlay {position:relative;bottom:90px; left:4px; border-radius:6px;border: 1px solid #ccc;border-bottom:2px solid #ddd;float:left;}
.customoverlay:nth-of-type(n) {border:0; box-shadow:0px 1px 2px #888;}
.customoverlay .title {display:block;color:#000;text-align:center;border-radius:6px;font-size:14px;font-weight:bold;overflow:hidden;background:#fff;padding:10px 15px;}
/*.customoverlay .title:after {content:'';position:absolute;margin-left:-12px;left:50%;bottom:-12px;width:22px;height:12px;background:url('../../images/sub/map_vertex_white.png')}*/


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* 2.0 공연전시일정 (Saha District Office)
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/*공연전시일정 Start*/
.per_selectbox{height:100%; color:#333; letter-spacing:-0.05em; border:1px solid #38aba4; padding:15px 0; margin: 0 0 30px 0;}
.per_selectbox h3{font-family:"맑은 고딕", "Malgun Gothic", "돋움", dotum, sans-serif; font-size:1.3em; margin:0 0 15px;}
.per_selectbox div.place{padding:0 4%; min-height:175px;}
.per_selectbox div.place .place_content{float:left;}
.per_selectbox div.search{float:left; width:37%; padding:20px 6% 0;}
.per_selectbox div.bt{margin:20px 0 0;}
.per_selectbox div.place ul li{width:100px; float:left; text-align:center; height:50px; margin:0 5px 5px 0; border:1px solid #d9d9d9;}
.per_selectbox div.place ul li p{margin:14px 0;}
.per_selectbox div.place ul li p img {padding-right: 3px;}
.per_selectbox div.place ul li.on{width:100px; height:48px; border:2px solid #38aba4; font-weight:bold;}
.per_selectbox .bt_search{background:#38aba4; height:20px; width:60px; padding:3px 0; border:1px solid #38aba4; text-align:center; color:#fff; font-weight:bold; line-height:130%; font-family:"맑은 고딕", "Malgun Gothic", "돋움", dotum, sans-serif; font-size:1.1em;}
.per_selectbox .bt_search a{color: #ffffff;}
.per_selectbox div.title{padding:0 4%; min-height:175px;}

/*공연전시일정 검색박스 */
.art_selectbox {position: relative; letter-spacing:-0.05em;margin-bottom:10px;text-align: center;background:#ededed ; padding: 9px;overflow: hidden; }
.art_selectbox * {box-sizing:border-box;}
.art_selectbox li {float:left; width:12.5%; text-align:center; padding: 1px  }
.art_selectbox li p {height: 50px; line-height: 30px; padding:10px 0; border: 1px solid rgba(0,0,0,.1); cursor: pointer; color: #333; background-color: rgba(255,255,255,.8)}
.art_selectbox li.on p {border: 3px solid #029bb2;font-weight:bold; line-height: 26px;background-color: rgba(255,255,255,1);color: #000;  }
.art_selectbox li p img { vertical-align: middle;; margin-right: 3px}
.art_selectbox a {float:left; width:12.5%; text-align:center; padding: 1px  }
.art_selectbox a p {height: 50px; line-height: 30px; padding:10px 0; border: 1px solid rgba(0,0,0,.1); cursor: pointer; color: #333; background-color: rgba(255,255,255,.8)}
.art_selectbox a.on p {border: 3px solid #029bb2;font-weight:bold; line-height: 26px;background-color: rgba(255,255,255,1);color: #000;  }
.art_selectbox a p img { vertical-align: middle;; margin-right: 3px}
.art_selectbox .btnZone { float:left; width:12.5%; padding: 1px }
.art_selectbox .btn_search {display:block; width:100%; height: 50px;line-height: 50px; color: #fff; font-size: 16px; background-color: #434343; 
border: 1px solid; border-color:#434343 #323232 #323232 #434343; text-decoration: none  }
.art_selectbox .btn_search:before {display: inline-block;content:url("/common/images/common/bul_search_w.png"); margin-right: 5px;vertical-align: middle;}
.art_selectbox + p { font-size: 13px; margin-bottom: 30px}

/* 연간일정 */
.years_list {}
.years_head { position:relative;  text-align: center; background: url(../../images/sub/bg_years_.png) repeat; height: 40px; padding: 20px 20px 10px }
.years_head:after {clear:both; content: ""}
.years_head h4 {display: inline-block;font-size: 2.56em; line-height: 40px; color: #fff}
.years_head h4 span {font-size: 16px;}
.years_head a { display: inline-block; height: 32px; width:32px; text-indent:-9999px;}
.years_head a.btn_prev {background: url(../../images/sub/btn_years.png) no-repeat 0 0;  float: left}
.years_head a.btn_next {background: url(../../images/sub/btn_years.png) no-repeat 100% 100%;  float: right}
.years_list .tableSt_list { margin-top: 0!important; border-bottom: 1px solid #007b8f;}
.years_list .tableSmall td {border-right: none; border-bottom: none; border-top: none }
.years_list .tableSmall tr.month { border-top: 1px solid #e1e1e1; }
.years_list .tableSmall tr.month td:first-child {border-left: none; font-size: 2em; color: #333; line-height: 25px; padding: 10px 0; }
.years_list .tableSmall tr.month td:first-child {background-color: #fff !important;}
.years_list .tableSmall tr.month td:first-child em { display: block;; font-size: 12px;line-height: 15px}
.place_big, .place_small, .place_out, .place_room, .place_meet, .place_practice{ display: inline-block; color: #fff; line-height: 20px; height:20px; width: 70px; text-align: center; }
.place_big { background-color: #4864dc; }
.place_small { background-color: #3F7C3F; }
.place_out { background-color: #8c48dc;}
.place_room { background-color: #31708A; }
.place_meet { background-color: #D90057; }
.place_practice { background-color: #A46222; }

/* 공연게시판 목록 */
.art_list { margin:30px 0; border-top: 2px solid #4c5499;}
.art_list ul:after{display:block; clear:both; content:''}
.art_list > ul > li {float:left; padding:30px 0; width:50%; border-bottom:1px solid #ddd;}
.art_list ul li dl{position:relative; padding:0 5px 20px 190px; min-height:180px;}
.art_list ul li dl dt{margin-bottom:5px; font-size:1.20em; color:#333; font-weight:bold;}
.art_list ul li dl dt a{color:#333; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; display:block }
.art_list ul li dl dd.imgZone{position:absolute; top:0; left:15px; width:150px; height:200px;}
.art_list ul li dl dd.imgZone img{width:100%; border:1px solid #ddd; box-sizing:border-box; height:100%;}
.art_list ul li dl dd.txtZone li{position:relative; margin-bottom:3px; padding-left:75px; min-height:18px; font-size:13px; word-break:keep-all;}
.art_list ul li dl dd.txtZone li .name{position:absolute; top:0; left:0; color:#333; font-weight:bold; padding-left: 10px; }
.art_list ul li dl dd.txtZone li .name:before {position: absolute;left: 0;top: 8px;display: inline-block;content: "";width: 3px;height: 3px; background-color: #8e8fcb;border-radius: 50%;margin-right: 5px;vertical-align: middle;}
.art_list ul li dl dd.btnZone{position:absolute; left:190px; bottom:0}
.art_list ul li dl dd.btnZone .btn { padding-right: 30px; background:#434343  url("/common/images/common/bul_search_w.png") no-repeat 85% 50%; border-color: #303030}

/* 공연게시판 상세보기 */
.art_view {margin:30px 0; padding:15px 0;}
.art_view .view_tit {margin-bottom:30px;border-top: 2px solid #4c5499;  border-bottom: 1px solid #e1e1e1; font-family: 'NanumGothicWebB';font-size: 18px;background: #ffffff; padding: 15px 5px; color: #414286;}
.art_view .view_con { position:relative; margin-bottom:30px; padding:0 0 30px 300px; min-height:300px; border-bottom:1px solid #ddd;}
.art_view .view_con .imgZone{position:absolute;top:0; left:0; width:250px; text-align:center;}
.art_view .view_con .imgZone img{max-width:100%; border:1px solid #ddd; box-sizing:border-box; height:325px;}
.art_view .view_con .txtZone li {position:relative; margin-bottom:10px; padding-left:130px; min-height:20px; word-break:keep-all}
.art_view .view_con .txtZone li .name{position:absolute; top:0;left:0; color:#333; font-weight:bold;padding-left: 10px;}
.art_view .view_con .txtZone li .name:before {position: absolute;left: 0;top: 8px;display: inline-block;content: "";width: 3px;height: 3px; background-color: #8e8fcb;border-radius: 50%;margin-right: 5px;vertical-align: middle;}
.art_view .view_con .gu_txt{padding-left:10px; color:#333; font-weight:bold; background:url('/resource/img/culture/sub/show/dot.gif') no-repeat left center;}
.art_view .cont_box {position:relative; padding:0 0 30px;  border-bottom: 1px solid #e1e1e1;min-height: inherit;}

/* 스틸컷 */
ul.stillCut{margin-top:20px; text-align:center;}
ul.stillCut:after{display:block; clear:both; content:''}
ul.stillCut li{float:left; margin-bottom:10px; width:100px; }
ul.stillCut img{max-width:90%;border:1px solid #ddd; box-sizing:border-box; height:125.34px;}



/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* 3.0 대관안내 (Saha District Office)
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.img_030100 { background: #f0f4fa url(/eulsukdo/images/main/icon_c20401.png) 95% 50% no-repeat; }
.img_030200 { background: #f0f4fa url(/eulsukdo/images/main/icon_c20402.png) 95% 50% no-repeat; }
.img_030300 { background: #f0f4fa url(/eulsukdo/images/main/icon_c20403.png) 95% 50% no-repeat; }	

/* 대관절차 */
.district_step {overflow: hidden; margin-top: 50px}
.district_step li { position: relative;float:left; width: 17%;  box-sizing: border-box; text-align: center; padding: 110px 20px 20px; font-size: 16px;line-height: 22px;
 background: url("/eulsukdo/images/sub/step_img01.png") no-repeat 50% 0 ;}
.district_step li.step2 { background-image:url("/eulsukdo/images/sub/step_img02.png") }
.district_step li.step3 { background-image:url("/eulsukdo/images/sub/step_img03.png") }
.district_step li.step4 { background-image:url("/eulsukdo/images/sub/step_img04.png") }
.district_step li.step5 { background-image:url("/eulsukdo/images/sub/step_img05.png") }
.district_step li.step6 { background-image:url("/eulsukdo/images/sub/step_img06.png"); width: 15%;}
.district_step li:after { display:block; content:url("/eulsukdo/images/sub/step_arrow.png"); position: absolute;; left: -10px; top:30px}
.district_step li.step1:after { display: none}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* 4.0 사이버문화공간 (Saha District Office)
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* 관람예절 */
.bg_box { min-height: 100px; box-sizing: border-box; border: 1px solid #e2e5eb; padding: 30px 160px 20px 30px; margin-bottom: 30px; background-color: #f0f4fa; }
.bg_box p { margin-bottom: 10px}
.img_040101 { background: #f0f4fa url(../../images/sub/img_040101.png) 95% 50% no-repeat; }	

/* vr 파노라마 */
.vrBox {}
.vrBox .vr_menu { position: relative; letter-spacing: -0.05em; margin-bottom: 10px; background: #ededed; padding: 5px; overflow: hidden;}
.vrBox .vr_menu li { float: left; width: 33.3%; padding-left:10px; box-sizing: border-box; }
.vrBox .vr_menu dl.vr3 dd { width: 33.3%;}
.vrBox .vr_menu li:first-child {padding-left:0px;}
.vrBox .vr_menu dl { border: 1px solid rgba(0,0,0,.1);background-color: rgba(255,255,255,.8); min-height: 145px; padding-bottom: 2px }
.vrBox .vr_menu dt { height: 20px; color: #fff; padding: 60px 20px 0px; margin-bottom: 1px; font-size: 16px; line-height: 16px}
.vrBox .vr_menu dd { padding:0; float: left; width: 50%;}
.vrBox .vr_menu dd a{ display: block; min-height: 30px; line-height: 30px; padding: 0 0 0 10px; text-decoration: none}
.vrBox .vr_menu dd a:before  { display: inline-block; content:""; margin: 0 5px 0 10px; width: 3px ;height: 3px; background-color: #333; border-radius:50%; vertical-align: middle;}
.vrBox .vr_menu dd.active a { font-weight: bold; color: #029bb2; background-color: #eee}
.vrBox .vr_menu dd.active a:before {background-color: #029bb2;}
.vrBox .vr_viewer {clear:both; background-color: #fff; min-height: 400px; border: 1px solid #ddd; background: url("../../images/sub/vr_bg.png") no-repeat 50% 0;}
.vrBox .vr_menu dl.vr1 dt{ background: url(../../images/sub/img_01_03_04.jpg) 50% 50% no-repeat; }
.vrBox .vr_menu dl.vr2 dt{ background: url(../../images/sub/img_01_03_03.jpg) 50% 70% no-repeat; }
.vrBox .vr_menu dl.vr3 dt{ background: url(../../images/sub/img_01_02_03.jpg) 50% 50% no-repeat; }

/* VR파노라마 */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* 5.0 게시판 (Saha District Officee)
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* 약관동의 */
.h150_scroll { overflow-y: scroll;height: 130px;padding: 20px 30px;border: 1px solid #ccc;background: #fafafa; line-height: 20px}
.h150_scroll p { margin-bottom: 10px;}
.h150_scroll li { margin-top: 5px; padding-left: 20px; position: relative;color: #666}
.h150_scroll li span { position: absolute; left: 0; top:0}
.h150_scroll + p { text-align: center; margin-bottom: 20px }

/* 설문조사 */
.poll_title { border-top:2px solid #4c5499;font-family: 'NanumGothicWebB'; text-align: center; font-size: 18px;line-height: 25px; color: #414286; padding: 15px 10px;}
.poll_view {margin-bottom: 40px; background: url(/common/images/application/bg_poll_title.png) repeat 0 0; padding: 20px;border: 1px solid #bbb;}
.poll_view .cont_box { min-height: inherit; padding: 0px; margin-bottom: 30px}
.poll_view .poll_date { padding: 15px 20px; background-color: #fff; font-size: 15px; overflow: hidden;}
.poll_view .poll_date li {position:relative; line-height: 25px; margin: 3px 0;font-weight: bold; float: left;  }
.poll_view .poll_date li:first-child {margin-right: 70px}
.poll_view .poll_date span {display: inline-block; font-weight: normal; border-radius:10px; background-color: #d84374; color: #fff; margin-right: 10px; width: 70px; 
text-align: center;line-height: 25px;}
.poll_write { padding: 20px; margin-bottom: 30px; border: 1px solid #bbb; overflow: hidden;}
.poll_list .poll_guide { padding: 10px 20px; border: 1px solid #cdd5de; background: #f0f4fa; margin: 0 0 10px ; color:#243a98}
.poll_list dl { padding: 10px 10px 20px; margin-bottom:15px; border-bottom: 1px solid #ddd; overflow: hidden; }
.poll_list dl dt {  font-size: 15px; font-weight: 600; margin-bottom: 8px}
.poll_list dl dt span {display: inline-block; font-weight: normal; border-radius:5px; background-color: #6e6e6e; color: #fff; margin-right: 10px; width: 90px; 
text-align: center;}
.poll_list dl dd { padding: 1px 0 1px 0}
.poll_list dl dd label { margin: 0 10px}


/* Write */
.tb_write { border-top: 2px solid #4C5499; }
.tb_write th, .tb_write td {padding: 6px 15px 6px; border:1px solid #ddd; border-width: 1px 0 1px 0; line-height:1.615;vertical-align:middle}
.tb_write th { background: #F8F8F8; }
.tb_write thead th {border-top:0;background:#f8f8f8;text-align:center; padding: 10px 0; font-size: 15px }
.tb_write td .ir { position: absolute; }

/*공통 인풋 스타일*/
input[type="text"], input[type="password"]  { padding: 2px; line-height: 20px; border: 1px solid #D1D6DD; }
input[type="radio"] label { padding: 2px; line-height: 28px; }
input.bgtxt { background-color: #F5F6F8; }
input.long { width: 450px; }
input.input_tel { width: 60px; background-color: #F5F6F8; }
input.input_yyyy { width: 60px; background-color: #F5F6F8; }
input.input_md { width: 40px; background-color: #F5F6F8; }
input.post { width: 60px; }
select { padding: 2px; height: 30px; line-height: 28px; border: 1px solid #D1D6DD; color: #777; }
.input_wrap { }
.radio_wrap { padding: 5px; }
.radio_wrap label { padding: 2px 20px 2px 0; }
.address_wrap { padding-top: 3px; }
.address_wrap .long { width: 40%; }
.address_wrap .char { padding: 0 10px 0 20px }



/* popup */
.popWrap { position:relative; box-sizing: border-box;}
.popWrap h2 { background: url(../../images/sub/bg_years_.png) repeat; color: #fff; min-height: 30px; line-height: 30px; font-size: 1.846em;padding: 20px; margin-bottom: 20px; }
.popWrap h3 { margin-left: 10px; padding: 10px; }
.popWrap .popCont {padding: 10px;}
.popWrap .table {font-size: 13px; }
.popWrap .popCont .img_border { margin-top: 0}
.popWrap .table ul.ul_dot {padding-bottom: 0px; padding-top: 5px;}
.popWrap .btn_close { position: absolute; right: 20px; top:20px; width: 24px; height: 24px; text-indent: -9999px; background: url(../../images/sub/btn_close.png) no-repeat 50% 50%; }


@media (max-width: 1024px) {

}
@media (max-width: 900px) {
	.greeting .pic { min-height: inherit; }
	
	/*공연전시일정 검색박스 */
	.art_selectbox { padding: 4px}
	.art_selectbox li,
	.art_selectbox .btnZone {width:25%; }	
	.art_list > ul > li {float:none;  width:100%; }
	
	/* vr 파노라마 */
	.vrBox .vr_menu dl { min-height:230px; }
	.vrBox .vr_menu dd { float: none; width: inherit !important;}

}
@media (max-width: 810px) {	
	.pageTopWrap { margin-bottom: 40px; padding-right: 0 !important;}
	.pageTopWrap .infoBgbox {position: inherit; right: inherit;top: inherit;width: 94%; padding: 20px; margin: -30px 3% 0 3%; box-sizing: border-box; }  
    .pageTopWrap .infoBgbox p { font-size:20px;line-height: 25px}
    .pageTopWrap .infoBgbox p br { display: none}
	.pageTopWrap .infoBgbox p.eng { font-size: 13px;padding-top: 5px; }
	.ul_img.variable li { width: 50%}
	.ul_img.variable li:last-child { display: none}
	.imgArea { padding-left: 50%; }
	.imgArea .pic {width: 48%}
	.district_step { padding-left: 20px}
	.district_step li {width: 33.3% !important;  }

}
@media (max-width:767px) {
	.tab_menu li { width: 50%;}
	#map {height:300px;}
	.table td br { display: none}
	.bg_box { padding: 15px 15px 0px!important; background: #f0f4fa none !important; }
		
	.art_view .view_con{padding-left:45%;}
	.art_view .view_con .imgZone{width:40%;}
	.art_view .view_con .txtZone li{padding-left:70px;}
	.art_view ul.stillCut li {width:33.3%; }
	
}
@media (max-width: 620px) {
	.greeting .pic { float:none; margin: 0 auto 20px;  }
	.greeting .ttl { font-size: 25px; line-height: 35px}
	
	.imgArea { padding-left: 0px; }
	.imgArea .pic {position: relative;width: 100%; margin-bottom: 10px}
	
	.ul_img.col4 li {width: 50%;}
	.ul_img.col4 li:nth-child(3) {padding-left: 0; clear: both; float: left;}
	.contentBox .ttl {font-size: 22px; line-height: 30px;}
	.district_step { padding: 0; margin-top: 0px}
	.district_step li { float:none; width: inherit !important; padding:10px; border: 2px solid #029bb2; background: none !important; margin-bottom: 20px }
	.district_step li:after {content:url("/eulsukdo/images/sub/step_arrow2.png"); left: 50%; top:-23px; margin-left: -7px }

	.ul_img li { float:none; width: 100%}	
	.ul_img.variable li:last-child  { display: block;}
	.ul_img.variable li {float:left; width: 50%}
	.ul_img.variable li:first-child {float:none;  width: 100%; padding-bottom: 1px}
	
	.art_list > ul > li{padding:20px 0}
	.art_list ul li dl{padding:0 10px 20px 35%;}
	.art_list ul li dl dd.imgZone{left:10px; width:30%;}
	.art_list ul li dl dd.btnZone{left:35%}
	.art_list ul li dl dd.txtZone li{padding-left:75px;}
	
	.poll_view .poll_date li { float: none;}
	.poll_view .poll_date li:first-child {margin-right: 5px}
}
@media (max-width: 450px) {
	.tab_menu li { width: 100%;}
	.btn_link{ display: block; }

	.art_selectbox li {width:33.3%; font-size: 13px }
	.art_selectbox .btnZone {width:66.6%; }
	
	.art_list ul li dl{padding:0 0 40px 0; }
	.art_list ul li dl dd.imgZone{position:relative; top:0; left:0; margin:0 0 20px 0; width:150px;}
	.art_list ul li dl dd.btnZone{left:0}
	
	.art_view .view_con{padding-left:0}
	.art_view .view_con .imgZone{position:relative; top:0; left:0; margin-bottom:20px; width:auto;}
	.art_view .view_con .imgZone{text-align:center;}
	
	/* vr 파노라마 */
	.vrBox .vr_menu li { float: none; width:inherit;padding-left: 0px; }
	.vrBox .vr_menu dl { min-height:inherit; }
	.vrBox .vr_menu dl.vr2 { margin: 10px 0; }
	.vrBox .vr_menu dl dt {background-size: cover !important; }
	
	
	/* 설문조사 */
	.poll_view {padding: 20px;}
	.poll_view .poll_date { padding:15px 0 0; background: none; font-size: 14px; border-top: 1px dotted #ddd}
	.poll_view .poll_date li { margin-bottom: 10px}
	.poll_view .poll_date span { width: 60px; margin-right: 5px;font-size: 13px}
	
}	
@media (max-width: 360px) {
	
}


/* Calendar */
.fc_calendar_container{
  height:auto;
  bottom:0px;
  width:100%;
  top:50px;
}
.fc_calendar{
  width:100%;
  height:100%;
  border:1px solid #d7d7d7;
  border-width:0 1px 0 1px;
}

.fc_calendar_header{
  display:inline-block;
  width:100%;
  background-color:#565656;
  border: 1px solid #d7d7d7;
}
.fc_calendar_header .fc_month_year{
  position:relative;
  margin:0 auto;
  width:209px;
  line-height:54px;
  background-image:none;
  font-size:24px;
  font-weight:600;
  color:#fff;
  text-align:center;
}
.fc_calendar_header .fc_month_year .fc_month{
  color:#ff811c;
}
.fc_calendar_header .fc_month_year .fc_nav {
  position:absolute;
  left:0px;
  top:13px;
  width:209px;
}
.fc_calendar_header .fc_month_year .fc_nav a{
  float:left;
  width:28px;
  height:28px;
  color:transparent;
  cursor:pointer;
  background:url('../../images/sub/fc_left_btn.gif');
  margin:0 1px;
  font-size:20px;
}
.fc_calendar_header .fc_month_year .fc_nav a.fc_next{
  float:right;
  background:url('../../images/sub/fc_right_btn.gif');
}
.fc_calendar .fc_head{
  position:relative;
  width:100%;
  height:34px;
  line-height:34px;
  background-color:#f3f3f3;
  border-bottom:1px solid #d7d7d7;
}
.fc_calendar .fc_body{
  position:relative;
  width:100%;
  height:100%;
}
.fc_calendar .fc_row{
  width:100%;
  height:140px;
  border-bottom:1px solid #d7d7d7;
}
.fc_calendar .fc_row td,
.fc_calendar .fc_head th{
  position:relative;
  float:left;
  width:13.9%;
  height:100%;
  border-right:1px solid #d7d7d7;
}
.fc_calendar .fc_head th{
  width:13.9%;
  font-size:13px;
  color:#555;
  text-align:center;
}
.fc_calendar .fc_head th.fc_sat{
  color:#0fabad;
  border-right:none;
}
.fc_calendar .fc_head th.fc_sun{
  color:#f55f46;
}
.fc_calendar .fc_row td{
  position:relative;
  background-color:#fff;
  overflow:hidden;
  min-height:140px;
}
.fc_calendar .fc_row td a.fc_point{
  display:inline-block;
  width:100%;
  height:100%;
}
.fc_calendar .fc_row td a.fc_point:hover,
.fc_calendar .fc_row td a.fc_point:focus{
  background-color:#f3f3f3;
}
.fc_calendar .fc_row td span.fc_date{
  position:absolute;
  bottom:auto;
  right:10px;
  top:10px;
  left:auto;
  width:30px;
  height:20px;
  line-height:20px;
  font-size:13px;
  font-weight: bold;
  color:#383838;
  text-align:right;
}
.fc_calendar .fc_row td ul li.fc_cont{
  /* display:block; */
  /* position:absolute; */
  /* bottom:15px; */
  /* left:15px; */
  /* width:85%; */
  line-height:18px;
  font-size:12px;
  color:#555;
  /* overflow:hidden; */
  /* word-wrap:normal; */
  /* white-space:nowrap; */
  /* text-overflow:ellipsis; */
  padding-left: 3px;
  padding-bottom: 3px;
}
.fc_calendar .fc_row td {
  min-height:150px;
}
.fc_calendar .fc_row td div.sbrs{
  line-height:14px;
}

.fc_calendar .fc_row td div.fc_weekday{
  display:none;
  padding-left:5px;
}
.fc_calendar .fc_row td.fc_today{
  background-color:#f3f3f3;
}
.fc_calendar .fc_row td.fc_activeday{
  background-color:#f3f4e6;
}
.fc_calendar .fc_row td.fc_sun{
  /* background-color:#fefafa; */
}
.fc_calendar .fc_row td.fc_sat{
  border-right:none;
  width:14.5%;
}
.fc_calendar .fc_row td.fc_empty{
  background-color:#fcfcfc;
}
.fc_calendar .fc_row td.fc_sun div.fc_weekday,
.fc_calendar .fc_row td.fc_sun span.fc_date{
  color:#f55f46;
}
.fc_calendar .fc_row td.fc_sat div.fc_weekday,
.fc_calendar .fc_row td.fc_sat span.fc_date{
  color:#0fabad;
}



/*공연전시일정 Start*/
.per_selectbox{height:100%; color:#333; letter-spacing:-0.05em; border:1px solid #38aba4; padding:15px 0; margin: 0 0 30px 0;}
.per_selectbox h3{font-family:"맑은 고딕", "Malgun Gothic", "돋움", dotum, sans-serif; font-size:1.3em; margin:0 0 15px;}
.per_selectbox div.place{padding:0 4%; min-height:175px;}
.per_selectbox div.place .place_content{float:left;}
.per_selectbox div.search{float:left; width:37%; padding:20px 6% 0;}
.per_selectbox div.bt{margin:20px 0 0;}
.per_selectbox div.place ul li{width:100px; float:left; text-align:center; height:50px; margin:0 5px 5px 0; border:1px solid #d9d9d9;}
.per_selectbox div.place ul li p{margin:14px 0;}
.per_selectbox div.place ul li p img {padding-right: 3px;}
.per_selectbox div.place ul li.on{width:100px; height:48px; border:2px solid #38aba4; font-weight:bold;}
.per_selectbox .bt_search{background:#38aba4; height:20px; width:60px; padding:3px 0; border:1px solid #38aba4; text-align:center; color:#fff; font-weight:bold; line-height:130%; font-family:"맑은 고딕", "Malgun Gothic", "돋움", dotum, sans-serif; font-size:1.1em;}
.per_selectbox .bt_search a{color: #ffffff;}
.per_selectbox div.title{padding:0 4%; min-height:175px;}

.spclArtInfoTitle  {
  font-size: 21px;
}
.artInfoTitle  {
  font-size: 21px;
}
.list_item {float:left; width:100%; height:250px; border-bottom:#e2e2e2 1px solid}
.list_post {float:left; margin-top:12px; width:200px; height:214px; border:#e2e2e2 1px solid; padding:3px 4px 3px 4px}
.list_info {float:left; margin-left:20px; min-width:720px; height:130px; margin-top:15px; }
.list_title {font-size:17px; font-weight:bold; height:35px; }

.year_title {text-align: center; font-size: 22px; padding-top:15px; }
.tableSmall td {
  padding: 7px 3px;
  text-align: center;
  border: 1px solid #e1e1e1;
  line-height: 15px;
  font-size: 12px;}

/*공연전시일정 End*/