/* CSS Document */

#graphicsub {
	background-image: url(../img/pages/bg_listen.jpg);
}


#contents_C h2 {
	background-color: #00A5EC;
	color: #FFF;
	font-size: 20px; font-weight: bold;
	padding: 10px 4px 10px 10px;
}

#contents_C h2 span {
	font-size: 14px;
	font-weight: normal;
}

#contents_C .outbox {
	/*border: 1px solid #CCC;*/
	margin: 20px;
}

#contents_C .outbox img {
	max-width: 80vw;
}

#contents_C .outbox .dbox {
	width: 90%;
	margin: auto;
	line-height: 160%;
	font-size: 0.9em;
	padding-bottom: 30px;
	clear: both;
}

#contents_C .outbox .c00 {
	text-align: center;
}

#contents_C .outbox .c00 h3 {
	/*border-bottom: 2px solid #CCC;*/
	color: #00A5EC;
	font-size: 1.2em;
	font-weight: bold;
}

#contents_C .outbox .c00 ul {
	width: 90%;
	margin: 10px auto;
}

#contents_C .outbox .c00 ul li {
	display: inline-block;
	width: 100%;
	height: 48px;
	/*border: 1px solid #CCC;*/
	margin: 4px 0px;
	color: #FFF;
	line-height: 48px;
	text-align: left;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;	
}

@media only screen and (min-width: 769px) {
#contents_C .outbox .c00 ul li {
	display: inline-block;
	width: 45%;
	height: 48px;
	/*border: 1px solid #CCC;*/
	margin: 4px;
	color: #FFF;
	line-height: 48px;
	text-align: left;
}
}

#contents_C .outbox .c00 ul li a {
	/*display: inline-block;*/
	margin-left: 55px;
	font-weight: bold;
}

#contents_C .outbox .c00 ul li a:link  { color:#FFF; text-decoration: none; }
#contents_C .outbox .c00 ul li a:visited  { color:#FFF; text-decoration: none; }
#contents_C .outbox .c00 ul li a:hover { color:#FFF; text-decoration: none; }
#contents_C .outbox .c00 ul li a:active { color:#FFF; text-decoration: none; }


#contents_C .outbox .c00 ul li:nth-of-type(1) {
	background: url(../img/pages/listen/icon_how_01.png) left 0px center no-repeat #72C1E6;
	
}
#contents_C .outbox .c00 ul li:nth-of-type(2) {
	background: url(../img/pages/listen/icon_how_02.png) left 0px center no-repeat #F4B973;
}
#contents_C .outbox .c00 ul li:nth-of-type(3) {
	background: url(../img/pages/listen/icon_how_03.png) left 0px center no-repeat #F5A8B4;
}
#contents_C .outbox .c00 ul li:nth-of-type(4) {
	background: url(../img/pages/listen/icon_how_04.png) left 0px center no-repeat #6EC5AE;
}


#contents_C .outbox .c01 {
	text-align: left;
}

#contents_C .outbox .c01 h3 {
	border-bottom: 2px solid #72C1E6;
	color: inherit;
	font-size: 1.2em;
	font-weight: bold;
	padding-left: 40px;
	line-height: 30px;
	background: url(../img/pages/listen/icon_how_to_bg_01.png) left 0px bottom no-repeat;
}

#contents_C .outbox .c02 {
	text-align: left;
}

#contents_C .outbox .c02 h3 {
	border-bottom: 2px solid #F4B973;
	color: inherit;
	font-size: 1.2em;
	font-weight: bold;
	padding-left: 40px;
	line-height: 30px;
	background: url(../img/pages/listen/icon_how_to_bg_02.png) left 0px bottom no-repeat;
}

#contents_C .outbox .dbox .block {
	border-bottom: 1px dotted #CCC;
	clear: both;
}

#contents_C .outbox .dbox .L {
	display: inline-block;
	padding: 10px;
	text-align: center;
	line-height: 140%;
	/*border: 1px solid #CCC;*/
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
}

#contents_C .outbox .dbox .L .link {
	margin: 10px auto auto auto;
	background-color: #EBECEC;
	padding: 10px 10px 10px 36px;
	font-weight: bold;
	background: url(../img/pages/icon_arrow.png) left 10px center no-repeat #EBECEC;
}

#contents_C .outbox .dbox .L .link a:link  { color:#000; text-decoration: none; }
#contents_C .outbox .dbox .L .link a:visited  { color:#000; text-decoration: none; }
#contents_C .outbox .dbox .L .link a:hover { color:#000; text-decoration: none; }
#contents_C .outbox .dbox .L .link a:active { color:#000; text-decoration: none; }


#contents_C .outbox .c03 {
	text-align: left;
}

#contents_C .outbox .c03 h3 {
	border-bottom: 2px solid #F5A8B4;
	color: inherit;
	font-size: 1.2em;
	font-weight: bold;
	padding-left: 40px;
	line-height: 30px;
	background: url(../img/pages/listen/icon_how_to_bg_03.png) left 0px bottom no-repeat;
}

#contents_C .outbox .c04 {
	text-align: left;
}

#contents_C .outbox .c04 h3 {
	border-bottom: 2px solid #6EC5AE;
	color: inherit;
	font-size: 1.2em;
	font-weight: bold;
	padding-left: 40px;
	line-height: 30px;
	background: url(../img/pages/listen/icon_how_to_bg_04.png) left 0px bottom no-repeat;
}