@charset "utf-8";
/* CSS Document */


/*-- コンテンツ -------------------------------------------------------------*/
@media screen and (max-width: 767px) {
	#content section { padding: 0 4% 4%; }
	#content section .in { padding: 0 4% 4%; }
	.headline { padding: 20px 0; }
	h2 { }
	h2 span { font-family:'Roboto Condensed', sans-serif; font-weight:bold; font-size: 0.8rem; display: block; color: #dedede; }
}
@media screen and (min-width: 768px) {
	.headline { padding: 30px 0; }
	h2 { font-size: 2.0rem; }
	h2 span { font-family:'Roboto Condensed', sans-serif; font-weight:bold; font-size: 0.8rem; display: block; color: #dedede; }
}
@media screen and (min-width: 768px) and (max-width: 960px)  {
	#content section .in { margin: 0 2% 40px;}
	.headline { padding: 20px 0; }
	h2 { font-size: 1.8rem; }
}
@media screen and (min-width: 961px) and (max-width: 1024px)  {
	#content section .in { margin: 0 2% 40px;}
}
@media screen and (min-width: 1025px) and (max-width: 1259px)  {
	#content section .in { margin: 0 2% 40px;}
}
@media screen and (min-width: 1260px) and (max-width: 1479px)  {
	#content section .in { width: 1024px; margin: 0 auto 40px;}
}
@media screen and (min-width: 1480px) {
	#content section .in { width: 1024px; margin: 0 auto 40px;}
}

/*-- breadcrumbs ------------------------------------------------------------*/
#breadcrumbs { background: #333; }
@media screen and (max-width: 767px) {
	#breadcrumbs .in { margin:0 0%;}
}
@media screen and (min-width: 768px) and (max-width: 959px)  {
	#breadcrumbs .in { margin:0 0% 20px;}
}
@media screen and (min-width: 960px) and (max-width: 1024px)  {
	#breadcrumbs .in { margin:0 0% 30px;}
}
@media screen and (min-width: 1025px) and (max-width: 1259px) {
	#breadcrumbs .in { margin:0 2% 30px;}
}
@media screen and (min-width: 1260px) and (max-width: 1479px)  {
	#breadcrumbs .in { width:1100px; margin:0 auto 40px; }
}
@media screen and (min-width: 1480px) {
	#breadcrumbs .in { width:1200px; margin:0 auto 40px; }
}

@media screen and (max-width: 767px) {
	#breadcrumbs li {
		float:left;
		font-size:11px;
		color:#fff;
		height:18px;
		line-height:18px;
		background:#999999;
		padding:0 10px;
		position:relative;
	}
	#breadcrumbs li:after {
		position:absolute;
		top:0px;
		right:-5px;
		content:"";
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 9px 0 9px 5px;
		border-color: transparent transparent transparent #999999;
		z-index:100;
	}
	#breadcrumbs li a {display:block;}
	
		#breadcrumbs li a         { resize: none; }
		#breadcrumbs li a:link    { color:#fff; text-decoration: none; }
		#breadcrumbs li a:visited { color:#fff; text-decoration: none; }
		#breadcrumbs li a:hover   { color:#fff; text-decoration: none; opacity:0.7; }
		#breadcrumbs li a:active  { color:#fff; text-decoration: none; }

	#breadcrumbs li:nth-child(2) { background:#888; }
		#breadcrumbs li:nth-child(2):after { border-color: transparent transparent transparent #888; }
	#breadcrumbs li:nth-child(3) { background:#777; }
		#breadcrumbs li:nth-child(3):after { border-color: transparent transparent transparent #777; }
	#breadcrumbs li:nth-child(4) { background:#666;}
		#breadcrumbs li:nth-child(4):after { border-color: transparent transparent transparent #666; }
	#breadcrumbs li.current { background:#e60012; }
		#breadcrumbs li.current:after {
			position:absolute;
			top:0px;
			right:-5px;
			content:"";
			width: 0;
			height: 0;
			border-style: solid;
			border-width: 9px 0 9px 5px;
			border-color: transparent transparent transparent #e60012;
			z-index:100;
		}
}
@media screen and (min-width: 768px) {
	#breadcrumbs li {
		float:left;
		font-size:12px;
		color:#fff;
		height:18px;
		line-height:18px;
		background:#999999;
		padding:0 10px;
		position:relative;
	}
	#breadcrumbs li:after {
		position:absolute;
		top:0px;
		right:-5px;
		content:"";
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 9px 0 9px 5px;
		border-color: transparent transparent transparent #999999;
		z-index:100;
	}
	#breadcrumbs li a {display:block;}
	
		#breadcrumbs li a         { resize: none; }
		#breadcrumbs li a:link    { color:#fff; text-decoration: none; }
		#breadcrumbs li a:visited { color:#fff; text-decoration: none; }
		#breadcrumbs li a:hover   { color:#fff; text-decoration: none; opacity:0.7; }
		#breadcrumbs li a:active  { color:#fff; text-decoration: none; }

	#breadcrumbs li:nth-child(2) { background:#888; }
		#breadcrumbs li:nth-child(2):after { border-color: transparent transparent transparent #888;}
	#breadcrumbs li:nth-child(3) { background:#777; }
		#breadcrumbs li:nth-child(3):after { border-color: transparent transparent transparent #777; }
	#breadcrumbs li:nth-child(4) { background:#666;}
		#breadcrumbs li:nth-child(4):after { border-color: transparent transparent transparent #666; }
	#breadcrumbs li.current { background:#e60012; }
		#breadcrumbs li.current:after {
			position:absolute;
			top:0px;
			right:-5px;
			content:"";
			width: 0;
			height: 0;
			border-style: solid;
			border-width: 9px 0 9px 5px;
			border-color: transparent transparent transparent #e60012;
			z-index:100;
		}
}


/*-- second_base------------------------------------------------------------*/
.rainbow {
		height:1px; 
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ecf4a1+0,b3ece9+100 */
		background: #ecf4a1; /* Old browsers */
		background: -moz-linear-gradient(left, #ecf4a1 0%, #b3ece9 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(left, #ecf4a1 0%,#b3ece9 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to right, #ecf4a1 0%,#b3ece9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ecf4a1', endColorstr='#b3ece9',GradientType=1 ); /* IE6-9 */
}
@media screen and (max-width: 767px) {
	.rainbow { display: none; }
	.rainbow-sp {
		height:1px; 
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ecf4a1+0,b3ece9+100 */
		background: #ecf4a1; /* Old browsers */
		background: -moz-linear-gradient(left, #ecf4a1 0%, #b3ece9 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(left, #ecf4a1 0%,#b3ece9 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to right, #ecf4a1 0%,#b3ece9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ecf4a1', endColorstr='#b3ece9',GradientType=1 ); /* IE6-9 */		
	}
}
@media screen and (min-width: 768px) {
	.rainbow-sp { display: none; }
}
@media screen and (min-width: 768px) and (max-width: 959px)  {
	.rainbow {height:1px; margin-top:60px; }
}
@media screen and (min-width: 960px) and (max-width: 1024px)  {
	.rainbow {height:1px; margin-top:60px; }
}
@media screen and (min-width: 1025px) and (max-width: 1259px) {
	.rainbow {height:1px; margin-top:70px; }
}
@media screen and (min-width: 1260px) and (max-width: 1479px)  {
	.rainbow {height:1px; margin-top:80px; }
}
@media screen and (min-width: 1480px) {
	.rainbow {height:1px; margin-top:80px; }
}