@charset "utf-8";

/**
 * style
 * (c) FOURDIGIT Inc.
 *
 * 1. import
 * 2. html, body
 * 3. HTMLtag, siteCommonClass
 * 4. Layout
 * 5. EachPageStyle
 *
 */

/**
 * 1. import
 */
@import url("import/reset.css");
@import url("import/util.css");
@import url("./font/font.css");

/* @import "../ext_{bukkenID}/{bukkenID}.css"; */

/**
 * 2. html, body
 */
	body {
		background-color: #fff;
	
		background-repeat: repeat-x;
		background-position: center top;
	}

	.page {
		min-width: 1160px;
		font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
		font-size: 14px;
		line-height: 1.5;
		color: #000;
		letter-spacing: 0.1em;
	}


/**
 * 3. HTMLtag, siteCommonClass
 */

/* anchor */
	

/* cap */
	.cap,
	.caption {
		font-size: 10px;
		line-height: 15px;
		color: #666;
		background: none;
	}

	.cap {
		padding-top: 5px;
	}

/* img */
	img {
		max-width: 100%;
		height: auto;
	}

	img.sp {
		display: none;
	}

	.sp {
		display: none;
	}


/**
 * 4. Layout
 */

/* header */
	body #gHeader {
		/* overflow: hidden; */
	}

	#gHeader .wrap {
		position: relative;
	}

	#gHeader .siteTitle {
		position: absolute;
		top: 0;
		left: 0;
		z-index: 100;
		width: 200px;
		height: 200px;
	}

	#gHeader .siteTitle a {
		box-sizing: border-box;
		display: block;
		width: 200px;
		height: 200px;
		text-align: center;
		background-color: #393536;
		transition: .2s;
	}


	/* hover */
	#gHeader .siteTitle a:hover {
		opacity: .9;
	}

	#gHeader.on {
		z-index: 9999999999;
	}


/* menu */
	#menu {
		display: none;
	}

/* pNav */
	#pNav {
		padding: 50px 0 50px 40px;
		margin-left: 200px;
	}

	#pNav ul li.pNav--item {
		float: left;
		margin-left: 20px;
	}

	#pNav ul li.pNav--item:first-child {
		margin-left: 0;
	}

	#pNav ul li.pNav--item a {
		padding: 1px 0;
		padding-left: 25px;
		color: #acacac;
		background: url(../imgs/icn-hnav.png) no-repeat left center;
		transition: .2s;
	}


	/* hover */
	#pNav ul li.pNav--item a:hover {
		color: #303030;
		background: url(../imgs/icn-hnav_on.png) no-repeat left center;
	}

	.pNav_snsTitle{
		display: none;
	}

	.pNav_sns{
		display: none;
	}


/* gNav */
	#gNav {
		margin-left: 200px;
		border-top: 1px solid #e5e5e5;
	}

	#gNav ul li {
		position: relative;
		float: left;
		width: 160px;

/*		height: 65px;
		max-height: 65px; */
		font-size:12px;
	}

	#gNav ul li a {
		position: relative;
		display: block;
		padding: 18px 0 12px;
		color: #cacaca;
		text-align: center;
		vertical-align: middle;
		transition: .2s;

/*		height:65px; */
	}

	#gNav ul li:last-child a {
		padding-bottom: 18px;
		color: white !important;
		background-color: #c3b556;/* 22496e */
	}

	#gNav ul li:last-child a:hover {
/*
		background-color: #426b91;
*/
	}

	#gNav ul li:last-child a::before {
		background-color: transparent;
	}

/*
	#gNav ul li.contact a{
		padding-top: 10px;
		padding-bottom: 10px;
	}
*/
@media only screen and (min-width: 641px){
	#gNav ul li:last-child a:hover {
		opacity: .7;
	}
}
@media only screen and (max-width: 640px){
/*
	#gNav ul li.contact a{
	padding-top: 10px;
	padding-bottom: 0;
	line-height: 1.2;
	}
*/
}


#gNav ul li　.top2line {
position: absolute;
top:0;
right:0;
left:0;
margin:auto;
}

/*	#gNav ul li.on.create a,
	#gNav ul li.on.produced a {
		padding: 16px 0 21px;
	}
	#gNav ul li.on.produced div,
	#gNav ul li.on.create div {
		font-size: 12px;
		line-height: 1.2;
	} */

	#gNav ul li.top a {
		font-size: 18px;
	}

	#gNav ul li div:last-child {
		display: none;
	}

/*	#gNav ul li.create a,
	#gNav ul li.produced a {
		padding: 22px 0;
	} */
	#gNav ul li a::before {
		position: absolute;
		top: -1px;
		right: 0;
		left: 0;
		width: 100%;
		height: 5px;
		visibility: hidden;
		content: '';
		background-color: #303030;
		opacity: 0;
		transition: .2s;
	}

	#gNav ul li.new a::after {
		position: absolute;
		top: -1px;
		right: 0;
		display: block;
		width: 35px;
		height: 16px;
		content: '';
		background: url(../imgs/icon-new.gif) no-repeat left top;
	}


/*	#gNav ul li.produced .topTtl,
	#gNav ul li.create .topTtl {
		display: none;
	}
	#gNav ul li.produced .underTtl,
	#gNav ul li.create .underTtl {
		display: block;
	}
	#gNav ul li.on.produced .topTtl,
	#gNav ul li.on.create .topTtl {
		display: block;
	}
	#gNav ul li.on.produced .underTtl,
	#gNav ul li.on.create .underTtl {
		display: none;
	} */

	/* hover */
	#gNav ul li a:hover,
	#gNav ul li.on a {
		color: #303030;
	}

	#gNav ul li a:hover::before,
	#gNav ul li.on a::before {
		visibility: visible;
		opacity: 1;
	}

	#gNav ul li a:hover div:first-child {
		display: none;
	}

	#gNav ul li a:hover div:last-child {
		display: block;
	}


	/* fixed */
	#gNav.fixed {
		position: fixed;
		top: 0;
		right: 0;
		left: 0;
		z-index: 9999;
		width: 100%;
		margin-left: 0;
		background-color: #fff;
	}

	#gNav.fixed ul {
		width: 960px;
		margin-right: auto;
		margin-left: auto;
	}

	#pNav.fixed {
	    padding: 50px 0 108px 40px;
	}


	#gNav02 {
		background: #707070;
	}

	#gNav02 ul {
		padding: 0 0 0 200px;
		font-size: 11px;
		line-height: 16px;

		/* transition: padding .2s; */
	}

	#gNav02 li {
		/* transition: width .2s; */
		position: relative;
		display: inline-block;
		width: 180px;
		vertical-align: top;
	}

	#gNav02 li.sp {
		display: none;
	}

	#gNav02 .request {
		width: 200px;
	}

	#gNav02 a {
		display: block;
		padding: 11px 0 12px;
		color: #fff;
		text-align: center;
	}

	#gNav02 .request a {
		background: #1c466d;
	}

	#gNav02 .request a::before {
/*		content: url(../imgs/icn-req.png); */
		margin: 0 1em 0 0;
		vertical-align: middle;
	}

	.fixGNav2 #gHeader {
		margin: 0 0 39px;
	}

	.fixGNav2 #gNav02 {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 9999;
		width: 100%;
	}

	.fixGNav2 #gNav02 ul {
		padding: 0;
	}

	.fixGNav2 #gNav02 li {
		width: 192px;
	}

	.fixGNav2 #gNav02 ul li.Req {
		display: inline-block;
	}
	@keyframes sGnavAnim {
		0% {margin-top: -39px;}
		100% {margin-top: 0;}
	}
	@media only screen and (min-width: 639px) {
		#gNav02 ul li.Req {
			display: none;
		}

		.fixGNav2 #gNav02 {
			animation: sGnavAnim .4s;
		}
	}


	#gNav02 {
	    background: rgb(51 51 51 / 70%);
	    filter:progid:dximagetransform.microsoft.gradient(startColorstr=#B3333333,endColorstr=#B3333333);
	}

	/* #gsNav ul li {
		position: relative;
		float: left;
		height: 39px;
		max-height: 39px;
		line-height: 39px;
		text-align: center;
	}
	#gsNav ul li a {
		display: block;
		padding: 7px 22px;
		font-size: 11px;
		line-height: 25px;
		letter-spacing: 1px;
		color: #fff;
		transition: .2s;
	} */
	#gNav02 ul li.on::before,
	#gNav02 ul li:hover::before {
		position: absolute;
		bottom: 0;
		left: 0;
		display: block;
		width: 100%;
		height: 3px;
		content: '';
		background-color: #21486D;
	}

	#gNav02 ul li.off a {
		cursor: default;
		opacity: 0.4;
	}

	#gNav02 ul li.off span.coming::after {
		position: absolute;
		bottom: 2px;
		left: 0;
		display: block;
		width: 100%;
		font-size: 8px;
		line-height: 1;
		color: #fff;
		text-align: center;
		content: 'COMING SOON';
	}

	#gNav02 ul li.Req a {
/*
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#B300386c,endColorstr=#B300386c);
    background: rgba(0, 56, 108, 0.7);
		letter-spacing: -1px;
*/
		background: #c3b556;
	}

/*
	@media only screen and (min-width: 641px) {
		#gNav02 ul li.Req a:hover {
			opacity: .9;
		}
	}
*/
	@media only screen and (max-width: 640px) {
		#gNav02 ul li.Req a {
/*
			padding: 0 6px;
*/
		}

/*
		#gNav02 ul:not(.col4) li.Req a br.sp{
			display: none;
		}
*/
	}

	#gNav02 ul li.Req a:hover {
/*
		background: rgba(46,104,158,0.7);
*/
	}

	#gNav02 ul li.off:hover::before,
	#gNav02 ul li.Req:hover::before {
		display: none;
	}

	#gNav02 ul li.db a {
		padding: 7px 0;
		line-height: 12px;
	}

	#gNav02 ul li span.sp {
		display: none;
	}

	/* fixed */
	#gsNav.fixed {
		position: fixed;
		top: 0;
		right: 0;

/*
		top: 59px;
*/
		left: 0;
		z-index: 9998;
		width: 100%;
		margin-left: 0;
	}

	#gsNav.fixed ul {
		width: 1160px;
		margin-right: auto;
		margin-left: auto;
	}

	#gsNav.fixed ul li {
		width: 16.66%;
	}






/* common */
	body #container {
		text-align: left;
	}

	.wrap {
		width: 1160px;
		margin-right: auto;
		margin-left: auto;
	}




/* footer */
	body #gFooter {}


/* ftrCV */
	#ftrCV {
		margin-bottom: 100px;
	}

	#ftrCV a {
		display: block;
		transition: .2s;
	}

	#ftrCV .memberArea {
		position: relative;
		padding: 50px 90px;
		overflow:hidden;
		text-align: center;
		background-color: #F1F1F1;
	}

	#ftrCV .memberArea > p {
		position: relative;
		margin-bottom: 50px;
	}

	#ftrCV .memberArea .text01 {
		float: left;
		margin-left: 90px;
	}

	#ftrCV .memberArea .text02 {
		float: right;
	}

	#ftrCV .memberArea .text01::before {
	    position: absolute;
	    bottom: -9px;
	    left: -203px;
	    width: 173px;
	    height: 173px;
		content: '';
	    background: url(../imgs/icn-num01.png);
	}

	#ftrCV .memberArea .text02::before {
	    position: absolute;
	    bottom: -9px;
	    left: -203px;
	    width: 173px;
	    height: 173px;
		content: '';
	    background: url(../imgs/icn-num02.png);
	}

	/* hover */
	#ftrCV a:hover {
		opacity: .9;
	}


/* ftrLead */
	.ftrLead {
		position: relative;
		margin-bottom: 60px;
	}

	.ftrLead h2 {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translateX(-50%) translateY(-50%);
	}

	.ftrLead .caption {
		position: absolute;
		right: 10px;
		bottom: 10px;
		color: #999;
	}


/* fSubNav */
	#fSubNav {
		margin-top: 15px;
		margin-bottom: 15px;
	}

	#fSubNav ul {
		text-align: center;
		letter-spacing: -.40em;
	}

	#fSubNav ul li {
		display: inline-block;
		margin-left: 15px;
		letter-spacing: normal;
	}

	#fSubNav ul li::before {
		margin-right: 15px;
		color: #ccc;
		content: '|';
	}

	#fSubNav ul li:first-child::before {
		display: none;
	}

	#fSubNav ul li a {
		font-size: 12px;
		color: #666;
		letter-spacing: .1em;
	}

	#fSubNav .zoomBox {
		width: 500px;
	    height: 150px;
	    margin-right: auto;
	    margin-left: auto;
	}

	#fSubNav  .zoomBox a {
	    position: relative;
		display: block;
	    width: 100%;
	    height: 100%;
	    overflow: hidden;
	}

	#fSubNav  .imgChar {
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
	}

	#fSubNav .hoverZoom {
	    position: absolute;
	    top: 0;
	    left: 0;
	    display: block;
	    background-color: #000;
	}

	#fSubNav .zoomBox a .hoverZoom img {
	    opacity: 0.6;
	    transition: 2.0s ease-in-out;
	}

	/* hover */
	#fSubNav ul li a:hover {
		text-decoration: underline;
	}

	#fSubNav .zoomBox a:hover .hoverZoom img {
		opacity: 1;

	}

	/* hover */
	#fSubNav ul li a:hover {
		text-decoration: underline;
	}


/* fNav */
	#fNav {
		position: relative;
		padding: 20px 0;
		margin-bottom: 20px;
		font-size: 12px;
		color: #666;
		border-top: 1px solid #ebebeb;
		border-bottom: 1px solid #ebebeb;
	}

	#fNav .wrap > ul {
		text-align: center;
		letter-spacing: -.40em;
	}

	#fNav .wrap > ul > li {
		display: inline-block;
		width: 145px;
		padding: 15px 20px;
		text-align: left;
		letter-spacing: normal;
		vertical-align: top;
		border-left: 1px solid #ebebeb;
	}

	#fNav .wrap > ul > li:first-child {
		border-left: none;
	}

	#fNav li a {
		color: #666;
		letter-spacing: 0.7px;
	}

	#fNav li h2 {
		margin-bottom: 22px;
		
		margin-bottom: 10px;
		font-size: 14px;
	}

	#fNav li h2 a {
		line-height: 1.28;
		color: #adadad;
	}

	#fNav .sub li {
		margin-top: 10px;
	}

	#fNav .sub li:first-child {
		margin-top: 0;
	}

	#fNav .sub li a {
		padding-right: 15px;
		background: url(../imgs/icn-fnav.png) no-repeat right center;
	}

	#fNav .pagetop {
		position: absolute;
		top: -40px;
		right: 0;
		cursor: pointer;
		background-color: #000;
	}

	#fNav .pagetop img {
		transition: .2s;
	}

	#fNav .sp {
		display: none;
	}


	/* hover */
	#fNav li h2 a:hover {
		color: #333;
	}

	#fNav .sub li a:hover {
		padding-right: 18px;
	}

	#fNav .pagetop:hover img {
		opacity: .9;
	}


/* ftrLogo */
	#ftrLogo {
		margin-bottom: 10px;
	}

	#ftrLogo ul li {
		float: left;
	}

	#ftrLogo ul li a {
		display: block;
		transition: .2s;
	}


	#ftrLogo ul li a:hover {
		opacity: .7;
	}


/* copyright */
	.copyright {
		padding: 10px 0;
		font-size: 10px;
		color: #1f73b9;
		letter-spacing: .01em;
		font-smoothing: antialiased;
	}


/* pankuzuArea */
	.pankuzuArea {
		    box-sizing: border-box;
		        box-sizing: border-box;
		width: 850px;
		padding-left: 90px;
		margin: -5px auto 10px;
		clear: both;
		font-size: 12px;
		font-smoothing: antialiased;
	}

	.pankuzuArea a {
		color: #333;
		cursor: pointer;
	}

	.pankuzuArea span.present {
		font-weight: bold;
		color: #333;
	}
	@media only screen and (max-width:1300px) {
		.pankuzuArea {
			display: none;
		}
	}

/* header__info */
.header__infoNav {
	position: absolute;
	top: 15px;
	right: 0;
	width: auto;
	max-width: 199px;
}

.header__infoNav--tel {
	text-align: center;
}

.header__infoNav--ttl {
	padding: 5px;
	margin-top: 10px;
	text-align: center;
	border: solid 1px #e5e5e5;
}

.hsns__list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-top: 10px;
}

.hsns__item {
	position: relative;
	width: 36px;
}

.hsns__item + .hsns__item {
	margin-left: 10px;
}

.hsns__link {
}

.hsns__link img {
	display: block;
}
@media only screen and (max-width: 640px) {
	.header__infoNav {
		display: none;
	}
}

.hsns__sublist{
	position: absolute;
	top: 36px;
	right: 0;
	z-index: 999;
	display: block;
	width: 90px;
	padding-top: 10px;
	color: #fff;
	transition: transform .2s;
	transform: scaleY(0);
	transform-origin: 0 10px;
}

.hsns__item:hover .hsns__sublist{
	transform: scaleY(1);
}

.hsns__subitem{
}

.hsns__item:hover .hsns__subitem{
}

.hsns__sublink,
.hsns__sublink:hover{
	display: block;
	padding: 12px 0;
	color: #fff;
	text-align: center;
	background-color: #333;
	transition: background-color .2s;
}

.hsns__sublink:hover{
	background-color: #666;
}