@charset "shift_jis";

/* ========================================
* File Name: contact.css
* Created Date: 2012.10.27
* Last Up Date: 
* Author: TAM
======================================== */
@import url("/shogaku/form_common/css/common_sjis.css"); 


/* ========================================
	00_base
======================================== */
/* formInner */
.contact #contents div.formInner {
	margin: 0 50px;
}
/* h1 */
.contact #contents h1.pageTtl {
	margin: 20px 0 0 0;
	padding: 0 0 0 7px;
	border-left: solid 5px #EB6000;
	color: #EB5F00;
	font-size: 2.4em;
	line-height: 1.2;
	font-weight: bold;
}
/* p.topTxt */
.contact #contents p.topTxt {
	margin: 20px 0 0 0;
	font-size: 1.4em;
	line-height: 1.6;
}
/* p.topErrorMessage */
.contact #contents div.topErrorMessage ul.errList {
	margin						: 20px 0 0 0;
	padding						: 10px 12px 8px 12px;
	border						: solid 2px #f20017;
	color						: #f20017;
	font-size					: 1.4em;
	line-height					: 1.6;
	font-weight					: bold;
}
/* p.errorMessage */
.contact #contents .errorMessage {
	clear: both;
	color: #F20017;
	font-size: 1.4em;
	line-height: 1.6;
	font-weight: bold;
}
/* p.txt */
.contact #contents p.txt {
	font-size: 1.4em;
	line-height: 1.6;
}
/* btnInput */
.contact #contents ul.btnInput {
	width: 480px;
	margin: 40px auto 0 auto;
	overflow: hidden;
}
.contact #contents ul.btnInput li.lBtn {
	float: left;
	width: 220px;
	text-align: center;
}
.contact #contents ul.btnInput li.rBtn {
	float: right;
	width: 220px;
	text-align: center;
}
.contact #contents ul.btnInput li.cBtn {
	width: 220px;
	margin: 0 auto;
	text-align: center;
}
.contact #contents ul.btnInput li button.stop,
.contact #contents ul.btnInput li input.stop {
	dislay: block;
	width: 100%;
	padding: 10px 0;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	border: none;
	background: #999;
	background: -moz-linear-gradient(top, #9A9A9A, #9A9A9A 20%, #888 50%, #888);
	background: -webkit-gradient(linear, left top, left bottom, from(#9A9A9A), color-stop(0.20, #9A9A9A), color-stop(0.50, #888), to(#888));@
	background: linear-gradient(linear, left top, left bottom, from(#9A9A9A), color-stop(0.20, #9A9A9A), color-stop(0.50, #888), to(#888));
	color: #FFF;
	font-size: 1.8em;
	line-height: 1.2;
	font-weight: bold;
}
.contact #contents ul.btnInput li button:hover.stop,
.contact #contents ul.btnInput li button:active.stop,
.contact #contents ul.btnInput li input:hover.stop,
.contact #contents ul.btnInput li input:active.stop {
	filter: alpha(opacity=70);
	-ms-filter: 0.7;
	opacity: 0.7;
}
.contact #contents ul.btnInput li button.next,
.contact #contents ul.btnInput li input.next {
	dislay						: block;
	width						: 100%;
	padding						: 10px 0;
	-moz-border-radius			: 4px;
	-webkit-border-radius		: 4px;
	border-radius				: 4px;
	border						: none;
	background					: url(/shogaku/form_common/images/arw_btn_orange.png) no-repeat right center #EB6000;
	background					: url(/shogaku/form_common/images/arw_btn_orange.png) no-repeat right center, -moz-linear-gradient(top, #F08B49, #F08B49 20%, #EB6000 50%, #EB6000);
	background					: url(/shogaku/form_common/images/arw_btn_orange.png) no-repeat right center, -webkit-gradient(linear, left top, left bottom, from(#F08B49), color-stop(0.20, #F08B49), color-stop(0.50, #EB6000), to(#EB6000));@
	background					: url(/shogaku/form_common/images/arw_btn_orange.png) no-repeat right center, linear-gradient(linear, left top, left bottom, from(#F08B49), color-stop(0.20, #F08B49), color-stop(0.50, #EB6000), to(#EB6000));
	color						: #fff;
	font-size					: 1.8em;
	line-height					: 1.2;
	font-weight					: bold;
	cursor						: pointer;
}
.contact #contents ul.btnInput li button:hover.next,
.contact #contents ul.btnInput li button:active.next,
.contact #contents ul.btnInput li input:hover.next,
.contact #contents ul.btnInput li input:active.next {
	filter: alpha(opacity=70);
	-ms-filter: 0.7;
	opacity: 0.7;
}
.contact #contents ul.btnInput li button.back,
.contact #contents ul.btnInput li input.back {
	dislay: block;
	width: 100%;
	padding: 10px 0;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	border: none;
	background: url(/shogaku/form_common/images/arw_btn_back_orange.png) no-repeat left center #EB6000;
	background: url(/shogaku/form_common/images/arw_btn_back_orange.png) no-repeat left center, -moz-linear-gradient(top, #F08B49, #F08B49 20%, #EB6000 50%, #EB6000);
	background: url(/shogaku/form_common/images/arw_btn_back_orange.png) no-repeat left center, -webkit-gradient(linear, left top, left bottom, from(#F08B49), color-stop(0.20, #F08B49), color-stop(0.50, #EB6000), to(#EB6000));@
	background: url(/shogaku/form_common/images/arw_btn_back_orange.png) no-repeat left center, linear-gradient(linear, left top, left bottom, from(#F08B49), color-stop(0.20, #F08B49), color-stop(0.50, #EB6000), to(#EB6000));
	color: #FFF;
	font-size: 1.8em;
	line-height: 1.2;
	font-weight: bold;
}
.contact #contents ul.btnInput li button:hover.back,
.contact #contents ul.btnInput li button:active.back,
.contact #contents ul.btnInput li input:hover.back,
.contact #contents ul.btnInput li input:active.back {
	filter: alpha(opacity=70);
	-ms-filter: 0.7;
	opacity: 0.7;
}
/* input */
.contact #contents input[type="text"],
.contact #contents input[type="password"] {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	color: #333;
	font-size: 1.2em;
	line-height: 1.2;
}
/* notesTxt */
.contact #contents ul.notesTxt {
	clear: both;
}
.contact #contents ul.notesTxt li {
	margin: 0 0 0 1em;
	text-indent: -1em;
	font-size: 1.2em;
	line-height: 1.6;
}
/* formTableWrap */
.contact #contents .formTableWrap {
	margin: 20px 0 0 0;
}
.contact #contents .formTableWrap h2 {
	padding: 12px 0 5px 0;
	font-size: 1.4em;
	line-height: 1.6;
	font-weight: bold;
}
.contact #contents .formTableWrap dl {
	position: relative;
	display: table;
	width: 99.8%;
	margin: -1px 0 0 0;
	border: solid 1px #CCC;
	background: url(../images/table_bg02.gif) repeat-y left top;
	overflow: hidden;
	zoom: 1;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	/border-left: none;
	/border-right: none;
}
.contact #contents .formTableWrap dl dt {
	display: table-cell;
	/float: left;
	width: 259px;
	padding: 10px;
	text-align: left;
	vertical-align: top;
	font-size: 1.4em;
	line-height: 1.6;
	font-weight: bold;
}
.contact #contents .formTableWrap dl dt span.smallTxt {
	color: #FF0000;
	font-size: 85%;
	line-height: 1.2;
	font-weight: normal;
}
.contact #contents .formTableWrap dl dd {
	display: table-cell;
	/float: right;
	/width: 535px;
	padding: 10px 15px 10px 15px;
	/padding: 10px 0 10px 0;
	text-align: left;
	vertical-align: top;
	overflow: hidden;
}
#contact_top #contents #userName {
	font-size					: 1.5em;
}
/* iconIndispensable */
.contact #contents span.iconIndispensable {
	margin: 0 0 0 8px;
	padding: 0 3px;
	background: #F20017;
	vertical-align: middle;
	color: #FFF;
	font-size: 12px;
	line-height: 1.2;
	zoom: 1;
	white-space: nowrap;
}
@media (max-width:640px) {
/* formInner */
.contact #contents div.formInner {
	margin: 0 10px;
}
/* h1 */
.contact #contents h1.pageTtl {
	font-size: 2.0em;
}
/* btnInput */
.contact #contents ul.btnInput {
	width: 100%;
	margin: 30px auto 0 auto;
	display: table;
	overflow: hidden;
}
.contact #contents ul.btnInput li.lBtn {
	float: none;
	display: table-cell;
	width: auto;
	padding: 0 5px 0 0;
}
.contact #contents ul.btnInput li.rBtn {
	float: none;
	display: table-cell;
	width: auto;
	padding: 0 0 0 5px;
}
.contact #contents ul.btnInput li.cBtn {
	display: table-cell;
	width: auto;
	padding: 0 12%;
}
.contact #contents ul.btnInput li button.stop,
.contact #contents ul.btnInput li input.stop {
	padding: 12px 0;
	font-size: 2.0em;
}
.contact #contents ul.btnInput li button.next,
.contact #contents ul.btnInput li input.next {
	padding: 12px 0;
	font-size: 2.0em;
}
/* formTableWrap */
.contact #contents .formTableWrap {
	margin: 20px 0 0 0;
}
.contact #contents .formTableWrap dl {
	display: inherit;
	background: none;
}
.contact #contents .formTableWrap dl dt {
	display: inherit;
	width: auto;
	padding: 8px 10px;
	background: #F2F4F6;
	font-size: 1.4em;
	line-height: 1.6;
	font-weight: bold;
}
.contact #contents .formTableWrap dl dd {
	display: inherit;
	padding: 10px;
}
}

/* ========================================
	01_contact_top
======================================== */
/* ttlWrap */
#contact_top #contents div.ttlWrap {
	width: 100%;
	overflow: hidden;
}
#contact_top #contents div.ttlWrap div.ttl {
	float: left;
	width: 80%;
}
#contact_top #contents div.ttlWrap div.pmark {
	float: right;
	width: 70px;
	margin: 20px 0 0 0;
}
/* linkList */
#contact_top #contents ul.linkList {
	margin: 20px 0 0 0;
}
#contact_top #contents ul.linkList li {
	padding: 0 0 0 12px;
	background: url(/shogaku/form_common/images/arw_r_orange.png) no-repeat left 0.45em;
	font-size: 1.4em;
	line-height: 1.5;
}
/* formTableWrap */
#contact_top #contents .formTableWrap dl.name01 p.input {
	float: left;
	width: 45%;
	min-width: 180px;
}
#contact_top #contents .formTableWrap dl.name01 p.input input {
	width: 75%;
	margin: 5px 0;
}
#contact_top #contents .formTableWrap dl.name01 label {
	margin: 5px 1.5em 5px 0;
	font-size: 1.4em;
	line-height: 1.2;
}
#contact_top #contents .formTableWrap dl.name01 p.errorMessage {
	clear: both;
}
#contact_top #contents .formTableWrap dl.mail input {
	width: 80%;
	max-width: 350px;
	margin: 5px 0;
}
#contact_top #contents .formTableWrap dl.grade p.select {
	margin: 5px 0;
	font-size: 1.4em;
	line-height: 1.2;
}

#contact_top #contents .formTableWrap dl.check p.radio {
	margin: 5px 0;
	font-size: 1.4em;
	line-height: 1.2;
}
#contact_top #contents .formTableWrap dl.check p.radio input {
	margin: 0;
}
#contact_top #contents .formTableWrap dl.check p.radio label {
	margin: 0 35px 0 5px;
}

#contact_top #contents .formTableWrap dl.freeTxt textarea {
	width: 100%;
	max-width: 500px;
	height: 100px;
	margin: 5px 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
@media (max-width:640px) {
/* ttlWrap */
#contact_top #contents div.ttlWrap div.ttl {
	float: left;
	width: 72%;
}
#contact_top #contents div.ttlWrap div.pmark {
	float: right;
	width: 25%;
	max-width: 70px;
	margin: 30px 0 0 0;
}
#contact_top #contents div.ttlWrap div.pmark img {
	width: 100%;
}
/* formTableWrap */
#contact_top #contents .formTableWrap dl.name01 p.input {
	float: none;
	width: 100%;
	margin: 0;
}
#contact_top #contents .formTableWrap dl.mail input {
	width: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
}

/* ========================================
	02_contact_error
======================================== */
#contact_error #contents h1.errorMessage {
	margin: 55px 0 0 0;
	text-align: center;
	color: #F20017;
	font-size: 2.4em;
	line-height: 1.2;
	font-weight: bold;
}
#contact_error #contents p.txt {
	margin: 35px 0 100px 0;
	text-align: center;
}
@media (max-width:640px) {
#contact_error #contents h1.errorMessage {
	margin: 20px 0 0 0;
	text-align: left;
	font-size: 2.0em;
}
#contact_error #contents p.txt {
	margin: 20px 0 0 0;
	text-align: left;
}
}

/* ========================================
	03_contact_thanks
======================================== */
#contact_thanks #contents h1.thanksMessage {
	margin: 55px 0 0 0;
	text-align: center;
	color: #EB5F00;
	font-size: 2.7em;
	line-height: 1.2;
	font-weight: bold;
}
#contact_thanks #contents p.txt {
	margin: 35px 0 100px 0;
	text-align: center;
	font-size: 1.6em;
}
@media (max-width:640px) {
#contact_thanks #contents h1.thanksMessage {
	margin: 20px 0 0 0;
	text-align: left;
	font-size: 2.0em;
}
#contact_thanks #contents p.txt {
	margin: 20px 0 0 0;
	text-align: left;
}
}