@charset "utf-8";

/*
Theme Name: Lolipop
Theme URI:http://creatorclip.info/
Description:Material Design
Author:とくめい
Version:3.0
*/

/**********************************
	検索アイコン
**********************************/
.searchBtn {
	position:absolute;
	top:1.5em;
	right:1.8em;
}
.searchBtn a {
	color:rgb(203,153,54);
	text-shadow:none;
}
.close:before {
	content:"\f00d" !important;
}

/**********************************
	ナビゲーションアイコン
**********************************/
.navBtn {
	position:absolute;
	top:0;
	left:1em;
}
.navBtn * {
	-webkit-transition: all 0s ease 0s;
	-moz-transition: all 0s ease 0s;
	transition: all 0s ease 0s;
}
#ie8 .navBtn,
#ie7 .navBtn,
#ie6 .navBtn {
	top:30px;
}
.navBtn button {
	display: block;
	border: none;
	background: none;
	outline: 0;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	−moz−tap-highlight-color:rgba(0,0,0,0);
	tap-highlight-color:rgba(0,0,0,0);
}
.navIcon {
	padding: 2rem 0;
	cursor: pointer;
	-webkit-transform: scale(0.8);
	-moz-transform: scale(0.8);
	transform: scale(0.8);
}

/* アイコンレイヤー */
.iconLayer {
	position: relative;
	display: block;
	width: 50px;
	height: 7px;
	background:#cb9936;
	-webkit-animation-duration: 300ms;
	-moz-animation-duration: 300ms;
	animation-duration: 300ms;
	-webkit-animation-timing-function: ease-in-out;
	-moz-animation-timing-function: ease-in-out;
	animation-timing-function: ease-in-out;
}
.iconLayer:before, .iconLayer:after {
	content: '';
	position: absolute;
	left: 0;
	display: block;
	width: 50px;
	height: 8px;
	background: #cb9936;
	-webkit-animation-duration: 300ms;
	-moz-animation-duration: 300ms;
	animation-duration: 300ms;
	-webkit-animation-timing-function: ease-in-out;
	-moz-animation-timing-function: ease-in-out;
	animation-timing-function: ease-in-out;
}
.iconLayer:before {
	bottom: 200%;
}
.iconLayer:after {
	top: 200%;
}

/**********************************
	ナビアイコン：矢印
**********************************/
.arrow {
	-webkit-animation-name: navIconSlide;
	-moz-animation-name: navIconSlide;
	animation-name: navIconSlide;
	-webkit-animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}
@-webkit-keyframes navIconSlide {
	0% {
	}
	100% {
		-webkit-transform: rotate(180deg);
		transform: rotate(180deg);
	}
}
@-moz-keyframes navIconSlide {
	0% {
	}
	100% {
		-moz-transform: rotate(180deg);
		transform: rotate(180deg);
	}
}
@keyframes navIconSlide {
	0% {
	}
	100% {
		transform: rotate(180deg);
	}
}

/* ナビアイコン：矢印:before */
.arrow:before {
	-webkit-animation-name: navIconSlideBefore;
	-moz-animation-name: navIconSlideBefore;
	animation-name: navIconSlideBefore;
	-webkit-animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}
@-webkit-keyframes navIconSlideBefore {
	0% {
	}
	100% {
		margin: 0% 31%;
		width: 75%;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
}
@-moz-keyframes navIconSlideBefore {
	0% {
	}
	100% {
		margin: 0% 31%;
		width: 75%;
		-moz-transform: rotate(45deg);
		transform: rotate(45deg);
	}
}
@keyframes navIconSlideBefore {
	0% {
	}
	100% {
		margin: 0% 31%;
		width: 75%;
		transform: rotate(45deg);
	}
}

/* ナビアイコン：矢印:after */
.arrow:after {
	-webkit-animation-name: navIconSlideAfter;
	-moz-animation-name: navIconSlideAfter;
	animation-name: navIconSlideAfter;
	-webkit-animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}
@-webkit-keyframes navIconSlideAfter {
	0% {
	}
	100% {
		margin: 0% 31%;
		width: 75%;
		-webkit-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
}
@-moz-keyframes navIconSlideAfter {
	0% {
	}
	100% {
		margin: 0% 31%;
		width: 75%;
		-moz-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
}
@keyframes navIconSlideAfter {
	0% {
	}
	100% {
		margin: 0% 31%;
		width: 75%;
		transform: rotate(-45deg);
	}
}

/**********************************
	ナビアイコン：ハンバーガー
**********************************/
.hamburger {
	-webkit-animation-name: navIconSlideFrom;
	-moz-animation-name: navIconSlideFrom;
	animation-name: navIconSlideFrom;
}
@-webkit-keyframes navIconSlideFrom {
	0% {
		-webkit-transform: rotate(-180deg);
		transform: rotate(-180deg);
	}
	100% {
	}
}
@-moz-keyframes navIconSlideFrom {
	0% {
		-moz-transform: rotate(-180deg);
		transform: rotate(-180deg);
	}
	100% {
	}
}
@keyframes navIconSlideFrom {
	0% {
		transform: rotate(-180deg);
	}
	100% {
	}
}

/* ナビアイコン：ハンバーガー:before */
.hamburger:before {
	-webkit-animation-name: navIconSlideBeforeFrom;
	-moz-animation-name: navIconSlideBeforeFrom;
	animation-name: navIconSlideBeforeFrom;
}
@-webkit-keyframes navIconSlideBeforeFrom {
	0% {
		margin: 3% 37%;
		width: 50%;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	100% {
	}
}
@-moz-keyframes navIconSlideBeforeFrom {
	0% {
		margin: 3% 37%;
		width: 50%;
		-moz-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	100% {
	}
}
@keyframes navIconSlideBeforeFrom {
	0% {
		margin: 3% 37%;
		width: 75%;
		transform: rotate(45deg);
	}
	100% {
	}
}

/* ナビアイコン：ハンバーガー:after */
.hamburger:after {
	-webkit-animation-name: navIconSlideAfterFrom;
	-moz-animation-name: navIconSlideAfterFrom;
	animation-name: navIconSlideAfterFrom;
}
@-webkit-keyframes navIconSlideAfterFrom {
	0% {
		margin: 3% 37%;
		width: 75%;
		-webkit-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
	100% {
	}
}
@-moz-keyframes navIconSlideAfterFrom {
	0% {
		margin: 3% 37%;
		width: 75%;
		-moz-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
	100% {
	}
}
@keyframes navIconSlideAfterFrom {
	0% {
		margin: 3% 37%;
		width: 75%;
		transform: rotate(-45deg);
	}
	100% {
	}
}

/**********************************
	アイコンフォント
**********************************/
@font-face {
	font-family: 'icomoon';
	src:url('fonts/icomoon.eot?-nzrnqh');
	src:url('fonts/icomoon.eot?#iefix-nzrnqh') format('embedded-opentype'),
		url('fonts/icomoon.woff?-nzrnqh') format('woff'),
		url('fonts/icomoon.ttf?-nzrnqh') format('truetype'),
		url('fonts/icomoon.svg?-nzrnqh#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
	display:inline-block;
	font-family: 'icomoon';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	vertical-align:middle;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.single #main article a[target="_blank"]:after,
blockquote:before, blockquote:after,
.single #main article ul.btnList li a:before,
.slngle #main article cite:before,
#main article ul.list li:before,
.single #main article cite:before,
.single #main #pager li.prev a:before,
.single #main #pager li.next a:before,
#side .widget_categories h2:before,
#side .widget_archive h2:before,
#side #tag_cloud-2 h2:before,
#side #wpp-2 h2:before,
#side .widget_categories ul li a:before,
#side .widget_archive ul li a:before {
	display: inline-block;
	font: normal normal normal 14px/1 FontAwesome;
	vertical-align:middle;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* リストアイコン */
#main article ul.list li:before {
	content:"\f0da";
	margin:0 0.5em 0 0.25em;
	color:#ffc045;
	font-size:1em;
	vertical-align:middle;
}

/* 引用アイコン */
blockquote:before,
blockquote:after {
	position:absolute;
	font-size:2em;
	color:#ddd;
}
blockquote:before {
	content: "\f10e";
	top:0.5em;
	right:0.5em;
}
blockquote:after {
	content: "\f10d";
	bottom:0.25em;
	left:0.4em;
	font-size:2em;
}

/* 引用元アイコン */
.single #main article cite:before {
	content:"\f0c6";
	margin-right:0.25em;
	color:#ddd;
	font-size:1.2em;
}

/* ページャー */
.single #main #pager li.prev a:before {
	position:absolute;
	top:50%;
	left:1em;
	content:"\f104";
	margin-top:-9px;
	color:#ffc045;
	font-size:150%;
}
.single #main #pager li.next a:before {
	position:absolute;
	top:50%;
	right:1em;
	content:"\f105";
	margin-top:-9px;
	color:#ffc045;
	font-size:150%;
}


/* 月別・カテゴリのリスト */
#side .widget_categories h2:before,
#side .widget_archive h2:before,
#side #tag_cloud-2 h2:before,
#side #wpp-2 h2:before {
	margin-right:0.5em;
}

#side .widget_categories h2:before {
	content:"\f07b";
}
#side .widget_archive h2:before{
	content:"\f073";
}

#side .widget_categories ul li a:before,
#side .widget_archive ul li a:before {
	content: "\f105";
	position:absolute;
	top:50%;
	right:0.5em;
	margin:-12px 0 0 -2px;
	color:#ddd;
	font-size: 1.7em;
}
#side .widget_categories ul li a:hover:before,
#side .widget_archive ul li a:hover:before {
	color:#f39c12;
}

/* タグクラウド */
#side #tag_cloud-2 h2:before {
	content:"\f02c";
}

/* 人気記事 */
#side #wpp-2 h2:before {
	content:"\f091";
}

/* 別窓リンク
.single #main article a[target="_blank"]:after {
	content: "\f08e";
	margin-left:0.25em;
	font-size: 0.9em;	
} */

/* デモアイコン */
.single #main article ul.btnList li a:before {
	margin-right:1em;
	font-size:130%;
}
.single #main article ul.btnList li:first-child a:before {
	content:"\f144";
}
.single #main article ul.btnList li:first-child + li a:before {
	content:"\f019";
}

/* フォロー・ブランドカラー */
.fa-twitter {
	color:#55acee;
}
.fa-facebook {
	padding-left:3px;
	color:#315096;
}
.fa-google-plus {
	color:#dd4b39;
}
.fa-rss {
	color:#ff8c00;
}
.icon-feedly {
	color:#6cc655;
}
.icon-hatebu {
	color:#008fde;
}
.icon-line {
	color:#00c300;
}
.icon-pocket {
	color:#ee4056;
}
.icon-evernote {
	color:#79bd28;
}

/* アイコン */
.icon-feedly:before {
	content: "\e600";
}
.icon-hatebu:before {
	content: "\e601";
}
.icon-line:before {
	content: "\e602";
}
.icon-pocket:before {
	content: "\e603";
}
.icon-amazon:before {
	content: "\21";
}
.icon-chrome:before {
	content: "\22";
}
.icon-safari:before {
	content: "\23";
}
.icon-firefox:before {
	content: "\26";
}
.icon-home:before {
	content: "\2b";
	font-size:120%;
}
.icon-ie:before {
	content: "\2c";
}
.icon-quote:before {
	content: "\30";
}
.icon-evernote:before {
	content: "\65";
}