/*
カスタム CSS 機能へようこそ。

使い方についてはこちらをご覧ください
(英語ドキュメンテーション)。http://wp.me/PEmnE-Bt
*/
body {
	font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif !important;
}

.skill-count input {
	visibility: hidden;
}

.col-md-3.copyright, #zerif-copyright, .col-md-3.copyright div {
	font-size: .95em;
}

i.pixeden {
	background-size: cover !important;
	background-position: 0 5px !important;
}

/*サイドバー非表示*/
.sidebar-wrap {
	display: none;
}

/*固定ページ編集ボタンをわかりやすく*/
span.edit-link a:before {
	content: "このページを";
}

span.edit-link {
	display: block;
	position: absolute;
	top: 50px;
	right: 0;
	border: 5px #00a05f solid;
	padding: 10px;
}

body {
}

/***********************************************************
  レスポンシブ対応リストタグ等幅カラムスタイルシート ver.1.0.2
  製作者：marumoto
  記述順：
  スマートフォン@media screen and (max-width: 640px)
  ↓
  タブレット@media screen and (min-width: 641px)
  ↓
  PC@media screen and (min-width: 981px)

  使用方法：
  リストタグのulへ該当するクラス名を記述すれば等幅カラム割が適用される。
  デフォルトはスマホ2列／タブレット3列／PC4列

  例   と書けば  スマホ→2列／タブレット→3列／PC→4列となる。

  borderを付ける場合はインラインにdivを形成して.flex-row div{border: 1px #ddd solid;}などとする
*******************************************************/
/*flexbox横並び*/
.flex-row {
/*リストスタイルリセット*/
	list-style: none;
	margin: 0;
	padding: 0;
/*旧ver Android safariフォールバック*/
	max-width: 100%;
	display: inline-block;
/*フレックス*/
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-flow: row wrap;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	-webkit-justify-content: flex-start;
/* Safari */
	-ms-flex-pack: start;
	justify-content: flex-start;
}

.flex-row li {
/*フォールバック*/
	float: left;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

/*スマホ ブレークポイント
*******************************/
@media screen and (max-width: 640px) {
	.flex-row > li {
	/*デフォルト値*/
		width: 50%;
	/*calcフォールバック*/
		width: calc(100% / 2);
	/*2カラム*/
		padding: 5px;
	/*余白*/
	}
	
	.sp-1 > li {
		width: 100%;
	/*1カラム*/
	}
	
	.sp-2 > li {
		width: 50%;
	/*calcフォールバック*/
		width: calc(100% / 2);
	/*2カラム*/
	}
	
	.sp-3 > li {
		width: 33.3333333%;
	/*calcフォールバック*/
		width: calc(100% / 3);
	/*3カラム*/
	}
}

/*タブレット ブレークポイント
*******************************/
@media screen and (min-width: 641px) {
	.flex-row > li {
	/*デフォルト値*/
		width: 33.3333333%;
	/*calcフォールバック*/
		width: calc(100% / 3);
	/*3カラム*/
		padding: 8px;
	}
	
	.tb-1 > li {
		width: 100%;
	/*1カラム*/
	}
	
	.tb-2 > li {
		width: 50%;
	/*calcフォールバック*/
		width: calc(100% / 2);
	/*2カラム*/
	}
	
	.tb-3 > li {
		width: 33.3333333%;
	/*calcフォールバック*/
		width: calc(100% / 3);
	/*3カラム*/
	}
	
	.tb-4 > li {
		width: 25%;
	/*calcフォールバック*/
		width: calc(100% / 4);
	/*4カラム*/
	}
	
	.tb-5 > li {
		width: 20%;
	/*calcフォールバック*/
		width: calc(100% / 5);
	/*5カラム*/
	}
}

/*PC ブレークポイント
*******************************/
@media screen and (min-width: 981px) {
	.flex-row > li {
	/*デフォルト値*/
		width: 25%;
	/*calcフォールバック*/
		width: calc(100% / 4);
	/*4カラム*/
		padding: 8px;
	}
	
	.pc-1 > li {
	/*1カラム*/
		width: 100%;
	}
	
	.pc-2 > li {
	/*2カラム*/
		width: 50%;
	/*calcフォールバック*/
		width: calc(100% / 2);
	/*2カラム*/
	}
	
	.pc-3 > li {
	/*3カラム*/
		width: 33.3333333%;
	/*calcフォールバック*/
	/*width: calc(100% / 3);*/
	/*3カラム*/
	}
	
	.pc-4 > li {
		width: 25%;
	/*calcフォールバック*/
		width: calc(100% / 4);
	/*4カラム*/
	}
	
	.pc-5 > li {
		width: 20%;
	/*calcフォールバック*/
		width: calc(100% / 5);
	/*5カラム*/
	}
	
	.pc-6 > li {
		width: 16.66666666%;
	/*calcフォールバック*/
		width: calc(100% / 6);
	/*6カラム*/
	}
	
	.pc-7 > li {
		width: 14.28571428%;
	/*calcフォールバック*/
		width: calc(100% / 7);
	/*7カラム*/
	}
}