@charset "UTF-8";


/*----------------------------------------
	menu
----------------------------------------*/
.menu {
	overflow:hidden;
	width:980px;
	margin:0 auto;
	position:relative;
	z-index:10;
}

.menu .logo {
	float:left;
	width:217px;
	padding-top:40px;
}

.menu .nav {
	float:right;
	width:300px;
}
.menu .nav ul {
	overflow:hidden;
}
.menu .nav ul li {
	float:right;
}
.menu .nav ul li a {
	display:block;
	width:60px;
	height:230px;
	margin-left:15px;
	padding-top:30px;
	text-align:center;
}
.menu .nav ul li a:link,
.menu .nav ul li a:visited {
	background:#fff;
}
.menu .nav ul li a:hover,
.menu .nav ul li a:active {
	background:#ff4500;
}

/*----------------------------------------
	slide
----------------------------------------*/
.slider {
	width:100%;
	height:520px;
	margin:-260px 0 40px;
	position:relative;
}
.slider ul {
	overflow:hidden;
	width:100%;
	height:520px;
	position:absolute;
	top:0;
}
.slider ul li {
	position:relative;
	width:100%;
	height:520px;
	font-size:0;
}
.slider ul .slide01 {
	background:url(../img/top/slide_01.jpg) no-repeat center;
	background-size:cover;
	-webkit-background-size:cover;
	-moz-background-size:cover;
}
.slider ul .slide02 {
	background:url(../img/top/slide_02.jpg) no-repeat center;
	background-size:cover;
	-webkit-background-size:cover;
	-moz-background-size:cover;
}
.slider ul .slide03 {
	background:url(../img/top/slide_03.jpg) no-repeat center;
	background-size:cover;
	-webkit-background-size:cover;
	-moz-background-size:cover;
}

/*----------------------------------------
	contents
----------------------------------------*/
.top_bnr {
	text-align:center;
	margin-bottom:50px;
}


/* recommend
-----------------------------------------*/

#recommend h2 {
	margin-bottom:25px;
	text-align:center;
}
#recommend .slide_area {
	position:relative;
	margin-bottom:85px;
}
#recommend .slide_area .flex-viewport {
	width:900px;
	margin:0 auto;
}
#recommend .slide_area .slides {
}
#recommend .slide_area .slides li {
	text-align:center;
}
#recommend .slide_area .slides li p {
	text-align:left;
	margin:10px 10px 0;
	font-weight:bold;
}
#recommend .slide_area .slides li p.date {
	margin-top:5px;
	font-size:94%;
	font-weight:normal;
}
#recommend .flex-direction-nav {
	overflow:hidden;
	position:absolute;
	top:50%;
	width:980px;
	margin:-13px auto 0;
	z-index:20;
}
#recommend .flex-direction-nav .flex-nav-prev {
	float:left;
	width:26px;
}
#recommend .flex-direction-nav .flex-nav-next {
	float:right;
	width:26px;
}
#recommend .flex-direction-nav li a {
	display:block;
	width:26px;
	height:26px;
	font-size:0;
}
#recommend .flex-prev {
	background:url(../img/top/ico_prev.png) no-repeat center;
}
#recommend .flex-next {
	background:url(../img/top/ico_next.png) no-repeat center;
}


/* standard
-----------------------------------------*/

.standard {
	position:relative;
	margin-bottom:90px;
}

.standard h2 {
	position:absolute;
	top:0;
	right:20px;
	z-index:20;
}

.standard ul {
	position:relative;
	width:965px;
	height:1085px;
	margin:0 auto;
}

.standard ul li {
	position:absolute;
	text-align:center;
}
.standard ul li .img {
	margin-bottom:15px;
}
.standard ul li h3 {
	margin-bottom:10px;
}
.standard ul .menu01{
	top:60px;
	left:50%;
	margin-left:-150px;
}
.standard ul .menu02{
	top:300px;
	left:0;
}
.standard ul .menu03{
	top:300px;
	right:0;
}
.standard ul .menu04 {
	left:150px;
	bottom:0;
}
.standard ul .menu05 {
	right:150px;
	bottom:0;
}

/* Wobble Horizontal */
@-webkit-keyframes hvr-wobble-horizontal {
 16.65% {
 -webkit-transform: translateX(8px);
 transform: translateX(8px);
}
 33.3% {
 -webkit-transform: translateX(-6px);
 transform: translateX(-6px);
}
 49.95% {
 -webkit-transform: translateX(4px);
 transform: translateX(4px);
}
 66.6% {
 -webkit-transform: translateX(-2px);
 transform: translateX(-2px);
}
 83.25% {
 -webkit-transform: translateX(1px);
 transform: translateX(1px);
}
 100% {
 -webkit-transform: translateX(0);
 transform: translateX(0);
}
}
 @keyframes hvr-wobble-horizontal {
 16.65% {
 -webkit-transform: translateX(8px);
 transform: translateX(8px);
}
 33.3% {
 -webkit-transform: translateX(-6px);
 transform: translateX(-6px);
}
 49.95% {
 -webkit-transform: translateX(4px);
 transform: translateX(4px);
}
 66.6% {
 -webkit-transform: translateX(-2px);
 transform: translateX(-2px);
}
 83.25% {
 -webkit-transform: translateX(1px);
 transform: translateX(1px);
}
 100% {
 -webkit-transform: translateX(0);
 transform: translateX(0);
}
}
.standard ul li .img {
	display: inline-block;
	vertical-align: middle;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	box-shadow: 0 0 1px rgba(0, 0, 0, 0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-moz-osx-font-smoothing: grayscale;
}
.standard ul li .img:hover, .standard ul li .img:focus, .standard ul li .img:active {
	-webkit-animation-name: hvr-wobble-horizontal;
	animation-name: hvr-wobble-horizontal;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-timing-function: ease-in-out;
	animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: 1;
	animation-iteration-count: 1;
}


/* concept
-----------------------------------------*/

.concept {
	position:relative;
}

.concept h2 {
	position:absolute;
	top:0;
	left:40px;
}
.concept .txt{
	font-size:0;
}
.concept .box_01 {
	overflow:hidden;
	margin-bottom:60px;
	padding-top:60px;
}
.concept .box_01 .txt {
	float:left;
	width:520px;
	height:342px;
	background:url(../img/top/txt_concept_01.png) no-repeat right top;
}
.concept .box_01 .ph {
	float:right;
	width:429px;
	margin-top:53px;
}

.concept .box_02 {
	overflow:hidden;
	width:900px;
	margin:0 auto 100px;
}
.concept .box_02 .txt {
	float:right;
	width:390px;
	height:306px;
	background:url(../img/top/txt_concept_02.png) no-repeat right top;
}
.concept .box_02 .ph {
	float:left;
	width:429px;
}


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

.bnr_area {
	width: 980px;
	margin: 0 auto 170px;
}
.bnr_area ul li {
	width:230px;
	float:left;
	margin-right:20px;
}
.bnr_area ul li:last-child {
	margin-right:0;
}