h1{float:left; margin:15px 3% 0 3%; padding: 8px 2%; width:94%;  font-size:1.8rem; line-height: 1.2; border-top:#FF8181 solid 2px; border-bottom:#FF8181 solid 2px; }
h1 span{ font-size: 1rem; color: #999; }
h2{ float: left; width: 96%; margin:30px 2% 10px 2%; padding: 6px 3%; font-size: 1.3rem; font-weight: bold; line-height: 1.2; border-width:1px 0; border-color:#FF8181; border-style: solid; }

/*お知らせ*/
.info_msg_sort{ float:left; width:100%; font-weight:bold; color:#FFA0A0; padding:0 5%; margin:20px 0 0 0; font-size:1.4rem; line-height:1.2; }



/*期間別*/
.kikan-bg{ width: 100%; background-color: #EFEFEF; border-bottom: #13A000 solid 1px; box-shadow: 0 -2px 8px -2px rgba(0,0,0,0.2) inset;}
.kikan{ width: 800px; height: 40px;  padding: 10px 2% 0 2%; margin:0 auto;   }
.kikan-btn{ float: left; width: 15%; margin:0 3px 0 0; padding: 3px; text-align: center; border-radius: 3px 3px 0 0;  font-size: 1.1rem;  }
.kikan-btn:hover{ cursor: pointer; opacity: 0.6; }
.kikan-btn-on{ background-color: #13A000; color: #FFF; border:#13A000 solid; border-width: 1px 1px 0 1px;}
.kikan-btn-off{ background-color: #FFF; color: #333;border:#999 solid; border-width: 1px 1px 0 1px;}



/*メニュー（新旧）*/
.menu{ float: left;width: 100%; margin:10px 0 0 0; padding: 0 3%; }
.menu-btn{ float:left; width: 100px;  padding: 5px 0 4px 0;  margin:0 0 0 0;text-align: center; font-size: 1rem; line-height: 1.2; }
.menu-btn:first-of-type{ border-radius: 2px 0 0 2px; }
.menu-btn:last-of-type{ border-radius: 0 2px 2px 0; }
.menu-btn-off{ border:#222 solid 1px; color: #333; }
.menu-btn-on{ background-color: #222; color: #FFF; border:#222 solid 1px; }
.menu-btn:hover{ cursor: pointer; opacity: 0.6; }




/*タグ横移動*/
.ty{ float: left; width: 100%; margin:10px 0 0px 0; padding: 0 3%; }
.ty-btn{ float: left; display: block; margin:0 2px 0 0; padding: 5px 12px 3px 12px; border-radius: 2px; font-size: 1rem; line-height: 1.2; border:#F45E73 solid 1px; }
.ty-btn:hover{ cursor: pointer; opacity: 0.6; }
.ty-btn-off{ color: #F45E73; }
.ty-btn-on{background-color: #F45E73; color: #FFF;}






/* ランキング */
.l{ float: left; width: 100%; margin:5px 0; padding: 10px 3%; }
.l-none{ float: left; width: 100%; margin:20px 0 40px 0; padding: 0 2%; font-size: 1.6rem; font-weight: bold; color: #999;  line-height: 1.2; }
.l-box{ position: relative; float: left; margin:0 0.6%; width: 15%; height: 195px; border:#999 solid 0px; overflow: hidden; }
.l-box:hover{ cursor: pointer; opacity: 0.6; }
.l-new-icon{ position: absolute; top:8px; left:-23%; transform:rotate(-35deg);  width: 100px; padding:3px 5% 2px 5%; color: #F12C47; background-color: #F93550; font-size: 1rem; line-height: 1; font-weight: bold; z-index: 9; color:#FFF; text-align: center; box-shadow: 1px 1px 0px 0px rgba(0,0,0,0.6);}
.l-sinjin-icon{ position: absolute; top:8px; left:-23%; transform:rotate(-35deg);  width: 100px; padding:3px 5% 2px 5%; background-color: #6BE83A; font-size: 1rem; line-height: 1; font-weight: bold; z-index: 9; color:#000; border:#000 solid 1px; text-align: center; box-shadow: 1px 1px 0px 0px rgba(0,0,0,0.3);}
.l-new-debut{ position: absolute; bottom:3px; width: 100%; padding:1px 5%; color: #F12C47; background-color: rgba(255,255,255,0.8); font-style: italic; font-size: 1rem; line-height: 1.2; text-align: center;}
.l-new-debut span{ font-size: 0.6rem; }
.l-rank{ float: left; width: 100%; padding:0 5%; color: #F98494; background-color: #FFF; font-style: italic; font-size: 1rem; line-height: 1; font-weight: bold;}

.l-pic{ position: relative; float: left; width: 100%; height: auto; overflow:hidden; border:#F98494 solid 1px; border-radius: 3px; overflow: hidden; }
.l-pic img {  float: left; display: block; width: 100%; height: auto;  }
.l-name{ float: left; width: 100%; text-align: center; font-size: 1rem; line-height: 1.2; margin:3px 0 0 0; padding: 1px 2px;}
.l-insta{ position: absolute; bottom: 3px; left: 3px; color: #FFF; text-shadow: 0 0 5px rgba(0,0,0,0.7); }
.l-insta img{ display: block; width: 20px; }
.l-vote{ position: absolute; bottom: 3px; right: 0; background-color: rgba(0,0,0,0.6); border-radius: 3px 0 0 3px; padding: 4px 8px 2px 8px; color: #FFF; font-size: 0.9rem; line-height: 1.2; }
.l-vote-up{ position: absolute; bottom: 25px; right: 0; background-color: rgba(0,0,0,0.6); border-radius: 3px 0 0 3px; padding: 4px 8px 2px 8px; color: #FFF; font-size: 0.9rem; line-height: 1.2; }
.l-vote i{ color: #FFF0F0;}




/* タグリスト */
.t{ float: left; width: 100%; margin:5px 0 10px 0; padding:  0 5%; }
.t-box{ float: left;  margin:3px; }
.t-link{ float: left;}
.t-btn{ float: left; font-size: 1.3rem; padding: 2px;  }
.t-btn-bg1{background-color:#F45E73;border-radius: 4px;}
.t-btn-bg2{background-color:#B24AB4;border-radius: 4px;}
.t-btn-bg3{background-color:#F47733;border-radius: 4px;}
.t-btn-bg4{background-color:#2DBE67;border-radius: 4px;}
.t-btn-bg5{background-color:#2DA4BE;border-radius: 4px;}
.t-btn:hover{ cursor: pointer; opacity: 0.6; }
.t-btn a{ float: left; color: #FFF;}
.t-pic{ float: left; width: 40px; height: 40px; margin:0; border-radius: 3px; overflow: hidden; }
.t-pic img{ display: block; width: 100%;}
.t-text{ float: left; margin:6px 15px; color: #FFF; }

.t-link-box{ float: left; width: 100%; padding: 0 2%; margin:7px 0; text-align: center; border-top:#D5D5D5 dashed 0px;}
.t-link-box a{ display: inline-block; margin:10px; font-size: 1.1rem;  padding: 5px 20px; border:#42B1FF solid 1px; border-radius: 4px;}



/*ページネーション*/
.page-all{ float: left; margin:30px 0 0 0; width: 100%; text-align: center; font-size: 18px; }
.page-all a{ margin:0 8px; }
.page-all span{ color: #999; margin:0 8px; }
.page-all a:hover{ cursor: pointer;opacity: 0.6; }








/*コメント*/
.co-all{ float: left; width: 94%; margin:5px 3%; font-size:1.6rem;}
.co-area-befor,
.co-area-after{ position: relative; float: left; width: 100%; height: 175px; line-height: 1.1; }
.co-area-after{ text-align: center; padding:20px 0 0 0; font-size:36px; font-weight: bold; }
.co-area-after-s{ font-size: 16px; }
.co-input{ float: left; margin:5px 0 0 0; padding: 4px 12px; border:#999 solid 1px; font-size: 16px; border-radius: 5px; -webkit-appearance: none; background-color: #FDF2F2; border:#EAB0B0 solid 1px;}
.co-name{ width: 400px; }
.co-txt{ width: 680px; height: 70px;resize: none; }
.co-btn-box{ float: left; width: 100%; height: 55px; }
.co-btn{ float: left; width: 150px; margin:10px 0 0 ;  padding: 12px ; background-color: #000; color: #FFF; border-radius: 5px; text-align: center; font-size: 18px; }
.co-btn-disable{ float: left; width: 150px; margin:10px 0 0 0;  padding: 12px ; background-color: #999; color: #FFF; border-radius: 5px; text-align: center; font-size: 18px; display: none; }
.co-hist{ float: left; width: 100%; margin:20px 0 0 0; max-height: 550px; overflow-y: scroll; background-color: #FDF7E8; border:#D8C79B solid 2px; border-radius: 5px; }
.co-exp{ float: left; width: 100%; margin:10px 0; padding: 0 5%; color: #756F63; font-size: 12px; }

.co-hist-list{ float: left; width: 96%; margin:10px 2%; border-collapse: collapse; font-size: 16px; }
.co-hist-list th{ width: 30px; }
.co-hist-list th,
.co-hist-list td{ padding: 3px 0px; line-height: 1.3; vertical-align: top; word-break: break-all; }
.co-hist-list td p{ margin: 0 0 15px 0; }
.co-hist-list-td-s{ font-size: 12px; color: #777; }
.co-hist-list-td-pic{ float: left; width: 400px; }
.co-hist-list-td-pic-img{ display: block; max-width: 400px; max-height: 400px; border:#FFF solid 5px; box-shadow: 2px 2px 5px rgba(0,0,0,0.4);}
.co-hist-list-td-info{ float: left; width: 100%; margin:5px 0 15px 0 ; font-size: 12px; line-height: 1.5; }
.co-hist-list-td-info-i{ margin:0 3px 0 0; }
.co-hist-list-td-hukai{ color: #FFB9B9;  }
.co-hist-list-td-hukai:hover{ cursor: pointer; color: #FF7E7E; }
.co-hist-list-td-hukai-after{ color: #BBBBBB; }
.co-btn:hover{ cursor: pointer; opacity: 0.7; }


.co-del-btn{ margin:0 0 0 20px; }
.co-del-btn:hover{ cursor: pointer; opacity: 0.6; }

.fa-comment{ color: #C4AE75; margin:0 10px 0 0; }
.comment-link{ float: left; width: 100%; margin:5px 0 30px 0; text-align: center; }
.comment-link a{ background-color: #EF340F; color: #FFF; padding: 8px 20px; border-radius: 5px; font-size: 1.4rem; }
.co-none{ float: left; color:#8C8060; margin:10px 20px; padding: 0; font-size: 16px;  }
.co-note{ float: left; width: 100%; padding: 2px 3%; font-size: 1.4rem; color:#666;  }



/* 画像選択 */
.co-img { float: left; width: 60%; height: 55px; margin:5px 0 0 0;   }
.co-img-btn { float: left; width: 20%; height: 55px; margin:0 0 0 0; display: block; color:#FFF; background-color: #D26F6F; padding: 9px 0px; border-radius: 4px; text-align: center; font-size: 0.7rem;line-height: 1.4; }
.co-img-btn:hover{ cursor: pointer; opacity: 0.7; }
.co-img-btn i{ font-size: 1.6rem; opacity: 0.9; }
.co-img-preview { float: left; width: 50%; margin:0 0 0 10px;}
.co-img-preview img{ float: left; display: block; height: 50px; }
.co-loading{position: absolute;
  top: 0; left: 0; width: 100%; height: 100%;
  background: rgba(255,255,255,.7);
  background-image: url(../image/design/co-loading.gif);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 150px auto;}
.co-hide{ display: none; }
.co-img-info{ float: left; width: 60%; line-height: 1.2; margin:10px 0 0 0; color: #D69696; }