@charset "shift_jis";

/* Reset
-------------------------------------------------------------------------------*/

html {color: #000;background: #FFF;}

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
th,
td {margin: 0;padding: 0;}

table {border-collapse:collapse;border-spacing:0;}

img {border: 0;}

address,
caption,
cite,
em,
strong,
th,
var,
optgroup {font-style: inherit;font-weight: inherit;}

del,
ins {text-decoration: none;}

li {list-style: none;}

caption,
th {text-align: left;}

h1,
h2,
h3,
h4,
h5,
h6 {font-size: 100%;font-weight: normal;}

q:before,
q:after {content: '';}

/*IE */
legend {color: #000;}

input,
button,
textarea,
select,
optgroup,
option {
	font-family: inherit;
	font-size: inherit;
	font-style: inherit;
	font-weight: inherit;
}

/*@purpose To enable resizing for IE */
/*@branch For IE6-Win, IE7-Win */
input,
button,
textarea,
select {
	*font-size: 100%;
}

/* Font
-------------------------------------------------------------------------------*/

body {font:14px "ヒラギノ Pro W3", "Hiragino Kaku Gothic Pro", 'メイリオ',Meiryo, Osaka, "ＭＰＳゴシック", "MS PGothic", sans-serif;
	line-height: 1.75em;
	letter-spacing: 0.05em;
}

/* basic
-------------------------------------------------------------------------------*/

a {
    text-decoration: none;
}

a:link {
	color: #3333CC;
}

a:visited {
    color: #3333CC;
}

a:hover {
    text-decoration: underline;
    color: #EB6100;
}

a:hover img {     filter: alpha(opacity=70);
    -moz-opacity:0.70;
    opacity:0.70;}
a:active {
    color: #EBC300;
}

a:focus {
    outline: none;
}



/* layout
-------------------------------------------------------------------------------*/

body {background-color: #E4E4E4;;color:#000;}

strong {color:#0066FF; font-weight:bold; letter-spacing:1px;}

div#wrapper { margin: 0 auto 0 auto; width:780px; padding:0; background-color: #fff}

div#header { padding:25px 0 0 0; }

h1 img{padding:0;}

div#contents {padding:15px 30px; }

div#contents p { margin:0; padding:10px 0; font-size:17px;}

div#contents p.area {margin:10px; padding:10px; border:solid 2px #ccc; font-size:14px; line-height:1.2;}

div#contents img.hidden {display:none;}

div#contents ul.item {margin:15px 0 0 0; padding:10px 70px 25px 20px; font-size:14px;}

div#contents ul.item li {margin:-10px 0 10px 10px; padding: 0 0 10px 15px;list-style:circle;}

h2 {height:24px; margin:0 0 10px 0; padding:2px 5px 2px 13px; color:#333333; font-weight:bold; font-size:20px; border-left:12px solid #FFCC00; background-color:#E4E4E4 ;}

div.post {margin:15px 0 0 40px; padding-top:5px;}

div.post p { color:#663300; font-weight:bold;}

div#contents ul.note {margin:0 50px 50px 40px; padding:5px 0; border-top:2px #999 dotted;}

div#contents ul.note li{text-indent:-1em; padding-left:1em;}

dl.examples {margin-top:20px;}

dl.examples dt {clear: left; float: left;height:80px; margin: 0 0 0.8em 0; width: 4.5em; background:url(imgs/example_bg.gif) no-repeat; letter-spacing:3px; padding-left: 5px;color: #000; font-size:17px;}

dl.examples dd { margin:0 8em 0.2em 6em; padding-left:2em; border:solid 1px #ccc; text-indent:-1em;}

dl.footer { clear:both;	height:40px; margin: 20px 0 0 0; padding: 15px 24px 30px 90px;	background: url(imgs/footer_bg.gif);text-align:center;}

dl.footer dd {float: left; margin-right: 50px;}

dl.footer a { display: block; color:#000;}

dl.footer a:hover {	filter: alpha(opacity=60); opacity: 0.6;}

/* Facebook
-------------------------------------------------------------------------------*/
a.fb-like {
	display: inline-block;
	padding-left: 20px;
	padding-right: 2px;
	border: solid 1px #CAD4E7;
	border-radius: 4px;
	-moz-border-radius: 4px;
	height: 20px;
	line-height: 20px;
	background: url([アイコンのURL]) no-repeat 2px center #ECEEF5;
	text-decoration: none;
	color: #3B59B8;
}
a.fb-like:hover {
	background: url([マウスオーバー時のアイコンのURL]) no-repeat 2px center #ECEEF5;
	border: solid 1px #9DACCE;
}