@charset "UTF-8";

/*   
Theme Name: TattooTemp
Description: 入れ墨タトゥを消す方法専用テンプレート
Author: ちん
*/

/****************************************
		リセット＆セッティング
*****************************************/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote,
a, img, strong, dl, dt, dd, ol, ul, li,
form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; }
ol, ul, li {list-style: none;}
img{ vertical-align:bottom; max-width: 100%; height: auto; }

body  { font: 100% "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;
	line-height: 1.8; color: #333; }

/* リンク */
a:link { color: #11C; } 
a:visited { color: #11C; }
a:hover { color: #F33; }
a:active { color: #F63; }

/* フォーム */
input, textarea {  }

/* 共通クラス */
.bold { font-weight: bold; }
.color-r { color: #F20065; }
.align-c { text-align: center; }
.size-s { font-size: 12px; }
.size-m { font-size: 16px; }
.size-mm { font-size: 18px; }
.size-l { font-size: 20px; }
.size-ll { font-size: 22px; }
.mb0 { margin-bottom: 0 !important; }
.mb10 { margin-bottom: 10px !important; }
.mb20 { margin-bottom: 20px !important; }
.mt40 { margin-top: 40px !important; }
.aligncenter { display: block !important; margin-left: auto !important; margin-right: auto !important; }
.box-01 { padding: 15px 20px; margin: 40px 0 40px; border: 2px solid #DDDDDD; border-radius: 3px; }
.ico-01 { padding: 0 0 0 20px;  background: url(img/ico-01.png) no-repeat 0 -186px; }

/* テーブル */
table { width: 100%; margin: 0 0 1.5em; border-collapse: collapse; font-size: 14px; }
th { padding: 5px 10px; background: #EEE; border: 1px solid #DDD; text-align: left; font-weight: normal; }
td { padding: 5px 10px; border: 1px solid #DDD;  }

/* フロート解除 */
.cf:before, .cf:after { content: ""; display: block; overflow: hidden; }
.cf:after { clear: both; }
.cf { zoom: 1; }
.clear { clear: both; }

/* レイアウト */
#container { width: 1080px; margin: 30px auto; }

/****************************************
		ヘッダー
*****************************************/

#header { }
#header .header-in { width: 1080px; margin: 0 auto; padding: 20px 0; }
#header h1 { font-size: 15px; font-weight: normal; }
#header .site-title a { font-size: 24px; font-weight: bold; text-decoration: none; color: #333; }

#g-navi { width: 1080px; margin: 0 auto; background: #F7F7F7; border-bottom: 1px solid #EDEDED;}
	#g-navi li { float: left; border-right: 1px dotted #BBB; }
	#g-navi a { display: block; padding: 10px 20px; text-decoration: none; color: #333; font-weight: bold; }
	#g-navi a:hover { color: #FFF; background: #6b6b6b; }
#topic-path { margin: 10px 0 10px; font-size: 12px; }
#topic-path li { float: left; }
#topic-path li:after { content:'>'; padding: 0 10px; }
#topic-path li:last-child:after { content:''; padding: 0; }

/****************************************
		メインコンテンツ
*****************************************/

#main-content { width: 728px; float: left; }
.article-single { }

/* 個別ページ */
#article.entry p.entry-meta { font-size: .8em; color: #4c4c4c; margin: 5px 0; }
	#article.entry .entry-meta time:before { content: "\f274"; font-family:"fontawesome"; margin-right: .3em; }
#article.entry h1 { font-size: 1.8em; line-height: 1.3; }
	#article.entry h1 a { color: inherit; text-decoration: none; }
#article.entry .entry-content { margin: 20px 0; }
#article.entry .entry-content h2 { margin: 3em 0 1.2em; font-size: 1.4em; line-height: 1.3; background: #f7f7f7; padding: .7em .6em; }
#article.entry .entry-content p { margin: 1.8em 0; }
#article.entry ul, #article.entry  ol  { margin: 2em 0 2em; }
	#article.entry ul li { margin: .6em 0; text-indent:-1em; padding-left:1em; }
	#article.entry ul li:before { content: "●"; font-size: .3em; margin: 0 8px 0 0; color: #DDD; }
	#article.entry ol li { margin: .6em 0; list-style: decimal inside; }

/* アーカイブ */
#article.archive h1 { padding: 15px 0; line-height: 1; }
	#main-content .article-archive h2 a { font-size: 24px; color: #333; text-decoration: none; line-height: 1.2; }

/* 記事リスト */
.list-entry { }
	.list-entry .list-entry-box { border-bottom: 1px dotted #DDD; }
	.list-entry-box a { color: inherit; text-decoration: none; display: block; padding: 20px 20px; overflow: hidden;}
	.list-entry-box a:hover { background: #f5f5f5; }
	.list-entry-img { float: left; margin-right: 3%; width: 30%; }
	.list-entry-text { overflow: auto; }	
	.list-entry-title { line-height: 1.2; }
	.list-entry-meta { font-size: .8em; color: #4c4c4c; margin: .5em 0; }
	.list-entry-content { font-size: .8em; color: #4c4c4c; }
.list-entry.col2 { margin: 0 -3% 0 0; overflow: hidden; }
	.list-entry.col2 .list-entry-box { width: 47%; float: left; margin-right: 3%;}
	.list-entry-img.col2 { width: 20%; }
	.list-entry.col2 .list-entry-title { font-size: 1em !important; font-weight: normal; }

/* ページャー */
.pager { font-size: 0; background: #F7F7F7; border-bottom: 1px solid #EDEDED;}
.pager a { display: inline-block; width: 40px; height: 40px; line-height: 40px; text-align: center; font-size: 14px; border-right: 1px dotted #BBB;; text-decoration: none; }
.pager a:hover { color: #FFF; background: #6b6b6b; }
.pager span { display: inline-block; width: 40px; height: 40px; line-height: 40px; text-align: center; border-right: 1px dotted #BBB; font-size: 14px; text-decoration: none; color: #FFF; background: #6b6b6b; }

/****************************************
		サイド
*****************************************/

#side { float: right; width: 300px; }
#side h3 { margin: 0 0 15px; padding: 10px 15px; font-size: 14px; line-height: 1; border-bottom: 2px solid #EDEDED; }
#side .side-content { margin: 0 0 40px; font-size: 12px; }
#side ul { padding: 0 10px; }
	#side li { margin: 0 0 10px; padding: 0 0 0 20px; background: url(img/ico-01.png) no-repeat 0 -84px; }
#side .cat-item { border-bottom: 1px dotted #DDD; }
#side .cat-item a { margin-right: 5px; }
#side .children { padding: 0 0 5px; }
#side .children .cat-item { margin: 5px 0; border: none; background: url(img/ico-01.png) no-repeat 0 -485px; }
.widget_archive select { margin: 0 10px; }
#searchform { padding: 0 10px; }
#s { width: 190px; font-size: 13px; padding: 3px 5px 4px; margin: 0; }
#searchsubmit { display: inline-block; width: 50px; padding: 3px 0; color: #FFF; border: none; text-align: center; font-size: 13px; margin: 0; background: #6b6b6b; }
#searchsubmit:hover { background: #505050; }

/****************************************
		フッター
*****************************************/
#page-top { position: fixed; right: 30px; bottom: 45px; }
#page-top a { display: block; width: 35px; height: 30px; text-align: center; line-height: 30px; font-size: 12px; color: #FFF; text-decoration: none; background: #6b6b6b; }
#page-top a:hover { background: #505050; }
#footer { }
#footer .copy { text-align: center; color: #FFF; background: #6b6b6b; padding: 10px 0; }
#footer a { color: #FFF; }
#footer a:hover { text-decoration: none; }

/****************************************
		スマホ＆タブレット
*****************************************/

@media screen and (max-width: 640px) {
#wrap { min-width: 320px; }	
#header  { position: relative; padding: 40px 0 0; }
#header .header-in { width: auto; }
#g-navi { width: 100%; position: absolute; top: 0; }
#container { width: auto; margin: 0; }
#main-content { width: auto; float: none; }
#main-content h1,
#main-content .article-archive h2 { padding: 10px 2%; }
#main-content .article-meta { padding: 8px 2%; }
#main-content .article-text { padding: 0 2%; }
#main-content .article-footer { padding: 8px 2% 0; }
#side { width: auto; float: none; }
#side .side-content { font-size: 14px; }
#side ul { padding: 0; }
#side li { border-bottom: 1px dotted #BBB; padding: 0; margin: 0; background: none; }
#side .widget_recent_entries a { display: block; padding: 10px 10px 10px 30px; position: relative; }
#side .widget_recent_entries a:before { content: ''; display: inline-block; width: 16px; height: 15px;
	background: url(img/ico-01.png) no-repeat 0 -86px; position: absolute; left: 8px; top: 15px; }
#side .cat-item { padding: 0; }
#page-top { bottom: 5px; right: 5px; }
}