@charset "utf-8";
/* Reset */
html,body{margin:0 0 0 0;font-size:15px;line-height:160%;min-height:100%;border-collapse:collapse;background-image:url('/images/body_back.jpg'); background-repeat:repeat-x; background-attachment:scroll;}
p,td{margin:0;font-size:16px;line-height:160%; color:#333}
/* Layout */
.container {margin:0}
.visual{position:relative;z-index:1;overflow:hidden;width:100%;margin:0 0 20px 0}
.body{position:relative;z-index:1}
.header:after,
.body:after{content:"";display:block;clear:both}
.content{padding:0 0 40px 0;zoom:1}
.content>*:first-child{margin-top:0}
.content img{max-width:100%;height:auto}
.mic{position:relative;padding:40px 0 40px 0;zoom:1;width:1100px;margin:0 auto}
.bann{padding:18px 0 0 0;z-index:0;}
.catalo_view{position:absolute;z-index:999;top:15px;right:10px;zoom:1}
.xe-widget-wrapper.aaa_aaa{float:none !important;padding:0px 0 0px 0;width:1100px;margin:0 auto !important}
.bott_line{position:relative;font-size:13px;color:#f4f4f4;padding:5px 0 5px 0}
.bott_line > a{color:#e4e4e4;text-decoration:none}
.bott_line > a:hover{color:#ffffff;font-weight:bold}
.bott_line1{position:relative;font-size:13px;padding:5px 0 5px 0}
.bott_line1 > a{color:#666666;text-decoration:none}
.bott_line1 > a:hover{color:#000000;font-weight:bold}
.menu_1 {font-size:14px;color:rgba(255,255,255,.8);text-align:left;padding:0 0 7px 0 }
.menu_1 > a{color:rgba(255,255,255,.8);text-decoration:none}
.menu_1 > a:hover{color:yellow}
.menu_2 {font-size:12px;padding:0 0 5px 20px;text-align:left}
.menu_2 > a{color:rgba(255,255,255,.5);text-decoration:none}
.menu_2 > a:hover{color:yellow}
#menubar {width: 100%;}
#menubar-menus {width: 1100px; margin: 0 auto; list-style: none; padding: 0; text-align: center; font-size: 0; display: table;}
#menubar-menus > li {height: 40px; display: table-cell; vertical-align: middle; font-size: 24px}
#menubar-menus > li > a { display: table-cell; vertical-align: middle; width: 157px; height: 40px; text-decoration: none; color: #555555;
/* 서브 메뉴 영역이 가로 방향으로 100% 보이는 것을 원치 않을 때 아래 라인을 활성 */
/*position: relative;*/
}
/* #menubar-menus li를 position: relative 처리를 하는 경우에 아래 hover 상태 처리를 주석 처리 할 것. */
/*#menubar-menus li:hover {
background: #FFF;
}*/
#menubar-menus > li > div {
position: absolute; color: #000; left: 0; width: 100%; top: auto; display: none;
padding: 20px 0; z-index: 10;
}
.sul_box {color:#cccccc}
.sul_box a{color:#e4e4e4;text-decoration:none}
.sul_box a:hover{color:#ffffff}
.sul_title {font-size:24px;color:#ffffff;padding:0 0 0 270px}
.bt_box {font-size:18px;color:#ffffff;text-align:center;}
.bt_box a{color:#ffffff;text-decoration:none}
.bt_box a:hover{color:#ffffff;font-weight:bold}
/* .jb-box { width: 100%; height: 500px; overflow: hidden;margin: 0px auto; position: relative;} */
.video-container{position:relative;padding-bottom:45%;height:0;overflow:hidden;}
.video-container video,.video-container object,.video-container embed{position:absolute;top:0;left:0;width:100%;height:auto}
video {position: absolute; width: 100%; overflow: hidden;}
.jb-text { position: absolute; width: 100%; height:100%;background-image:url('/images/pattern.png'); background-attachment:scroll;}
.tp{font-size: 36px; color: rgba(255,255,255,.6); }
.md{font-size: 24px; color: rgba(255,255,255,.6); }
.ow{font-size: 18px; color: rgba(255,255,255,.8);letter-spacing:20px }
.sec_01{width:1100px;margin:0 auto;padding:60px 0 60px 0}
.sec_02{height:500px;background-image:url('/images/main_sec_01.jpg'); background-repeat:no-repeat;background-position: 50% 50%;background-attachment: fixed;}
.song_list{float:left; margin: 3px; width:170px;height:120px;cursor: pointer; background:rgba(255,255,255,.3);border-radius:7px;font-size:13px;line-height:120%;color:#555555}
.song_list a{text-decoration:none;color:#555555}
.song_list a:hover{text-decoration:none;color:#000000}