@charset "UTF-8";

/*==========================================
 *  リストマーク（common.cssより）
 ==========================================*/
ul,ol {
	margin:0 0 1em 0;
}

ul li {

}
ul li non {
	list-style-type: none;
}

ol li {
	list-style:decimal;
}

li {
	margin-left:2em;
}

 /*================================================
 *  list（style.cssより）
 ================================================*/
.list {
	padding:0 0 0 0.5em;
}
.list li {
	margin:0;
	padding:0 0 0 15px;
	list-style:none;
	background:url(../images/check.png) 0 5px no-repeat;
}

.non {
	margin:0;
	padding:0 0 0 15px;
	list-style:none;
}


 /*================================================
 *  WebWorldリストのマークの種類より
 	http://www.webword.jp/cssguide/ref-list/index1.html
 ================================================*/
ul.list_none{
list-style-type:none;
}

ul.list_disc{
list-style-type:disc;
}

ul.list_circle{
list-style-type:circle;
}

ul.list_square{
list-style-type:square;
}

ol.list_decimal{
list-style-type:decimal;
}

ol.list_lowerroman{
list-style-type:lower-roman;
}

ol.list_loweralpha{
list-style-type:lower-alpha;
}

ol.list_upperalpha{
list-style-type:upper-alpha;
}


 /*================================================
 *  画像を使わずに、CSSのみでリストアイコンを表現したサンプルよりhttp://www.nxworld.net/tips/no-image-css-list-icon.html
 ================================================*/
 
li:first-child {
	margin-top: 0;
}

.default {
	list-style: disc;
}

.list01 li {
	position: relative;
}
.list01 li::after {
	display: block;
	content: '';
	position: absolute;
	top: .7em;
	left: -1em;
	width: 8px;
	height: 1px;
	background-color: #666;
}



/* arrow 01 */
.list02 li {
	position: relative;
}
.list02 li::after {
	display: block;
	content: '';
	position: absolute;
	top: .5em;
	left: -1em;
	width: 6px;
	height: 6px;
	border-right: 1px solid #666;
	border-bottom: 1px solid #666;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}



/* arrow 02 */
.list03 li {
	position: relative;
}
.list03 li::after,
.list03 li::before {
	display: block;
	content: '';
	position: absolute;
}
.list03 li::after {
	top: 8px;
	left: -1em;
	width: 6px;
	height: 6px;
	border-right: 1px solid #666;
	border-bottom: 1px solid #666;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.list03 li::before {
	top: 11px;
	left: -1.025em;
	width: 8px;
	height: 1px;
	background-color: #666;
}



/* original disc 01 */
.list04 li {
	position: relative;
}
.list04 li::after {
	display: block;
	content: '';
	position: absolute;
	top: .5em;
	left: -1em;
	width: 6px;
	height: 6px;
	background-color: #666;
	border-radius: 100%;
}



/* original disc 02 */
.list05 li {
	position: relative;
}
.list05 li::after {
	display: block;
	content: '';
	position: absolute;
	top: .5em;
	left: -1em;
	width: 5px;
	height: 5px;
	background-color: #fff;
	border: 1px solid #3498db;
	border-radius: 100%;
}



/* arrow x disc */
.list06 li {
	position: relative;
}
.list06 li::after,
.list06 li::before {
	display: block;
	content: '';
	position: absolute;
}
.list06 li::after {
	top: .35em;
	left: -1.2em;
	width: 14px;
	height: 14px;
	background-color: #3498db;
	border-radius: 100%;
}
.list06 li::before {
	z-index: 2;
	top: .625em;
	left: -.975em;
	width: 4px;
	height: 4px;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}



/* diamond */
.list07 li {
	position: relative;
}
.list07 li::after {
	display: block;
	content: '';
	position: absolute;
	top: .5em;
	left: -1em;
	width: 6px;
	height: 6px;
	background-color: #3498db;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}



/* check mark */
.list08 li {
	position: relative;
}
.list08 li::after {
	display: block;
	content: '';
	position: absolute;
	top: .5em;
	left: -1em;
	width: 8px;
	height: 3px;
	border-left: 2px solid #3498db;
	border-bottom: 2px solid #3498db;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}



/* character */
.list09 li {
	position: relative;
}
.list09 li::after {
	display: block;
	position: absolute;
	top: .4em;
	left: -1.2em;
	font-size: 12px;
	line-height: 1;
}
.list09 li:nth-of-type(1)::after {
	content: '\002713';
	color: #3498db;
}
.list09 li:nth-of-type(2)::after {
	content: '\00266b';
	color: #e67e22;
}
.list09 li:nth-of-type(3)::after {
	content: '\002665';
	color: #e74c3c;
}
.list09 li:nth-of-type(4)::after {
	content: '\00272a';
	color: #f1c40f;
}
.list09 li:nth-of-type(5)::after {
	content: '\002731';
	color: #9b59b6;
}



/* ranking */
.list10 li {
	position: relative;
	padding-left: 3.5em;
	counter-increment: li;
}
.list10 li::before {
	content: 'Rank ' counter(li) ' -';
	display: block;
	position: absolute;
	top: .3em;
	left: -1em;
	color: #666;
	font-size: 14px;
	line-height: 1;
	font-weight: bold;
}
.list10 li:nth-of-type(1)::before {
	color: #e4aa1d;
}
.list10 li:nth-of-type(2)::before {
	color: #9eaeb9;
}
.list10 li:nth-of-type(3)::before {
	color: #b76901;
}