@charset "utf-8";
/*
Theme Name:KazStyle
*/


/*---------------------------------
	RESET
-----------------------------------*/
html, body, div, h1, h2, h3, h4, h5, h6,
p, blockquote, pre, address,
ul, ol, li, dl, dt, dd,
table, th, td, form, fieldset {
	margin: 0;
	padding: 0;
	font-size: 100%;
	font-family: "メイリオ",Verdana,Arial,Helvetica,sans-serif,Meiryo,"Hiragino Kaku Gothic Pro W3","ヒラギノ角ゴ Pro W3","Osaka","MS P Gothic","ＭＳ Ｐゴシック";
}

ul li, ol li {
	list-style-type: none;
}


img, input, select, textarea {
	vertical-align: middle;
}
address, em {
	font-style: normal;
}
hr {
	display: none;
}

p{
	line-height:150%;
	color:#666;
	margin:0 0 20px 0;
}

img{
	border: 0;
	margin:0;
	padding:0;
	display:inline-block;
	position:relative;
	zoom:1;
}


/*---------------------------------
	SETTING LINK
-----------------------------------*/
a,
#post h1,
.post h2 a,
#post a,
.post a,
#side a{
	color:#e6117d;
	}
.post h2 a:hover{
	color:#DDD;
	}

#post a,
.post a,
#side a{
	text-decoration:underline;
	}
#post a:hover,
.post a:hover,
#side a:hover{
	text-decoration:none;
	}


/*---------------------------------
	SETTING BODY COLOR
-----------------------------------*/
body{
	background:#EEE url(./img/common/body_bg.jpg) repeat;
	}

#header{
	background:#FEFEFE;
	border-bottom:1px solid #CCC;
	}

#post,
.post{
	background:#FFF;
	}


#post,
#post p,
.post,
.post p{
	color:#333;
	}
#post img,
.post img{
	background:#DDD;
	}
#side h3{
	background:#e6117d;
	}

#post h2{
	color:#FFF;
	background:#C41230;
	border-top:1px solid #666;
	border-left:1px solid #666;
	border-right:1px solid #000;
	border-bottom:1px solid #000;
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */
    -webkit-box-shadow: 0 10px 6px -6px #222;
    -moz-box-shadow: 0 10px 6px -6px #222;
    box-shadow: 0 10px 6px -6px #222;
	}
#post h3{
	color:#333;
	border-left:10px solid #C41230;
	}
#post h4{
	color:#333;
	border-left:16px solid #333;
	}




/*---------------------------------
	LINK
-----------------------------------*/
a{outline:0;text-decoration: none;}
a:active{color:inherit;}
a:visited{}
a:hover{}
a img{border:0;}
a:hover img{opacity: 0.7;}

strong,b{background:lightyellow;position:relative;top:0;left:0;padding:2px 5px;}
strike{}
em,i{}
.hide{display:none;}
.show{display:block;}





/*---------------------------------
	HTML5 ELEMENTS (shim)
-----------------------------------*/
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
display:block;
}

	
/*---------------------------------
	PRE & CODE
-----------------------------------*/
code{
font-family: monospace;
border:1px solid lightblue;
padding:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
color:#518BAB;
}

pre{
white-space: pre-wrap;       /* css-3 */
white-space: -moz-pre-wrap !important;  /* Mozilla, since 1999 */
white-space: -pre-wrap;      /* Opera 4-6 */
white-space: -o-pre-wrap;    /* Opera 7 */
word-wrap: break-word;       /* Internet Explorer 5.5+ */
margin: 0px 0px 0px 0px;
padding:5px 5px 3px 5px;
background:#fff;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
box-shadow:inset 0px 0px 7px rgba(0,0,0,0.2);
padding:10px;
margin:0 0 20px 0;
border:1px solid #ddd;
}

/*---------------------------------
	TABLES
-----------------------------------*/
table{
	width:100%
	;margin:0 0 10px 0;
	text-align:left;
	border-collapse: collapse;
	border-spacing: 0;
	}
	thead, tbody{margin:0;padding:0;}
	tr{}
	th, td{padding:7px 10px;
	font-size:0.9em;
	border:1px dotted #ddd;
	text-align:left;
	}
	th{background:#DDD;}
	thead th{font-size:0.9em;padding:3px 10px;border-bottom:1px solid #ddd;}
	tbody tr.last th,
	tbody tr.last td{}


button,
a.btn,
input[type="submit"],
input[type="reset"],
input[type="button"]{
font-family: "Trebuchet Ms", arial, verdana, sans-serif;
cursor:pointer;
}




/*---------------------------------
	HEADER
-----------------------------------*/
#header{
	height:100px;
	margin-bottom:5px;
	}
#header .inner{
	width:1023px;
	margin:0 auto;
	}
#header #ttlLogo{
	float:left;
	margin:12px 0 0 0;
	}
#header p{
	float:left;
	margin:65px 0 0 10px;
	}

#header ul li{
	float:right;
	margin-left:10px;
	}
#header p,
#header ul li a{
	color:#e6117d;
	text-decoration:underline;
	}


/*---------------------------------
	MAIN
-----------------------------------*/
#contents{
	width:1023px;
	margin:0 auto;
	}

#contents #main{
	float:left;
	width:100%;
	}
#contents #main .inner{
	margin:0 325px 0 0;
	}

/*---------------------------------
	POST
-----------------------------------*/
#post,
.post{
	padding:10px 25px;
	margin-bottom:30px;
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */  
	}


#post h1,
.post h2 a{
	display:block;
	font-size:32px;
	line-height:130%;
	margin-bottom:5px;
	text-decoration:none;
	}

ul.postMenu li{
	float:left;
	margin-right:10px;
	font-size:12px;
	background:none;
	}
ul.postMenu li span{
	padding-top:2px;
	}
	
.post div{
	z-index:1;
	position:relative;
	}
.post a.youtube{
	background:url(./img/common/youtube.png) no-repeat 0 0;
	display:block;
	}
.post a.youtube img{
	display:block;
	z-index:-1;
	}
.post p.continue a{
	float:right;
	display:block;
	background:#444;
	color:#FFF;
	padding:5px 10px 5px 0;
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */  
	}


#post #youtube{
	z-index:1;
	position:relative;
	}
#post #youtube a{
	background:url(./img/common/yt00.png) no-repeat 0 0;
	display:block;
	}
#post #youtube a:hover{
	background:url(./img/common/yt01.png) no-repeat 0 0;
	display:block;
	}
#post #youtube a img{
	display:block;
	z-index:-1;
	}

#post h2{
	font-size:25px;
	margin:40px 0 10px;
	padding:10px 0 5px 10px;
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */
    -webkit-box-shadow: 0 10px 6px -6px #222;
    -moz-box-shadow: 0 10px 6px -6px #222;
    box-shadow: 0 10px 6px -6px #222;
	}
#post h3{
	font-size:25px;
	margin:30px 0 10px;
	padding-left:8px;
	clear:both;
	}
#post h4{
	font-size:16px;
	line-height:16px;
	margin:30px 0 7px 0;
	padding-left:5px;
	}

#post,
#post p,
.post,
.post p{
	line-height:170%;
	}
#post img,
.post img{
	padding:4px;
	margin-bottom:10px;
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */  
	}
#post ul,
#post ol{
	margin-top:5px;
	margin-bottom:20px;
	}
#post ul li,
#post ol li{
	padding:10px 0 8px 25px;
	margin-left:10px;
	background: url(./img/common/liBg.png) no-repeat 2px 14px;
	border-bottom:1px dashed #666;
	}
#post ul li.last
#post ol li.last{
	border:none;
	}
#post ul.postMenu{
	background:none;
	border:none;
	margin-bottom:5px;
	}
#post ul.postMenu li{
	background:none;
	border:none;
	padding:0;
	margin:0 20px 0 0;
	}

#post blockquote{
background-color:#FFF;
padding:3em 1em;
position:relative;
color:#333;
}
#post blockquote:before{
content:"“";
font-size:600%;
line-height:1em;
font-family:"ＭＳ Ｐゴシック",sans-serif;
color:#999;
position:absolute;
left:0;
top:0;
}
#post blockquote:after{
content:"”";
font-size:600%;
line-height:0em;
font-family:"ＭＳ Ｐゴシック",sans-serif;
color:#999;
position:absolute;
right:0;
bottom:0;
}

#post ol li{
	background:none;
	list-style-type:decimal;
	list-style-position:inside;
	}

#post #item-list{
	background:#EEE;
	margin-bottom:30px;
	padding:10px 10px 10px 20px;
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */  
	}
#post #item-list h3{
	border-left:none;
	padding:0 0 0 50px;
	line-height:40px;
	color:#222;
	margin:0;
	background: url(./img/common/h3_item.png) no-repeat;
	}
#post #item-list ul{
	background:#EEE;
	border:none;
	margin:0;
	}
#post #item-list ul li{
	background: url(./img/common/liBg_item.png) no-repeat 0 20px;
	border:none;
	margin:0;
	color:#666;
	font-size:12px;
	}
#post #item-list ul li a{
	font-size:25px;
	color:#F90;
	font-weight:bold;
	}

#disqus_thread{
	background:#FFF;
	padding:0 10px;
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */  
	}
#post #disqus_thread p,
#post #disqus_thread h3{
	color:#333;
	}
#post #disqus_thread img{
	padding:0 20px 0 0;
	-webkit-box-shadow: none; /* Safari, Chrome用 */
	-moz-box-shadow: none; /* Firefox用 */
	box-shadow: none; /* CSS3 */ 
	}

#post #disqus_thread ul{
	background:none;
	border:none;
	}
#post #disqus_thread ul li{
	background:none;
	border:none;
	color:#333;
	}

/*	POST BOTTOM
-----------------------------------*/
#post #snsBox{
	background: url(./img/common/snsBg.png) no-repeat;
	width:648px;
	height:158px;
	margin:40px 0;
	position:relative;
	}
#post #snsBox .facebook,
#post #snsBox .twitter{
	position:absolute;
	top:64px;
	}
#post #snsBox .facebook{left:430px;}
#post #snsBox .twitter{left:509px;}

#post #postList{
	width:700px;
	}
#post #postList a{
	display:block;
	float:left;
	width:128px;
	height:260px;
	margin-right:45px;
	font-size:15px;
	}


/*	COMMENT LIST
-----------------------------------*/
.commentlist li{
	margin:30px 0 50px;
	}

.commentlist .comment-author{
	background:#555;
	padding:5px;
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */  
	}
.commentlist li .reply{
	text-align:right;
	}
#post .commentlist ul li{
	background:none;
	margin:0;
	padding:10px;
	}

.form-allowed-tags{display:none;}

/*	PAGEめくり ＆ Profile
-----------------------------------*/
#postNav{ /* Pageめくり */
	padding:15px 0;
	margin-bottom:20px;
	font-family:'Fascinate', sans-serif;
	background:#EEE;
	text-align:center;
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */  
	}
#postNav a{
	padding:10px;
	border:1px dashed #CCC;
	background:#FFF;
	text-decoration:underline;
	}
#postNav a:hover{
	background:#CCC;
	}
#postNav span.current{
	padding:10px;
	border:1px dashed #CCC;
	background:#CCC;
	}

ul#profile{
	margin-bottom:20px;}
ul#profile li{
	font-size:20px;
	font-family:'Righteous', sans-serif;
	}


/*---------------------------------
	SIDE
-----------------------------------*/
#side{
	float:left;
	width:300px;
	margin:0 0 0 -300px;
	}

#side h3{
	font-size:40px;
	text-align:center;
	padding-top:5px;
	color:#FFF;
	line-height:60px;
	height:60px;
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */  
	}

#side ul li{
	clear:both;
	padding:10px 0;
	border-bottom:1px dashed #999;
	}
#side ul li span{
	padding-top:2px;
	}

#side ul.post{
	padding:0;
	background:none;
	}

#side ul.post li img{
	float:left;
	margin-right:10px;
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */  
	}
#side ul.post li span{
	display:block;
	font-size:10px;
	text-align:right;
	color:#999;
	}
#side ul.post li a{
	font-size:18px;
	}

/*---------------------------------
	FOOTER
-----------------------------------*/
#footer{
text-align:center;
padding:20px;
margin:0;
background:#efefef;
border-top:1px solid #ccc;
color:#999;
font-size:0.8em;
text-shadow:0px 1px 1px #fff;
position: relative;
top:0;
left:0;
}
#footer a{
	color:#333;
	}

	#link-top{
	position: absolute;
	top:10px;
	right:10px;
	*right:25px;/*IE 7 ONLY*/
	left:auto;
	color:#666;
	text-decoration:none;
	display: inline-block;
	padding:5px 10px;
	background:#e5e5e5;
	line-height:100%;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	}



/*---------------------------------
	kickstart-icon
-----------------------------------*/
@font-face{ 
font-family: 'IcoMoon';
src: url('./css/fonts/base/icomoon-webfont.eot');
src: url('./css/fonts/base/icomoon-webfont.eot?#iefix') format('embedded-opentype'),
     url('./css/fonts/base/icomoon-webfont.woff') format('woff'),
     url('./css/fonts/base/icomoon-webfont.ttf') format('truetype'),
     url('./css/fonts/base/icomoon-webfont.svg#IcoMoonBase') format('svg');
}

@font-face{ 
font-family: 'IcoMoonSocial';
src: url('./css/fonts/social/icomoonsocial-webfont.eot');
src: url('./css/fonts/social/icomoonsocial-webfont.eot?#iefix') format('embedded-opentype'),
     url('./css/fonts/social/icomoonsocial-webfont.woff') format('woff'),
     url('./css/fonts/social/icomoonsocial-webfont.ttf') format('truetype'),
     url('./css/fonts/social/icomoonsocial-webfont.svg#IcoMoonSocial') format('svg');
}

.icon{
height:0.8em;
width:0.8em;
display:inline-block;
font-size:21px;
color:inherit;
text-decoration:none;
vertical-align:middle;
text-align:center;
line-height:120%;
padding:0;
margin:0;
font-family: 'IcoMoon', arial, sans-serif;
position:relative;
top:-3px;
left:0;
-webkit-font-smoothing: antialiased;
zoom:1;
display:none;
}

.msie .icon{top:-1px;}/* IE ONLY - I know :P */

.icon span{position:relative;top:-49%;left:0.017em;color:inherit;display:inline-block;zoom:1;}
.icon.small{font-size:21px;} /* default */
.icon.medium{font-size:31px;}
.icon.large{font-size:41px;}
.icon.x-large{font-size:61px;}
.icon.social{font-family: 'IcoMoonSocial', arial, sans-serif;}
.icon.social span{top:-23%;}

/* colors (starting point) */
.icon.gray{color:#999;}
.icon.darkgray{color:#666;}
.icon.black{color:#000;}
.icon.white{color:#fff;}
.icon.red{color:#CA2200;}
.icon.blue{color:#3EBDFF;}
.icon.green{color:#A7C210;}
.icon.pink{color:#E9236E;}


/*---------------------------------
	FORMS
-----------------------------------*/

input{
display:inline-block;
*display:inline;
vertical-align: middle;
width:auto;
zoom:1;
margin:0;
border:1px solid #ccc;
font-size:1em;
padding:5px 10px 5px 5px;
text-indent: 5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
background:#fff;
-moz-box-shadow:inset 0px 0px 6px #ccc;
-webkit-box-shadow:inset 0px 1px 6px #ccc;
box-shadow:inset 0px 1px 6px #ccc;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}

	input::-webkit-input-placeholder,
	input:-moz-placeholder,
	.placeholder{
	color:#bbb;
	}
	
	input::-moz-focus-inner {border:0;}

	input[disabled="disabled"], input.disabled{
	color:#999;
	background:#f5f5f5;
	-moz-box-shadow:inset 0px 0px 2px #ddd;
	-webkit-box-shadow:inset 0px 1px 2px #ddd;
	box-shadow:inset 0px 1px 2px #ddd;
	}
	
	/* FOCUS STATES */
	input[type="text"]:focus,
	textarea:focus,
	button:focus,
	a.button:focus,
	select:focus,
	input[type="file"]:focus,
	input[type="password"]:focus{
	-webkit-box-shadow: 0 0 7px #6DB9FF;
	-moz-box-shadow   : 0 0 7px #6DB9FF;
	-o-box-shadow     : 0 0 7px #6DB9FF;
	box-shadow        : 0 0 7px #6DB9FF;
	border: 1px solid #50B1FE;
	outline: none;
	}
	
	/* TRANSITION */
	input[type="text"],
	textarea,
	button,
	a.button,
	a,
	input[type="file"]{
	transition: box-shadow 0.5s, border 0.5s, background 0.5s;
	-moz-transition: -moz-box-shadow 0.5s, border 0.5s, background 0.5s;
	-webkit-transition: -webkit-box-shadow 0.5s, border 0.5s, background 0.5s;
	-o-transition:  -o-box-shadow 0.5s, border 0.5s, background 0.5s;
	}


textarea{
width:auto;
height:200px;
margin:0;
border:1px solid #ccc;
padding:5px;
vertical-align: middle;
font-family:inherit;
font-size:0.9em;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
-moz-box-shadow:inset 0px 0px 6px #ccc;
-webkit-box-shadow:inset 0px 1px 6px #ccc;
box-shadow:inset 0px 1px 6px #ccc;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}



/*---------------------------------
	COMMON
-----------------------------------*/
.mB0{margin-bottom: 0;}
.mB5{margin-bottom:5px;}
.mB10{margin-bottom:10px;}
.mB15{margin-bottom:15px;}
.mB20{margin-bottom:20px;}
.mB25{margin-bottom:25px;}
.mB30{margin-bottom:30px;}
.mB35{margin-bottom:35px;}
.mB40{margin-bottom:40px;}
.mB45{margin-bottom:45px;}
.mB50{margin-bottom:50px;}

.mR5 {margin-right: 5px;}
.mR10 {	margin-right: 10px;}
.mR15 {	margin-right: 15px;}
.mR20 {	margin-right: 20px;}
.mR25 {	margin-right: 25px;}
.mR30 {	margin-right: 30px;}
.mR40 {	margin-right: 40px;}
.mR50 {	margin-right: 50px;}

.mL5 {margin-left: 5px;}
.mL10 {	margin-left: 10px;}
.mL15 {	margin-left: 15px;}
.mL20 {	margin-left: 20px;}
.mL25 {	margin-left: 25px;}
.mL30 {	margin-left: 30px;}
.mL40 {	margin-left: 40px;}
.mL50 {	margin-left: 50px;}

.pT5{padding-top:5px;}
.pT10{padding-top:10px;}
.pT15{padding-top:15px;}
.pT20{padding-top:20px;}
.pT25{padding-top:25px;}
.pT30{padding-top:30px;}
.pT35{padding-top:35px;}
.pT40{padding-top:40px;}
.pT45{padding-top:45px;}
.pT50{padding-top:50px;}


.txt10{font-size:10px;}
.txt12{font-size:12px;}
.txt14{font-size:14px;}
.txt16{font-size:16px;}
.txt18{font-size:18px;}
.txt20{font-size:20px;}

.txtRed{color: #ee0000;}
.txtOrange{color:#F60;}
.txtBlue{color: #2987e6;}
.txtBrown{color: #95242a;}
.txtGray{color:#999;}

.txtR{text-align:right;}
.txtL{text-align:left;}

.aUnder a:hover{text-decoration:underline;}

.float-L{float: left;}
.float-R{float: right;}

.align-C{text-align:center;}

.clearB{clear:both;}


.dlGray dl{
	clear:both;
	background:#EEE;
	border-bottom:1px solid #CCC;
	}
.dlGray dl:after {content:".";display:block;visibility:hidden;height:0.1px;font-size:0.1em;line-height:0;clear: both;}
.dlGray dl{zoom:1;}
.dlGray dt{
	float:left;
	width:23%;
	padding-left:2%;
	}
.dlGray dd{
	background:#FFF;
	float:right;
	width:73%;
	padding-left:2%;
	}
.dlGray dt,
.dlGray dd{
	padding-top:5px;
	padding-bottom:5px;
	}

.clear{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0}
.clearfix:after{clear:both;content:' ';display:block;font-size:0;line-height:0;visibility:hidden;width:0;height:0}
* html .clearfix, *:first-child+html .clearfix{zoom:1}