@charset "utf-8";


#ratingPage #mainContent a:link,
#ratingPage #mainContent a:visited,
#ratingPage #conmainContenttainer a:hover{
	color:#999fff;
}

#ratingPage h1 a:link,
#ratingPage h1 a:visited,
#ratingPage h1 a:hover{
	color:#fff;
	text-decoration: none;
}


#mainContent.container{
	width: 960px;
	margin: 0 auto;
	display: grid;
	grid-template-areas:
		"head head head"
		"main side1 side2"
		"foot foot foot";
}

.contentTitle{
	grid-area: head;
	text-align: center;
}

.side1{
	width: 10px;
	grid-area: side1;
}

.side2{
	width: 10px;
	grid-area: side2;
}


.box{
	box-sizing: border-box;
	border: 1px solid #ccc;
	margin-bottom: 10px;
}

.sampleBox{
	box-sizing: border-box;
	border: 1px solid #090;
	width: 300px;
	margin: 20px;
}
#txtRatingDetail{
	grid-area: main;
}

.ratingMark{
}





#sampleSetMargin .ratingMark{
	margin: 20px;
}
#sampleSetPadding .ratingMark{
	padding: 20px;
	font-size: 20px;
}
#sampleSetPandm .ratingMark{
	margin: 15px;
	padding: 20px;
	font-size: 30px;
}

#sampleChgSize .ratingMark{
	margin: 20px;
	padding: 20px;
	font-size: 50px;
}

#sampleChgSize .ratingMark{
	margin: 20px;
	padding: 20px;
	font-size: 50px;
}
#sampleKana01 .ratingMarkTxt,
#sampleKana02 .ratingMarkTxtMil{
	margin: 20px;
	padding: 20px;
	font-size: 50px;
	display: inline-block;
}

#sampleKana02 .ratingMarkTxtMil{
	font-size: 20px;
}

#sampleSpan .ratingMark{
	margin: 20px;
	padding: 20px;
	font-size: 50px;
}

.ratingPointRed{
	font-size: 30px;
	color: #ccc;
}

.flexBox{
	display: flex;
	flex-wrap: wrap;
}


.flexBox dt,
.flexBox dd{
	box-sizing: border-box;
}

.flexBox dt{
	text-align: center;
	border-top: 1px solid #000;
	border-left: 1px solid #000;
	width: 15%;
	padding-top: 5px;
}

.flexBox dd{
	width: 85%;
	border: 1px solid #000;
	border-bottom: none;
}

.flexBox dd.initial{
	width: 30%;
	border: 1px solid #000;
	border-bottom: none;
}


.flexBox dt:last-of-type,
.flexBox dd:last-of-type{
	border-bottom: 1px solid #000;
}