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

body {
  font-family: Verdana,"メイリオ","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif;
  font-size: 12px;
  line-height:1.8em;
  color: #666;
  background-color: #FFF;
  margin:0;
  padding:0;
  text-align:left;
  overflow-x:hidden;
  -webkit-text-size-adjust: 100%; 
}

.mainbox {
	width:1000px;
	margin:0 auto;
	vertical-align:top;
	padding:8px;
}

.container{
  width: 100%;
  display:inline-block;
  padding-top:10px;
  margin-right:10px;;
}

.kugiri {
		  display:none;
	  }

h1 {
     position: relative;
     padding: 0.5em 1.2em;
     border-radius:1.5em;
     border: 1px solid #CCC;
     text-shadow: 1px 1px 4px rgba(0,0,0,0.3);
     box-shadow:inset 1px 1px 0 rgba(255,255,255,1);
     background: linear-gradient(#EFEFEF 0%, #FFF 50%, #EEE 50%, #FFF 100%);
}

h2 {
  padding: 0.4em;/*文字の上下 左右の余白*/
  color: #494949;/*文字色*/
  background: #f4f4f4;/*背景色*/
  border-left: solid 5px #7db4e6;/*左線*/
  border-bottom: solid 3px #d7d7d7;/*下線*/
  display: inline-block;/*おまじない*/
  line-height: 0.8;/*行高*/
  font-size:16px;
  vertical-align: middle;
}

h3 {
position: relative;
background: #ffc6e8;
padding: 2px 5px 2px 44px;
font-size: 20px;
border-radius: 0 10px 10px 0;
}

h3:before {
content: "１";
display: inline-block;
line-height: 40px;
position: absolute;
padding: 0em;
color: white;
background: #f246ad;
font-weight: normal;
width: 40px;
text-align: center;
height: 40px;
line-height: 40px;
left: -0.3em;
top: 50%;
-moz-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
border: solid 3px white; 
border-radius: 50%;
}

h4 {
position: relative;
background: #ffc6e8;
padding: 2px 5px 2px 44px;
font-size: 20px;
border-radius: 0 10px 10px 0;
}

h4:before {
content: "２";
display: inline-block;
line-height: 40px;
position: absolute;
padding: 0em;
color: white;
background: #f246ad;
font-weight: normal;
width: 40px;
text-align: center;
height: 40px;
line-height: 40px;
left: -0.3em;
top: 50%;
-moz-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
border: solid 3px white; 
border-radius: 50%;
}

.koukan{
	vertical-align:top;
}

.koukanr{
	color:#F33;
	vertical-align:top;
}

table {
    text-align:left;
	font-size:13px;
	vertical-align:top;
}

table th,tr,td {
    text-align:left;
	font-size:13px;
	vertical-align:top;
}

table td.sozainame {
	width:300px;
	line-height:2.0em;
	overflow:hidden;
}

table td.numcol {
	width:30px;
	line-height:2.0em;
	text-align:center;
}

table td.updowncol {
	width:60px;
	line-height:2.0em;
}

table td.sozailist {
	width:160px;
	line-height:2.0em;
	overflow:hidden;
}

table td.numlist {
	width:52px;
	line-height:2.0em;
	text-align:center;
}

.btn {
  display: inline-block;
  padding: 0;
  text-decoration: none;
  background: #eee;/*ボタン色*/
  color: #666;
  border: solid 1px #ccc;
  border-radius: 3px;
  font-size:16px;
}

.up {
  background:url(img/up.png) no-repeat bottom;
  display: inline-block;
  width:16px;
  height:16px;
  padding: 0.3em;
  text-decoration: none;
  color: #666;
  border: solid 1px #ccc;
  border-radius: 3px;
  margin: 2px 0 -3px 3px;
  justify-content: center; /* コンテンツを水平方向に中央揃え */
}

.updownnum {
  display: inline-block;
  margin: 0;
  background:#EEE;
  padding:2px;
  text-align:center;
  width:30px;
  line-height:1em;
  justify-content: center; /* コンテンツを水平方向に中央揃え */
}

.fbttl {
	font-weight:bold;
	padding:3px;
	background:#CCC;
	margin:3px 0;
}

.subs {
	background:#E3F1FF;
	margin-left:5px;
	padding:2px;
}

.ssb {
	background:#FED;
	margin-left:5px;
	padding:2px;
}

.sssb {
	background:#EAEAFF;
	margin-left:5px;
	padding:2px;
}

.bs {
	background:#E6FFE6;
	margin-left:5px;
	padding:2px;
}

.ks {
	background:#EEE;
	margin-left:5px;
	padding:2px;
}

.sozainum {
	color:#399;
	padding:2px 0;
	vertical-align:top;
}

.sozaiupdown {
	padding:2px 0;
	vertical-align:top;
}

ul {
    list-style-type: none!important;
    margin: 0;
    padding-left: 0;
	width:160px;
	
}

#badgelist {
	line-height:1.2em;
}

.pink {
	color:#E274C7;
}


@media (max-width: 619px) {
	* {
		float: none;
		position: static;
	}
	
	.mainbox {
		width:96vw;
		margin:0 auto;
		display:block;
		padding:0;
	}
	
	table td.sozainame {
		width:230px;
	}
	
	.down {
	  background:url(img/down.png) no-repeat bottom;
	  display: inline-block;
	  width:16px;
	  height:18px;
	  border-radius: 3px;
	  margin-left:5px;
	  border:none;
	}
	
	.up {
	  background:url(img/up.png) no-repeat bottom;
	  display: inline-block;
	  width:16px;
	  height:18px;
	  border:none;
	}
	
	.updownnum {
	  display: inline-block;
	  margin:0 2px;
	  background:#EEE;
	  padding:2px 0;
	  text-align:center;
	  width:20px;
	  line-height:1.1em;
	}
	
}

@media (min-width: 620px) and (max-width: 974px) {
	* {
		float: none;
		position: static;
	}
	
	.mainbox {
		width:600px;
		margin:0 auto;
		display:block;
		padding:0;
	}
	
	table td.sozainame {
		width:300px;
	}}

