@charset "utf-8";

/*************************************************
CSS
/cmn_jp_v1/css/component.css

14.10.30
update:14.11.26
*************************************************/

/* ------------------------- TOC
Form
Contactgrd
------------------------- */



/* ============================================================ Form */
/* fm_tbl */
.jp_fm_tbl_sct { border-style: solid; border-width: 2px 0; border-color: #c9c9c9; }
.jp_fm_tbl { display: table; width: 100%; }
.jp_fm_tbl .jp_fm_tbl_ttl { display: table-cell; width: 33.333%; padding-top: 8px; padding-right: 16px; padding-bottom: 8px; vertical-align: middle; font-size: 16px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.jp_fm_tbl .jp_fm_tbl_ttl .lb_ic { float: right; }
.jp_fm_tbl .jp_fm_tbl_dtl { display: table-cell; width: 66.666%; padding-top: 8px; padding-bottom: 8px; vertical-align: top; font-size: 16px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

/* jp_req */
ul.jp_req { background-color: #fef5f4;
	-webkit-border-radius: 4px;
	border-radius: 4px;
}
/* jp_err */
ul.jp_err { background-color: #fbe5e4;
	-webkit-border-radius: 4px;
	border-radius: 4px;
}

/* @media */
@media (max-width: 640px) {
	/* fm_tbl */
	.jp_fm_tbl { display: block; }
	.jp_fm_tbl .jp_fm_tbl_ttl,
	.jp_fm_tbl .jp_fm_tbl_dtl { display: block; width: 100%; padding-right: 0; }
	.jp_fm_tbl .jp_fm_tbl_ttl .lb_ic { float: none;}

	.jp_fm_tbl .jp_fm_tbl_dtl { padding-top: 0; }
}



/* ============================================================ Contactgrd */
/*  clearfix */
.jp_contactgrd:before,
.jp_contactgrd:after { content: ""; display: table; }
.jp_contactgrd:after { clear: both; }
.jp_contactgrd { zoom: 1; }

/* contactgrd */
.jp_contactgrd { width: 100%;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.jp_contactgrd .jp_mainclm,
.jp_contactgrd .jp_subclm {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.jp_contactgrd .jp_mainclm { width: 75%; float: left; }
.jp_contactgrd .jp_subclm { width: 25%; float: right; padding-left: 16px; }

@media (max-width: 640px) {
	.jp_contactgrd .jp_mainclm { width: 100%; }
	.jp_contactgrd .jp_subclm { width: 100%; padding-left: 0; padding-bottom: 24px;}
}