@charset "utf-8";

/*リセット*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, input, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, object, embed
{
margin: 0px; 
padding: 0px; 
border: 0px; 
outline: 0px; 
}

dl, dt, dd, ol, ul, li {
list-style:none;
}

img {
border: 0;
}

li {
list-style: none;
}

input,
button,
textarea,
select,
optgroup,
option {
font-family: inherit;
font-size: inherit;
font-style: inherit;
font-weight: inherit;
}
b{ font-weight:bold}

/***************************************
 * Global
 ***************************************/

* {
  padding:0;
  margin: 0;
}

html {
  height: 100%;
}

body {
  font-family: 'Lucida Grande','Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
  font-size: 14px;
  /* for IE6/7 */
  *font-size:small;
  /* for IE Quirks Mode */
  *font:x-small;
  line-height: 1.5;
  color: #333; 
  width:100%;
  height:100%;
}

a:hover{ opacity:0.7}




/***************************************
 * Common
 ***************************************/


.clearfix:after {content: "."; display: block; clear: both; height: 0; visibility: hidden;}
.clearfix { min-height: 1px;}
* html .clearfix { height: 1px; /*¥*//*/ height: auto; overflow: hidden;/**/}

a {
  color: #2a6798;
  text-decoration:none;
}

img {
  vertical-align: bottom;
}

a:hover  { 
  text-decoration: underline;
}

input, select, textarea {
  font-size: 100%;
}


.fl_left{ float:left}
.fl_right{ float:right}

.clear{ clear:both}

p{ padding-bottom:10px}

/***************************************
 * Layout
 ***************************************/

/*==================
 * RINE
 */

.background-hack {
    z-index                 : -1;
    background-color        : #999;
    background-image        : url('../images/back.jpg');
    background-repeat       : no-repeat;
    background-size         : auto 100%;
    position                : fixed;
    top                     : 0;
    left                    : 0;
    right                   : 0;
    bottom                  : 0;
}

#rinetitle {
  height:42px;
  background: #424c5b;
  border-bottom:1px solid #515a68;
  position:relative;
 }
#rinetitle_sm {
  display:none;
 }


#rinetitle  h1 {
  width: 43px;
  height: 19px;
  background:url(../images/logo.png) no-repeat center 0 ;
  text-indent: -10000px;
  position:absolute;
  top:10px;
  left:180px;
}

#rineheadOut{ height:45px; position:relative; z-index:500;}
#rinehead{ background: #424c5b; height:45px; position:fixed; width:100%; left:0; top:0; z-index:500;}
#rinehead h2{ font-size:16px; padding-top:10px; text-align:center; color:white;  font-weight:normal;}
#rinehead a.back{ display:block; text-indent:-9999px; position:absolute; background:url(../images/back_arrow.png) no-repeat; width:15px; height:15px; background-size:100%; left:10px; bottom:15px}
#rinehead a.back_rine{ display:block; text-indent:-9999px; position:absolute; background:url(../images/back_rine_arrow.png) no-repeat; width:15px; height:15px; background-size:100%; right:10px; bottom:15px}
#rinehead a.clap{ display:block; position:absolute; left:10px; bottom:10px; padding:5px 10px; background:white; color:#555; text-align:center; font-size:11px; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px;}
#talkbox{ width:100%; height:100%;}
/*#talkbox::-webkit-scrollbar {
   display:none
}*/

#talkroom{ padding:20px;}
#talkroom h3{ border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; width:200px; margin:0 auto 10px auto; padding:2px 0; font-size:12px; font-weight:normal; background:rgba(255,255,255,0.5); text-align:center}
#talkroom img.ph{ width:265px; padding-bottom:10px}
#talkroom img.ic{ width:43px; height:43px; border-radius:43px; -webkit-border-radius:43px; -moz-border-radius:43px; float:left}
#talkroom .box{ width:265px; float:left; margin-bottom:20px; padding-left:10px}
#talkroom .name{ float:left; color:#FFF; font-size:14px}
#talkroom .date{ float:right; color:#FFF; font-size:12px}

#talkroom .arrow_box {
position: relative;
background: #ffffff;
padding:10px;
border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px;
width:245px;
clear:both;
font-size:13px
}
#talkroom .arrow_box p{ padding-bottom:0px}
#talkroom .arrow_box:after {
right: 100%;
top: 15px;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
border-color: rgba(255, 255, 255, 0);
border-right-color: #ffffff;
border-width: 5px;
margin-top: -5px;
}
/*本人右吹出し*/
#talkroom .makoto img.ic{ width:43px; height:43px; border-radius:43px; -webkit-border-radius:43px; -moz-border-radius:43px; float:right}
#talkroom .makoto .box{ width:265px; float:right; margin-bottom:20px; padding-right:10px}
#talkroom  .makoto.name{ float:left; color:#FFF; font-size:14px}
#talkroom  .makoto.date{ float:right; color:#FFF; font-size:12px}

#talkroom .makoto .arrow_box {
position: relative;
background: #bde95d;
padding:10px;
border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px;
width:245px;
clear:both;
font-size:13px
}
#talkroom .makoto .arrow_box p{ padding-bottom:0px}
#talkroom .makoto .arrow_box:after {
left: 100%;
top: 15px;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
border-color: rgba(189,233, 93, 0);
border-left-color: #bde95d;
border-width: 5px;
margin-top: -5px;
}

.add{ border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; width:200px; margin:0 auto 10px auto; padding:2px 0; font-size:12px; font-weight:normal; background:rgba(255,255,255,0.5); text-align:center}

div.thanks{ width:100%; height:100%; background:white}
div.thanks h3{ background:#eee; padding:2px 5px; font-size:12px; color:#555}
div.thanks ul{ width:100%; background:white}
div.thanks ul li a{ padding:7px 10px; display:block; border-bottom:1px solid #ccc; font-size:13px; color:#444}
div.thanks ul li a:hover{ text-decoration:none; background:#eee}
div.thanks p{ padding:10px; font-size:12px}