@charset "UTF-8";

ul {list-style:none;}
ul { margin: 0 0 0 0; padding: 0; }
li { margin: 0; padding: 0; }

.logo { position:absolute; left:20px; top:18px; }
.menu { position:absolute; right:20px; top:40px; }

#wrap header img {display:block;}
#wrap footer.copy {clear:both;position:relative; margin-top:0;}
#wrap footer div img { display:block;}

/* nav */
#MenuArea { position:fixed; left:0; top:0; right:0; width:100%; height:100%; background:rgba(0,0,0,0.75); z-index:90; display:none; }
#Menu { position:absolute; width:496px; height:100%; background:#fff; z-index:100; display:none; top:0px; right:-496px; }
#sidemenu { width:100%; display:inline-block; text-align:center; padding-top:145px; }
#sidemenu > li { display:inline-block; float:left; width:100%; height:51px; margin-bottom:34px; }
#sidemenu > li > a { text-decoration:none; display:inline-block; line-height:51px; padding:0 12px; color:#2d2d2d; font-size:30px; font-weight:400; }
#sidemenu > li.on > a { color:#ff5252; background:url("/m/images/top/menu_dot.jpg") no-repeat right 1px top 6px; }


/* 메인 */
.notice_area { position:relative; width:600px; height:66px; box-sizing:border-box; border:1px solid #e5e5e5; background:#fff; z-index:30; display:inline-block; }
.na1 { width:125px; height:100%; float:left; position:relative; background:url("/m/images/notice_title.jpg") no-repeat left top; }
.na2 { width:473px; height:100%; float:left; position:relative; }

/* 서브 */
.subvisual { width:100%; height:200px; margin:0 auto; background-repeat:no-repeat; background-position:center top; position:relative; }
.p_title { text-align:center; font-size:38px; font-weight:500; color:#fff; line-height:50px; padding:45px 0 0px; }

.route { width:100%; height:60px; margin:0 auto; position:absolute; border-top:1px solid rgba(255,255,255,0.3); left:0; right:0; bottom:0; }
.route > div { width:100%; height:100%; position:relative; margin:0 auto; }
.route > div > ul { display:inline-block; height:100%; }
.route > div > ul > li { display:inline-block; height:100%; float:left; line-height:60px; border-right:1px solid rgba(255,255,255,0.3); position:relative; }
.route > div > ul > li.home { width:59px; border-left:1px solid rgba(255,255,255,0.3); font-size:19px; color:#333333; font-weight:300; text-align:center; }
.route > div > ul > li > span { display:inline-block; width:100%; padding-left:20px; color:#ffffff; font-size:19px; font-weight:400; background:url("/res/images/subvisual/route_arrow1.png") no-repeat right 15px top 27px; box-sizing:border-box; cursor:pointer; }
.route > div > ul > li > span.on { background:url("/res/images/subvisual/route_arrow2.png") no-repeat right 15px top 27px; }
	#ru1_ul { position:absolute; display:none; z-index:200; left:-1px; top:60px; width:289px; background:#fff; border:1px solid #dedede; border-top:0px; padding:15px 0 20px; z-index:10; }
	#ru1_ul > li { width:100%; height:35px; line-height:35px; display:inline-block; float:left; }
	#ru1_ul > li > a { color:#666; font-size:19px; font-weight:300; text-decoration:none; width:100%; height:35px; line-height:35px; display:inline-block; box-sizing:border-box; padding-left:20px;  }
	#ru1_ul > li > a:hover,
	#ru1_ul > li > a.on { color:#111111; }
	#ru2_ul { position:absolute; display:none; z-index:200; left:-1px; top:60px; width:288px; background:#fff; border:1px solid #dedede; border-top:0px; padding:15px 0 20px; z-index:10; }
	#ru2_ul > li { width:100%; height:35px; line-height:35px; display:inline-block; float:left; }
	#ru2_ul > li > a { color:#666; font-size:19px; font-weight:300; text-decoration:none; width:100%; height:35px; line-height:35px; display:inline-block; box-sizing:border-box; padding-left:20px;  }
	#ru2_ul > li > a:hover,
	#ru2_ul > li > a.on { color:#111111; }
.route ul > li.no_sub > span { background:none; cursor:auto; }

.title_area { width:100%; height:220px; text-align:center; background:url("/res/images/title_bar.jpg") no-repeat center 50px; }
.title_area .header_p1 { line-height:1em; color:#000000; font-size:35px; font-weight:400; padding-top:90px; }
.title_area .header_p2 { line-height:1em; color:#717171; font-size:21px; font-weight:300; padding-top:20px; }

.sheet_music_bot { width:100%; position:relative; margin:0 auto; }
.sheet_music_bot > ul { display:inline-block; width:100%; }
.sheet_music_bot > ul > li { float:left; width:50%; height:208px; position:relative; }
.sheet_music_bot > ul > li > a { display:inline-block; width:100%; height:100%; text-decoration:none; }
.sheet_music_bot > ul > li > a > img { display:block; }

/* 보드 */
.boardarea { width:600px; margin:0px auto; padding:0 0 100px; }

.Boardpage { text-align:center; width:100%; display:inline-block; padding:10px 0 100px; }
.Boardleftbtn {float:left;width:22%;}
.Boardrightbtn {float:right;}
table.t6 {border:0;background:transparent;padding:0 0 0 0;margin:0 auto;}
table.t6 td {border:1px solid #d0d0d0;width:28px;padding:0;margin:0;height:28px;text-align: center;vertical-align:middle;color:#595959;background:transparent;font-size:17px;}
table.t6 td.td-remo {text-align:right;padding:0 13px 0 0;border:0;width:8px;margin:0;}
table.t6 td.td-remo2 {text-align:left;padding:0 0 0 13px;border:0;width:8px;margin:0;}
table.t6 td.td-con {border:0;}
table.t6 td > a { display:inline-block; width:100%; height:100%; color:#1f1f1f; text-decoration:none; line-height:28px; }
table.t6 td.td-on {background:#1f1f1f;color:#dcdcdc;border:1px solid #1f1f1f;}
table.t6 td.td-on a:link {color:#dcdcdc;}
table.t6 td.td-on a:visited {color:#dcdcdc;}
table.t6 td.td-on a:hover {color:#dcdcdc;}
table.t6 td.td-on a:active {color:#dcdcdc;}
table.t6 thead th, table.t1 tfoot th { text-align: center; vertical-align: middle;}
	span.hidden_span { text-indent:-10000px; overflow:hidden; height:0; font-size:0; line-height:0px; }
    p.hidden_p { text-indent:-10000px; overflow:hidden; height:0; font-size:0; line-height:0px; }



/* 공통 */
.bbtn { position:relative; width:100%; height:152px; }

.bbtn_1 { position:absolute; left:21px; top:51px; }
.bbtn_2 { position:absolute; left:340px; top:51px; }
.bbtn_3 { position:absolute; left:440px; top:51px; }
.bbtn_4 { position:absolute; left:540px; top:51px; }
.count { position:absolute; left:110px; top:59px; display:inline-block; color:#1e1e1e; font-size:19px; line-height:30px; }

.clr {clear:both;}
.line {clear:both;margin:10px auto;border-top:1px solid #ddd;margin-bottom:20px;}
.ft_left {float:left;}
.ft_right {float:right;}
.pointer {cursor:pointer}
.blank {padding:10px;}
.paging {text-align:center;padding:10px;}

/* 리스트 */
#m_list ul { list-style-type:none; padding:0; margin:10px 0 20px 0; display:block; }
#m_list li { list-style-type:none; height:40px; line-height:40px; padding:0px 15px 0 15px; border-bottom:1px solid #ddd; cursor:pointer; display:block; clear:both; font-weight:bold; }
#m_list li:first-child { border-top:1px solid #ddd; }
.list_left {float:left;}
.list_left > img { vertical-align:middle; }
.list_right {float:right;text-align:right;width:100px;padding:0;margin:0;color:#999;}

/*게시글 보기*/
#m_view {border-bottom:1px solid #ccc;padding:10px;}
.view_contents {margin:25px 0;}
#m_view p{margin: 10px 0;}

/*페이징*/
.pagelist {margin:0 auto;text-align:center;}
.pagelist .pgPrevNext a {padding:6px 3px;font:bold 12px verdana;color:#555;border:1px solid #ddd;}
.pagelist a {padding:6px 8px;font:bold 12px verdana;color:#555;border:1px solid #eee;margin:0 1px 0 1px;}
.pagelist a:hover {color:#999;border:1px solid #ccc;}
.pagelist .pgNow {padding:6px 8px;font:bold 12px verdana;color:#c81818; border:1px solid #eee;}

/*댓글 목록*/
#m_cmt_list {background:#f5f5f5;margin-bottom:25px;}
#m_cmt_list ul {list-style-type:none;padding:0;margin:0;}
#m_cmt_list li {clear:both;list-style-type:none;padding:10px;margin:0;margin-bottom:15px;}

/*댓글 쓰기*/
#m_cmt_write {border:1px solid #ddd;margin-bottom:25px;}
#m_cmt_write ul {list-style-type:none;padding:0;margin:0;}
#m_cmt_write li {clear:both;list-style-type:none;padding:10px;margin:0;}
#m_cmt_write textarea.input_txt2 {list-style-type:none;width:95%;padding:5px;background:#f5f5f5;border:1px solid #ccc;border-radius:3px;-mz-border-radius:3px;}

/* btn */
#btn {text-align:center; margin:10px;}

.join_btn { font-size:16px; padding:10px 15px; text-align:center; border:3px double #bcbcbc; color:#555555; background:linear-gradient( 180deg, #fff, #eee ); border-radius:6px; }

/* Button Common */
.button,
.button *{ position:relative; margin:0; padding:0; display:-moz-inline-stack; display:inline-block; text-decoration:none !important; border:0; font-size:12px; font-family:Tahoma, Sans-serif; white-space:nowrap; background:url(/m/images/btn.gif) no-repeat; vertical-align:top; overflow:visible; color:#333;}
.button { margin-right:4px;}
.button *{ left:4px; cursor:pointer; _cursor:hand;}

/* Button Size = medium | large | xLarge | small */
.button.medium, .button.medium *{ height:24px; line-height:24px;}
.button.large, .button.large *{ height:30px; line-height:30px;}
.button.xLarge, .button.xLarge *{ height:36px; line-height:36px;}
.button.small, .button.small *{ height:19px; line-height:19px;}
.button.medium { background-position:left 0;}
.button.large { background-position:left -30px;}
.button.xLarge { background-position:left -65px;}
.button.small { background-position:left -106px;}
.button.medium *{ padding:0 10px 0 6px; font-size:12px; background-position:right top;}
.button.large *{ padding:0 10px 0 6px; font-size:16px; background-position:right -30px;}
.button.xLarge *{ padding:0 10px 0 6px; font-size:20px; background-position:right -65px;}
.button.small *{ padding:0 6px 0 2px; font-size:11px; background-position:right -106px;}

/* Button Hover */
.button *:hover,
.button *:active,
.button *:focus{ color:#690;}

/* Button Strong */
.button.strong *{ font-weight:bold !important;}

/* Button Icon Variation */
.button.icon *{ padding-left:20px;}
.button.small.icon *{ padding-left:16px;}
.button.icon span{ width:20px; margin-right:-20px; padding:0 !important;}
.button.medium .check{ background-position:4px -150px;}
.button.large .check{ background-position:4px -146px;}
.button.xLarge .check{ background-position:5px -144px;}
.button.small .check{ background-position:3px -153px;}
.button.medium .add{ background-position:-16px -150px;}
.button.large .add{ background-position:-14px -146px;}
.button.xLarge .add{ background-position:-14px -144px;}
.button.small .add{ background-position:-18px -153px;}
.button.medium .delete{ background-position:-34px -150px;}
.button.large .delete{ background-position:-34px -146px;}
.button.xLarge .delete{ background-position:-34px -144px;}
.button.small .delete{ background-position:-37px -153px;}
.button.medium .calendar{ background-position:-56px -150px;}
.button.large .calendar{ background-position:-56px -146px;}
.button.xLarge .calendar{ background-position:-56px -144px;}
.button.small .calendar{ background-position:-59px -153px;}
.button.medium .refresh{ background-position:-76px -150px;}
.button.large .refresh{ background-position:-76px -146px;}
.button.xLarge .refresh{ background-position:-76px -144px;}
.button.small .refresh{ background-position:-79px -153px;}

/*글작성*/
#m_write {padding:0;margin:20px;border:1px solid #ccc;border-radius:5px;-mz-border-radius:5px;}
#m_write ul {list-style-type:none;padding:15px;margin:0;}
#m_write li {list-style-type:none;padding:3px;margin:0;}
#m_write input.input_txt1 {list-style-type:none;width:95%;padding:5px;background:#f5f5f5;border:1px solid #ccc;border-radius:3px;-mz-border-radius:3px;height:21px;}
#m_write textarea.input_txt2 {list-style-type:none;width:95%;padding:5px;background:#f5f5f5;border:1px solid #ccc;border-radius:3px;-mz-border-radius:3px;}
#m_write input:focus, #m_write textarea:focus {background:#fff;}

/*로그인*/
#m_login {padding:0;margin:80px 20px 40px 20px;border:1px solid #ccc;border-radius:5px;-mz-border-radius:5px;}
#m_login ul {list-style-type:none;padding:15px;margin:0;}
#m_login li {list-style-type:none;padding:3px;margin:0;}
#m_login input.m_input_text {list-style-type:none;width:95%;padding:5px;background:#f5f5f5;border:1px solid #ccc;border-radius:3px;-mz-border-radius:3px;height:21px;}
#m_login input:focus {background:#fff;}

/* 보드 */
.board_content_head p {font-size: 20px; line-height:1.3;}



/* 카피영역 시작 */
a.copy_btn { display:inline-block; text-decoration:none; font-size:18px; color:#fff; font-weight:400; line-height:22px; }
.copy_slash { display:inline-block; font-size:14px; margin:0 15px; color:#787878; line-height:22px; }
p.copy_con { font-size:17px; color:#bbbbbb; font-weight:300; line-height:30px; }
.copy_bar { display:inline-block; margin:0 15px; }
p.copyright { font-size:17px; color:#ffffff; line-height:22px; font-family:"Dotum"; padding:25px 0 20px; }
p.copyright > span { font-weight:bold; }
/* 카피영역 끝 */
#right_fixed { position:fixed; right:20px; bottom:20px; display:inline-block; z-index:90; width:70px; }
#right_fixed > img { float:left; }