@charset "utf-8";



@import url("reset.css");
@import url("fonts.css");



body{
	background:url(../images/opi_bg.gif) repeat;}

.contentslaps{
	background:#FFF url(../images/opi_base_bg.gif) top center no-repeat;
	overflow:auto;
	width:700px;
	height:500px;
	position:absolute;
	top:50%;
	left:50%;
	margin-left:-350px;
	margin-top:-250px;
	overflow:hidden;}
.contentslaps.maxheight{
	background:url(../images/opi_box_bg.gif) bottom center no-repeat; /*height3000pxまで対応*/
	width:700px;
	height:auto;
	position:relative;
	top:auto;
	left:auto;
	margin:10px auto 0 auto;
	padding:0 0 30px 0;
	overflow:auto;}
.header{
	background:url(../images/opi_header_loh.gif) top center no-repeat; /*タイトルごとのユニークヘッダ*/
	width:700px;
	height:80px;}
h1{
	color:#818181;
	padding:45px 0 0 10px;
	font-family:Arial Black , "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight:bold;
	font-size:17px;}
h1 em{
	color:#0088c3;}
	
.contents{
	background:url(../images/opi_mainbox_bg.gif) top center repeat-y;
	position:relative;
	width:652px;
	margin:20px auto 0 auto;
	text-align:center;}
.contents h2{
	background:url(../images/opi_mainbox_header.gif) top center no-repeat;
	color:#F00;
	height:29px;
	padding:17px 0 0 0;
	font-size:13px;
	text-align:center;
	font-weight:bold;}

.contents .error{
	position:absolute;
	left:0;
	color:#4b799d;
	width:170px;
	padding:5px 0 0 15px;
	font-size:10px;}
.contents .error dt{
	float:left;
	text-align:left;
	width:70px;}
.contents .error dd{
	float:left;
	width:100px;
	text-align:left;}

.contents .mainbox{
	padding:20px 20px 7px 20px;}
.contents .mainbox p{
	margin:0 0 1em 0;}
.cfooter{
	bottom:0;}

p.btn{
	margin:0;}
.btn a{
	position:relative;
	display:block;
	background:url(../images/opi_btn_bg.gif) top center repeat-x;
	color:#ffffff;
	width:150px;
	padding:2px 0 4px 0;
	margin:10px auto 0 auto;
	font-size:11px;
	font-weight:bold;
	text-decoration:none;}
.btn a:hover{
	top:2px;}



/*select_start*/
.contents.select h2{
	color:#0088c3;}
.idselect{
	width:438px;
	margin:0 auto;}
.idselect ul{
	margin:0 0 0 -10px;}
.idselect li{
	float:left;
	width:214px;
	cursor:pointer;
	margin:0 0 10px 10px;}
/*select_end*/



/*form_start*/
.contents.form h2{
	color:#0088c3;}
.contents.form .mainbox{
	font-size:11px;
	padding:0px 20px 7px 20px;}
.form p{
	margin:10px 0;
	font-size:10px;}

/*flow*/
.flow{
	float:left;}
.s1,
.s2{
	display:block;
	text-indent:-9999px;
	width:120px;
	height:30px;}
.s1{background:url(../images/opi_form_flow_01.gif) top right no-repeat;}
.s1.active{background:url(../images/opi_form_flow_01.gif) top left no-repeat;}
.s2{background:url(../images/opi_form_flow_02.gif) top right no-repeat;}
.s2.active{background:url(../images/opi_form_flow_02.gif) top left no-repeat;}

/*inputbox*/
.inputbox{
	background:#e6ebef;
	float:right;
	width:450px;
	padding:10px;}
.inputbox table{
	width:100%;
	text-align:left;}
.inputbox th,
.inputbox td{
	background:url(../images/opi_dotline_01.gif) bottom center repeat-x;
	font-size:11px;}
.contents .mainbox .inputbox th p,
.contents .mainbox .inputbox td p{
	clear:both;
	margin:0;}
.inputbox th{
	font-weight:bold;
	text-align:right;
	padding:3px 5px 5px 0;}
.inputbox td{
	padding:3px 0 5px 5px;}

.inputbox table input{
	/*width:200px;*/
	min-height:12px;
	padding:2px;}
.inputbox table td p input{
	float:left;
	vertical-align:middle;}

.inputbox table input.check,input.getnick{
	background:none;
	border:none;
	font-size:0;
	line-height:0;
	letter-spacing:0;
	margin:0;
	padding:0;}
.inputbox table input.check{
	float:right;
	display:block;
	background:url(../images/opi_form_check.gif) top center no-repeat;
	width:81px;
	height:22px;
	cursor:pointer;}
.inputbox table input.getnick{
	float:right;
	display:block;
	background:url(../images/opi_form_getnick.gif) top center no-repeat;
	width:81px;
	height:22px;
	cursor:pointer;}

.inputbox em{
	clear:both;
	color:#FF0000;}

.contents .mainbox p.sendfix{
	margin:10px auto;
	width:196px;}
.sendfix input{
	display:block;
	background:none;
	width:93px;
	height:27px;
	outline:none;
	line-height:0;
	padding:0;
	margin:0;
	letter-spacing:0;
	border:none;
	cursor:pointer;
	text-indent:-9999px;}
.sendfix input.confirm{
	float:left;
	background:url(../images/opi_form_btn_conf.gif) top center no-repeat;}
.sendfix input.reset{
	float:right;
	background:url(../images/opi_form_btn_reset.gif) top center no-repeat;}
.sendfix input.submit{
	float:left;
	background:url(../images/opi_form_btn_submit.gif) top center no-repeat;}
.sendfix input.return{
	float:right;
	background:url(../images/opi_form_btn_return.gif) top center no-repeat;}

/*form_end*/







/*----clear_start----*/
/*--clearfix--*/
.clearfix:after {
	content:".";
	display:block;
	clear:both;
	height:0;
	visibility:hidden;}
.clearfix {
	min-height:1px;}
* html .clearfix {
	height:1px;
	/*\*//*/
	height: auto;
	overflow: hidden;
	/**/}
/*--clear--*/
.cf{
	clear:both;
	height:0;}
/*--noeffect--*/
#container .ne{
	background:#ffffff;
	border:none;
	margin:0;}
/*----clear_end----*/