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

/* --- BODY --- */
body{ margin:0px auto 0px auto; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-size:12px; background-image:url(../image/back.png);}
a{text-decoration:none;}
a:link,a:active,a:visited{color:midnightblue;}
a:hover{color:orange;}
a img{border:none;}

/* --- COUNTAINER --- */
#container{width:990px; margin:5px auto 0px auto;}

/* --- WINDOW --- */
#window{float:left; width:990px; height:55px; margin:0px auto;}
.top_pic a{display:block; width:300px; height:53px; position:relative; top:5px; left:445px;}
#mail_box{width:180px; height:36px; list-style:none; position:relative; top:-32px; left:775px;}
#mail_box ul{margin:0px; padding:2px;}
.tw{float:left; width:30px; height:30px; margin:0px 7px 0px 0px; list-style:none; border:1px solid green;}
.tw:hover{position:relative; top:1px; left:1px;}
.fb{float:left; width:30px; height:30px; margin:0px 7px 0px 0px; list-style:none; border:1px solid green;}
.fb:hover{position:relative; top:1px; left:1px;}
.ma{float:left; width:85px; height:30px; margin:0px; list-style:none;}

/* --- BAR ---*/
#v_line{float:left; width:10px; height:85px; position:relative; top:-55px; left:763px;}
/* --- BAR ---*/
#designbar{float:left; width:990px; height:10px; margin:5px auto 10px auto;} 

/* --- INFO --- */
#info_outline{float:left; width:990px;}
#info{float:left; width:762px;}

/* --- AREASIDE_1 ---*/
#areaside_1{float:left; width:452px; height:220px; margin:0px;}
.areaside_1_box{width:490px; height:295px; position:relative; top:-75px; left:-40px;}

/* --- AREASIDE_2 ---*/
#areaside_2{float:left; width:303px; height:220px; background-image:url('../image/infoboard_1.png');}

/* --- AREASIDE_3 ---*/
#areaside_3{float:left; width:205px; height:350px; margin:10px 0px 0px 0px; background-image:url('../image/banerboard.png')}

/* --- BANER ---*/
#baner{width:180px; margin:90px auto;}
#baner ul{margin:0px; padding:0px;}
#baner li{width:175px; height:50px; margin:0px auto 10px auto; list-style:none;}
#baner a{display: inline-block;
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
    -ms-transition: 0.5s;
    transition: 0.5s;}
#baner a:hover {
    -webkit-transform: scale(1.1,1.1);
    -moz-transform: scale(1.5,1.5);
    -o-transform: scale(1.5,1.5);
    -ms-transform: scale(1.5,1.5);
    transform: scale(1.5,1.5);}

/* --- AREASIDE_4 ---*/
#areaside_4{float:left; width:538px; margin:10px 0px 0px 10px; border:1px solid pink;}

/* --- BAR ---*/
#v_line2{float:left; width:10px;}


/* ---- RIGHT_SIDE ----*/
#right_side{float:right; width:210px; margin:0px auto;}
#navi{width:210px; margin:0px auto;}
#navi ul{width:210px; margin:0px; padding:0px;}
#navi li{width:210px; height:45px; margin:0px 0px 5px 0px; list-style:none;}
.fusen:hover{position:relative; top:2px; left:2px;}

/* --- TWITTER ---*/
#twitter_title{width:210px; height:50px; margin:20px 0px 5px 0px;}
#twitter_box{margin:0px; border:1px solid pink;}


/* ---- FOOTER ----*/
#footer {float:left; color:white; clear:both; width:100%; height:100px; margin:5px auto; background-color:#ffb6c1;}
#footer a:link,a:active,a:visited{color:white;}
#footer a:hover{color:#800000;}
#foot{width:730px; margin:15px auto;}
.mark{float:left; margin:0px;}
.footer_navi{float:left; margin:0px 0px 0px 10px; font-size:11px;}