@charset "utf-8";

/* content */
#sub_container_wrap {position:relative; background:#fff}
#sub_container_wrap:after {content:""; display:block; clear:both;} 

/* visual */
.area_visual {position:relative; width:100%; height:250px; color:#fff; letter-spacing:-1px; text-align:center; background:url('/images/org/web/ins/sub/S_visual.png') no-repeat 50% 0; -webkit-animation:animate_background 10s linear;-moz-animation:animate_background 10s linear;-o-animation:animate_background 10s linear;animation:animate_background 10s linear;}
.area_visual .txt1 {width:1200px; margin:0 auto; text-align:left;  padding-top:60px; font-size:35px; line-height:48px; text-shadow:1px 2px 2px rgba(6,7,7,.77);}
.area_visual .txt1 span {font-size:42px;}
.area_visual .txt1 br {display:none;}
.area_visual .txt2 {width:1200px; margin:0 auto; text-align:left; margin-top:10px; font-size:50px; line-height:60px; text-shadow:1px 2px 2px rgba(6,7,7,.77);}
/* 비주얼 애니메이션 */
@keyframes animate_background{
	 0%   {background-position:50% 0;}
	 50%  {background-position:50% 100%;}
	 100%  {background-position:50% 0.1%;}
}

.sub_content_wrap {position:relative; width:1200px; margin:0 auto 100px; min-height:680px;} 
.sub_content_wrap:after {content:""; display:block; clear:both;} 

#sub_content{ float:right; width:900px} 
.subCntBody{ position:relative; padding:30px 0 40px;}

/* 왼쪽메뉴 */
#menu { position:relative; float:left; margin-right:50px; width:250px; padding-top:20px} 
#menu h1 { background:url('/images/org/web/ins/sub/left_mn_tit_bg.png') repeat; height:80px; line-height:78px; letter-spacing:-2px; text-align:center; color:#fff; font-size:26px}
#menu .lnb { border:1px solid #d3d7dd; border-top:0 }
#menu .lnb > li{ position:relative; border-top:1px solid #d3d7dd }
#menu .lnb > li:first-child{ border-top:0 }
#menu .lnb > li > a {display:block; line-height:130%; padding:10px 20px 10px 16px; font-size:14.5px; color:#333;}
#menu .lnb > li > a:hover { text-decoration:underline}
#menu .lnb > li.on > a {color:#3358c2; font-weight:bold}
#menu .lnb > li.on > a:hover { text-decoration:none}
#menu .subLnb {display:none; border-top:1px solid #d3d7dd; background-color:#eeeff2; padding:8px 18px; }
#menu .subLnb li a {display:block; color:#333; padding:3px 10px 3px 10px; font-size:13px; background:url('/images/org/web/ins/sub/bgSideNaviSub.gif') no-repeat 0 10px}
#menu .subLnb li.on a {color:#3a7cd2; background-image:url('/images/org/web/ins/sub/bgSideNaviSub_on.png')}
#menu .subLnb li.on a:hover {text-decoration:none}
#menu .subLnb li a:hover{ text-decoration:underline}
/* 왼쪽메뉴 2차메뉴 아이콘 */  
#menu .lnb > li.row > a:after{display:block; position:absolute; content:'';}
#menu .lnb > li.row > a:after{background:url('/images/org/web/ins/sub/arrow_b.png') no-repeat; width:5px; height:8px; right:18px; top:16px;}
#menu .lnb > li.on > a:after{ background:url('/images/org/web/ins/sub/arrow_b_on.png') no-repeat; width:8px; height:5px; right:16px; top:18px}
/* 새창 아이콘 */
#menu .lnb a[target='_blank']:after  {content:""; background:url('/images/org/web/ins/common/icon_blank.png') no-repeat; display:inline-block; width:11px; height:11px; margin-left:10px;}

/* sub 타이틀 */
#sub_content .title_area{ position:relative; overflow:hidden; padding:47px 0 0; height:51px; border-bottom:1px solid #e5e5e5}
#sub_content .title_area:after { content:""; display:block; clear:both;}
.title_area .location { position:absolute; top:18px; right:0; font-size:13px; line-height:18px;}
.title_area .location span, 
.title_area .location strong {display:inline-block; *display:inline; zoom:1; padding-left:16px; background:url('/images/org/web/ins/sub/icon_location_arrow.gif') no-repeat 5px 6px; color:#777}
.title_area .location strong { font-weight:normal}
.title_area .location a.home img {vertical-align:middle}
.title_area .pageTitle{ font-weight:bold; letter-spacing:-2px; font-size:30px; color:#222; line-height:36px}

/* sns */ 
.snsBox { position:absolute; top:59px; right:0;}
.snsBox:after { content:""; display:block; clear:both;}
.snsBox button { float:left; margin-left:7px; width:28px; height:28px; overflow:hidden; background:url("/images/org/web/ins/sub/btnSns.png") no-repeat 0 0}
.snsBox button > span {text-indent:-1140px; font-size:0; line-height:0}
.snsBox .btnPrint { background-position:0 0; }
.snsBox .btnFbook { background-position:-31px 0; }
.snsBox .btnTwt { background-position:-62px 0; }
.snsBox .btnKko { background-position:-93px 0; }
.snsBox .btnKkot { background-position:-124px 0; }
.snsBox .btnBand{ background-position:-155px 0; }
.snsBox .btnDaum{ background-position:-186px 0; }
.snsBox .btnShare{ background-position:-217px 0; }
.snsBox .snsClose{ background-position:-248px 0; margin-left:-133px;}
.snsBox .sns_more{display:none; position:absolute; right:-105px; top:0; text-align:left}
.snsBox.on{ right:105px}
.snsBox.on .sns_more{ display:block;}

/*악기대여 추가 -jy 211022*/
.map_wrap {width: 50%; min-width: 421px; min-height: 351px; float: left; padding: 5px; height: 350px;}
.map_wrap .map_area {width: 100%; height: 100%; position: relative; background-repeat: no-repeat; background-size: contain; background-position: center; background-image: url(/images/org/web/ins/sub/map/map_00.png); background-color: #eef2ff;}
.map_wrap .map_area .map_list {position: relative; width: 100%; height: 100%;}
.map_wrap .map_area .map_list li {position: absolute; font-size: 12px;}
.map_wrap .map_area .map_list li span {display: none; text-align: center; font-size: 11px;}
.map_wrap .map_area .map_list li.on {color: white; font-weight: bold; text-shadow: 1px 1px rgb(15, 24, 104);}
.map_wrap .map_area .map_list li.on span {display: block; }
.map_wrap .map_area .map_list li.map_01{top: 81%;left: 46%;}
.map_wrap .map_area .map_list li.map_02{top: 67%;left: 24%;}
.map_wrap .map_area .map_list li.map_03{top: 89%;left: 18%;}
.map_wrap .map_area .map_list li.map_04{top: 27%;left: 30%;}
.map_wrap .map_area .map_list li.map_05{top: 27%;left: 51%;}
.map_wrap .map_area .map_list li.map_06{top: 32%;left: 70%;}
.map_wrap .map_area .map_list li.map_07{top: 39%;left: 86%;}
.map_wrap .map_area .map_list li.map_08{top: 11%;left: 16%;}
.map_wrap .map_area .map_list li.map_09{top: 42%;left: 15%;}
.map_wrap .map_area .map_list li.map_10{top: 24%;left: 5%;}
.map_wrap .map_area .map_list li.map_11{top: 61%;left: 8%;}
.map_wrap .map_area .map_list li.map_12{top: 55%;left: 30%;}
.map_wrap .map_area .map_list li.map_13{top: 70%;left: 39%;}
.map_wrap .map_area .map_list li.map_14{top: 48%;left: 74%;}
.map_wrap .map_area .map_list li.map_15{top: 53%;left: 61%;}
.map_wrap .map_area .map_list li.map_16{top: 48%;left: 49%;}
.map_wrap .map_area .map_list li.map_17{top: 39%;left: 40%;}
.map_wrap .map_area .map_list li.map_18{top: 83%;left: 62%;}
.map_wrap .map_area .map_imgList {position: absolute;  top: 0; left: 0; width: 100%; height: 100%;}
.map_wrap .map_area .map_imgList li {position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: none;}
.map_wrap .map_area .map_imgList li.on {display: block;}
.map_wrap .map_area .map_imgList img {width: 100%; height: 100%;}
.talbe_wrap {width: 45%; height: 100%;float: right; }
.talbe_wrap .map_btn {width: 100%; margin-top: 20px;}
.talbe_wrap .map_btn select {width: 32%;}
.talbe_wrap .map_btn .search_wrap {width: 100%; margin: 10px 0 10px;}
.talbe_wrap .map_btn .search_wrap input {width: 60%; margin-right: 5px;}
.talbe_wrap .map_btn .search_wrap .sb-btn {width: 33%;}

/* 200902 추가 */ 
.math_greet {padding-right: 40%;}

.sclboxType1{background-color:#fff; overflow:hidden;}
.sclboxType1 .terms_box{text-align:left; color:#666; border:1px solid #d6d6d6; background:#f7f7f7; height:103px; overflow:hidden; overflow-y:scroll; padding:8px 1%; font-size:13px; line-height:150%}
.sclboxType1 .terms_box h4{ font-weight:bold; margin-bottom:4px;}
.sclboxType1 .chk_all{border:1px solid #d6d6d6; padding:8px 10px 10px; font-size:13px; text-align:right; overflow:hidden}


.ins_list {margin-top:10px; padding:10px 0; overflow:hidden; }
.ins_list ul {width:104%; margin-left:-1.5%; }
.ins_list ul li {width:30%; height: 170px; margin:10px 1.5%; float:left;}
.ins_list ul li div {display:block; text-align:center; padding:0 0 5px; border:1px solid #c8d1db; overflow:hidden}
.ins_list ul li a {display:block; text-align:center; padding:0 0 5px; border-bottom:1px solid #c8d1db; border-left:1px solid #c8d1db; border-right:1px solid #c8d1db; overflow:hidden}
.ins_list ul li p {padding:5px 20px 0px; line-height:24px; font-size:14px; color:#111; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; }


.ins_table {position:relative; margin-top:10px; height:250px; overflow:auto;}
.ins_table th {padding:13px 0 18px; font-size:14px; background:url("/images/org/co/na/pt_diagonal.png") repeat-x left bottom; text-align:center;}
.ins_table td {padding:10px 10px; font-size:13px; color:#555; text-align:center; border:1px solid #b2b7c7;}
.ins_table td a {/* width:90%; */display:block;color:#333;} 
/* .ins_table td:hover, 
.ins_table td:active, 
.ins_table td:focus {backgroundColor:#CEFBC9;} */
#ins_table td{border-left: none;}
#searchTbody>tr>td{border-left: 1px solid #b2b7c7;}

/* 버튼 */
.btn { display:inline-block; *display:inline; zoom:1; margin:0 5px 5px 0; font-family:"NanumBold"; font-size:14px; color:#fff; line-height:20px; text-align:center; border-radius:3px; vertical-align:middle; -ms-touch-action:manipulation; touch-action:manipulation; border:1px solid transparent; white-space:nowrap; padding:6px 12px}
.btn_M {display:inline-block; *display:inline; zoom:1; margin:0 3px 3px 0; font-family:"NanumBold"; font-size:13px; color:#fff; line-height:20px; text-align:center; border-radius:3px; vertical-align:middle; -ms-touch-action:manipulation; touch-action:manipulation; border:1px solid transparent; white-space:nowrap; padding:3px 10px}
.btn_S {display:inline-block; *display:inline; zoom:1; margin:0; font-family:"NanumBold"; font-size:12px; color:#fff; line-height:20px; text-align:center; border-radius:3px; vertical-align:middle; -ms-touch-action:manipulation; touch-action:manipulation; border:1px solid transparent; white-space:nowrap; padding:0 8px}
.btn_default {background-color:#fff; border-color:#ccc; color:#364c60 !important}
.btn_blue { background-color:#1A82C3; border-color:#1A82C3}
.btn_green { background-color:#26B99A; border-color:#4cae4c}
.btn_sky {background-color:#5bc0de; border-color:#46b8da}
.btn_yellow {background-color:#f0ad4e; border-color:#f0ad4e}
.btn_red {background-color:#d9534f; border-color:#d9534f}
.btn_dark {background-color:#4b5e70; border-color:#364c60; color:#e9edef !important}
.btn:hover, .btn_S:hover, .btn_M:hover { opacity:0.9}

.mapReset{position: absolute; right: 0; z-index:9; cursor:pointer;}

@media screen and (max-width:1019px) {
	
	.sub_content_wrap, #sub_content, .subCntBody, #menu h1 {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box}
	
	#sub_container_wrap { padding-top:80px;}
	
	/* visual */
	.area_visual .txt1 { width:95%; padding-top:60px; font-size:30px; line-height:150%;}
	.area_visual .txt1 span {font-size:30px;}
	.area_visual .txt1 br {display:none;}
	.area_visual .txt2 {width:95%; font-size:48px; line-height:150%;}
	
	/* content */
	#sub_container_wrap, .sub_content_wrap {width:100%}	
	.sub_content_wrap {margin:0 auto}	
	#sub_content{margin:0; width:100%; padding:0 2.5% 20px}
	.subCntBody {width:100%}	

	/* 왼쪽메뉴 */
	#menu { width:100%; margin:0; padding:0}
	#menu h1 {width:100%; height:auto; line-height:150%; padding:6px 0 9px; cursor:pointer; font-size:20px; background:#55aade url("/images/org/web/ins/sub/bgLnbDepth.png") no-repeat 98% 50%;}
	#menu h1.on{background-image:url("/images/org/web/ins/sub/bgLnbDepthOn.png")}
    #menu nav{display:none}
    #menu nav{position:relative; border-bottom:1px solid #333}
    #menu .lnb{ border:0}
	
}

@media(max-width:880px){
		/*악기대여 -jy 211022*/
		.map_wrap {float:none; margin:auto;}
		.talbe_wrap {width: 100%; float: none; }
}

@media screen and (max-width:800px) {
	
	/* visual */
	.area_visual { height:200px}
	.area_visual .txt1 {padding-top:60px; text-align:center; font-size:24px; line-height:150%;}
	.area_visual .txt1 span {font-size:24px;}
	.area_visual .txt1 br {display:none;}
	.area_visual .txt2 {font-size:30px; text-align:center}
	
	.subCntBody{padding:25px 0 40px}
	
	/* sub 타이틀 */
	#sub_content .title_area{ height:auto; overflow:visible; padding:0 0 0; border-bottom:0;}
	.title_area .location { position:relative; top:auto; right:auto; text-align:center; margin:20px 0 10px}
	.title_area .pageTitle{ border-bottom:1px solid #e5e5e5; padding-bottom:22px; text-align:center; line-height:130%;}
	
	/* sns */ 
	.snsBox { position:relative; float:right; top:auto; right:auto; z-index:1; margin-top:10px}

    /* 200902 추가 */ 
	.math_greet {padding-right: 0%;}
    .greet_img {display:none;}
	
}

@media screen and (max-width:600px) {
	#sub_container_wrap #container {padding-top: 0 !important;} /* 20251204 추가 */
	#wrap.no_langs #sub_container_wrap #container {padding-top: 0 !important;} /* 20251204 추가 */
}


@media screen and (max-width:580px) {
	
	#sub_container_wrap { padding-top:60px;}
	
	/* visual */
	.area_visual .txt1 {padding-top:35px; line-height:140%;}
	.area_visual .txt1 br { display:block}
	
	/* 왼쪽메뉴 */
	#menu h1 { text-align:left; padding:6px 16px 9px; background-position:97% 50%}
	
	/* sub 타이틀 */
	.title_area .location {margin:16px 0 8px}
	.title_area .pageTitle{ font-size:24px; letter-spacing:-1px; padding-bottom:18px;}
	
}

@media screen and (max-width:480px) {
	
	/* 왼쪽메뉴 */
	#menu h1 {background-position:96% 50%}
	
	/*악기대여 -jy 211022*/
		.map_wrap {overflow:scroll; min-width:auto; width:98%;}
		.map_wrap .map_area {overflow:scroll; width:412px;}
	
}

@media screen and (max-width:380px) {

	
}