@charset"utf-8";
/*Keen連絡ボード*/
/* ==============================================*/
/*                   　　　 役物　　                    */
/* ==============================================*/
.red{
 color:#ff0000;
}
.fon_b{
 font-weight:bold;
}
.cr{
 clear:both;
}
.width100{
 width:100%;
}
.fon_80{
 font-size:80%;
}
.dot_bordeer01{
 width:100%;
 height:4px;
 border-bottom:1px dotted #898989;
 margin-bottom:4px;
}
.title01{
 width:100%;
 overflow:hidden;
 padding:2px 0px;
 border-bottom:1px dotted #898989;
}
.tit03{
 width:100%;
 padding:2px 6px;
 line-height:20px;
 overflow:hidden;
 background:#231815;
 font-size:80%;
 font-weight:bold;
 color:#fff; 
}

.O-uke{
 display:block;
 width: 80px;
 height:24px;
 border-style: none;
 color: #FFF;
 text-decoration: none;
 text-align: center;
 background-color: #009944;
 border-radius: 5px;
}
.YaYa{
 display:block;
 width: 80px;
 height:24px;
 border-style: none;
 color: #FFF;
 text-decoration: none;
 text-align: center;
 background-color: #e39800;
 border-radius: 5px;
}
.NG{
 display:block;
 width: 80px;
 height:24px;
 border-style: none;
 color: #FFF;
 text-decoration: none;
 text-align: center;
 background-color: #e60012;
 border-radius: 5px;
}

@media screen and (min-width:600px){
.no_box{
 min-width:80px;
 float:left;
 overflow:hidden;
}
.title02{
 float:left;
 overflow:hidden;
 font-weight:bold;
}
.title02 a{
 min-width:700px;
 display:block;
 text-decoration:none;
}
}
@media screen and (max-width:599px){
.no_box{
 min-width:10vw;
 float:left;
 overflow:hidden;
 font-size:80%;
}
.title02{
 float:left;
 overflow:hidden;
 font-weight:bold;
 font-size:80%;
}
.title02 a{
 min-width:82vw;
 display:block;
 color:#455eaa;
 text-decoration:none;
}
}
.margin_botom10{
 margin-bottom:10px;
}
@media screen and (min-width:600px){
.drag_box{
 width:60%;
 margin:0vh auto 0vh auto;
 overflow:hidden;
 font-size:80%;
 text-align:left;
}
}
@media screen and (max-width:599px){
.drag_box{
 margin:0vh auto 0vh auto;
 font-size:80%;
 overflow:hidden;
 text-align:left;
}
}
#drag-area{
 width:50%;
 float:left;
}
.bt_area{
 width:50%;
 float:right;
}
.blue_bot a{
 width:50%;
 height:36px;
 line-height:36px;
 text-align:center;
 float:right;
 background:#455eaa;
 display:block;
 border-radius:8px/8px;
 font-weight:bold;
 color:#fff;
 text-decoration:none;
 margin-bottom:4px;
}
#hint_box{
 width:50%;
 padding:4px 6px;
 border:solid 1px #eb687d;
 background:#fff799;
 float:right;
 line-height:1.2em;
}
.copy_pho{
 max-width:100%;
 max-height:600px;
}

/* ==============================================*/
/*                   ページごと                       */
/* ==============================================*/
/*-------------index*/
@media screen and (min-width:600px){
#login_table{
 width:60%;
 margin:10vh auto 0vh auto;
}
}
@media screen and (max-width:599px){
#login_table{
 width:calc(100% - 2px);
 margin:10vh auto 0vh auto;
}
}
#login_table td,th{
 padding:4px;
}
#login_table h1{
 font-size:120%;
 margin:0px 0px 10px 0px;
}
#status_box{
 overflow:hidden;
 float:left;
 font-size:80%;
 padding:2px;
 border:1px solid #455eaa;
 margin-bottom:10px;
}
@media screen and (min-width:600px){
#thread_table{
 clear:both;
 width:60%;
 margin:0px auto 10px auto;
}
}
@media screen and (max-width:599px){
#thread_table{
 width:calc(100% - 2px);
 margin:0px auto 10px auto;
}
}
#thread_table td,th{
 padding:4px;
}
.new_list a{
 width:100%;
 height:20px;
 line-height:20px;
 font-size:80%;
 overflow:hidden;
 background:url('../img/toriangle_b.png');
 background-repeat:no-repeat;
 padding-left:16px;
 text-decoration:none;
 color:#231815;
}

/*-------------single*/
#top_link_btn{
 overflow:hidden;
 float:left;
 margin-bottom:10px;
 border-radius:8px/8px;
}
#top_link_btn a{
 font-size:80%;
 padding:2px 10px;
 background:#455eaa;
 display:block;
 border-radius:8px/8px;
 font-weight:bold;
 color:#fff;
 text-decoration:none;
}
#cate_tit{
 font-size:80%;
 padding:2px 10px;
 overflow:hidden;
 float:left;
 font-weight:bold;
}
#toko_btn{
 overflow:hidden;
 float:right;
 margin-bottom:10px;
 border-radius:8px/8px;
 font-size:80%;
 padding:2px 10px;
 background:#0085d0;
 display:block;
 font-weight:bold;
 color:#fff;
 text-decoration:none;
 cursor:pointer;
}
#toji_btn{
 overflow:hidden;
 float:right;
 margin-bottom:10px;
 border-radius:8px/8px;
 font-size:80%;
 padding:2px 10px;
 background:#b2b2b2;
 display:none;
 font-weight:bold;
 color:#fff;
 text-decoration:none;
 cursor:pointer;
}

@media screen and (min-width:600px){
#com_form_box{
 position:fixed;
 top:0px;
 left:calc((100vw - 800px) / 2);
 width:800px;
 overflow:hidden;
 z-index:20; 
 clear:both;
 display:none;
 border-bottom:2px dotted;
 padding-bottom:10px;
 margin-bottom:20px;
 background:#fff;
}
}
@media screen and (max-width:599px){
#com_form_box{
 position:relative;
 top:0px;
 z-index:20; 
 clear:both;
 width:100%;
 display:none;
 border-bottom:2px dotted;
 padding-bottom:10px;
 margin-bottom:20px;
 background:#fff;
}
}
.name_box{
 overflow:hidden;
 background:url('../img/toriangle_b.png');
 background-repeat:no-repeat;
 padding-left:16px;
 margin-bottom:10px;
}
.renew_box a{
 width:30px;
 height:20px;
 display:block;
 color:#898989;
 text-decoration:none;
 float:right;
}
@media screen and (min-width:600px){
.ifla_size{
 width:560px;
 height:315px;
}
}
@media screen and (max-width:599px){
.ifla_size{
 width:96vw;
 height:56vw;
}
}

/*-------------iine*/
.form_table{
 border:none;
}
.form_table td,th{
 padding:2px;
}
 
/*-------------member*/
@media screen and (min-width:600px){
.user_1coma{
 width:256px;
 overflow:hidden;
 font-size:80%;
 float:left;
 padding:4px;
 border:1px solid #455eaa;
 margin:5px;
}
}
@media screen and (max-width:599px){
.user_1coma{
 width:calc(96vw - 2px);
 overflow:hidden;
 font-size:80%;
 padding:4px;
 border:1px solid #455eaa;
 margin:1vw;
}
}

/* ==============================================*/
/*                   固定指定部                     */
/* ==============================================*/
@media screen and (min-width:600px){
#container{
 width:800px;
 margin:0px auto;
 overflow:hidden;
}
}
@media screen and (max-width:599px){
#container{
 width:100%;
}
}
@media screen and (min-width:600px){
#header{
 width:800px;
 height:47px;
 overflfow:hidden;
 background: url('../img/header_back.png');
 background-repeat:no-repeat;
 background-size:100%;
 margin-bottom:10px;
}
}
@media screen and (max-width:599px){
#header{
 width:100%;
 height:5.875vw;
 overflfow:hidden;
 background: url('../img/header_back.png');
 background-repeat:no-repeat;
 background-size:100%;
 margin-bottom:10px;
}
}
@media screen and (min-width:600px){
#body_box{
 position:relative;
 width:100%;
 text-align:left;
 line-height:1.5em;
}
}
@media screen and (max-width:599px){
#body_box{
 position:relative;
 width:96vw;
 margin-left:2vw;
 text-align:left;
 line-height:1.5em;
}
}
#sid_op{
 width:160px;
 height:20px;
 position:fixed;
 left:calc((100% - 160px) / 2);
 bottom:-6px;
 cursor:pointer;
 background:url('../img/menu_op.png');
 background-repeat:no-repeat;
 border-top-left-radius:6px;
 border-top-right-radius:6px;
}
@media screen and (min-width:600px){
#side_menu{
 width:400px;
 overflow:hidden;
 display:none;
 position:fixed;
 bottom:10px;
 left:0px;
 background:#898989;
}
#side_menu li a{
 width:400px;
 padding:10px 6px;
 border-bottom:1px dotted #b2b2b2;
 display:block;
 color:#fff;
 font-weight:bold;
 line-height:1.2em;
 text-decoration:none;
}
}
@media screen and (max-width:599px){
#side_menu{
 width:80vw;
 overflow:hidden;
 display:none;
 position:fixed;
 bottom:10px;
 left:0px;
 background:#898989;
}
#side_menu li a{
 width:80vw;
 padding:2vw 1vw;
 border-bottom:1px dotted #b2b2b2;
 display:block;
 color:#fff;
 font-weight:bold;
 line-height:1.2em;
 text-decoration:none;
}
}
#goto_top{
 width:40px;
 height:40px;
 border-radius:20px/20px; 
 display:none;
 position:fixed;
 right:10px;
 bottom:40px;
 background:url('../img/goto_pagetop.png');
 background-size:100%;
 background-repeat:no-repeat;
 cursor:pointer;
}

#footer{
 padding:4px;
 overflow:hiddden;
 color:#fff;
 font-size:80%;
 background:#231815;
}
/* ------------------------------>テーブル系 */
 .blue_table{
  border-collapse:collapse;
  border:1px solid #0054a6;
 }
 .blue_table th{
  text-align:center;
  border:1px solid #0054a6;
 }
 .blue_table td{
  text-align:left;
  border:1px solid #0054a6;
 }
 .blue_table a{
  color:#717071;
 }
 .blue_table a:hover{
  color: #54c2f1;
  text-decoration:none;
 }

.pager_width{
 width:100%;
 overflow:hidden;
 margin-top:10px;
}
.peg_com_1{
 width:40px;
 height:40px;
 border-radius:20px/20px;
 text-align:center;
 line-height:40px;
 background:#e6e6e6;
 float:left;
 margin-right:4px;
}
.peg_com_1 a{
 width:40px;
 height:40px;
 border-radius:20px/20px;
 text-align:center;
 line-height:40px;
 display:block;
 background:#455eaa;
 color:#fff;
 float:left;
 margin-right:4px;
 text-decoration:none;
}

div{box-sizing:border-box;}

ul{
 margin:0;
 padding:0;
 }
li{
 list-style:none;
}

p{
 margin:0px;
 padding:0px;
}

img {border:0px;}
a:hover img {
 filter:alpha(opacity=50);
  -moz-opacity: 0.5;
  opacity: 0.5;
}
a:active img {
 filter:alpha(opacity=50);
  -moz-opacity: 0.5;
  opacity: 0.5;
}
a img {
 filter:alpha(opacity=100);
 -moz-opacity: 1;
  opacity: 1;
}
 
body { 
 margin:0 auto;
 text-align:center;
 color:#3e3a39;
 font-family:"メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック","MS P Gothic",sans-serif;
 line-height:1em;
}