/*メモ　マージン・パッディング　上　右　下　左*/

/* 全体の設定 */
body{margin:0; text-align:center; background:#ffffff; padding:0;
	font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;, Verdana, Geneva, Arial, Osaka, Helvetica, sans-serif;}
img{border:none; margin:0;padding:0; line-height:0; display:block;}
a{color:#0587cc; text-decoration:none; outline: none;}
a:hover{color:#0587cc; text-decoration:underline; }
h1,h2,h3{margin:0;padding:0;}

h1{color:#483c3c;margin:10px 0 0 0;
	line-height:1.6;font-size:150%;padding:10px 0 10px 0;font-weight:normal;
	text-align:left;}
h2{color:#483c3c;border-top:solid 1px #e6e6e8;margin:40px 0 0 0;
	line-height:1.6;font-size:150%;padding:15px 0 5px 0;font-weight:normal;}
p {padding:0; margin:5px 0 25px 0;line-height:1.6;}

.clear {clear:both;}  
.clear hr {display:none;}



/* 上部・中部ブロック要素 */

#gb {background:#66beff;margin:0;padding:0;
position:static; overflow: hidden; clear:both;}
#gnavi {clear:both; padding:0; margin: 0 auto;
	min-width: 320px; max-width: 960px;
	background:#66beff; text-align:left; position:relative; overflow: hidden;}
/* 
* html  gnavi { 
	width : 960px; height : 1%;
	width : expression(  (document.documentElement.clientWidth > 960)? "940px" :(document.documentElement.clientWidth < 320)? "300px" :  "auto");}
 */

.sitename{color:#ffffff;font-weight:bold;
font-size:25px; float:left;height:56px;line-height:56px;margin:0 0 0 10px;}
#gnavi a{text-decoration:none; color:#ffffff;}

#gnavi img{margin:0; height:16px;width:16px; line-height:0;
padding:19px 0 21px 0; vertical-align:middle;}
#gnavi ul {float:right; padding:0px; margin:0; position:relative;}
#gnavi li {float:left;  padding:0; margin:0; line-height:56px;  font-size:16px;
	list-style-type:none; white-space:nowrap; position:relative; text-align:center;}
#gnavi li a {color:#ffffff; padding:0 12px 0 12px; display: block; text-decoration:none;}
#gnavi li a:hover { color:#ffffff; background: #85cdff;}


#sb{background:#f8f8f8; text-align:center;padding:10px;margin:0;
border-top:solid 1px #e6e6e8;}
#snavi {clear:both; padding:0; margin: 0 auto;
	min-width: 300px; max-width: 960px;
	 text-align:left; position:relative; overflow: hidden;}
/* 
* html  snavi { 
	width : 960px; height : 1%;
	width : expression(  (document.documentElement.clientWidth > 960)? "940px" :(document.documentElement.clientWidth < 300)? "280px" :  "auto");}
 */
#snavi ul {float:right; padding:0px; margin:0; position:relative;}
#snavi li {float:left;  padding:0; margin:0 0 0 10px;
	width:130px;height:30px;list-style-type:none; white-space:nowrap; position:relative; text-align:center;}



.container { clear:both; position:static; text-align:center;
	padding:10px; min-width: 300px; max-width: 940px; margin: 0 auto;
	background:#ffffff; font-size:100%;}
.container2 { clear:both; position:static; text-align:center;
	margin: 0 auto;
	background:#f6f6f6; font-size:100%;}
.main {clear:both; padding:0; margin:0 0 10px 0;
	color:#333333; text-align:left;}
.main2 { clear:both; position:static; text-align:left;
	padding:30px 10px 50px 10px; min-width: 300px; max-width: 940px; margin: 0 auto;
	font-size:100%;color:#333333; }

.sub {clear:both; padding:20px 0 10px 0; margin: 0 auto;
	min-width: 300px; max-width: 940px;  text-align:center;
	position:relative; overflow: hidden;margin: 0 0 10px 0;}
.sub ul {float:left; padding:0px; margin:0; position:relative; left:50%;}
.sub li {float:left; white-space:nowrap; position:relative; right:50%;
	padding:0 10px 0 10px; margin:0; text-align:center; list-style-type:none;}
.sub li a {padding:0 10px 0 10px;
	display: block; text-decoration:none;}

.sub2 {clear:both; padding:30px 0 10px 0; margin: 0 auto;border-top:solid 1px #e6e6e8;
	min-width: 300px; max-width: 940px;  text-align:center;
	position:relative; overflow: hidden;margin: 50px 0 10px 0;}
.sub2 ul {float:left; padding:0px; margin:0; position:relative; left:50%;}
.sub2 li {float:left; white-space:nowrap; position:relative; right:50%;
	padding:0 10px 0 10px; margin:0; text-align:center; list-style-type:none;}
.sub2 li a {padding:0 10px 0 10px;
	display: block; text-decoration:none;}

.imgc2{float:left;width:96px;height:96px; 
margin:17px;padding:10px;background:#ffffff;border-radius: 5px;
box-shadow: 1px 2px 5px #dadada;-webkit-box-shadow: 1px 2px 5px #dadada;
}

.iconsampletitile{color:#483c3c;margin:0;
	line-height:1.6;font-size:150%;padding:0 0 5px 0;font-weight:normal;}

.imm1{float:left;width:256px;
margin:17px;padding:10px;background:#ffffff;border-radius: 5px;
box-shadow: 1px 2px 5px #dadada;-webkit-box-shadow: 1px 2px 5px #dadada;
}
.imm1 img{width: 256px; height:256px; margin:0 0 10px 0;padding:0;}

.bannerdl{
	margin:0;padding:0;

}
.bannerdl dl{
	margin:20px 0 20px 0;padding:0;

}
.bannerdl dt{
	background:#f8f8f8;
	margin:30px 0 10px 0;padding:10px;
}
.bannerdl dd{
	margin:10px 0 10px 0;padding:0;
}

.bannerdl img{
	padding:10px;
	margin:0 0 15px 0;
	border:solid 1px #ececec;
	background:#ffffff;
}
.bannerdl img:hover{
	background:#ececec;
}


.newsul{margin:0;padding:0;}
.newsul ul{margin:0;padding:0;list-style:none;}
.newsul li{list-style:none;margin:10px 0 10px 0;padding:0;}




/* キャンバスのスタイル border-radius: 10px;*/
.morl{ margin:0;padding:0;line-height:1.6;}
.cr{display:block;float:left;margin:0 0px 10px 20px;padding:0;
background:#ffffff;width:300px;}
.splink{font-size:80%; color:#919191;line-height:1.6;margin:5px 0 5px 0;padding:0;}

#cb{background:#ffffff; text-align:center;padding:0;margin:0;}
#canvasstart { clear:both;margin:10px 0 10px 0; padding:30px 0 30px 0;
position:static; text-align:center; 
	 min-width: 320px; max-width: 960px; margin: 0 auto;
	font-size:100%;
	 overflow: hidden;}
#canvasstart hr{border:none; border-bottom:solid 2px #ececec; max-width:960px;
	margin:0 0 30px 0;padding:0;
	clear:both;
}
#fmall{float:left; margin:0; padding:0; }
#canvasarea{float:left;margin:0 20px 10px 20px; padding:0;width:280px;
	}
#fmc{float:left;margin:0; padding:12px;
	position:relative; width:256px; height:256px; 
	background:#ffffff;border-radius: 5px;
	box-shadow: 1px 2px 10px #e2e2e2;-webkit-box-shadow: 1px 2px 10px #e2e2e2;
	color:#2b2b2b; }
#mixed,#bg,#bh,#cl,#co,#ch,#eb,#ey,#ns,#be,#mo,#ml,#sh,#ba,#ha,#gl,#sk{
 position: absolute; left: 12px; top: 12px;}

/*#ba {transform: rotateY(180deg);}*/

#drmenu {clear:both;margin:0 0 10px 0;padding:0;height:66px;}
#drmenu input{ margin;0;padding:0;height:46px;
	float:left;display:block;cursor:pointer;
	text-align:center; border:none; font-size:20px;
	font-weight:bold;border-radius: 5px;
	box-shadow: 1px 2px 10px #e2e2e2;-webkit-box-shadow: 1px 2px 10px #e2e2e2;
	}
.download{background:#ffffff;color:#919191; width:190px;position: relative; left:0; top:20px;}
.random{background:#ffffff;color:#919191; width:80px;position: relative; left:10px; top:20px;}

#drmenu input:hover{background:#66beff;color:#ffffff;}
#drmenu form{margin:0; padding:0;}

#fmm{
float:left; width:300px;background:#f6f6f6;margin:0 10px 20px 10px;padding:0;
background-image:url(https://www.iconpon.com/img/fmmbg.png);
background-repeat: repeat-y;
background-position:left top;
}
#tabs {float:left;margin:0;padding:0;width:100px;height:100%;} 
#tabs ul {margin:0;padding:0;} 
#tabs li {float: left; margin:0; padding:7px 10px 7px 10px;width:80px;
	color: #919191; background:#ffffff; list-style: none;
	cursor:pointer; text-align:left;}
#tabs li:hover{color:#2b2b2b;}
#tabs li.selected{ color: #2b2b2b; background:#f6f6f6;
	cursor:default; text-align:left;}

#textarea{float:left; margin:0; padding:0;width:200px; color:#2b2b2b;
	 text-align:left;}
#textarea input{cursor:pointer;font-size:16px;}
#textarea span{margin:0;padding:0;}
#text_1,#text_2,#text_3,#text_4,#text_5,
#text_6,#text_7,#text_8,#text_9,#text_10,
#text_11,#text_12,#text_13{margin:0; padding:10px;overflow: hidden;}

.tebo{border-top:solid 1px #e1e1e3;}
.spt {line-height:30px;font-size:90%;
	float:left;height:30px;margin: 0; padding:5px 0 0 0; width:180px;
	position: relative; text-align:center;}
.pnd {line-height:34px;
	float:left;height:42px;margin:0 0 2px 0; padding:0; width:180px;
	position: relative; text-align:center;}
.pnd input{box-shadow: 1px 2px 5px #dadada;-webkit-box-shadow: 1px 2px 5px #dadada;
	display:block;width:34px; height:34px; background:#ffffff; border:none;
	margin:0; padding:0; color:#2b2b2b; border-radius: 5px;}
.pnd input:hover{background:#66beff; color:#ffffff;}
.pb{position: absolute; left:0; top:0px;}
.nb{position: absolute; right:0; top:0px;}

.posiu{float:left;margin:0 0 4px 0;padding:0 0 4px 0;}
.posiu ul{float:left;margin:0;padding:0;width:180px;}
.posiu li{float:left;position: relative;
margin:0;padding:0;width:60px;height:46px;display:block;}
.posiu input{box-shadow: 1px 2px 5px #dadada;-webkit-box-shadow: 1px 2px 5px #dadada;
	width:56px;height:34px;display:block;background:#ffffff; border:none;
	margin:0; padding:0; color:#2b2b2b; border-radius: 5px;}
.posiu input:hover{background:#66beff; color:#ffffff;}
.posl{position:absolute;left:0; top:6px;}
.posc{position:absolute;left:2px;;right:2px; top:6px;}
.posr{position:absolute;right:0; top:6px;}

.cold{margin:0;padding:0;}
.cold dl{float:left; margin:0 0 2px 0; padding:0;line-height:34px;
	border-bottom:solid 1px #483c3c;}
.cold dt{float:left; margin:0; padding:0; width:180px;text-align:center;
	height:30px;line-height:30px;font-size:90%;}
.cold dd{float:left; margin:0; padding:0; width:180px;
	position: relative; text-align:left;}

.cold img{display:block; float:left; height:24px; width:24px;
	margin:4px 2px 4px 2px;padding:0;cursor:pointer;
	border-radius: 16px;}
.cold img:hover{border:solid 4px rgba(255,255,255,0);
box-shadow: 0px 0px 2px 2px #ffffff;-webkit-box-shadow: 0px 0px 2px 2px #ffffff;}

.csed_1{border:solid 4px #ffffff;}
.csed_2{border:solid 4px rgba(255,255,255,0);
box-shadow: 0px 0px 2px 2px #ffffff;-webkit-box-shadow: 0px 0px 2px 2px #ffffff;}

#skx1{background:#fcedd1;}
#skx2{background:#ffe5d1;}
#skx3{background:#ffd6be;}
#skx4{background:#fccea4;}
#skx5{background:#f9c0ad;}
#skx6{background:#e8aa82;}
#skx7{background:#cb8d63;}

#hrx1{background:#372e2c;}
#hrx2{background:#4a311d;}
#hrx3{background:#443a3f;}
#hrx4{background:#66453a;}
#hrx5{background:#7d4e2e;}
#hrx6{background:#c15d3d;}
#hrx7{background:#c36b23;}
#hrx8{background:#a9926a;}
#hrx9{background:#c3a77d;}
#hrx10{background:#ebdbb3;}
#hrx11{background:#dad7d3;}
#hrx12{background:#fdf4e7;}

#eyx1{background:#503826;}
#eyx2{background:#63452f;}
#eyx3{background:#76553d;}
#eyx4{background:#895b51;}
#eyx5{background:#8f6a46;}
#eyx6{background:#56a3b1;}

#clx1{background:#59493e;}
#clx2{background:#695850;}
#clx3{background:#b76937;}
#clx4{background:#c49c6c;}
#clx5{background:#ead6a5;}
#clx6{background:#d71d1c;}
#clx7{background:#f84469;}
#clx8{background:#f65f64;}
#clx9{background:#f68f8f;}
#clx10{background:#fec5c5;}

#clx11{background:#f36426;}
#clx12{background:#f48a30;}
#clx13{background:#f3ac14;}
#clx14{background:#f4de30;}
#clx15{background:#faf6e5;}

#clx16{background:#6c7720;}
#clx17{background:#9d9a5d;}
#clx18{background:#66c253;}
#clx19{background:#7dc253;}
#clx20{background:#cae68c;}

#clx21{background:#719dc6;}
#clx22{background:#65b7d3;}
#clx23{background:#7abebc;}
#clx24{background:#74dae2;}
#clx25{background:#cae7f3;}

#clx26{background:#323f5f;}
#clx27{background:#5156a3;}
#clx28{background:#506abd;}
#clx29{background:#8378a0;}
#clx30{background:#be7c9a;}

#clx31{background:#3d403f;}
#clx32{background:#5f5f53;}
#clx33{background:#f6f4f2;}


#glx1{background:#4a3f3a;}
#glx2{background:#79764a;}
#glx3{background:#ac8650;}
#glx4{background:#e85f5f;}
#glx5{background:#f9b1b1;}

#glx6{background:#d9c572;}
#glx7{background:#7b9a3e;}
#glx8{background:#4f7892;}
#glx9{background:#d9d9d1;}
#glx10{background:#f8f4ef;}


#bgx1{background:#71645a;}
#bgx2{background:#bd9272;}
#bgx3{background:#e1caa6;}
#bgx4{background:#d7cdbf;}
#bgx5{background:#efc9ab;}

#bgx6{background:#f98787;}
#bgx7{background:#fcccc9;}
#bgx8{background:#fdcfd8;}
#bgx9{background:#fee2e2;}
#bgx10{background:#f3e8de;}

#bgx11{background:#f7986a;}
#bgx12{background:#fae977;}
#bgx13{background:#ffe3b0;}
#bgx14{background:#ebe6c3;}
#bgx15{background:#f1edd6;}

#bgx16{background:#93b97b;}
#bgx17{background:#c5d385;}
#bgx18{background:#8ebcaa;}
#bgx19{background:#78d4d4;}
#bgx20{background:#b3e6e6;}

#bgx21{background:#8adbfd;}
#bgx22{background:#daf0fa;}
#bgx23{background:#697795;}
#bgx24{background:#82afbf;}
#bgx25{background:#afc6cf;}

#bgx26{background:#dfdcf2;}
#bgx27{background:#ddbfda;}
#bgx28{background:#e5e8e7;}




/* 下部ブロック要素 */
#fb {background:#ffffff;margin:50px 0 0 0;padding:0;
position:static; overflow: hidden; clear:both;}
#fnavi {clear:both; padding:10px 0 10px 0; margin: 0 auto;border-top:solid 1px #e6e6e8;
	min-width: 320px; max-width: 960px; background:#ffffff; text-align:center;
	position:relative; overflow: hidden;}

/* 
* html  fnavi { 
	width : 960px; height : 1%;
	width : expression(  (document.documentElement.clientWidth > 960)? "940px" :(document.documentElement.clientWidth < 320)? "300px" :  "auto"); }
 */

#fnavi ul {float:left; padding:0px; margin:0; position:relative; left:50%;}
#fnavi li {float:left; white-space:nowrap; position:relative; right:50%;
	padding:0; margin:0; text-align:center; line-height:46px; list-style-type:none;}
#fnavi li a {padding:0 10px 0 10px;
	display: block; text-decoration:none;}
#fnavi li a:hover {background: #fcfcfc;text-decoration:underline;}

#fb2 {background:#f9f9f9;margin:0;padding:0;border-top:solid 1px #e6e6e8;
position:static; overflow: hidden; clear:both;}	
#footer {clear:both; position:static;
	padding:10px; min-width: 300px; max-width: 940px;
	margin: 0 auto; 
	text-align:center; font-size:100%; overflow: hidden;}

/* 
* html  footer { 
	width : 940px; height : 1%;
	width : expression(  (document.documentElement.clientWidth > 940)? "920px" :(document.documentElement.clientWidth < 300)? "280px" :  "auto"); }
 */

#footer hr { clear:both; padding:0; margin:0 0 10px 0;
	width:100%; height:1px; border:none; border-top: solid 1px #e1e1e3;}
#footer p{ font-size:80%; line-height:1.6; color:#333333;}


#fmnavi{float:left; width:100%;
	padding:0; margin:15px 0 25px 0; position: relative; overflow: hidden;}

#fmnavi ul {float:left; padding:0; margin:0; position:relative; left:50%;}
#fmnavi li {float:left; white-space:nowrap; width:100px;height:100px;
	padding:0; position:relative; right:50%;
	margin:0; text-align:center; list-style-type:none; overflow: hidden;}

#fmnavi li a { padding:0; display: block;
	width:100%;height:100px; text-decoration:none; position: relative;}

/*   オフマウス  */
#navi01 a{ background:url(../img/fmicon.png) ;background-position: 0 0;}
#navi02 a{ background:url(../img/fmicon.png) ;background-position: -100px 0;}
#navi03 a{ background:url(../img/fmicon.png) ;background-position: -200px 0;}
#navi04 a{ background:url(../img/fmicon.png) ;background-position: -300px 0;}
#navi05 a{ background:url(../img/fmicon.png) ;background-position: -400px 0;} 
/*   オンマウス  */
#navi01 a:hover{ background-position: 0 -100px;}
#navi02 a:hover{ background-position: -100px -100px;}
#navi03 a:hover{ background-position: -200px -100px;}
#navi04 a:hover{ background-position: -300px -100px;}
#navi05 a:hover{ background-position: -400px -100px;}


.fcul{clear:both; padding:0; width:100%;
	margin: 0 auto; text-align:center; position:relative; overflow: hidden;}

.fcul ul{float:left; padding:0px; margin:0 0 10px 0; position:relative;left:50%;}
.fcul li {float:left; white-space:nowrap; position:relative; right:50%;
	padding:0; margin:0; text-align:center; line-height:45px; list-style-type:none;}
.fcul li a {color:#666666;padding:0 10px 0 10px; display: block; text-decoration:none;}
.fcul li a:hover{color:#2b2b2b;text-decoration:underline;}