@charset "utf-8";

/*-------------------------
header
---------------------------*/
header {
	position: relative;
	z-index: 1;
}
header a,
header img {
	display: block;
	width: 100%;
}
#header01 {
	background: url(../img/bg_header_tnx.jpg) no-repeat center top;
	background-size: cover;
}
header .inner {
	position: relative;	
}
#header01 p {
	width: 29.3%;
	position: absolute;
	top: 57%;
	left: 27.4%;
}
@media screen and (max-width: 980px) {
	#header01 p {
		width: 40%;
		top: 54%;
		left: 10%;
	}
}
#header02 {
	padding: 1em 0;
}
#header02 p:first-child {
	max-width: 730px;
	margin-left: 10.2%;
}
#header02 p:last-child {
	max-width: 17%;
	position: absolute;
	right: 0;
	bottom: 0;
}
@media screen and (max-width: 980px) {
	#header02 p:first-child {
		margin-left: 0;
	}
}
@media screen and (max-width: 860px) {
	#header02 p:last-child {
		right: auto;
		bottom: 105%;
		left: 78%;
	}
}

/*-------------------------
global navi
---------------------------*/
#spNavi {
	display: none;
}
@media screen and (max-width: 980px) {
	#naviBar {
		display: none;
	}
	#spNavi {
		display: block;
	}
}
#naviBar {
	background-color: rgba(0,0,0,0.75);
	width: 100%;
	text-align: center;
	padding: 10px 0;
	position: fixed;
	top: -400px;
	left: 0;
}
#naviBar * {
	display: inline-block;
}
#naviBar li+li {
	margin-left: 10px;
}
#naviBar img {
	width: auto;
	height: 26px;
}
#spNavi {
	position: fixed;
	top: 0;
	right: 0;
}
#spNavi dt {
	width: 60px;
	margin: 20px 20px 10px auto;
	cursor: pointer;
	opacity: 0.8;
}
#spNavi dd {
	display: none;
	background-color: rgba(0,0,0,0.75);
	padding: 10px 10px 0;
	position: fixed;
	top: 0;
	right: 0;
}
#spNavi ul {
	width: 100%;
	max-width: 320px;
	text-align: left;
	position: relative;
}
#spNavi li,
#spNavi a,
#spNavi li img {
	display: inline-block;
}
#spNavi li {
	margin: 0 10px 10px 0;
}
#spNavi li img {
	width: auto;
	height: 26px;
}
#spNavi li:last-child {
	position: absolute;
	right: 10px;
	bottom: 0;
	cursor: pointer;
}
#spNavi li:last-child img {
	width: 20px;
	height: 20px;
}

/*-------------------------
container
---------------------------*/
#container article {
	overflow: hidden;
}
#container article+article {
	padding-top: 51px !important;
}
@media screen and (max-width: 980px) {
	#container article+article {
		padding-top: 0 !important;
		margin-top: 60px !important;
	}
}
#container .titleBg {
	padding: 1em 10px;
	margin-bottom: 60px;
}
#container .titleBg img {
	display: block;
	width: 100%;
	max-width: 510px;
	margin: 0 auto;
}

/*-------------------------
footer
---------------------------*/
footer {
	text-align: center;
}
footer p:last-child span {
	font-size: 180%;
	vertical-align: middle;
}