.center{
	text-align:center;
}
.match-game-container{
	position:relative;
	width:100%;
	max-width:940px;
}
div.match-game-body{
	position:relative;
	margin:0 auto;
}
div.match-game-select{
	box-shadow: 0 2px 4px rgba(0,0,20,.15),0 1px 2px rgba(0,0,20,.15);
	background-color: white;
	border-radius: .5rem;
	margin: 20px auto;
	width: 320px;
}

a.mgg-link{
	color:#4ca7c4;
	font-style:none;
}
a.mgg-link:hover{
	color:#4ca1bb;
}
input.mg-common-input{
	height:24px;
	line-height:24px;
	padding:3px 6px;
	border: 1px solid #cbd5e1;
	border-left: 7px solid #9f9f9f;
	font-size:13px;
	border-radius:.25rem;
}
input.mg-common-input:focus{
	border: 1px solid #cbd5e1;
	border-left:7px solid #4cafcf;
	border-radius:.25rem;
}
select.mg-common-select{
	width:160px;
	height:24px;
	line-height:24px;
	padding:3px 6px;
	border: 1px solid #cbd5e1;
	border-left: 7px solid #9f9f9f;
	color:#8f8f8f;
	font-size:12px;
	border-radius:.25rem;
}

/**	Match Game Challenge Form	**/
div.match-form-container{
	position:relative;
	margin:0 auto;
	height:500px;
	overflow-y:auto;
}
div.match-form-container .inner-match-form-container{
	position:relative;
	margin:0 0 30px 0;
	padding:10px 0 0 0;
	border:1px solid #d1d9e0;
	border-radius:.5rem;
}
.match-form-line{
	position:relative;
}
.match-form-line.title-text{
	position:relative;
	font-size:16px;
	margin-bottom:8px;
}

/***group score form***/
.match-form-line.gp{
	position:relative;
	padding:4px 8px;
	margin:0 0 10px 0;
	border: 1px solid #d1d9e0;
	border-radius: .5rem;
}
.match-form-line.gi{
	position:relative;
	padding:0px;
	margin:0 0 10px 0;
}
.match-form-line.gi:not(:last-child){
	border-bottom: 1px solid #d1d9e0;
}
.match-form-line .gp-start{
	position:relative;
	font-size:16px;
	height:22px;
	line-height:22px;
	padding-left:5px;
}
.match-form-line .gi-start{
	position:relative;
	font-size:16px;
	padding-left:5px;
}
.match-form-line .inner-container{
	position:relative;
	margin-top:10px;
	z-index:10;
	padding-left: 16px;
}
.match-form-line .gp-end{
	position:relative;
	height:22px;
	line-height:22px;
	font-size:13px;
	padding-left:5px;
	color:#9f9f9f;
}
.match-form-line .gi-end{
	position:relative;
	height:22px;
	line-height:22px;
	font-size:13px;
	padding-left:5px;
	color:#9f9f9f;
}
.match-form-line .mask{
	position:absolute;
	top:0;
	left:0;
	display:block;
	width:100%;
	height:100%;
	cursor:pointer;
	z-index:3;
}

.inner-container .match-form-line.records{
	cursor:pointer;
	border:1px solid white;
}
.inner-container .match-form-line.records:hover{
	border:1px dashed #9f9f9f;
}

div#detail_record{
	position:relative;
	margin:0 20px 0 27px;
	width:853px;
}
#detail_record .record-board{
	position:relative;
}
.record-board .detail-record-ctn{
	display:inline-block;
	vertical-align:top;
	width:420px;
	font-size:14px;
	color:#4cafcf;
	margin:4px 0;
}
.record-board .detail-record-ctn.correct{
	background-color:#7fba00;
}
.record-board .detail-record-ctn.wrong{
	background-color:#ba4000;
}
.record-board .detail-record-ctn.margin{
	margin-left:13px;
}
.detail-record-ctn span{
	display:inline-block;
	vertical-align:top;
}
.detail-record-ctn .qa-text{
	width:190px;
	height:24px;
	line-height:24px;
	color:white;
}
.detail-record-ctn .vs{
	width:40px;
	height:24px;
	line-height:24px;
	color:#efefef;
}
#detail_record .close-btn{
	position:relative;
	height:15px;
	line-height:15px;
	background-color:#4cafcf;
	font-size:14px;
	color:white;
	cursor:pointer;
}
#detail_record .close-btn:hover{
	background-color:#4ca7c7;
}
/***********************/

.match-form-line .s-container{
	display:inline-block;
	width:160px;
	margin: 0 14px 0 0;
	padding: 0 0 30px 0;
	vertical-align:bottom;
}
.match-form-line .s-container:first-child{
	margin-left:0;
}
.s-container span{
	display:block;
	font-size:14px;
	height:18px;
	line-height:18px;
	margin-bottom:4px;
}
.match-form-line .i-container{
	display:block;
	margin:0;
	padding:0 0 40px 0;
}
.i-container span{
	display:block;
	font-size:13px;
	line-height:24px;
	height:24px;
	margin-bottom:4px;
}
.i-container input{
	width:100%;
	
}
.i-container select.mg-group-ch{
	width:100%;
	height:24px;
	line-height:24px;
	padding:3px 6px;
	border: 1px solid #cbd5e1;
	border-left: 7px solid #9f9f9f;
	font-size:12px;
	border-radius:.25rem;
}

.match-form-line span.title{
	display:inline-block;
	margin: 0 0 10px 17px;
	height:20px;
	line-height:20px;
	border:none;
	font-size:16px;
	color:#4cafcf;
}
.match-form-line span.title.timestamp {
	width:250px;
}
.match-form-line span.title.score {
	width:100px;
}
.match-form-line span.title.email {
	width:350px;
}
.match-form-line span.title.nickname{
	width:350px;
}
.match-form-line.records span{
	display:inline-block;
	color:#333;
	margin:0 0 7px 17px;
	height:18px;
	line-height:18px;
	font-size:13px;
}
.match-form-line.records span.timestamp{
	width:250px;
}
.match-form-line.records span.score{
	width:100px;
}
.match-form-line.records span.email{
	width:350px;
}
.match-form-line.records span.nickname{
	width:350px;
}

/**	Second Navi for MG		**/
div.title-banner{
	text-align:right;
}
div.title-banner .navi-container{
	display:inline-block;
	opacity:0.9;
	height:47px;
	line-height:47px;
	margin:0;
	box-shadow:0 0 1px #d2d0ce;
	background-color:white;
}
div.title-banner span.second-navi.enable{
	display:inline-block;
	height:47px;
	line-height:47px;
	color:#4cafcf;
	padding: 0 13px;
	font-size:15px;
	cursor:pointer;
}
div.title-banner span.second-navi.disable{
	display:inline-block;
	height:47px;
	line-height:47px;
	color:#9f9f9f;
	padding: 0 13px;
	font-size:15px;
}
div.title-banner span.second-navi.enable:hover{
	background-color:#4ca7c7;
	color:white;
}
	
/**	Buttons for MG	**/
.mg-common-btn{
	display:inline-block;
	min-width:126px;
	height:30px;
	line-height:30px;
	vertical-align:bottom;
	padding:0 17px;
	margin: 7px 20px 7px 0;
	font-size:17px;
	color:white;
	background-color:#4cafcf;
	cursor:pointer;
	text-align:center;
	border-radius: .375rem;
}
.mg-common-btn:hover{
	background-color:#4ca7c7;
}
.mg-common-btn.sink{
	background-color:#4ca1bb;
}