@charset "utf-8";
/* com2zoa design  KYJ 20211203 */
/* com2zoa design  KJH 20230113 부분 리뉴얼 */

@keyframes handshake {
  50% {
	background-image:none
  }
}

/* ----------------------컨텐츠 공통---------------------- */
/****Table****/
.art_table{margin:0 0 25px}
.art_table table{width: 100%}
.art_table .txtleft {text-align: left; padding-left: 10px}
/*모바일 아래에서 표 내용이 너무많을때 사이즈 고정후 스크롤 하기 테이블 감싸고 있는 div한테 table_scroll 클래스 주면됨*/	
.table_scroll{overflow-x: auto; position: relative}
.table_scroll .mb_txt{line-height:0; font-size:0; text-indent:-9999999px}
.table_scroll table {min-width:450px}
.scroll_txt{display: none}
/*표_색상:회색(기본) - !!!!!!!!!!!!!table_scroll이 적용 안되는 테이블은 각페이지 고유 클래스 하위 art_table에 overflow: hidden 줘야함*/
.art_table {width:100%;  border-collapse:collapse; table-layout:auto; background:#f1f1f1}
.art_table.tb_border{overflow: hidden}
.art_table thead th { line-height:150%; padding:10px 3px;  border:1px solid rgba(255,255,255,0.5); border-top:1px solid rgba(255,255,255,0.5);  vertical-align:middle;text-align:center; font-weight:300; font-size: 16px; color:#fff}
.art_table thead th:first-child {border-left:1px solid rgba(255,255,255,0.5)}
.art_table thead th:last-child {border-right:1px solid rgba(255,255,255,0.5)}
.art_table tbody th {line-height:150%; background:#f7f7f7; padding:9px 3px; border:1px solid #cacaca;  text-align:center; font-weight:500; vertical-align:middle; color:#30302e}
.art_table tbody td {line-height:150%; background:#fff; padding:9px 3px; border:1px solid #cacaca;text-align:center; vertical-align:middle; color:#4d4d4d; word-break:keep-all} 
/*표_색상:초록*/
.art_table .table_st01 {background:#50606f}
.art_table ul{margin: 0 5px; text-align: left; font-size:0.933em}
.art_table ul li{padding-left: 10px; margin-top: 3px; background:url(../images/contents/blt_txtlst.gif) left 4px no-repeat; line-height: 130%}
.art_table ul li:last-child{margin-bottom: 0}

/*thead없는 경우*/
/*type1*/
.art_table.none_head{overflow: hidden}
.art_table.none_head tbody th{background:#50606f; color:#fff}
.art_table.none_head tbody td.bg_tit{background: #f1f1f1}
/*type2*/
.art_table.none_head2 tbody th{background:#f1f1f1}
.art_table.none_head2 tbody th.bg_prog01, .art_table.none_head2 tbody td.bg_prog01{background: #ffb83d; color:#fff}
.art_table.none_head2 tbody th.bg_prog02, .art_table.none_head2 tbody td.bg_prog02{background: #ff7686; color:#fff}
.art_table.none_head2 tbody th.bg_prog03, .art_table.none_head2 tbody td.bg_prog03{background: #c384e3; color:#fff}
.art_table.none_head2 tbody th.bg_prog04, .art_table.none_head2 tbody td.bg_prog04{background: #1bc294; color:#fff}
.art_table.none_head2 ul{padding:10px; margin: 0 5px; border-radius: 5px; background: #f1f1f1; text-align: left; font-size:0.933em}
.art_table.none_head2 ul li{padding-left: 10px; margin-bottom: 5px; background:url(../images/contents/blt_txtlst.gif) left 4px no-repeat; line-height: 130%; font-weight: 500}
.art_table.none_head2 ul li:last-child{margin-bottom: 0}

/*col class 선언영역*/
.wdtfix{width:40px}
.wdt5{width: 5%}
.wdt8{width: 8%}
.wdt9{width: 9%}
.wdt10{width: 10%}
.wdt12{width: 12%}
.wdt13{width: 13%}
.wdt15{width: 15%}
.wdt20{width: 20%}
.wdt25{width: 25%}
.wdt30{width: 30%}
.wdt33{width: 33.3%}
.wdt40{width: 40%}
.wdt50{width: 50%}
.wdt60{width: 60%}
.wdt70{width: 70%}
.wdt80{width: 80%}
.wdt90{width: 90%}
.wdtauto{width: auto}

/*폰트에서 span color사용시 색지정*/
/*(span에 단독으로 스타일을 주면 모든 span 태그에 font-weight가 지정되므로 bold는 각각 지정함)_더 두껍게 할 시에는 고유클래스 아래에 지정  */
span.col_r{font-weight: 400; color:#ff1833}
span.col_g{font-weight: 400; color:#76a84e}
span.col_b{font-weight: 400; color:#2273e1}
span.col_o{font-weight: 400; color: #ff7b11}
span.col_p{font-weight: 400; color: #ae4ce6}
span.col_pk{font-weight: 400; color: #f86b96}
span.col_bb{font-weight: 500; color:#202020}
/*폰트에서 bg span color사용시 색지정*/
span.bgcol_pk{background: #ff75a2; color:#fff}
span.bgcol_g{background: #9ccc5e; color:#fff}
span.bgcol_o{background: #ff9e56; color:#fff}
span.bgcol_n{background: #4e3333; color:#fff}

/*공통 타이틀 스타일*/
.art_toptit{text-align: center}
.art_toptit .mark_tit{position: relative; display: inline-block; margin: 20px 0 10px;  font-size:1.286em; }
.art_toptit .mark_tit::before, .art_toptit .mark_tit::after {content: ""; display: block; clear: both; position: absolute; top:-10px; width: 23px; height: 15px}
.art_toptit .mark_tit::before{left:-35px; background:url(../images/contents/tit_mark01.gif) left top no-repeat}
.art_toptit .mark_tit::after{right:-35px; background:url(../images/contents/tit_mark02.gif) left top no-repeat}

/*공통 텍스트 리스트 스타일*/
.art_txtbox{padding:15px 17px; margin-bottom:20px; border-radius: 5px; border:1px solid #ddd}
.art_txtbox ul li{padding-left: 12px; margin-bottom: 5px; background:url(../images/contents/blt_txtlst.gif) left 6px no-repeat; line-height: 130%}
.art_txtbox ul li:last-child{margin-bottom: 0}

/* -------------------컨텐츠 스타일 시작 -------------------*/
/*인사말*/
.art_greet {padding-bottom:30px}
.art_greet .greet_toptit{position: relative;/* height:271px;*/ padding:205px 40px 20px; background:url(../images/contents/bg_greet_top.jpg) no-repeat 50% 0; box-sizing: border-box}
.greet_tit {overflow:hidden; position:relative; padding:42px 36px; background:#323a53; color:#fff; font-weight:300; word-break:keep-all}
.greet_tit span {font-weight:600}
.grtit01 {padding-bottom:12px;font-size:1.857em}
.grtit02 {font-size:1.143em}
.greet_tit:before {content:""; display: block; position:absolute; top:-56px; right:-123px; width:442px; height:442px; border-radius:50% 50%; background:rgba(0,0,0,0.3) url(../images/contents/img_greet_artlogo.png) no-repeat left 52px top 92px}
.art_greet .greet_tb{padding-top:10px;text-align: center; line-height:170%; font-size:1.071em; font-weight:300}
.art_greet .greet_tb > p{margin-bottom: 25px}
.art_greet .greet_tb div.gt_txtbg{position: relative; padding: 20px; border:2px solid #e4e4e4}
.art_greet .sign_box{margin-top:20px; text-align: center}
.art_greet .sign_box .greet_date{margin-bottom:5px}
.art_greet .sign_box .greet_sign {font-size:1.143em; font-weight:600; letter-spacing:4px}
.art_greet span.col_pk {color:#b60468}
.art_greet span.col_b {color:#008cd6}

/*연혁*/
.art_history .his_top{overflow:hidden; position:relative; padding:60px 20px 30px; background:linear-gradient(45deg, #0a63b2, #338ee9); text-align: center}
.art_history .his_top:before {content:""; display:block; position:absolute; bottom:0; right:0; width:100%; height:100%; background:url(../images/contents/bg_histop_img.png) no-repeat 96% 100%}
.art_history .his_subtit {position:absolute; top:0; left:50%; margin-left:-160px; width:320px; padding:0 40px 10px; background:#fff; border-radius:0 0 50px 50px; font-size:1.071em; box-sizing: border-box}
.art_history .his_tit{display:block; font-size:1.857em; font-weight:800; color:#fff}
.art_history .his_wrap{position: relative}
.art_history .his_tb{position: relative; padding:40px 0 30px}
.art_history .his_tb::before, .art_history .his_tb::after{content: ""; display: block; clear: both; position: absolute}
.art_history .his_tb::before{top:0; left:50%; width: 1px; height: 100%; margin-left: -1px; background: #d4d4d4}
.art_history .his_tb::after{bottom:0; left: 50%; width:13px; height:13px; margin-left: -7px; background:#606060; border-radius: 50%}
.art_history .his_box{margin-bottom: 10px}
.art_history .year_wrap{width: 50%; padding: 10px ; box-sizing: border-box}
.art_history .year_right{margin-left: 50%; padding-left: 15px}
.art_history .year_left{margin-right: 50%; padding-right: 15px; text-align: right}
.art_history .year_box dt{position: relative; display: inline-block; min-width: 124px; height: 28px; line-height: 28px; margin-bottom:15px; padding:0 15px; border-radius: 50px; border: 2px solid #7d7d7d; box-sizing: border-box; text-align: center; font-size: 1.071em; }
.art_history .year_right dt::before, .art_history .year_left dt::before{content: ""; display: block; clear: both; position: absolute; top:7px; width: 10px; height: 10px; border-radius: 50px; background:#7d7d7d; z-index: 10}
.art_history .year_right dt::before {left:0; margin-left: -22px}
.art_history .year_left dt::before {right:0; margin-right: -22px}
.art_history .his_tb > div:first-child .year_box dt{border-color:#3698f3; background:#3698f2; color:#fff} 
.art_history .his_tb > div:first-child .year_right dt::before, .art_history .his_tb > div:first-child .year_left dt::before{background:#3698f3}
.art_history .year_box dt span{display: block; margin-top: -2px; font-weight:500}
.art_history .year_right .year_lst{margin-left: 5px}
.art_history .year_left .year_lst{margin-right: 5px}
.art_history .year_lst li{margin-bottom: 12px; line-height: 130%; word-break:keep-all}
.art_history .year_lst span.date{display:block;  min-width: 120px; font-weight:600; color:#000}
.art_history .year_lst span.txt{display:block; word-break:keep-all; font-weight:500}
.art_history .year_right .year_lst span.txt { margin:-18px 0 0 120px}
.art_history .year_left .year_lst span.txt{margin:-18px 120px 0 0}

.art_history .year_right .year_lst span.txt.longtxt { margin:0}
.art_history .year_left .year_lst span.txt.longtxt { margin:0}

.art_history .year_lst .year_sublst {font-size:0.923em; margin-top:5px}
.art_history .year_lst .year_sublst li {position:relative; display:inline-block; line-height:120%; margin:3px 0; padding-left:12px}
.art_history .year_lst .year_sublst li:after {content:"-"; display:block; position:absolute; top:0; left:0; width:5px; height:5px; font-weight:600}
.art_history .year_right .year_lst .year_sublst { margin:5px 0 0 120px}
.art_history .year_left .year_lst .year_sublst { margin:5px 120px 0 0}

/*현황*/
.art_condition .facility_box{padding: 13px; margin-bottom:20px; border-radius:3px; border:2px solid #ddd; background:url(../images/contents/facility_bg.png) right bottom no-repeat}
.facility_box ul li{margin-bottom: 8px; font-weight: 500}
.facility_box ul li:last-child{margin-bottom: 0}
.facility_box ul li span{display:inline-block; padding:5px 15px 5px 35px; margin-right: 10px; border-radius: 50px; background-position:  10px center; background-repeat: no-repeat; color:#fff}
.facility_box ul li span.location_tit{background-color: #3ba4e7; background-image:url(../images/contents/ico_location.png)}
.facility_box ul li span.scale_tit{background-color: #267cb2; background-image:url(../images/contents/ico_scale.png)}

.facview_tit {display:block; margin-top:30px; text-align:center; padding-bottom:10px; background:url(../images/contents/bg_facview_arr.png) no-repeat 50% 100%}
.facview_tit span {display:inline-block; padding:10px 35px; background:#292f45; border-radius:10px; text-align:center; color:#fff; font-weight:300; font-size:1.267em}
.facview_tit img {margin:0 4px; vertical-align:middle}
.facview_tit span.pc_none {display:none}

/*찾아오시는 길*/
.art_map .map_area {width:100%!important; margin:0; border:1px solid #e0e0e0; box-sizing: border-box}
.art_map .map_area .root_daum_roughmap { width:100%!important; padding:0; border-radius:10px}
.art_map .map_area .root_daum_roughmap .wrap_map {overflow:hidden; height:400px !important; border-radius:10px}
.art_map .map_tb{margin:20px 0 30px; border:1px solid #ccc}
.art_map .map_tb > dl{float: left; width: 50%}
.art_map .map_tb > dl dt{float: left; width: 25%; height:54px; line-height: 54px; background:#50606f; color:#fff; text-align: center; font-weight: 500; font-size:1.071em}
.art_map .map_tb > dl dt span{display:inline-block; padding: 0 0 0 34px}
.art_map .map_tb > dl.add_box dt span{background: url(../images/contents/ico_add.png) no-repeat left center}
.art_map .map_tb > dl.call_box dt span{background: url(../images/contents/ico_call.png) no-repeat left center}
.art_map .map_tb > dl dd{float: left; width: 75%; padding:17px 12px; box-sizing: border-box}
.art_map .map_traffic > div dt{margin-bottom:30px; font-weight: 600; font-size:1.333em}
.art_map .traffic_subway{padding:15px 10px 20px 90px; margin-bottom: 15px; border-bottom: 1px solid #d0d0d0; background: url(../images/contents/ico_traffic1.gif) no-repeat left top}
.art_map .traffic_subway li{float: left; margin:0 15px 5px 0}
.art_map .traffic_subway li:last-child{margin-right: 0}
.art_map .traffic_subway span.subway_num{display: inline-block; width: 24px; height: 24px; line-height: 24px; margin-right: 5px; background:#7cb53f; border-radius: 50%;  color:#fff; text-align: center}
.art_map .traffic_bus{padding:15px 10px 20px 90px; margin-bottom: 15px; border-bottom: 1px solid #d0d0d0; background: url(../images/contents/ico_traffic2.gif) no-repeat left top}
.art_map .traffic_bus li{margin-bottom: 13px; line-height:150%}
.art_map .traffic_bus span.bus_kind{display:inline-block; padding: 3px 15px 1px; margin-right: 10px; border-radius: 50px; color:#fff; font-size: 14px; font-weight:400}
.art_map .traffic_bus span.buskind01{background: #3a86ee}
.art_map .traffic_bus span.buskind02{background: #5cb03e}
.art_map .traffic_bus span.buskind03{background: #fb5050}
.art_map .traffic_bus span.buskind04{background: #5cb03e}
.art_map .traffic_bus span.bus_num{display: block; margin: -24px 0 0 70px}
.art_map .traffic_park {padding:28px 10px 28px 90px; background: url(../images/contents/ico_park.gif) no-repeat left top}
.art_map .traffic_park dl dt {display:inline-block; margin-bottom:0; margin-right:20px}
.art_map .traffic_park dl dd {display:inline-block;}

/*프로그램 전체소개*/
.art_program .prog_toptit{margin: 25px 0 40px; text-align: center}
.art_program .tit_txt{margin-top: 10px; font-size: 1.143em}
.art_program .tit_txt br{display: none}
.art_program .prog_box{margin-bottom: 50px}
.art_program .prog_box .prog_titbox{position: relative; text-align: center}
.art_program .prog_box .prog_titbox::after{content: ""; display: block; clear: both; position: absolute; top:17px; width:100%; height: 1px; border-radius: 50px; background:#ccc; z-index: 1}
.art_program .prog_titbox .tit_box{position: relative}
.art_program .prog_titbox .tit_box::before, .art_program .prog_titbox .tit_box::after{content: ""; display: block; clear: both; position: absolute; top:13px; width: 10px; height: 10px; border-radius: 50px; background:#ccc; z-index: 10}
.art_program .prog_titbox .tit_box::before{left: 0}
.art_program .prog_titbox .tit_box::after{right: 0}
.art_program .prog_titbox .tit{position: relative; display: inline-block; padding:7px 45px; border-radius: 50px; background: #ccc; text-align: center; font-size: 1.071em; color:#fff; z-index: 10}
.art_program .prog_titbox .tit span{font-size:1.267em; font-weight: 600}
.art_program .prog_lst{margin-top:100px}
.art_program .prog_lst ul{text-align: center}
.art_program .prog_lst ul li{float: left}
.art_program .prog_lst ul li .prog_item{width: 190px; margin: 0 auto; transition: 0.6s}
.art_program .prog_lst .item_top{position: relative; min-height: 113px; border-radius: 50px 50px 0 0; background: #ccc; transition: 0.6s}
.art_program .item_top .img{position: absolute; top:-80px; left:50%; margin-left:-70px}
.art_program .item_top .explain{padding-top: 80px; font-weight: 500; color:#fff}
.art_program .prog_lst .item_body{padding:15px 10px; border-radius: 0 0 10px 10px; background: #f1f1f1}
.art_program .item_body .tit span{font-weight: 600}
.art_program .item_body .prog_btn a{display: block; margin-top: 12px; padding: 6px; border-radius: 50px; background-image: url(../images/contents/prog_btn.png); background-repeat: no-repeat; background-position:right center; background-color:#ccc; color:#fff; font-weight: 500; transition: 0.6s}
.art_program .item_body .prog_btn span{margin-left: -8px}
/*프로그램 개수별 넓이 지정영역*/
.art_program .prognum2 ul{margin: 0 220px}
.art_program .prognum2 .prog_lst ul li{width: 50%}
.art_program .prognum3 ul{margin: 0 115px}
.art_program .prognum3 .prog_lst ul li{width: 33.3%}
.art_program .prognum4 ul{margin: 0}
.art_program .prognum4 .prog_lst ul li{width: 25%}
/*영역별 타이틀, 배경색, 버튼색 색지정 영역*/
/*소리*/
.art_program .progbox01 .prog_titbox .tit {background: #ffb83d}
.art_program .progbox01 .prog_lst .item_top{background: #ffb83d}
.art_program .progbox01 .item_body .prog_btn a{background-color:#ffb83d}
.art_program .progbox01 .prog_lst ul li .prog_item:hover .prog_btn a{background-color: #ff982a}
.art_program .progbox01 .prog_lst ul li .prog_item:hover .item_top{background: #ff982a}
/*시각*/
.art_program .progbox02 .prog_titbox .tit {background: #ff7686}
.art_program .progbox02 .prog_lst .item_top{background: #ff7686}
.art_program .progbox02 .item_body .prog_btn a{background-color:#ff7686}
.art_program .progbox02 .prog_lst ul li .prog_item:hover .prog_btn a{background-color: #f64a5e}
.art_program .progbox02 .prog_lst ul li .prog_item:hover .item_top{background: #f64a5e}
/*공연*/
.art_program .progbox03 .prog_titbox .tit {background: #c384e3}
.art_program .progbox03 .prog_lst .item_top{background: #c384e3}
.art_program .progbox03 .item_body .prog_btn a{background-color:#c384e3}
.art_program .progbox03 .prog_lst ul li .prog_item:hover .prog_btn a{background-color: #ad57d9}
.art_program .progbox03 .prog_lst ul li .prog_item:hover .item_top{background: #ad57d9}
/*영상*/
.art_program .progbox04 .prog_titbox .tit {background: #1bc294}
.art_program .progbox04 .prog_lst .item_top{background: #1bc294}
.art_program .progbox04 .item_body .prog_btn a{background-color:#1bc294}
.art_program .progbox04 .prog_lst ul li .prog_item:hover .prog_btn a{background-color: #13a37b}
.art_program .progbox04 .prog_lst ul li .prog_item:hover .item_top{background: #13a37b}

/*프로그램 세부 소개*/
.art_progintro .intro_titbox{position: relative; margin: 10px 0 30px}
.art_progintro .intro_titbox .tit{position: relative}
.art_progintro .intro_titbox .tit::after{content: ""; display: block; clear: both; position: absolute; top:16px; width:100%; height: 1px; border-radius: 50px; background:#ccc; z-index: 1}
.art_progintro .intro_titbox .tit span{position: relative; display: inline-block; padding:7px 45px; border-radius: 50px; background: #ccc; text-align: center; font-size: 1.071em; color:#fff; z-index: 10}
.art_progintro .intro_titbox.introtit01 .tit span{background:#ffb83d}
.art_progintro .intro_titbox.introtit02 .tit span{background:#ff7686}
.art_progintro .intro_titbox.introtit03 .tit span{background:#c384e3}
.art_progintro .intro_titbox.introtit04 .tit span{background:#1bc294}
.art_progintro .intro_titbox::before, .art_progintro .intro_titbox::after{content: ""; display: block; clear: both; position: absolute; top:12px; width: 10px; height: 10px; border-radius: 50px; background:#ccc; z-index: 10}
.art_progintro .intro_titbox::before{left: 0}
.art_progintro .intro_titbox::after{right: 0}
.art_progintro .intro_titbox .tit{position: relative}
.art_progintro .intro_tb{position: relative}
.art_progintro .intro_tb .intro_btn{position: absolute; top:0; width:415px; z-index: 10}
.intro_tb .intro_btn>a{position: relative; display: block; width:100%; height:51px; border-radius: 50px; text-align: center; font-size: 1.143em;color:#fff; font-weight: 500; transition: all .3s}
.intro_tb .intro_btn>a::after{content: ""; display: block; clear: both; position: absolute; bottom:-20px; left:50%; width:34px; height: 34px; border-radius: 50px; background:url(../images/contents/intarw.png) no-repeat left center; transition: all .6s; z-index: 10}
.intro_tb .intro02 .intro_btn>a::after{margin-left:-15px}
.intro_tb .intro_btn>a span{display:inline-block}
.intro_tb .intro01 .intro_btn>a span{margin:13px 0 0 30px}
.intro_tb .intro02 .intro_btn>a span{margin:13px 20px 0 0}
.intro_tb .intro01 .intro_btn>a{background-image:url(../images/contents/intbtn01.png); background-repeat:no-repeat; background-position: left center; background-color:#c0c0c0}
.intro_tb .intro01 .intro_btn>a:hover, .intro_tb .intro01.on .intro_btn>a{background-image:url(../images/contents/intbtn01_a.png); background-repeat:no-repeat; background-position: left center; background-color: #259bff}
.intro_tb .intro01 .intro_btn>a:hover::after, .intro_tb .intro01.on .intro_btn>a::after{background-image:url(../images/contents/intarw01_a.png)}
.intro_tb .intro02 .intro_btn>a{background-image:url(../images/contents/intbtn02.png); background-repeat:no-repeat; background-position: right center; background-color:#c0c0c0}
.intro_tb .intro02 .intro_btn>a:hover, .intro_tb .intro02.on .intro_btn>a{background-image:url(../images/contents/intbtn02_a.png); background-repeat:no-repeat; background-position: right center; background-color: #71b747}
.intro_tb .intro02 .intro_btn>a:hover::after, .intro_tb .intro02.on .intro_btn>a::after{background-image:url(../images/contents/intarw02_a.png)}
.intro01 .intro_btn{left:20px}
.intro02 .intro_btn{right:20px}
.art_progintro .intro01 .int_tb{padding-top: 260px}
.art_progintro .intro02 .int_tb{padding-top: 100px}
.art_progintro .prog_goal{position: relative; padding: 70px 70px 30px; margin-bottom:20px; border-radius: 5px; background:#f1f1f1; text-align: center; font-weight: 500}
.art_progintro .prog_goal .progimg{position: absolute; top:-160px; left:50%; margin-left: -170px; width:325px; height: 197px; border-radius: 15px; box-shadow:5px 5px 10px rgba(0, 0, 0, 0.5)}
.art_progintro .prog_goal .progimg img{overflow: hidden; width:325px; height: 197px; margin: 0 auto; border-radius: 15px; border: 3px solid #d5d5d5}

/* 이용약관 */
.art_user{font-size:1.077em; line-height:140%}
.art_user .tit01{padding:10px; margin:30px 0 10px; background:#44617c; border-radius:5px; text-align:center; font-size:1.143em; color:#fff; font-weight:500}
.art_user .tit01.first_tit{margin-top:0}
.art_user .tit01 span{position: relative; display:inline-block}
.art_user .tit01 span::before, .art_user .tit01 span::after{content: ""; display: block; clear: both; position: absolute; top:5px; width:21px; height: 10px; z-index: 10}
.art_user .tit01 span::before{left:-40px; background:url(../images/contents/ico_user01.png) no-repeat 0 0}
.art_user .tit01 span::after{right:-40px; background:url(../images/contents/ico_user02.png) no-repeat 0 0}
.art_user .tit02{padding:10px 10px 10px 15px; margin:5px; background:url(../images/contents/user_blt.png) no-repeat 5px 13px; border-bottom:1px solid #ccc; font-size:1.077em; font-weight:500}
.art_user > p, ul.user_tb, ul.tb_lst01, .art_user ul.tb_lst02{margin:10px}
.art_user ul li{padding:0 0 3px 15px; text-indent:-18px}
.art_user ul.tb_lst01, .art_user ul.tb_lst02{padding:10px 15px; border-radius:5px; background:#f1f1f1}
.art_user ul.tb_lst02{margin:10px 0}

/*조직구성*/

.art_organize .tel_btn{display:none}
.organize_wrap {margin-bottom:40px}
.art_organize .organize_wrap .org_top{position: relative; width: 258px; min-height: 60px; padding:20px; margin:30px auto 0; background:#292f45; text-align: center; color:#b1b1b1; box-sizing: border-box; font-size:1.071em}
.organize_wrap .org_top span{display: block; margin-bottom:12px; font-weight:500; font-size: 1.286em; color:#fff}
.organize_wrap .org_lstbox{position: relative; padding-top:35px; background:url(../images/contents/bg_organ_logo.gif) no-repeat left 50% bottom 20px}
.organize_wrap .org_lstbox::before{content: ""; display: block; clear: both; position: absolute; left:230px; top:60px; width:50%; height:1px; background: #d4d4d4}
.organize_wrap .org_lstbox::after{content: ""; display: block; clear: both; position: absolute; left:50%; top:0; width:1px; height:60px; background:#d4d4d4}
.organize_wrap .org_lstbox > ul > li{float: left; width: 50%}
.organize_wrap .org_lstbox .org_lst{position: relative; width: 272px; margin: 0 auto; text-align: center}
.organize_wrap .org_lstbox .team_tit{width: 272px; padding:15px; margin-bottom: 5px; background:#35a0eb; font-size:1.200em; color:#fff; font-weight:400; box-sizing: border-box}
.organize_wrap .org_lstbox .org_team02 .team_tit{background:#1179c2}
.organize_wrap .org_lstbox .org_team01 {margin-left:30px}
.organize_wrap .org_lstbox .org_team02 {margin-right:30px}
.team_lstbox {border:2px solid #d8d8d8}
.organize_wrap .team_direc{position: relative; margin:20px 12px 0; padding-bottom:12px; background: #fff; font-weight: 500; font-size:1.071em; border-bottom:1px dashed #d4d4d4}
.organize_wrap .team_direc span{display: block; height:32px; line-height:32px; margin:8px auto 0; background: #efefef; font-weight: 500}
.organize_wrap .team_lst{padding:12px 12px 4px}
.organize_wrap .team_lst ul li{float:left; width:50%; margin-bottom:8px; font-size:1em; box-sizing: border-box}
.organize_wrap .team_lst ul li span {display:block; padding:12px 5px; background: #ededed}
.organize_wrap .team_lst ul li:nth-of-type(odd) span {margin-right:4px}
.organize_wrap .team_lst ul li:nth-of-type(even) span {margin-left:4px}

/*조직구성 new추가 230425 */
.art_organize .organize_wrap .org_mid{position: relative; width: 258px; min-height: 60px; padding:20px; margin:30px auto 0; background:#475897; text-align: center; color:#b3bbd9; box-sizing: border-box; font-size:1.071em}
.organize_wrap .org_mid span{display: block; margin-bottom:12px; font-weight:500; font-size: 1.286em; color:#fff}
.organize_wrap .org_mid::after{content: ""; display: block; clear: both; position: absolute; left:50%; top:-30px; width:1px; height:30px; background:#d4d4d4}

/*시설안내*/
.art_floor{position: relative}
.art_floor .art_toptit{font-size: 13px}
.art_floor .floor_qucik{margin: 15px 0}
.art_floor .floor_qucik ul{margin: 10px 100px}
.art_floor .floor_qucik ul li{float: left; width: 50%}
.art_floor .floor_qucik ul li a{display: block; width: 90%; height:51px; line-height: 51px; margin: 0 auto; border-radius: 50px; background:url(../images/contents/floor_more.png) no-repeat right center #5bb64f; color:#fff; text-align: center; font-size: 1.143em; font-weight: 500}
.art_floor .floor_qucik ul li:last-child a{background:url(../images/contents/floor_more.png) no-repeat right center #4296d7}
.art_floor .floor_wrap .floor_mapbox{margin:20px 0 0; text-align: center}
.floor_wrap .floor_mapbox{border-radius: 15px; border:2px solid #5bb64f; box-sizing: border-box}
.floor_wrap .floor_mapbox.floor02{border:2px solid #4296d7}
.floor_mapbox .floor_infotit{max-width: 309px; height: 50px; line-height: 50px; margin: 0 auto; background: #5bb64f; border-radius: 0 0 15px 15px; color:#fff; text-align: center; font-size:1.467em; font-weight:400}
.floor_mapbox.floor02 .floor_infotit{background: #4296d7}
.floor_mapbox .floor_item{position:relative; padding: 25px 10px}
.floor_mapbox .floor_item:after {content:""; display:block; position:absolute; bottom:0; right:0; width:90px; height:90px; background:#5bb64f url(../images/contents/img_facview_hand.png) no-repeat 50% 50%; border-radius:20px 0 10px 0; animation: handshake 1.3s step-end infinite;}
.floor_mapbox.floor02 .floor_item:after {background-color:#4296d7}
/*자세히보기 레이어*/
.floor_more {position: fixed; width: 100%; height: 100%; top: 0; left: 0; background:rgba(0,0,0,0.7); z-index:1000; min-width:320px}
.floor_more .floor_all{display:block; position:absolute; top:120px; left:50%; margin-left: -440px}
.floor_more .floor_all .floor_rbox{position: relative; overflow: hidden; width: 1000px; height: 590px; border-radius: 15px; background:#fff; box-shadow:5px 5px 10px rgba(0, 0, 0, 0.2)}
.floor_all .floor_rtop .floor_tit{position: absolute; top:0; left:0; width: 75px; height: 75px; line-height: 75px; border-radius: 0 0 15px 0; background: #5bb64f; color:#fff; font-size: 23px; text-align: center; font-weight: 600}
.floor_all.floor2 .floor_rtop .floor_tit{background: #4296d7}
.floor_all .floor_rtop .floor_txt{padding:20px 65px 20px 20px; margin-left: 75px; border-bottom: 1px solid #cfcfcf; font-size:22px; font-weight:600; color:#6bc15f}
.floor_all.floor2 .floor_rtop .floor_txt {color:#4296d7}
.floor_all .floor_rimg {display:flex; flex-wrap:wrap}
.floor_all .floor_rimg .view_tit{margin:17px 0; font-size: 20px; font-weight: 600}
.floor_all .floor_rimg .view_tit span{display: inline-block; padding: 7px 15px; margin-right: 10px; border-radius:50px; border:2px solid #5bb641; box-sizing: border-box; color: #5bb641; font-weight: 600}
.floor_all.floor2 .floor_rimg .view_tit span{border:2px solid #4296d7; color: #4296d7}
.floor_all .floor_rimg .view_img {display:flex; overflow: hidden; width:650px; height:480px; margin:30px 15px; background:#efefef url(../images/contents/img_floor_noimg.gif) no-repeat 50% 50%; border-radius: 15px}
.floor_all .floor_rimg .view_img img {overflow: hidden; width:650px; height:480px}
.floor_lstbox {width:320px; padding:12px; background:#ececec; box-sizing:border-box}
.floor_lstbox p {display:block; padding:15px; background:#234e66; border-radius:12px; text-align:center; color:#fff; font-weight:600; font-size:1.231em}
.floor_lstbox ul {overflow-y:auto; margin:15px 0; height:430px}
.floor_lstbox ul li {position:relative; min-height:54px; padding:8px; border-bottom:1px solid #ccc; }
.floor_lstbox ul li .ftxt {padding:0 80px 0 0; font-weight:400; font-size:1.077em}
.floor_lstbox ul li .fqty {position:absolute; top:8px; right:0; background:#fff; width:70px; height:54px; padding:6px 10px; text-align:center; box-sizing:border-box; border-radius:15px; font-weight:500}
.floor_all .btn_box{position: absolute; top:8px; right:10px}

/*대관 및 방문안내*/
.art_rent{position: relative}
.art_rent .rent_stepbox{margin: 30px 0}
.art_rent .rent_stepbox ul li{position: relative; float: left; width:20%}
.art_rent .rent_stepbox ul li::before{content: ""; display: block; clear: both; position: absolute; bottom:165px; right:-6px; width:9px; height: 17px;; background:url(../images/contents/rent_arw.gif) no-repeat 0 0; z-index: 1}
.art_rent .rent_stepbox ul li:last-child::before{display: none}
.art_rent .rent_stepbox .rentstep{width: 90%; margin: 0 auto; background: #fff}
.art_rent .rent_titbox{position: relative; border-radius: 20px; border:3px solid #a0d071; box-sizing: border-box; text-align: center}
.art_rent .rent_titbox .numtit{position: relative; border-radius: 15px 15px 0 0; background: #a0d071}
.art_rent .rent_titbox .numtit span.num{display: block; position: absolute; top:-30px; left:50%; width: 42px; height: 42px; line-height: 42px; margin-left: -20px; background: #a0d071; border-radius: 50px; border:2px solid #fff; box-sizing: border-box; font-weight: 600; font-size: 18px; color:#fff}
.art_rent .rent_titbox .numtit span.tit{display: block; padding: 22px 5px 10px; color:#fff; font-weight: 600}
.art_rent .rent_titbox .tittxt{padding: 10px; font-weight: 500}
.art_rent .rent_tb{position: relative; min-height: 110px; border-radius: 20px; border:1px solid #ccc; padding: 15px 10px; margin-top: 5px; background: #fff; text-align: center; font-size: 13px; font-weight: 400; box-sizing: border-box}
.art_rent .rent_tb .pdtxt{padding: 10px}
.art_rent .rent_tb::before{content: ""; display: block; clear: both; position: absolute; left:50%; top:-13px; width:18px; height:18px; margin-left: -8px; border-radius: 50px; background: #a0d071}
.art_rent .rstep02 .rent_titbox{border-color:#4bc375}
.art_rent .rstep03 .rent_titbox{border-color:#4bb3c3}
.art_rent .rstep04 .rent_titbox{border-color:#328fe5}
.art_rent .rstep05 .rent_titbox{border-color:#1165c2}
.art_rent .rstep02 .rent_titbox .numtit{background: #4bc375}
.art_rent .rstep03 .rent_titbox .numtit{background: #4bb3c3}
.art_rent .rstep04 .rent_titbox .numtit{background: #328fe5}
.art_rent .rstep05 .rent_titbox .numtit{background: #1165c2}
.art_rent .rstep02 .rent_titbox .numtit span.num{background: #4bc375}
.art_rent .rstep03 .rent_titbox .numtit span.num{background: #4bb3c3}
.art_rent .rstep04 .rent_titbox .numtit span.num{background: #328fe5}
.art_rent .rstep05 .rent_titbox .numtit span.num{background: #1165c2}
.art_rent .rstep02 .rent_tb::before {background: #4bc375}
.art_rent .rstep03 .rent_tb::before{background: #4bb3c3}
.art_rent .rstep04 .rent_tb::before{background: #328fe5}
.art_rent .rstep05 .rent_tb::before{background: #1165c2}
.art_rent .rent_btnbox{text-align: center}
.art_rent .rent_btnbox > p{display: inline-block; margin: 0 5px}
.art_rent .rent_btnbox > p a{display: block; width: 222px; height: 40px; line-height: 40px; border-radius: 50px; background-image:url(../images/contents/rent_btn.png) ; background-repeat: no-repeat; background-position: right center; color:#fff; text-align: left; transition:.3s}
.art_rent .rent_btnbox > p.rent_bt1 a{background-color:#ff5b45}
.art_rent .rent_btnbox > p.rent_bt2 a{background-color:#ff981e}
.art_rent .rent_btnbox > p a:hover{background-color: #90c749}
.art_rent .rent_btnbox > p a span{padding-left: 20px}

/*프로그램 세부 소개2*/
.art_progintro2{position: relative}
.art_progintro2 .intro_btn{position: absolute; top:0; width:415px; z-index: 10}
.art_progintro2 .intro_btn>a{position: relative; display: block; width:100%; height:51px; border-radius: 50px; text-align: center; font-size: 1.143em;color:#fff; font-weight: 500; transition: all .3s}
.art_progintro2 .intro_btn>a::after{content: ""; display: block; clear: both; position: absolute; bottom:9px; right:10px; width:34px; height: 34px; border-radius: 50px; background:url(../images/contents/int_arw.png) no-repeat left center; transition: all .6s; z-index: 10}
.art_progintro2 .intro02 .intro_btn>a::after{margin-left:-15px}
.art_progintro2 .intro_btn>a span{display:inline-block}
.art_progintro2 .intro01 .intro_btn>a span, .art_progintro2 .intro02 .intro_btn>a span{margin:15px 0 0 35px}
.art_progintro2 .intro01 .intro_btn>a{background-image:url(../images/contents/int_btn01.png); background-repeat:no-repeat; background-position: left center; background-color:#d3d3d3}
.art_progintro2 .intro01 .intro_btn>a:hover, .art_progintro2 .intro01.on .intro_btn>a{background-image:url(../images/contents/int_btn01_a.png); background-repeat:no-repeat; background-position: left center; background-color: #ffa0cd}
.art_progintro2 .intro01 .intro_btn>a:hover::after, .art_progintro2 .intro01.on .intro_btn>a::after{background-image:url(../images/contents/int_arw1.png)}
.art_progintro2 .intro02 .intro_btn>a{background-image:url(../images/contents/int_btn02.png); background-repeat:no-repeat; background-position: left center; background-color:#d3d3d3}
.art_progintro2 .intro02 .intro_btn>a:hover, .art_progintro2 .intro02.on .intro_btn>a{background-image:url(../images/contents/int_btn02_a.png); background-repeat:no-repeat; background-position: left center; background-color: #8cc5ff}
.art_progintro2 .intro02 .intro_btn>a:hover::after, .art_progintro2  .intro02.on .intro_btn>a::after{background-image:url(../images/contents/int_arw2.png)}
.art_progintro2 .intro01 .int_tb{left:20px; padding-top: 75px}
.art_progintro2 .intro02 .int_tb{right:20px; padding-top: 75px}
.art_progintro2 .art_toptit .toptit{font-size: 20px; font-weight: 600}
.art_progintro2 .intro_titbox{position: relative; margin: 10px 0 30px}
.art_progintro2 .intro_titbox .tit{position: relative}
.art_progintro2 .intro_titbox .tit::after{content: ""; display: block; clear: both; position: absolute; top:16px; width:100%; height: 1px; border-radius: 50px; background:#ccc; z-index: 1}
.art_progintro2 .intro_titbox .tit span{position: relative; display: inline-block; padding:7px 45px; border-radius: 50px; background: #ccc; text-align: center; font-size: 1.071em; color:#fff; z-index: 10}
.art_progintro2 .intro_titbox.introtit01 .tit span{background:#ff80bc}
.art_progintro2 .intro_titbox.introtit02 .tit span{background:#5ca8f6}
.art_progintro2 .intro_titbox::before, .art_progintro2 .intro_titbox::after{content: ""; display: block; clear: both; position: absolute; top:12px; width: 10px; height: 10px; border-radius: 50px; background:#ccc; z-index: 10}
.art_progintro2 .intro_titbox::before{left: 0}
.art_progintro2 .intro_titbox::after{right: 0}
.art_progintro2 .stit{margin-bottom: 30px; text-align: center}
.art_progintro2 .stit span{display: inline-block; padding: 0 40px 15px; background:url(../images/contents/tit_line.gif) repeat-x left bottom}
.art_progintro2 .intro_info ul li span{display: inline-block; padding:4px 25px; margin-right: 10px; border-radius: 50px; background: #fff; color:#000; font-weight: 500}
.art_progintro2 .intro_info > ul{margin-left: 10px;}
.art_progintro2 .intro_info > ul > li{float: left; margin-right: 50px; font-weight: 500}
.art_progintro2 .intro_info > ul > li span{ background: #44617c; color:#fff}
.art_progintro2 div.info_box{position: relative; padding: 15px 10px; margin: 15px 0; border-radius: 10px; background: #f0f0f0}
.art_progintro2 .intro01 div.info_box::after, .art_progintro2 .intro02 div.info_box::after{content: ""; display: block; clear: both; position: absolute; bottom:0; right:0; width:291px; z-index: 10}
.art_progintro2 .intro01 div.info_box::after{height:197px; background:url(../images/contents/intro_img01.png) no-repeat left center}
.art_progintro2 .intro02 div.info_box::after{height:156px; background:url(../images/contents/intro_img02.png) no-repeat left center}
.art_progintro2 div.info_box li{margin-bottom:15px}
.art_progintro2 div.info_box li:last-child{margin-bottom: 0}
.intro01 .info_tit{text-align: center}
.intro01 .info_tit > p{position: relative; display: inline-block;  line-height: 150%; margin: 20px 0;  font-size: 1.214em; font-weight: 500}
.intro01 .info_tit > p::before, .intro01 .info_tit > p::after {content: ""; display: block; clear: both; position: absolute; top:-10px; width: 23px; height: 15px}
.intro01 .info_tit > p::before{left:-35px; background:url(../images/contents/tit_mark01.gif) left top no-repeat}
.intro01 .info_tit > p::after{right:-35px; background:url(../images/contents/tit_mark02.gif) left top no-repeat}
.intro01 .info_lst ul li{float: left}
.intro01 .info_lst .info_tb{width: 214px; margin-right: 10px; border-radius: 10px; border:1px solid #ddd; box-sizing: border-box}
.intro01 .info_lst ul li:last-child .info_tb{margin-right: 0}
.intro01 .info_lst ul{padding-top: 100px; background: url(../images/contents/info_arw.gif) no-repeat top center}
.intro01 .info_lst .info_tb .tb_tit{position: relative; padding: 10px; background: #ffbb4f; border-radius: 10px 10px 0 0; text-align: center; font-weight: 500; color:#fff}
.intro01 .info_lst .info_tb .tb_tit::after{content: ""; display: block; clear: both; position: absolute; top:-41px; right:50%; width:60px; height:41px; margin-right: -31px; border-radius:50px 50px 0 0; background: url(../images/contents/ico_info01.gif) no-repeat 18px 10px #ffbb4f; z-index: 10}
.intro01 .info_lst .infotb02 .tb_tit{background: #98c148}
.intro01 .info_lst .infotb02 .tb_tit::after{background: url(../images/contents/ico_info02.gif) no-repeat 14px 10px #98c148}
.intro01 .info_lst .infotb03 .tb_tit{background: #c972f2}
.intro01 .info_lst .infotb03 .tb_tit::after{background: url(../images/contents/ico_info03.gif) no-repeat 15px 10px #c972f2}
.intro01 .info_lst .infotb04 .tb_tit{background: #5ba0f6}
.intro01 .info_lst .infotb04 .tb_tit::after{background: url(../images/contents/ico_info04.gif) no-repeat 15px 10px #5ba0f6}
.intro01 .info_lst .info_tb dl{min-height: 158px; padding: 10px; box-sizing: border-box}
.intro01 .info_lst .info_tb dl dt{padding-left: 11px; margin-bottom:3px; background:url(../images/contents/blt_txtlst.gif) left 4px no-repeat; line-height: 130%; font-weight: 600}
.intro01 .info_lst .info_tb dl dd{margin-bottom: 8px}
.intro01 .info_lst .info_tb dl dd:last-child{margin-bottom: 0}
.intro02 .info_prolst .prolst{overflow: hidden; margin-bottom: 15px; border-radius: 10px; border:1px solid #ddd; box-sizing: border-box;}
.intro02 .info_prolst .prolst01{background: #ffba40}
.intro02 .info_prolst .prolst02{background: #83c668}
.intro02 .info_prolst .prolst03{background: #c972f2}
.intro02 .info_prolst .prolst04{background: #5ba0f6}
.intro02 .prolst .prolst_tit{width: 160px; line-height: 160%; padding-top:17px; text-align: center; font-weight: 500; font-size: 1.077em;color:#fff}
.intro02 .prolst .prolst_tit span{display: block; padding-top:45px; background:url(../images/contents/ico_info0201.gif) center top no-repeat }
.intro02 .prolst02 .prolst_tit span{background:url(../images/contents/ico_info0202.gif) center top no-repeat }
.intro02 .prolst03 .prolst_tit span{background:url(../images/contents/ico_info0203.gif) center top no-repeat }
.intro02 .prolst04 .prolst_tit span{background:url(../images/contents/ico_info0204.gif) center top no-repeat }
.intro02 .prolst_txt{padding: 10px; margin:-113px 0 0 160px; background: #fff}
.intro02 .prolst_txt > ul > li{padding-left: 11px; margin-bottom:3px; background:url(../images/contents/blt_txtlst.gif) left 4px no-repeat; line-height: 130%}
.intro02 .prolst_txt > ul > li:last-child{margin-bottom: 0}
.intro02 .prolst_txt > ul > li span{font-weight: 600}
.intro02 .prolst_txt > ul > li > ul{padding: 10px; margin:5px 0 0 -10px; border-radius: 10px; background: #f0f0f0}

/* 지역연계 체험 신청  kjh 230112 */
.local_pboxwrap {display: flex; justify-content: space-between}
.local_pbox {display: flex; flex-wrap: wrap; flex-direction: column; width:100%; margin-bottom:20px; box-sizing: border-box}
.local_pbox .lp_boxarea {flex: 1 1 0%; border-radius:20px 20px 0 0}
.local_pbox:first-child, .local_pbox:nth-child(3) {padding-right:10px}
.local_pbox:nth-child(2), .local_pbox:nth-child(4){padding-left:10px}

.local_pbox01 .lp_boxarea {background:#bd9e93}
.local_pbox02 .lp_boxarea {background:#d9bbc0}
.local_pbox03 .lp_boxarea {background:#d2c0b6}
.local_pbox04 .lp_boxarea {background:#adbaca}
.local_pbox05 .lp_boxarea {background:#a0a3c3}

.lp_boxtop .lp_boxtit {display:block; padding:35px 60px 35px 30px; color:#292f45; font-weight:600; font-size:1.733em; transition:.4s all}

.local_pbox01 .lp_boxtop .lp_boxtit {background:url(../images/contents/ico_prog_local01.png) no-repeat right 20px top 22px}
.local_pbox02 .lp_boxtop .lp_boxtit {background:url(../images/contents/ico_prog_local02.png) no-repeat right 20px top 22px}
.local_pbox03 .lp_boxtop .lp_boxtit {background:url(../images/contents/ico_prog_local03.png) no-repeat right 20px top 22px}
.local_pbox04 .lp_boxtop .lp_boxtit {background:url(../images/contents/ico_prog_local04.png) no-repeat right 20px top 22px}

.local_pbox .lp_boxarea ul {display:flex; justify-content: space-between; margin:0 25px 25px}
.local_pbox .lp_boxarea ul li {display:flex; flex-direction: column; width: 100%}
.local_pbox .lp_boxarea ul li a {overflow:hidden; position:relative; display: block; color:#000; font-weight:400; font-size:1.067em; background:#fff}
.local_pbox .lp_boxarea ul li a:before {content:""; display: block; position: absolute; top:0; left:0; width:100%; height:100%; margin-left:-100%; z-index:1; transition:all .4s}
.local_pbox .lp_boxarea ul li:first-child a {margin-right:5px}
.local_pbox .lp_boxarea ul li:last-child a {margin-left:5px}
.local_pbox .lp_boxarea ul.linkonly li a {margin:0}
.local_pbox .lp_boxarea ul li a span {display:block; position:relative; padding:14px; background: url(../images/contents/img_local_arr.png) no-repeat right 10px top 50%;  z-index:2}
.local_pbox .lp_boxarea ul li a:hover:before {margin-left:0; transition:all .6s; color:#fff}
.local_pbox04 .lp_boxarea ul li a:hover:before {background:#fe693c}
.lp_boxarea:hover {border-color:#292f45; box-shadow:2px 2px 9px #cfcfcf; transition:all .4s}
.local_pbox .lp_boxarea ul li:hover a span {background: url(../images/contents/img_local_onarr.png) no-repeat right 10px top 50%}

.local_pbox .lp_boxarea ul li:hover a {color:#fff}
.local_pbox01 .lp_boxarea ul li a:hover:before {background:#7a6158}
.local_pbox02 .lp_boxarea ul li a:hover:before {background:#b36471}
.local_pbox03 .lp_boxarea ul li a:hover:before {background:#976e58}
.local_pbox04 .lp_boxarea ul li a:hover:before {background:#45658d}
.local_pbox05 .lp_boxarea ul li a:hover:before {background:#666ba3}

/* 한줄인 경우 */
.local_boxonly {position:relative; padding:0 !important}
.local_boxonly .lp_boxtop .lp_boxtit {display:inline-block; padding:48px 60px 48px 30px;}
.local_boxonly .lp_boxarea ul {position: absolute; top:50%; right:0; width:200px; margin-top:-23px}
.local_boxonly .lp_boxarea ul li a {margin:0 !important}

/* 전체프로그램 스타일 추가수정 kjh 230113 */
.pro_introwrap {margin-bottom:40px}
.pro_introtab {min-height:170px; padding-top:20px}
.pro_introtab li {float:left; width:50%; box-sizing: border-box; border:1px solid #cacaca; border-left:0; border-radius:0 10px 10px 0} 
.pro_introtab li:first-child {border-left:1px solid #d4d4d4; border-radius:10px 0 0 10px}
.pro_introtab li .pit_barogo {display: block; padding:5px}
.pro_introtab li a {height:140px}
.pro_itab {text-align: center}
.pro_itab a {display:block; padding:10px 0; box-sizing: border-box}
.pit_tit {padding:60px 0 0; font-size:1.143em; font-weight:500}
.pit_barogo {display:block; width:90%; margin:10px auto 0; border-radius:50px; text-align: center; box-sizing: border-box}
.pit_barogo span {padding:0 20px 0 0; background:url(../images/contents/btn_prointro_veiw.png) no-repeat 100% 50%; color:#fff}

.pro_itabbox1 .pit_tit {background:url(../images/contents/blt_proitab01_off.png) no-repeat 50% 0}
.pro_itabbox2 .pit_tit {background:url(../images/contents/blt_proitab02_off.png) no-repeat 50% 0}
.pro_itabbox1:hover .pit_tit, .pro_itabbox1.on .pit_tit {background:url(../images/contents/blt_proitab01_on.png) no-repeat 50% 0}
.pro_itabbox2:hover .pit_tit, .pro_itabbox2.on .pit_tit  {background:url(../images/contents/blt_proitab02_on.png) no-repeat 50% 0}
.pro_itabbox1 .pit_barogo {background:#2b91d9}
.pro_itabbox2 .pit_barogo {background:#13988e}
.pro_introtab li:hover, .pro_introtab li.on {transition:.3s; position:relative; border:0; z-index: 1}
.pro_introtab li.pro_itabbox1:hover .pro_itab, .pro_introtab li.pro_itabbox1.on .pro_itab {padding-bottom:17px; background:url(../images/contents/bg_prointro_arr1.png) no-repeat left 50% bottom 0}
.pro_introtab li.pro_itabbox2:hover .pro_itab, .pro_introtab li.pro_itabbox2.on .pro_itab {padding-bottom:17px; background:url(../images/contents/bg_prointro_arr2.png) no-repeat left 50% bottom 0}
.pro_introtab li:hover .pro_itab, .pro_introtab li.on .pro_itab {}
.pro_introtab li:hover a, .pro_introtab li.on a  {transition:.3s; height:160px; margin-top:-10px; background:#509bea; /*box-shadow:5px 10px 10px 0px rgba(0,0,0,0.2);*/ border-radius:10px; padding:44px 0; color:#fff}
.pro_introtab li:hover .pit_barogo, .pro_introtab li.on .pit_barogo {display:none}
.pro_introtab .pro_itabbox1:hover a , .pro_introtab .pro_itabbox1.on a {background:linear-gradient(135deg, #2a8fd9, #156fbc)}
.pro_introtab .pro_itabbox2:hover a , .pro_introtab .pro_itabbox2.on a {background:linear-gradient(135deg, #44bdbe, #049286)}
.pro_introimg {margin:0 auto; padding:20px 0 0; text-align: center}
.pro_introimg img {overflow: hidden; width:280px; height:135px; border-radius:20px; vertical-align: middle}
.pro_introbox {position:relative; margin-top:20px}
.pro_introbox:before {content:""; display: block; position:absolute; top:0; left:0; width:100%; height:3px; background:#2b91d9}
.pro_introbox ul {padding:10px 0}
.pro_introbox ul li {position:relative; text-align: center; padding-bottom:10px; line-height:150%; word-break:keep-all}
.pro_introbox ul li span {display:block; width:100%; padding:3px 5px;  margin-bottom:10px; background:#e6e6e6; box-sizing: border-box; font-weight:500; border-radius:5px; color:#404040}
.pro_introbox ul li.on span {background:#828797; color:#fff}
.pro_introbox ul li strong {font-weight:500; color:#000}
.pro_introbox ul li .col_red {color:#f00}
.pro_introtop {padding:20px 0 10px; border-bottom:1px dashed #d4d4d4; text-align: center}
.pro_introtop .ptit {display:inline-block; font-size:1.533em; font-weight:500; color:#1b1b1b}
.pro_introtop .ptit span {color:#2b91d9}
.pro_introtop .ptxt {display:block; margin-top:10px; padding:7px 10px; background:#eee; border-radius:50px}

.art_procontit {padding-bottom:15px; background: url(../images/contents/bg_artpro_arr.gif) no-repeat 50% 100%}
.art_procontit p {display: block; line-height:150%; padding:15px 5px; background:#e6e6e6; border-radius:100px 100px;text-align: center; font-size:1.071em; word-break: keep-all}
.art_proconbox li {position:relative; overflow:hidden; margin:15px 0; border:1px solid #cacaca; border-radius:7px; box-sizing: border-box; background:#fff}
.art_proconbox li .info_tb {width:100%;  text-align:center}
.art_proconbox li .info_tb dl {padding:10px; text-align:left}
.art_proconbox li .info_tb dl dt {padding-left: 11px; margin-bottom:3px; background:url(../images/contents/blt_txtlst.gif) left 5px no-repeat; line-height: 130%; font-weight:400}
.art_proconbox li .info_tb dl dd{margin-bottom: 8px; font-size:0.933em; word-break: keep-all}
.art_proconbox li .info_tb dl dd:last-child{margin-bottom: 0}
.art_proconbox li .tb_tit {padding:10px 0; color:#fff; font-size:1.071em; background:#495867}
.art_proconbox li:nth-of-type(even) .tb_tit {background:#254360}

/* 예술체험소개 2관 추가 kjh 250725 */
.art_prointro2 .pro_itabbox1 .pit_tit {background:url(../images/contents/blt_proitab0201_off.png) no-repeat 50% 0}
.art_prointro2 .pro_itabbox2 .pit_tit {background:url(../images/contents/blt_proitab0202_off.png) no-repeat 50% 0}
.art_prointro2 .pro_itabbox1:hover .pit_tit, .art_prointro2 .pro_itabbox1.on .pit_tit {background:url(../images/contents/blt_proitab01_on.png) no-repeat 50% 0}
.art_prointro2 .pro_itabbox2:hover .pit_tit, .art_prointro2 .pro_itabbox2.on .pit_tit  {background:url(../images/contents/blt_proitab02_on.png) no-repeat 50% 0}
.art_prointro2 .pro_introtab .pro_itabbox1:hover a , .art_prointro2 .pro_introtab .pro_itabbox1.on a {background:linear-gradient(135deg, #ff85a2, #fb5a7f)}
.art_prointro2 .pro_introtab .pro_itabbox2:hover a , .art_prointro2 .pro_introtab .pro_itabbox2.on a {background:linear-gradient(135deg, #ffac41, #ff8c4e)}

.art_prointro2 .pro_introtab li.pro_itabbox1:hover .pro_itab, .art_prointro2 .pro_introtab li.pro_itabbox1.on .pro_itab {padding-bottom:17px; background:url(../images/contents/bg_prointro_arr0201.png) no-repeat left 50% bottom 0}
.art_prointro2 .pro_introtab li.pro_itabbox2:hover .pro_itab, .art_prointro2 .pro_introtab li.pro_itabbox2.on .pro_itab {padding-bottom:17px; background:url(../images/contents/bg_prointro_arr0202.png) no-repeat left 50% bottom 0}
.art_prointro2 .pro_itabbox1 .pit_barogo {background:#fd6d8f}
.art_prointro2 .pro_itabbox2 .pit_barogo {background:#ffa416}
.art_prointro2 .pro_introbox:before {background:#fe7f9d}
.art_prointro2 .pro_introtop .ptit span {color:#fe7f9d}

/* 프로그램 소개 */
.prog_toptit {position:relative}
.prog_toptit .prog_tit {position:absolute; bottom:0; left:0; width:168px; height:84px; line-height:84px;background:#aaa; box-sizing: border-box; color:#fff; font-size:1.333em; font-weight:600; text-align: center; border-radius:10px 10px 0 10px}
.prog_toptit .prog_subj {margin-top:30px; padding:28px 25px 27px 185px; background:#f0f0f0; border-radius:10px; font-size:1.733em; font-weight:600}
.artpro_intro01 .prog_toptit .prog_tit {background:#4c8dd9}
.artpro_intro02 .prog_toptit .prog_tit {background:#36a788}
.artpro_intro03 .prog_toptit .prog_tit {background:#fdbc45}
.artpro_intro04 .prog_toptit .prog_tit {background:#fc846f}
.artpro_intro05 .prog_toptit .prog_tit {background:#ff9846}

.artpro_intro01 .prog_subj {background:#d0e1f5}
.artpro_intro02 .prog_subj {background:#c0e4da}
.artpro_intro03 .prog_subj {background:#fee893}
.artpro_intro04 .prog_subj {background:#fedcc1}

.artpro_local01 .prog_toptit .prog_tit {background:#c18772}
.artpro_local02 .prog_toptit .prog_tit {background:#c76e7d}
.artpro_local03 .prog_toptit .prog_tit {background:#c59276}
.artpro_local04 .prog_toptit .prog_tit {background:#696b80}

.artpro_local01 .prog_toptit .prog_subj  {background:#e3c7bd}
.artpro_local02 .prog_toptit .prog_subj  {background:#e1c0c5}
.artpro_local03 .prog_toptit .prog_subj  {background:#765847}
.artpro_local04 .prog_toptit .prog_subj  {background:#b2b4c9}

/* 활동예 */
.art_actetc {overflow: hidden; border:1px solid #dcdcdc; border-radius:10px 10px 0 0}
.art_actetc .act_tit {padding:15px 10px; background: #50606f; font-size:1.200em; color:#fff;text-align: center}
.act_wrap ul {padding:15px 20px; text-align: center}
.act_wrap ul li {display: inline-block; padding:5px; vertical-align: middle}
.act_wrap ul li img {vertical-align: middle}
.act_wrap ul li .act_lstbox {position: relative}
.act_wrap ul li .act_lstbox span {position: absolute; bottom:0; left:0; width:100%; height:32px; line-height: 32px; background:rgba(0,0,0,0.6); color:#fff; text-align: center}

/* =======지역연계 체험 신청  kjh 241101 ======= */
.local_aboxwrap {display: flex; justify-content: space-between; gap:30px; margin-bottom:30px}
.local_abox {display: flex; width:calc(100% / 2); box-sizing: border-box}
.local_abox.local_only {width:100%}

.local_abox01 .la_boxarea {background:#a9d2f4}
.local_abox02 .la_boxarea {background:#ace5d4}
.local_abox03 .la_boxarea {background:#ffd7e9}
.local_abox04 .la_boxarea {background:#f7eeb5}
.local_abox05 .la_boxarea {background:#eed1ff}
.local_abox06 .la_boxarea {background:#cfee9e}
.la_boxarea .la_boxtit {display:block; padding:110px 30px 35px 30px; color:#292f45; font-weight:600; font-size:2em; transition:.4s all; text-align: center}

.local_abox .la_boxarea {position:relative; width:100%; border-radius:15px; padding:0 10px 10px}
.local_abox .la_boxarea ul {overflow:hidden; display:flex; justify-content: space-between; border-radius:15px }
.local_abox .la_boxarea ul li {display:flex; flex-direction: column; width: 100%}
.local_abox .la_boxarea ul li a {overflow:hidden; position:relative; display: block; color:#000; font-weight:400; font-size:1.133em; background:#fff; padding:20px 50px 20px 20px}
.local_abox .la_boxarea ul.linkonly li a {margin:0}
.local_abox .la_boxarea ul li a:after {content:""; display: block; position: absolute; top:50%; right:15px; width:26px; height:26px; margin-top:-13px; background:#eee url(../images/contents/btn_localapp_arr.png) no-repeat 50% 50%; border-radius:50% 50%}
.local_abox01 .la_boxarea ul li:first-child {border-right:1px solid #b4d7f5}
.local_abox02 .la_boxarea ul li:first-child {border-right:1px solid #ace5d4}
.local_abox .la_boxarea ul li:hover a:after {background:url(../images/contents/btn_localapp_onarr.png) no-repeat 50% 50%; transition:.3s}
.local_abox01 .la_boxarea ul li:hover a:after  {background-color:#6eb2ec}
.local_abox02 .la_boxarea ul li:hover a:after  {background-color:#5bd8ae}
.local_abox03 .la_boxarea ul li:hover a:after  {background-color:#ff98c6}
.local_abox04 .la_boxarea ul li:hover a:after  {background-color:#fbe55b}
.local_abox05 .la_boxarea ul li:hover a:after  {background-color:#eed1ff}
.local_abox06 .la_boxarea ul li:hover a:after  {background-color:#cfee9e}

.local_abox01 .la_boxarea .la_boxtit:after {content:""; display:block; position:absolute; top:0; left:50%; width:168px; height:84px; margin-left:-82px; border-radius:0 0 168px 168px; background:rgba(255,255,255,0.9) url(../images/contents/bg_localapp_ico01.png) no-repeat 50% 50%}
.local_abox02 .la_boxarea .la_boxtit:after {content:""; display:block; position:absolute; top:0; left:50%; width:168px; height:84px; margin-left:-82px; border-radius:0 0 168px 168px; background:rgba(255,255,255,0.9) url(../images/contents/bg_localapp_ico02.png) no-repeat 50% 50%}
.local_abox03 .la_boxarea .la_boxtit:after {content:""; display:block; position:absolute; top:50%; left:15px; width:47px; height:47px; margin-top:-24px; border-radius:50%; background:#fff url(../images/contents/bg_localapp_ico03.png) no-repeat 50% 50%}
.local_abox04 .la_boxarea .la_boxtit:after {content:""; display:block; position:absolute; top:50%; left:15px; width:47px; height:47px; margin-top:-24px; border-radius:50%; background:#fff url(../images/contents/bg_localapp_ico04.png) no-repeat 50% 50%}
.local_abox05 .la_boxarea .la_boxtit:after {content:""; display:block; position:absolute; top:50%; left:15px; width:47px; height:47px; margin-top:-24px; border-radius:50%; background:#fff url(../images/contents/bg_localapp_ico05.png) no-repeat 50% 50%}
.local_abox06 .la_boxarea .la_boxtit:after {content:""; display:block; position:absolute; top:50%; left:15px; width:47px; height:47px; margin-top:-24px; border-radius:50%; background:#fff url(../images/contents/bg_localapp_ico06.png) no-repeat 50% 50%}

.la_boxarea ul li:hover a span {transition: all .3s}
.local_abox01 .la_boxarea ul li:hover a span{color:#6eb2ec}
.local_abox02 .la_boxarea ul li:hover a span{color:#5bd8ae}
.local_abox03 .la_boxarea ul li:hover a span{color:#ff98c6}
.local_abox04 .la_boxarea ul li:hover a span{color:#cdb100}
.local_abox05 .la_boxarea ul li:hover a span{color:#c06df1}
.local_abox06 .la_boxarea ul li:hover a span{color:#7bae29}

/* 한줄인 경우 */
.local_boxonly {position:relative; padding:0 !important}
.local_boxonly .la_boxtop .la_boxtit {display:inline-block; padding:48px 60px 48px 30px;}
.local_boxonly .la_boxarea ul {position: absolute; top:50%; right:0; width:200px; margin-top:-23px}
.local_boxonly .la_boxarea ul li a {margin:0 !important}

.local_aboxwrap2 .la_boxarea {display: flex; justify-content: space-between; align-items: center; padding:0}
.local_aboxwrap2 .local_abox .la_boxarea ul {margin:10px 10px 10px 0 }
.local_aboxwrap2 .la_boxarea .la_boxtit {padding:10px 10px 10px 70px; font-size:1.467em}
.local_aboxwrap2 .local_abox .la_boxarea ul li a {font-size:1em}
.local_aboxwrap2 .local_abox .la_boxarea ul li a {min-width:60px}
.local_aboxwrap3 .la_boxarea {display: flex; justify-content: space-between; align-items: center; padding:0}
.local_aboxwrap3 .local_abox .la_boxarea ul {margin:10px 10px 10px 0 }
.local_aboxwrap3 .la_boxarea .la_boxtit {padding:10px 10px 10px 70px; font-size:1.467em}
.local_aboxwrap3 .local_abox .la_boxarea ul li a {font-size:1em}
.local_aboxwrap3 .local_abox .la_boxarea ul li a {min-width:60px}

/* 층별 시설 1,2관 추가 kjh 250710 */
.art_factit {text-align: center}
.art_factit h4 {display:inline-block; padding:5px 100px; border-bottom:1px solid #ccc}
.art_factit span {display:inline-block; padding:7px 0 7px 35px; background:url(../images/contents/blt_artplace01.gif) no-repeat 0 50%; font-size:1.6em; font-family:'SEBANG_Gothic'}
.art_factit.art_factit2 span {background:url(../images/contents/blt_artplace02.gif) no-repeat 0 50%}

.art_group2 .floor_mapbox .floor_infotit {background:#ffc446}
.art_group2 .floor_mapbox.floor02 .floor_infotit {background:#ff8c4e}
.art_group2 .floor_mapbox.floor03 .floor_infotit {background:#ff6589}
.art_group2 .floor_wrap .floor_mapbox {border-color:#ffc446}
.art_group2 .floor_wrap .floor_mapbox.floor02 {border-color:#ff8c4e}
.art_group2 .floor_wrap .floor_mapbox.floor03 {border-color:#ff6589}
.art_group2 .floor_mapbox .floor_item:after {background-color:#ffc446}
.art_group2 .floor_mapbox.floor02 .floor_item:after {background-color:#ff8c4e}
.art_group2 .floor_mapbox.floor03 .floor_item:after {background-color:#ff6589}
.art_group2 .floor_all .floor_rtop .floor_tit {background:#ffc446; width:110px}
.art_group2 .floor_all .floor_rtop .floor_txt {color:#ffc446; margin-left:110px}
.art_group2 .floor_all.floor2 .floor_rtop .floor_tit {background:#ff8c4e}
.art_group2 .floor_all.floor2 .floor_rtop .floor_txt {color:#ff8c4e}
.art_group2 .floor_all.floor3 .floor_rtop .floor_tit {background:#ff6589}
.art_group2 .floor_all.floor3 .floor_rtop .floor_txt {color:#ff6589}

/* 오시는길 추가  */
.art_map .art_factit {margin-bottom:30px}
.art_map .map_tb > dl {width:100%}
.art_map .add_box {border-bottom:1px solid #ccc}

/* MOBILE LAYOUT */
@media only screen and (max-width:1024px) {
/* ----------------------컨텐츠 공통---------------------- */
/*공통 타이틀 스타일*/
.art_toptit .mark_tit{margin: 20px 0 5px;  font-size: 1em; letter-spacing:-0.6px}
.art_toptit .mark_tit::before, .art_toptit .mark_tit::after {top:-5px}
.art_toptit .mark_tit::before{left:-30px}
.art_toptit .mark_tit::after{right:-30px}

/* -------------------컨텐츠 스타일 시작 -------------------*/
/*인사말*/
.art_greet .greet_tb {line-height:150%; font-size:1em; word-break:keep-all}
.greet_tit:before {width:250px; height:50px; top:inherit; bottom:0; right:50%; margin-right:-125px; background-position:50% 6px; border-radius:25px 25px 0 0; background-size:160px auto}
.greet_tit {padding:30px 10px 60px; text-align: center}
.grtit01 {font-size:1.533em; padding-bottom:5px}
.grtit02 {font-size:1em}

/*조직도*/
.art_organize .tel_btn {display:block}
.art_organize .tel_txt {display:none}
.art_organize .organize_wrap .org_top {width:230px; padding:12px; font-size:1em}
.organize_wrap .org_top span {margin-bottom:5px; font-size:1.154em}

.art_organize .organize_wrap .org_mid {width:230px; padding:12px; font-size:1em; margin:20px auto 0}
.organize_wrap .org_mid span {margin-bottom:5px; font-size:1.154em}
.organize_wrap .org_mid::after {top:-20px; height:20px}

/*찾아오시는 길*/
.art_map .map_area .root_daum_roughmap .wrap_map {height:300px !important}
.art_map .map_tb > dl{float:none; width:auto}
.art_map .map_tb > dl:first-child{border-bottom:1px solid #ccc}

/*프로그램 세부 소개*/
.art_progintro .intro_tb .intro_btn{width:50%}
.intro_tb .intro_btn>a{position: relative; display: block; width:95%; margin:0 auto; font-size:0.938em}
.intro01 .intro_btn{left:0}
.intro02 .intro_btn{right:0}
.art_progintro .intro01 .int_tb{padding-top: 250px}
.art_progintro .intro02 .int_tb{padding-top: 80px}
.art_progintro .prog_goal{padding: 60px 15px 15px; font-size: 0.933em}

/* 이용약관 */
.art_user{font-size:1.000em}
.art_user .tit01{font-size:1.077em}
.art_user .tit01 span::before{left:-30px}
.art_user .tit01 span::after{right:-30px}

/*대관 및 방문안내*/
.art_rent .rent_stepbox{margin: 30px 0}
.art_rent .rent_stepbox ul li{width:100%; margin-bottom: 50px}
.art_rent .rent_stepbox ul li:last-child{margin-bottom: 0}
.art_rent .rent_stepbox ul li::before{bottom:-15px; right:50%; width:13px; height: 7px; margin-right: -8px; background:url(../images/contents/rent_arw_m.gif) no-repeat 0 0}
.art_rent .rent_stepbox .rentstep{width:80%}

/*프로그램 세부 소개2*/
.art_progintro2 .intro_btn{width:50%}
.art_progintro2 .intro_btn>a{position: relative; display: block; width:95%; margin:0 auto; font-size:0.938em}
.art_progintro2 .intro01 .intro_btn{left:0}
.art_progintro2 .intro02 .intro_btn{right:0}
.intro01 .info_tit > p{ margin: 15px 0; font-size: 1.077em;}
.intro01 .info_tit > p::before, .intro01 .info_tit > p::after {top:-5px}
.intro01 .info_tit > p::before{left:-15px}
.intro01 .info_tit > p::after{right:-15px}
.intro01 .info_lst ul li{float: left; width: 50%; margin-bottom: 50px}
.intro01 .info_lst .info_tb{width:95%; margin:0 auto}
.intro01 .info_lst ul li:last-child .info_tb{margin:0 auto}
.intro01 .info_lst ul{padding-top: 58px; background: url(../images/contents/info_arw_m.gif) no-repeat top center}

/* 지역연계 프로그램 안내 */
.local_pboxwrap {display: block}
.local_proinfo .local_pbox {padding:0}
.local_proinfo .lp_boxtop .lp_boxtit {padding:25px 62px 25px 20px; font-size:1.429em; background-position:right 15px top 15px}
.local_pbox .lp_boxarea ul {margin:0 15px 15px}
.local_pbox .lp_boxarea ul li a span {padding:12px}
.local_boxonly .lp_boxtop .lp_boxtit {padding:34px 62px 34px 20px}
.local_boxonly .lp_boxarea ul {width:100px; margin-top:-23px}
.local_pbox .lp_boxarea ul li a {font-size:1em}

/* 전체프로그램 소개 */
#pintro2 .pro_introbox:before {background:#44bdbe}
#pintro2 .pro_introtop .ptit span {color:#00a3a5}
.art_prointro2 #pintro2 .pro_introbox:before {background:#ffa416}
.art_prointro2 #pintro2 .pro_introtop .ptit span {color:#ffa416}

/* 층별안내 */
.floor_more {display:none; position:relative}
.floor_lstbox {width:100%}

/* 연혁 */
.art_history .his_subtit {width:280px; margin-left:-140px}

/* 현황 */
.facview_tit span.pc_none {display:block; font-size:1.071em}
.facview_tit span.mb_none {display:none}
.floor_mapbox .floor_item:after {display:none}

/* 지역연계 프로그램 안내 new kjh 241101 */
.local_aboxwrap {gap:20px; margin-bottom:20px}
.local_abox .la_boxarea ul li a {padding:14px 36px 14px 10px; font-size:1.077em}

.local_abox .la_boxarea ul li a:after {right:10px}
.la_boxarea .la_boxtit {padding:80px 20px 20px 20px; font-size:1.538em}
.local_abox01 .la_boxarea .la_boxtit:after {width:120px; height:60px; margin-left:-60px; border-radius:0 0 120px 120px; background-size:48px auto}
.local_abox02 .la_boxarea .la_boxtit:after {width:120px; height:60px; margin-left:-60px; border-radius:0 0 120px 120px; background-size:48px auto}
.local_aboxwrap2 .local_abox .la_boxarea ul li a {min-width:60px}
.local_aboxwrap2 .la_boxarea .la_boxtit {padding:10px 0 10px 60px; font-size:1.231em}
.local_aboxwrap3 .local_abox .la_boxarea ul li a {min-width:60px}
.local_aboxwrap3 .la_boxarea .la_boxtit {padding:10px 0 10px 60px; font-size:1.231em}
.local_aboxwrap3 .local_abox05 .la_boxarea .la_boxtit {font-size:1.154em; letter-spacing:-0.5px}
.local_abox03 .la_boxarea .la_boxtit:after {left:10px; width:40px; height:40px; margin-top:-20px; background-size:18px auto}
.local_abox04 .la_boxarea .la_boxtit:after {left:10px; width:40px; height:40px; margin-top:-20px; background-size:25px auto}
.local_abox05 .la_boxarea .la_boxtit:after {left:10px; width:40px; height:40px; margin-top:-20px; background-size:18px auto}
.local_abox06 .la_boxarea .la_boxtit:after {left:10px; width:40px; height:40px; margin-top:-20px; background-size:25px auto}
    
/* 층별 시설 1,2관 추가 kjh 250710 */
.art_factit h4 {padding:5px 20px}
    
}

/* PC LAYOUT */
@media only screen and (min-width:1025px) {
/* ----------------------컨텐츠 공통---------------------- */

/* -------------------컨텐츠 스타일 시작 -------------------*/
/* 연혁 */
.art_history .his_tit{ font-size:2.571em}	
.art_history .his_subtit {font-size:1.133em}
    
/* 전체 예술 교육 소개 */
.pro_introtab {min-height:280px}
.pro_introbox:before {width:12px}
.pro_introtop .ptit {font-size:1.733em}
.pit_tit {font-size:1.533em}
.pro_introtab li .pit_barogo {width:230px; padding:10px}

.pro_introtab li a {height:210px; padding:25px 0}
.pit_tit {padding:75px 10px 10px}
.pro_introtab li:hover a, .pro_introtab li.on a {height:240px; padding:65px 0; margin-top:-15px}
.art_procontit {padding-bottom:48px; margin-bottom:15px}
.art_procontit p {font-size:1.133em}
.pro_introbox {margin:20px 0}
.pro_introbox:before {width:8px; height:100%}
.pro_introbox:after {content:""; display: block; position:absolute; top:0; left:0; width:8px; height:62px; background:#292f45}
.pro_introbox ul {margin:0 300px 0 30px; padding:20px 10px}
.pro_introimg {position: absolute; top:0; right:0; padding:0}
.pro_introtop {padding:10px 10px 20px; margin:0 0 0 30px; text-align:left}
.pro_introtop .ptxt {display: inline-block; margin:0 0 0 10px; padding:4px 25px; vertical-align:bottom}
.pro_introbox ul li {padding:5px 0 5px 150px; margin-bottom:7px; text-align: left}
.pro_introbox ul li span {position:absolute; top:0; left:0; width:125px; padding:5px; text-align: center}
.pro_introbox ul li:last-child {margin-bottom:0}
    
.art_proconbox {display:flex; flex-wrap: wrap}
.art_proconbox li {width:49%; justify-items: center; margin:0}
.art_proconbox li:first-child {margin-right:1%; margin-bottom:1%}    
.art_proconbox li:nth-child(2) {margin-left:1%; margin-bottom:1%}    
.art_proconbox li:nth-child(3) {margin-right:1%; margin-bottom:1%}    
.art_proconbox li:nth-child(4) {margin-left:1%; margin-bottom:1%}
.art_proconbox li:nth-child(5) {margin-right:1%; margin-bottom:1%}    
.art_proconbox li:nth-child(6) {margin-left:1%; margin-bottom:1%}    
.art_proconbox li:nth-child(7) {margin-right:1%; margin-bottom:1%}    
.art_proconbox li:nth-child(8) {margin-left:1%; margin-bottom:1%}    

.art_proconbox li .tb_tit {position:absolute; top:0; left:0; width:104px; height:100%; text-align:center; box-sizing: border-box}
.art_proconbox li .tb_tit span {display:block; position:absolute; top:50%; left:0; width:100%; 
padding:44px 0 0;  margin-top:-32px; text-align: center}
#pintro2 .art_proconbox li .tb_tit span {margin-top:-44px; padding:52px 0 0}
    
#pintro1 .art_proconbox li .infotb01 .tb_tit span {background:url(../images/contents/blt_prointro1_ico01.png) no-repeat 50% 0}
#pintro1 .art_proconbox li .infotb02 .tb_tit span {background:url(../images/contents/blt_prointro1_ico02.png) no-repeat 50% 0}
#pintro1 .art_proconbox li .infotb03 .tb_tit span {background:url(../images/contents/blt_prointro1_ico03.png) no-repeat 50% 0}
#pintro1 .art_proconbox li .infotb04 .tb_tit span {background:url(../images/contents/blt_prointro1_ico04.png) no-repeat 50% 0}
    
#pintro2 .art_proconbox li .infotb01 .tb_tit span {background:url(../images/contents/blt_prointro2_ico01.png) no-repeat 50% 0}
#pintro2 .art_proconbox li .infotb02 .tb_tit span {background:url(../images/contents/blt_prointro2_ico02.png) no-repeat 50% 0}
#pintro2 .art_proconbox li .infotb03 .tb_tit span {background:url(../images/contents/blt_prointro2_ico03.png) no-repeat 50% 0}
#pintro2 .art_proconbox li .infotb04 .tb_tit span {background:url(../images/contents/blt_prointro2_ico04.png) no-repeat 50% 0}
#pintro2 .art_proconbox li .infotb05 .tb_tit span {background:url(../images/contents/blt_prointro2_ico05.png) no-repeat 50% 0}
    
.art_proconbox li .info_tb dl {padding:15px; margin-left:104px}

.art_prointro2 .pro_introbox:after {background:#5d1526}


}

/* LOWSET FIX */
@media only screen and (max-width:920px) {
/*프로그램 개수별 넓이 지정영역*/
.art_program .prognum2 ul{margin: 0 100px}
.art_program .prognum2 .prog_lst ul li{width: 50%}
.art_program .prognum3 ul{margin: 0}
.art_program .prognum3 .prog_lst ul li{width: 33.3%}
.art_program .prognum4 ul{margin: 0 100px}
.art_program .prognum4 .prog_lst ul li{width: 50%}
.art_program .prognum4 .prog_lst ul li:nth-child(3), .art_program .prognum4 .prog_lst ul li:nth-child(4){margin-top: 100px}

/*시설안내*/
/*자세히보기 레이어*/
.floor_more .floor_all{left:0; margin-left: 0; width: 100%}
.floor_more .floor_all .floor_rbox{width: auto; height: auto; margin: 0 15px}
.floor_all .floor_rtop .floor_tit{position: absolute; top:0; left:0; width: 100%; height: 40px; line-height: 40px; border-radius: 0; font-size: 18px}
.floor_all .floor_rtop .floor_txt{padding: 15px ; margin:40px 10px 0 10px; font-size: 15px; text-align: center}
.floor_all .floor_rimg .view_tit{margin:10px 0; font-size:16px; font-weight: 600}
.floor_all .floor_rimg .view_tit span{padding: 6px 10px 4px 12px; border-radius:50px; font-size: 13px}
.floor_all .floor_rimg .view_img{margin: 10px 10px 5px 10px}
.floor_all .floor_rimg .view_img img{overflow: hidden; width: 100%; height: auto}
.floor_all .btn_box{position: absolute; top:-2px; right:-2px}
.floor_all .btn_box img{transform: scale(70%)}
 
/* 조직도 */   
.organize_wrap .org_lstbox {background:none;  padding-top:20px} 
    
}
@media only screen and (max-width:785px) {
/*프로그램 세부 소개2*/
.art_progintro2 .intro01 div.info_box::after, .art_progintro2 .intro02 div.info_box::after{display: none}
 
    
}
@media only screen and (max-width:750px) {
/*인사말*/
.art_greet .greet_toptit {height:auto; padding:120px 15px 20px; background-position:50% 0; background-size:auto 180px}
.grtit01 {font-size:1.286em}
.grtit02 {font-size:0.933em}
}


@media only screen and (max-width:680px) {
/*프로그램 세부 소개*/
.intro_tb .intro01 .intro_btn>a::after{margin-left: -15px}
.intro_tb .intro02 .intro_btn>a::after{margin-left: -10px}
.intro_tb .intro01 .intro_btn>a{background-image:none}
.intro_tb .intro01 .intro_btn>a:hover, .intro_tb .intro01.on .intro_btn>a{background-image:none}
.intro_tb .intro02 .intro_btn>a{background-image:none}
.intro_tb .intro02 .intro_btn>a:hover, .intro_tb .intro02.on .intro_btn>a{background-image:none}
.intro_tb .intro01 .intro_btn>a span{margin:13px 0 0 0}
.intro_tb .intro02 .intro_btn>a span{margin:13px 0 0 0}

/*프로그램 세부 소개2*/
.art_progintro2 .intro_btn>a{text-align: left}
.art_progintro2 .intro01 .intro_btn>a::after{margin-left: -15px}
.art_progintro2 .intro02 .intro_btn>a::after{margin-left: -10px}
.art_progintro2 .intro01 .intro_btn>a{background-image:none}
.art_progintro2 .intro01 .intro_btn>a:hover, .art_progintro2 .intro01.on .intro_btn>a{background-image:none}
.art_progintro2 .intro02 .intro_btn>a{background-image:none}
.art_progintro2 .intro02 .intro_btn>a:hover, .art_progintro2 .intro02.on .intro_btn>a{background-image:none}
.art_progintro2 .intro01 .intro_btn>a span, .art_progintro2 .intro02 .intro_btn>a span{margin:16px 0 0 15px}
.art_progintro2 .stit{margin-bottom: 15px}
.art_progintro2 .stit span{padding: 0 20px 15px}
.art_progintro2 .stit span img{transform: scale(0.9)}
.art_progintro2 .intro_info{text-align: center}
.art_progintro2 .intro_info ul li span{display:block; width: 70px; padding:0; margin:0 auto 5px;  text-align: center}
.art_progintro2 .intro_info > ul {margin: 0}
.art_progintro2 .intro_info > ul > li{float: none; margin: 0 0 10px}
.art_progintro2 div.info_box{position: relative; padding: 10px 10px; margin: 10px 0}
.art_progintro2 div.info_box li{margin-bottom:10px}
.intro01 .info_lst ul{padding-top: 70px}
.intro01 .info_lst ul li{float: none; width: 100%}
}

@media only screen and (max-width:660px) {
.art_program .prog_toptit{margin: 25px 0 20px; text-align: center}
.art_program .prog_toptit .tit_img{width: 237px; height: 93px; margin: 0 auto 15px; background: url(../images/contents/prog_tit_m.gif) no-repeat left center}
.art_program .prog_toptit .tit_img img{display: none}
.art_program .tit_txt{margin-top: 10px; font-size: 1.077em}
.art_program .tit_txt br{display: block}
/*프로그램 개수별 넓이 지정영역*/
.art_program .prog_lst ul li .prog_item{width: auto; margin: 0 30px 100px; transition: 0.6s}
.art_program .prog_lst ul li:last-child .prog_item{margin-bottom: 0}
.art_program .prognum2 ul, .art_program .prognum3 ul, .art_program .prognum4 ul{margin: 0}
.art_program .prognum2 .prog_lst ul li, .art_program .prognum3 .prog_lst ul li, .art_program .prognum4 .prog_lst ul li{width: 100%}
.art_program .prognum4 .prog_lst ul li:nth-child(3), .art_program .prognum4 .prog_lst ul li:nth-child(4){margin-top:0}

/*시설안내*/
.art_floor .art_toptit{font-size: 14px}
.art_floor .floor_qucik{margin: 15px 0 5px}
.art_floor .floor_qucik ul{margin: 0}
.art_floor .floor_qucik ul li a{width: 95%; height:41px; line-height: 41px; background:url(../images/contents/floor_more_m.png) no-repeat right center #5bb64f; font-size: 1.000em; font-weight: 500}
.art_floor .floor_qucik ul li a span{margin-left: -15px}
.art_floor .floor_qucik ul li:last-child a{background:url(../images/contents/floor_more_m.png) no-repeat right center #4296d7}
.art_floor .floor_wrap .floor_mapbox{margin:15px 0 0; width:100%; height:auto}
.floor_wrap .floor_mapbox img{width: 100%; height: auto}
.floor_mapbox .floor_infotit{max-width:200px; height: 40px; line-height: 40px; font-size:1.071em}
.floor_mapbox .floor_item{padding: 15px}
}

@media only screen and (max-width:650px) {
/*연혁*/
.art_history .his_top{padding:40px 10px 10px}
.art_history .his_tit{position: relative; padding: 15px 0 20px; margin: 0 9px}
.art_history .his_wrap{position: relative}
.art_history .his_wrap::before {left:10px; width: 66px; height: 66px; margin-left: 0; background:none; z-index: 10}
.art_history .his_tb{position: relative; padding:10px 0 15px}
.art_history .his_tb::before{left:15px; margin-left: 0}
.art_history .his_tb::after{left: 7px; width:16px; height:16px; margin-left:0}
.art_history .year_wrap{width:auto; padding:5px 0; margin-left: 25px}
.art_history .year_right{margin-left:25px; padding-left: 0}
.art_history .year_left{margin-right:0; padding-right: 0; text-align: left}
.art_history .year_box dt{min-width: 90px; font-size: 1.000em}
.art_history .year_right dt::before {left:-17px; margin-left: 0}
.art_history .year_left dt::before {right:0; left:-17px; margin-right:0}
.art_history .year_left .year_lst{margin:0 0 0 10px}
.art_history .year_left .year_lst span.txt{margin:-18px 0 0 110px}
.art_history .year_lst li .date {font-size:0.933em}

.art_history .year_lst .year_sublst {margin:5px 0 0 120px !important}
.art_history .year_lst .year_sublst li {display:block}

    
/*조직구성*/
.organize_wrap {margin-bottom:10px}
.organize_wrap .org_lstbox::before{display: none}
.organize_wrap .org_lstbox::after{height:20px}
.organize_wrap .org_lstbox > ul > li{float: none; width:100%; margin: 0 auto}
.organize_wrap .org_lstbox .org_lst{width: 100%; margin:0 auto 20px}
.organize_wrap .org_lstbox .team_tit{width:100%; padding:10px; font-size:1.071em}
.organize_wrap .org_lstbox .org_team01 .team_lst{position: relative;}
.organize_wrap .org_lstbox .org_team01 .team_lst::after{content: ""; display: block; clear: both; position: absolute; left:50%; bottom:-22px; width:1px; height:20px; background:#d4d4d4}
.organize_wrap .team_direc {margin:12px 12px 0; padding-bottom:10px; font-size:1em}
.organize_wrap .team_lst ul li span {padding:8px 5px; font-size:0.933em}
    
}

@media only screen and (max-width:590px) {
/*현황*/
.facility_box ul li{text-align: center}
.facility_box ul li span{display: block; width: 60px; margin: 0 auto 10px}
/*대관 및 방문안내*/
.art_rent .rent_btnbox > p{margin-bottom: 10px}
.art_rent .rent_btnbox > p a{width: 250px}
}

@media only screen and (max-width:485px) {
/*찾아오시는 길*/
.art_map .map_tb{margin:20px 0}
.art_map .map_tb > dl dt{float:none; width: 100%; height: 35px; line-height: 35px; font-size:1em}
.art_map .map_tb > dl dd{float:none;width: 100%; text-align: center}
.art_map .map_traffic > div dt{font-size: 1.143em; margin-bottom:20px}
.art_map .traffic_subway{padding:10px; background:none}
.art_map .traffic_bus{padding:10px; background:none}
.art_map .traffic_bus li{margin-bottom: 13px}
.art_map .traffic_bus span.bus_kind{ padding: 3px 10px 1px; margin-right: 5px; font-size: 12px}
.art_map .traffic_bus span.bus_num{margin: -22px 0 0 50px; font-weight: 400; font-size: 13px}
.art_map .traffic_park {padding:10px; background:none}

/*프로그램 세부 소개2*/
.art_progintro2 .intro_btn>a{ border-radius: 10px; text-align: center}
.art_progintro2 .intro01 .intro_btn>a span, .art_progintro2 .intro02 .intro_btn>a span{display:inline-block; margin:10px 5px 0 5px}
.art_progintro2 .intro_btn>a::after{content: ""; display: block; clear: both; position: absolute; bottom:-20px; right:50%; width:34px; height: 34px; margin-right: -20px;  background:url(../images/contents/int_arw.png) no-repeat left center; border-radius: 50%; border:2px solid #d3d3d3}
.art_progintro2 .intro01 .intro_btn>a:hover::after, .art_progintro2 .intro01.on .intro_btn>a::after{border-color:#ffa0cd}
.art_progintro2 .intro02 .intro_btn>a:hover::after, .art_progintro2  .intro02.on .intro_btn>a::after{border-color:#8cc5ff}
.intro02 .prolst .prolst_tit{width:auto; line-height: 160%; padding:5px; text-align: center; font-weight: 500; font-size: 1.000em;color:#fff}
.intro02 .prolst .prolst_tit br{display: none}
.intro02 .prolst .prolst_tit span{display: block; padding-top:0; background:none}
.intro02 .prolst_txt{padding: 10px; margin:0}
}

@media only screen and (max-width:506px) {
.scroll_txt{display: block; padding: 5px; margin-bottom: 10px; border-radius: 50px; background:#b0b0b0; text-align: center; color:#fff; font-size: 12px}
}

@media only screen and (max-width:460px) {
/*모바일 아래에서 표 내용이 너무많을때 사이즈 고정후 스크롤 하기*/	
/****공통 Table****/
.table_scroll{overflow-x: auto; position: relative}
.table_scroll .mb_txt{padding: 10px;   ; text-align: center}
.table_scroll table {min-width:460px}
}

@media only screen and (max-width:366px) {
/*연혁*/
.art_history .year_wrap{margin-bottom: 0; padding-bottom: 0}
.art_history .year_wrap .year_lst span.date{margin-bottom: 5px}
.art_history .year_wrap .year_lst span.txt{margin:0}	
.art_history .year_lst .year_sublst {margin:5px 0 0 0 !important}
}


/*프로그램 세부 소개-회차별 2022.04.14추가*/
.artpro_intro .mark_tit {color:#7f7f7f}
.artpro_intro .mark_tit span.col_point{color:#000; font-weight:500; font-size:1.071em}
.artpro_intro .artpro_btn{padding:10px; margin-bottom: 15px; border-radius:5px; border: 1px solid #ccc}
.artpro_intro .artpro_btn ul li{float: left; width: 20%; margin-top: 10px}
.artpro_intro .artpro_btn.wdt04 ul li{width: 25%}
.artpro_intro .artpro_btn ul li:nth-child(1),.artpro_intro .artpro_btn ul li:nth-child(2),.artpro_intro .artpro_btn ul li:nth-child(3),.artpro_intro .artpro_btn ul li:nth-child(4),.artpro_intro .artpro_btn ul li:nth-child(5){margin-top: 0}
.artpro_intro .artpro_btn ul li a{display: block; width: 95%; padding:5px; margin: 0 auto; border-radius:7px; background: #f0f0f0; text-align: center; box-sizing: border-box; font-weight: 500; font-size:0.933em; transition: all .3s; letter-spacing:-0.4px}
.artpro_intro .artpro_btn ul li a:hover, .artpro_intro .artpro_btn ul li.on a{background: #50606f; color:#fff}
.artpro_intro .intro_titbox{position: relative; margin: 10px 0 30px}
.artpro_intro .intro_titbox .tit{position: relative}
.artpro_intro .intro_titbox .tit::after{content: ""; display: block; clear: both; position: absolute; top:16px; width:100%; height: 1px; border-radius: 50px; background:#ccc; z-index: 1}
.artpro_intro .intro_titbox .tit span{position: relative; display:block; padding:7px 45px; border-radius:5px; background: #ccc; text-align: center; font-size: 1.071em; color:#fff; z-index: 10}
.artpro_intro .intro_titbox.introtit01 .tit span{background:#ffa422}
.artpro_intro .intro_titbox.introtit02 .tit span{background:#ff7686}
.artpro_intro .intro_titbox.introtit03 .tit span{background:#c384e3}
.artpro_intro .intro_titbox.introtit04 .tit span{background:#1bc294}
.artpro_intro .intro_titbox.introtit05 .tit span{background:#289ae9}
/* .artpro_intro .intro_titbox::before, .artpro_intro .intro_titbox::after{content: ""; display: block; clear: both; position: absolute; top:12px; width: 10px; height: 10px; border-radius: 50px; background:#ccc; z-index: 10}
.artpro_intro .intro_titbox::before{left: 0}
.artpro_intro .intro_titbox::after{right: 0} */
.artpro_intro .intro_titbox .tit{position: relative}
.artpro_intro .proint_tb{position: relative}
.artpro_intro .prog_goal{position: relative; min-height:220px; line-height:150%;  padding:30px 20px 20px 440px; margin:20px 0; border-radius:0 10px 0 10px; background:#fff; border:1px solid #ccc; color:#000; word-break:keep-all}
.artpro_intro .progtxt_ul{margin-left: 10px; text-align: left}
.artpro_intro .progtxt_ul li{margin-bottom:5px; line-height: 130%; text-indent: -11px}
.artpro_intro .progtxt_ul li:last-child{margin-bottom: 0}
/*이미지 일때*/
.artpro_intro .prog_goal .progimg{position: absolute; top:15px; left:15px; width:400px; height: 240px; border-radius: 15px; box-shadow:2px 2px 6px rgba(0, 0, 0, 0.2); background:#f0f0f0 url(../images/contents/bg_prog_prepare2.gif) center center no-repeat;}
.artpro_intro .prog_goal .progimg img{overflow: hidden; width:400px; height: 240px; margin: 0 auto; border-radius: 15px}
/*유투브 일때*/
.artpro_intro .prog_goal .progytu{overflow: hidden; position: absolute; top:15px; left:15px; width:400px; height: 240px;box-shadow:2px 2px 6px rgba(0, 0, 0, 0.2); background:#f0f0f0 url(../images/contents/bg_prog_prepare.gif) center center no-repeat; border-radius:10px}
.artpro_intro .prog_goal .progtxt {line-height:160%}
/*유투브 없을때*/
.artpro_intro.non_mov .proint_tb{padding-top:0}
.artpro_intro.non_mov .prog_goal .progytu{display:none}
.artpro_intro.non_mov .prog_goal{padding:20px; min-height:auto}

/* 텍스트 타이틀 추가 kjh 240423 */
.progtxt_tit {padding:13px; margin-top:20px; text-align:center; font-weight:600; background:#eee; border-radius:10px 10px 0 0; font-size:1.154em}

.progtxt_box {line-height:150%; margin-left: 10px; text-align: left}

/*동영상 일때 */
.artpro_intro .prog_goal .progmov{overflow: hidden; position: absolute; top:15px; left:15px; width:400px; height: 240px;box-shadow:2px 2px 6px rgba(0, 0, 0, 0.2); background:#f0f0f0 url(../images/contents/bg_prog_prepare.gif) center center no-repeat; border-radius:10px}
.artpro_intro .prog_goal .progmov video{width:100%; height:100%; margin:0 auto; background:#000}
.artpro_intro .prog_goal .progmov video p {overflow:hidden; line-height:0; font-size:0; text-indent:-9999999px}

/*성취기준*/
.artpro_intro .criteria_lst{margin-top: 15px; border-radius:5px; background: #fff}
.artpro_intro .criteria_lst .criteria_tit{padding:5px; border-radius: 5px 5px 0 0; background: #50606f; color:#fff}
.artpro_intro .criteria_lst > ul{padding: 10px 15px; text-align: left; font-size: 13px}
.artpro_intro .criteria_lst > ul li{margin-bottom:5px; line-height: 130%}
.artpro_intro .criteria_lst > ul li:last-child{margin-bottom: 0}
/*스크립트 관련*/
.artpro_wrap .art_probox {display: none}
.artpro_wrap .art_probox.on {display: block}
.artpro_wrap .tit_area {padding-bottom:10px 0; margin-bottom:20px; text-align: center}
/*type3-프로그램 소개 테이블*/
.art_table.none_head3{overflow: hidden; color:#000}
.art_table.none_head3 tbody th{background:#e1e1e1; color:#000}
.art_table.none_head3 tbody th.bg_thtit{background: #50606f; color:#fff}
.art_table.none_head3 tbody td.bg_tdtit{background: #f1f1f1; text-align: center; color:#000}
.art_table.none_head3 tbody td{padding:11px 8px; text-align: left; color:#000;}
.art_table.none_head3 tbody td.txtcenter {text-align: center}
.art_table.none_head3 tbody td.progtit{color:#0088e7; font-size:1.133em; font-weight: 500}
.art_table.none_head3 ul{ /*margin: 0 0 5px;  border-radius: 5px; */  text-align: left; font-size:1em}
.art_table.none_head3 ul:first-child{margin-top: 0}
.art_table.none_head3 ul li{padding-left: 10px; margin-top: 5px; background:url(../images/contents/blt_txtlst.png) left 4px no-repeat; line-height: 130%; font-weight:400}
.art_table.none_head3 ul li strong {font-weight:600}
/*.art_table.none_head3 ul li:last-child{margin-bottom: 0}*/
.art_table.none_head3 ul.lst_type2{padding: 10px; margin-top: 5px; background: #fff}
.art_table.none_head3 ul.lst_type2 li{padding: 0; background: none}
.art_table.none_head3 ul > li > ul {/*padding:10px;*/ font-size:0.933em; /*background: #f1f1f1;*/ margin:8px 0 10px !important}
.art_table.none_head3 ul > li > ul > li {padding:0; background:none; font-weight:300}
.art_table.none_head3 ul > li > ul > li:first-child {margin:0}
.art_table.none_head3 p.tblst_tit{position: relative; margin:5px 0; padding-left: 10px}
.art_table.none_head3 p.tblst_tit::after{display:block; content: ""; clear: both; position: absolute; top:8px; left:0; width: 5px; height: 5px; background: #797979; border-radius: 50px}
.art_table.none_head3 p.tblst_tit:first-child{margin-top: 0}
.art_table.none_head3 p.tblst_tit:last-child{margin-bottom: 0}
.art_table.none_head3 tbody th.bg_thtit2{background:#89b35b; color:#fff; border-bottom-color:rgba(255,255,255,0.5)}
.artpro_local02 .art_table.none_head3 tbody th.bg_thtit2{background:#f19fad; color:#fff; border-bottom-color:rgba(255,255,255,0.5)}

/* 프로그램 표 안 이미지 */
.act_img {display:block}
.act_img img{vertical-align:middle; width:100%; height:100%; max-width:280px}


/* 토요예술교실 신청 안내 */
.satclass_intro .sc_toptit {padding:30px 10px; border-top:3px solid #ff724c; text-align: center; font-size:1.533em; font-weight:600}
.satclass_intro .sc_toptit span {color:#ff7800}
.satclass_intro .sc_etclist {margin-bottom:20px; padding:15px; border:1px solid #cdcdcd; border-radius:20px 20px}
.satclass_intro .sc_etclist li {padding:6px 0 6px 32px; margin:5px 0; font-size:1.067em; font-weight:500}
.satclass_intro .sc_etclist li:first-child {background:url(../images/contents/blt_num01.png) no-repeat  0 0}
.satclass_intro .sc_etclist li:nth-child(2) {background:url(../images/contents/blt_num02.png) no-repeat  0 0}
.satclass_intro .sc_etclist li .bg_grn {display:inline-block; padding:4px 7px; background:#13bcc2; border-radius:50px 50px; color:#fff; font-size:0.941em}
.satclass_intro .sc_etclist li .col_red {color:#ff1a1a; font-weight:600}
.satclass_intro .sc_etclist li .col_blue {color:#0073e8; font-weight:600}
.satclass_intro .sc_etclist li.fsize01 {font-size:1.133em}

.course_lst {margin:15px 0 5px}
.course_lst li {display: flex}
.satclass_arr {display:block; text-align: center}
.btn_satapply {margin:15px 0}
.btn_satapply a  {position:relative; display: block; padding:10px; box-sizing: border-box; background:#13bcc2; box-shadow: inset -4px -4px 12px rgba(0,0,0,0.1), inset 4px 4px 12px rgba(255,255,255,0.4); border-radius:50px 50px}
.btn_satapply a .sat_tit {display: block; padding:10px 150px 10px 50px; background:url(../images/contents/btn_satclass_ico.png) no-repeat 15px 50%; color:#fff; font-weight:600; font-size:1.333em}
.btn_satapply a .sat_barogo {position:absolute; top:50%; right:10px; background:#fff url(../images/contents/btn_satclass_arr.png) no-repeat right 15px top 50%; border-radius:50px; padding:12px 70px 11px 15px; font-weight:600; margin-top:-20px}
.btn_satapply a:hover {transition:.3s; background-color:#06a6e3}
.course_lst {display: flex; justify-content: space-between}
.course_lst li {display: flex; flex-wrap: wrap; flex-direction: column; width:100%; margin-bottom:20px; box-sizing: border-box}
.course_lst li .clst_box {flex: 1 1 0%; border-radius:20px;box-shadow:0 3px 8px rgba(0,0,0,0.2)}
.course_lst li .clst_box a {position:relative; display:block; padding:98px 30px 94px;text-align: center}
.course_lst li:first-child {padding-right:15px}
.course_lst li:nth-child(2) {padding-left:15px}
.course_lst li:first-child .clst_box {background:#008cd6 url(../images/contents/bg_satcourse01.png) no-repeat 50% 0}
.course_lst li:nth-child(2) .clst_box {background:#292f45 url(../images/contents/bg_satcourse02.png) no-repeat 50% 0}
.course_lst li:first-child:hover .clst_box {transition:.3s; background-color:#0275b3}
.course_lst li:nth-child(2):hover .clst_box {transition:.3s; background-color:#1f2a52}

.course_lst li .ctit {font-size:1.467em; font-weight:600; color:#fff}
.course_lst li .btn_go {position:absolute; bottom:34px; left:50%; margin-left:-85px; background:#fff url(../images/contents/btn_satclass_arr.png) no-repeat right 15px top 50%; border-radius:50px; padding:11px 98px 10px 15px; font-weight:600}

/* 악기공유마당 안내 */
.art_instrument img {vertical-align: middle}
.instr_top {position: relative}
/*.instr_top:after {content: ""; display: block; position: absolute; top:0; right:0; width:229px; height:262px; background: url(../images/contents/bg_instrument_tit.png) no-repeat 100% 0}*/
.instr_top h4.tit {padding-bottom:10px; border-bottom:2px solid #1b3665; text-align: center}
.instr_box {padding:28px 0 10px}
.instr_lst {position: relative; word-break: keep-all}
.instr_lst p.tit {position: absolute; top:0; left:5px}
.instr_lst p.tit span {display: inline-block; width:110px; height:36px; line-height:36px; background:#0386cc; border-radius:50px 50px; text-align: center; font-size:1.071em; font-weight:600; color:#fff; box-sizing: border-box}
.instr_lst .instr_txtbox {padding:8px 220px 8px 130px; margin-bottom:15px}
.instr_lst ul li {line-height:150%; padding:3px 0 3px 15px; background: url(../images/contents/blt_txtlst.gif) left 10px no-repeat}

.instr_lst1 p.tit span {background:#ff683c}
.instr_lst .col_bold {font-weight:600}
.instr_lst .fsize01 {font-size:1.071em}

.instr_detail {position:relative; border:1px solid #cbcbcb}
.detail_tit {padding:14px 10px; background:#292f45; text-align: center; color:#fff; font-size:1.071em; font-weight:600}
.detail_box {padding:17px; font-size:0.933em}
.detail_box ul li {line-height:160%}
.detail_stepbox {display: flex; justify-content: space-between; margin:20px 0 10px}
.detail_sbox {display: flex; justify-content: space-between}
.detail_stepbox dl {position:relative; width:128px; min-height:136px; margin-right:19px; padding-bottom:15px; text-align: center; box-sizing: border-box; border:2px solid ; border-radius:10px}
.detail_stepbox dl:before {content:""; display: block; position: absolute; right:0; top:50%; width:16px; height:19px; margin:-10px -18px 0 0; background: url(../images/contents/img_instrument_arr.png) no-repeat 100% 50%}
.detail_stepbox dl.step06:before {background: none}
.detail_stepbox dl dt {margin-bottom:10px}
.detail_stepbox dl dt span {display:block; width:90px; height:45px; line-height:43px; margin:0 auto; border-radius:0 0 90px 90px; color:#fff; font-weight:600; text-shadow:0 2px 4px rgba(0,0,0,0.2)}
.detail_stepbox dl dd {font-weight:400}
.detail_stepbox dl dd span {font-size:0.933em; font-weight:300}

.detail_stepbox dl.step01 {border-color:#a6e23d}
.detail_stepbox dl.step02 {border-color:#7ad381}
.detail_stepbox dl.step03 {border-color:#6bc0ba}
.detail_stepbox dl.step04 {border-color:#3fa2e6}
.detail_stepbox dl.step05 {border-color:#567fbd}
.detail_stepbox dl.step06 {border-color:#9387d8}

.detail_stepbox dl.step01 dt span {background:#a6e23d}
.detail_stepbox dl.step02 dt span {background:#7ad381}
.detail_stepbox dl.step03 dt span {background:#6bc0ba}
.detail_stepbox dl.step04 dt span {background:#3fa2e6}
.detail_stepbox dl.step05 dt span {background:#567fbd}
.detail_stepbox dl.step06 dt span {background:#9387d8}

/* 악기공유마당 kjh 240312 */
.intr_addwrap {text-align: center}
.instr_addtop {position: relative}
.instr_addtop h4.tit {padding-bottom:5px; text-align: center}
.instr_addwrap {padding:20px 15px 10px; margin-bottom:20px; border:3px solid #eee; border-radius:15px; background: url(../images/contents/bg_instrument_tit.png) no-repeat 100% 100%}
.instr_addlst {position: relative; word-break: keep-all}
.instr_addlst p.tit {position: absolute; top:0; left:5px}
.instr_addlst p.tit span {display: inline-block; width:110px; height:32px; line-height:32px; background:#757575; border-radius:50px 50px; text-align: center; font-size:1.071em; font-weight:600; color:#fff; box-sizing: border-box}
.instr_addlst .instr_addbox {padding:6px 220px 6px 130px; margin-bottom:10px}
.instr_addlst ul li {line-height:150%; padding:3px 0 3px 15px; background: url(../images/contents/blt_txtlst.gif) left 10px no-repeat}
.instr_addlst .col_bold {font-weight:600}
.instr_addlst .fsize01 {font-size:1.071em}
.first_tit p.tit span {background:#0386cc}


@media only screen and (max-width:1024px) {
.artpro_intro .artpro_btn{font-size: 14px}
.artpro_intro .artpro_btn ul li{width:25%}
.artpro_intro .artpro_btn ul li:nth-child(5){margin-top:10px}
.artpro_intro .progtxt br{display:none}
    
/* table */
.art_table.none_head3 tbody th{padding:6px 3px}
.art_table.none_head3 tbody td{padding:6px 5px}
    
}

 @media only screen and (min-width:631px) and (max-width:1024px) {   
/* 악기공유마당 */
.detail_stepbox {display:block}
.detail_sbox {flex:1}
.detail_stepbox dl {width:100%; margin:10px 1.5%}
.sbox2 {flex-direction: row-reverse}
.detail_stepbox .sbox2 dl:before {right:inherit; left:0; margin:-10px 0  0 -18px; transform: rotate(180deg)}
.detail_stepbox dl.step03:before {width:19px; height:16px; right:50%; top:inherit; bottom:-10px; margin:0 -9px -7px 0; transform: rotate(90deg)}
     
 .instr_top:after {width:150px; height:200px; background-size:150px auto}
     
 .instr_lst .instr_txtbox {padding:8px 20px 8px 130px}
 .instr_lst.instr_lst1 .instr_txtbox {padding:8px 160px 8px 130px}
    
}


@media only screen and (max-width:800px) {
.artpro_intro .artpro_btn{padding:6px}
.artpro_intro .artpro_btn ul li{width: 33.3%; margin-top:6px}
.artpro_intro .artpro_btn ul li:nth-child(4){margin-top:6px}
.artpro_intro .artpro_btn ul li:nth-child(5){margin-top:6px}
}

@media only screen and (max-width:630px) {
/* 악기공유마당 */
.detail_stepbox {display:block}
.detail_stepbox dl {width:100%; margin:10px 1.5%; min-height:inherit}
.detail_sbox {flex-wrap: wrap; flex:1}
.detail_stepbox .detail_sbox dl:before {width:19px; height:16px; right:50%; top:inherit; bottom:-10px; margin:0 -9px -7px 0; transform: rotate(90deg)}
    
.instr_top:after {display:none}
.instr_lst .instr_txtbox {padding:40px 12px 10px}
.instr_lst p.tit {left:0; width:100%}
.instr_lst p.tit span {display:block; width:100%; height:30px; line-height:30px}

/* 악기공유마당 kjh 240312 추가 */
.instr_addlst .instr_addbox {padding:40px 5px 10px}
.instr_addlst p.tit {left:0; width:100%}
.instr_addlst p.tit span {display:block; width:100%; height:30px; line-height:30px}
.instr_addwrap {background:none}
.instr_addtop h4.tit img{height:70px; width:auto}
.instr_top h4.tit img{height:70px; width:auto}
}

@media only screen and (max-width:500px) {
.artpro_intro .artpro_btn ul li{width: 50%}
.artpro_intro .artpro_btn ul li:nth-child(3){margin-top: 6px}
artpro_intro .artpro_btn ul li a {text-overflow: ellipsis; display:block; white-space: nowrap; overflow: hidden}
}


/* 모바일 */
@media only screen and (max-width:1024px) {
.artpro_intro .prog_goal .progytu {left:50%; margin-left:-145px; width:280px; height:170px}
.artpro_intro .prog_goal {min-height:inherit; padding:210px 15px 15px 15px; border-radius:0 0 10px 10px; margin:0 0 15px; border-top:0}
.artpro_intro .prog_goal .progimg  {left:50%; margin-left:-140px; width:280px; height:170px}
.artpro_intro .prog_goal .progimg img {width:280px; height:170px}
.artpro_intro .prog_goal .progmov {left:50%; margin-left:-145px; width:280px; height:170px}

.prog_toptit .prog_tit {position:inherit; bottom: inherit; left:inherit; width:200px; height:38px; line-height:38px; margin:0 auto; border-radius:15px 15px 0 0; font-size:1.071em}
.prog_toptit .prog_subj {margin:0; border-radius:10px 10px 0 0; padding:15px; font-size:1.286em; text-align: center}
    
    /* 토요예술교실 신청 안내 */
    .btn_satapply a .sat_tit {padding-right:10px}
    .btn_satapply a .sat_barogo {width:42px; height:42px; line-height:40px; font-size:0; box-sizing: border-box; padding:0}
    .course_lst {display:block}
    .course_lst li {padding:0 !important}
    .course_lst li .ctit {font-size:1.385em}
    .course_lst li .clst_box {background-size:100px auto !important}
    .course_lst li .clst_box a {padding:70px 20px 70px}
    .course_lst li .btn_go {bottom:20px; padding:7px 98px 6px 15px}
    .satclass_arr img {width:150px; height:auto}
}

/* PC LAYOUT */
@media only screen and (min-width:1025px) {
    /* 토요예술교실 신청 안내 */
    .satclass_intro .sc_toptit {padding:38px 15px; font-size:1.733em}
    .satclass_intro .sc_etclist {border-radius:100px 100px; padding:15px 60px; background:url(../images/contents/bg_sattop_lst.png) no-repeat right 12px center}
    .btn_satapply a {width:468px; margin:0 auto}
    
    
}

@media only screen and (max-width:750px) {
    /* 지역연계 예술교육 체험신청 안내 */
    .local_aboxwrap {display:block; margin:0}
    .local_abox {width:100%; margin-bottom:20px}
    
}