@charset "utf-8";

footer {
    color: #fff;
}

div.tile p {
	margin-bottom: 1rem;
}

.section#usage_section .table {
	border-collapse: collapse;
}
.section#usage_section .table td {
	padding: 1rem;
}
.section#usage_section .table td img {
	max-width: 180px;
}
.section#usage_section p.margin_bottom {
	margin-bottom: 1.5rem;
}

.info {
	margin: 3rem 1rem;
	padding: 0px;
}
.info dt {
	padding: 5px 0px;
	font-weight: bold;
	word-wrap: break-word;
}
.info dd {
	padding: 5px 0px;
	line-height: 160%;
	margin-bottom: 1.5rem;
	border-bottom: 1px dotted #666666;
}

.login_trouble {
	margin: 0.5rem;
	padding: 0;
}
.login_trouble dt {
	font-weight: bold;
	margin-bottom: 0.5rem;
}
.login_trouble dd {
	margin-bottom: 2rem;
}

.youtube {
	position: relative;
	padding-bottom: 56.25%;
	height:0;
	overflow: hidden;
}
.youtube iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#form_contact {
	padding: 1rem 1rem 1.3rem;
}
#form_contact .th {
    width: 14rem;
    padding-top: 14px;
    vertical-align: top;
    color: #002B4C;
}
#form_contact .td {
    vertical-align: middle;
    padding-bottom: 7px;
}
#form_contact input[type="text"],
#form_contact input[type="mail"],
#form_contact textarea {
    width: 100%;
	color: #484848;
    background: #f3f3f5;
    border: none;
    border-radius: 6px;
}
#form_contact input,
#form_contact select,
#form_contact textarea {
    padding: 6px 12px;
}
#form_contact input#name,
#form_contact input#kana,
#form_contact input#address,
#form_contact textarea#comment {
	ime-mode: active;
}
#form_contact input#zip1,
#form_contact input#zip2,
#form_contact input#tel,
#form_contact input#email {
	ime-mode: disabled;
}
#form_contact input#zip1 {
	width: 5rem;
}
#form_contact input#zip2 {
	width: 7rem;
}
#form_contact .tag {
	font-size: 0.65rem;
	font-weight: bold;
}

@media screen and (min-width: 750px) {
	.section#about_section ,
	.section#usage_section {
		padding-bottom: 12rem;
	}
 	.section#books_section {
		padding-bottom: 22rem;
	}
	.section#books_section .column {
		padding: 2.75rem;
	}

	.info dd {
		margin-top: -2.1rem;
		margin-left: 8.1rem;
	}

	#form_contact .tag {
		float: right;
	}
}
@media screen and (max-width: 749px) {
	.section#usage_section .table td {
		display: block;
	}
	#form_contact .tag {
		margin-left: 0.5rem;
	}
}