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

#component{
font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
font-size:13px;
overflow : hidden;
margin-bottom:42px;
width:656px;
line-height: 180%;
color: #666;
}

#component a {
	color: #12c;
	text-decoration: none;
}

#component a:hover {
	text-decoration: underline;
}

#component a:hover img{
    opacity: 0.8;
    filter: alpha(opacity=80);
    -moz-opacity: 0.8;
}

#component .clearfix { zoom:1; }
#component .clearfix:after {
	content: "";
	display: block;
	clear: both;
}

#component .m0 {
	margin: 0 !important;
}

#component .mb0 {
	margin-bottom: 0 !important;
}

#component .mb5 {
	margin-bottom: 5px !important;
}

#component .lead {
	margin-bottom: 20px;
	font-size: 14px;
	letter-spacing: -0.1px;
	color: #000;
}

#component #vol_tab {
	margin: 0 0 30px 0;
	padding: 0;
}

#component #vol_tab li {
	list-style-type: none;
	float: left;
	margin: 0 13px 0 0;
	padding: 0;
}

#component #vol_tab li.last {
	margin-right: 0;
}


#component #vol_tab img {
	vertical-align: bottom;
}

#component .caption {
	font-size: 11px;
	line-height: 1.3;
	margin: 5px 0;
	color: #000;
}

#component .case {
	padding-top: 20px;
	background: url(../images/case_bg.jpg);
}

#component .case .top {
	position: relative;
	margin-bottom: 2px;
	background: url(../images/case_top_bg.png) repeat-y left top;
}

#component .case .top p {
	margin: 0;
}

#component .case .top .image {
	position: absolute;
	left: 0;
	top: -11px;
}

#component .case .top .text {
	min-height: 27px;
	padding: 8px 20px 0 82px;
}

#component .case .inner {
	padding: 0 20px 20px 20px;
}

#component .case .inner2 {
	padding: 13px 20px 20px 20px;
	background-color: #fff;
}

#component .case .col1 {
	float: left;
	width: 360px;
}

#component .case .col2 {
	float: right;
	width: 200px;
}

#component .case ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

#component .bottom_link .btn1 {
	float: left;
}

#component .bottom_link .btn2 {
	float: right;
}

/* dog
====================================== */
#component.dog h2,
#component.dog h3,
#component.dog h4,
#component.dog p {
	margin: 1em 0;
}
#component.dog .h2_title {
	margin-top: 0;
}
#component.dog #vol_tab {
	border-bottom: 8px solid #e3903d;
}

#component.dog .h3_title {
	display: table-cell;
	width: 559px;
	height: 46px;
	line-height: 1.2;
	margin-bottom: 15px;
	padding-left: 96px;
	background: url(../images/h3_component_dog.gif) no-repeat left bottom;
	font-size: 18px;
	font-weight: normal;
	color: #960;
	vertical-align: middle;
}

#component.dog .h4_title {
	display: table-cell;
	width: 470px;
	height: 23px;
	line-height: 1.2;
	padding-left: 78px;
	padding-top: 14px;
	font-size: 14px;
	font-weight: normal;
	color: #c67a2e;
}

#component.dog .h4_title.point1 {
	background: url(../images/h4_component_dog_1.gif) no-repeat left bottom;
}

#component.dog .h4_title.point2 {
	background: url(../images/h4_component_dog_2.gif) no-repeat left bottom;
}

#component.dog .h4_title.point3 {
	background: url(../images/h4_component_dog_3.gif) no-repeat left bottom;
}

#component.dog .col_box1 .col1 {
	float: left;
	width: 375px;
}

#component.dog .col_box1 .col2 {
	float: right;
	width: 264px;
}

#component.dog .col_box1 .col2 .text {
	color: #000;
}

#component.dog .point_col .col1 {
	float: left;
	width: 530px;
}

#component.dog .point_col .col2 {
	float: right;
	float: right;
	width: 100px;
	padding-top: 45px;
}

#component.dog .point_col .col2 .image {
	margin-bottom: 10px;
}

#component.dog .point_col .col2 .name p {
	font-size: 13px;
}

#component.dog .point_col .col2 .prof {
	color: #000;
}

#component.dog .point_col .col2 p {
	line-height: 1.3;
	margin: 5px 0;
	font-size: 11px;
}

#component.dog .col_box2 .col1 {
	float: left;
	width: 295px;
}

#component.dog .col_box2 .col2 {
	float: right;
	width: 160px;
}

#component.dog .point1_image {
	float: right;
	width: 160px;
	margin-left: 20px;
}

#component.dog .point1_image .image {
	margin: 0;
}

#component.dog .case {
	margin-bottom: 20px;
}

#component.dog .case .top a {
	font-size: 15px;
	color: #fc6;
	text-decoration: none;
}

#component.dog .case .top a:hover {
	color: #fe9;
	text-decoration: underline;
}

#component.dog .case .title_wrap {
	position: relative;
	margin-bottom: 15px;
}

#component.dog .case .title {
	display: table-cell;
	width: 498px;
	height: 57px;
	line-height: 1.2;
	margin-bottom: 15px;
	padding-left: 78px;
	background: url(../images/case_title.png) no-repeat right bottom;
	font-size: 16px;
	font-weight: normal;
	color: #960;
	vertical-align: middle;
}

#component.dog .case .kao {
	position: absolute;
	left: 0;
	top: 0;
	margin: 0;
}

#component.dog .case_col .col1 {
	float: left;
	width: 360px;
}

#component.dog .case_col .col2 {
	float: right;
	width: 200px;
}

#component.dog .case strong {
	font-weight: bold;
	color: #984807;
}

#component.dog .case .link a {
	padding-left: 16px;
	background: url(../images/case_arrow.png) no-repeat left 4px;
}

#component.dog .case3 .photo2 {
	margin: 0;
	margin-right: 10px;
	float: left;
}

#component.dog .case3 .caption {
	padding-left: 90px;
}

/* cat
====================================== */
#component.cat h2,
#component.cat h3,
#component.cat h4,
#component.cat p {
	margin: 1em 0;
}
#component.cat .h2_title {
	margin-top: 0;
}
#component.cat #vol_tab {
	border-bottom: 8px solid #93ae42;
}

#component.cat .h3_title {
	display: table-cell;
	width: 559px;
	height: 46px;
	line-height: 1.2;
	margin-bottom: 15px;
	padding-left: 96px;
	background: url(../images/h3_component_cat.gif) no-repeat left bottom;
	font-size: 18px;
	font-weight: normal;
	color: #960;
	vertical-align: middle;
}

#component.cat .h4_title {
	display: table-cell;
	width: 470px;
	height: 23px;
	line-height: 1.2;
	margin-bottom: 20px;
	padding-left: 78px;
	padding-top: 14px;
	font-size: 14px;
	font-weight: normal;
	color: #88a337;
}

#component.cat .h4_title.point1 {
	margin-top: 10px;
	background: url(../images/h4_component_cat_1.gif) no-repeat left bottom;
}

#component.cat .h4_title.point2 {
	background: url(../images/h4_component_cat_2.gif) no-repeat left bottom;
}

#component.cat .h4_title.point3 {
	background: url(../images/h4_component_cat_3.gif) no-repeat left bottom;
}

#component.cat .col_box1 .col1 {
	float: left;
	width: 375px;
}

#component.cat .col_box1 .col2 {
	float: right;
	width: 264px;
}

#component.cat .point_col .col1 {
	float: left;
	width: 530px;
}

#component.cat .point_col .col2 {
	float: right;
	width: 100px;
	padding-top: 45px;
}

#component.cat .point_col .col2 .image {
	margin-bottom: 10px;
}

#component.cat .point_col .col2 .name p {
	font-size: 13px;
}

#component.cat .point_col .col2 .prof {
	color: #000;
}

#component.cat .point_col .col2 p {
	line-height: 1.3;
	margin: 5px 0;
	font-size: 11px;
}

#component.cat .col_box2 .col1 {
	float: left;
	width: 295px;
}

#component.cat .col_box2 .col2 {
	float: right;
	width: 160px;
}

#component.cat .point1_image {
	float: right;
	width: 160px;
	margin-left: 20px;
}

#component.cat .point1_image .image {
	margin: 0;
}

#component.cat .case {
	margin-bottom: 20px;
}

#component.cat .case .top a {
	font-size: 15px;
	color: #fc6;
	text-decoration: none;
}

#component.cat .case .top a:hover {
	color: #fe9;
	text-decoration: underline;
}

#component.cat .case3 .top a {
	font-size: 14px;
}

#component.cat .case .title_wrap {
	position: relative;
	margin-bottom: 15px;
}

#component.cat .case .title {
	display: table-cell;
	width: 498px;
	height: 57px;
	line-height: 1.2;
	margin-bottom: 15px;
	padding-left: 78px;
	background: url(../images/case_title.png) no-repeat right bottom;
	font-size: 15px;
	font-weight: normal;
	color: #960;
	vertical-align: middle;
}

#component.cat .case .kao {
	position: absolute;
	left: 0;
	top: 0;
	margin: 0;
}

#component.cat .case_col .col1 {
	float: left;
	width: 360px;
}

#component.cat .case_col .col2 {
	float: right;
	width: 200px;
}

#component.cat .case strong {
	font-weight: bold;
	color: #984807;
}

#component.cat .case .link a {
	padding-left: 16px;
	background: url(../images/case_arrow.png) no-repeat left 4px;
}

/* hirose
====================================== */
#component.hirose h2,
#component.hirose h3,
#component.hirose h4,
#component.hirose p {
	margin: 1em 0;
}
#component.hirose .h2_title {
	margin-top: 0;
}
#component.hirose #vol_tab {
	border-bottom: 8px solid #ad9465;
}

#component.hirose .h3_title {
	display: table-cell;
	width: 594px;
	height: 46px;
	line-height: 1.2;
	margin-bottom: 15px;
	padding-left: 61px;
	background: url(../images/h3_component_hirose.gif) no-repeat left bottom;
	font-size: 16px;
	font-weight: normal;
	color: #960;
	vertical-align: middle;
}

#component.hirose .h4_title {
	display: table-cell;
	width: 530px;
	line-height: 1.2;
	margin-bottom: 20px;
	padding-top: 14px;
	font-size: 13px;
	font-weight: bold;
	color: #ad9465;
	border-bottom: 1px solid #ad9465;
}

#component.hirose .col_box1 .col1 {
	float: left;
	width: 375px;
}

#component.hirose .col_box1 .col2 {
	float: right;
	width: 264px;
}

#component.hirose .point_col .col1 {
	float: left;
	width: 530px;
}

#component.hirose .point_col .col2 {
	float: right;
	width: 100px;
	padding-top: 70px;
	word-wrap: break-word
}

#component.hirose .point_col .col2 .image {
	margin-bottom: 10px;
}

#component.hirose .point_col .col2 .name p {
	font-size: 12px;
}

#component.hirose .point_col .col2 .prof {
	color: #000;
}

#component.hirose .point_col .col2 p {
	line-height: 1.3;
	margin: 5px 0;
	font-size: 11px;
}

#component.hirose .col_box2 .col1 {
	float: left;
	width: 295px;
}

#component.hirose .col_box2 .col2 {
	float: right;
	width: 160px;
}

#component.hirose .point1_image {
	float: right;
	width: 160px;
	margin-left: 20px;
}

#component.hirose .point1_image .image {
	margin: 0;
}

#component.hirose .point_col .photo_05 {
	padding-top: 350px;
}

#component.hirose .point_col .photo_08 {
	padding-top: 259px;
}

#component.hirose .point_col .photo_10 {
	padding-top: 89px;
}