@charset "UTF-8";
@import url(normalize.css);
@import url(reset.css);
@import url(hack.css);

body {
	color:#FFFFFF;
}

.cl {
	clear:both;
}

body img {
	vertical-align:middle;
}

.bg-a {
	background:url(../Images/All/in-bg.png);
	background-size:cover;
	width:100%;
	height:680px;
	position:absolute;
	top:0;
	z-index:2;
}

.bg-b {
	background:url(../Images/All/bg.png);
	background-size:cover;
	width:100%;
	height:100%;
	position:fixed;
	top:0;
	z-index:1;
}

.bg-c {
	background:url(../Images/All/bg.png);
	background-size:cover;
	width:100%;
	height:100%;
	position:fixed;
	top:0;
}

.bg-d {
	background:url(../Images/All/in-bg02.png);
	background-size:cover;
	width:100%;
	height:680px;
	position:absolute;
	top:0;
	z-index:2;
}

.bg-e {
	background:url(../Images/All/in-bg03.png);
	background-size:cover;
	width:100%;
	height:680px;
	position:absolute;
	top:0;
	z-index:2;
}

.bg-f {
	background:url(../Images/All/in-bg04.png);
	background-size:cover;
	width:100%;
	height:680px;
	position:absolute;
	top:0;
	z-index:2;
}

.bg-g {
	background:url(../Images/All/in-bg05.png);
	background-size:cover;
	width:100%;
	height:680px;
	position:absolute;
	top:0;
	z-index:2;
}

.bg-h {
	background:url(../Images/All/in-bg06.png);
	background-size:cover;
	width:100%;
	height:680px;
	position:absolute;
	top:0;
	z-index:2;
}

.txt-c {
	text-align:center;
}

.font-size01 {
	font-size:140%;
}

/*----- header -----*/

.header {
	width:100%;
	height:auto;
	float:left;
}


.header-box {
	width:1000px;
	height:auto;
	min-height:370px;
	margin:0 auto;
	position:relative;
}

.manu {
	width:600px;
	height:auto;
	position:absolute;
	top:0;
	left:50%;
	-webkit-transform: translate(-50%,0);
	-moz-transform: translate(-50%,0);
	-ms-transform: translate(-50%,0);
	-o-transform: translate(-50%,0);
	transform: translate(-50%,0);
}

.manu li.manu01 {
	width:130px;
	height:auto;
	float:left;
}

.manu li.manu02 {
	width:170px;
	height:auto;
	float:left;
}

.manu li.manu03 {
	width:80px;
	height:auto;
	float:left;
}

.manu li.manu04 {
	width:100px;
	height:auto;
	float:left;
}

.manu a {color:#FFF;}

.manu a:hover {color:#CCC; border-bottom:3px solid #FFF;}

.manu li {
	font-weight:bold;
	margin:0 10px;
	background:url(../Images/All/manu-bg.jpg) top center no-repeat;
}
.manu li a{
	margin:0;
	padding-top:50px;
	background:url(../Images/All/manu-bg.jpg) top center no-repeat;
	display:block;
}

.manu li span {
	background:url(../Images/All/manu-bg.jpg) top center no-repeat;
	border-bottom:3px solid #FFF;
	display:block;
}


.site {
	width:150px;
	height:auto;
	position:absolute;
	right:20px;
	top:20px;
	border:1px solid #FFF;
	padding:5px 0;
	color:#FFF;
	box-sizing:border-box;
}

a .site {
	opacity:0.3;
}

a:hover .site {
	opacity:1;
}

.logo {
	width:100%;
	height:auto;
	float:left;
	text-align:center;
	margin-top:120px;
}

.in-header {
	width:100%;
	height:auto;
	float:left;
	background:#000;
	position:relative;
	z-index:10;
}

.in-header-box {
	width:1000px;
	height:auto;
	min-height:90px;
	margin:0 auto;
	position:relative;
}

.in-logo {
	width:auto;
	height:auto;
	position:absolute;
	top:30px;
	left:10px;
}

.in-manu {
	width:600px;
	height:auto;
	position:absolute;
	top:0;
	left:50%;
	-webkit-transform: translate(-50%,0);
	-moz-transform: translate(-50%,0);
	-ms-transform: translate(-50%,0);
	-o-transform: translate(-50%,0);
	transform: translate(-50%,0);
}

.in-manu a {color:#FFF;}

.in-manu a:hover {color:#CCC; border-bottom:3px solid #FFF;}

.in-manu li {
	margin:0 10px;
	font-weight:bold;
}

.in-manu li a {
	margin:-20px 0 0 0;
	padding-top:50px;
	background:url(../Images/All/manu-bg.jpg) top center no-repeat;
}

.in-manu li span {
	margin:-20px 0 0 0;
	padding-top:50px;
	background:url(../Images/All/manu-bg.jpg) top center no-repeat;
	border-bottom:3px solid #FFF;
	display:block;
}

.in-manu li.manu01 {
	width:130px;
	height:auto;
	float:left;
}

.in-manu li.manu02 {
	width:170px;
	height:auto;
	float:left;
}

.in-manu li.manu03 {
	width:80px;
	height:auto;
	float:left;
}

.in-manu li.manu04 {
	width:100px;
	height:auto;
	float:left;
}



/*----- header end -----*/


/*----- section -----*/

.section01 {
	width:100%;
	height:400px;
	float:left;
	position:relative;
	z-index:10;
}

.section02 {
	width:100%;
	height:auto;
	float:left;
	position:relative;
	z-index:9;
	background:#FFFFFF;
}


.section03 {
	width:100%;
	height:auto;
	float:left;
	position:relative;
	z-index:10;
}

.section04 {
	width:100%;
	height:auto;
	float:left;
	position:relative;
	z-index:10;
	background:#ddeef4;
}

.section05 {
	width:100%;
	height:auto;
	float:left;
	position:relative;
	z-index:9;
}

.section06 {
	width:100%;
	height:auto;
	float:left;
	position:relative;
	z-index:9;
}

/*--
.section06 {
	width:100%;
	height:auto;
	float:left;
	position:relative;
	z-index:9;
	background:url(../Images/InPage/line01.png) top left repeat-x;
}
-->


/*----- section end -----*/

/*----- main -----*/

.main-area {
	width:1000px;
	height:auto;
	min-height:380px;
	margin:0 auto;
	position:relative;
}

.main-title {
	width:auto;
	height:auto;
	position:absolute;
	bottom:100px;
	left:0;
}

.main-linkicon {
	width:auto;
	height:auto;
	position:absolute;
	bottom:-20px;
	left:50%;
	-webkit-transform: translate(-50%,0);
	-moz-transform: translate(-50%,0);
	-ms-transform: translate(-50%,0);
	-o-transform: translate(-50%,0);
	transform: translate(-50%,0);
}

.main-box {
	width:1000px;
	height:auto;
	min-height:20px;
	margin:0 auto;
	position:relative;
	padding:80px 0;
	color:#000000;
	text-align:left;
}

.main-box02 {
	width:100%;
	min-width:1000px;
	height:auto;
	min-height:20px;
	margin:0 auto;
	position:relative;
	text-align:left;
}

.main-left {
	width:35%;
	height:auto;
	float:left;
}

.main-right {
	width:65%;
	height:auto;
	float:right;
}

.main-left img, .main-right img {
	width:100%;
}

.work-logo {
	width:auto;
	height:auto;
	position:absolute;
	bottom:30px;
	left:30px;
}

.main-box03 {
	width:100%;
	min-width:1000px;
	height:auto;
	min-height:20px;
	margin:0 auto;
	position:relative;
	text-align:left;
}

.work-box {
	width:33.3333%;
	height:auto;
	float:left;
	position:relative;
}

.work-box img {
	width:100%;
	position:relative;
}

a .work-box .black {
	width:100%;
	height:100%;
	background:#000000;
	opacity:0.5;
	position:absolute;
	top:0;
	left:0;
}

a:hover .work-box .black {
	opacity:0.2;
}

a .work-box .txt {
	width:auto;
	height:auto;
	opacity:1;
	color:#FFFFFF;
	position:absolute;
	top:50%;
	left:50%;
	-webkit-transform: translate(-50%,50%);
	-moz-transform: translate(-50%,50%);
	-ms-transform: translate(-50%,50%);
	-o-transform: translate(-50%,50%);
	transform: translate(-50%,50%);
}

a:hover .work-box .txt {
	opacity:0.7;
}

a .work-box .txt_line2 {
	width:auto;
	height:auto;
	opacity:1;
	color:#FFFFFF;
	position:absolute;
	top:50%;
	left:50%;
	-webkit-transform: translate(-50%,50%);
	-moz-transform: translate(-50%,50%);
	-ms-transform: translate(-50%,50%);
	-o-transform: translate(-50%,50%);
	transform: translate(-50%,50%);
	margin-top:-30px;
}

a:hover .work-box .txt_line2 {
	opacity:0.7;
}

a .work-box .txt_line3 {
	width:auto;
	height:auto;
	opacity:1;
	color:#FFFFFF;
	position:absolute;
	top:50%;
	left:50%;
	-webkit-transform: translate(-50%,50%);
	-moz-transform: translate(-50%,50%);
	-ms-transform: translate(-50%,50%);
	-o-transform: translate(-50%,50%);
	transform: translate(-50%,50%);
	margin-top:-60px;
}

a:hover .work-box .txt_line3 {
	opacity:0.7;
}

.nonelink {
	display:none;
}

.list-mv{
	opacity: 0;
	transform: translate(0,60px); 
	-webkit-transform: translate(0,60px); 
}
.mv{
	opacity: 1.0;
	transform: translate(0,0); 
	-webkit-transform: translate(0,0);
}

.main-box04 {
	width:1000px;
	height:auto;
	min-height:20px;
	margin:100px auto 0 auto;
	position:relative;
	box-sizing:border-box;
	text-align:left;
}

.main-box05 {
	width:1000px;
	height:auto;
	min-height:20px;
	margin:50px auto 0 auto;
	position:relative;
	box-sizing:border-box;
	text-align:left;
}

.phi-box {
	width:100%;
	height:auto;
	float:left;
	background:#FFF;
	color:#000;
	margin-bottom:100px;
}

.phi-box-ex {
	width:100%;
	height:auto;
	float:left;
	background:#FFF;
	color:#000;
	margin-bottom:50px;
}

.phi-left {
	width:50%;
	height:auto;
	float:left;
	padding:80px 40px 80px 80px;
	box-sizing:border-box;
}

.phi-right {
	width:50%;
	height:auto;
	float:right;
	padding:80px 80px 80px 40px;
	box-sizing:border-box;
	position:relative;
}

.phi-left-free {
	width:50%;
	height:auto;
	float:left;
	padding:0;
	box-sizing:border-box;
}

.phi-left-free img {
	width:100%;
}

.phi-right-free {
	width:50%;
	height:auto;
	float:right;
	padding:0;
	box-sizing:border-box;
}

.phi-right-free img {
	width:100%;
}


.phi-all {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}

.phi-img01 {
	width:50%;
	height:auto;
	float:left;
}

.phi-img01 img {
	width: 100%;
}

.phi-img02 {
	width:50%;
	height:auto;
	float:right;
}

.phi-img02 img {
	width: 100%;
}

.ate-left {
	width:60%;
	height:auto;
	float:left;
	padding:50px 40px 50px 50px;
	box-sizing:border-box;
}

.ate-right {
	width:40%;
	height:auto;
	float:right;
	padding:0;
	box-sizing:border-box;
}

.ate-txt {
	width:100%;
	height:auto;
	float:left;
	color:#999999;
}

.ate-txt02 {
	width:100%;
	height:auto;
	float:left;
	margin-bottom:20px;
}

.ate-txt03 {
	width:100%;
	height:auto;
	float:left;
	margin-bottom:10px;
}


.slider {
	margin-bottom:100px;
}

.slider-list {
	width:100%;
	height:auto;
	float:left;
	background:
		url(../Images/InPage/icon04.png) bottom left no-repeat,
		url(../Images/InPage/line02.png) top left repeat-x;
	box-sizing:border-box;
	padding:0 30px 30px 0;
	margin-bottom:20px;
}

.slider-list-ex {
	width:100%;
	height:auto;
	float:left;
	background:url(../Images/InPage/icon04.png) bottom left no-repeat;
	box-sizing:border-box;
	padding:0 30px 30px 0;
	margin-bottom:20px;
}

.slider-list02 {
	width:100%;
	height:auto;
	float:left;
	box-sizing:border-box;
	padding-right:30px;
	font-size:80%;
}

.ate-box {
	width:auto;
	height:auto;
	position:absolute;
	top:50%;
	left:50%;
	-webkit-transform: translate(-50%,50%);
	-moz-transform: translate(-50%,50%);
	-ms-transform: translate(-50%,50%);
	-o-transform: translate(-50%,50%);
	transform: translate(-50%,50%);
}

.site-box {
	width:100%;
	height:auto;
	float:left;
	padding:80px;
	box-sizing:border-box;
}

.con-title {
	width:100%;
	height:auto;
	float:left;
	border-bottom:#000000 1px solid;
	font-size:140%;
	margin-bottom:20px;
}

.con-box {
	width:32%;
	height:auto;
	float:left;
	margin-right:2%;
}

.con-box02 {
	width:28%;
	height:auto;
	float:left;
}

.con-box03 {
	width:37%;
	height:auto;
	float:left;
}

.con-font01 {
	font-size:130%;
	font-weight:bold;
	color:#FF0000;
}

.left-box {
	width:50%;
	height:auto;
	float:left;
	padding:50px 25px 50px 50px;
	box-sizing:border-box;
}

.right-box {
	width:50%;
	height:auto;
	float:right;
	padding:50px 50px 50px 25px;
	box-sizing:border-box;
}

.staff-title {
	font-size:140%;
	font-weight:bold;
	width:100%;
	height:auto;
	float:left;
	padding-bottom:5px;
	margin-bottom:20px;
	border-bottom:1px dotted #999999;
}

.staff-title ruby rt {
	font-weight:normal;
	font-size:8px;
}

.staff-box-left {
	width:33%;
	height:auto;
	float:left;
	box-sizing:border-box;
	padding:50px 25px 50px 50px;
}

.staff-box-cen {
	width:33%;
	height:auto;
	float:left;
	box-sizing:border-box;
	padding:50px 25px;
}

.staff-box-right {
	width:33%;
	height:auto;
	float:right;
	box-sizing:border-box;
	padding:50px 50px 50px 25px;
}

.staff-title02 {
	font-size:120%;
	font-weight:bold;
	width:100%;
	height:auto;
	float:left;
	padding-bottom:5px;
	margin-bottom:20px;
	border-bottom:1px dotted #999999;
}

.staff-title03 {
	font-weight:bold;
	width:100%;
	height:auto;
	float:left;
	padding-bottom:5px;
	margin-bottom:10px;
	border-bottom:1px solid #eeeeee;
}

.position01 {
	position:relative;
}

.po-lift {
	width:auto;
	height:auto;
	position:absolute;
	bottom:-130px;
	right:20px;
}



/*----- main end -----*/

/*----- footer -----*/

.footer {
	width:100%;
	height:auto;
	min-height:100px;
	float:left;
	background:#222222;
	position:relative;
	z-index:11;
}

.footer-link {
	width:auto;
	height:auto;
	position:absolute;
	top:-20px;
	left:50%;
	-webkit-transform: translate(-50%,0);
	-moz-transform: translate(-50%,0);
	-ms-transform: translate(-50%,0);
	-o-transform: translate(-50%,0);
	transform: translate(-50%,0);
}

.footer-txt {
	width:1000px;
	height:auto;
	min-height:30px;
	margin:70px auto 20px auto;
	font-size:80%;
	opacity:0.3;
}

.footer02 {
	width:100%;
	height:auto;
	min-height:30px;
	float:left;
	position:relative;
	z-index:11;
	background:#222222;
}

.footer-txt02 {
	width:1000px;
	height:auto;
	min-height:30px;
	margin:30px auto 20px auto;
	font-size:80%;
	opacity:0.3;
}






/*----- footer end -----*/