body {
	text-indent:0;
}

div{
	overflow: hidden;
}

div.head {
	text-align: center;
}

@media screen and (min-width: 780px) {
	div.head  div.title {
		width: 66%;
		padding-left: 2%;
		padding-right: 2%;
		float: left;
	}

	div.head div.pic {
		width: 26%;
		padding-left: 2%;
		padding-right: 2%;
		float: left;
		text-align: center;
	}

	div.head div.pic > div {
		max-width: 15em;
	}

	div#movecat img.cat1,  div#movecat img.cat2 {
		width: 45%;
	}

	div.section {
		float: left;
		width: 46%;
		padding-left: 2%;
		padding-right: 2%;
		margin-bottom: 2em;
	}

	div.section[w="60%"] {
		width: 56%;
	}

	div.section[w="40%"] {
		width: 36%;
	}

	div.robosemi-official {
		float: left;
		width: 65%;
	}
}

@media screen and (max-width: 779px) {
	div.head  div.title {
		margin: 0.5em;
		margin-bottom: 1em;
	}

	div#movecat img.cat1 {
		width: 90%;
	}

	div#movecat img.cat2 {
		display: none;
	}
}

div.title h1{
	vertical-align: middle;
	text-align: center;
	margin-top: auto;
	margin-bottom: auto;
	padding-top: 1em;
	padding-bottom: 1em;
	background: linear-gradient(-90deg, #f0f, #fff, #f0f);
}

div.title a {
	text-decoration: none;
	color: Black;
}

div.head img {
	width: 100%;
}

div#movecat {
	text-align: center;
}

div.section h2 {
	text-align: center;
	padding-top: 0.2em;
	padding-bottom: 0.2em;
	background: linear-gradient(-90deg, #0ff, #fff, #0ff);
}

div.section p {
	margin: 0.25em;
	text-indent: -2em;
	padding-left: 2em;
}

div.section p::before {
	content: "★　";
	color: #8080ff;
}