-/*z-indexは、position:relative;必要。[java]element.style.leftは、element.stule.position="absolute"必要*/


/*ヘッダー*/
div#header{
width:auto;
height:25px;
/*background:#000000;*/
}

/*linkの順番重要Love and Hate*/
a:link{
color:#ffff99;
text-decoration:underline;
}
a:visited{
color:#996600;
text-decoration:underline;
}
a:hover{
color:#ff6600;
text-decoration:underline;
}
a:active{
color:#0033ff;
text-decoration:underline;
}
/*linkの色黄色*/


/*body*/
body{
color:#222222;
font:normal 14px/1.2em "ヒラギノ角ゴ Pro W3","メイリオ",Hiragino Kaku Gothic Pro,Meiryo,"ＭＳ Ｐゴシック",sans-serif;
/*前から順番に対応可能なフォントを撰びます*/

/*weight size line-height familyならfontだけで省略可能*/
background-image:url(img/title7.gif);
background-repeat:no-repeat;
}

div#wrapper{
/*全ての要素をabsoluteでwrapperを基準にするため*/
position:relative;
width:980px;
margin:0 auto;
height:auto;
border:5px dotted #ffffff;
background:#000000;

}
/*メニュー*/
#menua{
 clear:both; 
 float: left;
  width: 120px;
  height:28px;
  margin:8px;
background:#696969;
border-radius:10px;
}
/*背景がmargin:8px;だからテキストもmargin:8px;してからでないとpaddingも意味ない*/
#menua h5{
margin:8px;
padding-left:5px;
}

#menub{
   float: left;
   width: 120px;
  height:28px;
margin:8px;
background:#999999;
border-radius:30px;
}
#menub h5{
margin:8px 8px 5px 8px;/*h5のスペースをなくす指定*/
padding-left:5px;
}

#menuc{
   float: left;
   width: 120px;
  height:28px;
margin:8px;
background:#808080;
border-radius:10px;
}
#menuc h5{
margin:8px 8px 5px 8px;
padding-left:5px;
}

#menud{
   float: left;
   width: 120px;
  height:28px;
margin:8px;
background:#666666;
border-radius:10px;
}
#menud h5{
margin:8px 8px 5px 8px;
padding-left:5px;
}

#menue{
   float: left;
   width: 120px;
  height:28px;
margin:8px;
background:#808080;
border-radius:10px;
}
#menue h5{
margin:8px 8px 5px 8px;
padding-left:5px;
}

#menuf{
   float: left;
   width: 120px;
  height:28px;
margin:8px;
background:#999999;
border-radius:10px;
}
#menuf h5{
margin:8px;
padding-left:5px;
}

#menug{
   float: left;
   width: 120px;
  height:28px;
margin:8px;
background:#666666;
border-radius:10px;
}
#menug h5{
margin:8px;
padding-left:5px;
}


/*メニューの子要素*/
span{
display:block;
line-height:30px;
background:#06b1b3;
position:relative;
z-index:4;
}
.radius{
border-radius:3px 3px 14px 14px;
}


div.login{
width: 388px;
height:23px;
background:#fcfcfc;
position: absolute;
    top: 16px;
    left: 45%;
    margin-left:180px;
/*背景透明*/
background-color:rgba(255,255,255,0.6);
padding-left:10px;
padding-top:4px;
border-radius:12px;
z-index:3;
}
#inline{
display:inline;
color:#ffffff;
}

form input{
//border :1px solid #06b1b3;
border:0;
}
/*errを効かせるため空のrelativeをwrapperと同じ幅で作成*/
#relative_null{
position:relative;
width:980px;
margin:0 auto;
}
#err{
position:absolute;
margin-top:10px;
margin-left:150px;
}


div.fusen{
float: left;
width: 118px;
height:58px;
color:#efefef;
background:#f43e7e;
padding-left:5px;
padding-top:5px;
/*配置位置*/
position:absolute;
top:748px;
left:54%;
margin-left:318px;
border-radius:14px;
-webkit- border-radius:20px;/*chrome,opera*/
-moz- border-radius:20px;/*firefox*/
}



div.yahoo{
color:#fcfcfc;
position:absolute;
left:52%;
margin-left:26px;
top:735px;
width: 290px;
height:50px;
/*background:#454545;*/
background-color:rgba(69,69,69,0.7);
/*opacity: 0.7;だと上の文字も半透明になってしまう*/
}


/*clearは上マージンを増加させるプロパティなので、margin-topの値を「上書き」します*/
/*clearした後にfloatする事で、改行した後に左揃え*/
div#img{
/*HTMLタグのimgタグに直接style="border-radius"でないと効かない*/
clear:both;
float:left;
width:720px;
height:390px;
padding:0px;
border:1px solid #ffffff;
margin-right:5px;
margin-left:10px;
margin-top:10px;
border-radius:10px;
-webkit- border-radius:10px;
-moz- border-radius:10px;
}


div#twitter{
float:left;
width:195px;
height:400px;
padding:4px;
border:4px dashed #999999;
margin-right:5px;
margin-left:5px;
margin-top:10px;
/*background-color:#fcfcfc;*/
}
/*twitterのヘッダー*/
.twtr-hd { 
display: none; /*ヘッダー非表示*/ 
} 


div#google{
float:left;
color:#efefef;
width:300px;
height:260px;
padding:3px;
//border:3px dashed #ff9999;
margin-right:4px;
margin-left:14px;
margin-top:-7px;
/*background-color:#fcfcfc;*/
}

div#pc{
color:#fcfcfc;
float:left;
width:180px;
height:220px;
padding:10px;
//border:1px solid #ffffff;
border:3px dashed #ff9999;
margin-right:12px;
margin-left:10px;
margin-top:2px;
background-color:#333333;
}

div#youtube{
float:left;
position:relative;
width:340px;
height:190px;
padding:8px;
border:1px solid #222222;
margin-right:15px;
margin-left:10px;
margin-top:-40px;

/*マイナスにすればクリアした下段も上に詰められる*/
background-color:#fcfcfc;
}
.text2{
color:#333333;
margin-left:15px;
margin-right:0px;
/*float:left;*/
}

div.color{
/*親要素にrelativeを指定する事で子要素のabsoluteが親始点*/
position:absolute;
z-index: 5;
margin-left:-8px;
margin-top:-195px;
width:7px;
height:208px;
background:#06b1b3;
}

div#update{
float:left;
color:#efefef;
width:330px;
height:30px;
padding:8px;
border:3px double #efefef;
margin-right:10px;
margin-left:10px;
margin-top:10px;
background-color:#222222;
box-shadow:3px 4px 8px white;
/*横方向のづれ　縦方向のづれ　ぼかし #000*/
border-radius:12px;
}




/*広告*/
div#ad{
clear:both;
width:auto;
margin-left:10px;
background:#000000;
height:55px;
}
.text{
color:#efefef;
margin-left:5px;
margin-right:20px;
float:left;
}

/*フッター*/
div#footer{
clear:both;
color:#efefef;
width:auto;
background:#222222;
height:25px;
padding-left:2px;
}