@charset "UTF-8";
/* CSS Document */

/*----------------------------------------

---------------------------------------- */

.social #main {
    background:url(../images/main_bg_header.gif) no-repeat;
    background-position:top;
    background-color: #fff;
    margin:10px auto 0px auto;
    padding:0px;
    width: 940px;    
}

.social div#area {
    /*margin: 0px 0 0 70px;*/
    /*width: 800px;*/
}
.social div#footer div#area {
    /*margin: 0px 0 0 0px;*/
    /*width: 800px;*/
}

body.social div.subtitle01 {
    background:url(../images/subtitle_bg.jpg) no-repeat;
    margin:0px 10px 10px 10px;
    width:780px;
    height:37px;
    color: #FFFFFF;
    line-height: 35px;
    font-size: 16px;
    font-weight:bold;
    text-indent:20px;
    letter-spacing:2px;
    /*text-align: center;*/
}
body.social .contents_title {
    height: 55px;
    width: 800px;
}

body.social .indent {
    margin-left: 10px;
}
/*----------------------------------------
button 
---------------------------------------- */

body.social div#main div.mypage_btn,
body.social div#main div.receive_btn,
body.social div#main div.make_btn {
    margin: 0px;
    padding: 0px;
    margin: 0 0 0 312px;
    padding: 30px 0 30px;
    text-indent: -99999px;
    background-color:  #fff;
    width: 300px;
}

/*  make_btn */
body.social div#main div.make_btn a {
    background: url(/images/social/make_btn.jpg) no-repeat;
    position: relative;
    display: block;
    width: 300px;
    height: 70px;
}

body.social #main div.make_btn a:hover {
    background-position:     0px -70px;
}

/*  receive_btn */
body.social div#main div.receive_btn {
    width: 147px;
    margin: 0 0 0 390px;
}

body.social div#main div.receive_btn a {
    background: url(/images/social/next_btn07.gif) no-repeat;
    position: relative;
    display: block;
    width: 147px;
    height: 50px;
}

body.social #main div.receive_btn a:hover {
    background-position:     0px -50px;
}

/*  mypage_btn */
body.social div#main div.mypage_btn {
    width: 150px;
    margin: 0 0 0 312px;
    /*margin: 0 0 0 390px;*/
    background-color: transparent;
}

body.social #main div.mypage_btn a {
    background: url(/images/social/mypage_btn.gif) no-repeat;
    position: relative;
    display: block;
    width: 150px;
    height: 50px;
}

body.social div.receive_btn a:hover {
    background-position:     0px -50px;
}

body.social .social_btn {
    margin: 0px;
    padding: 0px;
    text-indent: -99999px;
    background-color:  #fff;    
}

body.social .back_btn  {
    margin: 0;
    background: url(/images/social/back_btn.gif) no-repeat;
    width: 147px;
    height: 50px;
}

body.social .next_btn  {
    margin: 0;
    background: url(/images/social/back_btn.gif) no-repeat;
    width: 147px;
    height: 50px;
}

body.social .sub_btn {
    width: 150px;
    padding: 2px;    
    height: 23px;
}

/*----------------------------------------
---------------------------------------- */
body#my_page div.contents_title {
    background: url(/images/social/form_title01.gif) no-repeat;
}
body#select_sender div.contents_title {
    background: url(/images/social/form_title01.gif) no-repeat;
}
body#user_list div.contents_title {
    background: url(/images/social/form_title02.gif) no-repeat;
}

body#cancel div.contents_title {
    background: url(/images/social/form_title03.gif) no-repeat;
}
/*----------------------------------------
---------------------------------------- */
body.social .number{
    display: block;
    background-color: #f6b302;
    width: 20px;
    height: 20px;
    color: #fff;
    text-align: center;
}
/*----------------------------------------
---------------------------------------- */

body.social div.section {
    width: 100%;
    margin: auto;    
}

/** login user  area */
body.social div.login_user {
  display: block;
  height: 55px;
  padding: 5px;
}
body.social div.login_user div.friend_img{
    position: relative;
    float: left;
}
body.social div.login_user div.friend_name{
    float: left;
    margin: 17px 0 0 15px;
}

/* logout button */
body.social div.logout_btn{
    position: relative;
    float: right;
    margin: 0px 15px 0px 0px;
}

body.social div.logout_btn a {
    background: url(/images/social/logout.jpg) no-repeat;
    position: relative;
    display: block;
    width: 92px;
    height: 40px;
}

body.social div.logout_btn a:hover {
    background-position:     0px -40px;
}

/* event add button */
body.social div.action_btn {
    position: relative;
    float: right;
    margin: -65px 15px 0px 0px;
}

body.social div.action_btn a {
    background: url(/images/social/ivent_btn.gif) no-repeat;
    position: relative;
    display: block;
    width: 120px;
    height: 41px;
}

body.social div.action_btn a:hover {
    background-position:     0px -41px;
}

/* member add button */
body.social div.member_btn {
    position: relative;
    float: right;
    margin: 0px 10px 10px 0px;
}

body.social div.member_btn a {
    background: url(/images/social/add_btn.gif) no-repeat;
    position: relative;
    display: block;
    width: 147px;
    height: 30px;
}

body.social div.member_btn a:hover {
    background-position:     0px -30px;
}

body.social div.section div.action {
    position: relative;
    float: right;
    top: 0px;
    left: 0px;
    margin: -55px 15px 0px 0px;
    width: 100px;
    height: 30px;
    background-color: #ff0000;
    color: #ffffff;
    text-align: center;
    line-height: 25px;
}

body.social div.section div.action a{
    position: relative;    
    color: #ffffff;
}

body.social .section dl{
    width: 95%;
    /*border: 1px solid #000;*/
    height: 150px;
    overflow: hidden;
    overflow-y: auto;
    padding: 2px;
    margin: 0 auto 10px;
}

body.social div.section dt {
    border: 1px solid #000;
    float: left;
    font-weight: bold;
    width: 100px;
    background-color: #cccccc;
}

body.social div.section dd{
    float: left;
    width: 100px;
    border: 1px solid #000;   
}

body.social div.event_list{
    width: 95%;
    height: 150px;
    overflow: hidden;
    overflow-y: auto;
    padding: 2px;
    margin: 0 auto 10px;
}

body.social table.social_tab{
    width: 95%
}

body.social table.social_tab th,
body.social table.social_tab td{
    border: 1px solid #000;
    padding: 5px;
}

body.social table.social_tab th{
    border: 1px solid #000;
    background-color: #cccccc;
    width: 80px;
    font-weight: bold;
}
body.social table.social_tab td{
    border: 1px solid #000;
    width: 200px;
}

body.social table.social_tab th.numbering{
    border: 0;
    width: 20px;
    background-color: #fff;        
}


/*----------------------------------------
---------------------------------------- */
body.social div#main h3{
    margin: 20px 0 20px 10px  !important;
    padding: 10px 0 10px 20px;
    font-size: 1.2em;
    font-weight: bold;
    border-left: solid 10px #000;
    border-bottom: solid 1px #000;
    width: 94%;
}

body.social p{
    margin: 0 0 0 10px;
    padding: 5px 0 5px 0;
}

/*----------------------------------------
---------------------------------------- */

body.social ul.list {
    position:relative;
    height: 300px;
    overflow: hidden;
    overflow-y: auto;
    margin: 0 0 0 10px;
    border: solid 2px #f6b302;
    padding: 5px;
    width: 95%;
}

body.social dl {
    margin: 20px 0 20px 10px;    
}

/*----------------------------------------

---------------------------------------- */
body.social .user_info{
    position: relative;
    float: left;
    border: 1px solid #000000;
    height: 80px;
    width: 45%;
    margin: 0px 5px 5px 10px;
    padding: 5px;    
}

body.social .user_info div.friend_checkbox{
    float: left;
    height: 100%;    
    width: 20px;
    text-align: center;
}

body.social .user_info div.friend_checkbox .friend_check_box{
    height: 100%;    
}

body.social .user_info div.friend_img{
    float: left;
    height: 66px;
}

body.social .user_info div.friend_name {
    width: 120px;
    display:block;
    float: left;
}
body.social div.user_info div.deco_img{
    float: right;
    margin: 15px 0px 0px 0px;
}

body.social .user_info ul {
    height: 78px;    
    width: 242px;
}

body.social .user_info ul.ul_row2  {
    margin: 5px 0px 0px 0px;
}
body.social .user_info ul.ul_row2 li {
    padding: 6px 0 6px 0; 
}

body.social .user_info ul.ul_row3  {
    margin: 0px 0px 0px 0px;
}

body.social .user_info ul.ul_row3 li {
    padding: 2px 0 2px 0; 
}

body.social .fb_info {
    float: left;    
    width:  120px;
}

body.social .decoration_info {
    /*border: 1px solid black;*/
    float: left;
    width: 250px;
}
body.social .decoration_info span{
    float: left;
}


body.social div.button_area {
    /*width: 800px;*/
    height: 50px;
    padding: 10px;
    display: block;
    margin: 0 auto 0 -10px;
}

body.social div.button_area div.btn_layout_1 {
    width: 147px;
    margin: 0 auto;
}

body.social div.button_area div.btn_layout_2 {
    width: 304px;
    padding: 10px;
    margin: 0 auto;
}
body.social div.button_area div.btn_layout_2 .right_btn{
    margin: 0 0 0 10px;
}

/*----------------------------------------
select_sender
---------------------------------------- */


/*----------------------------------------
select_sender
---------------------------------------- */
body#select_sender .incsearch{
    margin: 0 0 0 10px;
}

/*----------------------------------------

---------------------------------------- */
body#create_event .next_btn {
    background: url(/images/social/next_btn01.gif) no-repeat;  
}
body#create_event .event_name {
    width: 790px;
}
/*----------------------------------------
select_member
---------------------------------------- */
body#select_member .incsearch{
    margin: 0 0 0 10px;
}
body#select_member dl {
    
}
body#select_member dl dt {
    float: left;
    padding: 0 10px;
}
body#select_member dl dd {
    
}
body#select_member .send_message {
    width: 770px;
}
body#select_member .next_btn {
    background: url(/images/social/next_btn02.gif) no-repeat;  
}
/*----------------------------------------
member_request
---------------------------------------- */
body#member_request .next_btn {
    background: url(/images/social/next_btn03.gif) no-repeat;  
}

body#member_request ul.list {
    position: relative;
    height: auto;
    /*overflow: hidden;*/
    /*overflow-y: auto;*/
    margin: 0 0 0 10px;
    padding: 5px;
    width: 95%;    
    border: none;
}
body#member_request .sender_message_view {
    display: block;
    width: 765px;
    margin: 30px 0 0 10px;
    height: 100px;
    padding: 5px;
    border: 1px solid #cccccc;
}

/*----------------------------------------
member_add
---------------------------------------- */
body#member_add .incsearch{
    margin: 0 0 0 10px;
}
body#member_add dl {
    
}
body#member_add dl dt {
    float: left;
    padding: 0 10px;
}
body#member_add dl dd {
    
}
body#member_add .send_message {
    width: 770px;
}
body#member_add .next_btn {
    background: url(/images/social/next_btn03.gif) no-repeat;  
}
/*----------------------------------------
user_list
---------------------------------------- */
body#cancel,
body#user_list{

}
body#cancel div#user_list_header,
body#user_list div#user_list_header {
    margin: 0 0 0 10px;
    display: block; 
    height: 100px;
    width: 98%; 
    padding: 5px 0 5px 0;
}
body#cancel div.login_user,
body#user_list div.login_user {
    float: right; 
    display: block;
    border: 1px solid #000;
    margin: -15px 0px 0px 0px;
    height: 95px;
    width: 200px;
}
body#cancel, div.login_user img.icon,
body#user_list div.login_user img.icon {
    margin: 0;
    float: left;
}
body#cancel div.login_user p,
body#user_list div.login_user p {
    margin: 0;       
}
body#cancel div.login_user .friend_img,
body#user_list div.login_user .friend_img {
    clear: both;
    margin: 10px 0 ;        
}

body#cancel div.fb_info ,
body#user_list div.fb_info {
    margin: 10px 0px 0px 10px;
}

body#cancel  div.fb_info div.friend_name ,
body#user_list div.fb_info div.friend_name {
    margin: -15px 0px 0px 0px;
}

body#cancel div.decoration_info ,
body#user_list div.decoration_info {
    /*border: 1px solid black;*/
    margin: 0px 0px 0px 25px;
    width: 200px;
    height: 102px;
    display: block;
}
body#cancel div.decoration_info span ,
body#user_list div.decoration_info span {
    margin: 30px 0px 0px -25px;
}

body#cancel table.social_tab,
body#user_list table.social_tab{
    float: left;
    width: 500px;
}
body#cancel table.social_tab th,
body#user_list table.social_tab th{
    width: 100px;
    height: 50px;
}
body#cancel table.social_tab td,
body#user_list table.social_tab td{
    width: 300px;
    vertical-align: middle;
}
body#cancel table.social_tab td .sub_btn,
body#user_list table.social_tab td .sub_btn{
    /*margin: 0px 0px 0px 45px;*/
}
body#cancel table.social_tab td.event_name_area,
body#user_list table.social_tab td.event_name_area{
    width: auto;
    border-right-color: transparent;   
}

body#cancel table.social_tab td.event_btn_area,
body#user_list table.social_tab td.event_btn_area{
    /*width: auto;*/
    width: 161px;
    border-left-color: transparent;
}


body#user_list .next_btn {
    background: url(/images/social/next_btn04.gif) no-repeat;  
}
/*----------------------------------------
user_list
---------------------------------------- */
body#cancel {

}
body#cancel .next_btn {
    background: url(/images/social/next_btn05.gif) no-repeat;  
}

/*----------------------------------------
reminder
---------------------------------------- */
body#reminder .next_btn {
    background: url(/images/social/next_btn06.gif) no-repeat;  
}
/*----------------------------------------
---------------------------------------- */
.form05 div.social_receiver_cneter {
    width: 190px; 
    height: 70px; 
    margin: 0 auto; 
    text-align: center; 
    display: block;
}

.form02 button.back_btn {
    background: url(../images/back_btn03.gif) no-repeat;
}

/*
*
*
*
*/
body.social table.data{
    margin:20px 0px 20px 70px;
    padding:0px;
    width:800px;
    border-top: 1px solid #666666;
    border-right: 1px solid #666666;
    border-left: 1px solid #666666;
}

body.social table.data th{
    background:url(../images/form_th_bg.gif) repeat-x;
    background-color:#000000;
    background-position:top;
    padding:10px;
    width:150px;
    color: #fff;
    line-height: 18px;
    font-size: 12px;
    font-weight:bold;
    border-right: 1px solid #666666;
    border-bottom: 1px solid #666666;
}

body.social table.data td {
    padding:10px;
    color: #444;
    line-height: 18px;
    font-size: 12px;
    border-right: 1px solid #666666;
    border-bottom: 1px solid #666666;
}


/*----------------------------------------
banner
---------------------------------------- */
body.social div#main div.banner{
    margin: 0px;
    padding: 0px;
    margin: 0 0 0 350px;
    padding: 10px 0 30px;
    background-color:  #fff;
    width: 220px;
}


/*----------------------------------------
sns
---------------------------------------- */

body.social div#main div.sns ul {
    text-align: center;
    margin:10px auto;
    margin:0 0 0 310px;
}

body.social div#main div.sns li {
    float: left;
    padding: 0 5px ;
    margin: 0;
}