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

@charset "utf-8";

/*----------------------------------
Reset All--start
-----------------------------------*/
html,body,header,div,h1,h2,h3,h4,h5,ul,li,img,table{margin:0; padding:0;}

/*----------------------------------
Body
-----------------------------------*/
body{margin:0 auto; padding:0; font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; color: #0f1b77; width: 1200px;}
#main0{margin:5px 0 0; padding:0; overflow:hidden;}

/*----------------------------------
header
-----------------------------------*/
#header{margin: 0;}
#header #logo{margin:0; padding:1em 0;}

/* CSS Document */
#gmenu1{margin: 0; width: 100%; }
#gmenu1 ul{margin: 0; padding: 0; width: 100%;}
#gmenu1 li{margin: 0; padding: 1em 0; width: 19.825%;   background: #13a4f0; font-size: 16px; list-style: none; 
    color: #fff; text-align: center; border-right: 2px solid #fff; float: left; font-weight: bold;}
#gmenu1 li a{text-decoration: none; color: #ffffff; display: block;}
#gmenu1 li.ima{background: rgba(9, 193, 248, 0.32);}
#gmenu1 li.ima a{color: #0f1b77; font-weight: bold;}
#gmenu1 li:hover{background:rgba(255, 20, 147, 0.33); }
#gmenu1 li a:hover{color:deeppink;}

/*----------------------------------
main
-----------------------------------*/
#main1{margin: 0 5px 0 0; padding: 0; width: 64.75%; float: left; border:1px solid #0f1b77;}
h1{margin: 0; padding: 1em 0 1em 3.75em; background:#cbf0f5; font-size: 20px; color: #84293e; position: relative;}
h1:before{position: absolute; top: 0; left: 3px; margin: 0 0.5em; content: url(../img/pengin-ani02.gif); vertical-align: middle;}

h2{margin: 0; padding: 0.5em; font-size: 18px; color: #84293e; background:rgba(203, 240, 245, 0.33);}
h2:before{content: 'h2:'; margin-right: 0.25em; color: deeppink;}

#one{margin: 0;}
#one p{margin: 0; padding: 0.5em;}

/*----------------------------------
ad
-----------------------------------*/
.ad{text-align: center;}

/*----------------------------------
side
-----------------------------------*/
#sidemenu{margin:0 0 -32768px 0; padding:0 0 32768px 0; width: 34.5%; height: auto; font-size: 18px; float: left; border:1px solid #0f1b77;}
/* CSS Document */
#sidemenu h3{margin: 0; padding: 1em 0 0.5em 2em; background: #13a4f0; color: #fff; position: relative;}
#sidemenu h3:before{position: absolute; top: 10px; left: 0; margin:0; padding: 0.25em; content: url(../img/pengin-ani03.gif); }

#sidemenu li{margin: 0; padding: 0.75em; font-size: 16px; font-weight: bold; list-style: none; border-bottom: 1px solid #0f1b77; position: relative;}
#sidemenu li a{text-decoration: none; color: #0f1b77; display: block;}

#sidemenu li.sq a:before{content: '■'; color: rgba(9, 193, 248, 0.32); margin-right: 0.25em; font-size: 20px; 
text-shadow: 1px 1px #01def0;}

#sidemenu li.now{background: rgba(9, 193, 248, 0.32);}
#sidemenu li.now a{padding-left: 2.25em; color: #0f1b77;}
#sidemenu li.now a:before{position: absolute; top: 3px; left: 3px; content: url(../img/himawari.gif);}

#sidemenu li:hover{background: rgba(255, 20, 147, 0.33);}
#sidemenu li a:hover{color: #fff;}

#sidemenu li.new{}
#sidemenu li.new a:after{margin-left: 0.5em; content: 'NEW!'; color: deeppink;}


/*----------------------------------
others
-----------------------------------*/
.clear{clear:both;}
.pink{color: deeppink;}
.px20{font-size: 20px;}
.px22{font-size: 22px;}

/*----------------------------------
footer
-----------------------------------*/
footer{margin:0; padding:0.5em; background: #cbf0f5; color:#84293e;}
footer p{text-align: center;}
footer p a{text-decoration:none; color:#fff;}

/*----------------------------------
media
-----------------------------------*/
@media (max-width : 1200px ){
    body{width: 100%;}
}

@media (min-width: 801px){
}

@media (max-width: 800px){
    #main1,#sidemenu{width:100%;}
	#gmenu1{display:none;}	
	img{max-width:100%;}
}
	
@media (max-width: 375px){
    h1{font-size: 17px;}
}

@media (max-width: 320px){
}