html{

}
body{
	background-color:#eeeada;
}
.clickable{
	cursor:pointer;
}
hr {
	height: 1px;
	border: none;
	border-top: 1px #CCC solid;
}
.container{
	margin:0 auto;
}
 @media (min-width: 1200px){
	.container{
		width:1200px;
	}
}
 @media (min-width: 981px) and (max-width: 1199px) {
	.container{
		width:100%;
	}
}
 @media (min-width: 641px) and (max-width: 980px) {
	.container{
		width:980px;
	}
}
 @media (min-width: 641px){

	/********************************
	641px以上(PC)のCSS
	汎用的なものだけ書く
	*************************/


	#spMenu{
		display:none;
	}
	#wholeWrapper{
		min-width:1000px;
	}
	.container{
		padding:0 20px;
	}

	div#headerContent{
		height:60px;
	}

	div#mainImage{
		height:300px;
	}
	.secondPage div#mainImage{
		height:120px!important;
	}
	.secondPage div#mainImageContainer img{
		width:25%;
		margin-top:20px;
		margin-left:5%;
	}


	div#mainContentLeft{
		display:block;
	}
	div#mainContentRight{
		float:right;
		padding:30px;
		width:calc(100% - 270px) ;
	}

	#menuButton{
		display:none;
	}
	div#footer{
		padding:20px;
	}
	.noPC{
		display:none;
	}
	/********************************
	641px以上(PC)のCSS
	サイト特有のもの
	*************************/

	div#mainImageContainer img{
		width:40%;
		margin-top:100px;
		margin-left:10%;
	}
	#yakuzemiLogo{
		width:180px;
		margin-top:10px;
	}
	#mizuhoLogo{
		display:block;
	}


/* */
	#top001{
		width:48%;
		float:left;
	}
	#top002{
		width:48%;
		float:right;
	}
}
 @media (max-width: 640px){

	/********************************
	640px以下(SP)のCSS
	汎用的なものだけ書く
	*************************/


	#spMenu{
		display:block;
		top:-1000px;
	}
	#wholeWrapper{
		min-width:100%;
	}
	div#mainImage{
		height:180px;
		position:relative;
	}
	.secondPage div#mainImage{
		height:120px!important;
	}

	.container{
		padding:5px;
	}
	div#mainImageContainer {

	}
	.container{
		width:100%;
	}
	div#mainContentLeft{
		display:none;
	}
	div#mainContentRight{
		padding:5px;
		width:100%;
	}
	div#header{
		position:fixed;
		z-index:1000;
	}
	div#headerContent{
		height:40px;
	}
	#menuButton{
		display:block;
	}
	div#footer{
		padding:5px;
	}
	div#copyright{
		width:100%;
		text-align:center;
		padding:3em 0;
		color:#CCC;
	}
	/********************************
	640px以下(SP)のCSS
	サイト特有のもの
	*************************/
	div#mainImageContainer img{
		height:40%;
		position:absolute;
		bottom:5px;
	}
	#yakuzemiLogo{
		width:140px;
		margin-top:0px;
	}
	#mizuhoLogo{
		display:none;
	}



	#top001,#top002{
		width:100%;
	}

}

div#mainImage{
			background-image:url("../images/mainbg.jpg");
		width:100%;
	background-position:center top;
}
#yakuzemiLogo{
	float:left;
}
#mizuhoLogo{
	width:85px;
	margin-top:5px;
	float:right;
}
div#spMenu{
	/*background-color:rgba(238,234,218,0.8);*/
	background-color:rgba(30,30,30,0.8);
	position:absolute;
	z-index:1002;
	width:100%;
	padding-bottom:60px;
}
div#spMenuContent{
	padding-bottom:30px;
}
div#spMenuCloser{
	display:none;
	position:fixed;
	z-index:1001;
	height:100%;
	width:100%;
	background-color:rgba(30,30,30,0.2);
}
div#header{
	background-color:#fff;
	width:100%;
	border-bottom:1px solid #CAB;
}

#menuButton{
	width:30px;
	margin-top:2px;
	float:right;
}



div#mainContentWrapper{
	overflow:hidden;
	padding:20px 0;
}
div#mainImageContainer{
	overflow:hidden;
}

div#mainContent{
	overflow:hidden;
}
div#mainContentLeft{
	float:left;
	height:100%;
	width:250px;
	background-color:#fff;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	border:1px #ccc solid;
}
div#mainContentRight{
	height:100%;
	background-color:#fff;
	overflow:hidden;
	min-height:500px;
}
div#footer{
	background-color:#827a6b;
	color:#fff;
	overflow:hidden;
	min-height:150px;
}
address{
	float:left;
	line-height:1.4em;
}
address a{
	color:#fff;
}
div#copyright{
	float:right;
}



.formBlock{
	background-color:#f5f5f5;
	margin:10px;
	padding:10px;
}
.formBlock input[type="text"]{
	border:solid 1px #CCC;
	background-color:#EEE;
	width:100%;
	margin-bottom:8px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	padding:0.5em;
	-webkit-appearance: none; 
}
.formBlock .title{
	font-size:110%;
	font-weight:bold;
	color:#0085d0;
	margin-bottom:0.5em;
}
.formBlock .title2{
	font-size:110%;
	font-weight:bold;
	color:#ad2d00;
	margin-bottom:0.5em;
}

.button{
	line-height:1em;
	text-align:center;
	padding:0.5em;
	-webkit-border-radius: 2em;
	-moz-border-radius: 2em;
	border-radius: 2em;
	background: #666666;
	background: -webkit-gradient(linear, left top, left bottom, from(#777777), to(#666666));
	background: -webkit-linear-gradient(top, #777777, #666666);
	background: -moz-linear-gradient(top, #777777, #666666);
	background: -ms-linear-gradient(top, #777777, #666666);
	background: -o-linear-gradient(top, #777777, #666666);
	background-image: -ms-linear-gradient(top, #777777 0%, #666666 100%);
	color:#fff;
	border:solid 3px #CCC;
	width:100%;
	margin:10px 0;
	cursor:pointer;
}
.button:hover{
	border:solid 3px #F99;
}
.button a{
	color:#fff;
	text-decoration:none;
}
.disabled{
	background: #BBB!important;
	cursor:default!important;
}
.disabled:hover{
	border:solid 3px #CCC!important;
}






.close{
	margin:20px 10%;
	background: #EEE;
	width:80%;
}
.close a{
	color:#333;
	text-decoration:none;
}
.loginName{
	padding:10px;
	line-height:1.2em;
	background: #274c3a;
	color:#fff;
	border-top-right-radius: 5px;
	border-top-left-radius: 5px;
}



/*-------- ���K�w�ėp -------------- */
	h2{
		background-color:#274c3a;/*ff7e77 274c3a 618fe2*/
		color:#fff;
		font-weight:bold;
		line-height:1em;
		padding:10px 30px;
		font-size:120%;
		border-radius:3px;
		margin-bottom:2em;
	}
	h3{
		background-color:#f3f5f8;/*ff7e77 274c3a 618fe2*/
		color:#274c3a;
		font-weight:bold;
		line-height:1em;
		padding:10px 30px;
		font-size:120%;
		border-radius:3px;
		margin-bottom:1em;
	}

	.contentBlock{
		padding-bottom:3em;
	}


	table.typical{
		border-top:1px solid #CACACA;
		border-left:1px solid #CACACA;
		border-collapse:collapse;
		border-spacing:0;
		background-color:#ffffff;
		empty-cells:show;
	}
	.typical th{
		background-color:#f3f5f8;
		color:#274c3a;
		border-right:1px solid #CACACA;
		border-bottom:1px solid #CACACA;
		padding:0.3em 1em;
		text-align:center;
		vertical-align:middle;
		font-weight:bold;
		line-height:1em;
	}
	th.doubleTh{
		text-align:center;
	}
	.typical td{
		border-right:1px solid #CACACA;
		border-bottom:1px solid #CACACA;
		padding:0.3em 0.5em;
	}

	ul.searchCheckboxes li{
		float:left;
		margin-right:2em;
	}
	#evaluatorSelectSearch table.typical{
		width:100%;
	}
	.halfButtonWrapper{
		width:50%;
		margin:2em auto;
	}







	table.evaluatedTable{
		margin:20px 0;
		width:100%;
		border-top:1px solid #CACACA;
		border-left:1px solid #CACACA;
		border-collapse:collapse;
		border-spacing:0;
		background-color:#ffffff;
		empty-cells:show;
	}
	.evaluatedTable th{
		background-color:#f5f8f3;
		color:#345b00;
		border-right:1px solid #CACACA;
		border-bottom:1px solid #CACACA;
		padding:0.3em 1em;
		text-align:left;
		vertical-align:middle;
		font-weight:bold;
		line-height:1em;
	}
	.evaluatedTable th.qString{
		text-align:left;
		font-weight:100;
		font-size:120%;
		line-height:1.6em;
	}
	
	.evaluatedTable td{
		border-right:1px solid #CACACA;
		border-bottom:1px solid #CACACA;
		padding:1em 0.5em;
		text-align:left;
		line-height:1em;
	}
	.linearGraph{
		width:200px;
	}





	table.answerTable{
		margin:20px 0;
		width:100%;
		border-top:1px solid #CACACA;
		border-left:1px solid #CACACA;
		border-collapse:collapse;
		border-spacing:0;
		background-color:#ffffff;
		empty-cells:show;
	}
	.answerTable th{
		background-color:#f5f8f3;
		color:#345b00;
		border-right:1px solid #CACACA;
		border-bottom:1px solid #CACACA;
		padding:0.3em 1em;
		text-align:center;
		vertical-align:middle;
		font-weight:bold;
		line-height:1em;
	}
	.answerTable th.qNo{
		width:4em;
	}
	.answerTable th.qString{
		text-align:left;
		font-weight:100;
		font-size:120%;
		line-height:1.6em;
	}
	
	.answerTable td{
		border-right:1px solid #CACACA;
		border-bottom:1px solid #CACACA;
		padding:1em 0.5em;
		text-align:center;
		line-height:1em;
		cursor:pointer;
	}
	.answerTable td:hover{
		background-color:#FFEEEE;
	}
	.answerComment{
		width:95%;
		height:4em;
	}
#pwnnFrom{
	width:80%;
	margin:5% 10%;
	padding:5% 10%;
	background-color:#f5f5f5!important;
}
#pwnnFrom table{
	width:100%;
}
#pwnnFrom input[type="text"]{
	width:100%!important;
}
/* ---------- フォーム系 ---------- */
	.mailAttn{
		padding:15px;
		background-color:#eeffee;
		width:90%;
		margin:0 auto;
		font-size:90%;
	}
	table.appFormTable{
		border-top:1px solid #CACACA;
		border-left:1px solid #CACACA;
		border-collapse:collapse;
		border-spacing:0;
		background-color:#ffffff;
		empty-cells:show;
		margin:20 0px;
	}
	.appFormTable th{
		background-color:#eeeada;
		color:#111;
		border-right:1px solid #CACACA;
		border-bottom:1px solid #CACACA;
		padding:0.3em 1em;
		text-align:left;
		vertical-align:middle;
		font-weight:100;
		width:200px;
		line-height:1.1em;
	}
	th.doubleTh{
		text-align:center;
	}
	.appFormTable td{
		border-right:1px solid #CACACA;
		border-bottom:1px solid #CACACA;
		padding:0.3em 1em;
	}
	.attn{
		font-size:90%;
		color:#990000;
		line-height:1.2;
	}
	ul.attn{
		padding-left:1.5em;
	}
	ul.attn li{
		text-indent:-1.5em;
		list-style-type:none;
	}
	.h{
		color:#900;
		font-size:16px;
	}
	input.longForm{
		width:380px;
	}
	input.shortForm{
		width:150px;
	}
	input.veryShortForm{
		width:80px;
	}
	textarea.longForm{
		width:400px;
	}
	textarea.longForm{
		height:100px;
	}
	.errorField{
		background-color:#fee;
	}
	.errorMsg{
		color:#900;
		background-color:#fee;
	}
	ul.shortForm{
		list-style:none;
		display:inline;
		margin:0;
		padding:0;
	}
	li.shortForm{
		display:inline;
	}
	p.formAttn{
		background-color:#fee8db;
		font-size:95%;
		line-height:1.4em;
		padding:10px;
	}
/*-------- 組織管理画面 -------------- */
	table.candidatesTable{
		border-top:1px solid #CACACA;
		border-left:1px solid #CACACA;
		border-collapse:collapse;
		border-spacing:0;
		background-color:#ffffff;
		empty-cells:show;
	}
	.candidatesTable th{
		background-color:#f3f5f8;
		color:#00345b;
		border-right:1px solid #CACACA;
		border-bottom:1px solid #CACACA;
		padding:0.3em 1em;
		text-align:center;
		vertical-align:middle;
		font-weight:bold;
		line-height:1em;
	}
	th.doubleTh{
		text-align:center;
	}
	.candidatesTable td{
		border-right:1px solid #CACACA;
		border-bottom:1px solid #CACACA;
		padding:0.3em 0.5em;
	}

	.candidatesTable .resultJikosai{
		background-color:#faefff;
		font-weight:bold;
	}
 
/*-------- MyPage -------------- */
table.highchart{
	display:none;
}
.wrongAns{
	background-color:#CCC;
}
.checkCorrectAnswers{
	width:100%;
}
table.resultTable td.commentTd{
	text-align:left;
}
td.checkCorrectAnswersComment{
	text-align:left;
}

.resultNewsTitle{
	background-image:url("../images/resultNewsTitleBg.png");
	background-repeat:no-repeat;
	background-position:center middle;
	line-height:1em;
	padding-left:15px;
	font-weight:bold;
}
.resultNewsDate{
	font-weight:100;
	color:#999;
	font-size:80%;
}

@media print { 
	body {
		-webkit-print-color-adjust: exact;
	}
	#header{
		display:none;
	}
	#mainImage{
		display:none;
	}
	.wlcCmsParagraphMain svg.linearGraph2{
		display:block;
		page-break-after:avoid;
		width:50%!important;
	}
	/*
	.wlcCmsParagraphMain .evaluatedTable:nth-child(3n){
		page-break-after:always;
	}
	*/
	.wlcCmsParagraphMain .evaluatedTable{
		page-break-inside: avoid;
	}
	.wlcCmsParagraphMain h2:first-child{
		display:none;
	}
	h2:before,
	h2:after{
		content:"";
		display:block;
		width:100%;
		clear:both;
		height:2px;
		overflow:hidden;
	}
	.wlcCmsParagraphMain h2,
	.wlcCmsParagraphMain h3{
		display:block;
		clear:both;
		width:100%;
		page-break-after:avoid;
		overflow:hidden;
	}
	.wlcCmsParagraphMain h2:first-child{
		margin-top:0em;
	}


	.wlcCmsParagraphMain h2{
		margin-top:4em;
		margin-bottom:-2em;
	}
	.wlcCmsParagraphMain h2{
		margin-bottom:0;
	}
	.wlcCmsParagraphMain h3{
		margin-top:1em;
		margin-bottom:0.5em;
	}
	.wlcCmsParagraphMain .evaluatedTable td {
		font-size:80%;
		padding:0 0.5em;
	}
	.linearGraph {
		width:6em;
	}
	.wlcCmsParagraphMain table.evaluatedTable{
		width:48%;
		margin:0.5em 1%;
		float:left;
		padding:0.5em;
	}
	.wlcCmsParagraphMain .evaluatedTable th{
		height:3em;
		overflow:hidden;
		padding:0.1em;
	}
	.wlcCmsParagraphMain .evaluatedTable td{
		padding:0.2em;
	}
	.wlcCmsParagraphMain .evaluatedTable .typical th{
		height:auto;
		overflow:hidden;
		padding:0.2em 1em;
	}
	.wlcCmsParagraphMain .evaluatedTable .typical td{
		text-align:center;
	}
	#footer{
		display:none;
	}
}