@charset "UTF-8";


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

a {
	color: #000;
}



/* ↓背景画像 */

#top::after{
	background-image:url("../bg.png"); /* 背景画像を指定 */
}



/* ↓各セクションの背景色 */

#me{
	background-color: rgba(255,255,255, 0.5);
}

#illust{
	background-color: #fff;
}

#off{
	background-color: rgba(255,255,255, 0.2);
	background-image:
	radial-gradient(at 43% 14%, hsla(22,100%,74%,0.5) 0px, transparent 50%),
	radial-gradient(at 100% 0%, hsla(189,100%,74%,0.5) 0px, transparent 50%),
	radial-gradient(at 0% 42%, hsla(40,100%,93%,0.5) 0px, transparent 50%),
	radial-gradient(at 80% 50%, hsla(340,100%,76%,0.5) 0px, transparent 50%),
	radial-gradient(at 0% 100%, hsla(34,100%,77%,0.5) 0px, transparent 50%),
	radial-gradient(at 88% 98%, hsla(237,59%,52%,0.5) 0px, transparent 50%),
	radial-gradient(at 0% 0%, hsla(343,100%,76%,0.5) 0px, transparent 50%);
}
/* ↑グラデーションのcssです
　　　https://csshero.org/mesher/　こちらのサイトで好きな色で作れます */

#about{
	background-color: rgba(0,0,0, 0.9);
}



/* ↓トップの文字色など */

#top h1,
#top nav a,
#scroll{
	color: #dfdfdf;
}

#top nav{
	border-bottom-color: #fff;
}

/* ↓PCでスクロールさせたときのメニュー色 */
@media screen and (min-width: 769px) {

#top nav a{
	background-color: rgba(255,255,255,0.7);
	color: #000;
	mix-blend-mode: screen;
}

#top nav.view a{
	background-color: transparent;
}

#top nav.view,
#top nav.view a,
#top nav.view a i{
	color: #000;
	border-bottom-color: #000;
}

}



section h2::before{
	background-color: #000;
}

section#about,
section#about h2{
	color: #fff;
}

section#about h2::before{
	background-color: #fff;
}

#aboutme strong{
	color: #A00D26;
}

#link a i{
	border-color: #000;
}

.thum_caption{
	background-color: rgba(0,0,0,0.9);
	color: #fff;
	mix-blend-mode: multiply;
}

.sample a.btn{
	background-color: #000;
	color: #fff;
	mix-blend-mode: multiply;
}

.new::before{
	background-color: #000;
	color: #fff;
}

.book::before, .book::after {
	border-color: #000;
}

#site ul li span:first-child{
	border-bottom-color: hsla(343,100%,76%,0.7);
}

#site ul li span:last-child{
	border-image:
	linear-gradient(to left, hsla(22,100%,77%,0.7), hsla(242,100%,70%,0.7), hsla(343,100%,76%,0.7));
	border-image-slice: 1;
}

#text h3,
#site ul li span:first-child,
#text ul li::before{
	background-image:
	linear-gradient(to left, hsla(22,100%,77%,0.7), hsla(242,100%,70%,0.7), hsla(343,100%,76%,0.7));
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

#bkm a{
	color: #fff;
}

#page_top a {
	color: #fff;
	background-color: #000;
}