body {
	font: 100%/1.4 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;
	background-color: #f1f1f1;/*#fbfbfb;*//*#cccccc;*/
	margin: 0;	padding: 0;	color: #202020;
}

header,nav,footer{ text-align: center; margin-top: 3px; margin-bottom: 4px; clear: both; }
main             { margin-top: 3px; margin-bottom: 4px; clear: both; }

main#top {padding-top : 30px;}
main#top div,main#top div#cs
             {background-color :#fffafa;
              margin-top : 20px;margin-left : 20px;margin-bottom : 10px;margin-right : 20px;
              border-left-color : #696969;border-left-style : solid;border-left-width : 1px;
              border-bottom-color:#969696;border-bottom-style:solid;border-bottom-width:1px;}
main#top h2   {padding : 5px;}
main#top h3   {margin-left : 20px;margin-right : 20px;}
main#top p    {margin-left : 40px;margin-right : 20px;padding : 2px;}



            #cs h2          {background-color: #b40022; color: #f0f0f0;}
            #csmvp h2       {background-color: #0f0f0f; color: #f0f0f0;}
            #j1 h2          {background-color: #e31106; color: #f0f0f0;}
            #j2 h2          {background-color: #008748; color: #f0f0f0;}
            #j3 h2          {background-color: #006cb8; color: #f0f0f0;}
            #footballcs h2  {background-color: #ff9900; color: #f0f0f0;}







/*-----------------    --------------------------*/
@media screen and (min-width:981px) /*981px以上で適用する内容*/
  {
  
  /*#nav-open {display:none;}*/
     .twtr, a.twitter-share-button{ /*float: left;*/width : 100%;height : 100%;}
  
  h1{font-size : 130%;}
  h2,h3,h4{font-size : 120%;}
  
  
     input.radio{transform:scale(1.0);margin-right:30px ;}
     
     input.btn,input.btn_cs,.btn_csmvp,.btn_j1,.btnj2,.btn_j3,.btn_footballcs     {font-size:180% ;padding-bottom: 5px;padding-top: 5px;padding-left: 100px;padding-right:100px ;}
  }
/*-----------------    --------------------------*/
@media screen and (max-width:981px) /*981px以下で適用する内容*/
   {
   
   body {font-size : 28pt;padding-left : 5px;padding-right : 5px;width : 97%;}
   .twtr, a.twitter-share-button{ width : 300%;height : 300%;}
   
   
   h1{font-size : 105%;}
   h2,h3,h4{font-size : 104%;}
   

   }
/*-----------------    --------------------------*/

header h1 {text-align: center;font-size : 100%;  color: #999999; margin-top: 3px; margin-bottom: 4px;font-family: MS UI Gothic, Osaka; }

   .ad , div#r ul.ad{ font-size: 82% ;  }




.f080 { font-size:80% }
.f090 { font-size:90% }
.f120 { font-size:120%;}
.f130 { font-size:130%;}
.f140 { font-size:140%;font-weight : bold;}
.f150 { font-size:150% }
.f160 { font-size:160% }
.f170 { font-size:170% }
.f180 { font-size:180% }
.f190 { font-size:190% }
.f200 { font-size:200% }
.f210 { font-size:210% }
.f220 { font-size:220% }
.f230 { font-size:230% }
.f240 { font-size:240% }
.f250 { font-size:250% }
.f260 { font-size:260% }
.f270 { font-size:270% }
.f280 { font-size:280% }
.f290 { font-size:290% }
.f300 { font-size:300% }
.f350 { font-size:350% }
.f400 { font-size:400% }
.f450 { font-size:450% }



.f180cs { font-size:180%;color: #b40022; }
.f190cs { font-size:190%;color: #b40022; }
.f200cs { font-size:200%;color: #b40022; }
.f220cs { font-size:220%;color: #b40022; }
.f250cs { font-size:250%;color: #b40022; }
.f260cs { font-size:260%;color: #b40022; }
.f270cs { font-size:270%;color: #b40022; }
.f280cs { font-size:280%;color: #b40022; }
.f300cs { font-size:300%;color: #b40022; }
.f350cs { font-size:350%;color: #b40022; }
.f400cs { font-size:400%;color: #b40022; }
.f450cs { font-size:450%;color: #b40022; }

small {margin-left : 1em;margin-right : 1em;}

.ti1em {text-indent : 1em;}

.hrhf , .hr 
         {text-align : center;border-top-style : solid;border-left-style : hidden;
         border-left-width : 0px;border-bottom-style : hidden;
         border-bottom-width : 0px;border-right-style : hidden;
         border-right-width : 0px;width : 100%;clear : both;}
          .hrhf  {border-color : #3d82df;border-top-width : 3px;}
          .hr    {border-color : #3d82df;border-top-width : 1px;}
.fl    {float : left;}
.fr    {float : right;}
.clr , #header , #footer ,#mid , .uri {clear: both;}

.tac   {text-align : center;}
.tar   {text-align : right;}





  .hit  {color : #009900;}
  .down {color : #ff0000;}
  .up {color : #0000ff;}




    .accbox {    /*margin: 2em 0;*/    /*padding: 0;*/    /*max-width: 400px;*/}
    .accbox label {display: block;/*margin: 1.5px 0;*//*padding : 11px 12px;*/color :#2f8fcf;
                   /*font-weight: bold;*/background :#a4cbf3;cursor :pointer;transition: all 0.5s;}

    .accbox label:hover {    background :#85baef;}

    .accbox input {    display: none;}

    .accbox .accshow {height: 0;padding: 0;overflow: hidden;opacity: 0;transition: 0.8s;}

    .cssacc:checked + .accshow {height: auto;/*padding: 5px;*/background: #eaeaea;opacity: 1;}



/* ~~ エレメント / タグセレクター ~~ */
/*ul,*/ ul.nav,/*ol,*/ dl { /* ブラウザー間の相違により、リストの余白とマージンをゼロにすることをお勧めします。一貫性を保つために、量をここで指定するか、リストに含まれるリスト項目 (LI、DT、DD) で指定できます。より詳細なセレクターを記述しない限り、ここで指定する内容が .nav リストにも適用されることに注意してください。 */
	padding-top: 0;padding-bottom:0; padding-right: 0; padding-left: 0;
	margin-top:  0;margin-bottom:0;  margin-right: 0;  margin-left: 0;
}
   main dl         { margin-top:  60px;margin-bottom:10px;}
   main dt,main dd { padding-top: 5px;}
h1, h2, h3, h4, h5, h6, p {
	margin-top: 0;	 /* 上マージンを削除すると、マージンを含む div からマージンがはみ出す場合があるという問題を回避できます。残った下マージンにより、後続のエレメントからは離されます。 */
	padding-right: 15px;
	padding-left: 15px; /* div 自体ではなく div 内でエレメントの両側に余白を追加すると、ボックスモデル計算が不要になります。代わりに、両側に余白を指定した div をネストして使用することもできます。 */
}
a img { /* このセレクターは、一部のブラウザーでイメージをリンクで囲んだ場合にイメージの周囲に表示される初期設定の青いボーダーを削除します。 */
	border: none;
}





.header {
	background-color: #009999 /*#6F7D94*/;  color : #fcfcfc;
}

.header h1 , .header h1 , .headercs h1 , .headercsmvp h1 , .headerj1 h1 , .headerj2 h1 , .headerj3 h1 , .headerfootballcs h1 {
font-size : 140%; margin-bottom : 0px;padding-top : 5px;padding-left : 1em;padding-bottom : 3px;
}


li.cs,li.csmvp,li.j,li.j1,li.j2,li.j3,li.je,li.footballcs {
	width: 20%;	float: left;/*padding-bottom: 100px;*/
}

li.cs_100,li.csmvp_100,li.j_100,li.j1_100,li.j2_100,li.j3_100,li.je_100,li.footballcs_100 {
	width: 100%;	/*padding-bottom: 100px;*/}





/* ~~ サイトのリンクのスタイル付けは、ホバー効果を作成するセレクターグループも含め、この順序にする必要があります。~~ */
.nav a:link {
	color:#414958;
	text-decoration: none;/*underline;*/ /* 非常に特殊な表示方法でリンクをスタイル付けする場合を除き、一目で見分けられるように下線を指定することをお勧めします。 */
}
.nav a:visited {
	color: #4E5869;
	text-decoration: none;/*underline;*/
}
.nav a:hover, .nav a:active, .nav a:focus { 
	text-decoration: none;
}/* このセレクターグループは、キーボードを使用するユーザーに対し、マウスを使用するユーザーと同じホバー効果を提供します。 */

/* ~~ ヘッダーには幅は指定されません。ヘッダーはレイアウトの幅全体まで広がります。ヘッダーには、ユーザー独自のリンクされたロゴに置き換えられるイメージプレースホルダーが含まれます。~~ */




/* ~~ ナビゲーションリストのスタイル付け (Spry などの事前作成済みのフライアウトメニューを使用する場合は削除できます) ~~ */
ul.nav {
	list-style: none; /* リストのマーカーを削除します。 */
	border-top:    1px solid #666; /* リンク用の上部のボーダーを作成します。他のすべてのものは LI 上で下部のボーダーを使用して配置されます。 */
   border-bottom: 1px solid #666;
   margin-bottom: 15px; /* 下のコンテンツのナビゲーション間の間隔を作成します。 */
}
ul.nav li {
	border-bottom: 1px solid #666; /* ボタンの区切り線を作成します。 */
}
ul.nav a, ul.nav a:visited { /* これらのセレクターをグループ化することで、リンクのボタン表示が訪問後も確実に保持されます。 */
	padding: 5px 5px 5px 15px;
	display: block; /* リンクにブロックプロパティを指定し、リンクが含まれる LI 全体がリンクになるようにします。これにより、領域全体がマウスのクリックに反応するようになります。 */
	text-decoration: none;
	background-color: #A6F84E;  /*color: #f2f2f2;*/
}



       a         {color : #5353ff;           text-decoration : none;}
       a:link    {color : #5353ff;           text-decoration : none;}
       a:hover   {background-color : #a6f84e;text-decoration : underline;}
       a:active  {color : red;               text-decoration : underline;}
       a:visited {color : #9a35ff;           text-decoration : none;}
       .c a:hover{background-color : #b40022;text-decoration : underline;color : white;}


    ul.nav .cs a,     ul.nav .cs a:visited,
    ul.nav .cs_100 a, ul.nav .cs_100 a:visited, 
        #cs h2 a,     #cs h2 a:visited,  input.btn_cs{background-color: #b40022; color: #f0f0f0;}
    ul.nav .csmvp a, ul.nav .csmvp a:visited,
    ul.nav .csmvp_100 a, ul.nav .csmvp_100 a:visited, 
        #csmvp h2 a,  #csmvp h2 a:visited,  input.btn_mvpcs {background-color: #0f0f0f; color: #f0f0f0;}
    ul.nav .j1 a,ul.nav .j1 a:visited,ul.nav .j1_100 a, ul.nav .j1_100 a:visited,input.btn_j1{background-color: #e31106; color: #f0f0f0;}
    ul.nav .j2 a,ul.nav .j2 a:visited,ul.nav .j2_100 a, ul.nav .j2_100 a:visited,input.btn_j2{background-color: #008748; color: #f0f0f0;}
    ul.nav .j3 a,ul.nav .j3 a:visited,ul.nav .j3_100 a, ul.nav .j3_100 a:visited,input.btn_j3{background-color: #006cb8; color: #f0f0f0;}
    ul.nav .footballcs a, ul.nav .footballcs a:visited, ul.nav .footballcs_100 a, ul.nav .footballcs_100 a:visited,input.btn_footballcs {background-color: #ff9900; color: #f0f0f0;}


ul.nav a:hover, ul.nav a:active, ul.nav a:focus { /* マウスを使用する場合もキーボードを使用する場合も、背景色とテキストカラーを変更します。 */
	background-color: #f2f2f2; /*color: #A6F84E;*/}
   
    ul.nav .cs a:hover, ul.nav .cs a:active, ul.nav .cs a:focus, 
    ul.nav .cs_100 a:hover, ul.nav .cs_100 a:active, ul.nav .cs_100 a:focus { background-color: #f0f0f0; color: #b40022;}
    ul.nav .csmvp a:hover, ul.nav .csmvp a:active, ul.nav .csmvp a:focus,
        #csmvp h2 a:hover,     #csmvp h2 a:active,     #csmvp h2 a:focus,
    ul.nav .csmvp_100 a:hover, ul.nav .csmvp_100 a:active, ul.nav .csmvp_100 a:focus,
         li.csmvp_100 a:hover,      li.csmvp_100 a:active,      li.csmvp_100 a:focus { background-color: #f0f0f0; color:#0f0f0f;}
    ul.nav .j1 a:hover,     ul.nav .j1 a:active,     ul.nav .j1 a:focus,
    ul.nav .j1_100 a:hover, ul.nav .j1_100 a:active, ul.nav .j1_100 a:focus { background-color: #f0f0f0; color: #e31106;}
    ul.nav .j2 a:hover,     ul.nav .j2 a:active,     ul.nav .j2 a:focus,
    ul.nav .j2_100 a:hover, ul.nav .j2_100 a:active, ul.nav .j2_100 a:focus { background-color: #f0f0f0; color: #008748;}
    ul.nav .j3 a:hover,     ul.nav .j3 a:active,     ul.nav .j3 a:focus,
    ul.nav .j3_100 a:hover, ul.nav .j3_100 a:active, ul.nav .j3_100 a:focus { background-color: #f0f0f0; color: #006cb8;}
    ul.nav .footballcs a:hover,     ul.nav .footballcs a:active,     ul.nav .footballcs a:focus, 
    ul.nav .footballcs_100 a:hover, ul.nav .footballcs_100 a:active, ul.nav .footballcs_100 a:focus 
                                                                            { background-color: #f0f0f0; color: #ff9900;}
    
    
    
                               span.Black   {color : Black;}
                               span.Red     {color : Red;}
                               span.Lime    {color : Lime;}
                               span.Blue    {color : Blue;}
                               span.Fuchsia {color : Fuchsia;}
                               span.Maroon  {color : Maroon;}
                               span.Olive   {color : Olive;}
                               span.Green   {color : Green;}
                               span.Teal    {color : Teal;}
                               span.Navy    {color : Navy;}
                               span.Purple  {color : Purple;}
                               
                                        div.Black   ,em.Black   {background-color : black;}
                                        div.Red     ,em.Red     {background-color : Red;}
                                        div.Lime    ,em.Lime    {background-color : Lime;}
                                        div.Blue    ,em.Blue    {background-color : Blue;}
                                        div.Fuchsia ,em.Fuchsia {background-color : Fuchsia;}
                                        div.Maroon  ,em.Maroon  {background-color : Maroon;}
                                        div.Olive   ,em.Olive   {background-color : Olive;}
                                        div.Green   ,em.Green   {background-color : Green;}
                                        div.Teal    ,em.Teal    {background-color : Teal;}
                                        div.Navy    ,em.Navy    {background-color : Navy;}
                                        div.Purple  ,em.Purple  {background-color : Purple;}
                                   
                                   
                                               span.ffffff  {color : #ffffff;}
                                               span.ffff00  {color : #ffff00;}
                                               span.ffff99  {color : #ffff99;}
                                               span.ffff66  {color : #ffff66;}
                                               span.ffffcc  {color : #ffffcc;}
                                               span.ccffcc  {color : #ccffcc;}
                                               span.ccffff  {color : #ccffff;}
                                               span.ccccff  {color : #ccccff;}
                                               span.ffcc99  {color : #ffcc99;}
                                               span.ffcc00  {color : #ffcc00;}
                                               span.ff8080  {color : #ff8080;}

                                                div.ffffff  ,em.ffffff  {background-color : #ffffff;}
                                                div.ffff00  ,em.ffff00  {background-color : #ffff00;}
                                                div.ffff99  ,em.ffff99  {background-color : #ffff99;}
                                                div.ffff66  ,em.ffff66  {background-color : #ffff66;}
                                                div.ffffcc  ,em.ffffcc  {background-color : #ffffcc;}
                                                div.ccffcc  ,em.ccffcc  {background-color : #ccffcc;}
                                                div.ccffff  ,em.ccffff  {background-color : #ccffff;}
                                                div.ccccff  ,em.ccccff  {background-color : #ccccff;}
                                                div.ffcc99  ,em.ffcc99  {background-color : #ffcc99;}
                                                div.ffcc00  ,em.ffcc00  {background-color : #ffcc00;}
                                                div.ff8080  ,em.ff8080  {background-color : #ff8080;}


        div#votebbs_com{max-width : 90%;padding : 10px;margin-bottom : 1em;margin-left : 1em;border-top-style : none;border-left : 3px;border-left-color : #a6f84e;border-left-style : solid;border-left-width : 100%;border-bottom : 1px;border-bottom-color : #696969;border-bottom-style : solid;border-bottom-width : 100%;border-right-style : none;}


/*
        .votingbbs_form dl, .votingbbs_form dt, .votingbbs_form dd, .votebbs_id_subject{font-size : 95%;}
       #votebbs_id_subject ,#votebbs_comment1234 ,#votebbs_date,#votebbs_del {
              background-color : #efefef;font-size : 85%;margin-left : 2px;margin-right : 2px;padding : 5px;
              }
			  */
			  
