@charset "utf-8";

/*******************************
  共通設定
*******************************/

	body {
		color: #333;
	}
	
	#bg {
		max-width: none;
		margin: 0 0 0 -720px;
		position: fixed;
		bottom: 0;
		left: 50%;
	}
	#wrap {
		position: relative;
	}
	
	a {
		color: #333;
		transition: opaciy .5s;
	}
	a:hover {
		-ms-filter: "alpha(opacity=80)";
		opacity: .8;
	}
	
	img {
		max-width: 100%;
	}
	
	.wrap {
		max-width: 1180px;
		margin-right: auto;
		margin-left: auto;
		padding-right: 10px;
		padding-left: 10px;
	}
	
	.sp {
		display: none;
	}

@media only screen and (max-width:640px) {
	.wrap {
		padding-right: 5px;
		padding-left: 5px;
	}
	.pc {
		display: none;
	}
	div.sp {
		display: block;
	}
	span.sp {
		display: inline;
	}
	img.sp {
		display: inline-block;
	}
	br.sp {
		display: inline;
	}
	span.sp + img,
	img.sp + img {
		display: none;
	}
}
	/* header */
	
	#header {
		background: #fff;
	}
	#header .wrap {
		padding-top: 14px;
		padding-bottom: 11px;
		position: relative;
	}
	#siteTitle {
		width: 273px;
	}
	#siteTitle a {
		display: block;
		height: 40px;
		background: url(../imgs/hdr-logo.png) 0 0 no-repeat;
		text-indent: -9999px;
	}
	#hNav li {
		position: absolute;
	}
	#hNav .company {
		display: inline-block;
		padding: 0 0 0 10px;
		top: 21px;
		right: 147px;
		background: url(../imgs/blt-01.png) 0 50% no-repeat;
	}
	#hNav .english {
		top: 0;
		right: 0;
	}
	#hNav .menu {
		display: none;
	}
	
@media only screen and (max-width:640px) {
	#header .wrap {
		padding-bottom: 13px;
	}
	#siteTitle {
		width: 137px;
		margin: 0 0 0 7px;
	}
	#siteTitle a {
		height: 20px;
		background-size: contain;
	}
	#hNav .company,
	#hNav .english {
		display: none;
	}
	#hNav .menu {
		display: block;
		width: 47px;
		height: 47px;
		top: 0;
		right: 10px;
		background: url(../imgs/sp/hdr-menu.png) 50% 50% no-repeat;
		background-size: 19px 18px;
	}
	#hNav .menu.active {
		background-image: url(../imgs/sp/hdr-menu_on.png);
	}
}
	/* gNav */
	
	#gNav {
		border-bottom: 1px solid #0e3284;
		background: url(../imgs/bg-nav.png) 0 0 repeat-x;
	}
	#gNav .wrap {
		padding: 0;
	}
	
	#gNav .layer01 li {
		width: 16%;
		float: left;
		position: relative;
	}
	#gNav .layer01 li.first,
	#gNav .layer01 li.last {
		width: 18%;
	}
	#gNav .layer01 a {
		display: block;
		height: 40px;
		position: relative;
		background: 50% 0 no-repeat;
		text-indent: -9999px;
	}
	#gNav .layer01 .about a {
		background-image: url(../imgs/nav-about.png);
	}
	#gNav .layer01 .item01 a {
		background-image: url(../imgs/nav-items01.png);
	}
	#gNav .layer01 .item02 a {
		background-image: url(../imgs/nav-items02.png);
	}
	#gNav .layer01 .case a {
		background-image: url(../imgs/nav-case.png);
	}
	#gNav .layer01 .support a {
		background-image: url(../imgs/nav-support.png);
	}
	#gNav .layer01 .recruit a {
		background-image: url(../imgs/nav-recruit.png);
	}
	#gNav .layer01 a:before,
	#gNav .layer01 a:after {
		content: '';
		display: block;
		width: 1px;
		height: 34px;
		position: absolute;
		top: 3px;
	}
	#gNav .layer01 a:before {
		left: 0;
		background: #0e67c1;
	}
	#gNav .layer01 a:after {
		right: 0;
		background: #0e3284;
	}
	#gNav .layer01 .first a:before {
		border-left: 1px solid #0e3284;
	}
	#gNav .layer01 .last a:after {
		border-right: 1px solid #0e67c1;
	}
	
	#gNav .layer02 {
		display: none;
		width: auto;
		position: absolute;
		top: 100%;
		left: 0;
		background: #fff;
		font-size: 11px;
		line-height: 40px;
		white-space: nowrap;
		z-index: +100;
	}
	#gNav .layer02 li,
	#gNav .layer02 li.first,
	#gNav .layer02 li.last {
		width: auto;
		float: none;
		position: static;
	}
	#gNav .layer02 a {
		height: auto;
		padding: 0 15px;
		position: static;
		background-image: none !important;
		text-indent: 0;
		text-decoration: none;
	}
	#gNav .layer02 a:before,
	#gNav .layer02 a:after {
		content: normal;
	}
	#gNav .layer02 a:hover {
		background: #0030c0;
		color: #fff;
		-ms-filter: "alpha(opacity=100)";
		opacity: 1;
	}
	
	#gNav .layer03 {
		display: none;
		width: 555px;
		padding: 13px 0 0 20px;
		position: absolute;
		top: 0;
		left: 100%;
		background: #fff;
		box-shadow: inset 2px 2px 4px #ccc;
		box-shadow: inset 2px 2px 4px rgba(0,0,0,.2);
		font-size: 14px;
		line-height: 20px;
	}
	#gNav .layer03 dt {
		margin: 0 0 20px;
		padding: 0 0 0 8px;
		border-left: 12px solid #0030c0;
		color: #0030c0;
		line-height: 19px;
	}
	#gNav .layer03 dd {
		width: 150px;
		margin: 0 0 35px;
		padding: 0 25px 0 10px;
		float: left;
		text-align: center;
	}
	#gNav .layer03 .n01 {
		clear: both;
	}
	#gNav .layer03 a:hover {
		background: transparent;
		color: #333;
		-ms-filter: "alpha(opacity=80)";
		opacity: .8;
	}
	#gNav .layer03 dd img {
		display: block;
		margin: 0 0 10px;
	}
	#gNav .layer03 small {
		font-size: 12px;
	}
	
	#gNavBg {
		display: none;
		position: absolute;
		width: 100%;
		top: 105px;
		left: 0;
		background: #000;
		-ms-filter: 'alpha(opacity=50)';
		opacity: .5;
	}
	
@media only screen and (max-width:1300px) {
	#gNav .item02 .layer03 {
		width: 370px;
	}
	#gNav .item02 .layer03 .n01 {
		clear: none;
	}
	#gNav .item02 .layer03 dd:nth-of-type(odd) {
		clear: both;
	}
}
@media only screen and (max-width:900px) {
	#gNav .item01 .layer03 {
		width: 370px;
	}
	#gNav .item01 .layer03 .n01 {
		clear: none;
	}
	#gNav .item01 .layer03 dd:nth-of-type(odd) {
		clear: both;
	}
	#gNav .item02 .layer03 {
		width: 185px;
	}
}
@media only screen and (max-width:640px) {
	#header {
		position: relative;
		z-index: +100;
	}
	#gNav {
		display: none;
		width: 100%;
		border-bottom: none;
		padding: 0 5px;
		position: absolute;
		top: 47px;
		left: 0;
		background: #fff;
		box-shadow: 0 4px 4px #ccc;
		z-index: +100;
	}
	#gNav .layer01 li,
	#gNav .layer01 li.first,
	#gNav .layer01 li.last {
		width: auto;
		border-top: 1px solid #eee;
		float: none;
	}
	#gNav .layer01 a {
		height: 45px;
		padding: 0 0 0 16px;
		background: none;
		color: #03c;
		line-height: 45px;
		text-indent: 0;
		text-decoration: none;
	}
	#gNav .layer01 a:before {
		content: normal;
	}
	#gNav .layer01 a:after {
		width: 7px;
		height: 12px;
		border: none !important;
		top: 16px;
		right: 26px;
		background: url(../imgs/sp/blt-01.png) 0 0 no-repeat;
		background-size: contain;
	}
	
	
	
	#gNav .layer02,
	#gNav .layer03 {
		display: none !important;
	}
	#gNavBg {
		display: none !important;
	}
}

/* main */
	
	#contents {
		width: 100%;
		overflow: hidden;
	}
	#breadCrumb {
		padding-top: 9px;
		padding-bottom: 9px;
	}
	#breadCrumb li {
		display: inline-block;
	}
	#breadCrumb .home {
		padding: 0 0 0 20px;
		background: url(../imgs/blt-home.png) 0 50% no-repeat;
	}
	#breadCrumb li:after {
		content: '>';
		padding: 0 1em;
		color: #ccc;
	}
	#breadCrumb .last:after {
		content: normal;
	}
	#breadCrumb a {
		color: #0e67c1;
		text-decoration: underline;
	}
	
	.bgGray {
		background: #f7f7f7;
	}
	.bgWhite {
		background: #fff;
	}
	.brown {
		color: #bc5050;
	}
	.green {
		color: #749a2c;
	}
	.lightBlue {
		color: #3993b9;
	}
	
	.titleA {
		border-left: 12px solid #666;
		padding: 0 0 0 13px;
	}
	.titleB {
		border-bottom: 1px solid #aba694;
		padding: 0 0 16px;
	}
	.titleC {
		padding: 0 0 14px;
		background: url(../imgs/line-02.png) 0 100% repeat-x;
	}
	.titleD {
		padding: 0 0 17px;
		background: url(../imgs/line-01.png) 50% 100% repeat-x;
	}
	
@media only screen and (max-width:640px) {
	#breadCrumb .home {
		margin: 0;
	}
	
	.titleA {
		border-left-width: 6px;
		padding: 0 0 0 5px;
		color: #000;
		font-size: 14px;
		line-height: 18px;
		text-indent: 0;
	}
	.titleB {
		padding: 0 0 10px;
		font-size: 16px;
		font-weight: normal;
		line-height: 20px;
	}
	.titleD {
		padding: 0 0 10px;
		background-image: url(../imgs/sp/line-01.png);
		background-size: auto 1px;
		font-size: 18px;
		line-height: 28px;
	}
	
	.btn a {
		display: block;
		color: #fff;
		font-size: 14px;
		line-height: 40px;
		text-align: center;
		text-decoration: none;
	}
	.btLightBlue {
		background: #2c7abd;
	}
	.btBlack {
		background: #000;
	}
	.btBrown {
		background: #d63836;
	}
	.btGreen {
		background: #b6c61b;
	}
}

	#category {
		padding-top: 25px;
		padding-bottom: 60px;
	}
	#category .title {
		margin: 0 0 15px;
	}
	#category .list a {
		display: block;
		height: 169px;
		padding: 8px;
		background: url(../imgs/bg-category.png);
		font-size: 16px;
		text-align: center;
		text-decoration: none;
	}
	#category .list a:hover {
		background: url(../imgs/bg-category_ov.png);
		color: #0b2a65;
		font-weight: bold;
		-ms-filter: "alpha(opacity=100)";
		opacity: 1;
	}
	#category .list img {
		display: block;
		margin: 0 0 10px;
	}
	#category .bx-wrapper {
		position: relative;
	}
	#category .bx-prev,
	#category .bx-next {
		display: block;
		width: 47px;
		height: 47px;
		margin: -24px 0 0;
		position: absolute;
		top: 50%;
		background: 0 0 no-repeat;
		text-indent: -9999px;
	}
	#category .bx-prev {
		background-image: url(../imgs/bt-prev01.png);
		left: -85px;
	}
	#category .bx-next {
		background-image: url(../imgs/bt-next01.png);
		right: -85px;
	}
	#category .bx-prev.disabled,
	#category .bx-next.disabled {
		display: none;
	}
@media only screen and (max-width:1300px) {
	#category .bx-prev {
		left: 0;
	}
	#category .bx-next {
		right: 0;
	}
}
@media only screen and (max-width:640px) {
	#category {
		padding-top: 20px;
		padding-bottom: 15px;
	}
	#category .carousel {
		width: 85.1%;
		margin: 0 auto;
	}
	#category .carousel .list a {
		width: 48.6%;
		height: 0;
		padding: 47.3% 0 0;
		margin: 0 0 10px;
		float: left;
		position: relative;
		background-size: 100% 100%;
	}
	#category .carousel .list a:nth-child(odd) {
		margin-right: 2.8%;
	}
	#category .carousel .list img {
		width: 91.5%;
		position: absolute;
		top: 3.2%;
		left: 4.2%;
	}
	#category .carousel .list .name {
		width: 91.5%;
		position: absolute;
		left: 4.2%;
		bottom: 8.7%;
		font-size: 10px;
	}
	#category .bx-prev,
	#category .bx-next {
		width: 35px;
		height: 35px;
		margin: -18px 0 0;
		background-size: contain;
	}
	#category .bx-prev {
		background-image: url(../imgs/sp/bt-prev01.png);
		left: -8.7%;
	}
	#category .bx-next {
		background-image: url(../imgs/sp/bt-next01.png);
		right: -8.7%;
	}
}
	
	#case {
		padding-top: 40px;
		padding-bottom: 90px;
	}
	#case .title {
		margin: 0 0 15px;
	}
	#case .list li {
		background: #fff;
		background: rgba(255,255,255,.6);
		box-shadow: 0 0 5px #ccc;
	}
	#case .list a {
		display: block;
		height: 355px;
		padding: 13px 15px;
		text-decoration: none;
	}
	#case .list img {
		display: block;
		margin: 0 0 10px;
	}
	#case .list .name {
		display: block;
		margin: 0 0 10px;
		font-size: 16px;
		font-weight: bold;
		text-decoration: underline;
	}
	#case .list .text {
		display: block;
		color: #000;
	}
	#case .bx-wrapper {
		position: relative;
	}
	#case .bx-prev,
	#case .bx-next {
		display: block;
		width: 47px;
		height: 47px;
		margin: -24px 0 0;
		position: absolute;
		top: 50%;
		background: 0 0 no-repeat;
		text-indent: -9999px;
	}
	#case .bx-prev {
		background-image: url(../imgs/bt-prev02.png);
		left: -85px;
	}
	#case .bx-next {
		background-image: url(../imgs/bt-next02.png);
		right: -85px;
	}
	#case .bx-prev.disabled,
	#case .bx-next.disabled {
		display: none;
	}
@media only screen and (max-width:1300px) {
	#case .bx-prev {
		left: 0;
	}
	#case .bx-next {
		right: 0;
	}
}
@media only screen and (max-width:640px) {
	#case .carousel {
		width: 85.1%;
		margin: 0 auto;
	}
	#case .bx-viewport {
		background: rgba(255,255,255,.6);
		box-shadow: 0 0 5px #ccc;
	}
	#case .list li {
		background: transparent;
		box-shadow: none;
	}
	#case .list a {
		height: auto;
		padding: 13px 15px;
	}
	#case .list img {
		width: 100%;
	}
	#case .list .name {
		font-size: 11px;
	}
	#case .list .text {
		font-size: 10px;
	}
	#case .bx-prev,
	#case .bx-next {
		width: 35px;
		height: 35px;
		margin: -18px 0 0;
		background-size: contain;
	}
	#case .bx-prev {
		background-image: url(../imgs/sp/bt-prev02.png);
		left: -8.7%;
	}
	#case .bx-next {
		background-image: url(../imgs/sp/bt-next02.png);
		right: -8.7%;
	}
	#case .bx-pager {
		padding: 10px 0 0;
		text-align: center;
	}
	#case .bx-pager-item {
		display: inline-block;
		width: 15px;
		margin: 0 7px;
	}
	#case .bx-pager-item a {
		display: block;
		height: 15px;
		border-radius: 50%;
		background: #fff;
		text-indent: -9999px;
	}
	#case .bx-pager-item .active {
		background: #bebebe;
	}
}

	#companyMenu {
		border-top: 1px solid #aba694;
		padding: 40px 0 20px;
	}
	#companyMenu li {
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		width: 23.7%;
		margin: 0 1.7% 20px 0;
		border: 1px solid #aba694;
		float: left;
	}
	#companyMenu .n04 {
		margin-right: 0;
	}
	#companyMenu a {
		display: block;
		padding: 23px 20px;
		position: relative;
	}
	#companyMenu a:after {
		content: '';
		display: block;
		width: 11px;
		height: 20px;
		position: absolute;
		top: 29px;
		right: 20px;
		background: url(../imgs/blt-02.png) 0 0 no-repeat;
	}
@media only screen and (max-width:1000px) {
	#companyMenu li,
	#companyMenu .n04 {
		width: 32%;
		margin-right: 2%;
	}
	#companyMenu li:nth-child(3n+3) {
		margin-right: 0;
	}
}
@media only screen and (max-width:800px) {
	#companyMenu li,
	#companyMenu .n04,
	#companyMenu li:nth-child(3n+3) {
		width: 49%;
		margin-right: 2%;
	}
	#companyMenu li:nth-child(even) {
		margin-right: 0;
	}
}
@media only screen and (max-width:640px) {
	#companyMenu li,
	#companyMenu .n04,
	#companyMenu li:nth-child(3n+3) {
		width: 100%;
		margin-right: 0;
		float: none;
	}
}

	#companyMenu02 {
		border-bottom: 1px solid #aba694;
		padding: 30px 0 40px;
	}
	#companyMenu02 .title {
		margin: 0 0 20px;
	}
	#companyMenu02 li {
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		width: 23.4%;
		margin: 0 2.1% 20px 0;
		border: 1px solid #e5e5e5;
		padding: 3px;
		float: left;
		background: #fff;
	}
	#companyMenu02 .menu04,
	#companyMenu02 .menu08 {
		margin-right: 0;
	}
	#companyMenu02 a {
		display: block;
		position: relative;
	}
	#companyMenu02 li span {
		display: block;
		padding: 12px 0 12px 48px;
		position: absolute;
		right: 0;
		bottom: 0;
		left: 0;
		background: 0 0 repeat-x;
		color: #fff;
		font-size: 16px;
		line-height: 24px;
		text-decoration: underline;
	}
	#companyMenu02 li span:before {
		content: '';
		width: 48px;
		height: 48px;
		position: absolute;
		top: 0;
		left: 0;
		background: 0 0 no-repeat;
	}
@media only screen and (max-width:1000px) {
	#companyMenu02 li img {
		width: 100%;
	}
	#companyMenu02 li,
	#companyMenu02 .menu04,
	#companyMenu02 .menu08 {
		width: 32%;
		margin-right: 2%;
	}
	#companyMenu02 li:nth-child(3n+3) {
		margin-right: 0;
	}
}
@media only screen and (max-width:640px) {
	#companyMenu02 {
		padding: 15px 0 10px;
	}
	#companyMenu02 .title {
		margin: 0 0 15px;
	}
	#companyMenu02 li,
	#companyMenu02 .menu04,
	#companyMenu02 .menu08,
	#companyMenu02 li:nth-child(3n+3) {
		width: 49%;
		margin-right: 2%;
	}
	#companyMenu02 li:nth-child(even) {
		margin-right: 0;
	}
}
@media only screen and (max-width:400px) {
	#companyMenu02 li,
	#companyMenu02 .menu04,
	#companyMenu02 .menu08,
	#companyMenu02 li:nth-child(3n+3) {
		width: 100%;
		margin: 0 0 10px;
	}
}
	
	#contact {
		padding: 40px 0 60px;
		text-align: center;
	}
	#contact .title {
		margin: 0 0 10px;
	}
	#contact p {
		margin: 0 0 20px;
		font-size: 16px;
	}
	#contact .btn li {
		display: inline-block;
		margin: 0 0 0 24px;
	}
	#contact .btn li:first-child {
		margin: 0;
	}
	
@media only screen and (max-width:1220px) {
	#contact .btn li {
		width: 32%;
		margin: 0 0 0 2%;
	}
	#contact .btn li:first-child {
		margin: 0;
	}
}
@media only screen and (max-width:640px) {
	#contact {
		padding: 15px 0 30px;
	}
	#contact .title {
		font-size: 14px;
	}
	#contact .btn li {
		display: block;
		width: 100%;
		margin: 10px 0 0;
	}
	#contact .btn li:first-child {
		margin: 0;
	}
}

	#support {
		background: url(../imgs/bg-support.jpg) 50% 0 repeat-x;
	}
	#support .panel {
		width: 50%;
		height: 238px;
		padding: 77px 0 0;
		float: left;
		font-size: 14px;
		text-align: center;
	}
	#support .title {
		margin: 0 0 15px;
	}
	#support .text a {
		color: #fff;
	}
@media only screen and (max-width:640px) {
	#support {
		background-size: auto 100%;
	}
	#support .panel {
		height: 124px;
		padding: 42px 0 0;
	}
	#support .title {
		margin: 0;
	}
	#support .title img {
		width: auto;
		height: 87px;
	}
	#support .text {
		display: none;
	}
}

	#lastArea {
		margin: 0 0 340px;
		box-shadow: 0 4px 4px #ccc;
		box-shadow: 0 4px 4px rgba(0,0,0,.2);
	}
@media only screen and (max-width:640px) {
	#lastArea {
		margin: 0 0 300px;
	}
}
	/* footer */
	
	#footer {
		background: #fff;
	}
	#footer .ci {
		border-bottom: 1px dotted #9c9c9c;
		padding: 30px 0 18px;
	}
	#fNav {
		padding: 28px 0 5px;
		font-size: 14px;
	}
	#fNav ul,
	#fNav dl {
		width: 15%;
		margin-right: 2%;
		float: left;
	}
	#fNav ul.last {
		margin-right: 0;
	}
	#fNav ul ul {
		width: auto;
		margin-right: 0;
		float: none;
	}
	#fNav li,
	#fNav dt,
	#fNav dd {
		margin: 0 0 28px;
	}
	#fNav a {
		color: #666;
		text-decoration: none;
	}
	#copyright {
		border-top: 1px dotted #9c9c9c;
		padding: 30px 0 25px;
		color: #999;
		font-size: 12px;
		text-align: center;
	}
	
	#pageTop {
		display: none;
		position: fixed;
		right: 0;
		bottom: 20px;
	}

@media only screen and (max-width:900px) {
	#fNav ul,
	#fNav dl {
		width: auto;
		margin: 0;
		float: none;
		clear: both;
	}
	#fNav dt {
		margin-bottom: 0;
	}
	#fNav li,
	#fNav dd {
		width: 32%;
		margin-right: 2%;
		margin-bottom: 15px;
		float: left;
	}
	#fNav ul li:nth-of-type(3n+3),
	#fNav dl dd:nth-of-type(3n+3) {
		margin-right: 0;
	}
	#fNav ul.last>li:nth-of-type(3) {
		width: auto;
		float: none;
		clear: both;
	}
}
@media only screen and (max-width:640px) {
	#fNav {
		padding: 0;
		font-size: 12px;
	}
	#fNav ul,
	#fNav dl {
		margin-bottom: 0 !important;
	}
	#fNav li,
	#fNav dt,
	#fNav dd {
		width: auto;
		margin: 0;
		border-top: 1px solid #fff;
		border-bottom: 1px solid #ddd;
		float: none;
	}
	#fNav ul:first-child li:first-child {
		border-top: none;
	}
	#fNav ul.last>li:last-child {
		border-bottom: none;
	}
	#fNav dd {
		display: none;
	}
	#fNav a {
		display: block;
		height: 45px;
		padding: 0 15px;
		position: relative;
		color: #8c8c8c;
		line-height: 45px;
	}
	#fNav a:after {
		content: '';
		display: block;
		width: 7px;
		height: 12px;
		position: absolute;
		top: 16px;
		right: 26px;
		background: url(../imgs/sp/blt-01.png) 0 0 no-repeat;
		background-size: contain;
	}
	#fNav ul ul {
		border-top: 1px solid #fff;
		padding: 20px 0;
		text-align: center;
	}
	#fNav ul ul li {
		display: inline-block;
		border-top: none;
		border-bottom: none;
	}
	#fNav ul ul li:after {
		content: ' │ ';
	}
	#fNav ul ul li:last-child:after {
		content: normal;
	}
	#fNav ul ul a {
		display: inline;
		padding: 0;
		line-height: 12px;
	}
	#fNav ul ul a:after {
		content: normal;
	}
	#footer .ci {
		padding: 0;
		border-bottom: none;
		text-align: center;
	}
	#footer .ci img {
		width: 137px;
	}
	#copyright {
		border-top: none;
		padding: 20px 0;
		color: #999;
		font-size: 10px;
	}
	
	#pageTop img {
		width: 30px;
		height: 30px;
	}
}