@charset "utf-8";
@import url("common.css");
/*======================================================================
||
||   index.css
||
======================================================================*/

.panels {
	list-style:none;
}
.panels li {
	width:calc(99.99% / 3);
	float:left;
}

.panels li a {
	display:block;
	width:100%;
	height:1px;
	padding-top:131.6397%;
	text-indent:-9999em;
}
#panel1 li:nth-of-type(1) a {
	background:url(../img/index/btn_member01.jpg) no-repeat;
	background-size:cover;
}
#panel1 li:nth-of-type(2) a {
	background:url(../img/index/btn_member08.jpg) no-repeat;
	background-size:cover;
}
#panel1 li:nth-of-type(3) a {
	background:url(../img/index/btn_member09.jpg) no-repeat;
	background-size:cover;
}
#panel2 li:nth-of-type(1) a {
	background:url(../img/index/btn_member04.jpg) no-repeat;
	background-size:cover;
}
#panel2 li:nth-of-type(2) a {
	background:url(../img/index/btn_member07.jpg) no-repeat;
	background-size:cover;
}
#panel2 li:nth-of-type(3) a {
	background:url(../img/index/btn_member06.jpg) no-repeat;
	background-size:cover;
}
.panels li a:hover {
	background-position:100% 0 !important;
}

.sub_panels {
	list-style:none;
}
.sub_panels li {
	float:left;
}
.sub_panels li a {
	display:block;
	width:100%;
	height:1px;
	position:relative;
}
.sub_panels li a img {
	display:none;
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	margin:auto;
	height:35px;
}
.sub_panels li a:hover img {
	display:block;
}
.sub_panels li ul {
	list-style:none;
}

#sub_panel1 li {
	width:50%;
}
#sub_panel1 li ul li {
	width:100%;
}
#sub_panel1 li ul li {
	float:none;
}
#sub_panel2 li {
	width:50%;
}
#sub_panel1 li:nth-of-type(1) a {
	padding-top:92.3076%;
	background:url(../img/index/btn_vision.jpg) no-repeat;
	background-size:cover;
}
#sub_panel1 li:nth-of-type(1) a:hover {
	background-position:100% 0 !important;
}
#sub_panel1 li:nth-of-type(2) li:nth-of-type(1) a {
	padding-top:46.1538%;
	background:url(../img/index/btn_action.jpg) no-repeat;
	background-size:cover;
}
#sub_panel1 li:nth-of-type(2) li:nth-of-type(2) a {
	padding-top:46.1538%;
	background:url(../img/index/btn_talk.jpg) no-repeat;
	background-size:cover;
}
#sub_panel1 li:nth-of-type(2) li a:hover {
	background-position:0 100% !important;
}
#sub_panel1 li:nth-of-type(2) li:nth-of-type(2) a img {
	height:92px;
}

#sub_panel2 li:nth-of-type(1) a {
	padding-top:46.1538%;
	background:url(../img/index/btn_career.jpg) no-repeat;
	background-size:cover;
}
#sub_panel2 li:nth-of-type(1) a:hover {
	background-position:0 100% !important;
}
#sub_panel2 li:nth-of-type(2) ul li a img {
	display:block;
	height:35px;
}
#sub_panel2 li:nth-of-type(2) ul li:nth-of-type(1) a {
	padding-top:92.3076%;
	background:url(../img/index/btn_jump.jpg) no-repeat;
	background-size:cover;
}
#sub_panel2 li:nth-of-type(2) ul li:nth-of-type(1) a img {
	display:none;
}
#sub_panel2 li:nth-of-type(2) ul li:nth-of-type(1) a:hover {
	background-position:0 100% !important;
}
#sub_panel2 li:nth-of-type(2) ul li:nth-of-type(1) a:hover img {
	display:block;
}
#sub_panel2 li:nth-of-type(2) ul li:nth-of-type(2) a {
	padding-top:92.3076%;
	background:#B9C3C9 url(../img/index/entry.png) no-repeat center center;
	background-size:auto 35px;
	text-indent:-9999em;
}
#sub_panel2 li:nth-of-type(2) ul li:nth-of-type(2) a:hover {
	background:#394855 url(../img/index/entry.png) no-repeat center center;
	background-size:auto 35px;
}


@media screen and (max-width: 768px) {

.panels li {
	width:100%;
	float:none;
	margin-bottom:1px;
}

.panels li a {
	display:block;
	width:100%;
	height:1px;
	padding-top:65.81%;
	text-indent:-9999em;
}

.sub_panels li {
	float:none;
	margin-bottom:1px;
}

#sub_panel1 li,
#sub_panel2 li {
	width:100%;
}
#sub_panel2 li ul li {
	width:50%;
	float:left;
}

#sub_panel1 li:nth-of-type(1) a {
	padding-top:80%;
	background:url(../img/index/btn_vision.png) no-repeat;
	background-size:cover;
}
#sub_panel1 li:nth-of-type(2) li:nth-of-type(1) a {
	padding-top:64.76%;
	background:url(../img/index/btn_action.png) no-repeat;
	background-size:cover;
}
#sub_panel1 li:nth-of-type(2) li:nth-of-type(2) a {
	padding-top:64.76%;
	background:url(../img/index/btn_talk.png) no-repeat;
	background-size:cover;
}
#sub_panel2 li:nth-of-type(1) a {
	padding-top:64.76%;
	background:url(../img/index/btn_career.png) no-repeat;
	background-size:cover;
}
.sub_panels li a:hover img {
	display:none;
}
#sub_panel2 li:nth-of-type(2) ul li:nth-of-type(1) a img {
	display:block;
}
#sub_panel2 li:nth-of-type(2) ul li:nth-of-type(2) a {
	background:#B9C3C9;
}
#sub_panel2 li:nth-of-type(2) ul li a img {
	display:none;
	height:18.33%;
}
#sub_panel2 li:nth-of-type(2) ul li:nth-of-type(2) a {
	background:#394855 url(../img/index/entry_pre.png) no-repeat center center;
	background-size:auto 18.33%;
}
#sub_panel2 li:nth-of-type(2) ul li:nth-of-type(2) a:hover {
	background:#394855 url(../img/index/entry_pre.png) no-repeat center center;
	background-size:auto 18.33%;
}



}/* eof max-width:768px */



