@charset "utf-8";
/* レスポンシブ用 */
.only-pc-b { display: block; }
.only-pc-ib { display: inline-block; }
.only-pc-i { display: inline; }
.only-sp-b { display: none; }
.only-sp-ib { display: none; }
.only-sp-i { display: none; }
@media screen and (max-width:820px){
	.only-pc-b { display: none; }
	.only-pc-ib { display: none; }
	.only-pc-i { display: none; }
	.only-sp-b { display: block; }
	.only-sp-ib { display: inline-block; }
	.only-sp-i { display: inline; }
}

/* ヘッダ */
#pageHead, #pageHead *{
	-webkit-transition: all 0.2s;
	-webkit-transition: -webkit-all 0.2s;
	-moz-transition: all 0.2s;
	-ms-transition: all 0.2s;
	-o-transition: all 0.2s;
	transition: all 0.2s;
}
#pageHead {
	width: 100%;
	min-width: 1100px;
	height: 120px;
	position: fixed;
	top: 0;
	padding: 0px;
	z-index: 999;
	border-bottom: 2px solid #f1f1f1;
	background-color: #fff;
}
#pageHead h1 {
	margin-top: 45px;
	margin-left: 15px;
	width: 335px;
	float: left;
	transition:width 0.3s;
}
#pageHead h1 img {
	width:100%;
}

@media screen and (max-width:1300px) and (min-width:768px){
	#pageHead h1 {
		width:285px;
	}
}
@media screen and (max-width:1250px) and (min-width:821px){
	#pageHead h1 {
		margin-top:10px;
		margin-bottom:5px;
	}
	#nav {
		margin-top:5px !important;
	}
}

@media screen and (max-width:820px){
	#pageHead {
		min-width: inherit;
		height: 120px;
	}
	#pageHead h1 {
		/* float:none; */
		width:255px;
	}
}

/* ナビゲーション */
#nav {
	margin-top: 35px;
	margin-right: 15px;
	float: right;
}
#nav i.hammenu {
	width:30px;
	height:30px;
	color:#001C40;
	display:none;
	font-size:200%;
	margin-left:-60px;
}
.active {
	display:none;
}
.notactive {
	display:none;
}
#nav ul {
	display:flex;
}
#nav ul li {
	list-style: none;
	width:auto;
	min-width: 110px;
	margin-right: 5px;
	padding: 0;
	font-size: 14px;
	float: left;
	position:relative;
}
#nav ul li:last-child {
	margin-right: 0;
}
#nav ul li > a {
	display: block;
	padding: 15px 5px 15px 15px;
	text-decoration: none;
	font-size: 12px;
	line-height: 1em;
	border-bottom: 5px solid #ccc;
	background: url(../img/common/arrow_side.png) left center no-repeat #fff;
}
#nav ul li > a.onpage {
	border-bottom: 5px solid #f00;
	background: url(../img/common/arrow_down.png) left center no-repeat;
}
#nav ul li > a:hover {
	border-bottom: 5px solid #f00;
	background: url(../img/common/arrow_down.png) left center no-repeat #cdf;
}
#nav ul li .second {
	position:absolute;
	display:none;
}
#nav ul li .second > a {
	display: block;
	font-size: 85%;
	white-space: nowrap;
	padding: 8px 12px;
	background-color: #fff;
	text-decoration: none;
	border-bottom: 2px solid #aaa;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
}
#nav ul li .second > a:hover {
	background-color:#ffd;
}

@media screen and (max-width:820px){
	#nav {
		float:none;
		position:absolute;
		top:0;
		right:-230px;
		z-index:999;
		background-color: #fff;
		padding: 10px 15px;
		margin-top:35px;
	}
	#nav ul {
		display:block;
	}	
	#nav i.hammenu {
		display:block;
	}
	.active {
		display:block !important;
	}
	.notactive {
		display:none !important;
	}	
	#nav ul li {
		float:none;
		width:180px;
	}
	#nav ul li > a {
		font-size:100%;
	}

	#nav ul li .second {
		position:relative;
		display:block;
		margin-left: 15px;
		/* width: 100%; */
	}
	
}

/* フッタ */
#pageFoot {
	clear: both;
	width: 100%;
	/* height: 216px; */
	height: auto;
	/*height: 135px;*/
	background: url(../img/common/footer_building.png) bottom right no-repeat;
	min-height:216px;
}
#pageFoot .footnav {
	width: 100%;
	padding: 25px 0px;
	background-color: #efefef;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}
#pageFoot .footnav ul {
	/* max-width: 840px; */
	margin: 0px auto;
	display:flex;
	justify-content:center;
}
#pageFoot .footnav ul li {
	width: 120px;
	margin: 0;
	text-align: center;
	/* float: left; */
	list-style: none;
}
#pageFoot .footnav ul li a {
	text-decoration: none;
	font-size: 12px;
}
#pageFoot .footnav ul li a:hover {
	text-decoration: underline;
	color: #0af;
}
#pageFoot .footerbox1 {
	width: 100%;
	/* height: 145px; */
	height: auto;
	background: url(../img/common/footer_bg.png) bottom left repeat-x;
	min-height:145px;
}
#pageFoot .footerbox2 {
	width: 100%;
	/* height: 145px; */
	height: auto;
	background: url(../img/common/footer_boat.png) bottom left no-repeat;
	min-height:145px;
}
#pageFoot div.logobox {
	width: 236px;
	margin: 0 auto;
	padding-top: 25px;
}
#pageFoot div.copyright {
	margin: 63px auto 0px;
	text-align: center;
	color: #026D97;
	font-size: 11px;
}
@media screen and (max-width:820px){
	#pageFoot {
		background-size: 120px;
		background-position-y: 180px;
	}
	#pageFoot .footnav ul {
		width:100%;
		display:flex;
		flex-wrap:wrap;
	}
	#pageFoot .footnav ul li {
		float:none;
		width:33%;
		padding:5px 0px;
	}
	#pageFoot .footerbox2 {
		background-size: 130px;
	}
	#pageFoot div.logobox {
		width: 180px;
	}
	#pageFoot div.logobox img {
		width:100%;
	}

	.ifoot {
		background-position-y: 235px !important;
	}
}

/* コンテンツページ */
h2 {
	width: 950px;
	margin: 10px auto 0px;
	padding: 0px;
}
#container {
	clear: both;
	width: 100%;
	/*
	max-width: 1400px;
	min-width: 1100px;
	*/
	margin: 120px auto 90px;
	padding: 0;
	/*
	border: 1px solid #cccccc;
	background-color: #fff;
	box-shadow: 2px 2px 0px 0px rgba(190,190,190,0.4);
	-moz-box-shadow: 2px 2px 0px 0px rgba(190,190,190,0.4);
	-webkit-box-shadow: 2px 2px 0px 0px rgba(190,190,190,0.4);
	-o-box-shadow: 2px 2px 0px 0px rgba(190,190,190,0.4);
	-ms-box-shadow: 2px 2px 0px 0px rgba(190,190,190,0.4);
	overflow: hidden;
	position: relative;
	*/
}
#keyvisualindex {
	width: 100%;
	max-width: 1400px;
	min-width: 1100px;
	margin: 120px auto 0px;
	padding: 0;
}

.indexworks {
	width:100%;
	margin:30px auto;
	background-color:#DEE6ED;
	padding:35px 0px;
}

.indexworks .indexrsth2 {
	font-size:24px;
	text-align:center;
	margin-bottom:40px;
}
.indexworks .indexrsth2 i {
	font-size:150%;
	margin-right:20px;
	color:#0168B7;
}

.indexworks .indexrstbox {
	width:310px;
	margin-right:35px;
	height:210px;
	background-color:#fff;
	box-sizing:border-box;
	display:inline-block;
	position:relative;
}
.indexworks .indexrstbox:last-child { margin-right:0px; }

.indexworks .indexrstbox div.rsttitlebox {
	position:absolute;
	bottom:0;
	left:0;
	background-color:rgba(255,255,255,0.75);
	height:75px;
	width:100%;
}
.indexworks .indexrstbox div.rsttitlebox p {
	color: #333;
	font-size:18px;
	font-weight: bold;
	padding: 10px;
}
.indexworks .indexrstbox div.rsttitlebox a {
	position:absolute;
	bottom:10px;
	right:10px;
	display:block;
	border-radius: 5px;
	background-color: #0168B7;
	font-size:11px;
	color: #fff;
	text-align:center;
	width: 120px;
	padding:3px 0px 1px;
	text-decoration: none;
}
.indexworks .indexrstbox div.rsttitlebox a:hover { opacity:0.7; }

.indextocases {
	display:block;
	width: 100%;
	margin: 30px auto 0;
	text-align:center;
	font-size:16px;
	color: #fff;
	font-weight:bold;
	padding: 15px 0px;
	text-decoration:none;
	background-color: #0168B7;
}
.indextocases:hover { opacity:0.7; }

@media screen and (max-width:820px){
	#keyvisualindex {
		max-width: inherit;
		min-width: inherit;
	}
	.indexworks .box1000 {
		width:100% !important;
	}
	.indexworks h2 {
		width:100%;
	}
	.indexworks .indexrstbox,
	.indexworks .indexrstbox:last-child {
		float:none;
		margin:0px auto 15px;
		display:block;
	}
	h2 {
		width:100%;
	}
}

/* コンテンツページ共通 */
#contentsbox {
	width: 1100px;
	margin: 30px auto 0px;
}

#pankzline {
	width: 100%;
	background-color: #ECECEC;
	padding: 7px 0px 5px;
}
#pankzline  ul#pankzlist {
	width: 1100px;
	margin: 0px auto;
}
#pankzline  ul#pankzlist li {
	float: left;
	padding-right: 8px;
	list-style: none;
	font-size: 11px;
	color: #333;
	letter-spacing: 0.1em;
}
#pankzline  ul#pankzlist li a {
	color: #4F668F;
	font-size: 11px;
	text-decoration: none;
	color: #4F668F;
}
#pankzline  ul#pankzlist li a:hover {
	text-decoration: underline;
}

#keyvisualbox {
	width: 100%;
	max-width: 1400px;
	min-width: 1100px;
	height: 429px;
	margin: 0px auto;
}
.worksbg { background: url(../img/works/keyvisual.jpg) top center no-repeat; }
.companybg { background: url(../img/company/keyvisual.jpg) top center no-repeat; }
.casesbg { background: url(../img/cases/keyvisual.jpg) top center no-repeat; }
.csrbg { background: url(../img/csr/keyvisual.jpg) top center no-repeat; }
.recruitbg { background: url(../img/recruit/keyvisual.jpg) top center no-repeat; }
.contactbg { background: url(../img/contact/keyvisual.jpg) top center no-repeat; }
.supervisorbg { background: url(../img/supervisor/keyvisual.jpg) top center no-repeat; }

.keytitle {
	width: 1100px;
	margin: 0px auto;
	padding-top: 200px;
	text-align:left;
}
.keytitle h2 {
	padding: 25px 0;
	margin: 0;
}
.keytitle h2 span {
	padding: 13px 40px 9px;
	border: 2px solid #fff;
	font-size: 30px;
	color: #fff;
	font-weight: normal;
	letter-spacing: 0.1em;
}
.keytitle p {
	padding-top: 15px;
	font-size: 18px;
	color: #fff;
}

#paging {
	text-align: center;
	padding-bottom: 20px;
}
#paging a {
	padding: 3px 6px 1px;
	border: 1px solid #ccc;
	margin-right: 4px;
	text-decoration: none;
}
#paging a:hover { background-color: #ffc; }
#paging a.onPage {
	font-weight: bold;
	font-size: 18px;
	background-color: #fcc;
}
#paging a:last-child { margin-right: 0; }

.paging {
	text-align: center;
	padding-bottom: 20px;
}
.paging a {
	padding: 3px 6px 1px;
	border: 1px solid #ccc;
	margin-right: 4px;
	text-decoration: none;
	display: inline-block;
	margin-bottom: 10px;
}
.paging a:hover { background-color: #ffc; }
.paging a.onPage {
	font-weight: bold;
	font-size: 18px;
	background-color: #fcc;
}
.paging a:last-child { margin-right: 0; }
.txtnowrap { white-space:nowrap; }

@media screen and (max-width:820px){
	#keyvisualbox {
		max-width: inherit;
		min-width: inherit;
	}
	.worksbg,
	.companybg,
	.casesbg,
	.csrbg,
	.recruitbg,
	.contactbg {
		background-position-x: right -250px;
	}
	.keytitle {
		width: 100%;
		text-align:center;
	}
	.txtnowrap { white-space:inherit; }
}

/* 特殊 */
html,body {
	width:100%;
	height:100%;
}
#bg {
	width:100%;
	height:100%;
	background-color:#000;
	opacity:0.5;
	transition:all 0.3s;
	display:none;
	position:absolute;
	top:0;
	left:0;
	z-index:998;
}

.footaddress {
	font-size:90%;
	text-align:center;
	padding:20px 0px;
}

/* 点滅 */
.blinking{
	-webkit-animation:blink 1.5s ease-in-out infinite alternate;
    -moz-animation:blink 1.5s ease-in-out infinite alternate;
    animation:blink 1.5s ease-in-out infinite alternate;
}
@-webkit-keyframes blink{
    0% {opacity:0.2;}
    100% {opacity:0.5;}
}
@-moz-keyframes blink{
    0% {opacity:0.2;}
    100% {opacity:0.5;}
}
@keyframes blink{
    0% {opacity:0.2;}
    100% {opacity:0.5;}
}