/*
가이드 명칭 : YG History CSS 가이드
가이드 목적 : -------------------------------------------------------------
가이드 내용 : 사이트 레이아웃
최초 제작자 : 박진규 (arigato9@gmail.com)
최초 제작일 : 2009.07.09
최종 수정자 : 박진규
최종 수정일 : 2009.07.09
수정 / 배포 : 담당자 문의 후 수정 가능. 재배포 절대 불가
*/

@charset "utf-8";

/* dafault */
*{ margin:0; padding:0; }
body, form, div,p,h1,h2,h3,h4,h5,h6,dl,dt,dd,ul,ol,li,pre,fieldset,input,blockquote,th,td{padding:0; margin:0; word-break:break-all;}
html, body{height:100%; margin:0; padding:0;}
body{color:#666666; font-size:12px; font-family:dotum,tahoma,sans-serif; text-align:left; letter-spacing:0px; line-height:15px;}
input, textarea, select{font-size:12px; font-family:dotum,tahoma,sans-serif; margin:0; padding:0;}
img{border:0; vertical-align:middle;}
a{color:#666666; text-decoration:none; onfocus:blur;}
a:link{color:#666666; text-decoration:none; onfocus:blur;}
a:hover{color:#c90000; text-decoration:underline; onfocus:blur;}
ul,ol,ul,dl{list-style: none;}
table{border-collapse:collapse;}
em, cite, address, dfn, var{font-style:normal;}
fieldset, blockquote{border:none;}
input{padding:3px 5px 3px 5px; color:#666666; border:1px solid #dedede;}
input.checkbox{width:14px; height:14px; border:0;}
input.radio{width:14px; height:14px; border:0;}
.textarea{border:1px solid #dedede;line-height:175%; }

/* body */
#ygmusicbody{min-width:1240px; min-height:810px; background-color:#000;}
#flashcontent{width:100%; height:100%; text-align:left;}
#flash_intall{display:block; position:relative; top:150px; margin-right:auto; margin:auto; width:430px; height:430px;}

/* popup_payment */
#body_popup{width:560px; background:url('../images/bg_popup.gif') repeat-x; padding:20px 0; margin:0 auto;}
#body_popup2{width:380px; background:url('../images/bg_popup.gif') repeat-x; padding:20px 0; margin:0 auto;}
#body_popup3{width:700px; background:url('../images/bg_popup.gif') repeat-x; padding:20px 0; margin:0 auto;}
#body_popup4{width:100%-20; height:100%; min-height:400px; overflow-x:hidden; overflow-y:hidden; background:url('../images/bg_popup.gif') repeat-x; padding:20px 0; margin:0 auto;}

#tit_popup{height:23px; border-bottom:2px solid #d92026; background:url('../images/bg_tit_popup.gif') no-repeat top right; margin-bottom:20px;}
#tit_popup2{height:23px; border-bottom:1px solid #c5c5c5; background:url('../images/bg_tit_popup.gif') no-repeat top right; margin-bottom:20px;}
#tit_popup3{clear:both; height:23px; border-bottom:1px solid #c5c5c5; background:none; margin-bottom:5px;}

h2.tab_on{background:url('../images/bg_tab_mymusic.gif') no-repeat; position:relative; _top:1px; width:140px; height:19px; padding-top:5px; text-align:center; color:#666; font-size:9pt; font-weight:bold; margin-right:2px; float:left; cursor:pointer;}
h2.tab_off{background:url('../images/bg_tab_mymusic_off.gif') no-repeat; position:relative; _top:1px; width:140px; height:19px; padding-top:5px; text-align:center; color:#666; font-size:9pt; font-weight:normal; margin-right:2px; float:left; cursor:pointer;}
h2.tab_just{background:url('../images/bg_tab_mymusic.gif') no-repeat; position:relative; _top:1px; width:140px; height:19px; padding-top:5px; text-align:center; color:#666; font-size:9pt; font-weight:bold; margin-right:2px; float:left;}
h2.tit_payment{background:url('../images/title_payment.gif') no-repeat left top; text-indent:-9999px;}
h2.tit_payment_ok{background:url('../images/title_payment_ok.gif') no-repeat left top; text-indent:-9999px;}
h2.tit_login{background:url('../images/title_login.gif') no-repeat left top; text-indent:-9999px;}
h2.tit_helpdesk{background:url('../images/title_helpdesk.gif') no-repeat left top; text-indent:-9999px;}
h2.tit_error{background:url('../images/title_error.gif') no-repeat left top; text-indent:-9999px;}
h2.tit_about{background:url('../images/title_about.gif') no-repeat left top; text-indent:-9999px;}
h2.tit_ygaccount{background:url('../images/tit_ygaccount.gif') no-repeat left top; text-indent:-9999px;}
.caution_box{clear:both; background:url('../images/bg_caution_box.gif') no-repeat; padding:12px 12px 0 12px;}
.caution_box_bottom{background:url('../images/bg_caution_box.gif') no-repeat left bottom; height:12px;}
.caution_box li{background:url('../images/ico_caution.gif') no-repeat 1px 1px; padding-left:20px;}
.table_comment{clear:both; font-size:8pt; color:#333; margin-bottom:7px;}
.table_comment strong{color:#d92026;}

.tablestyle01_head{width:560px; height:23px; border:1px solid #4b4b4b; background:url('../images/bg_tablehead.gif') repeat-x;}
.tablestyle01_head tr td{text-align:center; font-size:8pt; color:#fff; padding-top:3px; letter-spacing:-1px;}
.tablestyle01_head tr td.col1{width:40px;}
.tablestyle01_head tr td.col2{}
.tablestyle01_head tr td.col3{width:60px;}
.tablestyle01_head tr td.col4{width:90px;}
.tablestyle01_head tr td.col5{width:50px;}
.tablestyle01_head tr td.col6{width:100px;}
.tablestyle01_head tr td.col7{width:25px;}
.tablestyle01_head tr td.col8{width:105px;}
.tablestyle01_head tr td.col9{width:300px;}
.tablestyle01_head tr td.col10{width:80px;}

.tablestyle01_body{width:560px;}
.tablestyle01_body tr td{height:25px; #height:21px; font-size:9pt; color:#666; padding-top:3px; border-bottom:1px solid #e1e1e1; overflow:hidden;}
.tablestyle02_body{width:700px;}
.tablestyle02_body tr td{height:25px; #height:21px; font-size:9pt; color:#666; padding-top:3px; border-bottom:1px solid #e1e1e1; overflow:hidden;}
.tablestyle03_body{width:700px; border-bottom:1px solid #e1e1e1;}
.tablestyle03_body tr td{height:24px; #height:20px; font-size:8pt; color:#666; padding-top:3px; border-bottom:1px solid #e1e1e1; overflow:hidden;}
.tablestyle03_body tr td input{height:9px;}
.tablestyle03_body tr td.col1{background-color:#fcfcfc; border-right:1px solid #e1e1e1; text-align:center;}
.tablestyle03_body tr td.col2{padding-left:10px; text-align:left; line-height:175%;}
.tablestyle03_body tr td.br1{border-right:1px solid #e1e1e1;}

#total{margin:20px auto; text-align:center;font-size:8pt; color:#333; }
#total strong{padding-right:35px;}
#total span{font-size:11pt; font-weight:bold; color:#d92026;}

#payselect_box{background-color:#fcfcfc; border:1px solid #e1e1e1; width:536; height:94px; padding:12px 12px 0 12px;}
.payselect_box_height1{height:110px;}
.payselect_box_height2{height:70px;}
#payselect_box li{background:url('../images/bul_arrow.gif') no-repeat 1px 3px; padding-left:18px; margin-bottom:12px; line-height:150%;}
#payselect_box li label, #payselect_box li span{margin-right:25px;}
#payselect_box input.ygaccount_mg{margin-left:77px; margin-top:7px;}
#ygaccount_tooltip{position:absolute; top:500px; left:220px; display:none; width:250px; background-color:#fffceb; border:2px solid #c5c5c5; z-index:999; padding:5px; font-size:8pt;}
#ygaccount_tooltip a{float:right;}
#ygaccount_tooltip div{padding:1px 10px 7px 10px;}

/* overflow */
.overflownism{overflow-y:auto; overflow-x:hidden; width:560px; height:240px; padding:0; scrollbar-3dlight-color:#e1e1e1; scrollbar-arrow-color:#cc0000; scrollbar-base-color:#fff; scrollbar-darkshadow-color:#fff; scrollbar-face-color:#f2f2f2; scrollbar-highlight-color:#fff; scrollbar-shadow-color:#e1e1e1; }
.overflownism2{overflow-y:auto; overflow-x:hidden; width:700px; height:290px; padding:0; scrollbar-3dlight-color:#e1e1e1; scrollbar-arrow-color:#cc0000; scrollbar-base-color:#fff; scrollbar-darkshadow-color:#fff; scrollbar-face-color:#f2f2f2; scrollbar-highlight-color:#fff; scrollbar-shadow-color:#e1e1e1; border-bottom:1px solid #f4f4f4;}
.overflownism3{overflow-y:auto; overflow-x:hidden; width:700px; height:140px; padding:0; scrollbar-3dlight-color:#e1e1e1; scrollbar-arrow-color:#cc0000; scrollbar-base-color:#fff; scrollbar-darkshadow-color:#fff; scrollbar-face-color:#f2f2f2; scrollbar-highlight-color:#fff; scrollbar-shadow-color:#e1e1e1; border-bottom:1px solid #f4f4f4;}

/* faqtoggle */
.faqgroup{padding:0;}
.faqgroup dt{width:700px; height:16px; padding-top:5px; padding-bottom:7px; border-bottom:1px solid #e1e1e1; line-height:150%;}
.faqgroup dd{width:660px; padding:6px 20px; background-color:#fcfcfc; border-bottom:1px solid #e1e1e1; line-height:150%;}

/* login popup */
#layer_login_box{margin:30px auto; width:290px; height:85px;}
#layer_login_input{clear:both; width:165px; height:55px; float:left; margin-right:10px;}
#layer_login_input_id{background-color:#f6f6f6; background:url('../images/bg_login_id.gif') no-repeat left top; width:155px; border-color:#e8e8e8; height:14px;}
#layer_login_input_pw{background-color:#f6f6f6; background:url('../images/bg_login_id.gif') no-repeat 0 -32px; width:155px; margin-top:9px; border-color:#e8e8e8; height:14px;}
.layer_login_button{width:90px; height:55px; float:left;}
.layer_login_button img{cursor:pointer;}
#layer_bottom{width:190px; text-align:center; float:center; }
.layer_findidpw{width:104px; height:14px; float:left; margin-right:30px; padding-top:20px;}
.layer_join{width:42px; height:14px; float:left; padding-top:20px;}

/* replyStuff */
#replycontent{position:absolute; top:50%; left:50%; width:672px; margin-top:-50px; margin-left:-590px; }
#point{width:600px; height:15px; float:right; padding-right:5px;}
#star{position:relative; width:88px; float:right; height:15px; text-indent:-9999px;}
.star5{background:url('/images/bg_point.gif') no-repeat 0 0; }
.star4{background:url('/images/bg_point.gif') no-repeat 0 -50px;}
.star3{background:url('/images/bg_point.gif') no-repeat 0 -100px;} 
.star2{background:url('/images/bg_point.gif') no-repeat 0 -150px;}
.star1{background:url('/images/bg_point.gif') no-repeat 0 -200px;}
.star0{background:url('/images/bg_point.gif') no-repeat 0 -250px;}
#total_score{font-weight:bold; color:#ff0000; width:30px; float:right; height:15px;}
#total_vote{color:#797979; font-size:8pt; float:right; height:15px;}
#total_vote spab{color:#565656; font-size:8pt;}
#input_box{position:relavtive; width:662px; height:35px; border-bottom:1px solid #b9b9b9; padding:15px 5px 13px 5px; margin-top:20px;}
#input_star{position:relative; width:90px; float:left; height:20px; background:url('/images/bg_point.gif') no-repeat 0 0; cursor:pointer;}
#input_star span{position:absolute; top:20px; left:2px; width:90px; font-size:8pt; letter-spacing:-2px; display:block;}
#star_unit1{position:absolute; top:0; left:0; background:none; width:17px; height:15px;}
#star_unit2{position:absolute; top:0; left:17px; background:none; width:17px; height:15px;}
#star_unit3{position:absolute; top:0; left:34px; background:none; width:17px; height:15px;}
#star_unit4{position:absolute; top:0; left:51px; background:none; width:17px; height:15px;}
#star_unit5{position:absolute; top:0; left:68px; background:none; width:17px; height:15px;}
#input_textarea{float:left; width:510px; height:35px;}
#input_textarea textarea{width:502px; height:27px; padding:3px; border-top:1px solid #a6a6a6; border-left:1px solid #a6a6a6; border-right:1px solid #d8d8d8; border-bottom:1px solid #d8d8d8; color:#666666;}
#input_submit{float:left; width:55px;  height:35px; margin-left:5px;}
#replytable td{vertical-align:top;}
#replytable td.col1{width:400px; padding:6px 15px 6px 100px; color:#666666; font-size:8pt; border-bottom:1px solid #e5e6e6;}
#replytable td.col2{width:60px; padding:6px 10px 6px 0; color:#666666; font-size:7pt; border-bottom:1px solid #e5e6e6; font-family:'tahoma'; overflow:hidden; }
#replytable td.col3{width:80px; padding:6px 7px 6px 0; color:#abacab; font-size:7pt; border-bottom:1px solid #e5e6e6; font-family:'tahoma';}
.star2_5{background:url('/images/bg_point.gif') no-repeat 5px 7px;}
.star2_4{background:url('/images/bg_point.gif') no-repeat 5px -43px;}
.star2_3{background:url('/images/bg_point.gif') no-repeat 5px -93px;}
.star2_2{background:url('/images/bg_point.gif') no-repeat 5px -143px;}
.star2_1{background:url('/images/bg_point.gif') no-repeat 5px -193px;}
.star2_0{background:url('/images/bg_point.gif') no-repeat 5px -243px;}

/* yg account */
#pay_comment_account{display:none; height:100px; background:url('../images/bg_pay_comment_account.gif') no-repeat center; text-indent:-9999px;}
#pay_comment_card{display:none; height:100px; background:url('../images/bg_pay_comment_card.gif') no-repeat center; text-indent:-9999px;}
#pay_comment_mobie{display:none; height:100px; background:url('../images/bg_pay_comment_mobile.gif') no-repeat center; text-indent:-9999px;}
#bg_pay_result{margin-top:90px; height:50px; background:url('../images/bg_pay_result.gif') no-repeat center; text-indent:-9999px;}
#bg_pay_result_account{height:100px; background:url('../images/bg_pay_result_account.gif') no-repeat center; text-indent:-9999px;}

/* popup_close_cookie */
.closepop{text-align:center; padding-top:15px; font-size:8pt;}
.closepop input.checkbox{border:0;}

/* flvplay */
#bkpanel{position:absolute; top:0; left:0; width:50px; height:50px; background-color:#000; filter:alpha(opacity=60); opacity:0.6;}
#mvplayer{position:absolute; top:0; left:0; width:777px; height:457px; background:url('/images/bg_loading.gif') no-repeat 380px 220px;}

/* pagin */
.paging{position:relative; clear:both; padding:5px 0 20px 0; text-align:center;}
.paging a, .paging strong{position:relative; display:inline-block; margin-right:1px; padding:3px 3px 5px 3px; color:#aaaaaa; text-decoration:none; border:1px solid #fff; line-height:normal; font:bold 13px Verdana; }
.paging strong{color:#d92026 !important; }
.paging a:hover{background-color:#d92026; text-decoration:none; border:1px solid #aaaaaa; color:#fff;}
.paging .pre, .paging .next{font-weight:normal; display:inline-block; color:#565656; _position:relative; _top:-1px; font:12px 돋음, Dotum; }
.paging .pre{margin-right:2px; padding:7px 6px 3px 6px;}
.paging .next{margin-left:2px; padding:7px 6px 3px 6px;}
.paging .pre img, .paging .next img{position:relative; top:-2px;}
.paging .pre:hover, .paging .next:hover{color:#333333; background:none; border:1px solid #aaaaaa;}

.paging_span{position:relative; display:inline-block; margin-right:1px; padding:3px 3px 5px 3px; color:#aaaaaa; text-decoration:none; border:1px solid #fff; line-height:normal; font:bold 13px Verdana; }
.paging_span:hover{background-color:#d92026; text-decoration:none; border:1px solid #aaaaaa; color:#fff;}

/* error page n bridgeStuff */
.error1{position:absolute; left:50%; top:50%; width:500px; height:200px; background:url('../images/bg_error1.gif') no-repeat; margin-top:-100px; margin-left:-250px; text-indent:-9999px;}
.error2{position:absolute; left:50%; top:50%; width:500px; height:200px; background:url('../images/bg_error2.gif') no-repeat; margin-top:-100px; margin-left:-250px; text-indent:-9999px;}
.payment_ok{position:absolute; left:50%; top:50%; width:500px; height:200px; background:url('../images/bg_payment_ok.gif') no-repeat; margin-top:-100px; margin-left:-250px; text-indent:-9999px;}

/* inputStuffs */
input.radio{border:none; padding:0;}
input.checkbox{border:0; padding:0;}

/* buttonStuffs */
.buttonstuff01{position:relative; float:left; left:50%; clear:both; text-align:center; margin-top:20px; margin-bottom:20px; margin-left:-70px; _margin-left:-70px;}
.buttonstuff02{clear:both; text-align:center; margin-top:10px; }
a.ico_delete{width:10px; display:block; text-indent:-9999px; background:url('../images/ico_delete.gif') no-repeat 0 2px;}
a.btn_pay{width:60px; height:18px; display:block; float:left; text-indent:-9999px; background:url('../images/btn_pay.gif') no-repeat;}
a.btn_pay02{width:60px; height:18px; display:block; text-indent:-9999px; background:url('../images/btn_pay02.gif') no-repeat;}
a.btn_cancel{width:33px; height:18px; display:block; float:left; text-indent:-9999px; background:url('../images/btn_cancel.gif') no-repeat;}
a.btn_delete_all{width:60px; height:18px; display:block; float:left; text-indent:-9999px; background:url('../images/btn_delete_all.gif') no-repeat;}
a.btn_delete{width:60px; height:18px; display:block; float:left; text-indent:-9999px; background:url('../images/btn_delete.gif') no-repeat;}
a.btn_download_all{width:95px; height:18px; display:block; float:right; text-indent:-9999px; background:url('../images/btn_download_all.gif') no-repeat;}
a.btn_download{width:95px; height:18px; display:block; float:right; text-indent:-9999px; background:url('../images/btn_download.gif') no-repeat;}
a.btn_pay_all{width:72px; height:18px; display:block; float:right; text-indent:-9999px; background:url('../images/btn_pay_all.gif') no-repeat;}
a.btn_pay_select{width:72px; height:18px; display:block; float:right; text-indent:-9999px; background:url('../images/btn_pay_select.gif') no-repeat;}
a.btn_ok{width:33px; height:18px; display:block; float:left; text-indent:-9999px; background:url('../images/btn_ok.gif') no-repeat;}
a.btn_list{width:33px; height:18px; display:block; float:left; text-indent:-9999px; background:url('../images/btn_list.gif') no-repeat;}
a.btn_gomymusic{display:block; position:absolute; left:50%; top:50%; width:95px; height:20px; cursor:pointer; text-indent:-9999px; margin-left:-45px; margin-top:17px;}
a.btn_close{display:block; position:absolute; left:50%; top:50%; width:33px; height:20px; cursor:pointer; text-indent:-9999px; margin-left:60px; margin-top:17px;}
a.btn_fill_account{width:95px; height:18px; display:block; text-indent:-9999px; background:url('../images/btn_fill_account02.gif') no-repeat;}
a.btn_view_account02{width:105px; height:18px; display:block; text-indent:-9999px; background:url('../images/btn_view_account02.gif') no-repeat;}

/* align */
.centerism{margin-right:auto; margin-left:auto;}

/* margin */
.mt1{margin-top:20px;}
.mt2{margin-top:10px;}
.mr1{margin-right:10px;}
.mr2{margin-right:30px;}
.mb1{margin-bottom:30px;}
.mb2{margin-bottom:10px;}
.mb3{margin-bottom:20px;}

/* padding */
.pt1{padding-top:12px;}
.pr1{padding-right:15px;}
.pr2{padding-right:10px;}
.pb1{padding-bottom:12px;}

/* borderline */
.line01{border-bottom:1px dashed #e1e1e1;}

/* textcolor */
.color01{color:#d92026;}
.color02{color:#c6c6c6;}


/* submit 버튼 현진 추가*/
    input.img {
        border: none;
        padding: 0;
    }
    input.btn_ok{width:33px; height:18px; display:block; float:left; text-indent:-9999px; no-repeat;}/*위에서 배껴옴 a.btn_ok */
    input.btn_pay{width:60px; height:18px; display:block; float:left; text-indent:-9999px; no-repeat;}
