@charset "utf-8";

/* ----------------------------------------------------------
 Frameworks
-----------------------------------------------------------*/

/* Category Title */
.bead #contents:before { background: transparent url("/bead/images/categoryTitle.jpg") no-repeat center center; }

/* LocalNav */



/* ----------------------------------------------------------
 Bead > index.html
-----------------------------------------------------------*/

/*---------- newBeadSec ----------*/

#newBeadSec {
	}
	#newBeadSec h3 {
		}


	dl#phBead {
		float: left;
		width: 390px;
		margin: 0 20px 0 0;
		}
		dl#phBead dt {
			margin: 0 0 5px;
			}
			dl#phBead dt a {
				padding: 9px;
				display: block;
				background: #f9f9f9;
				border: 1px solid #ddd;
				}
				dl#phBead dt a:hover { border: 1px solid #0666a8; }
	
				dl#phBead dt a img {
					width: auto; height: auto;
					max-width: 100%; max-height: 100%;
					}
	
		dl#phBead dd { text-align: center; }
	
	#beadBox {
		float: right;
		width: 470px;
		}
		#beadBox h3 {
			margin: 0 0 20px; padding: 8px 0 14px 16px;
			font-size: 1.5rem;
			line-height: 1.875rem;
			border-left: 4px solid #0666a8;
			}
			#beadBox h3:after { display: none; margin-top: -2px; }
			
			#beadBox h3 a {
				}
				#beadBox h3 a:hover { text-decoration: underline; }

		#beadBox table th { width: 9.5rem; }

	#nbPresent {
		float: right;
		width: 470px;
		margin: 0; padding: 20px;
		box-shadow: inset 0 0 0 1px #ddd;
		border: 4px solid #f3f3f3;
		}
		#nbPresent h3 {
			margin: 0 0 10px; padding: 10px 5px;
			font-size: 1.25rem;
			color: #fff;
			line-height: 1.875rem;
			text-align: center;
			background: #a0c9f2;
			border: none;
			border-radius: 3px;
			}
		
		#nbPresent h4 {
			margin: 0 0 10px; padding: 2px 0 2px 20px;
			font-size: 1.125rem;
			font-family: 'Noto Sans JP', "メイリオ", meiryo, verdana ,'ＭＳ Ｐゴシック', "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN" ,osaka ,sans-serif;
			line-height: 1.35;
			background: transparent url("/common/images/icoSquare.gif") no-repeat left 0.5rem;
			border: none;
			}
		
		#nbPresent .phPresent {
			margin: 0 0 18px; padding: 0 20px;
			text-align: center;
			}
			#nbPresent .phPresent img {
				width: auto !important; height: auto !important;
				max-width: 100%; max-height: 100%;
				}
		
		#nbPresent table {
			margin: 0;
			}
			#nbPresent table th { width: 6rem; }
			#nbPresent table th ,
			#nbPresent table td { padding: 8px 10px; }


/*---------- surveySec ----------*/

#surveySec {
	}
	#surveySec table#surStyle {
		margin: 30px 0;
		display: block;
		border: none;
		}
		#surveySec table#surStyle tbody ,
		#surveySec table#surStyle tr    ,
		#surveySec table#surStyle th    ,
		#surveySec table#surStyle td    {
			display: block;
			border: none;
			}
			#surveySec table#surStyle tr { margin: 0 0 10px; }
			#surveySec table#surStyle th {
				padding: 12px 15px;
				}
				#surveySec table#surStyle th span {
					margin: -15px 10px -15px 0; padding: 15px 7px;
					display: inline-block;
					font-weight: bold;
					color: #fff;
					background: #0666a8;
					}
				
			#surveySec table#surStyle td {
				padding: 12px 15px 12px 35px;
				/*border-left: 1px dotted #ccc;*/
				}
				#surveySec table#surStyle td ul {
					}
					#surveySec table#surStyle td ul li {
						float: left;
						width: 240px;
						margin: 0 40px 0 0;
						}

		#surveySec table.defStyle th { width: 16rem; }
		#surveySec table.defStyle td ul {
			}
			#surveySec table.defStyle td ul li {
				float: left;
				margin: 0 40px 0 0;
				}



/* ----------------------------------------------------------
 Bead > backnumber.html
-----------------------------------------------------------*/

/*---------- beadBox ----------*/

.beadBox {
	position: relative;
	min-height: 300px;
	padding: 0 0 0 250px;
	}
	#contents .beadBox h3 {
		margin: 0 0 20px; padding: 8px 0 14px 16px;
		font-size: 1.5rem;
		line-height: 1.875rem;
		border-left: 4px solid #0666a8;
		}
		#contents .beadBox h3:after { display: none; margin-top: -2px; }
		
		#contents .beadBox h3 a {
			}
			#contents .beadBox h3 a:hover {
				text-decoration: underline;
				}
	
	.beadBox p.phBead {
		position: absolute;
		left: 0; top: 0;
		width: 220px;
		margin: 0;
		}
		.beadBox p.phBead a {
			padding: 4px;
			display: block;
			background: #f9f9f9;
			border: 1px solid #ddd;
			}
			.beadBox p.phBead a:hover { border: 1px solid #0666a8; }
			
			.beadBox p.phBead a img {
				width: auto; height: auto;
				max-width: 100%; max-height: 100%;
				}

	.beadBox table th {
		width: 14rem;
		}