@charset "UTF-8";
@media only screen and (max-width:1180px) {
	.sc__box .content {
		padding-left: 40px;
		padding-right: 40px;
	}
}
@media only screen and (max-width:1120px) {
	#social__box {
		right: 20px;
	}
	#sc__pager {
		left: 0px;
	}
}
@media only screen and (max-width:990px) {
	#sc__pager {
		left: -5px;
	}
	#social__box {
		right: 0px;
	}
	#tech__list .list__box {
		width: calc(25% - 20px);
		margin: 10px;
	}
	#future li {
		width: calc(50% - 20px);
		margin: 10px;
	}
	#works__list .works__box .works__right {
		padding-left: 40px;
		padding-right: 20px;
	}
}
@media only screen and (max-width:640px) {
	body {font-size: 2.5vw;}
	.sc__box {
		padding:60px 0;
	}
	#canvas__wrap.sc__box {padding: 0;}
	.sc__box .content {
		padding: 30px 40px;
	}

	#profile {
		display: block;
	}
	#profile .prof__left {
		width: 100%;
		text-align: center;
		margin-bottom: 20px;
	}
	#profile .prof__left img {
		width: 50%;
	}
	#profile .prof__right {
		width: 100%;
	}
	#profile .prof__right h3 {
		text-align: center;
	}
	#tech__list .list__box {
		width: calc(50% - 10px);
		margin: 10px 5px;
	}
	#future li {
		width: calc(50% - 10px);
		margin: 10px 5px;
	}
	#works__list .works__box {
		display: block;
	}
	#works__list .works__box .works__left {
		width: 100%;
		margin-bottom: 20px;
		text-align: center;
	}
	#works__list .works__box .works__left img {
		width: 80%;
	}
	#works__list .works__box .works__right {
		width: 100%;
		padding-left: 0px;
		padding-right: 0px;
	}
	#future {
		display: block;
	}
	#future li {
		width: 100%;
		margin:20px auto;
	}
	#footer {
		display: block;
		text-align: center;
		padding-top: 5px;
		background: rgba(255,255,255,0.8);
	}
	#footer .infomation {
		margin-bottom: 5px;
	}

}

@media only screen and (max-width:320px) {
}